@plaidev/karte-action-sdk 1.1.266-29059851.1bdc68e9 → 1.1.266-29065938.e3ec46c6
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 +76 -84
- package/dist/index.es.js +76 -84
- package/dist/svelte5/hydrate/index.es.js +29 -37
- package/dist/svelte5/index.es.js +29 -37
- package/dist/svelte5/index.front2.es.js +29 -39
- package/package.json +1 -1
package/dist/svelte5/index.es.js
CHANGED
@@ -5251,11 +5251,11 @@ const IMAGE_ROUND_STYLES = {
|
|
5251
5251
|
},
|
5252
5252
|
};
|
5253
5253
|
|
5254
|
-
var root_1$3 = $.template(`<img class="image-img svelte-
|
5254
|
+
var root_1$3 = $.template(`<img class="image-img svelte-rewdem">`);
|
5255
5255
|
|
5256
5256
|
const $$css$g = {
|
5257
|
-
hash: 'svelte-
|
5258
|
-
code: '.image.svelte-
|
5257
|
+
hash: 'svelte-rewdem',
|
5258
|
+
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
5259
|
};
|
5260
5260
|
|
5261
5261
|
function Image($$anchor, $$props) {
|
@@ -5270,6 +5270,7 @@ function Image($$anchor, $$props) {
|
|
5270
5270
|
|
5271
5271
|
const { attributes, element, handleClick } = useClickable(props());
|
5272
5272
|
const aspectVariantStyles = ASPECT_VARIANT[props().aspectVariant]?.getProps();
|
5273
|
+
const width = props().width ?? '100%';
|
5273
5274
|
|
5274
5275
|
$.legacy_pre_effect(
|
5275
5276
|
() => (
|
@@ -5279,7 +5280,8 @@ function Image($$anchor, $$props) {
|
|
5279
5280
|
() => {
|
5280
5281
|
$.set(style, objToStyle({
|
5281
5282
|
...props().borderTopLeftRadius ? toCssRadius(props()) : IMAGE_ROUND_STYLES[props().shape ?? 'square'],
|
5282
|
-
width
|
5283
|
+
width,
|
5284
|
+
flexShrink: String(width).indexOf('px') !== -1 ? 0 : 1,
|
5283
5285
|
height: props().height ?? 'auto',
|
5284
5286
|
aspectRatio: props().aspect ?? aspectVariantStyles?.aspect,
|
5285
5287
|
...toCssCommon(props()),
|
@@ -5306,7 +5308,7 @@ function Image($$anchor, $$props) {
|
|
5306
5308
|
style: $.get(style),
|
5307
5309
|
'data-layer-id': layerId()
|
5308
5310
|
},
|
5309
|
-
'svelte-
|
5311
|
+
'svelte-rewdem'
|
5310
5312
|
));
|
5311
5313
|
|
5312
5314
|
$.event('click', $$element, handleClick);
|
@@ -6345,7 +6347,6 @@ function Modal($$anchor, $$props) {
|
|
6345
6347
|
const backgroundClickSP = $.mutable_state();
|
6346
6348
|
const handle_keydown = $.mutable_state();
|
6347
6349
|
const visible = $.mutable_state();
|
6348
|
-
const style = $.mutable_state();
|
6349
6350
|
let useBreakPoint = $.prop($$props, 'useBreakPoint', 8, false);
|
6350
6351
|
let placement = $.prop($$props, 'placement', 8);
|
6351
6352
|
let breakPoint = $.prop($$props, 'breakPoint', 8);
|
@@ -6356,8 +6357,7 @@ function Modal($$anchor, $$props) {
|
|
6356
6357
|
let closeEventValue = $.prop($$props, 'closeEventValue', 8, null);
|
6357
6358
|
let layerId = $.prop($$props, 'layerId', 8, '');
|
6358
6359
|
const { brandKit } = useBrandKit();
|
6359
|
-
|
6360
|
-
const isOnSite = (document.querySelector('#preview')?.getAttribute('data-on-site') ?? 'true') !== 'false';
|
6360
|
+
const isCanvasPreview = (document.querySelector('#preview')?.getAttribute('data-canvas-preview') ?? 'false') === 'true';
|
6361
6361
|
// モーダル背景の設定
|
6362
6362
|
const isExistBackgroundOverlayValue = placement() && placement().backgroundOverlay !== undefined;
|
6363
6363
|
let backgroundOverlay = $.mutable_state(DefaultModalPlacement.backgroundOverlay);
|
@@ -6403,7 +6403,7 @@ function Modal($$anchor, $$props) {
|
|
6403
6403
|
$.deep_read_state(breakPoint())
|
6404
6404
|
),
|
6405
6405
|
() => {
|
6406
|
-
if (
|
6406
|
+
if (!isCanvasPreview && isExistBackgroundOverlayValue) {
|
6407
6407
|
$.set(backgroundOverlay, placement().backgroundOverlay);
|
6408
6408
|
}
|
6409
6409
|
|
@@ -6509,7 +6509,7 @@ function Modal($$anchor, $$props) {
|
|
6509
6509
|
// 表示位置のスタイルの設定
|
6510
6510
|
let position = DefaultModalPlacement.position;
|
6511
6511
|
|
6512
|
-
if (
|
6512
|
+
if (!isCanvasPreview && placement() && placement().position !== null) {
|
6513
6513
|
position = placement().position;
|
6514
6514
|
}
|
6515
6515
|
|
@@ -6526,7 +6526,7 @@ function Modal($$anchor, $$props) {
|
|
6526
6526
|
$.set(transforms, []);
|
6527
6527
|
|
6528
6528
|
DEVICE_IDS.forEach((deviceId) => {
|
6529
|
-
if (
|
6529
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6530
6530
|
const positionWithBp = breakPoint()[deviceId]?.placement?.position;
|
6531
6531
|
|
6532
6532
|
$.get(transforms).push({
|
@@ -6556,12 +6556,13 @@ function Modal($$anchor, $$props) {
|
|
6556
6556
|
$.deep_read_state(placement()),
|
6557
6557
|
$.deep_read_state(useBreakPoint()),
|
6558
6558
|
$.deep_read_state(breakPoint()),
|
6559
|
-
|
6559
|
+
$.deep_read_state(props()),
|
6560
|
+
toCssBorder
|
6560
6561
|
),
|
6561
6562
|
() => {
|
6562
6563
|
let margin = DefaultModalPlacement.margin;
|
6563
6564
|
|
6564
|
-
if (
|
6565
|
+
if (!isCanvasPreview && placement() && placement().margin !== null) {
|
6565
6566
|
margin = placement().margin;
|
6566
6567
|
}
|
6567
6568
|
|
@@ -6572,7 +6573,7 @@ function Modal($$anchor, $$props) {
|
|
6572
6573
|
}
|
6573
6574
|
|
6574
6575
|
DEVICE_IDS.forEach((deviceId) => {
|
6575
|
-
if (
|
6576
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6576
6577
|
const marginWithBp = breakPoint()[deviceId]?.placement?.margin;
|
6577
6578
|
|
6578
6579
|
marginStyle = getMarginStyle(marginWithBp);
|
@@ -6586,6 +6587,18 @@ function Modal($$anchor, $$props) {
|
|
6586
6587
|
|
6587
6588
|
modalStyles.add(marginVariables);
|
6588
6589
|
});
|
6590
|
+
|
6591
|
+
const propsStyle = objToStyle({
|
6592
|
+
width: props().width,
|
6593
|
+
...toCssOverflow(props()),
|
6594
|
+
...toCssShadow(props()),
|
6595
|
+
...toCssRadius(props()),
|
6596
|
+
...toCssBackgroundImage(props()),
|
6597
|
+
...toCssBackgroundColor(props()),
|
6598
|
+
...toCssBorder(props())
|
6599
|
+
});
|
6600
|
+
|
6601
|
+
modalStyles.add(propsStyle);
|
6589
6602
|
}
|
6590
6603
|
);
|
6591
6604
|
|
@@ -6601,24 +6614,6 @@ function Modal($$anchor, $$props) {
|
|
6601
6614
|
$.set(visible, false);
|
6602
6615
|
});
|
6603
6616
|
|
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
6617
|
$.legacy_pre_effect_reset();
|
6623
6618
|
$.init();
|
6624
6619
|
|
@@ -6692,7 +6687,7 @@ function Modal($$anchor, $$props) {
|
|
6692
6687
|
};
|
6693
6688
|
|
6694
6689
|
$.if(node, ($$render) => {
|
6695
|
-
if (
|
6690
|
+
if (isCanvasPreview) $$render(consequent); else $$render(alternate, false);
|
6696
6691
|
});
|
6697
6692
|
}
|
6698
6693
|
|
@@ -6718,10 +6713,7 @@ function Modal($$anchor, $$props) {
|
|
6718
6713
|
'modal',
|
6719
6714
|
useBreakPoint() ? 'modal-bp' : ''
|
6720
6715
|
].join(' ')),
|
6721
|
-
() =>
|
6722
|
-
Array.from(modalStyles).join(';'),
|
6723
|
-
$.get(style)
|
6724
|
-
].join(' ')
|
6716
|
+
() => Array.from(modalStyles).join(';')
|
6725
6717
|
],
|
6726
6718
|
$.derived_safe_equal
|
6727
6719
|
);
|
@@ -5251,11 +5251,11 @@ const IMAGE_ROUND_STYLES = {
|
|
5251
5251
|
},
|
5252
5252
|
};
|
5253
5253
|
|
5254
|
-
var root_1$3 = $.template(`<img class="image-img svelte-
|
5254
|
+
var root_1$3 = $.template(`<img class="image-img svelte-rewdem">`);
|
5255
5255
|
|
5256
5256
|
const $$css$g = {
|
5257
|
-
hash: 'svelte-
|
5258
|
-
code: '.image.svelte-
|
5257
|
+
hash: 'svelte-rewdem',
|
5258
|
+
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
5259
|
};
|
5260
5260
|
|
5261
5261
|
function Image($$anchor, $$props) {
|
@@ -5270,6 +5270,7 @@ function Image($$anchor, $$props) {
|
|
5270
5270
|
|
5271
5271
|
const { attributes, element, handleClick } = useClickable(props());
|
5272
5272
|
const aspectVariantStyles = ASPECT_VARIANT[props().aspectVariant]?.getProps();
|
5273
|
+
const width = props().width ?? '100%';
|
5273
5274
|
|
5274
5275
|
$.legacy_pre_effect(
|
5275
5276
|
() => (
|
@@ -5279,7 +5280,8 @@ function Image($$anchor, $$props) {
|
|
5279
5280
|
() => {
|
5280
5281
|
$.set(style, objToStyle({
|
5281
5282
|
...props().borderTopLeftRadius ? toCssRadius(props()) : IMAGE_ROUND_STYLES[props().shape ?? 'square'],
|
5282
|
-
width
|
5283
|
+
width,
|
5284
|
+
flexShrink: String(width).indexOf('px') !== -1 ? 0 : 1,
|
5283
5285
|
height: props().height ?? 'auto',
|
5284
5286
|
aspectRatio: props().aspect ?? aspectVariantStyles?.aspect,
|
5285
5287
|
...toCssCommon(props()),
|
@@ -5306,7 +5308,7 @@ function Image($$anchor, $$props) {
|
|
5306
5308
|
style: $.get(style),
|
5307
5309
|
'data-layer-id': layerId()
|
5308
5310
|
},
|
5309
|
-
'svelte-
|
5311
|
+
'svelte-rewdem'
|
5310
5312
|
));
|
5311
5313
|
|
5312
5314
|
$.event('click', $$element, handleClick);
|
@@ -6345,7 +6347,6 @@ function Modal($$anchor, $$props) {
|
|
6345
6347
|
const backgroundClickSP = $.mutable_state();
|
6346
6348
|
const handle_keydown = $.mutable_state();
|
6347
6349
|
const visible = $.mutable_state();
|
6348
|
-
const style = $.mutable_state();
|
6349
6350
|
let useBreakPoint = $.prop($$props, 'useBreakPoint', 8, false);
|
6350
6351
|
let placement = $.prop($$props, 'placement', 8);
|
6351
6352
|
let breakPoint = $.prop($$props, 'breakPoint', 8);
|
@@ -6356,8 +6357,7 @@ function Modal($$anchor, $$props) {
|
|
6356
6357
|
let closeEventValue = $.prop($$props, 'closeEventValue', 8, null);
|
6357
6358
|
let layerId = $.prop($$props, 'layerId', 8, '');
|
6358
6359
|
const { brandKit } = useBrandKit();
|
6359
|
-
|
6360
|
-
const isOnSite = (document.querySelector('#preview')?.getAttribute('data-on-site') ?? 'true') !== 'false';
|
6360
|
+
const isCanvasPreview = (document.querySelector('#preview')?.getAttribute('data-canvas-preview') ?? 'false') === 'true';
|
6361
6361
|
// モーダル背景の設定
|
6362
6362
|
const isExistBackgroundOverlayValue = placement() && placement().backgroundOverlay !== undefined;
|
6363
6363
|
let backgroundOverlay = $.mutable_state(DefaultModalPlacement.backgroundOverlay);
|
@@ -6403,7 +6403,7 @@ function Modal($$anchor, $$props) {
|
|
6403
6403
|
$.deep_read_state(breakPoint())
|
6404
6404
|
),
|
6405
6405
|
() => {
|
6406
|
-
if (
|
6406
|
+
if (!isCanvasPreview && isExistBackgroundOverlayValue) {
|
6407
6407
|
$.set(backgroundOverlay, placement().backgroundOverlay);
|
6408
6408
|
}
|
6409
6409
|
|
@@ -6509,7 +6509,7 @@ function Modal($$anchor, $$props) {
|
|
6509
6509
|
// 表示位置のスタイルの設定
|
6510
6510
|
let position = DefaultModalPlacement.position;
|
6511
6511
|
|
6512
|
-
if (
|
6512
|
+
if (!isCanvasPreview && placement() && placement().position !== null) {
|
6513
6513
|
position = placement().position;
|
6514
6514
|
}
|
6515
6515
|
|
@@ -6526,7 +6526,7 @@ function Modal($$anchor, $$props) {
|
|
6526
6526
|
$.set(transforms, []);
|
6527
6527
|
|
6528
6528
|
DEVICE_IDS.forEach((deviceId) => {
|
6529
|
-
if (
|
6529
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6530
6530
|
const positionWithBp = breakPoint()[deviceId]?.placement?.position;
|
6531
6531
|
|
6532
6532
|
$.get(transforms).push({
|
@@ -6556,12 +6556,13 @@ function Modal($$anchor, $$props) {
|
|
6556
6556
|
$.deep_read_state(placement()),
|
6557
6557
|
$.deep_read_state(useBreakPoint()),
|
6558
6558
|
$.deep_read_state(breakPoint()),
|
6559
|
-
|
6559
|
+
$.deep_read_state(props()),
|
6560
|
+
toCssBorder
|
6560
6561
|
),
|
6561
6562
|
() => {
|
6562
6563
|
let margin = DefaultModalPlacement.margin;
|
6563
6564
|
|
6564
|
-
if (
|
6565
|
+
if (!isCanvasPreview && placement() && placement().margin !== null) {
|
6565
6566
|
margin = placement().margin;
|
6566
6567
|
}
|
6567
6568
|
|
@@ -6572,7 +6573,7 @@ function Modal($$anchor, $$props) {
|
|
6572
6573
|
}
|
6573
6574
|
|
6574
6575
|
DEVICE_IDS.forEach((deviceId) => {
|
6575
|
-
if (
|
6576
|
+
if (!isCanvasPreview && useBreakPoint()) {
|
6576
6577
|
const marginWithBp = breakPoint()[deviceId]?.placement?.margin;
|
6577
6578
|
|
6578
6579
|
marginStyle = getMarginStyle(marginWithBp);
|
@@ -6586,6 +6587,18 @@ function Modal($$anchor, $$props) {
|
|
6586
6587
|
|
6587
6588
|
modalStyles.add(marginVariables);
|
6588
6589
|
});
|
6590
|
+
|
6591
|
+
const propsStyle = objToStyle({
|
6592
|
+
width: props().width,
|
6593
|
+
...toCssOverflow(props()),
|
6594
|
+
...toCssShadow(props()),
|
6595
|
+
...toCssRadius(props()),
|
6596
|
+
...toCssBackgroundImage(props()),
|
6597
|
+
...toCssBackgroundColor(props()),
|
6598
|
+
...toCssBorder(props())
|
6599
|
+
});
|
6600
|
+
|
6601
|
+
modalStyles.add(propsStyle);
|
6589
6602
|
}
|
6590
6603
|
);
|
6591
6604
|
|
@@ -6601,24 +6614,6 @@ function Modal($$anchor, $$props) {
|
|
6601
6614
|
$.set(visible, false);
|
6602
6615
|
});
|
6603
6616
|
|
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
6617
|
$.legacy_pre_effect_reset();
|
6623
6618
|
$.init();
|
6624
6619
|
|
@@ -6692,7 +6687,7 @@ function Modal($$anchor, $$props) {
|
|
6692
6687
|
};
|
6693
6688
|
|
6694
6689
|
$.if(node, ($$render) => {
|
6695
|
-
if (
|
6690
|
+
if (isCanvasPreview) $$render(consequent); else $$render(alternate, false);
|
6696
6691
|
});
|
6697
6692
|
}
|
6698
6693
|
|
@@ -6718,10 +6713,7 @@ function Modal($$anchor, $$props) {
|
|
6718
6713
|
'modal',
|
6719
6714
|
useBreakPoint() ? 'modal-bp' : ''
|
6720
6715
|
].join(' ')),
|
6721
|
-
() =>
|
6722
|
-
Array.from(modalStyles).join(';'),
|
6723
|
-
$.get(style)
|
6724
|
-
].join(' ')
|
6716
|
+
() => Array.from(modalStyles).join(';')
|
6725
6717
|
],
|
6726
6718
|
$.derived_safe_equal
|
6727
6719
|
);
|
@@ -8052,8 +8044,6 @@ function ThumbnailPreview($$anchor, $$props) {
|
|
8052
8044
|
let option = $.prop($$props, 'option', 24, () => ({}));
|
8053
8045
|
let customBrandKit = $.prop($$props, 'customBrandKit', 8, undefined);
|
8054
8046
|
|
8055
|
-
console.log('option', option());
|
8056
|
-
|
8057
8047
|
const getComponent = (key) => {
|
8058
8048
|
return key in sdk ? sdk[key] : null;
|
8059
8049
|
};
|