@usecapsule/core-components 2.0.0 → 2.0.1
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/dist/capsule/capsule.esm.js +1 -1
- package/dist/capsule/{p-202a85c9.entry.js → p-654cb899.entry.js} +2 -2
- package/dist/capsule/p-654cb899.entry.js.map +1 -0
- package/dist/cjs/cpsl-alert_17.cjs.entry.js +26 -19
- package/dist/cjs/cpsl-alert_17.cjs.entry.js.map +1 -1
- package/dist/collection/components/cpsl-modal/cpsl-modal.js +26 -19
- package/dist/collection/components/cpsl-modal/cpsl-modal.js.map +1 -1
- package/dist/esm/cpsl-alert_17.entry.js +26 -19
- package/dist/esm/cpsl-alert_17.entry.js.map +1 -1
- package/dist/types/components/cpsl-modal/cpsl-modal.d.ts +2 -0
- package/package.json +2 -2
- package/dist/capsule/p-202a85c9.entry.js.map +0 -1
@@ -10087,6 +10087,32 @@ const CpslModal = class {
|
|
10087
10087
|
this.footerExpanded ? this.expandFooterTl.play() : this.expandFooterTl.reverse();
|
10088
10088
|
}
|
10089
10089
|
toggleModal() {
|
10090
|
+
if (this.hasAnimatedIn) {
|
10091
|
+
this.handleAnimation();
|
10092
|
+
}
|
10093
|
+
}
|
10094
|
+
componentDidLoad() {
|
10095
|
+
this.handleAnimation();
|
10096
|
+
this.hasAnimatedIn = true;
|
10097
|
+
mm.add(`(min-width: ${constants.MOBILE_SIZE + 1}px)`, () => {
|
10098
|
+
var _a;
|
10099
|
+
(_a = this.draggable) === null || _a === void 0 ? void 0 : _a.disable();
|
10100
|
+
gsapWithCSS.timeline({}).set(this.modalWrapperEl, { yPercent: 0, scale: this.open ? 1 : 0.8, opacity: this.open ? 1 : 0 });
|
10101
|
+
});
|
10102
|
+
mm.add(`(max-width: ${constants.MOBILE_SIZE}px)`, () => {
|
10103
|
+
this.initDraggable();
|
10104
|
+
gsapWithCSS.timeline({}).set(this.modalWrapperEl, { scale: 1, opacity: 1, yPercent: this.open ? -100 : 0 });
|
10105
|
+
});
|
10106
|
+
this.footerSlotEl.addEventListener('slotchange', () => {
|
10107
|
+
if (this.footerSlotEl.assignedNodes().length >= 1) {
|
10108
|
+
this.hasFooter = true;
|
10109
|
+
}
|
10110
|
+
else {
|
10111
|
+
this.hasFooter = false;
|
10112
|
+
}
|
10113
|
+
});
|
10114
|
+
}
|
10115
|
+
handleAnimation() {
|
10090
10116
|
if (this.open) {
|
10091
10117
|
if (window.innerWidth >= constants.MOBILE_SIZE + 1) {
|
10092
10118
|
gsapWithCSS
|
@@ -10161,25 +10187,6 @@ const CpslModal = class {
|
|
10161
10187
|
}
|
10162
10188
|
}
|
10163
10189
|
}
|
10164
|
-
componentDidLoad() {
|
10165
|
-
mm.add(`(min-width: ${constants.MOBILE_SIZE + 1}px)`, () => {
|
10166
|
-
var _a;
|
10167
|
-
(_a = this.draggable) === null || _a === void 0 ? void 0 : _a.disable();
|
10168
|
-
gsapWithCSS.timeline({}).set(this.modalWrapperEl, { yPercent: 0, scale: this.open ? 1 : 0.8, opacity: this.open ? 1 : 0 });
|
10169
|
-
});
|
10170
|
-
mm.add(`(max-width: ${constants.MOBILE_SIZE}px)`, () => {
|
10171
|
-
this.initDraggable();
|
10172
|
-
gsapWithCSS.timeline({}).set(this.modalWrapperEl, { scale: 1, opacity: 1, yPercent: this.open ? -100 : 0 });
|
10173
|
-
});
|
10174
|
-
this.footerSlotEl.addEventListener('slotchange', () => {
|
10175
|
-
if (this.footerSlotEl.assignedNodes().length >= 1) {
|
10176
|
-
this.hasFooter = true;
|
10177
|
-
}
|
10178
|
-
else {
|
10179
|
-
this.hasFooter = false;
|
10180
|
-
}
|
10181
|
-
});
|
10182
|
-
}
|
10183
10190
|
addExpandAnim() {
|
10184
10191
|
setTimeout(() => {
|
10185
10192
|
this.expandFooterTl = gsapWithCSS
|