@plasmicpkgs/commerce 0.0.37 → 0.0.40

package/dist/commerce.cjs.development.js

@@ -7,10 +7,10 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 var registerComponent = _interopDefault(require('@plasmicapp/host/registerComponent'));
 var React = require('react');
 var React__default = _interopDefault(React);
+var host = require('@plasmicapp/host');
 var reactHookForm = require('react-hook-form');
 var query = require('@plasmicapp/query');
 var Cookies = _interopDefault(require('js-cookie'));
-var host = require('@plasmicapp/host');
 
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
   try {
@@ -970,51 +970,54 @@ var defaultProduct = {
   options: []
 };
 
-var ProductContext = /*#__PURE__*/React__default.createContext(undefined);
+var productSelector = "product";
 function ProductProvider(_ref) {
   var product = _ref.product,
       children = _ref.children;
   var methods = reactHookForm.useForm();
-  return React__default.createElement(ProductContext.Provider, {
-    value: product,
+  return React__default.createElement(host.DataProvider, {
+    name: productSelector,
+    data: product,
     key: product.id
   }, React__default.createElement(reactHookForm.FormProvider, Object.assign({}, methods), children));
 }
 var useProduct = function useProduct() {
-  var product = React.useContext(ProductContext);
+  var product = host.useSelector(productSelector);
   return product != null ? product : defaultProduct;
 };
-var CategoryContext = /*#__PURE__*/React__default.createContext(undefined);
 var PrimaryCategoryContext = /*#__PURE__*/React__default.createContext(undefined); //used to render correctly the defaultValueHint in ProductCollection
 
+var categorySelector = "category";
 function CategoryProvider(_ref2) {
   var category = _ref2.category,
       children = _ref2.children;
-  return React__default.createElement(CategoryContext.Provider, {
-    value: category,
+  return React__default.createElement(host.DataProvider, {
+    name: categorySelector,
+    data: category,
     key: category.id
   }, children);
 }
 var useCategoryContext = function useCategoryContext() {
-  return React.useContext(CategoryContext);
+  return host.useSelector(categorySelector);
 };
 var usePrimaryCategory = function usePrimaryCategory() {
   return React.useContext(PrimaryCategoryContext);
 };
-var ProductMediaContext = /*#__PURE__*/React__default.createContext(undefined);
+var mediaSelector = "currentMedia";
 function ProductMediaProvider(_ref3) {
   var mediaIndex = _ref3.mediaIndex,
       onClick = _ref3.onClick,
       children = _ref3.children;
-  return React__default.createElement(ProductMediaContext.Provider, {
-    value: mediaIndex,
+  return React__default.createElement(host.DataProvider, {
+    name: mediaSelector,
+    data: mediaIndex,
     key: mediaIndex
   }, React__default.cloneElement(React__default.isValidElement(children) ? children : React__default.createElement(React__default.Fragment, null), {
     onClick: onClick
   }));
 }
 var useProductMediaContext = function useProductMediaContext() {
-  return React.useContext(ProductMediaContext);
+  return host.useSelector(mediaSelector);
 };
 
 var _excluded = ["children"];
@@ -1801,7 +1804,7 @@ var categoryMediaMeta = {
   importPath: "@plasmicpkgs/commerce",
   importName: "CategoryMedia"
 };
-function CategoryMedia(props) {
+var CategoryMedia = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
   var _image$url;
 
   var className = props.className,
@@ -1810,12 +1813,13 @@ function CategoryMedia(props) {
   var category = useCategoryContext();
   var image = category != null && category.images ? category.images[mediaIndex] : undefined;
   return React__default.createElement("img", {
+    ref: ref,
     alt: (category == null ? void 0 : category.name) || "Category Image",
     src: (_image$url = image == null ? void 0 : image.url) != null ? _image$url : "",
     loading: "lazy",
     className: className
   });
-}
+});
 function registerCategoryMedia(loader, customCategoryMediaMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
@@ -2227,7 +2231,7 @@ var productMediaMeta = {
   importPath: "@plasmicpkgs/commerce",
   importName: "ProductMedia"
 };
-function ProductMedia(props) {
+var ProductMedia = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
   var _image$url;
 
   var className = props.className,
@@ -2241,12 +2245,13 @@ function ProductMedia(props) {
   });
   var image = product == null ? void 0 : product.images[mediaContext != null ? mediaContext : mediaIndex];
   return React__default.createElement("img", {
+    ref: ref,
     alt: (product == null ? void 0 : product.name) || "Product Image",
     src: product ? (_image$url = image == null ? void 0 : image.url) != null ? _image$url : "" : placeholderImage,
     loading: "lazy",
     className: className
   });
-}
+});
 function registerProductMedia(loader, customProductMediaMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);