@gem-sdk/plugin-quick-view 2.0.0-staging.711 → 2.0.0-staging.860

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.
Files changed (7) hide show
  1. package/dist/cjs/components/QuickView.js +1 -162
  2. package/dist/cjs/index.js +1 -13
  3. package/dist/cjs/setting/QuickView.js +1 -10
  4. package/dist/esm/components/QuickView.js +1 -158
  5. package/dist/esm/index.js +1 -8
  6. package/dist/esm/setting/QuickView.js +1 -6
  7. package/package.json +6 -6
package/dist/cjs/components/QuickView.js CHANGED
@@ -1,162 +1 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var jsxRuntime = require('react/jsx-runtime');
6
- var components = require('@gem-sdk/components');
7
- var core = require('@gem-sdk/core');
8
- var react = require('react');
9
-
10
- const ModalContent = ()=>{
11
- const product = core.useProduct();
12
- const { data, isLoading: loading, error } = core.useProductQuery(product?.id);
13
- if (loading) return /*#__PURE__*/ jsxRuntime.jsx("div", {
14
- children: /*#__PURE__*/ jsxRuntime.jsxs("svg", {
15
- className: "gp-mx-auto gp-my-20 gp-h-8 gp-w-8 gp-animate-spin",
16
- xmlns: "http://www.w3.org/2000/svg",
17
- fill: "none",
18
- viewBox: "0 0 24 24",
19
- children: [
20
- /*#__PURE__*/ jsxRuntime.jsx("circle", {
21
- className: "gp-opacity-25",
22
- cx: "12",
23
- cy: "12",
24
- r: "10",
25
- stroke: "currentColor",
26
- strokeWidth: "4"
27
- }),
28
- /*#__PURE__*/ jsxRuntime.jsx("path", {
29
- className: "gp-opacity-75",
30
- fill: "currentColor",
31
- d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
32
- })
33
- ]
34
- })
35
- });
36
- if (error) return /*#__PURE__*/ jsxRuntime.jsx("p", {
37
- className: "gp-py-20 gp-text-center gp-font-semibold",
38
- children: "Something went wrong"
39
- });
40
- return /*#__PURE__*/ jsxRuntime.jsx(core.ProductProvider, {
41
- product: data,
42
- children: /*#__PURE__*/ jsxRuntime.jsxs(components.Row, {
43
- setting: {
44
- layout: {
45
- desktop: {
46
- cols: [
47
- 6,
48
- 6
49
- ],
50
- display: 'fill'
51
- },
52
- mobile: {
53
- cols: [
54
- 12
55
- ]
56
- }
57
- }
58
- },
59
- children: [
60
- /*#__PURE__*/ jsxRuntime.jsx(components.Col, {
61
- children: /*#__PURE__*/ jsxRuntime.jsx(components.ProductImages, {})
62
- }),
63
- /*#__PURE__*/ jsxRuntime.jsxs(components.Col, {
64
- children: [
65
- /*#__PURE__*/ jsxRuntime.jsx(components.ProductTitle, {
66
- setting: {
67
- htmlTag: 'p'
68
- },
69
- styles: {
70
- typography: {
71
- type: 'heading-3'
72
- }
73
- }
74
- }),
75
- /*#__PURE__*/ jsxRuntime.jsxs(components.Row, {
76
- setting: {
77
- layout: {
78
- desktop: {
79
- cols: [
80
- 6,
81
- 6
82
- ],
83
- display: 'fit'
84
- }
85
- },
86
- horizontalAlign: {
87
- desktop: 'end'
88
- }
89
- },
90
- children: [
91
- /*#__PURE__*/ jsxRuntime.jsx(components.Col, {
92
- children: /*#__PURE__*/ jsxRuntime.jsx(components.ProductPrice, {
93
- setting: {
94
- priceType: 'regular'
95
- },
96
- styles: {
97
- typography: {
98
- type: 'subheading-2'
99
- }
100
- }
101
- })
102
- }),
103
- /*#__PURE__*/ jsxRuntime.jsx(components.Col, {
104
- children: /*#__PURE__*/ jsxRuntime.jsx(components.ProductPrice, {
105
- setting: {
106
- priceType: 'compare'
107
- },
108
- styles: {
109
- typography: {
110
- type: 'paragraph-2'
111
- }
112
- }
113
- })
114
- })
115
- ]
116
- }),
117
- /*#__PURE__*/ jsxRuntime.jsx(components.ProductVariants, {}),
118
- /*#__PURE__*/ jsxRuntime.jsx(components.ProductQuantity, {}),
119
- /*#__PURE__*/ jsxRuntime.jsx(components.ProductButton, {
120
- setting: {
121
- actionEffect: 'open-cart-drawer'
122
- }
123
- })
124
- ]
125
- })
126
- ]
127
- })
128
- });
129
- };
130
- const ProductQuickView = ({ setting })=>{
131
- const [open, setOpen] = react.useState(false);
132
- const plugins = core.usePluginEnable();
133
- if (!plugins?.includes('quick-view')) {
134
- return null;
135
- }
136
- return /*#__PURE__*/ jsxRuntime.jsxs("div", {
137
- children: [
138
- /*#__PURE__*/ jsxRuntime.jsx("div", {
139
- "aria-hidden": true,
140
- role: "button",
141
- "aria-label": "Quick view",
142
- onClick: ()=>setOpen((prev)=>!prev),
143
- children: setting?.label
144
- }),
145
- /*#__PURE__*/ jsxRuntime.jsx(components.Modal, {
146
- setting: {
147
- open
148
- },
149
- closeOnClickOutside: true,
150
- onClose: ()=>setOpen((prev)=>!prev),
151
- children: /*#__PURE__*/ jsxRuntime.jsx(ModalContent, {})
152
- })
153
- ]
154
- });
155
- };
156
- ProductQuickView.defaultProps = {
157
- setting: {
158
- label: 'Quick View'
159
- }
160
- };
161
-
162
- exports.default = ProductQuickView;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),components=require("@gem-sdk/components"),core=require("@gem-sdk/core"),react=require("react");const ModalContent=()=>{let e=core.useProduct(),{data:t,isLoading:s,error:n}=core.useProductQuery(e?.id);return s?jsxRuntime.jsx("div",{children:jsxRuntime.jsxs("svg",{className:"gp-mx-auto gp-my-20 gp-h-8 gp-w-8 gp-animate-spin",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[jsxRuntime.jsx("circle",{className:"gp-opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),jsxRuntime.jsx("path",{className:"gp-opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]})}):n?jsxRuntime.jsx("p",{className:"gp-py-20 gp-text-center gp-font-semibold",children:"Something went wrong"}):jsxRuntime.jsx(core.ProductProvider,{product:t,children:jsxRuntime.jsxs(components.Row,{setting:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12]}}},children:[jsxRuntime.jsx(components.Col,{children:jsxRuntime.jsx(components.ProductImages,{})}),jsxRuntime.jsxs(components.Col,{children:[jsxRuntime.jsx(components.ProductTitle,{setting:{htmlTag:"p"},styles:{typography:{type:"heading-3"}}}),jsxRuntime.jsxs(components.Row,{setting:{layout:{desktop:{cols:[6,6],display:"fit"}},horizontalAlign:{desktop:"end"}},children:[jsxRuntime.jsx(components.Col,{children:jsxRuntime.jsx(components.ProductPrice,{setting:{priceType:"regular"},styles:{typography:{type:"subheading-2"}}})}),jsxRuntime.jsx(components.Col,{children:jsxRuntime.jsx(components.ProductPrice,{setting:{priceType:"compare"},styles:{typography:{type:"paragraph-2"}}})})]}),jsxRuntime.jsx(components.ProductVariants,{}),jsxRuntime.jsx(components.ProductQuantity,{}),jsxRuntime.jsx(components.ProductButton,{setting:{actionEffect:"open-cart-drawer"}})]})]})})},ProductQuickView=({setting:e})=>{let[t,s]=react.useState(!1),n=core.usePluginEnable();return n?.includes("quick-view")?jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("div",{"aria-hidden":!0,role:"button","aria-label":"Quick view",onClick:()=>s(e=>!e),children:e?.label}),jsxRuntime.jsx(components.Modal,{setting:{open:t},closeOnClickOutside:!0,onClose:()=>s(e=>!e),children:jsxRuntime.jsx(ModalContent,{})})]}):null};ProductQuickView.defaultProps={setting:{label:"Quick View"}},exports.default=ProductQuickView;
package/dist/cjs/index.js CHANGED
@@ -1,13 +1 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var QuickView = require('./components/QuickView.js');
6
- var QuickView$1 = require('./setting/QuickView.js');
7
-
8
- const builderSetting = {
9
- QuickView: QuickView$1.default
10
- };
11
-
12
- exports.default = QuickView.default;
13
- exports.builderSetting = builderSetting;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var QuickView=require("./components/QuickView.js"),QuickView$1=require("./setting/QuickView.js");const builderSetting={QuickView:QuickView$1.default};exports.default=QuickView.default,exports.builderSetting=builderSetting;
package/dist/cjs/setting/QuickView.js CHANGED
@@ -1,10 +1 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const config = {
6
- tag: 'QuickView',
7
- label: 'Product Quick View'
8
- };
9
-
10
- exports.default = config;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});const config={tag:"QuickView",label:"Product Quick View"};exports.default=config;
package/dist/esm/components/QuickView.js CHANGED
@@ -1,158 +1 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { Modal, Row, Col, ProductImages, ProductTitle, ProductPrice, ProductVariants, ProductQuantity, ProductButton } from '@gem-sdk/components';
3
- import { usePluginEnable, useProduct, useProductQuery, ProductProvider } from '@gem-sdk/core';
4
- import { useState } from 'react';
5
-
6
- const ModalContent = ()=>{
7
- const product = useProduct();
8
- const { data, isLoading: loading, error } = useProductQuery(product?.id);
9
- if (loading) return /*#__PURE__*/ jsx("div", {
10
- children: /*#__PURE__*/ jsxs("svg", {
11
- className: "gp-mx-auto gp-my-20 gp-h-8 gp-w-8 gp-animate-spin",
12
- xmlns: "http://www.w3.org/2000/svg",
13
- fill: "none",
14
- viewBox: "0 0 24 24",
15
- children: [
16
- /*#__PURE__*/ jsx("circle", {
17
- className: "gp-opacity-25",
18
- cx: "12",
19
- cy: "12",
20
- r: "10",
21
- stroke: "currentColor",
22
- strokeWidth: "4"
23
- }),
24
- /*#__PURE__*/ jsx("path", {
25
- className: "gp-opacity-75",
26
- fill: "currentColor",
27
- d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
28
- })
29
- ]
30
- })
31
- });
32
- if (error) return /*#__PURE__*/ jsx("p", {
33
- className: "gp-py-20 gp-text-center gp-font-semibold",
34
- children: "Something went wrong"
35
- });
36
- return /*#__PURE__*/ jsx(ProductProvider, {
37
- product: data,
38
- children: /*#__PURE__*/ jsxs(Row, {
39
- setting: {
40
- layout: {
41
- desktop: {
42
- cols: [
43
- 6,
44
- 6
45
- ],
46
- display: 'fill'
47
- },
48
- mobile: {
49
- cols: [
50
- 12
51
- ]
52
- }
53
- }
54
- },
55
- children: [
56
- /*#__PURE__*/ jsx(Col, {
57
- children: /*#__PURE__*/ jsx(ProductImages, {})
58
- }),
59
- /*#__PURE__*/ jsxs(Col, {
60
- children: [
61
- /*#__PURE__*/ jsx(ProductTitle, {
62
- setting: {
63
- htmlTag: 'p'
64
- },
65
- styles: {
66
- typography: {
67
- type: 'heading-3'
68
- }
69
- }
70
- }),
71
- /*#__PURE__*/ jsxs(Row, {
72
- setting: {
73
- layout: {
74
- desktop: {
75
- cols: [
76
- 6,
77
- 6
78
- ],
79
- display: 'fit'
80
- }
81
- },
82
- horizontalAlign: {
83
- desktop: 'end'
84
- }
85
- },
86
- children: [
87
- /*#__PURE__*/ jsx(Col, {
88
- children: /*#__PURE__*/ jsx(ProductPrice, {
89
- setting: {
90
- priceType: 'regular'
91
- },
92
- styles: {
93
- typography: {
94
- type: 'subheading-2'
95
- }
96
- }
97
- })
98
- }),
99
- /*#__PURE__*/ jsx(Col, {
100
- children: /*#__PURE__*/ jsx(ProductPrice, {
101
- setting: {
102
- priceType: 'compare'
103
- },
104
- styles: {
105
- typography: {
106
- type: 'paragraph-2'
107
- }
108
- }
109
- })
110
- })
111
- ]
112
- }),
113
- /*#__PURE__*/ jsx(ProductVariants, {}),
114
- /*#__PURE__*/ jsx(ProductQuantity, {}),
115
- /*#__PURE__*/ jsx(ProductButton, {
116
- setting: {
117
- actionEffect: 'open-cart-drawer'
118
- }
119
- })
120
- ]
121
- })
122
- ]
123
- })
124
- });
125
- };
126
- const ProductQuickView = ({ setting })=>{
127
- const [open, setOpen] = useState(false);
128
- const plugins = usePluginEnable();
129
- if (!plugins?.includes('quick-view')) {
130
- return null;
131
- }
132
- return /*#__PURE__*/ jsxs("div", {
133
- children: [
134
- /*#__PURE__*/ jsx("div", {
135
- "aria-hidden": true,
136
- role: "button",
137
- "aria-label": "Quick view",
138
- onClick: ()=>setOpen((prev)=>!prev),
139
- children: setting?.label
140
- }),
141
- /*#__PURE__*/ jsx(Modal, {
142
- setting: {
143
- open
144
- },
145
- closeOnClickOutside: true,
146
- onClose: ()=>setOpen((prev)=>!prev),
147
- children: /*#__PURE__*/ jsx(ModalContent, {})
148
- })
149
- ]
150
- });
151
- };
152
- ProductQuickView.defaultProps = {
153
- setting: {
154
- label: 'Quick View'
155
- }
156
- };
157
-
158
- export { ProductQuickView as default };
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Modal as i,Row as l,Col as r,ProductImages as o,ProductTitle as n,ProductPrice as c,ProductVariants as a,ProductQuantity as s,ProductButton as p}from"@gem-sdk/components";import{usePluginEnable as d,useProduct as g,useProductQuery as h,ProductProvider as m}from"@gem-sdk/core";import{useState as u}from"react";let ModalContent=()=>{let i=g(),{data:d,isLoading:u,error:y}=h(i?.id);return u?t("div",{children:e("svg",{className:"gp-mx-auto gp-my-20 gp-h-8 gp-w-8 gp-animate-spin",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[t("circle",{className:"gp-opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),t("path",{className:"gp-opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]})}):y?t("p",{className:"gp-py-20 gp-text-center gp-font-semibold",children:"Something went wrong"}):t(m,{product:d,children:e(l,{setting:{layout:{desktop:{cols:[6,6],display:"fill"},mobile:{cols:[12]}}},children:[t(r,{children:t(o,{})}),e(r,{children:[t(n,{setting:{htmlTag:"p"},styles:{typography:{type:"heading-3"}}}),e(l,{setting:{layout:{desktop:{cols:[6,6],display:"fit"}},horizontalAlign:{desktop:"end"}},children:[t(r,{children:t(c,{setting:{priceType:"regular"},styles:{typography:{type:"subheading-2"}}})}),t(r,{children:t(c,{setting:{priceType:"compare"},styles:{typography:{type:"paragraph-2"}}})})]}),t(a,{}),t(s,{}),t(p,{setting:{actionEffect:"open-cart-drawer"}})]})]})})},ProductQuickView=({setting:l})=>{let[r,o]=u(!1),n=d();return n?.includes("quick-view")?e("div",{children:[t("div",{"aria-hidden":!0,role:"button","aria-label":"Quick view",onClick:()=>o(e=>!e),children:l?.label}),t(i,{setting:{open:r},closeOnClickOutside:!0,onClose:()=>o(e=>!e),children:t(ModalContent,{})})]}):null};ProductQuickView.defaultProps={setting:{label:"Quick View"}};export{ProductQuickView as default};
package/dist/esm/index.js CHANGED
@@ -1,8 +1 @@
1
- import ProductQuickView from './components/QuickView.js';
2
- import config from './setting/QuickView.js';
3
-
4
- const builderSetting = {
5
- QuickView: config
6
- };
7
-
8
- export { builderSetting, ProductQuickView as default };
1
+ import i from"./components/QuickView.js";import e from"./setting/QuickView.js";let builderSetting={QuickView:e};export{builderSetting,i as default};
package/dist/esm/setting/QuickView.js CHANGED
@@ -1,6 +1 @@
1
- const config = {
2
- tag: 'QuickView',
3
- label: 'Product Quick View'
4
- };
5
-
6
- export { config as default };
1
+ let config={tag:"QuickView",label:"Product Quick View"};export{config as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/plugin-quick-view",
3
- "version": "2.0.0-staging.711",
3
+ "version": "2.0.0-staging.860",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",
@@ -19,13 +19,13 @@
19
19
  "test": "jest -c ./../../helpers/jest.config.ts"
20
20
  },
21
21
  "devDependencies": {
22
- "@gem-sdk/components": "2.0.0-staging.711",
23
- "@gem-sdk/core": "2.0.0-staging.711",
24
- "@gem-sdk/styles": "2.0.0-staging.711"
22
+ "@gem-sdk/components": "2.0.0-staging.860",
23
+ "@gem-sdk/core": "2.0.0-staging.860",
24
+ "@gem-sdk/styles": "2.0.0-staging.784"
25
25
  },
26
26
  "peerDependencies": {
27
- "react": "^17 || ^18",
28
- "react-dom": "^17 || ^18"
27
+ "react": "^18",
28
+ "react-dom": "^18"
29
29
  },
30
30
  "module": "dist/esm/index.js",
31
31
  "types": "dist/types/index.d.ts",