@gem-sdk/components 2.1.21 → 2.1.22
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/cjs/product/components/Sku.js +2 -14
- package/dist/cjs/third-party/components/QikifyUpsell.js +22 -10
- package/dist/cjs/third-party/components/QikifyUpsell.liquid.js +3 -46
- package/dist/cjs/third-party/setting/QikifyUpsell.js +11 -1
- package/dist/esm/product/components/Sku.js +3 -15
- package/dist/esm/third-party/components/QikifyUpsell.js +22 -10
- package/dist/esm/third-party/components/QikifyUpsell.liquid.js +3 -46
- package/dist/esm/third-party/setting/QikifyUpsell.js +11 -1
- package/dist/types/index.d.ts +2 -0
- package/package.json +1 -1
|
@@ -5,23 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
var core = require('@gem-sdk/core');
|
|
7
7
|
var Text = require('../../text/components/Text.js');
|
|
8
|
-
var product = require('../helpers/product.js');
|
|
9
8
|
|
|
10
9
|
const ProductSku = ({ setting, builderProps, styles })=>{
|
|
11
10
|
const currentVariant = core.useCurrentVariant();
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
const textContent = setting?.label && setting.label.trim().length ? `${setting.label}: ${currentVariant?.sku || ''}` : `${currentVariant?.sku || ''}`;
|
|
15
|
-
if (isDefaultVariant) {
|
|
16
|
-
return /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
17
|
-
"data-id": builderProps?.uid,
|
|
18
|
-
children: /*#__PURE__*/ jsxRuntime.jsx("p", {
|
|
19
|
-
className: "gp-p-2 gp-text-center gp-text-sm gp-font-semibold gp-text-gray-500",
|
|
20
|
-
children: "This product does not have a SKU"
|
|
21
|
-
})
|
|
22
|
-
});
|
|
23
|
-
}
|
|
24
|
-
if (!isDefaultVariant && !currentVariant?.sku) {
|
|
11
|
+
const textContent = setting?.label?.trim()?.length ? `${setting.label}: ${currentVariant?.sku ?? ''}` : `${currentVariant?.sku ?? ''}`;
|
|
12
|
+
if (!currentVariant?.sku) {
|
|
25
13
|
return /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
26
14
|
"data-id": builderProps?.uid,
|
|
27
15
|
children: /*#__PURE__*/ jsxRuntime.jsx("p", {
|
|
@@ -8,21 +8,33 @@ var ThirdPartyPreview = require('./ThirdPartyPreview.js');
|
|
|
8
8
|
var React = require('react');
|
|
9
9
|
|
|
10
10
|
const WidgetOptions = [
|
|
11
|
-
// {
|
|
12
|
-
// value: 'bogo',
|
|
13
|
-
// label: 'Upsell, Cross-sell',
|
|
14
|
-
// },
|
|
15
11
|
{
|
|
16
|
-
value: '
|
|
17
|
-
label: '
|
|
12
|
+
value: 'bogo_offer',
|
|
13
|
+
label: 'qikify Buy X get Y'
|
|
18
14
|
},
|
|
19
15
|
{
|
|
20
|
-
value: '
|
|
21
|
-
label: '
|
|
16
|
+
value: 'free_gift',
|
|
17
|
+
label: 'qikify Free Gift'
|
|
22
18
|
},
|
|
23
19
|
{
|
|
24
|
-
value: '
|
|
25
|
-
label: '
|
|
20
|
+
value: 'bundle_offer',
|
|
21
|
+
label: 'qikify Product Bundle'
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
value: 'promotion_badge',
|
|
25
|
+
label: 'qikify Promotion Badge'
|
|
26
|
+
},
|
|
27
|
+
{
|
|
28
|
+
value: 'order-goal',
|
|
29
|
+
label: 'qikify Reward Bar'
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
value: 'upsurge_offer',
|
|
33
|
+
label: 'qikify Upsurge Discount'
|
|
34
|
+
},
|
|
35
|
+
{
|
|
36
|
+
value: 'volume_offer',
|
|
37
|
+
label: 'qikify Volume Discount'
|
|
26
38
|
}
|
|
27
39
|
];
|
|
28
40
|
const AppConfig = {
|
|
@@ -2,54 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var thirdParty = require('../helpers/thirdParty.js');
|
|
6
6
|
|
|
7
7
|
const QikifyUpsell = ({ setting, advanced })=>{
|
|
8
|
-
const { align,
|
|
9
|
-
|
|
10
|
-
switch(widgetType){
|
|
11
|
-
// case 'bogo':
|
|
12
|
-
// return 'qbk-bogo-offer';
|
|
13
|
-
case 'bundle':
|
|
14
|
-
return 'qbk-bundle-offer';
|
|
15
|
-
case 'volume':
|
|
16
|
-
return 'qbk-volume-offer';
|
|
17
|
-
case 'upsurge':
|
|
18
|
-
return 'qbk-upsurge-offer';
|
|
19
|
-
// case 'free-gift':
|
|
20
|
-
// return 'qbk-free-gift-offer';
|
|
21
|
-
default:
|
|
22
|
-
return '';
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
return core.template`
|
|
26
|
-
<div
|
|
27
|
-
class="${advanced?.cssClass}"
|
|
28
|
-
style="${{
|
|
29
|
-
...core.makeStyleResponsive('ta', align)
|
|
30
|
-
}}"
|
|
31
|
-
>
|
|
32
|
-
{% assign productData = product %}
|
|
33
|
-
{% if productData %}
|
|
34
|
-
{% liquid
|
|
35
|
-
assign triggerId = productData.selected_or_first_available_variant.id
|
|
36
|
-
assign handle = productData.handle
|
|
37
|
-
assign productId = productData.id
|
|
38
|
-
assign blockId = block.id
|
|
39
|
-
%}
|
|
40
|
-
<div id="${prefix()}-{{ productId }}"></div>
|
|
41
|
-
<qbk-inject-offer
|
|
42
|
-
mount-id="${prefix()}-{{ productId }}"
|
|
43
|
-
handle="{{ handle }}"
|
|
44
|
-
section-id="{{ section.id }}"
|
|
45
|
-
trigger-id="{{ triggerId }}"
|
|
46
|
-
product-id="{{ productId }}"
|
|
47
|
-
type="${widgetType}"
|
|
48
|
-
>
|
|
49
|
-
</qbk-inject-offer>
|
|
50
|
-
{% endif %}
|
|
51
|
-
</div>
|
|
52
|
-
`;
|
|
8
|
+
const { align, appBlockId } = setting ?? {};
|
|
9
|
+
return thirdParty.getLiquidForAppBlock(appBlockId, align, `${advanced?.cssClass ?? ''} !gp-block`);
|
|
53
10
|
};
|
|
54
11
|
|
|
55
12
|
exports.default = QikifyUpsell;
|
|
@@ -44,6 +44,11 @@ const config = {
|
|
|
44
44
|
{
|
|
45
45
|
id: 'setting',
|
|
46
46
|
controls: [
|
|
47
|
+
{
|
|
48
|
+
id: 'appBlockId',
|
|
49
|
+
type: 'input',
|
|
50
|
+
default: ''
|
|
51
|
+
},
|
|
47
52
|
{
|
|
48
53
|
id: 'install',
|
|
49
54
|
type: 'open-link',
|
|
@@ -64,9 +69,14 @@ const config = {
|
|
|
64
69
|
id: 'widgetType',
|
|
65
70
|
label: 'Choose widget',
|
|
66
71
|
type: 'select',
|
|
67
|
-
default: '
|
|
72
|
+
default: 'bogo_offer',
|
|
68
73
|
options: QikifyUpsell.WidgetOptions
|
|
69
74
|
},
|
|
75
|
+
{
|
|
76
|
+
id: 'productHandle',
|
|
77
|
+
type: 'product-handle',
|
|
78
|
+
hide: true
|
|
79
|
+
},
|
|
70
80
|
{
|
|
71
81
|
id: 'align',
|
|
72
82
|
label: 'Alignment',
|
|
@@ -1,23 +1,11 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useCurrentVariant
|
|
2
|
+
import { useCurrentVariant } from '@gem-sdk/core';
|
|
3
3
|
import Text from '../../text/components/Text.js';
|
|
4
|
-
import { checkDefaultVariant } from '../helpers/product.js';
|
|
5
4
|
|
|
6
5
|
const ProductSku = ({ setting, builderProps, styles })=>{
|
|
7
6
|
const currentVariant = useCurrentVariant();
|
|
8
|
-
const
|
|
9
|
-
|
|
10
|
-
const textContent = setting?.label && setting.label.trim().length ? `${setting.label}: ${currentVariant?.sku || ''}` : `${currentVariant?.sku || ''}`;
|
|
11
|
-
if (isDefaultVariant) {
|
|
12
|
-
return /*#__PURE__*/ jsx("div", {
|
|
13
|
-
"data-id": builderProps?.uid,
|
|
14
|
-
children: /*#__PURE__*/ jsx("p", {
|
|
15
|
-
className: "gp-p-2 gp-text-center gp-text-sm gp-font-semibold gp-text-gray-500",
|
|
16
|
-
children: "This product does not have a SKU"
|
|
17
|
-
})
|
|
18
|
-
});
|
|
19
|
-
}
|
|
20
|
-
if (!isDefaultVariant && !currentVariant?.sku) {
|
|
7
|
+
const textContent = setting?.label?.trim()?.length ? `${setting.label}: ${currentVariant?.sku ?? ''}` : `${currentVariant?.sku ?? ''}`;
|
|
8
|
+
if (!currentVariant?.sku) {
|
|
21
9
|
return /*#__PURE__*/ jsx("div", {
|
|
22
10
|
"data-id": builderProps?.uid,
|
|
23
11
|
children: /*#__PURE__*/ jsx("p", {
|
|
@@ -4,21 +4,33 @@ import ThirdPartyPreview from './ThirdPartyPreview.js';
|
|
|
4
4
|
import { useMemo } from 'react';
|
|
5
5
|
|
|
6
6
|
const WidgetOptions = [
|
|
7
|
-
// {
|
|
8
|
-
// value: 'bogo',
|
|
9
|
-
// label: 'Upsell, Cross-sell',
|
|
10
|
-
// },
|
|
11
7
|
{
|
|
12
|
-
value: '
|
|
13
|
-
label: '
|
|
8
|
+
value: 'bogo_offer',
|
|
9
|
+
label: 'qikify Buy X get Y'
|
|
14
10
|
},
|
|
15
11
|
{
|
|
16
|
-
value: '
|
|
17
|
-
label: '
|
|
12
|
+
value: 'free_gift',
|
|
13
|
+
label: 'qikify Free Gift'
|
|
18
14
|
},
|
|
19
15
|
{
|
|
20
|
-
value: '
|
|
21
|
-
label: '
|
|
16
|
+
value: 'bundle_offer',
|
|
17
|
+
label: 'qikify Product Bundle'
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
value: 'promotion_badge',
|
|
21
|
+
label: 'qikify Promotion Badge'
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
value: 'order-goal',
|
|
25
|
+
label: 'qikify Reward Bar'
|
|
26
|
+
},
|
|
27
|
+
{
|
|
28
|
+
value: 'upsurge_offer',
|
|
29
|
+
label: 'qikify Upsurge Discount'
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
value: 'volume_offer',
|
|
33
|
+
label: 'qikify Volume Discount'
|
|
22
34
|
}
|
|
23
35
|
];
|
|
24
36
|
const AppConfig = {
|
|
@@ -1,51 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { getLiquidForAppBlock } from '../helpers/thirdParty.js';
|
|
2
2
|
|
|
3
3
|
const QikifyUpsell = ({ setting, advanced })=>{
|
|
4
|
-
const { align,
|
|
5
|
-
|
|
6
|
-
switch(widgetType){
|
|
7
|
-
// case 'bogo':
|
|
8
|
-
// return 'qbk-bogo-offer';
|
|
9
|
-
case 'bundle':
|
|
10
|
-
return 'qbk-bundle-offer';
|
|
11
|
-
case 'volume':
|
|
12
|
-
return 'qbk-volume-offer';
|
|
13
|
-
case 'upsurge':
|
|
14
|
-
return 'qbk-upsurge-offer';
|
|
15
|
-
// case 'free-gift':
|
|
16
|
-
// return 'qbk-free-gift-offer';
|
|
17
|
-
default:
|
|
18
|
-
return '';
|
|
19
|
-
}
|
|
20
|
-
};
|
|
21
|
-
return template`
|
|
22
|
-
<div
|
|
23
|
-
class="${advanced?.cssClass}"
|
|
24
|
-
style="${{
|
|
25
|
-
...makeStyleResponsive('ta', align)
|
|
26
|
-
}}"
|
|
27
|
-
>
|
|
28
|
-
{% assign productData = product %}
|
|
29
|
-
{% if productData %}
|
|
30
|
-
{% liquid
|
|
31
|
-
assign triggerId = productData.selected_or_first_available_variant.id
|
|
32
|
-
assign handle = productData.handle
|
|
33
|
-
assign productId = productData.id
|
|
34
|
-
assign blockId = block.id
|
|
35
|
-
%}
|
|
36
|
-
<div id="${prefix()}-{{ productId }}"></div>
|
|
37
|
-
<qbk-inject-offer
|
|
38
|
-
mount-id="${prefix()}-{{ productId }}"
|
|
39
|
-
handle="{{ handle }}"
|
|
40
|
-
section-id="{{ section.id }}"
|
|
41
|
-
trigger-id="{{ triggerId }}"
|
|
42
|
-
product-id="{{ productId }}"
|
|
43
|
-
type="${widgetType}"
|
|
44
|
-
>
|
|
45
|
-
</qbk-inject-offer>
|
|
46
|
-
{% endif %}
|
|
47
|
-
</div>
|
|
48
|
-
`;
|
|
4
|
+
const { align, appBlockId } = setting ?? {};
|
|
5
|
+
return getLiquidForAppBlock(appBlockId, align, `${advanced?.cssClass ?? ''} !gp-block`);
|
|
49
6
|
};
|
|
50
7
|
|
|
51
8
|
export { QikifyUpsell as default };
|
|
@@ -40,6 +40,11 @@ const config = {
|
|
|
40
40
|
{
|
|
41
41
|
id: 'setting',
|
|
42
42
|
controls: [
|
|
43
|
+
{
|
|
44
|
+
id: 'appBlockId',
|
|
45
|
+
type: 'input',
|
|
46
|
+
default: ''
|
|
47
|
+
},
|
|
43
48
|
{
|
|
44
49
|
id: 'install',
|
|
45
50
|
type: 'open-link',
|
|
@@ -60,9 +65,14 @@ const config = {
|
|
|
60
65
|
id: 'widgetType',
|
|
61
66
|
label: 'Choose widget',
|
|
62
67
|
type: 'select',
|
|
63
|
-
default: '
|
|
68
|
+
default: 'bogo_offer',
|
|
64
69
|
options: WidgetOptions
|
|
65
70
|
},
|
|
71
|
+
{
|
|
72
|
+
id: 'productHandle',
|
|
73
|
+
type: 'product-handle',
|
|
74
|
+
hide: true
|
|
75
|
+
},
|
|
66
76
|
{
|
|
67
77
|
id: 'align',
|
|
68
78
|
label: 'Alignment',
|
package/dist/types/index.d.ts
CHANGED
|
@@ -2850,6 +2850,8 @@ type QikifyUpsellProps = BaseProps<{
|
|
|
2850
2850
|
align?: ObjectDevices<AlignProp>;
|
|
2851
2851
|
openApp?: any;
|
|
2852
2852
|
install?: any;
|
|
2853
|
+
appBlockId?: string;
|
|
2854
|
+
productHandle?: string;
|
|
2853
2855
|
}>;
|
|
2854
2856
|
declare const QikifyUpsell$1: React.FC<QikifyUpsellProps>;
|
|
2855
2857
|
|