@ionic/core 7.5.2-dev.11697638908.1f04980a → 7.5.2-dev.11697810676.1a4f965d
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.
- package/components/checkbox.js +2 -2
- package/components/ion-accordion-group.js +1 -1
- package/components/ion-datetime.js +2 -2
- package/components/ion-fab-list.js +1 -1
- package/components/ion-fab.js +1 -1
- package/components/ion-input.js +2 -2
- package/components/ion-item-option.js +2 -2
- package/components/ion-menu.js +14 -2
- package/components/ion-modal.js +1 -1
- package/components/ion-range.js +2 -2
- package/components/ion-reorder.js +2 -2
- package/components/ion-segment.js +17 -43
- package/components/ion-select.js +2 -2
- package/components/ion-tab-button.js +2 -2
- package/components/ion-textarea.js +2 -2
- package/components/ion-title.js +1 -1
- package/components/ion-toast.js +2 -2
- package/components/ion-toggle.js +2 -2
- package/components/item.js +1 -1
- package/components/picker-internal.js +2 -2
- package/components/popover.js +2 -2
- package/components/radio.js +2 -2
- package/css/core.css.map +1 -1
- package/css/display.css.map +1 -1
- package/css/float-elements.css.map +1 -1
- package/css/global.bundle.css.map +1 -1
- package/css/ionic.bundle.css.map +1 -1
- package/css/padding.css.map +1 -1
- package/css/structure.css.map +1 -1
- package/css/text-alignment.css.map +1 -1
- package/css/text-transformation.css.map +1 -1
- package/css/typography.css.map +1 -1
- package/css/utils.bundle.css.map +1 -1
- package/dist/cjs/ion-accordion_2.cjs.entry.js +1 -1
- package/dist/cjs/ion-app_8.cjs.entry.js +1 -1
- package/dist/cjs/ion-checkbox.cjs.entry.js +2 -2
- package/dist/cjs/ion-datetime_3.cjs.entry.js +2 -2
- package/dist/cjs/ion-fab_3.cjs.entry.js +2 -2
- package/dist/cjs/ion-input.cjs.entry.js +2 -2
- package/dist/cjs/ion-item-option_3.cjs.entry.js +2 -2
- package/dist/cjs/ion-item_8.cjs.entry.js +1 -1
- package/dist/cjs/ion-menu_3.cjs.entry.js +14 -2
- package/dist/cjs/ion-modal.cjs.entry.js +1 -1
- package/dist/cjs/ion-picker-internal.cjs.entry.js +2 -2
- package/dist/cjs/ion-popover.cjs.entry.js +2 -2
- package/dist/cjs/ion-radio_2.cjs.entry.js +2 -2
- package/dist/cjs/ion-range.cjs.entry.js +2 -2
- package/dist/cjs/ion-reorder_2.cjs.entry.js +2 -2
- package/dist/cjs/ion-segment_2.cjs.entry.js +17 -43
- package/dist/cjs/ion-select_3.cjs.entry.js +2 -2
- package/dist/cjs/ion-tab-bar_2.cjs.entry.js +2 -2
- package/dist/cjs/ion-textarea.cjs.entry.js +2 -2
- package/dist/cjs/ion-toast.cjs.entry.js +2 -2
- package/dist/cjs/ion-toggle.cjs.entry.js +2 -2
- package/dist/collection/components/accordion-group/accordion-group.md.css +2 -2
- package/dist/collection/components/checkbox/checkbox.ios.css +3 -3
- package/dist/collection/components/checkbox/checkbox.md.css +3 -3
- package/dist/collection/components/datetime/datetime.ios.css +1 -1
- package/dist/collection/components/datetime/datetime.md.css +1 -1
- package/dist/collection/components/fab/fab.css +2 -2
- package/dist/collection/components/fab-list/fab-list.css +2 -2
- package/dist/collection/components/input/input.ios.css +1 -1
- package/dist/collection/components/input/input.md.css +8 -10
- package/dist/collection/components/item/item.md.css +3 -3
- package/dist/collection/components/item-option/item-option.ios.css +0 -10
- package/dist/collection/components/item-option/item-option.md.css +0 -10
- package/dist/collection/components/item-sliding/test/basic/item-sliding.e2e.js +77 -0
- package/dist/collection/components/label/label.ios.css +1 -1
- package/dist/collection/components/menu/menu.ios.css +4 -4
- package/dist/collection/components/menu/menu.js +12 -0
- package/dist/collection/components/menu/menu.md.css +4 -4
- package/dist/collection/components/modal/modal.ios.css +2 -2
- package/dist/collection/components/picker/picker.ios.css +1 -1
- package/dist/collection/components/picker/picker.md.css +1 -1
- package/dist/collection/components/picker-internal/picker-internal.ios.css +2 -2
- package/dist/collection/components/picker-internal/picker-internal.md.css +2 -2
- package/dist/collection/components/popover/popover.ios.css +4 -4
- package/dist/collection/components/popover/popover.md.css +2 -2
- package/dist/collection/components/radio/radio.ios.css +4 -4
- package/dist/collection/components/radio/radio.md.css +4 -4
- package/dist/collection/components/range/range.ios.css +1 -1
- package/dist/collection/components/range/range.md.css +1 -1
- package/dist/collection/components/reorder/reorder.ios.css +1 -34
- package/dist/collection/components/reorder/reorder.md.css +1 -34
- package/dist/collection/components/segment/segment.js +17 -43
- package/dist/collection/components/select/select.ios.css +1 -1
- package/dist/collection/components/select/select.md.css +5 -7
- package/dist/collection/components/split-pane/test/multiple/split-pane.e2e.js +31 -0
- package/dist/collection/components/tab-button/tab-button.ios.css +3 -3
- package/dist/collection/components/tab-button/tab-button.md.css +3 -3
- package/dist/collection/components/textarea/textarea.ios.css +1 -1
- package/dist/collection/components/textarea/textarea.md.css +8 -10
- package/dist/collection/components/title/title.ios.css +2 -2
- package/dist/collection/components/toast/toast.ios.css +1 -1
- package/dist/collection/components/toast/toast.md.css +1 -1
- package/dist/collection/components/toggle/toggle.ios.css +3 -3
- package/dist/collection/components/toggle/toggle.md.css +3 -3
- package/dist/docs.json +1 -1
- package/dist/esm/ion-accordion_2.entry.js +1 -1
- package/dist/esm/ion-app_8.entry.js +1 -1
- package/dist/esm/ion-checkbox.entry.js +2 -2
- package/dist/esm/ion-datetime_3.entry.js +2 -2
- package/dist/esm/ion-fab_3.entry.js +2 -2
- package/dist/esm/ion-input.entry.js +2 -2
- package/dist/esm/ion-item-option_3.entry.js +2 -2
- package/dist/esm/ion-item_8.entry.js +1 -1
- package/dist/esm/ion-menu_3.entry.js +14 -2
- package/dist/esm/ion-modal.entry.js +1 -1
- package/dist/esm/ion-picker-internal.entry.js +2 -2
- package/dist/esm/ion-popover.entry.js +2 -2
- package/dist/esm/ion-radio_2.entry.js +2 -2
- package/dist/esm/ion-range.entry.js +2 -2
- package/dist/esm/ion-reorder_2.entry.js +2 -2
- package/dist/esm/ion-segment_2.entry.js +17 -43
- package/dist/esm/ion-select_3.entry.js +2 -2
- package/dist/esm/ion-tab-bar_2.entry.js +2 -2
- package/dist/esm/ion-textarea.entry.js +2 -2
- package/dist/esm/ion-toast.entry.js +2 -2
- package/dist/esm/ion-toggle.entry.js +2 -2
- package/dist/esm-es5/ion-accordion_2.entry.js +1 -1
- package/dist/esm-es5/ion-app_8.entry.js +1 -1
- package/dist/esm-es5/ion-checkbox.entry.js +1 -1
- package/dist/esm-es5/ion-datetime_3.entry.js +1 -1
- package/dist/esm-es5/ion-fab_3.entry.js +1 -1
- package/dist/esm-es5/ion-input.entry.js +1 -1
- package/dist/esm-es5/ion-item-option_3.entry.js +1 -1
- package/dist/esm-es5/ion-item_8.entry.js +1 -1
- package/dist/esm-es5/ion-menu_3.entry.js +1 -1
- package/dist/esm-es5/ion-modal.entry.js +1 -1
- package/dist/esm-es5/ion-picker-internal.entry.js +1 -1
- package/dist/esm-es5/ion-popover.entry.js +1 -1
- package/dist/esm-es5/ion-radio_2.entry.js +1 -1
- package/dist/esm-es5/ion-range.entry.js +1 -1
- package/dist/esm-es5/ion-reorder_2.entry.js +1 -1
- package/dist/esm-es5/ion-segment_2.entry.js +1 -1
- package/dist/esm-es5/ion-select_3.entry.js +1 -1
- package/dist/esm-es5/ion-tab-bar_2.entry.js +1 -1
- package/dist/esm-es5/ion-textarea.entry.js +1 -1
- package/dist/esm-es5/ion-toast.entry.js +1 -1
- package/dist/esm-es5/ion-toggle.entry.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/{p-008331e9.system.entry.js → p-017631df.system.entry.js} +1 -1
- package/dist/ionic/{p-7eaa585f.entry.js → p-0e3b9926.entry.js} +1 -1
- package/dist/ionic/{p-818b2e75.entry.js → p-28293683.entry.js} +1 -1
- package/dist/ionic/{p-5421f83c.system.entry.js → p-2a40090a.system.entry.js} +1 -1
- package/dist/ionic/{p-c105bd36.entry.js → p-2d8caacb.entry.js} +1 -1
- package/dist/ionic/p-33e10fbe.system.entry.js +4 -0
- package/dist/ionic/{p-b96e1915.system.entry.js → p-372f1f80.system.entry.js} +1 -1
- package/dist/ionic/{p-4643c356.system.entry.js → p-3bc2289f.system.entry.js} +1 -1
- package/dist/ionic/{p-fbf836a7.system.entry.js → p-3e2ddf5e.system.entry.js} +1 -1
- package/dist/ionic/p-496a045c.entry.js +4 -0
- package/dist/ionic/{p-d35217be.entry.js → p-508b65b0.entry.js} +1 -1
- package/dist/ionic/{p-c627257b.system.entry.js → p-51ec3380.system.entry.js} +1 -1
- package/dist/ionic/{p-32ff5348.system.entry.js → p-57f074a4.system.entry.js} +1 -1
- package/dist/ionic/p-5b976d70.entry.js +4 -0
- package/dist/ionic/{p-bb055450.system.entry.js → p-5db56c84.system.entry.js} +1 -1
- package/dist/ionic/p-755b2917.system.js +1 -1
- package/dist/ionic/{p-ab5f4f93.system.entry.js → p-7d3fe69c.system.entry.js} +1 -1
- package/dist/ionic/{p-19fba51c.entry.js → p-7d58a178.entry.js} +1 -1
- package/dist/ionic/{p-1edb53a1.entry.js → p-803cd5c3.entry.js} +1 -1
- package/dist/ionic/{p-a200a7fc.entry.js → p-87c3c4ec.entry.js} +1 -1
- package/dist/ionic/{p-a9c32660.entry.js → p-8b1237b9.entry.js} +1 -1
- package/dist/ionic/p-972a3bb1.system.entry.js +4 -0
- package/dist/ionic/p-97afc3e8.system.entry.js +4 -0
- package/dist/ionic/{p-ca86ce12.system.entry.js → p-9d93e024.system.entry.js} +1 -1
- package/dist/ionic/p-a38ec116.entry.js +4 -0
- package/dist/ionic/p-a3fe2e01.entry.js +4 -0
- package/dist/ionic/{p-b92bbb58.entry.js → p-a7f83510.entry.js} +1 -1
- package/dist/ionic/{p-f7566bad.entry.js → p-ad7a92f2.entry.js} +1 -1
- package/dist/ionic/p-b0f6ef25.system.entry.js +4 -0
- package/dist/ionic/{p-0ac3fb2c.entry.js → p-b998e8eb.entry.js} +1 -1
- package/dist/ionic/p-bc08029e.system.entry.js +4 -0
- package/dist/ionic/{p-e25cb483.entry.js → p-bd68ea5d.entry.js} +1 -1
- package/dist/ionic/p-c66eb2d7.system.entry.js +4 -0
- package/dist/ionic/{p-f4309ac7.entry.js → p-c9f70283.entry.js} +1 -1
- package/dist/ionic/{p-8209372c.entry.js → p-cbc8d5c6.entry.js} +1 -1
- package/dist/ionic/{p-40a0dacf.system.entry.js → p-ce4b95a8.system.entry.js} +1 -1
- package/dist/ionic/{p-c575a7b8.system.entry.js → p-d29dcf9b.system.entry.js} +1 -1
- package/dist/ionic/{p-7980e02c.system.entry.js → p-d493004e.system.entry.js} +1 -1
- package/dist/ionic/{p-5ef80480.system.entry.js → p-db6fb00c.system.entry.js} +1 -1
- package/dist/ionic/{p-38089641.entry.js → p-ebdf4f41.entry.js} +1 -1
- package/dist/ionic/{p-e65ebe96.entry.js → p-ec186377.entry.js} +1 -1
- package/dist/ionic/p-f15c9fd3.system.entry.js +4 -0
- package/dist/ionic/{p-f5bf698b.entry.js → p-fb73095c.entry.js} +1 -1
- package/hydrate/index.js +61 -75
- package/package.json +1 -1
- package/dist/ionic/p-24b1f98a.system.entry.js +0 -4
- package/dist/ionic/p-4f97c112.entry.js +0 -4
- package/dist/ionic/p-508defac.system.entry.js +0 -4
- package/dist/ionic/p-7f8844bd.system.entry.js +0 -4
- package/dist/ionic/p-82251950.system.entry.js +0 -4
- package/dist/ionic/p-965ae1f9.system.entry.js +0 -4
- package/dist/ionic/p-a6c5ccb5.system.entry.js +0 -4
- package/dist/ionic/p-bdf1db6f.system.entry.js +0 -4
- package/dist/ionic/p-d6e53e66.entry.js +0 -4
- package/dist/ionic/p-e74faf2a.entry.js +0 -4
- package/dist/ionic/p-e86d765e.entry.js +0 -4
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import{__awaiter,__generator}from"tslib";
|
|
2
2
|
/*!
|
|
3
3
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
4
|
-
*/import{r as registerInstance,d as createEvent,h,H as Host,f as getElement}from"./index-b49b173c.js";import{f as findClosestIonContent,d as disableContentScrollY,r as resetContentScrollY}from"./index-746a238e.js";import{c as createLegacyFormController}from"./form-controller-ed77647a.js";import{l as clamp,j as debounceEvent,i as inheritAriaAttributes,d as renderHiddenInput,e as getAriaLabel}from"./helpers-3379ba19.js";import{p as printIonWarning}from"./index-595d62c9.js";import{i as isRTL}from"./dir-912e3e13.js";import{c as createColorClasses,h as hostContext}from"./theme-17531cdf.js";import{b as getIonMode}from"./ionic-global-246ca78f.js";function getDecimalPlaces(e){if(e%1===0)return 0;return e.toString().split(".")[1].length}function roundToMaxDecimalPlaces(e){var t=[];for(var r=1;r<arguments.length;r++){t[r-1]=arguments[r]}var n=Math.max.apply(Math,t.map((function(e){return getDecimalPlaces(e)})));return Number(e.toFixed(n))}var rangeIosCss=":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}@supports (inset-inline-start: 0){.range-knob-handle{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-knob-handle{left:0}:host-context([dir=rtl]) .range-knob-handle{left:unset;right:unset;right:0}[dir=rtl] .range-knob-handle{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-knob-handle:dir(rtl){left:unset;right:unset;right: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)}@supports (inset-inline-start: 0){.range-bar-container{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-bar-container{left:0}:host-context([dir=rtl]) .range-bar-container{left:unset;right:unset;right:0}[dir=rtl] .range-bar-container{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-bar-container:dir(rtl){left:unset;right:unset;right: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}@supports (inset-inline-start: 0){.range-knob{inset-inline-start:calc(50% - var(--knob-size) / 2)}}@supports not (inset-inline-start: 0){.range-knob{left:calc(50% - var(--knob-size) / 2)}:host-context([dir=rtl]) .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}[dir=rtl] .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}@supports selector(:dir(rtl)){.range-knob:dir(rtl){left:unset;right:unset;right: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;pointer-events:none;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) .label-text-wrapper:dir(rtl){-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, #e6e6e6);--bar-background-active:var(--ion-color-primary, #3880ff);--bar-border-radius:2px;--height:42px}:host(.legacy-range){-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:8px}: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, #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}";var rangeMdCss=':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}@supports (inset-inline-start: 0){.range-knob-handle{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-knob-handle{left:0}:host-context([dir=rtl]) .range-knob-handle{left:unset;right:unset;right:0}[dir=rtl] .range-knob-handle{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-knob-handle:dir(rtl){left:unset;right:unset;right: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)}@supports (inset-inline-start: 0){.range-bar-container{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-bar-container{left:0}:host-context([dir=rtl]) .range-bar-container{left:unset;right:unset;right:0}[dir=rtl] .range-bar-container{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-bar-container:dir(rtl){left:unset;right:unset;right: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}@supports (inset-inline-start: 0){.range-knob{inset-inline-start:calc(50% - var(--knob-size) / 2)}}@supports not (inset-inline-start: 0){.range-knob{left:calc(50% - var(--knob-size) / 2)}:host-context([dir=rtl]) .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}[dir=rtl] .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}@supports selector(:dir(rtl)){.range-knob:dir(rtl){left:unset;right:unset;right: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;pointer-events:none;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) .label-text-wrapper:dir(rtl){-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, 56, 128, 255), 0.26);--bar-background-active:var(--ion-color-primary, #3880ff);--bar-border-radius:0;--height:42px;--pin-background:var(--ion-color-primary, #3880ff);--pin-color:var(--ion-color-primary-contrast, #fff)}:host(.legacy-range) ::slotted([slot=label]){font-size:initial}:host(:not(.legacy-range)) ::slotted(:not(ion-icon)[slot=start]),:host(:not(.legacy-range)) ::slotted(:not(ion-icon)[slot=end]),:host(:not(.legacy-range)) .native-wrapper{font-size:0.75rem}:host(.legacy-range){-webkit-padding-start:14px;padding-inline-start:14px;-webkit-padding-end:14px;padding-inline-end:14px;padding-top:8px;padding-bottom:8px;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}@supports (inset-inline-start: 0){.range-knob::before{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-knob::before{left:0}:host-context([dir=rtl]) .range-knob::before{left:unset;right:unset;right:0}[dir=rtl] .range-knob::before{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-knob::before:dir(rtl){left:unset;right:unset;right: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}@supports (inset-inline-start: 0){.range-pin::before{inset-inline-start:50%}}@supports not (inset-inline-start: 0){.range-pin::before{left:50%}:host-context([dir=rtl]) .range-pin::before{left:unset;right:unset;right:50%}[dir=rtl] .range-pin::before{left:unset;right:unset;right:50%}@supports selector(:dir(rtl)){.range-pin::before:dir(rtl){left:unset;right:unset;right: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, #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, #bfbfbf)}:host(.range-disabled) .label-text-wrapper,:host(.range-disabled) ::slotted([slot=start]),:host(.range-disabled) ::slotted([slot=end]){opacity:0.38}';var Range=function(){function e(e){var t=this;registerInstance(this,e);this.ionChange=createEvent(this,"ionChange",7);this.ionInput=createEvent(this,"ionInput",7);this.ionStyle=createEvent(this,"ionStyle",7);this.ionFocus=createEvent(this,"ionFocus",7);this.ionBlur=createEvent(this,"ionBlur",7);this.ionKnobMoveStart=createEvent(this,"ionKnobMoveStart",7);this.ionKnobMoveEnd=createEvent(this,"ionKnobMoveEnd",7);this.rangeId="ion-r-".concat(rangeIds++);this.didLoad=false;this.noUpdate=false;this.hasFocus=false;this.inheritedAttributes={};this.contentEl=null;this.initialContentScrollY=true;this.hasLoggedDeprecationWarning=false;this.clampBounds=function(e){return clamp(t.min,e,t.max)};this.ensureValueInBounds=function(e){if(t.dualKnobs){return{lower:t.clampBounds(e.lower),upper:t.clampBounds(e.upper)}}else{return t.clampBounds(e)}};this.setupGesture=function(){return __awaiter(t,void 0,void 0,(function(){var e,t;var r=this;return __generator(this,(function(n){switch(n.label){case 0:e=this.rangeSlider;if(!e)return[3,2];t=this;return[4,import("./index-ff313b19.js")];case 1:t.gesture=n.sent().createGesture({el:e,gestureName:"range",gesturePriority:100,threshold:0,onStart:function(e){return r.onStart(e)},onMove:function(e){return r.onMove(e)},onEnd:function(e){return r.onEnd(e)}});this.gesture.enable(!this.disabled);n.label=2;case 2:return[2]}}))}))};this.handleKeyboard=function(e,r){var n=t.ensureValueInBounds;var a=t.step;a=a>0?a:1;a=a/(t.max-t.min);if(!r){a*=-1}if(e==="A"){t.ratioA=clamp(0,t.ratioA+a,1)}else{t.ratioB=clamp(0,t.ratioB+a,1)}t.ionKnobMoveStart.emit({value:n(t.value)});t.updateValue();t.emitValueChange();t.ionKnobMoveEnd.emit({value:n(t.value)})};this.onBlur=function(){if(t.hasFocus){t.hasFocus=false;t.ionBlur.emit();t.emitStyle()}};this.onFocus=function(){if(!t.hasFocus){t.hasFocus=true;t.ionFocus.emit();t.emitStyle()}};this.ratioA=0;this.ratioB=0;this.pressedKnob=undefined;this.color=undefined;this.debounce=undefined;this.name=this.rangeId;this.label=undefined;this.dualKnobs=false;this.min=0;this.max=100;this.pin=false;this.pinFormatter=function(e){return Math.round(e)};this.snaps=false;this.step=1;this.ticks=true;this.activeBarStart=undefined;this.disabled=false;this.value=0;this.labelPlacement="start";this.legacy=undefined}e.prototype.debounceChanged=function(){var e=this,t=e.ionInput,r=e.debounce,n=e.originalIonInput;this.ionInput=r===undefined?n!==null&&n!==void 0?n:t:debounceEvent(t,r)};e.prototype.minChanged=function(){if(!this.noUpdate){this.updateRatio()}};e.prototype.maxChanged=function(){if(!this.noUpdate){this.updateRatio()}};e.prototype.activeBarStartChanged=function(){var e=this.activeBarStart;if(e!==undefined){if(e>this.max){printIonWarning("Range: The value of activeBarStart (".concat(e,") is greater than the max (").concat(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}else if(e<this.min){printIonWarning("Range: The value of activeBarStart (".concat(e,") is less than the min (").concat(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}}};e.prototype.disabledChanged=function(){if(this.gesture){this.gesture.enable(!this.disabled)}this.emitStyle()};e.prototype.valueChanged=function(){if(!this.noUpdate){this.updateRatio()}};e.prototype.componentWillLoad=function(){if(this.el.hasAttribute("id")){this.rangeId=this.el.getAttribute("id")}this.inheritedAttributes=inheritAriaAttributes(this.el)};e.prototype.componentDidLoad=function(){this.originalIonInput=this.ionInput;this.setupGesture();this.updateRatio();this.didLoad=true};e.prototype.connectedCallback=function(){var e=this.el;this.legacyFormController=createLegacyFormController(e);this.updateRatio();this.debounceChanged();this.disabledChanged();this.activeBarStartChanged();if(this.didLoad){this.setupGesture()}this.contentEl=findClosestIonContent(this.el)};e.prototype.disconnectedCallback=function(){if(this.gesture){this.gesture.destroy();this.gesture=undefined}};e.prototype.getValue=function(){var e;var t=(e=this.value)!==null&&e!==void 0?e:0;if(this.dualKnobs){if(typeof t==="object"){return t}return{lower:0,upper:t}}else{if(typeof t==="object"){return t.upper}return t}};e.prototype.emitStyle=function(){if(this.legacyFormController.hasLegacyControl()){this.ionStyle.emit({interactive:true,"interactive-disabled":this.disabled})}};e.prototype.emitValueChange=function(){this.value=this.ensureValueInBounds(this.value);this.ionChange.emit({value:this.value})};e.prototype.onStart=function(e){var t=this.contentEl;if(t){this.initialContentScrollY=disableContentScrollY(t)}var r=this.rect=this.rangeSlider.getBoundingClientRect();var n=e.currentX;var a=clamp(0,(n-r.left)/r.width,1);if(isRTL(this.el)){a=1-a}this.pressedKnob=!this.dualKnobs||Math.abs(this.ratioA-a)<Math.abs(this.ratioB-a)?"A":"B";this.setFocus(this.pressedKnob);this.update(n);this.ionKnobMoveStart.emit({value:this.ensureValueInBounds(this.value)})};e.prototype.onMove=function(e){this.update(e.currentX)};e.prototype.onEnd=function(e){var t=this,r=t.contentEl,n=t.initialContentScrollY;if(r){resetContentScrollY(r,n)}this.update(e.currentX);this.pressedKnob=undefined;this.emitValueChange();this.ionKnobMoveEnd.emit({value:this.ensureValueInBounds(this.value)})};e.prototype.update=function(e){var t=this.rect;var r=clamp(0,(e-t.left)/t.width,1);if(isRTL(this.el)){r=1-r}if(this.snaps){r=valueToRatio(ratioToValue(r,this.min,this.max,this.step),this.min,this.max)}if(this.pressedKnob==="A"){this.ratioA=r}else{this.ratioB=r}this.updateValue()};Object.defineProperty(e.prototype,"valA",{get:function(){return ratioToValue(this.ratioA,this.min,this.max,this.step)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"valB",{get:function(){return ratioToValue(this.ratioB,this.min,this.max,this.step)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"ratioLower",{get:function(){if(this.dualKnobs){return Math.min(this.ratioA,this.ratioB)}var e=this.activeBarStart;if(e==null){return 0}return valueToRatio(e,this.min,this.max)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"ratioUpper",{get:function(){if(this.dualKnobs){return Math.max(this.ratioA,this.ratioB)}return this.ratioA},enumerable:false,configurable:true});e.prototype.updateRatio=function(){var e=this.getValue();var t=this,r=t.min,n=t.max;if(this.dualKnobs){this.ratioA=valueToRatio(e.lower,r,n);this.ratioB=valueToRatio(e.upper,r,n)}else{this.ratioA=valueToRatio(e,r,n)}};e.prototype.updateValue=function(){this.noUpdate=true;var e=this,t=e.valA,r=e.valB;this.value=!this.dualKnobs?t:{lower:Math.min(t,r),upper:Math.max(t,r)};this.ionInput.emit({value:this.value});this.noUpdate=false};e.prototype.setFocus=function(e){if(this.el.shadowRoot){var t=this.el.shadowRoot.querySelector(e==="A"?".range-knob-a":".range-knob-b");if(t){t.focus()}}};e.prototype.renderLegacyRange=function(){var e;if(!this.hasLoggedDeprecationWarning){printIonWarning('ion-range now requires providing a label with either the label slot or the "aria-label" attribute. To migrate, remove any usage of "ion-label" and pass the label text to either the component or the "aria-label" attribute.\n\nExample: <ion-range><div slot="label">Volume</div></ion-range>\nExample with aria-label: <ion-range aria-label="Volume"></ion-range>\n\nDevelopers can use the "legacy" property to continue using the legacy form markup. This property will be removed in an upcoming major release of Ionic where this form control will use the modern form markup.',this.el);if(this.legacy){printIonWarning('ion-range is being used with the "legacy" property enabled which will forcibly enable the legacy form markup. This property will be removed in an upcoming major release of Ionic where this form control will use the modern form markup.\n\nDevelopers can dismiss this warning by removing their usage of the "legacy" property and using the new range syntax.',this.el)}this.hasLoggedDeprecationWarning=true}var t=this,r=t.el,n=t.pressedKnob,a=t.disabled,i=t.pin,o=t.rangeId;var s=getIonMode(this);renderHiddenInput(true,r,this.name,JSON.stringify(this.getValue()),a);return h(Host,{onFocusin:this.onFocus,onFocusout:this.onBlur,id:o,class:createColorClasses(this.color,(e={},e[s]=true,e["in-item"]=hostContext("ion-item",r),e["range-disabled"]=a,e["range-pressed"]=n!==undefined,e["range-has-pin"]=i,e["legacy-range"]=true,e))},h("slot",{name:"start"}),this.renderRangeSlider(),h("slot",{name:"end"}))};Object.defineProperty(e.prototype,"hasStartSlotContent",{get:function(){return this.el.querySelector('[slot="start"]')!==null},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"hasEndSlotContent",{get:function(){return this.el.querySelector('[slot="end"]')!==null},enumerable:false,configurable:true});e.prototype.renderRange=function(){var e;var t=this,r=t.disabled,n=t.el,a=t.hasLabel,i=t.rangeId,o=t.pin,s=t.pressedKnob,l=t.labelPlacement,d=t.label;var g=hostContext("ion-item",n);var b=a&&(l==="start"||l==="fixed")||this.hasStartSlotContent;var c=g&&!b;var p=a&&l==="end"||this.hasEndSlotContent;var u=g&&!p;var f=getIonMode(this);renderHiddenInput(true,n,this.name,JSON.stringify(this.getValue()),r);return h(Host,{onFocusin:this.onFocus,onFocusout:this.onBlur,id:i,class:createColorClasses(this.color,(e={},e[f]=true,e["in-item"]=g,e["range-disabled"]=r,e["range-pressed"]=s!==undefined,e["range-has-pin"]=o,e["range-label-placement-".concat(l)]=true,e["range-item-start-adjustment"]=c,e["range-item-end-adjustment"]=u,e))},h("label",{class:"range-wrapper",id:"range-label"},h("div",{class:{"label-text-wrapper":true,"label-text-wrapper-hidden":!a}},d!==undefined?h("div",{class:"label-text"},d):h("slot",{name:"label"})),h("div",{class:"native-wrapper"},h("slot",{name:"start"}),this.renderRangeSlider(),h("slot",{name:"end"}))))};Object.defineProperty(e.prototype,"hasLabel",{get:function(){return this.label!==undefined||this.el.querySelector('[slot="label"]')!==null},enumerable:false,configurable:true});e.prototype.renderRangeSlider=function(){var e;var t=this;var r;var n=this,a=n.min,i=n.max,o=n.step,s=n.el,l=n.handleKeyboard,d=n.pressedKnob,g=n.disabled,b=n.pin,c=n.ratioLower,p=n.ratioUpper,u=n.inheritedAttributes,f=n.rangeId,m=n.pinFormatter;var k=getAriaLabel(s,f).labelText;if(k===undefined||k===null){k=u["aria-label"]}var x="".concat(c*100,"%");var v="".concat(100-p*100,"%");var w=isRTL(this.el);var y=w?"right":"left";var z=w?"left":"right";var C=function(e){var t;return t={},t[y]=e[y],t};if(this.dualKnobs===false){if(this.valA<((r=this.activeBarStart)!==null&&r!==void 0?r:this.min)){x="".concat(p*100,"%");v="".concat(100-c*100,"%")}else{x="".concat(c*100,"%");v="".concat(100-p*100,"%")}}var j=(e={},e[y]=x,e[z]=v,e);var T=[];if(this.snaps&&this.ticks){for(var I=a;I<=i;I+=o){var M=valueToRatio(I,a,i);var A=Math.min(c,p);var E=Math.max(c,p);var R={ratio:M,active:M>=A&&M<=E};R[y]="".concat(M*100,"%");T.push(R)}}var S;if(!this.legacyFormController.hasLegacyControl()&&this.hasLabel){S="range-label"}return h("div",{class:"range-slider",ref:function(e){return t.rangeSlider=e}},T.map((function(e){return h("div",{style:C(e),role:"presentation",class:{"range-tick":true,"range-tick-active":e.active},part:e.active?"tick-active":"tick"})})),h("div",{class:"range-bar-container"},h("div",{class:"range-bar",role:"presentation",part:"bar"}),h("div",{class:{"range-bar":true,"range-bar-active":true,"has-ticks":T.length>0},role:"presentation",style:j,part:"bar-active"})),renderKnob(w,{knob:"A",pressed:d==="A",value:this.valA,ratio:this.ratioA,pin:b,pinFormatter:m,disabled:g,handleKeyboard:l,min:a,max:i,labelText:k,labelledBy:S}),this.dualKnobs&&renderKnob(w,{knob:"B",pressed:d==="B",value:this.valB,ratio:this.ratioB,pin:b,pinFormatter:m,disabled:g,handleKeyboard:l,min:a,max:i,labelText:k,labelledBy:S}))};e.prototype.render=function(){var e=this.legacyFormController;return e.hasLegacyControl()?this.renderLegacyRange():this.renderRange()};Object.defineProperty(e.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{debounce:["debounceChanged"],min:["minChanged"],max:["maxChanged"],activeBarStart:["activeBarStartChanged"],disabled:["disabledChanged"],value:["valueChanged"]}},enumerable:false,configurable:true});return e}();var renderKnob=function(e,t){var r=t.knob,n=t.value,a=t.ratio,i=t.min,o=t.max,s=t.disabled,l=t.pressed,d=t.pin,g=t.handleKeyboard,b=t.labelText,c=t.labelledBy,p=t.pinFormatter;var u=e?"right":"left";var f=function(){var e={};e[u]="".concat(a*100,"%");return e};return h("div",{onKeyDown:function(e){var t=e.key;if(t==="ArrowLeft"||t==="ArrowDown"){g(r,false);e.preventDefault();e.stopPropagation()}else if(t==="ArrowRight"||t==="ArrowUp"){g(r,true);e.preventDefault();e.stopPropagation()}},class:{"range-knob-handle":true,"range-knob-a":r==="A","range-knob-b":r==="B","range-knob-pressed":l,"range-knob-min":n===i,"range-knob-max":n===o,"ion-activatable":true,"ion-focusable":true},style:f(),role:"slider",tabindex:s?-1:0,"aria-label":c===undefined?b:null,"aria-labelledby":c!==undefined?c:null,"aria-valuemin":i,"aria-valuemax":o,"aria-disabled":s?"true":null,"aria-valuenow":n},d&&h("div",{class:"range-pin",role:"presentation",part:"pin"},p(n)),h("div",{class:"range-knob",role:"presentation",part:"knob"}))};var ratioToValue=function(e,t,r,n){var a=(r-t)*e;if(n>0){a=Math.round(a/n)*n+t}var i=clamp(t,a,r);return roundToMaxDecimalPlaces(i,t,r,n)};var valueToRatio=function(e,t,r){return clamp(0,(e-t)/(r-t),1)};var rangeIds=0;Range.style={ios:rangeIosCss,md:rangeMdCss};export{Range as ion_range};
|
|
4
|
+
*/import{r as registerInstance,d as createEvent,h,H as Host,f as getElement}from"./index-b49b173c.js";import{f as findClosestIonContent,d as disableContentScrollY,r as resetContentScrollY}from"./index-746a238e.js";import{c as createLegacyFormController}from"./form-controller-ed77647a.js";import{l as clamp,j as debounceEvent,i as inheritAriaAttributes,d as renderHiddenInput,e as getAriaLabel}from"./helpers-3379ba19.js";import{p as printIonWarning}from"./index-595d62c9.js";import{i as isRTL}from"./dir-912e3e13.js";import{c as createColorClasses,h as hostContext}from"./theme-17531cdf.js";import{b as getIonMode}from"./ionic-global-246ca78f.js";function getDecimalPlaces(e){if(e%1===0)return 0;return e.toString().split(".")[1].length}function roundToMaxDecimalPlaces(e){var t=[];for(var r=1;r<arguments.length;r++){t[r-1]=arguments[r]}var n=Math.max.apply(Math,t.map((function(e){return getDecimalPlaces(e)})));return Number(e.toFixed(n))}var rangeIosCss=":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}@supports (inset-inline-start: 0){.range-knob-handle{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-knob-handle{left:0}:host-context([dir=rtl]) .range-knob-handle{left:unset;right:unset;right:0}[dir=rtl] .range-knob-handle{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-knob-handle:dir(rtl){left:unset;right:unset;right: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)}@supports (inset-inline-start: 0){.range-bar-container{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-bar-container{left:0}:host-context([dir=rtl]) .range-bar-container{left:unset;right:unset;right:0}[dir=rtl] .range-bar-container{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-bar-container:dir(rtl){left:unset;right:unset;right: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}@supports (inset-inline-start: 0){.range-knob{inset-inline-start:calc(50% - var(--knob-size) / 2)}}@supports not (inset-inline-start: 0){.range-knob{left:calc(50% - var(--knob-size) / 2)}:host-context([dir=rtl]) .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}[dir=rtl] .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}@supports selector(:dir(rtl)){.range-knob:dir(rtl){left:unset;right:unset;right: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;pointer-events:none;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, #e6e6e6);--bar-background-active:var(--ion-color-primary, #3880ff);--bar-border-radius:2px;--height:42px}:host(.legacy-range){-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:8px}: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, #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}";var rangeMdCss=':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}@supports (inset-inline-start: 0){.range-knob-handle{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-knob-handle{left:0}:host-context([dir=rtl]) .range-knob-handle{left:unset;right:unset;right:0}[dir=rtl] .range-knob-handle{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-knob-handle:dir(rtl){left:unset;right:unset;right: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)}@supports (inset-inline-start: 0){.range-bar-container{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-bar-container{left:0}:host-context([dir=rtl]) .range-bar-container{left:unset;right:unset;right:0}[dir=rtl] .range-bar-container{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-bar-container:dir(rtl){left:unset;right:unset;right: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}@supports (inset-inline-start: 0){.range-knob{inset-inline-start:calc(50% - var(--knob-size) / 2)}}@supports not (inset-inline-start: 0){.range-knob{left:calc(50% - var(--knob-size) / 2)}:host-context([dir=rtl]) .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}[dir=rtl] .range-knob{left:unset;right:unset;right:calc(50% - var(--knob-size) / 2)}@supports selector(:dir(rtl)){.range-knob:dir(rtl){left:unset;right:unset;right: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;pointer-events:none;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, 56, 128, 255), 0.26);--bar-background-active:var(--ion-color-primary, #3880ff);--bar-border-radius:0;--height:42px;--pin-background:var(--ion-color-primary, #3880ff);--pin-color:var(--ion-color-primary-contrast, #fff)}:host(.legacy-range) ::slotted([slot=label]){font-size:initial}:host(:not(.legacy-range)) ::slotted(:not(ion-icon)[slot=start]),:host(:not(.legacy-range)) ::slotted(:not(ion-icon)[slot=end]),:host(:not(.legacy-range)) .native-wrapper{font-size:0.75rem}:host(.legacy-range){-webkit-padding-start:14px;padding-inline-start:14px;-webkit-padding-end:14px;padding-inline-end:14px;padding-top:8px;padding-bottom:8px;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}@supports (inset-inline-start: 0){.range-knob::before{inset-inline-start:0}}@supports not (inset-inline-start: 0){.range-knob::before{left:0}:host-context([dir=rtl]) .range-knob::before{left:unset;right:unset;right:0}[dir=rtl] .range-knob::before{left:unset;right:unset;right:0}@supports selector(:dir(rtl)){.range-knob::before:dir(rtl){left:unset;right:unset;right: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}@supports (inset-inline-start: 0){.range-pin::before{inset-inline-start:50%}}@supports not (inset-inline-start: 0){.range-pin::before{left:50%}:host-context([dir=rtl]) .range-pin::before{left:unset;right:unset;right:50%}[dir=rtl] .range-pin::before{left:unset;right:unset;right:50%}@supports selector(:dir(rtl)){.range-pin::before:dir(rtl){left:unset;right:unset;right: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, #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, #bfbfbf)}:host(.range-disabled) .label-text-wrapper,:host(.range-disabled) ::slotted([slot=start]),:host(.range-disabled) ::slotted([slot=end]){opacity:0.38}';var Range=function(){function e(e){var t=this;registerInstance(this,e);this.ionChange=createEvent(this,"ionChange",7);this.ionInput=createEvent(this,"ionInput",7);this.ionStyle=createEvent(this,"ionStyle",7);this.ionFocus=createEvent(this,"ionFocus",7);this.ionBlur=createEvent(this,"ionBlur",7);this.ionKnobMoveStart=createEvent(this,"ionKnobMoveStart",7);this.ionKnobMoveEnd=createEvent(this,"ionKnobMoveEnd",7);this.rangeId="ion-r-".concat(rangeIds++);this.didLoad=false;this.noUpdate=false;this.hasFocus=false;this.inheritedAttributes={};this.contentEl=null;this.initialContentScrollY=true;this.hasLoggedDeprecationWarning=false;this.clampBounds=function(e){return clamp(t.min,e,t.max)};this.ensureValueInBounds=function(e){if(t.dualKnobs){return{lower:t.clampBounds(e.lower),upper:t.clampBounds(e.upper)}}else{return t.clampBounds(e)}};this.setupGesture=function(){return __awaiter(t,void 0,void 0,(function(){var e,t;var r=this;return __generator(this,(function(n){switch(n.label){case 0:e=this.rangeSlider;if(!e)return[3,2];t=this;return[4,import("./index-ff313b19.js")];case 1:t.gesture=n.sent().createGesture({el:e,gestureName:"range",gesturePriority:100,threshold:0,onStart:function(e){return r.onStart(e)},onMove:function(e){return r.onMove(e)},onEnd:function(e){return r.onEnd(e)}});this.gesture.enable(!this.disabled);n.label=2;case 2:return[2]}}))}))};this.handleKeyboard=function(e,r){var n=t.ensureValueInBounds;var a=t.step;a=a>0?a:1;a=a/(t.max-t.min);if(!r){a*=-1}if(e==="A"){t.ratioA=clamp(0,t.ratioA+a,1)}else{t.ratioB=clamp(0,t.ratioB+a,1)}t.ionKnobMoveStart.emit({value:n(t.value)});t.updateValue();t.emitValueChange();t.ionKnobMoveEnd.emit({value:n(t.value)})};this.onBlur=function(){if(t.hasFocus){t.hasFocus=false;t.ionBlur.emit();t.emitStyle()}};this.onFocus=function(){if(!t.hasFocus){t.hasFocus=true;t.ionFocus.emit();t.emitStyle()}};this.ratioA=0;this.ratioB=0;this.pressedKnob=undefined;this.color=undefined;this.debounce=undefined;this.name=this.rangeId;this.label=undefined;this.dualKnobs=false;this.min=0;this.max=100;this.pin=false;this.pinFormatter=function(e){return Math.round(e)};this.snaps=false;this.step=1;this.ticks=true;this.activeBarStart=undefined;this.disabled=false;this.value=0;this.labelPlacement="start";this.legacy=undefined}e.prototype.debounceChanged=function(){var e=this,t=e.ionInput,r=e.debounce,n=e.originalIonInput;this.ionInput=r===undefined?n!==null&&n!==void 0?n:t:debounceEvent(t,r)};e.prototype.minChanged=function(){if(!this.noUpdate){this.updateRatio()}};e.prototype.maxChanged=function(){if(!this.noUpdate){this.updateRatio()}};e.prototype.activeBarStartChanged=function(){var e=this.activeBarStart;if(e!==undefined){if(e>this.max){printIonWarning("Range: The value of activeBarStart (".concat(e,") is greater than the max (").concat(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}else if(e<this.min){printIonWarning("Range: The value of activeBarStart (".concat(e,") is less than the min (").concat(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}}};e.prototype.disabledChanged=function(){if(this.gesture){this.gesture.enable(!this.disabled)}this.emitStyle()};e.prototype.valueChanged=function(){if(!this.noUpdate){this.updateRatio()}};e.prototype.componentWillLoad=function(){if(this.el.hasAttribute("id")){this.rangeId=this.el.getAttribute("id")}this.inheritedAttributes=inheritAriaAttributes(this.el)};e.prototype.componentDidLoad=function(){this.originalIonInput=this.ionInput;this.setupGesture();this.updateRatio();this.didLoad=true};e.prototype.connectedCallback=function(){var e=this.el;this.legacyFormController=createLegacyFormController(e);this.updateRatio();this.debounceChanged();this.disabledChanged();this.activeBarStartChanged();if(this.didLoad){this.setupGesture()}this.contentEl=findClosestIonContent(this.el)};e.prototype.disconnectedCallback=function(){if(this.gesture){this.gesture.destroy();this.gesture=undefined}};e.prototype.getValue=function(){var e;var t=(e=this.value)!==null&&e!==void 0?e:0;if(this.dualKnobs){if(typeof t==="object"){return t}return{lower:0,upper:t}}else{if(typeof t==="object"){return t.upper}return t}};e.prototype.emitStyle=function(){if(this.legacyFormController.hasLegacyControl()){this.ionStyle.emit({interactive:true,"interactive-disabled":this.disabled})}};e.prototype.emitValueChange=function(){this.value=this.ensureValueInBounds(this.value);this.ionChange.emit({value:this.value})};e.prototype.onStart=function(e){var t=this.contentEl;if(t){this.initialContentScrollY=disableContentScrollY(t)}var r=this.rect=this.rangeSlider.getBoundingClientRect();var n=e.currentX;var a=clamp(0,(n-r.left)/r.width,1);if(isRTL(this.el)){a=1-a}this.pressedKnob=!this.dualKnobs||Math.abs(this.ratioA-a)<Math.abs(this.ratioB-a)?"A":"B";this.setFocus(this.pressedKnob);this.update(n);this.ionKnobMoveStart.emit({value:this.ensureValueInBounds(this.value)})};e.prototype.onMove=function(e){this.update(e.currentX)};e.prototype.onEnd=function(e){var t=this,r=t.contentEl,n=t.initialContentScrollY;if(r){resetContentScrollY(r,n)}this.update(e.currentX);this.pressedKnob=undefined;this.emitValueChange();this.ionKnobMoveEnd.emit({value:this.ensureValueInBounds(this.value)})};e.prototype.update=function(e){var t=this.rect;var r=clamp(0,(e-t.left)/t.width,1);if(isRTL(this.el)){r=1-r}if(this.snaps){r=valueToRatio(ratioToValue(r,this.min,this.max,this.step),this.min,this.max)}if(this.pressedKnob==="A"){this.ratioA=r}else{this.ratioB=r}this.updateValue()};Object.defineProperty(e.prototype,"valA",{get:function(){return ratioToValue(this.ratioA,this.min,this.max,this.step)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"valB",{get:function(){return ratioToValue(this.ratioB,this.min,this.max,this.step)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"ratioLower",{get:function(){if(this.dualKnobs){return Math.min(this.ratioA,this.ratioB)}var e=this.activeBarStart;if(e==null){return 0}return valueToRatio(e,this.min,this.max)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"ratioUpper",{get:function(){if(this.dualKnobs){return Math.max(this.ratioA,this.ratioB)}return this.ratioA},enumerable:false,configurable:true});e.prototype.updateRatio=function(){var e=this.getValue();var t=this,r=t.min,n=t.max;if(this.dualKnobs){this.ratioA=valueToRatio(e.lower,r,n);this.ratioB=valueToRatio(e.upper,r,n)}else{this.ratioA=valueToRatio(e,r,n)}};e.prototype.updateValue=function(){this.noUpdate=true;var e=this,t=e.valA,r=e.valB;this.value=!this.dualKnobs?t:{lower:Math.min(t,r),upper:Math.max(t,r)};this.ionInput.emit({value:this.value});this.noUpdate=false};e.prototype.setFocus=function(e){if(this.el.shadowRoot){var t=this.el.shadowRoot.querySelector(e==="A"?".range-knob-a":".range-knob-b");if(t){t.focus()}}};e.prototype.renderLegacyRange=function(){var e;if(!this.hasLoggedDeprecationWarning){printIonWarning('ion-range now requires providing a label with either the label slot or the "aria-label" attribute. To migrate, remove any usage of "ion-label" and pass the label text to either the component or the "aria-label" attribute.\n\nExample: <ion-range><div slot="label">Volume</div></ion-range>\nExample with aria-label: <ion-range aria-label="Volume"></ion-range>\n\nDevelopers can use the "legacy" property to continue using the legacy form markup. This property will be removed in an upcoming major release of Ionic where this form control will use the modern form markup.',this.el);if(this.legacy){printIonWarning('ion-range is being used with the "legacy" property enabled which will forcibly enable the legacy form markup. This property will be removed in an upcoming major release of Ionic where this form control will use the modern form markup.\n\nDevelopers can dismiss this warning by removing their usage of the "legacy" property and using the new range syntax.',this.el)}this.hasLoggedDeprecationWarning=true}var t=this,r=t.el,n=t.pressedKnob,a=t.disabled,i=t.pin,o=t.rangeId;var s=getIonMode(this);renderHiddenInput(true,r,this.name,JSON.stringify(this.getValue()),a);return h(Host,{onFocusin:this.onFocus,onFocusout:this.onBlur,id:o,class:createColorClasses(this.color,(e={},e[s]=true,e["in-item"]=hostContext("ion-item",r),e["range-disabled"]=a,e["range-pressed"]=n!==undefined,e["range-has-pin"]=i,e["legacy-range"]=true,e))},h("slot",{name:"start"}),this.renderRangeSlider(),h("slot",{name:"end"}))};Object.defineProperty(e.prototype,"hasStartSlotContent",{get:function(){return this.el.querySelector('[slot="start"]')!==null},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"hasEndSlotContent",{get:function(){return this.el.querySelector('[slot="end"]')!==null},enumerable:false,configurable:true});e.prototype.renderRange=function(){var e;var t=this,r=t.disabled,n=t.el,a=t.hasLabel,i=t.rangeId,o=t.pin,s=t.pressedKnob,l=t.labelPlacement,d=t.label;var g=hostContext("ion-item",n);var b=a&&(l==="start"||l==="fixed")||this.hasStartSlotContent;var c=g&&!b;var p=a&&l==="end"||this.hasEndSlotContent;var u=g&&!p;var f=getIonMode(this);renderHiddenInput(true,n,this.name,JSON.stringify(this.getValue()),r);return h(Host,{onFocusin:this.onFocus,onFocusout:this.onBlur,id:i,class:createColorClasses(this.color,(e={},e[f]=true,e["in-item"]=g,e["range-disabled"]=r,e["range-pressed"]=s!==undefined,e["range-has-pin"]=o,e["range-label-placement-".concat(l)]=true,e["range-item-start-adjustment"]=c,e["range-item-end-adjustment"]=u,e))},h("label",{class:"range-wrapper",id:"range-label"},h("div",{class:{"label-text-wrapper":true,"label-text-wrapper-hidden":!a}},d!==undefined?h("div",{class:"label-text"},d):h("slot",{name:"label"})),h("div",{class:"native-wrapper"},h("slot",{name:"start"}),this.renderRangeSlider(),h("slot",{name:"end"}))))};Object.defineProperty(e.prototype,"hasLabel",{get:function(){return this.label!==undefined||this.el.querySelector('[slot="label"]')!==null},enumerable:false,configurable:true});e.prototype.renderRangeSlider=function(){var e;var t=this;var r;var n=this,a=n.min,i=n.max,o=n.step,s=n.el,l=n.handleKeyboard,d=n.pressedKnob,g=n.disabled,b=n.pin,c=n.ratioLower,p=n.ratioUpper,u=n.inheritedAttributes,f=n.rangeId,m=n.pinFormatter;var k=getAriaLabel(s,f).labelText;if(k===undefined||k===null){k=u["aria-label"]}var x="".concat(c*100,"%");var v="".concat(100-p*100,"%");var w=isRTL(this.el);var y=w?"right":"left";var z=w?"left":"right";var C=function(e){var t;return t={},t[y]=e[y],t};if(this.dualKnobs===false){if(this.valA<((r=this.activeBarStart)!==null&&r!==void 0?r:this.min)){x="".concat(p*100,"%");v="".concat(100-c*100,"%")}else{x="".concat(c*100,"%");v="".concat(100-p*100,"%")}}var j=(e={},e[y]=x,e[z]=v,e);var T=[];if(this.snaps&&this.ticks){for(var I=a;I<=i;I+=o){var M=valueToRatio(I,a,i);var A=Math.min(c,p);var E=Math.max(c,p);var R={ratio:M,active:M>=A&&M<=E};R[y]="".concat(M*100,"%");T.push(R)}}var S;if(!this.legacyFormController.hasLegacyControl()&&this.hasLabel){S="range-label"}return h("div",{class:"range-slider",ref:function(e){return t.rangeSlider=e}},T.map((function(e){return h("div",{style:C(e),role:"presentation",class:{"range-tick":true,"range-tick-active":e.active},part:e.active?"tick-active":"tick"})})),h("div",{class:"range-bar-container"},h("div",{class:"range-bar",role:"presentation",part:"bar"}),h("div",{class:{"range-bar":true,"range-bar-active":true,"has-ticks":T.length>0},role:"presentation",style:j,part:"bar-active"})),renderKnob(w,{knob:"A",pressed:d==="A",value:this.valA,ratio:this.ratioA,pin:b,pinFormatter:m,disabled:g,handleKeyboard:l,min:a,max:i,labelText:k,labelledBy:S}),this.dualKnobs&&renderKnob(w,{knob:"B",pressed:d==="B",value:this.valB,ratio:this.ratioB,pin:b,pinFormatter:m,disabled:g,handleKeyboard:l,min:a,max:i,labelText:k,labelledBy:S}))};e.prototype.render=function(){var e=this.legacyFormController;return e.hasLegacyControl()?this.renderLegacyRange():this.renderRange()};Object.defineProperty(e.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{debounce:["debounceChanged"],min:["minChanged"],max:["maxChanged"],activeBarStart:["activeBarStartChanged"],disabled:["disabledChanged"],value:["valueChanged"]}},enumerable:false,configurable:true});return e}();var renderKnob=function(e,t){var r=t.knob,n=t.value,a=t.ratio,i=t.min,o=t.max,s=t.disabled,l=t.pressed,d=t.pin,g=t.handleKeyboard,b=t.labelText,c=t.labelledBy,p=t.pinFormatter;var u=e?"right":"left";var f=function(){var e={};e[u]="".concat(a*100,"%");return e};return h("div",{onKeyDown:function(e){var t=e.key;if(t==="ArrowLeft"||t==="ArrowDown"){g(r,false);e.preventDefault();e.stopPropagation()}else if(t==="ArrowRight"||t==="ArrowUp"){g(r,true);e.preventDefault();e.stopPropagation()}},class:{"range-knob-handle":true,"range-knob-a":r==="A","range-knob-b":r==="B","range-knob-pressed":l,"range-knob-min":n===i,"range-knob-max":n===o,"ion-activatable":true,"ion-focusable":true},style:f(),role:"slider",tabindex:s?-1:0,"aria-label":c===undefined?b:null,"aria-labelledby":c!==undefined?c:null,"aria-valuemin":i,"aria-valuemax":o,"aria-disabled":s?"true":null,"aria-valuenow":n},d&&h("div",{class:"range-pin",role:"presentation",part:"pin"},p(n)),h("div",{class:"range-knob",role:"presentation",part:"knob"}))};var ratioToValue=function(e,t,r,n){var a=(r-t)*e;if(n>0){a=Math.round(a/n)*n+t}var i=clamp(t,a,r);return roundToMaxDecimalPlaces(i,t,r,n)};var valueToRatio=function(e,t,r){return clamp(0,(e-t)/(r-t),1)};var rangeIds=0;Range.style={ios:rangeIosCss,md:rangeMdCss};export{Range as ion_range};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import{__awaiter,__generator}from"tslib";
|
|
2
2
|
/*!
|
|
3
3
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
4
|
-
*/import{r as registerInstance,h,H as Host,f as getElement,d as createEvent}from"./index-b49b173c.js";import{j as reorderThreeOutline,k as reorderTwoSharp}from"./index-c132c5f1.js";import{b as getIonMode}from"./ionic-global-246ca78f.js";import{f as findClosestIonContent,g as getScrollElement}from"./index-746a238e.js";import{r as raf}from"./helpers-3379ba19.js";import{a as hapticSelectionStart,b as hapticSelectionChanged,h as hapticSelectionEnd}from"./haptic-1243b917.js";import"./index-595d62c9.js";import"./capacitor-b4979570.js";import"./index-7a14ecec.js";var reorderIosCss=":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:
|
|
4
|
+
*/import{r as registerInstance,h,H as Host,f as getElement,d as createEvent}from"./index-b49b173c.js";import{j as reorderThreeOutline,k as reorderTwoSharp}from"./index-c132c5f1.js";import{b as getIonMode}from"./ionic-global-246ca78f.js";import{f as findClosestIonContent,g as getScrollElement}from"./index-746a238e.js";import{r as raf}from"./helpers-3379ba19.js";import{a as hapticSelectionStart,b as hapticSelectionChanged,h as hapticSelectionEnd}from"./haptic-1243b917.js";import"./index-595d62c9.js";import"./capacitor-b4979570.js";import"./index-7a14ecec.js";var reorderIosCss=":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:2.125rem;opacity:0.4}";var reorderMdCss=":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:1.9375rem;opacity:0.3}";var Reorder=function(){function r(r){registerInstance(this,r)}r.prototype.onClick=function(r){var e=this.el.closest("ion-reorder-group");r.preventDefault();if(!e||!e.disabled){r.stopImmediatePropagation()}};r.prototype.render=function(){var r=getIonMode(this);var e=r==="ios"?reorderThreeOutline:reorderTwoSharp;return h(Host,{class:r},h("slot",null,h("ion-icon",{icon:e,lazy:false,class:"reorder-icon",part:"icon","aria-hidden":"true"})))};Object.defineProperty(r.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});return r}();Reorder.style={ios:reorderIosCss,md:reorderMdCss};var reorderGroupCss=".reorder-list-active>*{display:block;-webkit-transition:-webkit-transform 300ms;transition:-webkit-transform 300ms;transition:transform 300ms;transition:transform 300ms, -webkit-transform 300ms;will-change:transform}.reorder-enabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.reorder-enabled ion-reorder{display:block;cursor:-webkit-grab;cursor:grab;pointer-events:all;-ms-touch-action:none;touch-action:none}.reorder-selected,.reorder-selected ion-reorder{cursor:-webkit-grabbing;cursor:grabbing}.reorder-selected{position:relative;-webkit-transition:none !important;transition:none !important;-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.4);box-shadow:0 0 10px rgba(0, 0, 0, 0.4);opacity:0.8;z-index:100}.reorder-visible ion-reorder .reorder-icon{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}";var ReorderGroup=function(){function r(r){registerInstance(this,r);this.ionItemReorder=createEvent(this,"ionItemReorder",7);this.lastToIndex=-1;this.cachedHeights=[];this.scrollElTop=0;this.scrollElBottom=0;this.scrollElInitial=0;this.containerTop=0;this.containerBottom=0;this.state=0;this.disabled=true}r.prototype.disabledChanged=function(){if(this.gesture){this.gesture.enable(!this.disabled)}};r.prototype.connectedCallback=function(){return __awaiter(this,void 0,void 0,(function(){var r,e,t;var i=this;return __generator(this,(function(n){switch(n.label){case 0:r=findClosestIonContent(this.el);if(!r)return[3,2];e=this;return[4,getScrollElement(r)];case 1:e.scrollEl=n.sent();n.label=2;case 2:t=this;return[4,import("./index-ff313b19.js")];case 3:t.gesture=n.sent().createGesture({el:this.el,gestureName:"reorder",gesturePriority:110,threshold:0,direction:"y",passive:false,canStart:function(r){return i.canStart(r)},onStart:function(r){return i.onStart(r)},onMove:function(r){return i.onMove(r)},onEnd:function(){return i.onEnd()}});this.disabledChanged();return[2]}}))}))};r.prototype.disconnectedCallback=function(){this.onEnd();if(this.gesture){this.gesture.destroy();this.gesture=undefined}};r.prototype.complete=function(r){return Promise.resolve(this.completeReorder(r))};r.prototype.canStart=function(r){if(this.selectedItemEl||this.state!==0){return false}var e=r.event.target;var t=e.closest("ion-reorder");if(!t){return false}var i=findReorderItem(t,this.el);if(!i){return false}r.data=i;return true};r.prototype.onStart=function(r){r.event.preventDefault();var e=this.selectedItemEl=r.data;var t=this.cachedHeights;t.length=0;var i=this.el;var n=i.children;if(!n||n.length===0){return}var o=0;for(var s=0;s<n.length;s++){var a=n[s];o+=a.offsetHeight;t.push(o);a.$ionIndex=s}var h=i.getBoundingClientRect();this.containerTop=h.top;this.containerBottom=h.bottom;if(this.scrollEl){var c=this.scrollEl.getBoundingClientRect();this.scrollElInitial=this.scrollEl.scrollTop;this.scrollElTop=c.top+AUTO_SCROLL_MARGIN;this.scrollElBottom=c.bottom-AUTO_SCROLL_MARGIN}else{this.scrollElInitial=0;this.scrollElTop=0;this.scrollElBottom=0}this.lastToIndex=indexForItem(e);this.selectedItemHeight=e.offsetHeight;this.state=1;e.classList.add(ITEM_REORDER_SELECTED);hapticSelectionStart()};r.prototype.onMove=function(r){var e=this.selectedItemEl;if(!e){return}var t=this.autoscroll(r.currentY);var i=this.containerTop-t;var n=this.containerBottom-t;var o=Math.max(i,Math.min(r.currentY,n));var s=t+o-r.startY;var a=o-i;var h=this.itemIndexForTop(a);if(h!==this.lastToIndex){var c=indexForItem(e);this.lastToIndex=h;hapticSelectionChanged();this.reorderMove(c,h)}e.style.transform="translateY(".concat(s,"px)")};r.prototype.onEnd=function(){var r=this.selectedItemEl;this.state=2;if(!r){this.state=0;return}var e=this.lastToIndex;var t=indexForItem(r);if(e===t){this.completeReorder()}else{this.ionItemReorder.emit({from:t,to:e,complete:this.completeReorder.bind(this)})}hapticSelectionEnd()};r.prototype.completeReorder=function(r){var e=this;var t=this.selectedItemEl;if(t&&this.state===2){var i=this.el.children;var n=i.length;var o=this.lastToIndex;var s=indexForItem(t);raf((function(){if(o!==s&&(r===undefined||r===true)){var a=s<o?i[o+1]:i[o];e.el.insertBefore(t,a)}for(var h=0;h<n;h++){i[h].style["transform"]=""}}));if(Array.isArray(r)){r=reorderArray(r,s,o)}t.style.transition="";t.classList.remove(ITEM_REORDER_SELECTED);this.selectedItemEl=undefined;this.state=0}return r};r.prototype.itemIndexForTop=function(r){var e=this.cachedHeights;for(var t=0;t<e.length;t++){if(e[t]>r){return t}}return e.length-1};r.prototype.reorderMove=function(r,e){var t=this.selectedItemHeight;var i=this.el.children;for(var n=0;n<i.length;n++){var o=i[n].style;var s="";if(n>r&&n<=e){s="translateY(".concat(-t,"px)")}else if(n<r&&n>=e){s="translateY(".concat(t,"px)")}o["transform"]=s}};r.prototype.autoscroll=function(r){if(!this.scrollEl){return 0}var e=0;if(r<this.scrollElTop){e=-SCROLL_JUMP}else if(r>this.scrollElBottom){e=SCROLL_JUMP}if(e!==0){this.scrollEl.scrollBy(0,e)}return this.scrollEl.scrollTop-this.scrollElInitial};r.prototype.render=function(){var r;var e=getIonMode(this);return h(Host,{class:(r={},r[e]=true,r["reorder-enabled"]=!this.disabled,r["reorder-list-active"]=this.state!==0,r)})};Object.defineProperty(r.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(r,"watchers",{get:function(){return{disabled:["disabledChanged"]}},enumerable:false,configurable:true});return r}();var indexForItem=function(r){return r["$ionIndex"]};var findReorderItem=function(r,e){var t;while(r){t=r.parentElement;if(t===e){return r}r=t}return undefined};var AUTO_SCROLL_MARGIN=60;var SCROLL_JUMP=10;var ITEM_REORDER_SELECTED="reorder-selected";var reorderArray=function(r,e,t){var i=r[e];r.splice(e,1);r.splice(t,0,i);return r.slice()};ReorderGroup.style=reorderGroupCss;export{Reorder as ion_reorder,ReorderGroup as ion_reorder_group};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import{__awaiter,__generator}from"tslib";
|
|
2
2
|
/*!
|
|
3
3
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
4
|
-
*/import{r as registerInstance,d as createEvent,w as writeTask,h,H as Host,f as getElement,i as forceUpdate}from"./index-b49b173c.js";import{r as raf,a as addEventListener,b as removeEventListener,k as inheritAttributes}from"./helpers-3379ba19.js";import{i as isRTL}from"./dir-912e3e13.js";import{c as createColorClasses,h as hostContext}from"./theme-17531cdf.js";import{b as getIonMode}from"./ionic-global-246ca78f.js";var segmentIosCss=":host{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:grid;grid-auto-columns:1fr;position:relative;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:center;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host(.segment-scrollable){-ms-flex-pack:start;justify-content:start;width:auto;overflow-x:auto;grid-auto-columns:minmax(-webkit-min-content, 1fr);grid-auto-columns:minmax(min-content, 1fr)}:host(.segment-scrollable::-webkit-scrollbar){display:none}:host{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.065);border-radius:8px;overflow:hidden;z-index:0}:host(.ion-color){background:rgba(var(--ion-color-base-rgb), 0.065)}:host(.in-toolbar){-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;width:auto}:host(.in-toolbar:not(.ion-color)){background:var(--ion-toolbar-segment-background, var(--background))}:host(.in-toolbar-color:not(.ion-color)){background:rgba(var(--ion-color-contrast-rgb), 0.11)}";var segmentMdCss=":host{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:grid;grid-auto-columns:1fr;position:relative;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:center;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host(.segment-scrollable){-ms-flex-pack:start;justify-content:start;width:auto;overflow-x:auto;grid-auto-columns:minmax(-webkit-min-content, 1fr);grid-auto-columns:minmax(min-content, 1fr)}:host(.segment-scrollable::-webkit-scrollbar){display:none}:host{--background:transparent;grid-auto-columns:minmax(auto, 360px)}:host(.in-toolbar){min-height:var(--min-height)}:host(.segment-scrollable) ::slotted(ion-segment-button){min-width:auto}";var Segment=function(){function t(t){var o=this;registerInstance(this,t);this.ionChange=createEvent(this,"ionChange",7);this.ionSelect=createEvent(this,"ionSelect",7);this.ionStyle=createEvent(this,"ionStyle",7);this.onClick=function(t){var n=t.target;var e=o.checked;if(n.tagName==="ION-SEGMENT"){return}o.value=n.value;if(n!==e){o.emitValueChange()}if(o.scrollable||!o.swipeGesture){if(e){o.checkButton(e,n)}else{o.setCheckedClasses()}}};this.getSegmentButton=function(t){var n,e;var i=o.getButtons().filter((function(t){return!t.disabled}));var r=i.findIndex((function(t){return t===document.activeElement}));switch(t){case"first":return i[0];case"last":return i[i.length-1];case"next":return(n=i[r+1])!==null&&n!==void 0?n:i[0];case"previous":return(e=i[r-1])!==null&&e!==void 0?e:i[i.length-1];default:return null}};this.activated=false;this.color=undefined;this.disabled=false;this.scrollable=false;this.swipeGesture=true;this.value=undefined;this.selectOnFocus=false}t.prototype.colorChanged=function(t,o){if(o===undefined&&t!==undefined||o!==undefined&&t===undefined){this.emitStyle()}};t.prototype.swipeGestureChanged=function(){this.gestureChanged()};t.prototype.valueChanged=function(t){this.ionSelect.emit({value:t});this.scrollActiveButtonIntoView()};t.prototype.disabledChanged=function(){this.gestureChanged();var t=this.getButtons();for(var o=0,n=t;o<n.length;o++){var e=n[o];e.disabled=this.disabled}};t.prototype.gestureChanged=function(){if(this.gesture){this.gesture.enable(!this.scrollable&&!this.disabled&&this.swipeGesture)}};t.prototype.connectedCallback=function(){this.emitStyle()};t.prototype.componentWillLoad=function(){this.emitStyle()};t.prototype.componentDidLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;var o=this;return __generator(this,(function(n){switch(n.label){case 0:this.setCheckedClasses();raf((function(){o.scrollActiveButtonIntoView(false)}));t=this;return[4,import("./index-ff313b19.js")];case 1:t.gesture=n.sent().createGesture({el:this.el,gestureName:"segment",gesturePriority:100,threshold:0,passive:false,onStart:function(t){return o.onStart(t)},onMove:function(t){return o.onMove(t)},onEnd:function(t){return o.onEnd(t)}});this.gestureChanged();if(this.disabled){this.disabledChanged()}return[2]}}))}))};t.prototype.onStart=function(t){this.valueBeforeGesture=this.value;this.activate(t)};t.prototype.onMove=function(t){this.setNextIndex(t)};t.prototype.onEnd=function(t){this.setActivated(false);this.setNextIndex(t,true);t.event.stopImmediatePropagation();var o=this.value;if(o!==undefined){if(this.valueBeforeGesture!==o){this.emitValueChange()}}this.valueBeforeGesture=undefined};t.prototype.emitValueChange=function(){var t=this.value;this.ionChange.emit({value:t})};t.prototype.getButtons=function(){return Array.from(this.el.querySelectorAll("ion-segment-button"))};Object.defineProperty(t.prototype,"checked",{get:function(){var t=this;return this.getButtons().find((function(o){return o.value===t.value}))},enumerable:false,configurable:true});t.prototype.setActivated=function(t){var o=this.getButtons();o.forEach((function(o){if(t){o.classList.add("segment-button-activated")}else{o.classList.remove("segment-button-activated")}}));this.activated=t};t.prototype.activate=function(t){var o=this;var n=t.event.target;var e=this.getButtons();var i=e.find((function(t){return t.value===o.value}));if(n.tagName!=="ION-SEGMENT-BUTTON"){return}if(!i){this.value=n.value;this.setCheckedClasses()}if(this.value===n.value){this.setActivated(true)}};t.prototype.getIndicator=function(t){var o=t.shadowRoot||t;return o.querySelector(".segment-button-indicator")};t.prototype.checkButton=function(t,o){var n=this.getIndicator(t);var e=this.getIndicator(o);if(n===null||e===null){return}var i=n.getBoundingClientRect();var r=e.getBoundingClientRect();var a=i.width/r.width;var s=i.left-r.left;var c="translate3d(".concat(s,"px, 0, 0) scaleX(").concat(a,")");writeTask((function(){e.classList.remove("segment-button-indicator-animated");e.style.setProperty("transform",c);e.getBoundingClientRect();e.classList.add("segment-button-indicator-animated");e.style.setProperty("transform","")}));this.value=o.value;this.setCheckedClasses()};t.prototype.setCheckedClasses=function(){var t=this;var o=this.getButtons();var n=o.findIndex((function(o){return o.value===t.value}));var e=n+1;for(var i=0,r=o;i<r.length;i++){var a=r[i];a.classList.remove("segment-button-after-checked")}if(e<o.length){o[e].classList.add("segment-button-after-checked")}};t.prototype.scrollActiveButtonIntoView=function(t){if(t===void 0){t=true}var o=this,n=o.scrollable,e=o.value,i=o.el;if(n){var r=this.getButtons();var a=r.find((function(t){return t.value===e}));if(a!==undefined){var s=i.getBoundingClientRect();var c=a.getBoundingClientRect();var l=c.x-s.x;var d=l-s.width/2+c.width/2;this.el.scrollBy({top:0,left:d,behavior:t?"smooth":"instant"})}}};t.prototype.setNextIndex=function(t,o){var n=this;if(o===void 0){o=false}var e=isRTL(this.el);var i=this.activated;var r=this.getButtons();var a=r.findIndex((function(t){return t.value===n.value}));var s=r[a];var c;var l;if(a===-1){return}var d=s.getBoundingClientRect();var u=d.left;var h=d.width;var b=t.currentX;var g=d.top+d.height/2;var m=this.el.getRootNode();var f=m.elementFromPoint(b,g);var v=e?b>u+h:b<u;var p=e?b<u:b>u+h;if(i&&!o){if(v){var x=a-1;if(x>=0){l=x}}else if(p){if(i&&!o){var x=a+1;if(x<r.length){l=x}}}if(l!==undefined&&!r[l].disabled){c=r[l]}}if(!i&&o){c=f}if(c!=null){if(c.tagName==="ION-SEGMENT"){return false}if(s!==c){this.checkButton(s,c)}}return true};t.prototype.emitStyle=function(){this.ionStyle.emit({segment:true})};t.prototype.onKeyDown=function(t){var o=isRTL(this.el);var n=this.selectOnFocus;var e;switch(t.key){case"ArrowRight":t.preventDefault();e=o?this.getSegmentButton("previous"):this.getSegmentButton("next");break;case"ArrowLeft":t.preventDefault();e=o?this.getSegmentButton("next"):this.getSegmentButton("previous");break;case"Home":t.preventDefault();e=this.getSegmentButton("first");break;case"End":t.preventDefault();e=this.getSegmentButton("last");break;case" ":case"Enter":t.preventDefault();e=document.activeElement;n=true}if(!e){return}if(n){var i=this.checked;this.checkButton(i||e,e);if(e!==i){this.emitValueChange()}}e.setFocus()};t.prototype.render=function(){var t;var o=getIonMode(this);return h(Host,{role:"tablist",onClick:this.onClick,class:createColorClasses(this.color,(t={},t[o]=true,t["in-toolbar"]=hostContext("ion-toolbar",this.el),t["in-toolbar-color"]=hostContext("ion-toolbar[color]",this.el),t["segment-activated"]=this.activated,t["segment-disabled"]=this.disabled,t["segment-scrollable"]=this.scrollable,t))},h("slot",null))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{color:["colorChanged"],swipeGesture:["swipeGestureChanged"],value:["valueChanged"],disabled:["disabledChanged"]}},enumerable:false,configurable:true});return t}();Segment.style={ios:segmentIosCss,md:segmentMdCss};var segmentButtonIosCss=':host{--color:initial;--color-hover:var(--color);--color-checked:var(--color);--color-disabled:var(--color);--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:column;flex-direction:column;height:auto;background:var(--background);color:var(--color);text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;grid-row:1;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;min-width:inherit;max-width:inherit;height:auto;min-height:inherit;max-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:none;outline:none;background:transparent;contain:content;pointer-events:none;overflow:hidden;z-index:2}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}:host(.segment-button-checked){background:var(--background-checked);color:var(--color-checked)}:host(.segment-button-disabled){cursor:default;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(:focus){outline:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}:host(.segment-button-checked:hover) .button-native{color:var(--color-checked)}}::slotted(ion-icon){-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:-1;order:-1;pointer-events:none}::slotted(ion-label){display:block;-ms-flex-item-align:center;align-self:center;max-width:100%;line-height:22px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;pointer-events:none}:host(.segment-button-layout-icon-top) .button-native{-ms-flex-direction:column;flex-direction:column}:host(.segment-button-layout-icon-start) .button-native{-ms-flex-direction:row;flex-direction:row}:host(.segment-button-layout-icon-end) .button-native{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.segment-button-layout-icon-bottom) .button-native{-ms-flex-direction:column-reverse;flex-direction:column-reverse}:host(.segment-button-layout-icon-hide) ::slotted(ion-icon){display:none}:host(.segment-button-layout-label-hide) ::slotted(ion-label){display:none}ion-ripple-effect{color:var(--ripple-color, var(--color-checked))}.segment-button-indicator{-webkit-transform-origin:left;transform-origin:left;position:absolute;opacity:0;-webkit-box-sizing:border-box;box-sizing:border-box;will-change:transform, opacity;pointer-events:none}.segment-button-indicator-background{width:100%;height:var(--indicator-height);-webkit-transform:var(--indicator-transform);transform:var(--indicator-transform);-webkit-box-shadow:var(--indicator-box-shadow);box-shadow:var(--indicator-box-shadow);pointer-events:none}.segment-button-indicator-animated{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}:host(.segment-button-checked) .segment-button-indicator{opacity:1}@media (prefers-reduced-motion: reduce){.segment-button-indicator-background{-webkit-transform:none;transform:none}.segment-button-indicator-animated{-webkit-transition:none;transition:none}}:host{--background:none;--background-checked:none;--background-hover:none;--background-hover-opacity:0;--background-focused:none;--background-focused-opacity:0;--border-radius:7px;--border-width:1px;--border-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.12);--border-style:solid;--indicator-box-shadow:0 0 5px rgba(0, 0, 0, 0.16);--indicator-color:var(--ion-color-step-350, var(--ion-background-color, #fff));--indicator-height:100%;--indicator-transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1);--indicator-transform:none;--transition:100ms all linear;--padding-top:0;--padding-end:13px;--padding-bottom:0;--padding-start:13px;margin-top:2px;margin-bottom:2px;position:relative;-ms-flex-direction:row;flex-direction:row;min-width:70px;min-height:28px;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);font-size:13px;font-weight:450;line-height:37px}:host::before{margin-left:0;margin-right:0;margin-top:5px;margin-bottom:5px;-webkit-transition:160ms opacity ease-in-out;transition:160ms opacity ease-in-out;-webkit-transition-delay:100ms;transition-delay:100ms;border-left:var(--border-width) var(--border-style) var(--border-color);content:"";opacity:1;will-change:opacity}:host(:first-of-type)::before{border-left-color:transparent}:host(.segment-button-disabled){opacity:0.3}::slotted(ion-icon){font-size:24px}:host(.segment-button-layout-icon-start) ::slotted(ion-label){-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:0;margin-inline-end:0}:host(.segment-button-layout-icon-end) ::slotted(ion-label){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:2px;margin-inline-end:2px}.segment-button-indicator{-webkit-padding-start:2px;padding-inline-start:2px;-webkit-padding-end:2px;padding-inline-end:2px;left:0;right:0;top:0;bottom:0}.segment-button-indicator-background{border-radius:var(--border-radius);background:var(--indicator-color)}.segment-button-indicator-background{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}:host(.segment-button-checked)::before,:host(.segment-button-after-checked)::before{opacity:0}:host(.segment-button-checked){z-index:-1}:host(.segment-button-activated){--indicator-transform:scale(0.95)}:host(.ion-focused) .button-native{opacity:0.7}@media (any-hover: hover){:host(:hover) .button-native{opacity:0.5}:host(.segment-button-checked:hover) .button-native{opacity:1}}:host(.in-segment-color){background:none;color:var(--ion-text-color, #000)}:host(.in-segment-color) .segment-button-indicator-background{background:var(--ion-color-step-350, var(--ion-background-color, #fff))}@media (any-hover: hover){:host(.in-segment-color:hover) .button-native,:host(.in-segment-color.segment-button-checked:hover) .button-native{color:var(--ion-text-color, #000)}}:host(.in-toolbar:not(.in-segment-color)){--background-checked:var(--ion-toolbar-segment-background-checked, none);--color:var(--ion-toolbar-segment-color, var(--ion-toolbar-color), initial);--color-checked:var(--ion-toolbar-segment-color-checked, var(--ion-toolbar-color), initial);--indicator-color:var(--ion-toolbar-segment-indicator-color, var(--ion-color-step-350, var(--ion-background-color, #fff)))}:host(.in-toolbar-color) .segment-button-indicator-background{background:var(--ion-color-contrast)}:host(.in-toolbar-color:not(.in-segment-color)) .button-native{color:var(--ion-color-contrast)}:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color)) .button-native{color:var(--ion-color-base)}@media (any-hover: hover){:host(.in-toolbar-color:not(.in-segment-color):hover) .button-native{color:var(--ion-color-contrast)}:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color):hover) .button-native{color:var(--ion-color-base)}}';var segmentButtonMdCss=':host{--color:initial;--color-hover:var(--color);--color-checked:var(--color);--color-disabled:var(--color);--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:column;flex-direction:column;height:auto;background:var(--background);color:var(--color);text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;grid-row:1;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;min-width:inherit;max-width:inherit;height:auto;min-height:inherit;max-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:none;outline:none;background:transparent;contain:content;pointer-events:none;overflow:hidden;z-index:2}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}:host(.segment-button-checked){background:var(--background-checked);color:var(--color-checked)}:host(.segment-button-disabled){cursor:default;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(:focus){outline:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}:host(.segment-button-checked:hover) .button-native{color:var(--color-checked)}}::slotted(ion-icon){-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:-1;order:-1;pointer-events:none}::slotted(ion-label){display:block;-ms-flex-item-align:center;align-self:center;max-width:100%;line-height:22px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;pointer-events:none}:host(.segment-button-layout-icon-top) .button-native{-ms-flex-direction:column;flex-direction:column}:host(.segment-button-layout-icon-start) .button-native{-ms-flex-direction:row;flex-direction:row}:host(.segment-button-layout-icon-end) .button-native{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.segment-button-layout-icon-bottom) .button-native{-ms-flex-direction:column-reverse;flex-direction:column-reverse}:host(.segment-button-layout-icon-hide) ::slotted(ion-icon){display:none}:host(.segment-button-layout-label-hide) ::slotted(ion-label){display:none}ion-ripple-effect{color:var(--ripple-color, var(--color-checked))}.segment-button-indicator{-webkit-transform-origin:left;transform-origin:left;position:absolute;opacity:0;-webkit-box-sizing:border-box;box-sizing:border-box;will-change:transform, opacity;pointer-events:none}.segment-button-indicator-background{width:100%;height:var(--indicator-height);-webkit-transform:var(--indicator-transform);transform:var(--indicator-transform);-webkit-box-shadow:var(--indicator-box-shadow);box-shadow:var(--indicator-box-shadow);pointer-events:none}.segment-button-indicator-animated{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}:host(.segment-button-checked) .segment-button-indicator{opacity:1}@media (prefers-reduced-motion: reduce){.segment-button-indicator-background{-webkit-transform:none;transform:none}.segment-button-indicator-animated{-webkit-transition:none;transition:none}}:host{--background:none;--background-checked:none;--background-hover:var(--color-checked);--background-focused:var(--color-checked);--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04;--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6);--color-checked:var(--ion-color-primary, #3880ff);--indicator-box-shadow:none;--indicator-color:var(--color-checked);--indicator-height:2px;--indicator-transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1);--indicator-transform:none;--padding-top:0;--padding-end:16px;--padding-bottom:0;--padding-start:16px;--transition:color 0.15s linear 0s, opacity 0.15s linear 0s;min-width:90px;min-height:48px;border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);font-size:14px;font-weight:500;letter-spacing:0.06em;line-height:40px;text-transform:uppercase}:host(.segment-button-disabled){opacity:0.3}:host(.in-segment-color){background:none;color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6)}:host(.in-segment-color) ion-ripple-effect{color:var(--ion-color-base)}:host(.in-segment-color) .segment-button-indicator-background{background:var(--ion-color-base)}:host(.in-segment-color.segment-button-checked) .button-native{color:var(--ion-color-base)}:host(.in-segment-color.ion-focused) .button-native::after{background:var(--ion-color-base)}@media (any-hover: hover){:host(.in-segment-color:hover) .button-native{color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6)}:host(.in-segment-color:hover) .button-native::after{background:var(--ion-color-base)}:host(.in-segment-color.segment-button-checked:hover) .button-native{color:var(--ion-color-base)}}:host(.in-toolbar:not(.in-segment-color)){--background:var(--ion-toolbar-segment-background, none);--background-checked:var(--ion-toolbar-segment-background-checked, none);--color:var(--ion-toolbar-segment-color, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6));--color-checked:var(--ion-toolbar-segment-color-checked, var(--ion-color-primary, #3880ff));--indicator-color:var(--ion-toolbar-segment-color-checked, var(--color-checked))}:host(.in-toolbar-color:not(.in-segment-color)) .button-native{color:rgba(var(--ion-color-contrast-rgb), 0.6)}:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color)) .button-native{color:var(--ion-color-contrast)}@media (any-hover: hover){:host(.in-toolbar-color:not(.in-segment-color)) .button-native::after{background:var(--ion-color-contrast)}}::slotted(ion-icon){margin-top:12px;margin-bottom:12px;font-size:24px}::slotted(ion-label){margin-top:12px;margin-bottom:12px}:host(.segment-button-layout-icon-top) ::slotted(ion-label),:host(.segment-button-layout-icon-bottom) ::slotted(ion-icon){margin-top:0}:host(.segment-button-layout-icon-top) ::slotted(ion-icon),:host(.segment-button-layout-icon-bottom) ::slotted(ion-label){margin-bottom:0}:host(.segment-button-layout-icon-start) ::slotted(ion-label){-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:0;margin-inline-end:0}:host(.segment-button-layout-icon-end) ::slotted(ion-label){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px}:host(.segment-button-has-icon-only) ::slotted(ion-icon){margin-top:12px;margin-bottom:12px}:host(.segment-button-has-label-only) ::slotted(ion-label){margin-top:12px;margin-bottom:12px}.segment-button-indicator{left:0;right:0;bottom:0}.segment-button-indicator-background{background:var(--indicator-color)}:host(.in-toolbar:not(.in-segment-color)) .segment-button-indicator-background{background:var(--ion-toolbar-segment-indicator-color, var(--indicator-color))}:host(.in-toolbar-color:not(.in-segment-color)) .segment-button-indicator-background{background:var(--ion-color-contrast)}';var ids=0;var SegmentButton=function(){function t(t){var o=this;registerInstance(this,t);this.segmentEl=null;this.inheritedAttributes={};this.updateStyle=function(){forceUpdate(o)};this.updateState=function(){var t=o.segmentEl;if(t){o.checked=t.value===o.value;if(t.disabled){o.disabled=true}}};this.checked=false;this.disabled=false;this.layout="icon-top";this.type="button";this.value="ion-sb-"+ids++}t.prototype.valueChanged=function(){this.updateState()};t.prototype.connectedCallback=function(){var t=this.segmentEl=this.el.closest("ion-segment");if(t){this.updateState();addEventListener(t,"ionSelect",this.updateState);addEventListener(t,"ionStyle",this.updateStyle)}};t.prototype.disconnectedCallback=function(){var t=this.segmentEl;if(t){removeEventListener(t,"ionSelect",this.updateState);removeEventListener(t,"ionStyle",this.updateStyle);this.segmentEl=null}};t.prototype.componentWillLoad=function(){this.inheritedAttributes=Object.assign({},inheritAttributes(this.el,["aria-label"]))};Object.defineProperty(t.prototype,"hasLabel",{get:function(){return!!this.el.querySelector("ion-label")},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"hasIcon",{get:function(){return!!this.el.querySelector("ion-icon")},enumerable:false,configurable:true});t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(o){t=this.nativeEl;if(t!==undefined){t.focus()}return[2]}))}))};t.prototype.render=function(){var t;var o=this;var n=this,e=n.checked,i=n.type,r=n.disabled,a=n.hasIcon,s=n.hasLabel,c=n.layout,l=n.segmentEl;var d=getIonMode(this);var u=function(){return(l===null||l===void 0?void 0:l.color)!==undefined};return h(Host,{class:(t={},t[d]=true,t["in-toolbar"]=hostContext("ion-toolbar",this.el),t["in-toolbar-color"]=hostContext("ion-toolbar[color]",this.el),t["in-segment"]=hostContext("ion-segment",this.el),t["in-segment-color"]=u(),t["segment-button-has-label"]=s,t["segment-button-has-icon"]=a,t["segment-button-has-label-only"]=s&&!a,t["segment-button-has-icon-only"]=a&&!s,t["segment-button-disabled"]=r,t["segment-button-checked"]=e,t["segment-button-layout-".concat(c)]=true,t["ion-activatable"]=true,t["ion-activatable-instant"]=true,t["ion-focusable"]=true,t)},h("button",Object.assign({"aria-selected":e?"true":"false",role:"tab",ref:function(t){return o.nativeEl=t},type:i,class:"button-native",part:"native",disabled:r},this.inheritedAttributes),h("span",{class:"button-inner"},h("slot",null)),d==="md"&&h("ion-ripple-effect",null)),h("div",{part:"indicator",class:{"segment-button-indicator":true,"segment-button-indicator-animated":true}},h("div",{part:"indicator-background",class:"segment-button-indicator-background"})))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{value:["valueChanged"]}},enumerable:false,configurable:true});return t}();SegmentButton.style={ios:segmentButtonIosCss,md:segmentButtonMdCss};export{Segment as ion_segment,SegmentButton as ion_segment_button};
|
|
4
|
+
*/import{r as registerInstance,d as createEvent,w as writeTask,h,H as Host,f as getElement,i as forceUpdate}from"./index-b49b173c.js";import{r as raf,a as addEventListener,b as removeEventListener,k as inheritAttributes}from"./helpers-3379ba19.js";import{i as isRTL}from"./dir-912e3e13.js";import{c as createColorClasses,h as hostContext}from"./theme-17531cdf.js";import{b as getIonMode}from"./ionic-global-246ca78f.js";var segmentIosCss=":host{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:grid;grid-auto-columns:1fr;position:relative;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:center;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host(.segment-scrollable){-ms-flex-pack:start;justify-content:start;width:auto;overflow-x:auto;grid-auto-columns:minmax(-webkit-min-content, 1fr);grid-auto-columns:minmax(min-content, 1fr)}:host(.segment-scrollable::-webkit-scrollbar){display:none}:host{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.065);border-radius:8px;overflow:hidden;z-index:0}:host(.ion-color){background:rgba(var(--ion-color-base-rgb), 0.065)}:host(.in-toolbar){-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;width:auto}:host(.in-toolbar:not(.ion-color)){background:var(--ion-toolbar-segment-background, var(--background))}:host(.in-toolbar-color:not(.ion-color)){background:rgba(var(--ion-color-contrast-rgb), 0.11)}";var segmentMdCss=":host{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:grid;grid-auto-columns:1fr;position:relative;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:center;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host(.segment-scrollable){-ms-flex-pack:start;justify-content:start;width:auto;overflow-x:auto;grid-auto-columns:minmax(-webkit-min-content, 1fr);grid-auto-columns:minmax(min-content, 1fr)}:host(.segment-scrollable::-webkit-scrollbar){display:none}:host{--background:transparent;grid-auto-columns:minmax(auto, 360px)}:host(.in-toolbar){min-height:var(--min-height)}:host(.segment-scrollable) ::slotted(ion-segment-button){min-width:auto}";var Segment=function(){function t(t){var o=this;registerInstance(this,t);this.ionChange=createEvent(this,"ionChange",7);this.ionSelect=createEvent(this,"ionSelect",7);this.ionStyle=createEvent(this,"ionStyle",7);this.onClick=function(t){var n=t.target;var e=o.checked;if(n.tagName==="ION-SEGMENT"){return}o.value=n.value;if(n!==e){o.emitValueChange()}if(o.scrollable||!o.swipeGesture){if(e){o.checkButton(e,n)}else{o.setCheckedClasses()}}};this.getSegmentButton=function(t){var n,e;var i=o.getButtons().filter((function(t){return!t.disabled}));var r=i.findIndex((function(t){return t===document.activeElement}));switch(t){case"first":return i[0];case"last":return i[i.length-1];case"next":return(n=i[r+1])!==null&&n!==void 0?n:i[0];case"previous":return(e=i[r-1])!==null&&e!==void 0?e:i[i.length-1];default:return null}};this.activated=false;this.color=undefined;this.disabled=false;this.scrollable=false;this.swipeGesture=true;this.value=undefined;this.selectOnFocus=false}t.prototype.colorChanged=function(t,o){if(o===undefined&&t!==undefined||o!==undefined&&t===undefined){this.emitStyle()}};t.prototype.swipeGestureChanged=function(){this.gestureChanged()};t.prototype.valueChanged=function(t){this.ionSelect.emit({value:t});this.scrollActiveButtonIntoView()};t.prototype.disabledChanged=function(){this.gestureChanged();var t=this.getButtons();for(var o=0,n=t;o<n.length;o++){var e=n[o];e.disabled=this.disabled}};t.prototype.gestureChanged=function(){if(this.gesture){this.gesture.enable(!this.scrollable&&!this.disabled&&this.swipeGesture)}};t.prototype.connectedCallback=function(){this.emitStyle()};t.prototype.componentWillLoad=function(){this.emitStyle()};t.prototype.componentDidLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t;var o=this;return __generator(this,(function(n){switch(n.label){case 0:this.setCheckedClasses();raf((function(){o.scrollActiveButtonIntoView()}));t=this;return[4,import("./index-ff313b19.js")];case 1:t.gesture=n.sent().createGesture({el:this.el,gestureName:"segment",gesturePriority:100,threshold:0,passive:false,onStart:function(t){return o.onStart(t)},onMove:function(t){return o.onMove(t)},onEnd:function(t){return o.onEnd(t)}});this.gestureChanged();if(this.disabled){this.disabledChanged()}return[2]}}))}))};t.prototype.onStart=function(t){this.valueBeforeGesture=this.value;this.activate(t)};t.prototype.onMove=function(t){this.setNextIndex(t)};t.prototype.onEnd=function(t){this.setActivated(false);this.setNextIndex(t,true);t.event.stopImmediatePropagation();var o=this.value;if(o!==undefined){if(this.valueBeforeGesture!==o){this.emitValueChange()}}this.valueBeforeGesture=undefined};t.prototype.emitValueChange=function(){var t=this.value;this.ionChange.emit({value:t})};t.prototype.getButtons=function(){return Array.from(this.el.querySelectorAll("ion-segment-button"))};Object.defineProperty(t.prototype,"checked",{get:function(){var t=this;return this.getButtons().find((function(o){return o.value===t.value}))},enumerable:false,configurable:true});t.prototype.setActivated=function(t){var o=this.getButtons();o.forEach((function(o){if(t){o.classList.add("segment-button-activated")}else{o.classList.remove("segment-button-activated")}}));this.activated=t};t.prototype.activate=function(t){var o=this;var n=t.event.target;var e=this.getButtons();var i=e.find((function(t){return t.value===o.value}));if(n.tagName!=="ION-SEGMENT-BUTTON"){return}if(!i){this.value=n.value;this.setCheckedClasses()}if(this.value===n.value){this.setActivated(true)}};t.prototype.getIndicator=function(t){var o=t.shadowRoot||t;return o.querySelector(".segment-button-indicator")};t.prototype.checkButton=function(t,o){var n=this.getIndicator(t);var e=this.getIndicator(o);if(n===null||e===null){return}var i=n.getBoundingClientRect();var r=e.getBoundingClientRect();var a=i.width/r.width;var s=i.left-r.left;var c="translate3d(".concat(s,"px, 0, 0) scaleX(").concat(a,")");writeTask((function(){e.classList.remove("segment-button-indicator-animated");e.style.setProperty("transform",c);e.getBoundingClientRect();e.classList.add("segment-button-indicator-animated");e.style.setProperty("transform","")}));this.value=o.value;this.setCheckedClasses()};t.prototype.setCheckedClasses=function(){var t=this;var o=this.getButtons();var n=o.findIndex((function(o){return o.value===t.value}));var e=n+1;for(var i=0,r=o;i<r.length;i++){var a=r[i];a.classList.remove("segment-button-after-checked")}if(e<o.length){o[e].classList.add("segment-button-after-checked")}};t.prototype.scrollActiveButtonIntoView=function(){var t=this,o=t.scrollable,n=t.value;if(o){var e=this.getButtons();var i=e.find((function(t){return t.value===n}));if(i!==undefined){i.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"})}}};t.prototype.setNextIndex=function(t,o){var n=this;if(o===void 0){o=false}var e=isRTL(this.el);var i=this.activated;var r=this.getButtons();var a=r.findIndex((function(t){return t.value===n.value}));var s=r[a];var c;var l;if(a===-1){return}var d=s.getBoundingClientRect();var u=d.left;var h=d.width;var b=t.currentX;var g=d.top+d.height/2;var m=this.el.getRootNode();var f=m.elementFromPoint(b,g);var v=e?b>u+h:b<u;var p=e?b<u:b>u+h;if(i&&!o){if(v){var x=a-1;if(x>=0){l=x}}else if(p){if(i&&!o){var x=a+1;if(x<r.length){l=x}}}if(l!==undefined&&!r[l].disabled){c=r[l]}}if(!i&&o){c=f}if(c!=null){if(c.tagName==="ION-SEGMENT"){return false}if(s!==c){this.checkButton(s,c)}}return true};t.prototype.emitStyle=function(){this.ionStyle.emit({segment:true})};t.prototype.onKeyDown=function(t){var o=isRTL(this.el);var n=this.selectOnFocus;var e;switch(t.key){case"ArrowRight":t.preventDefault();e=o?this.getSegmentButton("previous"):this.getSegmentButton("next");break;case"ArrowLeft":t.preventDefault();e=o?this.getSegmentButton("next"):this.getSegmentButton("previous");break;case"Home":t.preventDefault();e=this.getSegmentButton("first");break;case"End":t.preventDefault();e=this.getSegmentButton("last");break;case" ":case"Enter":t.preventDefault();e=document.activeElement;n=true}if(!e){return}if(n){var i=this.checked;this.checkButton(i||e,e);if(e!==i){this.emitValueChange()}}e.setFocus()};t.prototype.render=function(){var t;var o=getIonMode(this);return h(Host,{role:"tablist",onClick:this.onClick,class:createColorClasses(this.color,(t={},t[o]=true,t["in-toolbar"]=hostContext("ion-toolbar",this.el),t["in-toolbar-color"]=hostContext("ion-toolbar[color]",this.el),t["segment-activated"]=this.activated,t["segment-disabled"]=this.disabled,t["segment-scrollable"]=this.scrollable,t))},h("slot",null))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{color:["colorChanged"],swipeGesture:["swipeGestureChanged"],value:["valueChanged"],disabled:["disabledChanged"]}},enumerable:false,configurable:true});return t}();Segment.style={ios:segmentIosCss,md:segmentMdCss};var segmentButtonIosCss=':host{--color:initial;--color-hover:var(--color);--color-checked:var(--color);--color-disabled:var(--color);--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:column;flex-direction:column;height:auto;background:var(--background);color:var(--color);text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;grid-row:1;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;min-width:inherit;max-width:inherit;height:auto;min-height:inherit;max-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:none;outline:none;background:transparent;contain:content;pointer-events:none;overflow:hidden;z-index:2}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}:host(.segment-button-checked){background:var(--background-checked);color:var(--color-checked)}:host(.segment-button-disabled){cursor:default;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(:focus){outline:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}:host(.segment-button-checked:hover) .button-native{color:var(--color-checked)}}::slotted(ion-icon){-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:-1;order:-1;pointer-events:none}::slotted(ion-label){display:block;-ms-flex-item-align:center;align-self:center;max-width:100%;line-height:22px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;pointer-events:none}:host(.segment-button-layout-icon-top) .button-native{-ms-flex-direction:column;flex-direction:column}:host(.segment-button-layout-icon-start) .button-native{-ms-flex-direction:row;flex-direction:row}:host(.segment-button-layout-icon-end) .button-native{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.segment-button-layout-icon-bottom) .button-native{-ms-flex-direction:column-reverse;flex-direction:column-reverse}:host(.segment-button-layout-icon-hide) ::slotted(ion-icon){display:none}:host(.segment-button-layout-label-hide) ::slotted(ion-label){display:none}ion-ripple-effect{color:var(--ripple-color, var(--color-checked))}.segment-button-indicator{-webkit-transform-origin:left;transform-origin:left;position:absolute;opacity:0;-webkit-box-sizing:border-box;box-sizing:border-box;will-change:transform, opacity;pointer-events:none}.segment-button-indicator-background{width:100%;height:var(--indicator-height);-webkit-transform:var(--indicator-transform);transform:var(--indicator-transform);-webkit-box-shadow:var(--indicator-box-shadow);box-shadow:var(--indicator-box-shadow);pointer-events:none}.segment-button-indicator-animated{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}:host(.segment-button-checked) .segment-button-indicator{opacity:1}@media (prefers-reduced-motion: reduce){.segment-button-indicator-background{-webkit-transform:none;transform:none}.segment-button-indicator-animated{-webkit-transition:none;transition:none}}:host{--background:none;--background-checked:none;--background-hover:none;--background-hover-opacity:0;--background-focused:none;--background-focused-opacity:0;--border-radius:7px;--border-width:1px;--border-color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.12);--border-style:solid;--indicator-box-shadow:0 0 5px rgba(0, 0, 0, 0.16);--indicator-color:var(--ion-color-step-350, var(--ion-background-color, #fff));--indicator-height:100%;--indicator-transition:transform 260ms cubic-bezier(0.4, 0, 0.2, 1);--indicator-transform:none;--transition:100ms all linear;--padding-top:0;--padding-end:13px;--padding-bottom:0;--padding-start:13px;margin-top:2px;margin-bottom:2px;position:relative;-ms-flex-direction:row;flex-direction:row;min-width:70px;min-height:28px;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);font-size:13px;font-weight:450;line-height:37px}:host::before{margin-left:0;margin-right:0;margin-top:5px;margin-bottom:5px;-webkit-transition:160ms opacity ease-in-out;transition:160ms opacity ease-in-out;-webkit-transition-delay:100ms;transition-delay:100ms;border-left:var(--border-width) var(--border-style) var(--border-color);content:"";opacity:1;will-change:opacity}:host(:first-of-type)::before{border-left-color:transparent}:host(.segment-button-disabled){opacity:0.3}::slotted(ion-icon){font-size:24px}:host(.segment-button-layout-icon-start) ::slotted(ion-label){-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:0;margin-inline-end:0}:host(.segment-button-layout-icon-end) ::slotted(ion-label){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:2px;margin-inline-end:2px}.segment-button-indicator{-webkit-padding-start:2px;padding-inline-start:2px;-webkit-padding-end:2px;padding-inline-end:2px;left:0;right:0;top:0;bottom:0}.segment-button-indicator-background{border-radius:var(--border-radius);background:var(--indicator-color)}.segment-button-indicator-background{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}:host(.segment-button-checked)::before,:host(.segment-button-after-checked)::before{opacity:0}:host(.segment-button-checked){z-index:-1}:host(.segment-button-activated){--indicator-transform:scale(0.95)}:host(.ion-focused) .button-native{opacity:0.7}@media (any-hover: hover){:host(:hover) .button-native{opacity:0.5}:host(.segment-button-checked:hover) .button-native{opacity:1}}:host(.in-segment-color){background:none;color:var(--ion-text-color, #000)}:host(.in-segment-color) .segment-button-indicator-background{background:var(--ion-color-step-350, var(--ion-background-color, #fff))}@media (any-hover: hover){:host(.in-segment-color:hover) .button-native,:host(.in-segment-color.segment-button-checked:hover) .button-native{color:var(--ion-text-color, #000)}}:host(.in-toolbar:not(.in-segment-color)){--background-checked:var(--ion-toolbar-segment-background-checked, none);--color:var(--ion-toolbar-segment-color, var(--ion-toolbar-color), initial);--color-checked:var(--ion-toolbar-segment-color-checked, var(--ion-toolbar-color), initial);--indicator-color:var(--ion-toolbar-segment-indicator-color, var(--ion-color-step-350, var(--ion-background-color, #fff)))}:host(.in-toolbar-color) .segment-button-indicator-background{background:var(--ion-color-contrast)}:host(.in-toolbar-color:not(.in-segment-color)) .button-native{color:var(--ion-color-contrast)}:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color)) .button-native{color:var(--ion-color-base)}@media (any-hover: hover){:host(.in-toolbar-color:not(.in-segment-color):hover) .button-native{color:var(--ion-color-contrast)}:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color):hover) .button-native{color:var(--ion-color-base)}}';var segmentButtonMdCss=':host{--color:initial;--color-hover:var(--color);--color-checked:var(--color);--color-disabled:var(--color);--padding-start:0;--padding-end:0;--padding-top:0;--padding-bottom:0;border-radius:var(--border-radius);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:column;flex-direction:column;height:auto;background:var(--background);color:var(--color);text-decoration:none;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;grid-row:1;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);display:-ms-flexbox;display:flex;position:relative;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;min-width:inherit;max-width:inherit;height:auto;min-height:inherit;max-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:none;outline:none;background:transparent;contain:content;pointer-events:none;overflow:hidden;z-index:2}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:inherit;flex-flow:inherit;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}:host(.segment-button-checked){background:var(--background-checked);color:var(--color-checked)}:host(.segment-button-disabled){cursor:default;pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(:focus){outline:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}:host(.segment-button-checked:hover) .button-native{color:var(--color-checked)}}::slotted(ion-icon){-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:-1;order:-1;pointer-events:none}::slotted(ion-label){display:block;-ms-flex-item-align:center;align-self:center;max-width:100%;line-height:22px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;pointer-events:none}:host(.segment-button-layout-icon-top) .button-native{-ms-flex-direction:column;flex-direction:column}:host(.segment-button-layout-icon-start) .button-native{-ms-flex-direction:row;flex-direction:row}:host(.segment-button-layout-icon-end) .button-native{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.segment-button-layout-icon-bottom) .button-native{-ms-flex-direction:column-reverse;flex-direction:column-reverse}:host(.segment-button-layout-icon-hide) ::slotted(ion-icon){display:none}:host(.segment-button-layout-label-hide) ::slotted(ion-label){display:none}ion-ripple-effect{color:var(--ripple-color, var(--color-checked))}.segment-button-indicator{-webkit-transform-origin:left;transform-origin:left;position:absolute;opacity:0;-webkit-box-sizing:border-box;box-sizing:border-box;will-change:transform, opacity;pointer-events:none}.segment-button-indicator-background{width:100%;height:var(--indicator-height);-webkit-transform:var(--indicator-transform);transform:var(--indicator-transform);-webkit-box-shadow:var(--indicator-box-shadow);box-shadow:var(--indicator-box-shadow);pointer-events:none}.segment-button-indicator-animated{-webkit-transition:var(--indicator-transition);transition:var(--indicator-transition)}:host(.segment-button-checked) .segment-button-indicator{opacity:1}@media (prefers-reduced-motion: reduce){.segment-button-indicator-background{-webkit-transform:none;transform:none}.segment-button-indicator-animated{-webkit-transition:none;transition:none}}:host{--background:none;--background-checked:none;--background-hover:var(--color-checked);--background-focused:var(--color-checked);--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04;--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6);--color-checked:var(--ion-color-primary, #3880ff);--indicator-box-shadow:none;--indicator-color:var(--color-checked);--indicator-height:2px;--indicator-transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1);--indicator-transform:none;--padding-top:0;--padding-end:16px;--padding-bottom:0;--padding-start:16px;--transition:color 0.15s linear 0s, opacity 0.15s linear 0s;min-width:90px;min-height:48px;border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);font-size:14px;font-weight:500;letter-spacing:0.06em;line-height:40px;text-transform:uppercase}:host(.segment-button-disabled){opacity:0.3}:host(.in-segment-color){background:none;color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6)}:host(.in-segment-color) ion-ripple-effect{color:var(--ion-color-base)}:host(.in-segment-color) .segment-button-indicator-background{background:var(--ion-color-base)}:host(.in-segment-color.segment-button-checked) .button-native{color:var(--ion-color-base)}:host(.in-segment-color.ion-focused) .button-native::after{background:var(--ion-color-base)}@media (any-hover: hover){:host(.in-segment-color:hover) .button-native{color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6)}:host(.in-segment-color:hover) .button-native::after{background:var(--ion-color-base)}:host(.in-segment-color.segment-button-checked:hover) .button-native{color:var(--ion-color-base)}}:host(.in-toolbar:not(.in-segment-color)){--background:var(--ion-toolbar-segment-background, none);--background-checked:var(--ion-toolbar-segment-background-checked, none);--color:var(--ion-toolbar-segment-color, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.6));--color-checked:var(--ion-toolbar-segment-color-checked, var(--ion-color-primary, #3880ff));--indicator-color:var(--ion-toolbar-segment-color-checked, var(--color-checked))}:host(.in-toolbar-color:not(.in-segment-color)) .button-native{color:rgba(var(--ion-color-contrast-rgb), 0.6)}:host(.in-toolbar-color.segment-button-checked:not(.in-segment-color)) .button-native{color:var(--ion-color-contrast)}@media (any-hover: hover){:host(.in-toolbar-color:not(.in-segment-color)) .button-native::after{background:var(--ion-color-contrast)}}::slotted(ion-icon){margin-top:12px;margin-bottom:12px;font-size:24px}::slotted(ion-label){margin-top:12px;margin-bottom:12px}:host(.segment-button-layout-icon-top) ::slotted(ion-label),:host(.segment-button-layout-icon-bottom) ::slotted(ion-icon){margin-top:0}:host(.segment-button-layout-icon-top) ::slotted(ion-icon),:host(.segment-button-layout-icon-bottom) ::slotted(ion-label){margin-bottom:0}:host(.segment-button-layout-icon-start) ::slotted(ion-label){-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:0;margin-inline-end:0}:host(.segment-button-layout-icon-end) ::slotted(ion-label){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px}:host(.segment-button-has-icon-only) ::slotted(ion-icon){margin-top:12px;margin-bottom:12px}:host(.segment-button-has-label-only) ::slotted(ion-label){margin-top:12px;margin-bottom:12px}.segment-button-indicator{left:0;right:0;bottom:0}.segment-button-indicator-background{background:var(--indicator-color)}:host(.in-toolbar:not(.in-segment-color)) .segment-button-indicator-background{background:var(--ion-toolbar-segment-indicator-color, var(--indicator-color))}:host(.in-toolbar-color:not(.in-segment-color)) .segment-button-indicator-background{background:var(--ion-color-contrast)}';var ids=0;var SegmentButton=function(){function t(t){var o=this;registerInstance(this,t);this.segmentEl=null;this.inheritedAttributes={};this.updateStyle=function(){forceUpdate(o)};this.updateState=function(){var t=o.segmentEl;if(t){o.checked=t.value===o.value;if(t.disabled){o.disabled=true}}};this.checked=false;this.disabled=false;this.layout="icon-top";this.type="button";this.value="ion-sb-"+ids++}t.prototype.valueChanged=function(){this.updateState()};t.prototype.connectedCallback=function(){var t=this.segmentEl=this.el.closest("ion-segment");if(t){this.updateState();addEventListener(t,"ionSelect",this.updateState);addEventListener(t,"ionStyle",this.updateStyle)}};t.prototype.disconnectedCallback=function(){var t=this.segmentEl;if(t){removeEventListener(t,"ionSelect",this.updateState);removeEventListener(t,"ionStyle",this.updateStyle);this.segmentEl=null}};t.prototype.componentWillLoad=function(){this.inheritedAttributes=Object.assign({},inheritAttributes(this.el,["aria-label"]))};Object.defineProperty(t.prototype,"hasLabel",{get:function(){return!!this.el.querySelector("ion-label")},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"hasIcon",{get:function(){return!!this.el.querySelector("ion-icon")},enumerable:false,configurable:true});t.prototype.setFocus=function(){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(o){t=this.nativeEl;if(t!==undefined){t.focus()}return[2]}))}))};t.prototype.render=function(){var t;var o=this;var n=this,e=n.checked,i=n.type,r=n.disabled,a=n.hasIcon,s=n.hasLabel,c=n.layout,l=n.segmentEl;var d=getIonMode(this);var u=function(){return(l===null||l===void 0?void 0:l.color)!==undefined};return h(Host,{class:(t={},t[d]=true,t["in-toolbar"]=hostContext("ion-toolbar",this.el),t["in-toolbar-color"]=hostContext("ion-toolbar[color]",this.el),t["in-segment"]=hostContext("ion-segment",this.el),t["in-segment-color"]=u(),t["segment-button-has-label"]=s,t["segment-button-has-icon"]=a,t["segment-button-has-label-only"]=s&&!a,t["segment-button-has-icon-only"]=a&&!s,t["segment-button-disabled"]=r,t["segment-button-checked"]=e,t["segment-button-layout-".concat(c)]=true,t["ion-activatable"]=true,t["ion-activatable-instant"]=true,t["ion-focusable"]=true,t)},h("button",Object.assign({"aria-selected":e?"true":"false",role:"tab",ref:function(t){return o.nativeEl=t},type:i,class:"button-native",part:"native",disabled:r},this.inheritedAttributes),h("span",{class:"button-inner"},h("slot",null)),d==="md"&&h("ion-ripple-effect",null)),h("div",{part:"indicator",class:{"segment-button-indicator":true,"segment-button-indicator-animated":true}},h("div",{part:"indicator-background",class:"segment-button-indicator-background"})))};Object.defineProperty(t.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{value:["valueChanged"]}},enumerable:false,configurable:true});return t}();SegmentButton.style={ios:segmentButtonIosCss,md:segmentButtonMdCss};export{Segment as ion_segment,SegmentButton as ion_segment_button};
|