@gem-sdk/core 1.13.42 → 1.14.0-dev.284
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/components/AddOn.js +1 -18
- package/dist/cjs/components/ComponentWrapper.js +1 -28
- package/dist/cjs/components/ComponentWrapperPreview.js +1 -72
- package/dist/cjs/components/Empty.js +1 -7
- package/dist/cjs/components/Render.js +1 -65
- package/dist/cjs/components/Render.liquid.js +15 -158
- package/dist/cjs/components/RenderBlock.js +1 -54
- package/dist/cjs/components/RenderCustomCode.js +5 -0
- package/dist/cjs/components/RenderPreview.js +1 -66
- package/dist/cjs/components/RenderSection.js +1 -23
- package/dist/cjs/components/constant.js +1 -39
- package/dist/cjs/components/src/product/helpers/variant-presets.js +1 -0
- package/dist/cjs/contexts/AddonContext.js +1 -36
- package/dist/cjs/contexts/BuilderComponent.js +1 -34
- package/dist/cjs/contexts/BuilderContext.js +1 -35
- package/dist/cjs/contexts/BuilderPreviewContext.js +1 -370
- package/dist/cjs/contexts/CartLineContext.js +1 -29
- package/dist/cjs/contexts/CollectionContext.js +1 -38
- package/dist/cjs/contexts/ModalContext.js +1 -47
- package/dist/cjs/contexts/ProductContext.js +1 -149
- package/dist/cjs/contexts/ProductListContext.js +1 -32
- package/dist/cjs/contexts/SectionContext.js +1 -53
- package/dist/cjs/contexts/ShopContext.js +1 -70
- package/dist/cjs/graphql/fragments/analytic.generated.js +2 -6
- package/dist/cjs/graphql/fragments/collection-detail.generated.js +2 -6
- package/dist/cjs/graphql/fragments/collection-product.generated.js +2 -6
- package/dist/cjs/graphql/fragments/collection.generated.js +2 -6
- package/dist/cjs/graphql/fragments/custom-code.generated.js +2 -6
- package/dist/cjs/graphql/fragments/data-seo.generated.js +2 -6
- package/dist/cjs/graphql/fragments/media.generated.js +3 -6
- package/dist/cjs/graphql/fragments/product-little.generated.js +2 -6
- package/dist/cjs/graphql/fragments/product-option-value.generated.js +2 -6
- package/dist/cjs/graphql/fragments/product-option.generated.js +2 -6
- package/dist/cjs/graphql/fragments/product.generated.js +2 -6
- package/dist/cjs/graphql/fragments/published-custom-section.generated.js +2 -6
- package/dist/cjs/graphql/fragments/published-page-section.generated.js +2 -6
- package/dist/cjs/graphql/fragments/published-theme-page.generated.js +2 -6
- package/dist/cjs/graphql/fragments/published-theme-style.generated.js +2 -6
- package/dist/cjs/graphql/fragments/selected-option.generated.js +2 -6
- package/dist/cjs/graphql/fragments/variant.generated.js +2 -6
- package/dist/cjs/graphql/mutations/page-view-up.generated.js +3 -7
- package/dist/cjs/graphql/queries/collection-detail-filter.generated.js +2 -16
- package/dist/cjs/graphql/queries/collection.generated.js +2 -14
- package/dist/cjs/graphql/queries/collections.generated.js +2 -9
- package/dist/cjs/graphql/queries/preview-page.generated.js +2 -14
- package/dist/cjs/graphql/queries/product-little-detail.generated.js +2 -11
- package/dist/cjs/graphql/queries/product-medias.generated.js +2 -8
- package/dist/cjs/graphql/queries/product-value-label.generated.js +7 -0
- package/dist/cjs/graphql/queries/product-variants.generated.js +2 -10
- package/dist/cjs/graphql/queries/products.generated.js +3 -17
- package/dist/cjs/graphql/queries/published-theme-pages.generated.js +2 -14
- package/dist/cjs/graphql/queries/store-property.generated.js +2 -6
- package/dist/cjs/helpers/GlobalEvent.js +1 -19
- package/dist/cjs/helpers/background.js +1 -109
- package/dist/cjs/helpers/borders.js +4 -183
- package/dist/cjs/helpers/clone-deep.js +1 -5
- package/dist/cjs/helpers/cls.js +1 -16
- package/dist/cjs/helpers/colors.js +1 -183
- package/dist/cjs/helpers/compose-advance-style.js +1 -188
- package/dist/cjs/helpers/constant.js +1 -23
- package/dist/cjs/helpers/convert.js +1 -7
- package/dist/cjs/helpers/css-variable.js +1 -7
- package/dist/cjs/helpers/email.js +1 -11
- package/dist/cjs/helpers/flatten-connection.js +1 -9
- package/dist/cjs/helpers/get-resonsive-value.js +1 -31
- package/dist/cjs/helpers/get-shortname.js +1 -92
- package/dist/cjs/helpers/is-browser.js +1 -9
- package/dist/cjs/helpers/is-defined.js +1 -7
- package/dist/cjs/helpers/is-empty-children.js +1 -12
- package/dist/cjs/helpers/is-safari.js +1 -9
- package/dist/cjs/helpers/layout.js +1 -59
- package/dist/cjs/helpers/load-script.js +1 -31
- package/dist/cjs/helpers/make-style.js +1 -128
- package/dist/cjs/helpers/normalize-builder-data.js +1 -23
- package/dist/cjs/helpers/prefetch-queries.js +1 -78
- package/dist/cjs/helpers/product.js +1 -45
- package/dist/cjs/helpers/queries/get-collection.js +1 -220
- package/dist/cjs/helpers/queries/get-collections.js +1 -21
- package/dist/cjs/helpers/queries/get-product-by-slug.js +1 -125
- package/dist/cjs/helpers/queries/get-product.js +1 -154
- package/dist/cjs/helpers/queries/get-products.js +1 -161
- package/dist/cjs/helpers/query.js +1 -29
- package/dist/cjs/helpers/radius.js +6 -134
- package/dist/cjs/helpers/render.js +1 -71
- package/dist/cjs/helpers/shadow.js +1 -56
- package/dist/cjs/helpers/size.js +4 -35
- package/dist/cjs/helpers/spacing.js +1 -43
- package/dist/cjs/helpers/tracking/fpixel.js +1 -28
- package/dist/cjs/helpers/tracking/gtag.js +1 -93
- package/dist/cjs/helpers/tracking/tiktokpixel.js +1 -17
- package/dist/cjs/helpers/typography.js +17 -105
- package/dist/cjs/helpers/variant.js +1 -8
- package/dist/cjs/hooks/cart/use-add-to-cart.js +1 -20
- package/dist/cjs/hooks/cart/use-cart-data.js +1 -28
- package/dist/cjs/hooks/cart/use-cart-discount-codes-update.js +1 -20
- package/dist/cjs/hooks/cart/use-cart-note-update.js +1 -20
- package/dist/cjs/hooks/cart/use-create-cart.js +1 -22
- package/dist/cjs/hooks/cart/use-remove-cart-item.js +1 -20
- package/dist/cjs/hooks/cart/use-update-cart-item.js +1 -20
- package/dist/cjs/hooks/shop/use-collection-query.js +1 -22
- package/dist/cjs/hooks/shop/use-collections-query.js +1 -17
- package/dist/cjs/hooks/shop/use-product-query.js +1 -22
- package/dist/cjs/hooks/shop/use-products-query.js +1 -22
- package/dist/cjs/hooks/shop.js +1 -126
- package/dist/cjs/hooks/use-current-device.js +1 -21
- package/dist/cjs/hooks/use-lazy-video.js +1 -15
- package/dist/cjs/hooks/useCartId.js +1 -44
- package/dist/cjs/hooks/useCartLine.js +1 -11
- package/dist/cjs/hooks/useCartUI.js +1 -48
- package/dist/cjs/hooks/useCollection.js +1 -9
- package/dist/cjs/hooks/useFetchHandle.js +1 -13
- package/dist/cjs/hooks/useFormatMoney.js +1 -58
- package/dist/cjs/hooks/useInitialSwatchesOptions.js +1 -0
- package/dist/cjs/hooks/useIsomorphicLayoutEffect.js +1 -10
- package/dist/cjs/hooks/useLoadScript.js +1 -32
- package/dist/cjs/hooks/useMoney.js +1 -84
- package/dist/cjs/hooks/usePrevious.js +1 -19
- package/dist/cjs/hooks/useProduct.js +1 -124
- package/dist/cjs/hooks/useProductList.js +1 -21
- package/dist/cjs/hooks/useSuspenseFetch.js +1 -27
- package/dist/cjs/hooks/useSwatchesOptions.js +1 -41
- package/dist/cjs/index.js +1 -291
- package/dist/cjs/types/global-style.js +1 -14
- package/dist/cjs/types/shop.js +1 -2
- package/dist/esm/components/AddOn.js +1 -14
- package/dist/esm/components/ComponentWrapper.js +1 -24
- package/dist/esm/components/ComponentWrapperPreview.js +1 -68
- package/dist/esm/components/Empty.js +1 -3
- package/dist/esm/components/Render.js +1 -61
- package/dist/esm/components/Render.liquid.js +15 -153
- package/dist/esm/components/RenderBlock.js +1 -50
- package/dist/esm/components/RenderCustomCode.js +5 -0
- package/dist/esm/components/RenderPreview.js +1 -62
- package/dist/esm/components/RenderSection.js +1 -19
- package/dist/esm/components/constant.js +1 -37
- package/dist/esm/components/src/product/helpers/variant-presets.js +1 -0
- package/dist/esm/contexts/AddonContext.js +1 -32
- package/dist/esm/contexts/BuilderComponent.js +1 -31
- package/dist/esm/contexts/BuilderContext.js +1 -32
- package/dist/esm/contexts/BuilderPreviewContext.js +1 -367
- package/dist/esm/contexts/CartLineContext.js +1 -26
- package/dist/esm/contexts/CollectionContext.js +1 -35
- package/dist/esm/contexts/ModalContext.js +1 -44
- package/dist/esm/contexts/ProductContext.js +1 -146
- package/dist/esm/contexts/ProductListContext.js +1 -28
- package/dist/esm/contexts/SectionContext.js +1 -49
- package/dist/esm/contexts/ShopContext.js +1 -67
- package/dist/esm/graphql/fragments/analytic.generated.js +2 -4
- package/dist/esm/graphql/fragments/collection-detail.generated.js +2 -4
- package/dist/esm/graphql/fragments/collection-product.generated.js +2 -4
- package/dist/esm/graphql/fragments/collection.generated.js +2 -4
- package/dist/esm/graphql/fragments/custom-code.generated.js +2 -4
- package/dist/esm/graphql/fragments/data-seo.generated.js +2 -4
- package/dist/esm/graphql/fragments/media.generated.js +3 -4
- package/dist/esm/graphql/fragments/product-little.generated.js +2 -4
- package/dist/esm/graphql/fragments/product-option-value.generated.js +2 -4
- package/dist/esm/graphql/fragments/product-option.generated.js +2 -4
- package/dist/esm/graphql/fragments/product.generated.js +2 -4
- package/dist/esm/graphql/fragments/published-custom-section.generated.js +2 -4
- package/dist/esm/graphql/fragments/published-page-section.generated.js +2 -4
- package/dist/esm/graphql/fragments/published-theme-page.generated.js +2 -4
- package/dist/esm/graphql/fragments/published-theme-style.generated.js +2 -4
- package/dist/esm/graphql/fragments/selected-option.generated.js +2 -4
- package/dist/esm/graphql/fragments/variant.generated.js +2 -4
- package/dist/esm/graphql/mutations/page-view-up.generated.js +3 -5
- package/dist/esm/graphql/queries/collection-detail-filter.generated.js +10 -22
- package/dist/esm/graphql/queries/collection.generated.js +8 -18
- package/dist/esm/graphql/queries/collections.generated.js +3 -8
- package/dist/esm/graphql/queries/preview-page.generated.js +8 -18
- package/dist/esm/graphql/queries/product-little-detail.generated.js +5 -12
- package/dist/esm/graphql/queries/product-medias.generated.js +2 -6
- package/dist/esm/graphql/queries/product-value-label.generated.js +7 -0
- package/dist/esm/graphql/queries/product-variants.generated.js +4 -10
- package/dist/esm/graphql/queries/products.generated.js +9 -20
- package/dist/esm/graphql/queries/published-theme-pages.generated.js +8 -18
- package/dist/esm/graphql/queries/store-property.generated.js +2 -4
- package/dist/esm/helpers/GlobalEvent.js +1 -15
- package/dist/esm/helpers/background.js +1 -106
- package/dist/esm/helpers/borders.js +4 -175
- package/dist/esm/helpers/clone-deep.js +1 -3
- package/dist/esm/helpers/cls.js +1 -14
- package/dist/esm/helpers/colors.js +1 -168
- package/dist/esm/helpers/compose-advance-style.js +1 -185
- package/dist/esm/helpers/constant.js +1 -19
- package/dist/esm/helpers/convert.js +1 -4
- package/dist/esm/helpers/css-variable.js +1 -5
- package/dist/esm/helpers/email.js +1 -6
- package/dist/esm/helpers/flatten-connection.js +1 -7
- package/dist/esm/helpers/get-resonsive-value.js +1 -27
- package/dist/esm/helpers/get-shortname.js +1 -90
- package/dist/esm/helpers/is-browser.js +1 -5
- package/dist/esm/helpers/is-defined.js +1 -5
- package/dist/esm/helpers/is-empty-children.js +1 -7
- package/dist/esm/helpers/is-safari.js +1 -5
- package/dist/esm/helpers/layout.js +1 -54
- package/dist/esm/helpers/load-script.js +1 -29
- package/dist/esm/helpers/make-style.js +1 -117
- package/dist/esm/helpers/normalize-builder-data.js +1 -21
- package/dist/esm/helpers/prefetch-queries.js +1 -76
- package/dist/esm/helpers/product.js +1 -41
- package/dist/esm/helpers/queries/get-collection.js +1 -217
- package/dist/esm/helpers/queries/get-collections.js +1 -19
- package/dist/esm/helpers/queries/get-product-by-slug.js +1 -123
- package/dist/esm/helpers/queries/get-product.js +1 -150
- package/dist/esm/helpers/queries/get-products.js +1 -159
- package/dist/esm/helpers/query.js +1 -25
- package/dist/esm/helpers/radius.js +6 -127
- package/dist/esm/helpers/render.js +1 -64
- package/dist/esm/helpers/shadow.js +1 -51
- package/dist/esm/helpers/size.js +4 -31
- package/dist/esm/helpers/spacing.js +1 -40
- package/dist/esm/helpers/tracking/fpixel.js +1 -24
- package/dist/esm/helpers/tracking/gtag.js +1 -87
- package/dist/esm/helpers/tracking/tiktokpixel.js +1 -15
- package/dist/esm/helpers/typography.js +17 -96
- package/dist/esm/helpers/variant.js +1 -6
- package/dist/esm/hooks/cart/use-add-to-cart.js +1 -18
- package/dist/esm/hooks/cart/use-cart-data.js +1 -26
- package/dist/esm/hooks/cart/use-cart-discount-codes-update.js +1 -18
- package/dist/esm/hooks/cart/use-cart-note-update.js +1 -18
- package/dist/esm/hooks/cart/use-create-cart.js +1 -20
- package/dist/esm/hooks/cart/use-remove-cart-item.js +1 -18
- package/dist/esm/hooks/cart/use-update-cart-item.js +1 -18
- package/dist/esm/hooks/shop/use-collection-query.js +1 -20
- package/dist/esm/hooks/shop/use-collections-query.js +1 -15
- package/dist/esm/hooks/shop/use-product-query.js +1 -20
- package/dist/esm/hooks/shop/use-products-query.js +1 -20
- package/dist/esm/hooks/shop.js +1 -111
- package/dist/esm/hooks/use-current-device.js +1 -19
- package/dist/esm/hooks/use-lazy-video.js +1 -13
- package/dist/esm/hooks/useCartId.js +1 -40
- package/dist/esm/hooks/useCartLine.js +1 -7
- package/dist/esm/hooks/useCartUI.js +1 -44
- package/dist/esm/hooks/useCollection.js +1 -7
- package/dist/esm/hooks/useFetchHandle.js +1 -11
- package/dist/esm/hooks/useFormatMoney.js +1 -56
- package/dist/esm/hooks/useInitialSwatchesOptions.js +1 -0
- package/dist/esm/hooks/useIsomorphicLayoutEffect.js +1 -6
- package/dist/esm/hooks/useLoadScript.js +1 -28
- package/dist/esm/hooks/useMoney.js +1 -80
- package/dist/esm/hooks/usePrevious.js +1 -17
- package/dist/esm/hooks/useProduct.js +1 -111
- package/dist/esm/hooks/useProductList.js +1 -16
- package/dist/esm/hooks/useSuspenseFetch.js +1 -23
- package/dist/esm/hooks/useSwatchesOptions.js +1 -37
- package/dist/esm/index.js +1 -92
- package/dist/esm/types/global-style.js +1 -11
- package/dist/types/index.d.ts +1212 -1031
- package/package.json +3 -3
|
@@ -1,159 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { calculateFirstProduct } from './get-collection.js';
|
|
3
|
-
import { fetchVariants, fetchMedias } from './get-product.js';
|
|
4
|
-
|
|
5
|
-
const getProducts = async (fetcher, { ids, isSample, isStorefront })=>{
|
|
6
|
-
const products = await loopFetchProducts(fetcher, {
|
|
7
|
-
ids,
|
|
8
|
-
isSample,
|
|
9
|
-
isStorefront
|
|
10
|
-
});
|
|
11
|
-
if (!products) {
|
|
12
|
-
throw new Error('Product not found');
|
|
13
|
-
}
|
|
14
|
-
const [mergedVariant, mergedMedias] = await Promise.all([
|
|
15
|
-
mergeVariantsToProducts({
|
|
16
|
-
fetcher,
|
|
17
|
-
products,
|
|
18
|
-
isSample,
|
|
19
|
-
isStorefront
|
|
20
|
-
}),
|
|
21
|
-
mergeMediasToProducts({
|
|
22
|
-
fetcher,
|
|
23
|
-
products,
|
|
24
|
-
isSample,
|
|
25
|
-
isStorefront
|
|
26
|
-
})
|
|
27
|
-
]);
|
|
28
|
-
return {
|
|
29
|
-
...products,
|
|
30
|
-
products: {
|
|
31
|
-
...products.products,
|
|
32
|
-
edges: products.products?.edges.map((edge)=>{
|
|
33
|
-
const medias = mergedMedias.find((item)=>item.productId === edge.node?.baseID);
|
|
34
|
-
const variants = mergedVariant.find((item)=>item.productId === edge.node?.baseID);
|
|
35
|
-
if (edge.node) {
|
|
36
|
-
return {
|
|
37
|
-
...edge,
|
|
38
|
-
node: {
|
|
39
|
-
...edge.node,
|
|
40
|
-
variants: {
|
|
41
|
-
...edge.node?.variants,
|
|
42
|
-
edges: variants?.items ?? []
|
|
43
|
-
},
|
|
44
|
-
medias: {
|
|
45
|
-
...edge.node?.medias,
|
|
46
|
-
edges: medias?.items ?? []
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
};
|
|
50
|
-
}
|
|
51
|
-
return edge;
|
|
52
|
-
}) ?? []
|
|
53
|
-
}
|
|
54
|
-
};
|
|
55
|
-
};
|
|
56
|
-
const fetchProducts = async (fetcher, variables)=>{
|
|
57
|
-
return fetcher([
|
|
58
|
-
ProductsDocument,
|
|
59
|
-
variables
|
|
60
|
-
]);
|
|
61
|
-
};
|
|
62
|
-
const loopFetchProducts = async (fetcher, { ids, isSample, isStorefront })=>{
|
|
63
|
-
const numberOfProducts = (ids?.length == 0 ? 4 : ids?.length) ?? 4;
|
|
64
|
-
const productsPerPage = 8; // number of products per page
|
|
65
|
-
let variables; // variables of collection query
|
|
66
|
-
let productAfterFetcher; // product after of collection query
|
|
67
|
-
let dataProducts; // data of collection query
|
|
68
|
-
let hasNextPage; //
|
|
69
|
-
let firstProducts;
|
|
70
|
-
let currentPage = 1;
|
|
71
|
-
// counter number of queries
|
|
72
|
-
const pages = Math.ceil(numberOfProducts / productsPerPage);
|
|
73
|
-
while(currentPage <= pages && hasNextPage !== false){
|
|
74
|
-
variables = {
|
|
75
|
-
first: calculateFirstProduct(numberOfProducts, currentPage, productsPerPage),
|
|
76
|
-
firstMedia: 1,
|
|
77
|
-
firstVariant: 1,
|
|
78
|
-
orderBy: {
|
|
79
|
-
field: 'PLATFORM_CREATED_AT',
|
|
80
|
-
direction: 'DESC'
|
|
81
|
-
},
|
|
82
|
-
orderByMedia: {
|
|
83
|
-
field: 'POSITION',
|
|
84
|
-
direction: 'ASC'
|
|
85
|
-
},
|
|
86
|
-
where: {
|
|
87
|
-
status: 'ACTIVE',
|
|
88
|
-
isSample,
|
|
89
|
-
...isStorefront && {
|
|
90
|
-
isStorefront
|
|
91
|
-
},
|
|
92
|
-
...ids?.length ? {
|
|
93
|
-
baseIDIn: ids
|
|
94
|
-
} : {}
|
|
95
|
-
},
|
|
96
|
-
after: productAfterFetcher
|
|
97
|
-
};
|
|
98
|
-
const pageData = await fetchProducts(fetcher, variables);
|
|
99
|
-
productAfterFetcher = pageData?.products?.pageInfo?.endCursor;
|
|
100
|
-
if (currentPage === 1) {
|
|
101
|
-
dataProducts = pageData; // set data of first page
|
|
102
|
-
firstProducts = pageData;
|
|
103
|
-
} else if (firstProducts?.products && pageData?.products?.edges.length) {
|
|
104
|
-
// concat new values to the old ones
|
|
105
|
-
firstProducts.products = {
|
|
106
|
-
edges: firstProducts.products.edges.concat(pageData?.products?.edges),
|
|
107
|
-
pageInfo: pageData?.products?.pageInfo
|
|
108
|
-
};
|
|
109
|
-
}
|
|
110
|
-
currentPage++;
|
|
111
|
-
// hasNextPage = false if there is no more pages then break the loop
|
|
112
|
-
if (!firstProducts) {
|
|
113
|
-
hasNextPage = false;
|
|
114
|
-
break;
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
return dataProducts;
|
|
118
|
-
};
|
|
119
|
-
const mergeVariantsToProducts = async ({ fetcher, products, isSample, isStorefront })=>{
|
|
120
|
-
const productsWithVariants = await Promise.all(products?.products?.edges?.map(async (product)=>{
|
|
121
|
-
const variants = await fetchVariants(fetcher, {
|
|
122
|
-
id: product?.node?.baseID,
|
|
123
|
-
isSample,
|
|
124
|
-
isStorefront
|
|
125
|
-
});
|
|
126
|
-
return {
|
|
127
|
-
productId: product?.node?.baseID,
|
|
128
|
-
items: variants
|
|
129
|
-
};
|
|
130
|
-
}) ?? []);
|
|
131
|
-
return productsWithVariants;
|
|
132
|
-
};
|
|
133
|
-
const mergeMediasToProducts = async ({ fetcher, products, isSample, isStorefront })=>{
|
|
134
|
-
const productsWithMedias = await Promise.all(products?.products?.edges?.map(async (product)=>{
|
|
135
|
-
const medias = await fetchMedias(fetcher, {
|
|
136
|
-
id: product?.node?.baseID,
|
|
137
|
-
isSample,
|
|
138
|
-
isStorefront
|
|
139
|
-
});
|
|
140
|
-
return {
|
|
141
|
-
productId: product?.node?.baseID,
|
|
142
|
-
items: medias
|
|
143
|
-
};
|
|
144
|
-
}) ?? []);
|
|
145
|
-
return productsWithMedias;
|
|
146
|
-
}; // future can be used for fetching products with paging ids
|
|
147
|
-
// const pagingQuery = (
|
|
148
|
-
// data: string[],
|
|
149
|
-
// currentPage: number,
|
|
150
|
-
// productsPerPage: number,
|
|
151
|
-
// first: number,
|
|
152
|
-
// ): string[] => {
|
|
153
|
-
// return data.slice(
|
|
154
|
-
// (currentPage - 1) * productsPerPage,
|
|
155
|
-
// (currentPage - 1) * productsPerPage + first,
|
|
156
|
-
// );
|
|
157
|
-
// };
|
|
158
|
-
|
|
159
|
-
export { getProducts };
|
|
1
|
+
import{ProductsDocument as e}from"../../graphql/queries/products.generated.js";import{calculateFirstProduct as t}from"./get-collection.js";import{fetchVariants as r,fetchMedias as o}from"./get-product.js";let getProducts=async(e,{ids:t,isSample:r,isStorefront:o,defaultSelectedProductCount:d})=>{let s=await loopFetchProducts(e,{ids:t,isSample:r,isStorefront:o,defaultSelectedProductCount:d});if(!s)throw Error("Product not found");let[a,n]=await Promise.all([mergeVariantsToProducts({fetcher:e,products:s,isSample:r,isStorefront:o}),mergeMediasToProducts({fetcher:e,products:s,isSample:r,isStorefront:o})]);return{...s,products:{...s.products,edges:s.products?.edges.map(e=>{let t=n.find(t=>t.productId===e.node?.baseID),r=a.find(t=>t.productId===e.node?.baseID);return e.node?{...e,node:{...e.node,variants:{...e.node?.variants,edges:r?.items??[]},medias:{...e.node?.medias,edges:t?.items??[]}}}:e})??[]}}},fetchProducts=async(t,r)=>t([e,r]),loopFetchProducts=async(e,{ids:r,isSample:o,isStorefront:d,defaultSelectedProductCount:s})=>{let a,n,c,i,u;let p=s||4,l=(r?.length==0?p:r?.length)??p,g=1,m=Math.ceil(l/8);for(;g<=m&&!1!==i;){a={first:t(l,g,8),firstMedia:1,firstVariant:1,orderBy:{field:"PLATFORM_CREATED_AT",direction:"DESC"},orderByMedia:{field:"POSITION",direction:"ASC"},where:{status:"ACTIVE",isSample:o,...d&&{isStorefront:d},...r?.length?{baseIDIn:r}:{}},after:n};let s=await fetchProducts(e,a);if(n=s?.products?.pageInfo?.endCursor,1===g?(c=s,u=s):u?.products&&s?.products?.edges.length&&(u.products={edges:u.products.edges.concat(s?.products?.edges),pageInfo:s?.products?.pageInfo}),g++,!u){i=!1;break}}return c},mergeVariantsToProducts=async({fetcher:e,products:t,isSample:o,isStorefront:d})=>{let s=await Promise.all(t?.products?.edges?.map(async t=>{let s=await r(e,{id:t?.node?.baseID,isSample:o,isStorefront:d});return{productId:t?.node?.baseID,items:s}})??[]);return s},mergeMediasToProducts=async({fetcher:e,products:t,isSample:r,isStorefront:d})=>{let s=await Promise.all(t?.products?.edges?.map(async t=>{let s=await o(e,{id:t?.node?.baseID,isSample:r,isStorefront:d});return{productId:t?.node?.baseID,items:s}})??[]);return s};export{getProducts};
|
|
@@ -1,25 +1 @@
|
|
|
1
|
-
|
|
2
|
-
return [
|
|
3
|
-
'query/product',
|
|
4
|
-
args
|
|
5
|
-
];
|
|
6
|
-
};
|
|
7
|
-
const generateCollectionQueryKey = (args)=>{
|
|
8
|
-
return [
|
|
9
|
-
'query/collection',
|
|
10
|
-
args
|
|
11
|
-
];
|
|
12
|
-
};
|
|
13
|
-
const generateProductsQueryKey = (args)=>{
|
|
14
|
-
return [
|
|
15
|
-
'query/products',
|
|
16
|
-
{
|
|
17
|
-
...args,
|
|
18
|
-
ids: [
|
|
19
|
-
...args.ids
|
|
20
|
-
].sort()
|
|
21
|
-
}
|
|
22
|
-
];
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
export { generateCollectionQueryKey, generateProductQueryKey, generateProductsQueryKey };
|
|
1
|
+
let generateProductQueryKey=e=>["query/product",e],generateCollectionQueryKey=e=>["query/collection",e],generateProductsQueryKey=e=>["query/products",{...e,ids:[...e.ids].sort()}];export{generateCollectionQueryKey,generateProductQueryKey,generateProductsQueryKey};
|
|
@@ -1,127 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
'custom',
|
|
8
|
-
'circle'
|
|
9
|
-
].includes(corner.radiusType)) return makeStyle({
|
|
10
|
-
bblr: corner.bblr,
|
|
11
|
-
bbrr: corner.bbrr,
|
|
12
|
-
btlr: corner.btlr,
|
|
13
|
-
btrr: corner.btrr
|
|
14
|
-
});
|
|
15
|
-
return makeStyle({
|
|
16
|
-
radius: `var(--g-radius-${corner.radiusType})`
|
|
17
|
-
});
|
|
18
|
-
};
|
|
19
|
-
const getRadiusCSSFromGlobal = (state, key, device)=>{
|
|
20
|
-
if (!key || !state) return {};
|
|
21
|
-
const suffix = device && device !== 'desktop' ? devicesMapping?.[device] : '';
|
|
22
|
-
const mState = stateMapping?.[state];
|
|
23
|
-
return {
|
|
24
|
-
[`-${mState}-radius${suffix}`]: `var(--g-radius-${key})`
|
|
25
|
-
};
|
|
26
|
-
};
|
|
27
|
-
const getCustomRadius = (state, radius, device)=>{
|
|
28
|
-
if (!radius || !state || radius.radiusType !== 'custom') return {};
|
|
29
|
-
const suffix = device && device !== 'desktop' ? devicesMapping?.[device] : '';
|
|
30
|
-
const mState = stateMapping?.[state];
|
|
31
|
-
return {
|
|
32
|
-
[`-${mState}-bblr${suffix}`]: radius.bblr,
|
|
33
|
-
[`-${mState}-bbrr${suffix}`]: radius.bbrr,
|
|
34
|
-
[`-${mState}-btlr${suffix}`]: radius.btlr,
|
|
35
|
-
[`-${mState}-btrr${suffix}`]: radius.btrr
|
|
36
|
-
};
|
|
37
|
-
};
|
|
38
|
-
const composeRadius = (value)=>{
|
|
39
|
-
if (!value) return {};
|
|
40
|
-
if ('desktop' in value || 'tablet' in value || 'mobile' in value) {
|
|
41
|
-
return composeRadiusResponsiveState(value);
|
|
42
|
-
}
|
|
43
|
-
return composeRadiusState(value);
|
|
44
|
-
};
|
|
45
|
-
const composeRadiusState = (radiusValue, device)=>{
|
|
46
|
-
const style = {};
|
|
47
|
-
switch(radiusValue?.normal?.radiusType){
|
|
48
|
-
case 'medium':
|
|
49
|
-
case 'large':
|
|
50
|
-
case 'small':
|
|
51
|
-
Object.assign(style, getRadiusCSSFromGlobal('normal', radiusValue?.normal?.radiusType, device));
|
|
52
|
-
break;
|
|
53
|
-
case 'circle':
|
|
54
|
-
case 'none':
|
|
55
|
-
case 'custom':
|
|
56
|
-
Object.assign(style, getCustomRadius('normal', radiusValue.normal, device));
|
|
57
|
-
break;
|
|
58
|
-
}
|
|
59
|
-
switch(radiusValue?.hover?.radiusType){
|
|
60
|
-
case 'medium':
|
|
61
|
-
case 'large':
|
|
62
|
-
case 'small':
|
|
63
|
-
Object.assign(style, getRadiusCSSFromGlobal('hover', radiusValue?.hover?.radiusType, device));
|
|
64
|
-
break;
|
|
65
|
-
case 'circle':
|
|
66
|
-
case 'none':
|
|
67
|
-
case 'custom':
|
|
68
|
-
Object.assign(style, getCustomRadius('hover', radiusValue.hover, device));
|
|
69
|
-
break;
|
|
70
|
-
}
|
|
71
|
-
switch(radiusValue?.focus?.radiusType){
|
|
72
|
-
case 'medium':
|
|
73
|
-
case 'large':
|
|
74
|
-
case 'small':
|
|
75
|
-
Object.assign(style, getRadiusCSSFromGlobal('focus', radiusValue?.focus?.radiusType, device));
|
|
76
|
-
break;
|
|
77
|
-
case 'circle':
|
|
78
|
-
case 'none':
|
|
79
|
-
case 'custom':
|
|
80
|
-
Object.assign(style, getCustomRadius('focus', radiusValue.focus, device));
|
|
81
|
-
break;
|
|
82
|
-
}
|
|
83
|
-
return style;
|
|
84
|
-
};
|
|
85
|
-
const composeRadiusResponsiveState = (radiusValue)=>{
|
|
86
|
-
const style = {};
|
|
87
|
-
Object.assign(style, composeRadiusState(radiusValue?.desktop, 'desktop'));
|
|
88
|
-
Object.assign(style, composeRadiusState(radiusValue?.tablet, 'tablet'));
|
|
89
|
-
Object.assign(style, composeRadiusState(radiusValue?.mobile, 'mobile'));
|
|
90
|
-
return style;
|
|
91
|
-
};
|
|
92
|
-
const getRadiusStyleActiveState = (radiusValue)=>{
|
|
93
|
-
if (radiusValue?.active?.radiusType === 'custom') {
|
|
94
|
-
return getCustomRadius('normal', radiusValue?.active);
|
|
95
|
-
}
|
|
96
|
-
return getRadiusCSSFromGlobal('normal', radiusValue?.active?.radiusType);
|
|
97
|
-
};
|
|
98
|
-
const composeCornerCss = (value)=>{
|
|
99
|
-
if (!value) {
|
|
100
|
-
return;
|
|
101
|
-
}
|
|
102
|
-
const { radiusType, bblr, bbrr, btlr, btrr } = value;
|
|
103
|
-
let radiusValue = undefined;
|
|
104
|
-
switch(radiusType){
|
|
105
|
-
case 'medium':
|
|
106
|
-
case 'large':
|
|
107
|
-
case 'small':
|
|
108
|
-
radiusValue = `border-radius: var(--g-radius-${radiusType});`;
|
|
109
|
-
break;
|
|
110
|
-
case 'circle':
|
|
111
|
-
case 'none':
|
|
112
|
-
case 'custom':
|
|
113
|
-
radiusValue = `
|
|
114
|
-
${bblr ? `border-bottom-left-radius: ${bblr};` : ''}
|
|
115
|
-
|
|
116
|
-
${bbrr ? `border-bottom-right-radius: ${bbrr};` : ''}
|
|
117
|
-
|
|
118
|
-
${btlr ? `border-top-left-radius: ${btlr};` : ''}
|
|
119
|
-
|
|
120
|
-
${btrr ? `border-top-right-radius: ${btrr};` : ''}
|
|
121
|
-
`;
|
|
122
|
-
break;
|
|
123
|
-
}
|
|
124
|
-
return radiusValue;
|
|
125
|
-
};
|
|
126
|
-
|
|
127
|
-
export { composeCornerCss, composeRadius, getCornerCSSFromGlobal, getCustomRadius, getRadiusCSSFromGlobal, getRadiusStyleActiveState };
|
|
1
|
+
import{devicesMapping as e,stateMapping as s}from"./constant.js";import{makeStyle as a}from"./make-style.js";let getCornerCSSFromGlobal=e=>e?.radiusType?["custom","circle"].includes(e?.radiusType)?a({bblr:e.bblr,bbrr:e.bbrr,btlr:e.btlr,btrr:e.btrr}):a({radius:`var(--g-radius-${e?.radiusType})`}):{},getRadiusCSSFromGlobal=(a,t,r)=>{if(!t||!a)return{};let o=r&&"desktop"!==r?e?.[r]:"",i=s?.[a];return{[`-${i}-radius${o}`]:`var(--g-radius-${t})`}},getCustomRadius=(a,t,r)=>{if(!t||!a||t?.radiusType!=="custom")return{};let o=r&&"desktop"!==r?e?.[r]:"",i=s?.[a];return{[`-${i}-bblr${o}`]:t.bblr,[`-${i}-bbrr${o}`]:t.bbrr,[`-${i}-btlr${o}`]:t.btlr,[`-${i}-btrr${o}`]:t.btrr}},composeRadius=e=>e?"desktop"in e||"tablet"in e||"mobile"in e?composeRadiusResponsiveState(e):composeRadiusState(e):{},composeRadiusResponsive=e=>{let s={};return Object.assign(s,getCustomRadius("normal",e?.desktop,"desktop")),Object.assign(s,getCustomRadius("normal",e?.tablet,"tablet")),Object.assign(s,getCustomRadius("normal",e?.mobile,"mobile")),s},composeRadiusState=(e,s)=>{let a={};switch(e?.normal?.radiusType){case"medium":case"large":case"small":Object.assign(a,getRadiusCSSFromGlobal("normal",e?.normal?.radiusType,s));break;case"circle":case"none":case"custom":Object.assign(a,getCustomRadius("normal",e.normal,s))}switch(e?.hover?.radiusType){case"medium":case"large":case"small":Object.assign(a,getRadiusCSSFromGlobal("hover",e?.hover?.radiusType,s));break;case"circle":case"none":case"custom":Object.assign(a,getCustomRadius("hover",e.hover,s))}switch(e?.focus?.radiusType){case"medium":case"large":case"small":Object.assign(a,getRadiusCSSFromGlobal("focus",e?.focus?.radiusType,s));break;case"circle":case"none":case"custom":Object.assign(a,getCustomRadius("focus",e.focus,s))}return a},composeRadiusResponsiveState=e=>{let s={};return Object.assign(s,composeRadiusState(e?.desktop,"desktop")),Object.assign(s,composeRadiusState(e?.tablet,"tablet")),Object.assign(s,composeRadiusState(e?.mobile,"mobile")),s},getRadiusStyleActiveState=e=>e?.active?.radiusType==="custom"?getCustomRadius("normal",e?.active):getRadiusCSSFromGlobal("normal",e?.active?.radiusType),composeCornerCss=(e,s=!1)=>{let a;if(!e)return"";let{radiusType:t,bblr:r,bbrr:o,btlr:i,btrr:u}=e,c=s?" !important":"";switch(t){case"medium":case"large":case"small":a=`border-radius: var(--g-radius-${t});`;break;case"circle":case"none":case"custom":a=`
|
|
2
|
+
${r?`border-bottom-left-radius: ${r}${c};`:""}
|
|
3
|
+
${o?`border-bottom-right-radius: ${o}${c};`:""}
|
|
4
|
+
${i?`border-top-left-radius: ${i}${c};`:""}
|
|
5
|
+
${u?`border-top-right-radius: ${u}${c};`:""}
|
|
6
|
+
`}return a};export{composeCornerCss,composeRadius,composeRadiusResponsive,getCornerCSSFromGlobal,getCustomRadius,getRadiusCSSFromGlobal,getRadiusStyleActiveState};
|
|
@@ -1,64 +1 @@
|
|
|
1
|
-
|
|
2
|
-
const isObject = (obj)=>{
|
|
3
|
-
if (typeof obj === 'object' && !Array.isArray(obj) && obj !== null) {
|
|
4
|
-
return true;
|
|
5
|
-
}
|
|
6
|
-
return false;
|
|
7
|
-
};
|
|
8
|
-
const props = (strings, ...keys)=>{
|
|
9
|
-
const props = keys[0];
|
|
10
|
-
const propsArr = [];
|
|
11
|
-
for(const attr in props){
|
|
12
|
-
if (Object.hasOwnProperty.call(props, attr)) {
|
|
13
|
-
const val = props[attr];
|
|
14
|
-
if (![
|
|
15
|
-
'symbol',
|
|
16
|
-
'object',
|
|
17
|
-
'function'
|
|
18
|
-
].includes(typeof val)) {
|
|
19
|
-
if (val) {
|
|
20
|
-
propsArr.push(`${attr}="${val}"`);
|
|
21
|
-
} else {
|
|
22
|
-
propsArr.push(`${attr}`);
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
return propsArr.join(' ');
|
|
28
|
-
};
|
|
29
|
-
const styles = (strings, ...keys)=>{
|
|
30
|
-
const styles = keys[0];
|
|
31
|
-
const styleArr = [];
|
|
32
|
-
for(const attr in styles){
|
|
33
|
-
if (Object.hasOwnProperty.call(styles, attr)) {
|
|
34
|
-
const val = styles[attr];
|
|
35
|
-
if (val !== undefined && val !== false) styleArr.push(`${attr}:${val}`);
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
return styleArr.join(';');
|
|
39
|
-
};
|
|
40
|
-
const dataStringify = (obj)=>{
|
|
41
|
-
return JSON.stringify(obj).replace(/\\"/g, '"');
|
|
42
|
-
};
|
|
43
|
-
const template = (strings, ...keys)=>{
|
|
44
|
-
let str = '';
|
|
45
|
-
strings.forEach((item, index)=>{
|
|
46
|
-
str += item;
|
|
47
|
-
if (keys[index] !== undefined) {
|
|
48
|
-
if (isObject(keys[index])) {
|
|
49
|
-
if (/style=["|']/.test(item)) {
|
|
50
|
-
str += styles`${keys[index]}`;
|
|
51
|
-
} else {
|
|
52
|
-
str += props`${keys[index]}`;
|
|
53
|
-
}
|
|
54
|
-
} else {
|
|
55
|
-
str += keys[index];
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
});
|
|
59
|
-
return str;
|
|
60
|
-
};
|
|
61
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
62
|
-
const composeMemo = (fn, _)=>fn();
|
|
63
|
-
|
|
64
|
-
export { RenderIf, composeMemo, dataStringify, props, styles, template };
|
|
1
|
+
let RenderIf=(e,t,r)=>e?"string"==typeof t?t:t():("string"==typeof r?r:r?.())??"",isObject=e=>!("object"!=typeof e||Array.isArray(e))&&null!==e,props=(e,...t)=>{let r=t[0],o=[];for(let e in r)if(Object.hasOwnProperty.call(r,e)){let t=r[e];["symbol","object","function"].includes(typeof t)||(t?o.push(`${e}="${t}"`):o.push(`${e}`))}return o.join(" ")},styles=(e,...t)=>{let r=t[0],o=[];for(let e in r)if(Object.hasOwnProperty.call(r,e)){let t=r[e];void 0!==t&&!1!==t&&o.push(`${e}:${t}`)}return o.join(";")},dataStringify=e=>JSON.stringify(e).replace(/\\"/g,'"'),template=(e,...t)=>{let r="";return e.forEach((e,o)=>{r+=e,void 0!==t[o]&&(isObject(t[o])?/style=["|']/.test(e)?r+=styles`${t[o]}`:r+=props`${t[o]}`:r+=t[o])}),r},composeMemo=(e,t)=>e();export{RenderIf,composeMemo,dataStringify,props,styles,template};
|
|
@@ -1,51 +1 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { stateMapping } from './constant.js';
|
|
3
|
-
import { getShortName } from './get-shortname.js';
|
|
4
|
-
|
|
5
|
-
const parseValueWithUnit = (valueWithUnit)=>{
|
|
6
|
-
const matches = valueWithUnit.match(/(\d+)(.+)/);
|
|
7
|
-
if (matches && matches.length === 3) {
|
|
8
|
-
const value = Number(matches[1] ?? 0);
|
|
9
|
-
const unit = matches[2];
|
|
10
|
-
return {
|
|
11
|
-
value,
|
|
12
|
-
unit: unit ?? 'px'
|
|
13
|
-
};
|
|
14
|
-
}
|
|
15
|
-
return {
|
|
16
|
-
value: 0,
|
|
17
|
-
unit: 'px'
|
|
18
|
-
};
|
|
19
|
-
};
|
|
20
|
-
const getStyleShadow = (shadowStyle, isActiveState = false)=>{
|
|
21
|
-
const { styleAppliedFor, value, isEnableShadow } = shadowStyle || {};
|
|
22
|
-
let { state } = shadowStyle || {};
|
|
23
|
-
if (!state) state = 'normal';
|
|
24
|
-
if (!styleAppliedFor || !value) return {};
|
|
25
|
-
if (typeof value.distance == 'undefined') return {};
|
|
26
|
-
const { value: distance, unit: unitDistance } = parseValueWithUnit(`${value?.distance}`);
|
|
27
|
-
return {
|
|
28
|
-
[`-${!isActiveState ? stateMapping?.[state] : ''}-${getShortName(styleAppliedFor)}`]: isEnableShadow ? `${Math.cos(parseFloat(`${value?.angle}`) * Math.PI / 180) * parseFloat(`${distance}`)}${unitDistance} ${Math.sin(parseFloat(`${value?.angle}`) * Math.PI / 180) * parseFloat(`${distance}`)}${unitDistance} ${value?.blur} ${styleAppliedFor === 'box-shadow' ? value?.spread + ' ' : ''}${getSingleColorVariable(value?.color)}` : 'none'
|
|
29
|
-
};
|
|
30
|
-
};
|
|
31
|
-
const getStyleShadowState = (shadow, styleAppliedFor, isEnableShadow)=>{
|
|
32
|
-
if (!shadow || !styleAppliedFor) return {};
|
|
33
|
-
const style = {};
|
|
34
|
-
for (const [key, value] of Object.entries(shadow)){
|
|
35
|
-
Object.assign(style, getStyleShadow({
|
|
36
|
-
value: value,
|
|
37
|
-
state: key,
|
|
38
|
-
styleAppliedFor,
|
|
39
|
-
isEnableShadow: isEnableShadow?.[key]
|
|
40
|
-
}));
|
|
41
|
-
}
|
|
42
|
-
return style;
|
|
43
|
-
};
|
|
44
|
-
const composeShadowCss = ({ hasBoxShadow, boxShadowValue })=>{
|
|
45
|
-
if (!hasBoxShadow) return undefined;
|
|
46
|
-
if (!boxShadowValue) return undefined;
|
|
47
|
-
const { value: distance, unit: unitDistance } = parseValueWithUnit(`${boxShadowValue?.distance}`);
|
|
48
|
-
return `box-shadow: ${Math.cos(parseFloat(`${boxShadowValue?.angle}`) * Math.PI / 180) * parseFloat(`${distance}`)}${unitDistance} ${Math.sin(parseFloat(`${boxShadowValue?.angle}`) * Math.PI / 180) * parseFloat(`${distance}`)}${unitDistance} ${boxShadowValue?.blur} ${boxShadowValue?.spread + ' '}${getSingleColorVariable(boxShadowValue?.color)};`;
|
|
49
|
-
};
|
|
50
|
-
|
|
51
|
-
export { composeShadowCss, getStyleShadow, getStyleShadowState, parseValueWithUnit };
|
|
1
|
+
import{getSingleColorVariable as t}from"./colors.js";import{stateMapping as e}from"./constant.js";import{getShortName as a}from"./get-shortname.js";let parseValueWithUnit=t=>{let e=t.match(/(\d+)(.+)/);if(e&&3===e.length){let t=Number(e[1]??0),a=e[2];return{value:t,unit:a??"px"}}return{value:0,unit:"px"}},getStyleShadow=(r,o=!1)=>{let{styleAppliedFor:l,value:s,isEnableShadow:n}=r||{},{state:i}=r||{};if(i||(i="normal"),!l||!s||void 0===s.distance)return{};let{value:$,unit:h}=parseValueWithUnit(`${s?.distance}`);return{[`-${o?"":e?.[i]}-${a(l)}`]:n?`${Math.cos(parseFloat(`${s?.angle}`)*Math.PI/180)*parseFloat(`${$}`)}${h} ${Math.sin(parseFloat(`${s?.angle}`)*Math.PI/180)*parseFloat(`${$}`)}${h} ${s?.blur} ${"box-shadow"===l?s?.spread+" ":""}${t(s?.color)}`:"none"}},getStyleShadowState=(t,e,a)=>{if(!t||!e)return{};let r={};for(let[o,l]of Object.entries(t))Object.assign(r,getStyleShadow({value:l,state:o,styleAppliedFor:e,isEnableShadow:a?.[o]}));return r},composeShadowCss=({hasBoxShadow:e,boxShadowValue:a,important:r})=>{if(!e||!a)return;let{value:o,unit:l}=parseValueWithUnit(`${a?.distance}`),s=r?" !important":"";return`box-shadow: ${Math.cos(parseFloat(`${a?.angle}`)*Math.PI/180)*parseFloat(`${o}`)}${l} ${Math.sin(parseFloat(`${a?.angle}`)*Math.PI/180)*parseFloat(`${o}`)}${l} ${a?.blur} ${a?.spread+" "}${t(a?.color)}${s};`};export{composeShadowCss,getStyleShadow,getStyleShadowState,parseValueWithUnit};
|
package/dist/esm/helpers/size.js
CHANGED
|
@@ -1,31 +1,4 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
const suffix = devicesMapping[device] ?? '';
|
|
6
|
-
return {
|
|
7
|
-
[`--pl${suffix}`]: size?.[device]?.horizontal,
|
|
8
|
-
[`--pr${suffix}`]: size?.[device]?.horizontal,
|
|
9
|
-
[`--pt${suffix}`]: size?.[device]?.vertical,
|
|
10
|
-
[`--pb${suffix}`]: size?.[device]?.vertical
|
|
11
|
-
};
|
|
12
|
-
}
|
|
13
|
-
const composeSize = (size)=>{
|
|
14
|
-
return Object.assign({}, getCustomSizeCSSByDevice(size, 'desktop'), getCustomSizeCSSByDevice(size, 'tablet'), getCustomSizeCSSByDevice(size, 'mobile'));
|
|
15
|
-
};
|
|
16
|
-
function genSizeClass(name) {
|
|
17
|
-
return `g-s-${name}`;
|
|
18
|
-
}
|
|
19
|
-
const composeSizeCss = (spacing)=>{
|
|
20
|
-
if (spacing === undefined) return '';
|
|
21
|
-
const size = spacing;
|
|
22
|
-
const sizeHozi = spacing?.custom?.desktop?.horizontal;
|
|
23
|
-
const sizeVerti = spacing?.custom?.desktop?.vertical;
|
|
24
|
-
if (!size?.custom) return undefined;
|
|
25
|
-
return `
|
|
26
|
-
${sizeHozi ? `padding-left: ${sizeHozi}; padding-right: ${sizeHozi};` : undefined}
|
|
27
|
-
${sizeVerti ? `padding-top: ${sizeVerti}; padding-bottom: ${sizeVerti};` : undefined}
|
|
28
|
-
`;
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
export { composeSize, composeSizeCss, genSizeClass };
|
|
1
|
+
import{devicesMapping as e}from"./constant.js";function getCustomSizeCSSByDevice(t,o){if(!t||!o)return{};let i=e[o]??"";return{[`--pl${i}`]:t?.[o]?.horizontal,[`--pr${i}`]:t?.[o]?.horizontal,[`--pt${i}`]:t?.[o]?.vertical,[`--pb${i}`]:t?.[o]?.vertical}}let composeSize=e=>Object.assign({},getCustomSizeCSSByDevice(e,"desktop"),getCustomSizeCSSByDevice(e,"tablet"),getCustomSizeCSSByDevice(e,"mobile"));function genSizeClass(e){return`g-s-${e}`}let composeSizeCss=e=>{if(void 0===e)return"";let t=e?.custom?.desktop?.horizontal,o=e?.custom?.desktop?.vertical;if(e?.custom)return`
|
|
2
|
+
${t?`padding-left: ${t}; padding-right: ${t};`:void 0}
|
|
3
|
+
${o?`padding-top: ${o}; padding-bottom: ${o};`:void 0}
|
|
4
|
+
`};export{composeSize,composeSizeCss,genSizeClass};
|
|
@@ -1,40 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
function getSpacingCSSByType(key, device) {
|
|
4
|
-
if (!key) return {};
|
|
5
|
-
const suffix = device ? devicesMapping?.[device] ?? '' : '';
|
|
6
|
-
return {
|
|
7
|
-
[`--p${suffix}`]: `var(--g-s-${key})`
|
|
8
|
-
};
|
|
9
|
-
}
|
|
10
|
-
function getSpacingVariable(key) {
|
|
11
|
-
if (!key) return '';
|
|
12
|
-
return `var(--g-s-${key})`;
|
|
13
|
-
}
|
|
14
|
-
const composeSpacing = (spacingValue)=>{
|
|
15
|
-
const style = {};
|
|
16
|
-
switch(spacingValue?.desktop){
|
|
17
|
-
case 'm':
|
|
18
|
-
case 'l':
|
|
19
|
-
case 's':
|
|
20
|
-
Object.assign(style, getSpacingCSSByType(spacingValue.desktop));
|
|
21
|
-
break;
|
|
22
|
-
}
|
|
23
|
-
switch(spacingValue?.tablet){
|
|
24
|
-
case 'm':
|
|
25
|
-
case 'l':
|
|
26
|
-
case 's':
|
|
27
|
-
Object.assign(style, getSpacingCSSByType(spacingValue.tablet, 'tablet'));
|
|
28
|
-
break;
|
|
29
|
-
}
|
|
30
|
-
switch(spacingValue?.mobile){
|
|
31
|
-
case 'm':
|
|
32
|
-
case 'l':
|
|
33
|
-
case 's':
|
|
34
|
-
Object.assign(style, getSpacingCSSByType(spacingValue.mobile, 'mobile'));
|
|
35
|
-
break;
|
|
36
|
-
}
|
|
37
|
-
return style;
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
export { composeSpacing, getSpacingVariable };
|
|
1
|
+
import{devicesMapping as e}from"./constant.js";function getSpacingCSSByType(t,a){if(!t)return{};let s=a?e?.[a]??"":"";return{[`--p${s}`]:`var(--g-s-${t})`}}function getSpacingVariable(e){return e?`var(--g-s-${e})`:""}let composeSpacing=e=>{let t={};switch(e?.desktop){case"m":case"l":case"s":Object.assign(t,getSpacingCSSByType(e.desktop))}switch(e?.tablet){case"m":case"l":case"s":Object.assign(t,getSpacingCSSByType(e.tablet,"tablet"))}switch(e?.mobile){case"m":case"l":case"s":Object.assign(t,getSpacingCSSByType(e.mobile,"mobile"))}return t};export{composeSpacing,getSpacingVariable};
|
|
@@ -1,24 +1 @@
|
|
|
1
|
-
|
|
2
|
-
if (!window.fbq) return;
|
|
3
|
-
window.fbq('track', 'PageView');
|
|
4
|
-
};
|
|
5
|
-
// https://developers.facebook.com/docs/facebook-pixel/advanced/
|
|
6
|
-
const event = (name, options = {})=>{
|
|
7
|
-
if (!window.fbq) return;
|
|
8
|
-
window.fbq('track', name, options);
|
|
9
|
-
};
|
|
10
|
-
const addToCart = (product)=>{
|
|
11
|
-
if (!window.fbq) return;
|
|
12
|
-
window.fbq('track', 'AddToCart', {
|
|
13
|
-
content_ids: [
|
|
14
|
-
product.id
|
|
15
|
-
],
|
|
16
|
-
content_name: product.name,
|
|
17
|
-
content_category: product.category,
|
|
18
|
-
content_type: 'product',
|
|
19
|
-
value: product.price,
|
|
20
|
-
currency: product.currency
|
|
21
|
-
});
|
|
22
|
-
};
|
|
23
|
-
|
|
24
|
-
export { addToCart, event, pageview };
|
|
1
|
+
let pageview=()=>{window.fbq&&window.fbq("track","PageView")},event=(e,t={})=>{window.fbq&&window.fbq("track",e,t)},addToCart=e=>{window.fbq&&window.fbq("track","AddToCart",{content_ids:[e.id],content_name:e.name,content_category:e.category,content_type:"product",value:e.price,currency:e.currency})};export{addToCart,event,pageview};
|
|
@@ -1,87 +1 @@
|
|
|
1
|
-
|
|
2
|
-
const pageview = (url, trackingId)=>{
|
|
3
|
-
// GA 4
|
|
4
|
-
if (window.gtag && trackingId) {
|
|
5
|
-
window.gtag('config', trackingId, {
|
|
6
|
-
page_path: url
|
|
7
|
-
});
|
|
8
|
-
}
|
|
9
|
-
// GA 3
|
|
10
|
-
if (window.ga) {
|
|
11
|
-
window.ga('send', 'pageview', url);
|
|
12
|
-
}
|
|
13
|
-
};
|
|
14
|
-
/** Addition to cart events
|
|
15
|
-
* https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
|
|
16
|
-
*/ const addToCart = (product)=>{
|
|
17
|
-
// GA 3
|
|
18
|
-
if (!window.ga || !product) {
|
|
19
|
-
return;
|
|
20
|
-
}
|
|
21
|
-
window.ga('ec:addProduct', {
|
|
22
|
-
...product,
|
|
23
|
-
id: product.sku,
|
|
24
|
-
name: product.variant === 'Default Title' ? product.name : `${product.name} - ${product.variant}`,
|
|
25
|
-
variant: product.variant === 'Default Title' ? product.name : product.variant
|
|
26
|
-
});
|
|
27
|
-
window.ga('ec:setAction', 'add');
|
|
28
|
-
window.ga('send', 'event', {
|
|
29
|
-
eventCategory: 'EnhancedEcommerce',
|
|
30
|
-
eventAction: 'Added Product',
|
|
31
|
-
nonInteraction: true
|
|
32
|
-
});
|
|
33
|
-
};
|
|
34
|
-
/** Product clicked event
|
|
35
|
-
* https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#product-click
|
|
36
|
-
*/ const productClick = (product)=>{
|
|
37
|
-
if (!window.ga) {
|
|
38
|
-
return;
|
|
39
|
-
}
|
|
40
|
-
ga('ec:addProduct', {
|
|
41
|
-
id: product.id,
|
|
42
|
-
name: product.name,
|
|
43
|
-
category: product.category,
|
|
44
|
-
brand: product.brand,
|
|
45
|
-
variant: product.variant
|
|
46
|
-
});
|
|
47
|
-
ga('ec:setAction', 'click');
|
|
48
|
-
ga('send', 'event', {
|
|
49
|
-
eventAction: 'Click',
|
|
50
|
-
eventCategory: 'Product'
|
|
51
|
-
});
|
|
52
|
-
};
|
|
53
|
-
/** Product viewed event
|
|
54
|
-
* https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#measuring-actvities
|
|
55
|
-
*/ const productDetail = (product)=>{
|
|
56
|
-
if (!product || !window.ga) return;
|
|
57
|
-
ga('ec:addProduct', {
|
|
58
|
-
brand: product.brand,
|
|
59
|
-
category: product.category,
|
|
60
|
-
id: product.id,
|
|
61
|
-
name: product.name,
|
|
62
|
-
variant: product.variant
|
|
63
|
-
});
|
|
64
|
-
ga('ec:setAction', 'detail');
|
|
65
|
-
ga('send', 'event', {
|
|
66
|
-
eventAction: 'Detail',
|
|
67
|
-
eventCategory: 'Ecommerce',
|
|
68
|
-
nonInteraction: 1
|
|
69
|
-
});
|
|
70
|
-
};
|
|
71
|
-
/** Removal from cart events
|
|
72
|
-
* https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce#add-remove-cart
|
|
73
|
-
*/ const removeFromCart = (product, price)=>{
|
|
74
|
-
if (!product || !window.ga) return;
|
|
75
|
-
ga('ec:addProduct', {
|
|
76
|
-
id: product.id,
|
|
77
|
-
name: product.name,
|
|
78
|
-
price
|
|
79
|
-
});
|
|
80
|
-
ga('ec:setAction', 'remove');
|
|
81
|
-
ga('send', 'event', {
|
|
82
|
-
eventAction: 'Click',
|
|
83
|
-
eventCategory: 'Remove from cart'
|
|
84
|
-
});
|
|
85
|
-
};
|
|
86
|
-
|
|
87
|
-
export { addToCart, pageview, productClick, productDetail, removeFromCart };
|
|
1
|
+
let pageview=(e,a)=>{window.gtag&&a&&window.gtag("config",a,{page_path:e}),window.ga&&window.ga("send","pageview",e)},addToCart=e=>{window.ga&&e&&(window.ga("ec:addProduct",{...e,id:e.sku,name:"Default Title"===e.variant?e.name:`${e.name} - ${e.variant}`,variant:"Default Title"===e.variant?e.name:e.variant}),window.ga("ec:setAction","add"),window.ga("send","event",{eventCategory:"EnhancedEcommerce",eventAction:"Added Product",nonInteraction:!0}))},productClick=e=>{window.ga&&(ga("ec:addProduct",{id:e.id,name:e.name,category:e.category,brand:e.brand,variant:e.variant}),ga("ec:setAction","click"),ga("send","event",{eventAction:"Click",eventCategory:"Product"}))},productDetail=e=>{e&&window.ga&&(ga("ec:addProduct",{brand:e.brand,category:e.category,id:e.id,name:e.name,variant:e.variant}),ga("ec:setAction","detail"),ga("send","event",{eventAction:"Detail",eventCategory:"Ecommerce",nonInteraction:1}))},removeFromCart=(e,a)=>{e&&window.ga&&(ga("ec:addProduct",{id:e.id,name:e.name,price:a}),ga("ec:setAction","remove"),ga("send","event",{eventAction:"Click",eventCategory:"Remove from cart"}))};export{addToCart,pageview,productClick,productDetail,removeFromCart};
|
|
@@ -1,15 +1 @@
|
|
|
1
|
-
|
|
2
|
-
const addToCart = (product)=>{
|
|
3
|
-
if (!window?.ttq?.track) return;
|
|
4
|
-
window.ttq.track('AddToCart', {
|
|
5
|
-
content_id: product.id,
|
|
6
|
-
content_type: 'product',
|
|
7
|
-
content_name: product.name,
|
|
8
|
-
quantity: product.quantity,
|
|
9
|
-
price: product.price,
|
|
10
|
-
value: (product.price ?? 0) * (product.quantity ?? 0),
|
|
11
|
-
currency: product.currency
|
|
12
|
-
});
|
|
13
|
-
};
|
|
14
|
-
|
|
15
|
-
export { addToCart };
|
|
1
|
+
let addToCart=t=>{window?.ttq?.track&&window.ttq.track("AddToCart",{content_id:t.id,content_type:"product",content_name:t.name,quantity:t.quantity,price:t.price,value:(t.price??0)*(t.quantity??0),currency:t.currency})};export{addToCart};
|