@plaidev/karte-action-sdk 1.1.266 → 1.1.267-29071733.fabf64a6
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/hydrate/index.es.js +328 -255
- package/dist/index.es.js +279 -254
- package/dist/svelte5/hydrate/index.es.js +102 -43
- package/dist/svelte5/index.es.js +41 -41
- package/dist/svelte5/index.front2.es.js +41 -43
- package/package.json +1 -1
@@ -4,7 +4,7 @@ import { onMount as onMount$1, onDestroy as onDestroy$1, beforeUpdate as beforeU
|
|
4
4
|
import 'svelte/internal/disclose-version';
|
5
5
|
import 'svelte/internal/flags/legacy';
|
6
6
|
import * as $ from 'svelte/internal/client';
|
7
|
-
import 'svelte/easing';
|
7
|
+
import { linear, elasticOut, cubicOut } from 'svelte/easing';
|
8
8
|
|
9
9
|
/** @internal */
|
10
10
|
const ACTION_HOOK_LABEL = '__ACTION_HOOK__';
|
@@ -3362,8 +3362,56 @@ const execOnClickOperation = (onClickOperation) => {
|
|
3362
3362
|
bootChat(...onClickOperation.args)();
|
3363
3363
|
}
|
3364
3364
|
};
|
3365
|
+
function getAnimation(animation) {
|
3366
|
+
switch (animation.type) {
|
3367
|
+
case 'fade':
|
3368
|
+
return `opacity: ${animation.progress}`;
|
3369
|
+
case 'bounce': {
|
3370
|
+
const translateX = animation.x;
|
3371
|
+
const translateY = animation.y;
|
3372
|
+
return `transform: translate3d(${translateX}%, ${translateY}%, 0) scale(${animation.progress});`;
|
3373
|
+
}
|
3374
|
+
case 'slide-down': {
|
3375
|
+
const translateX = animation.x;
|
3376
|
+
const translateY = animation.y - 100 * (1 - animation.progress);
|
3377
|
+
return `transform: translate3d(${translateX}%, ${translateY}%, 0);`;
|
3378
|
+
}
|
3379
|
+
case 'slide-up': {
|
3380
|
+
const translateX = animation.x;
|
3381
|
+
const translateY = animation.y + 100 * (1 - animation.progress);
|
3382
|
+
return `transform: translate3d(${translateX}%, ${translateY}%, 0);`;
|
3383
|
+
}
|
3384
|
+
case 'slide-left': {
|
3385
|
+
const translateX = animation.x + 100 * (1 - animation.progress);
|
3386
|
+
const translateY = animation.y;
|
3387
|
+
return `transform: translate3d(${translateX}%, ${translateY}%, 0);`;
|
3388
|
+
}
|
3389
|
+
case 'slide-right': {
|
3390
|
+
const translateX = animation.x - 100 * (1 - animation.progress);
|
3391
|
+
const translateY = animation.y;
|
3392
|
+
return `transform: translate3d(${translateX}%, ${translateY}%, 0);`;
|
3393
|
+
}
|
3394
|
+
case 'none': {
|
3395
|
+
const translateX = animation.x;
|
3396
|
+
const translateY = animation.y;
|
3397
|
+
return `transform: translate3d(${translateX}%, ${translateY}%, 0);`;
|
3398
|
+
}
|
3399
|
+
default:
|
3400
|
+
console.warn(`[action-sdk] invalid '${animation}', so we use 'transform: none' instead`);
|
3401
|
+
return 'transform: none';
|
3402
|
+
}
|
3403
|
+
}
|
3404
|
+
const EASING = {
|
3405
|
+
fade: linear,
|
3406
|
+
bounce: elasticOut,
|
3407
|
+
'slide-down': cubicOut,
|
3408
|
+
'slide-up': cubicOut,
|
3409
|
+
'slide-left': cubicOut,
|
3410
|
+
'slide-right': cubicOut,
|
3411
|
+
none: linear,
|
3412
|
+
};
|
3365
3413
|
/**
|
3366
|
-
* The function to activate svelte animation.
|
3414
|
+
* The function to activate svelte animation v2.
|
3367
3415
|
*
|
3368
3416
|
* @param node - A target node of animation. This argument is passed by svelte, by default.
|
3369
3417
|
* @param customAnimationOptions - A custom animation option object
|
@@ -3372,10 +3420,24 @@ const execOnClickOperation = (onClickOperation) => {
|
|
3372
3420
|
*
|
3373
3421
|
* @internal
|
3374
3422
|
*/
|
3375
|
-
function
|
3376
|
-
{
|
3423
|
+
function customAnimationV2(node, { transforms, animationStyle, delay = 0, duration = 1000, disabled, }) {
|
3424
|
+
if (disabled) {
|
3377
3425
|
return {};
|
3378
3426
|
}
|
3427
|
+
let [x, y] = [0, 0];
|
3428
|
+
for (const { query, x: tx, y: ty } of transforms) {
|
3429
|
+
if (query == null || window.matchMedia(query).matches) {
|
3430
|
+
x = tx;
|
3431
|
+
y = ty;
|
3432
|
+
break;
|
3433
|
+
}
|
3434
|
+
}
|
3435
|
+
return {
|
3436
|
+
delay,
|
3437
|
+
duration,
|
3438
|
+
easing: EASING[animationStyle],
|
3439
|
+
css: (progress) => getAnimation({ type: animationStyle, x, y, progress }),
|
3440
|
+
};
|
3379
3441
|
}
|
3380
3442
|
|
3381
3443
|
const getHref = (onClick) => {
|
@@ -5136,11 +5198,11 @@ const IMAGE_ROUND_STYLES = {
|
|
5136
5198
|
},
|
5137
5199
|
};
|
5138
5200
|
|
5139
|
-
var root_1$3 = $.template(`<img class="image-img svelte-
|
5201
|
+
var root_1$3 = $.template(`<img class="image-img svelte-rewdem">`);
|
5140
5202
|
|
5141
5203
|
const $$css$g = {
|
5142
|
-
hash: 'svelte-
|
5143
|
-
code: '.image.svelte-
|
5204
|
+
hash: 'svelte-rewdem',
|
5205
|
+
code: '.image.svelte-rewdem {max-width:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;}.image-img.svelte-rewdem {vertical-align:top;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none;}'
|
5144
5206
|
};
|
5145
5207
|
|
5146
5208
|
function Image($$anchor, $$props) {
|
@@ -5155,6 +5217,7 @@ function Image($$anchor, $$props) {
|
|
5155
5217
|
|
5156
5218
|
const { attributes, element, handleClick } = useClickable(props());
|
5157
5219
|
const aspectVariantStyles = ASPECT_VARIANT[props().aspectVariant]?.getProps();
|
5220
|
+
const width = props().width ?? '100%';
|
5158
5221
|
|
5159
5222
|
$.legacy_pre_effect(
|
5160
5223
|
() => (
|
@@ -5164,7 +5227,8 @@ function Image($$anchor, $$props) {
|
|
5164
5227
|
() => {
|
5165
5228
|
$.set(style, objToStyle({
|
5166
5229
|
...props().borderTopLeftRadius ? toCssRadius(props()) : IMAGE_ROUND_STYLES[props().shape ?? 'square'],
|
5167
|
-
width
|
5230
|
+
width,
|
5231
|
+
flexShrink: String(width).indexOf('px') !== -1 ? 0 : 1,
|
5168
5232
|
height: props().height ?? 'auto',
|
5169
5233
|
aspectRatio: props().aspect ?? aspectVariantStyles?.aspect,
|
5170
5234
|
...toCssCommon(props()),
|
@@ -5191,7 +5255,7 @@ function Image($$anchor, $$props) {
|
|
5191
5255
|
style: $.get(style),
|
5192
5256
|
'data-layer-id': layerId()
|
5193
5257
|
},
|
5194
|
-
'svelte-
|
5258
|
+
'svelte-rewdem'
|
5195
5259
|
));
|
5196
5260
|
|
5197
5261
|
$.event('click', $$element, handleClick);
|
@@ -6230,7 +6294,6 @@ function Modal($$anchor, $$props) {
|
|
6230
6294
|
const backgroundClickSP = $.mutable_state();
|
6231
6295
|
const handle_keydown = $.mutable_state();
|
6232
6296
|
const visible = $.mutable_state();
|
6233
|
-
const style = $.mutable_state();
|
6234
6297
|
let useBreakPoint = $.prop($$props, 'useBreakPoint', 8, false);
|
6235
6298
|
let placement = $.prop($$props, 'placement', 8);
|
6236
6299
|
let breakPoint = $.prop($$props, 'breakPoint', 8);
|
@@ -6241,8 +6304,11 @@ function Modal($$anchor, $$props) {
|
|
6241
6304
|
let closeEventValue = $.prop($$props, 'closeEventValue', 8, null);
|
6242
6305
|
let layerId = $.prop($$props, 'layerId', 8, '');
|
6243
6306
|
const { brandKit } = useBrandKit();
|
6244
|
-
|
6245
|
-
const isOnSite = (document.querySelector('#preview')?.getAttribute('data-on-site') ?? 'true')
|
6307
|
+
const isCanvasPreview = (document.querySelector('#preview')?.getAttribute('data-canvas-preview') ?? 'false') === 'true';
|
6308
|
+
const isOnSite = (document.querySelector('#preview')?.getAttribute('data-on-site') ?? 'true') === 'true';
|
6309
|
+
|
6310
|
+
console.log('isOnSite', isOnSite);
|
6311
|
+
|
6246
6312
|
// モーダル背景の設定
|
6247
6313
|
const isExistBackgroundOverlayValue = placement() && placement().backgroundOverlay !== undefined;
|
6248
6314
|
let backgroundOverlay = $.mutable_state(DefaultModalPlacement.backgroundOverlay);
|
@@ -6288,7 +6354,7 @@ function Modal($$anchor, $$props) {
|
|
6288
6354
|
$.deep_read_state(breakPoint())
|
6289
6355
|
),
|
6290
6356
|
() => {
|
6291
|
-
if (
|
6357
|
+
if (!isCanvasPreview && isExistBackgroundOverlayValue) {
|
6292
6358
|
$.set(backgroundOverlay, placement().backgroundOverlay);
|
6293
6359
|
}
|
6294
6360
|
|
@@ -6394,7 +6460,7 @@ function Modal($$anchor, $$props) {
|
|
6394
6460
|
// 表示位置のスタイルの設定
|
6395
6461
|
let position = DefaultModalPlacement.position;
|
6396
6462
|
|
6397
|
-
if (
|
6463
|
+
if (!isCanvasPreview && placement() && placement().position !== null) {
|
6398
6464
|
position = placement().position;
|
6399
6465
|
}
|
6400
6466
|
|
@@ -6411,7 +6477,7 @@ function Modal($$anchor, $$props) {
|
|
6411
6477
|
$.set(transforms, []);
|
6412
6478
|
|
6413
6479
|
DEVICE_IDS.forEach((deviceId) => {
|
6414
|
-
if (
|
6480
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6415
6481
|
const positionWithBp = breakPoint()[deviceId]?.placement?.position;
|
6416
6482
|
|
6417
6483
|
$.get(transforms).push({
|
@@ -6441,12 +6507,13 @@ function Modal($$anchor, $$props) {
|
|
6441
6507
|
$.deep_read_state(placement()),
|
6442
6508
|
$.deep_read_state(useBreakPoint()),
|
6443
6509
|
$.deep_read_state(breakPoint()),
|
6444
|
-
|
6510
|
+
$.deep_read_state(props()),
|
6511
|
+
toCssBorder
|
6445
6512
|
),
|
6446
6513
|
() => {
|
6447
6514
|
let margin = DefaultModalPlacement.margin;
|
6448
6515
|
|
6449
|
-
if (
|
6516
|
+
if (!isCanvasPreview && placement() && placement().margin !== null) {
|
6450
6517
|
margin = placement().margin;
|
6451
6518
|
}
|
6452
6519
|
|
@@ -6457,7 +6524,7 @@ function Modal($$anchor, $$props) {
|
|
6457
6524
|
}
|
6458
6525
|
|
6459
6526
|
DEVICE_IDS.forEach((deviceId) => {
|
6460
|
-
if (
|
6527
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6461
6528
|
const marginWithBp = breakPoint()[deviceId]?.placement?.margin;
|
6462
6529
|
|
6463
6530
|
marginStyle = getMarginStyle(marginWithBp);
|
@@ -6471,6 +6538,18 @@ function Modal($$anchor, $$props) {
|
|
6471
6538
|
|
6472
6539
|
modalStyles.add(marginVariables);
|
6473
6540
|
});
|
6541
|
+
|
6542
|
+
const propsStyle = objToStyle({
|
6543
|
+
width: props().width,
|
6544
|
+
...toCssOverflow(props()),
|
6545
|
+
...toCssShadow(props()),
|
6546
|
+
...toCssRadius(props()),
|
6547
|
+
...toCssBackgroundImage(props()),
|
6548
|
+
...toCssBackgroundColor(props()),
|
6549
|
+
...toCssBorder(props())
|
6550
|
+
});
|
6551
|
+
|
6552
|
+
modalStyles.add(propsStyle);
|
6474
6553
|
}
|
6475
6554
|
);
|
6476
6555
|
|
@@ -6486,24 +6565,6 @@ function Modal($$anchor, $$props) {
|
|
6486
6565
|
$.set(visible, false);
|
6487
6566
|
});
|
6488
6567
|
|
6489
|
-
$.legacy_pre_effect(
|
6490
|
-
() => (
|
6491
|
-
$.deep_read_state(props()),
|
6492
|
-
toCssBorder
|
6493
|
-
),
|
6494
|
-
() => {
|
6495
|
-
$.set(style, objToStyle({
|
6496
|
-
width: props().width,
|
6497
|
-
...toCssOverflow(props()),
|
6498
|
-
...toCssShadow(props()),
|
6499
|
-
...toCssRadius(props()),
|
6500
|
-
...toCssBackgroundImage(props()),
|
6501
|
-
...toCssBackgroundColor(props()),
|
6502
|
-
...toCssBorder(props())
|
6503
|
-
}));
|
6504
|
-
}
|
6505
|
-
);
|
6506
|
-
|
6507
6568
|
$.legacy_pre_effect_reset();
|
6508
6569
|
$.init();
|
6509
6570
|
|
@@ -6577,7 +6638,7 @@ function Modal($$anchor, $$props) {
|
|
6577
6638
|
};
|
6578
6639
|
|
6579
6640
|
$.if(node, ($$render) => {
|
6580
|
-
if (
|
6641
|
+
if (isCanvasPreview) $$render(consequent); else $$render(alternate, false);
|
6581
6642
|
});
|
6582
6643
|
}
|
6583
6644
|
|
@@ -6603,17 +6664,15 @@ function Modal($$anchor, $$props) {
|
|
6603
6664
|
'modal',
|
6604
6665
|
useBreakPoint() ? 'modal-bp' : ''
|
6605
6666
|
].join(' ')),
|
6606
|
-
() =>
|
6607
|
-
Array.from(modalStyles).join(';'),
|
6608
|
-
$.get(style)
|
6609
|
-
].join(' ')
|
6667
|
+
() => Array.from(modalStyles).join(';')
|
6610
6668
|
],
|
6611
6669
|
$.derived_safe_equal
|
6612
6670
|
);
|
6613
6671
|
|
6614
|
-
$.transition(1, div, () =>
|
6672
|
+
$.transition(1, div, () => customAnimationV2, () => ({
|
6615
6673
|
transforms: $.get(transforms),
|
6616
|
-
animationStyle: animation()
|
6674
|
+
animationStyle: animation(),
|
6675
|
+
disabled: !isOnSite
|
6617
6676
|
}));
|
6618
6677
|
|
6619
6678
|
$.append($$anchor, div);
|
package/dist/svelte5/index.es.js
CHANGED
@@ -3467,7 +3467,7 @@ const EASING = {
|
|
3467
3467
|
none: linear,
|
3468
3468
|
};
|
3469
3469
|
/**
|
3470
|
-
* The function to activate svelte animation.
|
3470
|
+
* The function to activate svelte animation v2.
|
3471
3471
|
*
|
3472
3472
|
* @param node - A target node of animation. This argument is passed by svelte, by default.
|
3473
3473
|
* @param customAnimationOptions - A custom animation option object
|
@@ -3476,7 +3476,10 @@ const EASING = {
|
|
3476
3476
|
*
|
3477
3477
|
* @internal
|
3478
3478
|
*/
|
3479
|
-
function
|
3479
|
+
function customAnimationV2(node, { transforms, animationStyle, delay = 0, duration = 1000, disabled, }) {
|
3480
|
+
if (disabled) {
|
3481
|
+
return {};
|
3482
|
+
}
|
3480
3483
|
let [x, y] = [0, 0];
|
3481
3484
|
for (const { query, x: tx, y: ty } of transforms) {
|
3482
3485
|
if (query == null || window.matchMedia(query).matches) {
|
@@ -5251,11 +5254,11 @@ const IMAGE_ROUND_STYLES = {
|
|
5251
5254
|
},
|
5252
5255
|
};
|
5253
5256
|
|
5254
|
-
var root_1$3 = $.template(`<img class="image-img svelte-
|
5257
|
+
var root_1$3 = $.template(`<img class="image-img svelte-rewdem">`);
|
5255
5258
|
|
5256
5259
|
const $$css$g = {
|
5257
|
-
hash: 'svelte-
|
5258
|
-
code: '.image.svelte-
|
5260
|
+
hash: 'svelte-rewdem',
|
5261
|
+
code: '.image.svelte-rewdem {max-width:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;}.image-img.svelte-rewdem {vertical-align:top;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none;}'
|
5259
5262
|
};
|
5260
5263
|
|
5261
5264
|
function Image($$anchor, $$props) {
|
@@ -5270,6 +5273,7 @@ function Image($$anchor, $$props) {
|
|
5270
5273
|
|
5271
5274
|
const { attributes, element, handleClick } = useClickable(props());
|
5272
5275
|
const aspectVariantStyles = ASPECT_VARIANT[props().aspectVariant]?.getProps();
|
5276
|
+
const width = props().width ?? '100%';
|
5273
5277
|
|
5274
5278
|
$.legacy_pre_effect(
|
5275
5279
|
() => (
|
@@ -5279,7 +5283,8 @@ function Image($$anchor, $$props) {
|
|
5279
5283
|
() => {
|
5280
5284
|
$.set(style, objToStyle({
|
5281
5285
|
...props().borderTopLeftRadius ? toCssRadius(props()) : IMAGE_ROUND_STYLES[props().shape ?? 'square'],
|
5282
|
-
width
|
5286
|
+
width,
|
5287
|
+
flexShrink: String(width).indexOf('px') !== -1 ? 0 : 1,
|
5283
5288
|
height: props().height ?? 'auto',
|
5284
5289
|
aspectRatio: props().aspect ?? aspectVariantStyles?.aspect,
|
5285
5290
|
...toCssCommon(props()),
|
@@ -5306,7 +5311,7 @@ function Image($$anchor, $$props) {
|
|
5306
5311
|
style: $.get(style),
|
5307
5312
|
'data-layer-id': layerId()
|
5308
5313
|
},
|
5309
|
-
'svelte-
|
5314
|
+
'svelte-rewdem'
|
5310
5315
|
));
|
5311
5316
|
|
5312
5317
|
$.event('click', $$element, handleClick);
|
@@ -6345,7 +6350,6 @@ function Modal($$anchor, $$props) {
|
|
6345
6350
|
const backgroundClickSP = $.mutable_state();
|
6346
6351
|
const handle_keydown = $.mutable_state();
|
6347
6352
|
const visible = $.mutable_state();
|
6348
|
-
const style = $.mutable_state();
|
6349
6353
|
let useBreakPoint = $.prop($$props, 'useBreakPoint', 8, false);
|
6350
6354
|
let placement = $.prop($$props, 'placement', 8);
|
6351
6355
|
let breakPoint = $.prop($$props, 'breakPoint', 8);
|
@@ -6356,8 +6360,11 @@ function Modal($$anchor, $$props) {
|
|
6356
6360
|
let closeEventValue = $.prop($$props, 'closeEventValue', 8, null);
|
6357
6361
|
let layerId = $.prop($$props, 'layerId', 8, '');
|
6358
6362
|
const { brandKit } = useBrandKit();
|
6359
|
-
|
6360
|
-
const isOnSite = (document.querySelector('#preview')?.getAttribute('data-on-site') ?? 'true')
|
6363
|
+
const isCanvasPreview = (document.querySelector('#preview')?.getAttribute('data-canvas-preview') ?? 'false') === 'true';
|
6364
|
+
const isOnSite = (document.querySelector('#preview')?.getAttribute('data-on-site') ?? 'true') === 'true';
|
6365
|
+
|
6366
|
+
console.log('isOnSite', isOnSite);
|
6367
|
+
|
6361
6368
|
// モーダル背景の設定
|
6362
6369
|
const isExistBackgroundOverlayValue = placement() && placement().backgroundOverlay !== undefined;
|
6363
6370
|
let backgroundOverlay = $.mutable_state(DefaultModalPlacement.backgroundOverlay);
|
@@ -6403,7 +6410,7 @@ function Modal($$anchor, $$props) {
|
|
6403
6410
|
$.deep_read_state(breakPoint())
|
6404
6411
|
),
|
6405
6412
|
() => {
|
6406
|
-
if (
|
6413
|
+
if (!isCanvasPreview && isExistBackgroundOverlayValue) {
|
6407
6414
|
$.set(backgroundOverlay, placement().backgroundOverlay);
|
6408
6415
|
}
|
6409
6416
|
|
@@ -6509,7 +6516,7 @@ function Modal($$anchor, $$props) {
|
|
6509
6516
|
// 表示位置のスタイルの設定
|
6510
6517
|
let position = DefaultModalPlacement.position;
|
6511
6518
|
|
6512
|
-
if (
|
6519
|
+
if (!isCanvasPreview && placement() && placement().position !== null) {
|
6513
6520
|
position = placement().position;
|
6514
6521
|
}
|
6515
6522
|
|
@@ -6526,7 +6533,7 @@ function Modal($$anchor, $$props) {
|
|
6526
6533
|
$.set(transforms, []);
|
6527
6534
|
|
6528
6535
|
DEVICE_IDS.forEach((deviceId) => {
|
6529
|
-
if (
|
6536
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6530
6537
|
const positionWithBp = breakPoint()[deviceId]?.placement?.position;
|
6531
6538
|
|
6532
6539
|
$.get(transforms).push({
|
@@ -6556,12 +6563,13 @@ function Modal($$anchor, $$props) {
|
|
6556
6563
|
$.deep_read_state(placement()),
|
6557
6564
|
$.deep_read_state(useBreakPoint()),
|
6558
6565
|
$.deep_read_state(breakPoint()),
|
6559
|
-
|
6566
|
+
$.deep_read_state(props()),
|
6567
|
+
toCssBorder
|
6560
6568
|
),
|
6561
6569
|
() => {
|
6562
6570
|
let margin = DefaultModalPlacement.margin;
|
6563
6571
|
|
6564
|
-
if (
|
6572
|
+
if (!isCanvasPreview && placement() && placement().margin !== null) {
|
6565
6573
|
margin = placement().margin;
|
6566
6574
|
}
|
6567
6575
|
|
@@ -6572,7 +6580,7 @@ function Modal($$anchor, $$props) {
|
|
6572
6580
|
}
|
6573
6581
|
|
6574
6582
|
DEVICE_IDS.forEach((deviceId) => {
|
6575
|
-
if (
|
6583
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6576
6584
|
const marginWithBp = breakPoint()[deviceId]?.placement?.margin;
|
6577
6585
|
|
6578
6586
|
marginStyle = getMarginStyle(marginWithBp);
|
@@ -6586,6 +6594,18 @@ function Modal($$anchor, $$props) {
|
|
6586
6594
|
|
6587
6595
|
modalStyles.add(marginVariables);
|
6588
6596
|
});
|
6597
|
+
|
6598
|
+
const propsStyle = objToStyle({
|
6599
|
+
width: props().width,
|
6600
|
+
...toCssOverflow(props()),
|
6601
|
+
...toCssShadow(props()),
|
6602
|
+
...toCssRadius(props()),
|
6603
|
+
...toCssBackgroundImage(props()),
|
6604
|
+
...toCssBackgroundColor(props()),
|
6605
|
+
...toCssBorder(props())
|
6606
|
+
});
|
6607
|
+
|
6608
|
+
modalStyles.add(propsStyle);
|
6589
6609
|
}
|
6590
6610
|
);
|
6591
6611
|
|
@@ -6601,24 +6621,6 @@ function Modal($$anchor, $$props) {
|
|
6601
6621
|
$.set(visible, false);
|
6602
6622
|
});
|
6603
6623
|
|
6604
|
-
$.legacy_pre_effect(
|
6605
|
-
() => (
|
6606
|
-
$.deep_read_state(props()),
|
6607
|
-
toCssBorder
|
6608
|
-
),
|
6609
|
-
() => {
|
6610
|
-
$.set(style, objToStyle({
|
6611
|
-
width: props().width,
|
6612
|
-
...toCssOverflow(props()),
|
6613
|
-
...toCssShadow(props()),
|
6614
|
-
...toCssRadius(props()),
|
6615
|
-
...toCssBackgroundImage(props()),
|
6616
|
-
...toCssBackgroundColor(props()),
|
6617
|
-
...toCssBorder(props())
|
6618
|
-
}));
|
6619
|
-
}
|
6620
|
-
);
|
6621
|
-
|
6622
6624
|
$.legacy_pre_effect_reset();
|
6623
6625
|
$.init();
|
6624
6626
|
|
@@ -6692,7 +6694,7 @@ function Modal($$anchor, $$props) {
|
|
6692
6694
|
};
|
6693
6695
|
|
6694
6696
|
$.if(node, ($$render) => {
|
6695
|
-
if (
|
6697
|
+
if (isCanvasPreview) $$render(consequent); else $$render(alternate, false);
|
6696
6698
|
});
|
6697
6699
|
}
|
6698
6700
|
|
@@ -6718,17 +6720,15 @@ function Modal($$anchor, $$props) {
|
|
6718
6720
|
'modal',
|
6719
6721
|
useBreakPoint() ? 'modal-bp' : ''
|
6720
6722
|
].join(' ')),
|
6721
|
-
() =>
|
6722
|
-
Array.from(modalStyles).join(';'),
|
6723
|
-
$.get(style)
|
6724
|
-
].join(' ')
|
6723
|
+
() => Array.from(modalStyles).join(';')
|
6725
6724
|
],
|
6726
6725
|
$.derived_safe_equal
|
6727
6726
|
);
|
6728
6727
|
|
6729
|
-
$.transition(1, div, () =>
|
6728
|
+
$.transition(1, div, () => customAnimationV2, () => ({
|
6730
6729
|
transforms: $.get(transforms),
|
6731
|
-
animationStyle: animation()
|
6730
|
+
animationStyle: animation(),
|
6731
|
+
disabled: !isOnSite
|
6732
6732
|
}));
|
6733
6733
|
|
6734
6734
|
$.append($$anchor, div);
|