@bigbinary/neeto-themes-frontend 1.2.2 → 1.2.3

package/dist/index.js

@@ -654,17 +654,16 @@ var SwitchBlock = function SwitchBlock(_ref) {
   });
 };
 
-var Properties = function Properties() {
+var Properties = function Properties(_ref) {
+  var onPropertiesChange = _ref.onPropertiesChange;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useConfigStore = useConfigStore(function (store) {
       return {
-        themePropertiesSchema: store["themePropertiesSchema"],
-        onPropertiesChange: store["onPropertiesChange"]
+        themePropertiesSchema: store["themePropertiesSchema"]
       };
     }, shallow),
-    themePropertiesSchema = _useConfigStore.themePropertiesSchema,
-    onPropertiesChange = _useConfigStore.onPropertiesChange;
+    themePropertiesSchema = _useConfigStore.themePropertiesSchema;
   var _useThemeStore = useThemeStore(function (store) {
       return {
         setThemeState: store["setThemeState"]
@@ -678,9 +677,9 @@ var Properties = function Properties() {
     setVariable = _useThemeUtils.setVariable,
     setTheme = _useThemeUtils.setTheme;
   var handleColorChange = function handleColorChange(name) {
-    return function (_ref) {
-      var hex = _ref.hex,
-        rgb = _ref.rgb;
+    return function (_ref2) {
+      var hex = _ref2.hex,
+        rgb = _ref2.rgb;
       handleChange(name, hex, "".concat(rgb.r, ", ").concat(rgb.g, ", ").concat(rgb.b, ", ").concat(rgb.a));
     };
   };
@@ -717,27 +716,27 @@ var Properties = function Properties() {
       className: "divide-y divide-gray-200",
       children: [filterBy({
         kind: "font_family"
-      }, values.properties).map(function (_ref2) {
-        var key = _ref2.key,
-          value = _ref2.value,
-          kind = _ref2.kind;
+      }, values.properties).map(function (_ref3) {
+        var key = _ref3.key,
+          value = _ref3.value,
+          kind = _ref3.kind;
         return isPropertyVisible(key, values, themePropertiesSchema) && /*#__PURE__*/jsx(FontPickerBlock, {
           label: buildLabel(key, kind),
           options: FONT_OPTIONS,
           value: findBy({
             value: value || null
           }, FONT_OPTIONS),
-          onChange: function onChange(_ref3) {
-            var value = _ref3.value;
+          onChange: function onChange(_ref4) {
+            var value = _ref4.value;
             handleChange(key, value);
           }
         }, key);
       }), filterBy({
         kind: "color"
-      }, values.properties).map(function (_ref4) {
-        var key = _ref4.key,
-          value = _ref4.value,
-          kind = _ref4.kind;
+      }, values.properties).map(function (_ref5) {
+        var key = _ref5.key,
+          value = _ref5.value,
+          kind = _ref5.kind;
         return isPropertyVisible(key, values, themePropertiesSchema) && /*#__PURE__*/jsx(ColorBlock, {
           color: value,
           label: buildLabel(key, kind),
@@ -745,10 +744,10 @@ var Properties = function Properties() {
         }, key);
       }), filterBy({
         kind: "overlay_opacity"
-      }, values.properties).map(function (_ref5) {
-        var key = _ref5.key,
-          value = _ref5.value,
-          kind = _ref5.kind;
+      }, values.properties).map(function (_ref6) {
+        var key = _ref6.key,
+          value = _ref6.value,
+          kind = _ref6.kind;
         return isPropertyVisible(key, values, themePropertiesSchema) && /*#__PURE__*/jsx(SliderBlock, {
           label: buildLabel(key, kind),
           marks: OVERLAY_OPACITY_SLIDER_MARKS,
@@ -761,11 +760,11 @@ var Properties = function Properties() {
         }, key);
       }), filterBy({
         kind: "position_selector"
-      }, values.properties).map(function (_ref6) {
+      }, values.properties).map(function (_ref7) {
         var _findBy;
-        var key = _ref6.key,
-          kind = _ref6.kind,
-          value = _ref6.value;
+        var key = _ref7.key,
+          kind = _ref7.kind,
+          value = _ref7.value;
         var index = findIndexBy({
           key: key
         }, values.properties);
@@ -783,10 +782,10 @@ var Properties = function Properties() {
         }, key);
       }), filterBy({
         kind: "boolean"
-      }, values.properties).map(function (_ref7) {
-        var key = _ref7.key,
-          kind = _ref7.kind,
-          value = _ref7.value;
+      }, values.properties).map(function (_ref8) {
+        var key = _ref8.key,
+          kind = _ref8.kind,
+          value = _ref8.value;
         var index = findIndexBy({
           key: key
         }, values.properties);
@@ -821,7 +820,8 @@ var Customize = function Customize(_ref) {
     theme = _ref.theme,
     onCreateTheme = _ref.onCreateTheme,
     onApplyTheme = _ref.onApplyTheme,
-    isApplyingTheme = _ref.isApplyingTheme;
+    isApplyingTheme = _ref.isApplyingTheme,
+    onPropertiesChange = _ref.onPropertiesChange;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useState = useState({}),
@@ -885,7 +885,9 @@ var Customize = function Customize(_ref) {
         className: "neeto-themes-sidebar__scroll",
         children: [/*#__PURE__*/jsxs("div", {
           className: "flex flex-col gap-6 p-4",
-          children: [/*#__PURE__*/jsx(ThemeMeta, {}), /*#__PURE__*/jsx(Properties, {}), filterBy({
+          children: [/*#__PURE__*/jsx(ThemeMeta, {}), /*#__PURE__*/jsx(Properties, {
+            onPropertiesChange: onPropertiesChange
+          }), filterBy({
             kind: "image"
           }, themePropertiesSchema).map(function (_ref5) {
             var key = _ref5.key;
@@ -1430,7 +1432,8 @@ var TitleBar = function TitleBar(_ref) {
 var MemoizedAlert = /*#__PURE__*/memo(Alert);
 var Sidebar = function Sidebar(_ref) {
   var _themeToEdit$current, _themeToEdit$current2, _themeToDelete$curren2, _themeToDelete$curren3;
-  var thumbnail = _ref.thumbnail;
+  var thumbnail = _ref.thumbnail,
+    onPropertiesChange = _ref.onPropertiesChange;
   var _useState = useState(DESIGN_SCREENS.THEMES),
     _useState2 = _slicedToArray(_useState, 2),
     currentScreen = _useState2[0],
@@ -1598,6 +1601,7 @@ var Sidebar = function Sidebar(_ref) {
       isApplyingTheme: isApplyingTheme,
       onApplyTheme: onApplyTheme,
       onCreateTheme: onCreateTheme,
+      onPropertiesChange: onPropertiesChange,
       theme: themeToEdit.current,
       themeId: (_themeToEdit$current2 = themeToEdit.current) === null || _themeToEdit$current2 === void 0 ? void 0 : _themeToEdit$current2.id
     }), /*#__PURE__*/jsx(MemoizedAlert, {
@@ -1636,13 +1640,13 @@ var NeetoThemesBuilder = function NeetoThemesBuilder(_ref) {
   useEffect(function () {
     setConfigState({
       entityType: entityType,
-      entityId: entityId,
-      onPropertiesChange: onPropertiesChange
+      entityId: entityId
     });
   }, []);
   return /*#__PURE__*/jsxs("div", {
     className: "neeto-themes__wrapper",
     children: [/*#__PURE__*/jsx(Sidebar, {
+      onPropertiesChange: onPropertiesChange,
       thumbnail: thumbnail
     }), /*#__PURE__*/jsx("div", {
       className: "neeto-themes-preview__wrapper",