@ionic/core 8.8.7-dev.11778163906.173cadb1 → 8.8.7-dev.11778599050.191a48e3
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/ion-item-option.js +1 -1
- package/components/ion-item-sliding.js +1 -1
- package/css/ionic/bundle.ionic.css.map +1 -1
- package/css/ionic/core.ionic.css.map +1 -1
- package/css/ionic/global.bundle.ionic.css.map +1 -1
- package/css/ionic/link.ionic.css.map +1 -1
- package/css/ionic/typography.ionic.css.map +1 -1
- package/dist/cjs/ion-item-option_3.cjs.entry.js +289 -39
- package/dist/cjs/ionic.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/item-option/item-option.ionic.css +2 -2
- package/dist/collection/components/item-sliding/item-sliding.ionic.css +211 -0
- package/dist/collection/components/item-sliding/item-sliding.js +284 -38
- package/dist/collection/components/item-sliding/{item-sliding.css → item-sliding.native.css} +78 -9
- package/dist/docs.json +1 -1
- package/dist/esm/ion-item-option_3.entry.js +289 -39
- package/dist/esm/ionic.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-c2894f9e.entry.js +4 -0
- package/dist/types/components/item-sliding/item-sliding.d.ts +17 -2
- package/hydrate/index.js +290 -40
- package/hydrate/index.mjs +290 -40
- package/package.json +2 -2
- package/dist/ionic/p-b0c54b4c.entry.js +0 -4
package/hydrate/index.js
CHANGED
|
@@ -21994,7 +21994,7 @@ class ItemGroup {
|
|
|
21994
21994
|
}; }
|
|
21995
21995
|
}
|
|
21996
21996
|
|
|
21997
|
-
const itemOptionIonicCss = () => `:host{background:var(--background);color:var(--color)}.button-native{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}.button-inner{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}.horizontal-wrapper{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%}::slotted(*){-ms-flex-negative:0;flex-shrink:0}:host(.item-option-expandable){-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;pointer-events:none}:host{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-1, 1%);line-height:var(--token-font-line-height-500, var(--token-scale-500, 20px));text-decoration:none;text-transform:none}.button-native{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);height:var(--token-scale-1600, 64px)}::slotted([slot=top]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:var(--token-space-100, var(--token-scale-100, 4px))}::slotted([slot=bottom]){margin-left:0;margin-right:0;margin-top:var(--token-space-100, var(--token-scale-100, 4px));margin-bottom:0}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-end:var(--token-space-100, var(--token-scale-100, 4px));margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}::slotted(ion-icon),::slotted([slot=icon-only]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:var(--token-scale-500, 20px);min-width:initial;height:var(--token-scale-500, 20px)}:host(.item-option-round){border-radius:var(--token-border-radius-300, var(--token-scale-300, 12px))}:host(.item-option-soft){border-radius:var(--token-border-radius-200, var(--token-scale-200, 8px))}:host(.item-option-rectangular){border-radius:var(--token-border-radius-0, var(--token-scale-0, 0px))}:host(.item-option-disabled)::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:"";pointer-events:none}:host(.item-option-disabled) .button-native{opacity:1}:host(.item-option-subtle){--background:var(--ion-color-primary-subtle, var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #e9ecfc))));--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--color:var(--ion-color-primary-subtle-contrast, var(--token-text-primary, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))))}:host(.item-option-subtle.ion-color){background:var(--ion-color-subtle-base);color:var(--ion-color-subtle-contrast)}:host(.item-option-bold){--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--background-activated:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--color:var(--ion-color-primary-contrast, var(--token-text-inverse, var(--token-primitives-base-white, #ffffff)))}:host(.item-option-bold.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.item-option-
|
|
21997
|
+
const itemOptionIonicCss = () => `:host{background:var(--background);color:var(--color)}.button-native{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}.button-inner{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}.horizontal-wrapper{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%}::slotted(*){-ms-flex-negative:0;flex-shrink:0}:host(.item-option-expandable){-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;pointer-events:none}:host{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-1, 1%);line-height:var(--token-font-line-height-500, var(--token-scale-500, 20px));text-decoration:none;text-transform:none}.button-native{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);height:var(--token-scale-1600, 64px)}::slotted([slot=top]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:var(--token-space-100, var(--token-scale-100, 4px))}::slotted([slot=bottom]){margin-left:0;margin-right:0;margin-top:var(--token-space-100, var(--token-scale-100, 4px));margin-bottom:0}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-end:var(--token-space-100, var(--token-scale-100, 4px));margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}::slotted(ion-icon),::slotted([slot=icon-only]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:var(--token-scale-500, 20px);min-width:initial;height:var(--token-scale-500, 20px)}:host(.item-option-round){border-radius:var(--token-border-radius-300, var(--token-scale-300, 12px))}:host(.item-option-soft){border-radius:var(--token-border-radius-200, var(--token-scale-200, 8px))}:host(.item-option-rectangular){border-radius:var(--token-border-radius-0, var(--token-scale-0, 0px))}:host(.item-option-disabled)::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:"";pointer-events:none}:host(.item-option-disabled) .button-native{opacity:1}:host(.item-option-subtle){--background:var(--ion-color-primary-subtle, var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #e9ecfc))));--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--color:var(--ion-color-primary-subtle-contrast, var(--token-text-primary, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))))}:host(.item-option-subtle.ion-color){background:var(--ion-color-subtle-base);color:var(--ion-color-subtle-contrast)}:host(.item-option-bold){--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--background-activated:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--color:var(--ion-color-primary-contrast, var(--token-text-inverse, var(--token-primitives-base-white, #ffffff)))}:host(.item-option-bold.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.item-option-expand-threshold){-webkit-filter:brightness(0.92);filter:brightness(0.92)}`;
|
|
21998
21998
|
|
|
21999
21999
|
const itemOptionIosCss = () => `:host{background:var(--background);color:var(--color)}.button-native{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}.button-inner{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%}.horizontal-wrapper{display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%}::slotted(*){-ms-flex-negative:0;flex-shrink:0}:host(.item-option-expandable){-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;pointer-events:none}:host{--background:var(--ion-color-primary, #0054e9);--color:var(--ion-color-primary-contrast, #fff);font-family:var(--ion-font-family, inherit)}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}.button-native{-webkit-padding-start:0.7em;padding-inline-start:0.7em;-webkit-padding-end:0.7em;padding-inline-end:0.7em;padding-top:0;padding-bottom:0}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:5px;margin-inline-end:5px;margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}::slotted([slot=icon-only]){padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px;margin-top:0;margin-bottom:0;min-width:0.9em;font-size:1.8em}:host(.item-option-disabled) .button-native{opacity:0.5}:host(.item-option-expandable){-webkit-transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1);transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1)}:host{font-size:clamp(16px, 1rem, 35.2px)}:host(.ion-activated){background:var(--ion-color-primary-shade, #004acd)}:host(.ion-color.ion-activated){background:var(--ion-color-shade)}`;
|
|
22000
22000
|
|
|
@@ -22211,10 +22211,26 @@ const findCheckedOption = (node, tagName) => {
|
|
|
22211
22211
|
return options.find((o) => o.value === el.value);
|
|
22212
22212
|
};
|
|
22213
22213
|
|
|
22214
|
-
const
|
|
22214
|
+
const itemSlidingIonicCss = () => `ion-item-sliding{display:block;position:relative;width:100%;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ion-item-sliding .item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.item-sliding-closing ion-item-options{pointer-events:none}.item-sliding-active-swipe-end .item-options-end .item-option-expandable{padding-left:100%;-ms-flex-order:1;order:1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-left;transition-property:padding-left}:host-context([dir=rtl]) .item-sliding-active-swipe-end .item-options-end .item-option-expandable{-ms-flex-order:-1;order:-1}[dir=rtl] .item-sliding-active-swipe-end .item-options-end .item-option-expandable{-ms-flex-order:-1;order:-1}@supports selector(:dir(rtl)){.item-sliding-active-swipe-end .item-options-end .item-option-expandable:dir(rtl){-ms-flex-order:-1;order:-1}}.item-sliding-active-swipe-start .item-options-start .item-option-expandable{padding-right:100%;-ms-flex-order:-1;order:-1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-right;transition-property:padding-right}:host-context([dir=rtl]) .item-sliding-active-swipe-start .item-options-start .item-option-expandable{-ms-flex-order:1;order:1}[dir=rtl] .item-sliding-active-swipe-start .item-options-start .item-option-expandable{-ms-flex-order:1;order:1}@supports selector(:dir(rtl)){.item-sliding-active-swipe-start .item-options-start .item-option-expandable:dir(rtl){-ms-flex-order:1;order:1}}.item-sliding-transition-open .item{-webkit-transition:-webkit-transform var(--token-transition-time-250, 250ms) var(--token-transition-curve-smooth, cubic-bezier(0.25, 1, 0.5, 1));transition:-webkit-transform var(--token-transition-time-250, 250ms) var(--token-transition-curve-smooth, cubic-bezier(0.25, 1, 0.5, 1));transition:transform var(--token-transition-time-250, 250ms) var(--token-transition-curve-smooth, cubic-bezier(0.25, 1, 0.5, 1));transition:transform var(--token-transition-time-250, 250ms) var(--token-transition-curve-smooth, cubic-bezier(0.25, 1, 0.5, 1)), -webkit-transform var(--token-transition-time-250, 250ms) var(--token-transition-curve-smooth, cubic-bezier(0.25, 1, 0.5, 1))}.item-sliding-transition-snapback .item{-webkit-transition:-webkit-transform var(--token-transition-time-300, 300ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38));transition:-webkit-transform var(--token-transition-time-300, 300ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38));transition:transform var(--token-transition-time-300, 300ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38));transition:transform var(--token-transition-time-300, 300ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38)), -webkit-transform var(--token-transition-time-300, 300ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38))}.item-sliding-confirm-item-in .item{-webkit-transition:-webkit-transform var(--token-transition-time-150, 150ms) var(--token-transition-curve-base, cubic-bezier(0.4, 0, 1, 1));transition:-webkit-transform var(--token-transition-time-150, 150ms) var(--token-transition-curve-base, cubic-bezier(0.4, 0, 1, 1));transition:transform var(--token-transition-time-150, 150ms) var(--token-transition-curve-base, cubic-bezier(0.4, 0, 1, 1));transition:transform var(--token-transition-time-150, 150ms) var(--token-transition-curve-base, cubic-bezier(0.4, 0, 1, 1)), -webkit-transform var(--token-transition-time-150, 150ms) var(--token-transition-curve-base, cubic-bezier(0.4, 0, 1, 1))}.item-sliding-confirm-item-back .item{-webkit-transition:-webkit-transform var(--token-transition-time-500, 500ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38));transition:-webkit-transform var(--token-transition-time-500, 500ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38));transition:transform var(--token-transition-time-500, 500ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38));transition:transform var(--token-transition-time-500, 500ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38)), -webkit-transform var(--token-transition-time-500, 500ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38))}ion-item-option.item-sliding-expandable-width-in{-webkit-transition:width var(--token-transition-time-150, 150ms) var(--token-transition-curve-base, cubic-bezier(0.4, 0, 1, 1));transition:width var(--token-transition-time-150, 150ms) var(--token-transition-curve-base, cubic-bezier(0.4, 0, 1, 1))}ion-item-option.item-sliding-expandable-width-back{-webkit-transition:width var(--token-transition-time-500, 500ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38));transition:width var(--token-transition-time-500, 500ms) var(--token-transition-curve-bounce, cubic-bezier(0.47, 0, 0.23, 1.38))}.item-sliding-active-slide .item{position:relative;opacity:1;z-index:var(--token-z-index-100, 100);pointer-events:none;will-change:transform}`;
|
|
22215
|
+
|
|
22216
|
+
const iosItemSlidingNativeCss = () => `ion-item-sliding{display:block;position:relative;width:100%;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ion-item-sliding .item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.item-sliding-closing ion-item-options{pointer-events:none}.item-sliding-active-swipe-end .item-options-end .item-option-expandable{padding-left:100%;-ms-flex-order:1;order:1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-left;transition-property:padding-left}:host-context([dir=rtl]) .item-sliding-active-swipe-end .item-options-end .item-option-expandable{-ms-flex-order:-1;order:-1}[dir=rtl] .item-sliding-active-swipe-end .item-options-end .item-option-expandable{-ms-flex-order:-1;order:-1}@supports selector(:dir(rtl)){.item-sliding-active-swipe-end .item-options-end .item-option-expandable:dir(rtl){-ms-flex-order:-1;order:-1}}.item-sliding-active-swipe-start .item-options-start .item-option-expandable{padding-right:100%;-ms-flex-order:-1;order:-1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-right;transition-property:padding-right}:host-context([dir=rtl]) .item-sliding-active-swipe-start .item-options-start .item-option-expandable{-ms-flex-order:1;order:1}[dir=rtl] .item-sliding-active-swipe-start .item-options-start .item-option-expandable{-ms-flex-order:1;order:1}@supports selector(:dir(rtl)){.item-sliding-active-swipe-start .item-options-start .item-option-expandable:dir(rtl){-ms-flex-order:1;order:1}}.item-sliding-active-slide .item{position:relative;-webkit-transition:-webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:-webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1), -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);opacity:1;z-index:2;pointer-events:none;will-change:transform}.item-sliding-active-slide.item-sliding-full-swipe-transition .item{-webkit-transition:-webkit-transform 250ms ease-out;transition:-webkit-transform 250ms ease-out;transition:transform 250ms ease-out;transition:transform 250ms ease-out, -webkit-transform 250ms ease-out}.item-sliding-active-slide.item-sliding-dragging .item{-webkit-transition:none;transition:none}`;
|
|
22217
|
+
|
|
22218
|
+
const mdItemSlidingNativeCss = () => `ion-item-sliding{display:block;position:relative;width:100%;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ion-item-sliding .item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.item-sliding-closing ion-item-options{pointer-events:none}.item-sliding-active-swipe-end .item-options-end .item-option-expandable{padding-left:100%;-ms-flex-order:1;order:1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-left;transition-property:padding-left}:host-context([dir=rtl]) .item-sliding-active-swipe-end .item-options-end .item-option-expandable{-ms-flex-order:-1;order:-1}[dir=rtl] .item-sliding-active-swipe-end .item-options-end .item-option-expandable{-ms-flex-order:-1;order:-1}@supports selector(:dir(rtl)){.item-sliding-active-swipe-end .item-options-end .item-option-expandable:dir(rtl){-ms-flex-order:-1;order:-1}}.item-sliding-active-swipe-start .item-options-start .item-option-expandable{padding-right:100%;-ms-flex-order:-1;order:-1;-webkit-transition-duration:0.6s;transition-duration:0.6s;-webkit-transition-property:padding-right;transition-property:padding-right}:host-context([dir=rtl]) .item-sliding-active-swipe-start .item-options-start .item-option-expandable{-ms-flex-order:1;order:1}[dir=rtl] .item-sliding-active-swipe-start .item-options-start .item-option-expandable{-ms-flex-order:1;order:1}@supports selector(:dir(rtl)){.item-sliding-active-swipe-start .item-options-start .item-option-expandable:dir(rtl){-ms-flex-order:1;order:1}}.item-sliding-active-slide .item{position:relative;-webkit-transition:-webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:-webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);transition:transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1), -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);opacity:1;z-index:2;pointer-events:none;will-change:transform}.item-sliding-active-slide.item-sliding-full-swipe-transition .item{-webkit-transition:-webkit-transform 250ms ease-out;transition:-webkit-transform 250ms ease-out;transition:transform 250ms ease-out;transition:transform 250ms ease-out, -webkit-transform 250ms ease-out}.item-sliding-active-slide.item-sliding-dragging .item{-webkit-transition:none;transition:none}`;
|
|
22215
22219
|
|
|
22216
22220
|
const SWIPE_MARGIN = 30;
|
|
22217
22221
|
const ELASTIC_FACTOR = 0.55;
|
|
22222
|
+
const IONIC_ELASTIC_FACTOR = 0.15;
|
|
22223
|
+
const IONIC_SNAP_OPEN_RATIO = 0.4;
|
|
22224
|
+
const IONIC_EXPAND_TRIGGER = 40;
|
|
22225
|
+
const IONIC_FULL_SWIPE_VELOCITY_THRESHOLD = 400;
|
|
22226
|
+
const IONIC_OPEN_VELOCITY_THRESHOLD = 200;
|
|
22227
|
+
const IONIC_ACTION_BASE_WIDTH = 64;
|
|
22228
|
+
const IONIC_CONFIRM_PAUSE = 300;
|
|
22229
|
+
const FULL_SWIPE_TRANSITION_MS = 250;
|
|
22230
|
+
const IONIC_EXPAND_RESISTANCE_FACTOR = 0.95;
|
|
22231
|
+
/** Expandable, non-disabled option (matches item-option expandable class). */
|
|
22232
|
+
const EXPANDABLE_OPTION_SELECTOR = 'ion-item-option.item-option-expandable:not(.item-option-disabled)';
|
|
22233
|
+
const ITEM_OPTION_EXPAND_THRESHOLD_CLASS = 'item-option-expand-threshold';
|
|
22218
22234
|
let openSlidingItem;
|
|
22219
22235
|
/**
|
|
22220
22236
|
* @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
|
|
@@ -22233,12 +22249,17 @@ class ItemSliding {
|
|
|
22233
22249
|
this.optsDirty = true;
|
|
22234
22250
|
this.contentEl = null;
|
|
22235
22251
|
this.initialContentScrollY = true;
|
|
22252
|
+
this.leftExpandableBaseWidth = IONIC_ACTION_BASE_WIDTH;
|
|
22253
|
+
this.rightExpandableBaseWidth = IONIC_ACTION_BASE_WIDTH;
|
|
22236
22254
|
this.state = 2 /* SlidingState.Disabled */;
|
|
22237
22255
|
/**
|
|
22238
22256
|
* If `true`, the user cannot interact with the sliding item.
|
|
22239
22257
|
*/
|
|
22240
22258
|
this.disabled = false;
|
|
22241
22259
|
}
|
|
22260
|
+
isIonicTheme() {
|
|
22261
|
+
return getIonTheme(this) === 'ionic';
|
|
22262
|
+
}
|
|
22242
22263
|
disabledChanged() {
|
|
22243
22264
|
if (this.gesture) {
|
|
22244
22265
|
this.gesture.enable(!this.disabled);
|
|
@@ -22438,7 +22459,7 @@ class ItemSliding {
|
|
|
22438
22459
|
if (!this.item) {
|
|
22439
22460
|
return resolve();
|
|
22440
22461
|
}
|
|
22441
|
-
this.
|
|
22462
|
+
this.el.classList.add('item-sliding-full-swipe-transition');
|
|
22442
22463
|
this.item.style.transform = `translate3d(${-position}px, 0, 0)`;
|
|
22443
22464
|
const id = setTimeout(resolve, duration);
|
|
22444
22465
|
signal.addEventListener('abort', () => {
|
|
@@ -22456,8 +22477,8 @@ class ItemSliding {
|
|
|
22456
22477
|
return maxWidth + SWIPE_MARGIN;
|
|
22457
22478
|
}
|
|
22458
22479
|
/**
|
|
22459
|
-
*
|
|
22460
|
-
*
|
|
22480
|
+
* Native (ios/md) full swipe: off-screen → fire swipe → return.
|
|
22481
|
+
* Ionic theme uses `animateIonicFullSwipe` instead (see `onEndIonic`).
|
|
22461
22482
|
*/
|
|
22462
22483
|
async animateFullSwipe(direction) {
|
|
22463
22484
|
const abortController = new AbortController();
|
|
@@ -22479,7 +22500,7 @@ class ItemSliding {
|
|
|
22479
22500
|
await this.delay(100, signal);
|
|
22480
22501
|
// Animate off-screen while maintaining the expanded state
|
|
22481
22502
|
const offScreenDistance = direction === 'end' ? window.innerWidth : -window.innerWidth;
|
|
22482
|
-
await this.animateToPosition(offScreenDistance,
|
|
22503
|
+
await this.animateToPosition(offScreenDistance, FULL_SWIPE_TRANSITION_MS, signal);
|
|
22483
22504
|
// Trigger action
|
|
22484
22505
|
if (options) {
|
|
22485
22506
|
options.fireSwipeEvent();
|
|
@@ -22487,7 +22508,7 @@ class ItemSliding {
|
|
|
22487
22508
|
// Small delay before returning
|
|
22488
22509
|
await this.delay(300, signal);
|
|
22489
22510
|
// Return to closed state
|
|
22490
|
-
await this.animateToPosition(0,
|
|
22511
|
+
await this.animateToPosition(0, FULL_SWIPE_TRANSITION_MS, signal);
|
|
22491
22512
|
}
|
|
22492
22513
|
catch (_a) {
|
|
22493
22514
|
// Animation was aborted (e.g. component disconnected). finally handles cleanup.
|
|
@@ -22495,8 +22516,8 @@ class ItemSliding {
|
|
|
22495
22516
|
finally {
|
|
22496
22517
|
this.animationAbortController = undefined;
|
|
22497
22518
|
// Reset state
|
|
22519
|
+
this.el.classList.remove('item-sliding-full-swipe-transition');
|
|
22498
22520
|
if (this.item) {
|
|
22499
|
-
this.item.style.transition = '';
|
|
22500
22521
|
this.item.style.transform = '';
|
|
22501
22522
|
}
|
|
22502
22523
|
this.openAmount = 0;
|
|
@@ -22509,6 +22530,160 @@ class ItemSliding {
|
|
|
22509
22530
|
}
|
|
22510
22531
|
}
|
|
22511
22532
|
}
|
|
22533
|
+
queryExpandableOption(options) {
|
|
22534
|
+
if (!options) {
|
|
22535
|
+
return undefined;
|
|
22536
|
+
}
|
|
22537
|
+
const expandableOptions = Array.from(options.querySelectorAll(EXPANDABLE_OPTION_SELECTOR));
|
|
22538
|
+
if (expandableOptions.length === 0) {
|
|
22539
|
+
return undefined;
|
|
22540
|
+
}
|
|
22541
|
+
if (expandableOptions.length === 1) {
|
|
22542
|
+
return expandableOptions[0];
|
|
22543
|
+
}
|
|
22544
|
+
const isRTL = document.dir === 'rtl';
|
|
22545
|
+
const isEndSide = options.classList.contains('item-options-end');
|
|
22546
|
+
// Match native edge behavior for multi-expandable configs
|
|
22547
|
+
const pickLast = (isEndSide && !isRTL) || (!isEndSide && isRTL);
|
|
22548
|
+
return pickLast ? expandableOptions[expandableOptions.length - 1] : expandableOptions[0];
|
|
22549
|
+
}
|
|
22550
|
+
getExpandableOption(direction) {
|
|
22551
|
+
return this.queryExpandableOption(direction === 'end' ? this.rightOptions : this.leftOptions);
|
|
22552
|
+
}
|
|
22553
|
+
getOpenDirectionFromAmount(openAmount) {
|
|
22554
|
+
if (openAmount > 0) {
|
|
22555
|
+
return 'end';
|
|
22556
|
+
}
|
|
22557
|
+
if (openAmount < 0) {
|
|
22558
|
+
return 'start';
|
|
22559
|
+
}
|
|
22560
|
+
return undefined;
|
|
22561
|
+
}
|
|
22562
|
+
getOptionsWidthForDirection(direction) {
|
|
22563
|
+
return direction === 'end' ? this.optsWidthRightSide : this.optsWidthLeftSide;
|
|
22564
|
+
}
|
|
22565
|
+
getExpandableBaseWidth(direction) {
|
|
22566
|
+
return direction === 'end' ? this.rightExpandableBaseWidth : this.leftExpandableBaseWidth;
|
|
22567
|
+
}
|
|
22568
|
+
setIonicExpandableWidth(direction, width) {
|
|
22569
|
+
const expandableOption = this.getExpandableOption(direction);
|
|
22570
|
+
if (!expandableOption) {
|
|
22571
|
+
return;
|
|
22572
|
+
}
|
|
22573
|
+
const style = expandableOption.style;
|
|
22574
|
+
const baseWidth = this.getExpandableBaseWidth(direction);
|
|
22575
|
+
style.width = `${Math.max(baseWidth, width)}px`;
|
|
22576
|
+
}
|
|
22577
|
+
resetIonicExpandableOptions() {
|
|
22578
|
+
[this.leftOptions, this.rightOptions].forEach((options) => {
|
|
22579
|
+
if (!options) {
|
|
22580
|
+
return;
|
|
22581
|
+
}
|
|
22582
|
+
options.querySelectorAll(EXPANDABLE_OPTION_SELECTOR).forEach((node) => {
|
|
22583
|
+
node.classList.remove(ITEM_OPTION_EXPAND_THRESHOLD_CLASS);
|
|
22584
|
+
});
|
|
22585
|
+
const expandableOption = this.queryExpandableOption(options);
|
|
22586
|
+
if (!expandableOption) {
|
|
22587
|
+
return;
|
|
22588
|
+
}
|
|
22589
|
+
expandableOption.style.width = '';
|
|
22590
|
+
expandableOption.classList.remove('item-sliding-expandable-open', 'item-sliding-expandable-snapback', 'item-sliding-expandable-width-in', 'item-sliding-expandable-width-back');
|
|
22591
|
+
});
|
|
22592
|
+
}
|
|
22593
|
+
updateIonicExpandableFromOpenAmount(openAmount, isFinal, previousOpenAmount) {
|
|
22594
|
+
var _a;
|
|
22595
|
+
if ((this.state & 128 /* SlidingState.AnimatingFullSwipe */) !== 0) {
|
|
22596
|
+
return;
|
|
22597
|
+
}
|
|
22598
|
+
const direction = this.getOpenDirectionFromAmount(openAmount);
|
|
22599
|
+
if (direction === undefined) {
|
|
22600
|
+
const previousDirection = this.getOpenDirectionFromAmount(previousOpenAmount);
|
|
22601
|
+
if (previousDirection === undefined) {
|
|
22602
|
+
this.resetIonicExpandableOptions();
|
|
22603
|
+
return;
|
|
22604
|
+
}
|
|
22605
|
+
(_a = this.queryExpandableOption(previousDirection === 'end' ? this.rightOptions : this.leftOptions)) === null || _a === void 0 ? void 0 : _a.classList.remove(ITEM_OPTION_EXPAND_THRESHOLD_CLASS);
|
|
22606
|
+
this.setIonicExpandableWidth(previousDirection, this.getExpandableBaseWidth(previousDirection));
|
|
22607
|
+
return;
|
|
22608
|
+
}
|
|
22609
|
+
const baseWidth = this.getExpandableBaseWidth(direction);
|
|
22610
|
+
const optionsWidth = this.getOptionsWidthForDirection(direction);
|
|
22611
|
+
const extraWidth = Math.max(0, Math.abs(openAmount) - optionsWidth);
|
|
22612
|
+
const resistedExtraWidth = isFinal ? extraWidth : extraWidth * IONIC_EXPAND_RESISTANCE_FACTOR;
|
|
22613
|
+
const targetWidth = baseWidth + resistedExtraWidth;
|
|
22614
|
+
const expandableOption = this.getExpandableOption(direction);
|
|
22615
|
+
if (expandableOption) {
|
|
22616
|
+
if (!isFinal && extraWidth >= IONIC_EXPAND_TRIGGER) {
|
|
22617
|
+
expandableOption.classList.add(ITEM_OPTION_EXPAND_THRESHOLD_CLASS);
|
|
22618
|
+
}
|
|
22619
|
+
else {
|
|
22620
|
+
expandableOption.classList.remove(ITEM_OPTION_EXPAND_THRESHOLD_CLASS);
|
|
22621
|
+
}
|
|
22622
|
+
}
|
|
22623
|
+
this.setIonicExpandableWidth(direction, targetWidth);
|
|
22624
|
+
}
|
|
22625
|
+
async animateIonicFullSwipe(direction) {
|
|
22626
|
+
const abortController = new AbortController();
|
|
22627
|
+
this.animationAbortController = abortController;
|
|
22628
|
+
const { signal } = abortController;
|
|
22629
|
+
const expandableOption = this.getExpandableOption(direction);
|
|
22630
|
+
const options = direction === 'end' ? this.rightOptions : this.leftOptions;
|
|
22631
|
+
if (this.gesture) {
|
|
22632
|
+
this.gesture.enable(false);
|
|
22633
|
+
}
|
|
22634
|
+
try {
|
|
22635
|
+
this.state =
|
|
22636
|
+
direction === 'end'
|
|
22637
|
+
? 8 /* SlidingState.End */ | 128 /* SlidingState.AnimatingFullSwipe */
|
|
22638
|
+
: 16 /* SlidingState.Start */ | 128 /* SlidingState.AnimatingFullSwipe */;
|
|
22639
|
+
if (!this.item) {
|
|
22640
|
+
return;
|
|
22641
|
+
}
|
|
22642
|
+
const itemWidth = this.el.offsetWidth || window.innerWidth;
|
|
22643
|
+
const baseWidth = this.getExpandableBaseWidth(direction);
|
|
22644
|
+
const expandableTargetWidth = Math.max(baseWidth, itemWidth - 16);
|
|
22645
|
+
const offScreenPosition = direction === 'end' ? itemWidth : -itemWidth;
|
|
22646
|
+
if (expandableOption) {
|
|
22647
|
+
expandableOption.classList.remove('item-sliding-expandable-width-back');
|
|
22648
|
+
expandableOption.classList.add('item-sliding-expandable-width-in');
|
|
22649
|
+
expandableOption.style.width = `${expandableTargetWidth}px`;
|
|
22650
|
+
}
|
|
22651
|
+
this.el.classList.remove('item-sliding-confirm-item-back');
|
|
22652
|
+
this.el.classList.add('item-sliding-confirm-item-in');
|
|
22653
|
+
this.item.style.transform = `translate3d(${-offScreenPosition}px, 0, 0)`;
|
|
22654
|
+
await this.delay(150, signal);
|
|
22655
|
+
options === null || options === void 0 ? void 0 : options.fireSwipeEvent();
|
|
22656
|
+
await this.delay(IONIC_CONFIRM_PAUSE, signal);
|
|
22657
|
+
if (expandableOption) {
|
|
22658
|
+
expandableOption.classList.remove('item-sliding-expandable-width-in');
|
|
22659
|
+
expandableOption.classList.add('item-sliding-expandable-width-back');
|
|
22660
|
+
expandableOption.style.width = `${baseWidth}px`;
|
|
22661
|
+
}
|
|
22662
|
+
this.el.classList.remove('item-sliding-confirm-item-in');
|
|
22663
|
+
this.el.classList.add('item-sliding-confirm-item-back');
|
|
22664
|
+
this.item.style.transform = 'translate3d(0, 0, 0)';
|
|
22665
|
+
await this.delay(500, signal);
|
|
22666
|
+
}
|
|
22667
|
+
catch (_a) {
|
|
22668
|
+
// Animation was aborted. finally handles cleanup.
|
|
22669
|
+
}
|
|
22670
|
+
finally {
|
|
22671
|
+
this.animationAbortController = undefined;
|
|
22672
|
+
this.el.classList.remove('item-sliding-confirm-item-in', 'item-sliding-confirm-item-back');
|
|
22673
|
+
if (this.item) {
|
|
22674
|
+
this.item.style.transform = '';
|
|
22675
|
+
}
|
|
22676
|
+
this.resetIonicExpandableOptions();
|
|
22677
|
+
this.openAmount = 0;
|
|
22678
|
+
this.state = 2 /* SlidingState.Disabled */;
|
|
22679
|
+
if (openSlidingItem === this.el) {
|
|
22680
|
+
openSlidingItem = undefined;
|
|
22681
|
+
}
|
|
22682
|
+
if (this.gesture) {
|
|
22683
|
+
this.gesture.enable(!this.disabled);
|
|
22684
|
+
}
|
|
22685
|
+
}
|
|
22686
|
+
}
|
|
22512
22687
|
async updateOptions() {
|
|
22513
22688
|
var _a;
|
|
22514
22689
|
const options = this.el.querySelectorAll('ion-item-options');
|
|
@@ -22576,7 +22751,12 @@ class ItemSliding {
|
|
|
22576
22751
|
}
|
|
22577
22752
|
this.initialOpenAmount = this.openAmount;
|
|
22578
22753
|
if (this.item) {
|
|
22579
|
-
this.
|
|
22754
|
+
if (this.isIonicTheme()) {
|
|
22755
|
+
this.el.classList.remove('item-sliding-transition-open', 'item-sliding-transition-snapback');
|
|
22756
|
+
}
|
|
22757
|
+
else {
|
|
22758
|
+
this.el.classList.add('item-sliding-dragging');
|
|
22759
|
+
}
|
|
22580
22760
|
}
|
|
22581
22761
|
}
|
|
22582
22762
|
onMove(gesture) {
|
|
@@ -22599,22 +22779,46 @@ class ItemSliding {
|
|
|
22599
22779
|
printIonWarning('[ion-item-sliding] - invalid ItemSideFlags value', this.sides);
|
|
22600
22780
|
break;
|
|
22601
22781
|
}
|
|
22602
|
-
|
|
22603
|
-
|
|
22604
|
-
|
|
22605
|
-
|
|
22782
|
+
if (this.isIonicTheme()) {
|
|
22783
|
+
if (openAmount > this.optsWidthRightSide) {
|
|
22784
|
+
const overDrag = openAmount - this.optsWidthRightSide;
|
|
22785
|
+
openAmount = this.optsWidthRightSide + overDrag * IONIC_ELASTIC_FACTOR;
|
|
22786
|
+
}
|
|
22787
|
+
else if (openAmount < -this.optsWidthLeftSide) {
|
|
22788
|
+
const overDrag = openAmount + this.optsWidthLeftSide;
|
|
22789
|
+
openAmount = -this.optsWidthLeftSide + overDrag * IONIC_ELASTIC_FACTOR;
|
|
22790
|
+
}
|
|
22606
22791
|
}
|
|
22607
|
-
else
|
|
22608
|
-
optsWidth
|
|
22609
|
-
|
|
22792
|
+
else {
|
|
22793
|
+
let optsWidth;
|
|
22794
|
+
if (openAmount > this.optsWidthRightSide) {
|
|
22795
|
+
optsWidth = this.optsWidthRightSide;
|
|
22796
|
+
openAmount = optsWidth + (openAmount - optsWidth) * ELASTIC_FACTOR;
|
|
22797
|
+
}
|
|
22798
|
+
else if (openAmount < -this.optsWidthLeftSide) {
|
|
22799
|
+
optsWidth = -this.optsWidthLeftSide;
|
|
22800
|
+
openAmount = optsWidth + (openAmount - optsWidth) * ELASTIC_FACTOR;
|
|
22801
|
+
}
|
|
22610
22802
|
}
|
|
22611
22803
|
this.setOpenAmount(openAmount, false);
|
|
22612
22804
|
}
|
|
22613
22805
|
onEnd(gesture) {
|
|
22806
|
+
this.el.classList.remove('item-sliding-dragging');
|
|
22807
|
+
this.restoreContentScrollAfterSlide();
|
|
22808
|
+
if (this.isIonicTheme()) {
|
|
22809
|
+
this.onEndIonic(gesture);
|
|
22810
|
+
}
|
|
22811
|
+
else {
|
|
22812
|
+
this.onEndNative(gesture);
|
|
22813
|
+
}
|
|
22814
|
+
}
|
|
22815
|
+
restoreContentScrollAfterSlide() {
|
|
22614
22816
|
const { contentEl, initialContentScrollY } = this;
|
|
22615
22817
|
if (contentEl) {
|
|
22616
22818
|
resetContentScrollY(contentEl, initialContentScrollY);
|
|
22617
22819
|
}
|
|
22820
|
+
}
|
|
22821
|
+
onEndNative(gesture) {
|
|
22618
22822
|
// Check for full swipe conditions with expandable options
|
|
22619
22823
|
const rawSwipeDistance = Math.abs(gesture.deltaX);
|
|
22620
22824
|
const direction = gesture.deltaX < 0 ? 'end' : 'start';
|
|
@@ -22651,17 +22855,64 @@ class ItemSliding {
|
|
|
22651
22855
|
this.leftOptions.fireSwipeEvent();
|
|
22652
22856
|
}
|
|
22653
22857
|
}
|
|
22858
|
+
onEndIonic(gesture) {
|
|
22859
|
+
const velocity = gesture.velocityX;
|
|
22860
|
+
const velocityX = velocity * 1000;
|
|
22861
|
+
const activeDirection = this.getOpenDirectionFromAmount(this.openAmount);
|
|
22862
|
+
if (activeDirection === undefined) {
|
|
22863
|
+
this.setOpenAmount(0, true);
|
|
22864
|
+
return;
|
|
22865
|
+
}
|
|
22866
|
+
const optionsWidth = this.getOptionsWidthForDirection(activeDirection);
|
|
22867
|
+
const extraWidth = Math.max(0, Math.abs(this.openAmount) - optionsWidth);
|
|
22868
|
+
const hasExpandable = this.hasExpandableOptions(activeDirection === 'end' ? this.rightOptions : this.leftOptions);
|
|
22869
|
+
const closeDirection = activeDirection === 'end'
|
|
22870
|
+
? velocityX > IONIC_FULL_SWIPE_VELOCITY_THRESHOLD
|
|
22871
|
+
: velocityX < -400;
|
|
22872
|
+
if (closeDirection) {
|
|
22873
|
+
this.setOpenAmount(0, true);
|
|
22874
|
+
return;
|
|
22875
|
+
}
|
|
22876
|
+
if (hasExpandable &&
|
|
22877
|
+
(extraWidth >= IONIC_EXPAND_TRIGGER ||
|
|
22878
|
+
(extraWidth > 0 && Math.abs(velocityX) > IONIC_FULL_SWIPE_VELOCITY_THRESHOLD))) {
|
|
22879
|
+
this.animateIonicFullSwipe(activeDirection).catch(() => {
|
|
22880
|
+
if (this.gesture) {
|
|
22881
|
+
this.gesture.enable(!this.disabled);
|
|
22882
|
+
}
|
|
22883
|
+
});
|
|
22884
|
+
return;
|
|
22885
|
+
}
|
|
22886
|
+
const flickOpen = activeDirection === 'end'
|
|
22887
|
+
? velocityX < -200
|
|
22888
|
+
: velocityX > IONIC_OPEN_VELOCITY_THRESHOLD;
|
|
22889
|
+
const fullOpen = activeDirection === 'end' ? this.optsWidthRightSide : -this.optsWidthLeftSide;
|
|
22890
|
+
const openThreshold = optionsWidth * IONIC_SNAP_OPEN_RATIO;
|
|
22891
|
+
const shouldSnapOpen = flickOpen || Math.abs(this.openAmount) > openThreshold;
|
|
22892
|
+
const restingPoint = shouldSnapOpen ? fullOpen : 0;
|
|
22893
|
+
this.setOpenAmount(restingPoint, true);
|
|
22894
|
+
}
|
|
22654
22895
|
calculateOptsWidth() {
|
|
22655
22896
|
this.optsWidthRightSide = 0;
|
|
22656
22897
|
if (this.rightOptions) {
|
|
22657
22898
|
this.rightOptions.style.display = 'flex';
|
|
22658
22899
|
this.optsWidthRightSide = this.rightOptions.offsetWidth;
|
|
22900
|
+
const rightExpandable = this.queryExpandableOption(this.rightOptions);
|
|
22901
|
+
if (rightExpandable) {
|
|
22902
|
+
rightExpandable.style.width = '';
|
|
22903
|
+
this.rightExpandableBaseWidth = Math.max(IONIC_ACTION_BASE_WIDTH, rightExpandable.getBoundingClientRect().width);
|
|
22904
|
+
}
|
|
22659
22905
|
this.rightOptions.style.display = '';
|
|
22660
22906
|
}
|
|
22661
22907
|
this.optsWidthLeftSide = 0;
|
|
22662
22908
|
if (this.leftOptions) {
|
|
22663
22909
|
this.leftOptions.style.display = 'flex';
|
|
22664
22910
|
this.optsWidthLeftSide = this.leftOptions.offsetWidth;
|
|
22911
|
+
const leftExpandable = this.queryExpandableOption(this.leftOptions);
|
|
22912
|
+
if (leftExpandable) {
|
|
22913
|
+
leftExpandable.style.width = '';
|
|
22914
|
+
this.leftExpandableBaseWidth = Math.max(IONIC_ACTION_BASE_WIDTH, leftExpandable.getBoundingClientRect().width);
|
|
22915
|
+
}
|
|
22665
22916
|
this.leftOptions.style.display = '';
|
|
22666
22917
|
}
|
|
22667
22918
|
this.optsDirty = false;
|
|
@@ -22676,35 +22927,30 @@ class ItemSliding {
|
|
|
22676
22927
|
}
|
|
22677
22928
|
const { el } = this;
|
|
22678
22929
|
const style = this.item.style;
|
|
22930
|
+
const previousOpenAmount = this.openAmount;
|
|
22679
22931
|
this.openAmount = openAmount;
|
|
22680
|
-
if (
|
|
22681
|
-
|
|
22932
|
+
if (this.isIonicTheme()) {
|
|
22933
|
+
this.updateIonicExpandableFromOpenAmount(openAmount, isFinal, previousOpenAmount);
|
|
22934
|
+
}
|
|
22935
|
+
if (this.isIonicTheme() && isFinal) {
|
|
22936
|
+
const closing = Math.abs(openAmount) < Math.abs(previousOpenAmount);
|
|
22937
|
+
if (closing) {
|
|
22938
|
+
this.el.classList.add('item-sliding-transition-snapback');
|
|
22939
|
+
}
|
|
22940
|
+
else {
|
|
22941
|
+
this.el.classList.add('item-sliding-transition-open');
|
|
22942
|
+
}
|
|
22682
22943
|
}
|
|
22683
22944
|
if (openAmount > 0) {
|
|
22684
|
-
this.
|
|
22685
|
-
|
|
22686
|
-
? 8 /* SlidingState.End */ | 32 /* SlidingState.SwipeEnd */
|
|
22687
|
-
: 8 /* SlidingState.End */;
|
|
22945
|
+
const fullSwipe = !this.isIonicTheme() && openAmount >= this.optsWidthRightSide + SWIPE_MARGIN;
|
|
22946
|
+
this.state = fullSwipe ? 8 /* SlidingState.End */ | 32 /* SlidingState.SwipeEnd */ : 8 /* SlidingState.End */;
|
|
22688
22947
|
}
|
|
22689
22948
|
else if (openAmount < 0) {
|
|
22690
|
-
this.
|
|
22691
|
-
|
|
22692
|
-
? 16 /* SlidingState.Start */ | 64 /* SlidingState.SwipeStart */
|
|
22693
|
-
: 16 /* SlidingState.Start */;
|
|
22949
|
+
const fullSwipe = !this.isIonicTheme() && openAmount <= -this.optsWidthLeftSide - SWIPE_MARGIN;
|
|
22950
|
+
this.state = fullSwipe ? 16 /* SlidingState.Start */ | 64 /* SlidingState.SwipeStart */ : 16 /* SlidingState.Start */;
|
|
22694
22951
|
}
|
|
22695
22952
|
else {
|
|
22696
|
-
/**
|
|
22697
|
-
* The sliding options should not be
|
|
22698
|
-
* clickable while the item is closing.
|
|
22699
|
-
*/
|
|
22700
22953
|
el.classList.add('item-sliding-closing');
|
|
22701
|
-
/**
|
|
22702
|
-
* Item sliding cannot be interrupted
|
|
22703
|
-
* while closing the item. If it did,
|
|
22704
|
-
* it would allow the item to get into an
|
|
22705
|
-
* inconsistent state where multiple
|
|
22706
|
-
* items are then open at the same time.
|
|
22707
|
-
*/
|
|
22708
22954
|
if (this.gesture) {
|
|
22709
22955
|
this.gesture.enable(false);
|
|
22710
22956
|
}
|
|
@@ -22739,7 +22985,7 @@ class ItemSliding {
|
|
|
22739
22985
|
}
|
|
22740
22986
|
render() {
|
|
22741
22987
|
const theme = getIonTheme(this);
|
|
22742
|
-
return (hAsync(Host, { key: '
|
|
22988
|
+
return (hAsync(Host, { key: 'ca0730d5ee00f245b6a139d9fb53fcc8c529a8c6', class: {
|
|
22743
22989
|
[theme]: true,
|
|
22744
22990
|
'item-sliding-active-slide': this.state !== 2 /* SlidingState.Disabled */,
|
|
22745
22991
|
'item-sliding-active-options-end': (this.state & 8 /* SlidingState.End */) !== 0,
|
|
@@ -22754,9 +23000,13 @@ class ItemSliding {
|
|
|
22754
23000
|
"disabledChanged": 0
|
|
22755
23001
|
}]
|
|
22756
23002
|
}; }
|
|
22757
|
-
static get style() { return
|
|
23003
|
+
static get style() { return {
|
|
23004
|
+
ionic: itemSlidingIonicCss(),
|
|
23005
|
+
ios: iosItemSlidingNativeCss(),
|
|
23006
|
+
md: mdItemSlidingNativeCss()
|
|
23007
|
+
}; }
|
|
22758
23008
|
static get cmpMeta() { return {
|
|
22759
|
-
"$flags$":
|
|
23009
|
+
"$flags$": 32,
|
|
22760
23010
|
"$tagName$": "ion-item-sliding",
|
|
22761
23011
|
"$members$": {
|
|
22762
23012
|
"disabled": [4],
|