@bigbinary/neeto-themes-frontend 1.1.13 → 1.1.14
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/index.cjs.js +46 -28
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.js +29 -20
- package/dist/index.js.map +1 -1
- package/package.json +14 -13
package/dist/index.js
CHANGED
|
@@ -2,22 +2,31 @@ import { shallow } from 'zustand/shallow';
|
|
|
2
2
|
import React, { useEffect, forwardRef, useImperativeHandle, Fragment, useMemo, useRef, useReducer, useCallback, useState, memo } from 'react';
|
|
3
3
|
import i18next, { t as t$2 } from 'i18next';
|
|
4
4
|
import { withImmutableActions, useMutationWithInvalidation, useDebounce, useFuncDebounce, withT, withTitle } from '@bigbinary/neeto-commons-frontend/react-utils';
|
|
5
|
-
import
|
|
5
|
+
import Spinner$1 from '@bigbinary/neetoui/Spinner';
|
|
6
6
|
import { create as create$3 } from 'zustand';
|
|
7
7
|
import { isNotPresent, snakeToCamelCase, noop as noop$1, isPresent, findBy, keysToCamelCase, humanize, existsBy, filterBy, findIndexBy, isNot, isNotEmpty } from '@bigbinary/neeto-cist';
|
|
8
|
+
import Alert from '@bigbinary/neetoui/Alert';
|
|
8
9
|
import { useTranslation, Trans } from 'react-i18next';
|
|
10
|
+
import '@bigbinary/neetoui/Toastr';
|
|
9
11
|
import { useQuery, useMutation } from 'react-query';
|
|
10
12
|
import axios from 'axios';
|
|
11
13
|
import { prop, mergeRight, equals, pipe, values, flatten as flatten$1, map, toUpper, join, isNil, isEmpty, mergeLeft, concat, __, inc, path } from 'ramda';
|
|
12
|
-
import
|
|
14
|
+
import Button$1 from '@bigbinary/neetoui/Button';
|
|
15
|
+
import Form from '@bigbinary/neetoui/formik/Form';
|
|
13
16
|
import * as yup from 'yup';
|
|
14
17
|
import { useFormikContext } from 'formik';
|
|
18
|
+
import Typography from '@bigbinary/neetoui/Typography';
|
|
15
19
|
import classnames from 'classnames';
|
|
16
20
|
import { MenuHorizontal, LeftArrow, Plus } from '@bigbinary/neeto-icons';
|
|
21
|
+
import { Dropdown, Typography as Typography$1, Modal as Modal$1, Spinner, Tab, Button, Input, Toastr, Switch } from '@bigbinary/neetoui';
|
|
17
22
|
import { globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
|
|
18
23
|
import { withEventTargetValue, joinHyphenCase } from '@bigbinary/neeto-commons-frontend/utils';
|
|
24
|
+
import ColorPicker from '@bigbinary/neetoui/ColorPicker';
|
|
25
|
+
import Select from '@bigbinary/neetoui/Select';
|
|
26
|
+
import Input$1 from '@bigbinary/neetoui/formik/Input';
|
|
19
27
|
import Search from '@bigbinary/neeto-molecules/Search';
|
|
20
28
|
import MoreDropdown from '@bigbinary/neeto-molecules/MoreDropdown';
|
|
29
|
+
import Tag from '@bigbinary/neetoui/Tag';
|
|
21
30
|
|
|
22
31
|
/** @type {import("neetocommons/react-utils").ZustandStoreHook} */
|
|
23
32
|
var useConfigStore = create$3(withImmutableActions(function (set) {
|
|
@@ -461,7 +470,7 @@ var hexToRgba = function hexToRgba(hex) {
|
|
|
461
470
|
return "".concat(r, ", ").concat(g, ", ").concat(b).concat(a !== undefined ? ", ".concat(a) : "");
|
|
462
471
|
};
|
|
463
472
|
|
|
464
|
-
var BASE_URL = "
|
|
473
|
+
var BASE_URL = "neeto_themes_engine";
|
|
465
474
|
|
|
466
475
|
var show$1 = function show(entityId) {
|
|
467
476
|
return axios.get("".concat(BASE_URL, "/api/v1/theme/entities/").concat(entityId));
|
|
@@ -3679,7 +3688,7 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
|
3679
3688
|
})
|
|
3680
3689
|
}), /*#__PURE__*/React.createElement("div", {
|
|
3681
3690
|
className: "flex flex-col space-y-1"
|
|
3682
|
-
}, !isDisabled && /*#__PURE__*/React.createElement(Typography, {
|
|
3691
|
+
}, !isDisabled && /*#__PURE__*/React.createElement(Typography$1, {
|
|
3683
3692
|
className: "neeto-ui-text-gray-800 text-center leading-4",
|
|
3684
3693
|
style: "body2"
|
|
3685
3694
|
}, /*#__PURE__*/React.createElement(Trans, {
|
|
@@ -3690,7 +3699,7 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
|
3690
3699
|
"data-cy": "neeto-image-uploader-browse-text"
|
|
3691
3700
|
})
|
|
3692
3701
|
}
|
|
3693
|
-
})), setIsAssetLibraryOpen && /*#__PURE__*/React.createElement(Typography, {
|
|
3702
|
+
})), setIsAssetLibraryOpen && /*#__PURE__*/React.createElement(Typography$1, {
|
|
3694
3703
|
className: "text-center leading-4",
|
|
3695
3704
|
style: "body2",
|
|
3696
3705
|
onClick: function onClick(e) {
|
|
@@ -3708,7 +3717,7 @@ var ImageDirectUpload = function ImageDirectUpload(_ref) {
|
|
|
3708
3717
|
})), /*#__PURE__*/React.createElement("input", _extends$1({}, getInputProps(), {
|
|
3709
3718
|
"data-cy": "neeto-image-uploader-file-input",
|
|
3710
3719
|
disabled: isDisabled
|
|
3711
|
-
})), /*#__PURE__*/React.createElement(Typography, {
|
|
3720
|
+
})), /*#__PURE__*/React.createElement(Typography$1, {
|
|
3712
3721
|
className: "neeto-ui-text-gray-700 text-center leading-4",
|
|
3713
3722
|
"data-cy": "neeto-image-uploader-restriction-message",
|
|
3714
3723
|
lineHeight: "snug",
|
|
@@ -5229,7 +5238,7 @@ var Controls = function Controls(_ref) {
|
|
|
5229
5238
|
disabled: isFullImage,
|
|
5230
5239
|
label: t("neetoImageUploader.labels.lockAspectRatio"),
|
|
5231
5240
|
onChange: onToggleAspectRatioLock
|
|
5232
|
-
}), /*#__PURE__*/React.createElement(Typography, {
|
|
5241
|
+
}), /*#__PURE__*/React.createElement(Typography$1, {
|
|
5233
5242
|
className: "mb-2 mt-6",
|
|
5234
5243
|
style: "body2"
|
|
5235
5244
|
}, t("neetoImageUploader.imageEditor.aspectRatio")), /*#__PURE__*/React.createElement("div", {
|
|
@@ -5241,7 +5250,7 @@ var Controls = function Controls(_ref) {
|
|
|
5241
5250
|
type: "number",
|
|
5242
5251
|
value: aspectRatio.width,
|
|
5243
5252
|
onChange: withEventTargetValue(handleAspectWidthChange)
|
|
5244
|
-
}), /*#__PURE__*/React.createElement(Typography, null, " : "), /*#__PURE__*/React.createElement(Input, {
|
|
5253
|
+
}), /*#__PURE__*/React.createElement(Typography$1, null, " : "), /*#__PURE__*/React.createElement(Input, {
|
|
5245
5254
|
"data-cy": "aspect-ratio-height-input",
|
|
5246
5255
|
disabled: isFullImage,
|
|
5247
5256
|
size: "small",
|
|
@@ -6305,7 +6314,7 @@ var Images$1 = function Images(_ref) {
|
|
|
6305
6314
|
refetch();
|
|
6306
6315
|
}, [debouncedQuery]);
|
|
6307
6316
|
if (error) {
|
|
6308
|
-
return /*#__PURE__*/React.createElement(Typography, {
|
|
6317
|
+
return /*#__PURE__*/React.createElement(Typography$1, {
|
|
6309
6318
|
className: "mt-9 flex justify-center",
|
|
6310
6319
|
style: "body2"
|
|
6311
6320
|
}, t("neetoImageUploader.unsplash.errorMessage"));
|
|
@@ -6511,7 +6520,7 @@ var UnsplashLibrary = function UnsplashLibrary(_ref) {
|
|
|
6511
6520
|
refetch();
|
|
6512
6521
|
}, [debouncedQuery]);
|
|
6513
6522
|
if (error) {
|
|
6514
|
-
return /*#__PURE__*/React.createElement(Typography, {
|
|
6523
|
+
return /*#__PURE__*/React.createElement(Typography$1, {
|
|
6515
6524
|
className: "mt-9 flex justify-center",
|
|
6516
6525
|
style: "body2"
|
|
6517
6526
|
}, t("neetoImageUploader.unsplash.errorMessage"));
|
|
@@ -6659,7 +6668,7 @@ var Modal = function Modal(_ref) {
|
|
|
6659
6668
|
className: "neeto-ui-bg-gray-400 absolute inset-0 z-50 flex h-full items-center justify-center opacity-50"
|
|
6660
6669
|
}, /*#__PURE__*/React.createElement(Spinner, null)), isNilOrEmpty(selectedImage) && isDragActive && /*#__PURE__*/React.createElement("div", _extends$1({
|
|
6661
6670
|
className: "neeto-ui-rounded-xl neeto-ui-bg-gray-400 absolute flex h-full w-full flex-col items-center justify-around border-4 border-dashed border-gray-900 opacity-40"
|
|
6662
|
-
}, getRootProps()), /*#__PURE__*/React.createElement(Typography, null, t("neetoImageUploader.common.dropHere"))), !isNilOrEmpty(selectedImage) ? /*#__PURE__*/React.createElement(ImageEditor, {
|
|
6671
|
+
}, getRootProps()), /*#__PURE__*/React.createElement(Typography$1, null, t("neetoImageUploader.common.dropHere"))), !isNilOrEmpty(selectedImage) ? /*#__PURE__*/React.createElement(ImageEditor, {
|
|
6663
6672
|
fixedAspectRatio: fixedAspectRatio,
|
|
6664
6673
|
handleImageEditComplete: handleImageEditComplete,
|
|
6665
6674
|
handleReset: function handleReset() {
|
|
@@ -6673,7 +6682,7 @@ var Modal = function Modal(_ref) {
|
|
|
6673
6682
|
onClick: function onClick(event) {
|
|
6674
6683
|
return event.stopPropagation();
|
|
6675
6684
|
}
|
|
6676
|
-
})), /*#__PURE__*/React.createElement(Modal$1.Header, null, /*#__PURE__*/React.createElement(Typography, {
|
|
6685
|
+
})), /*#__PURE__*/React.createElement(Modal$1.Header, null, /*#__PURE__*/React.createElement(Typography$1, {
|
|
6677
6686
|
style: "h2"
|
|
6678
6687
|
}, t("neetoImageUploader.common.imageLibrary"))), /*#__PURE__*/React.createElement("div", {
|
|
6679
6688
|
className: "px-6 py-2"
|
|
@@ -6708,7 +6717,7 @@ var Modal = function Modal(_ref) {
|
|
|
6708
6717
|
tab: activeTab
|
|
6709
6718
|
}), equals(activeTab, TABS[1].key) && /*#__PURE__*/React.createElement(Modal$1.Footer, {
|
|
6710
6719
|
className: "flex items-center justify-center gap-2"
|
|
6711
|
-
}, /*#__PURE__*/React.createElement(Typography, {
|
|
6720
|
+
}, /*#__PURE__*/React.createElement(Typography$1, {
|
|
6712
6721
|
style: "body2"
|
|
6713
6722
|
}, /*#__PURE__*/React.createElement(Trans, {
|
|
6714
6723
|
i18nKey: "neetoImageUploader.unsplash.poweredByUnsplash",
|
|
@@ -7169,13 +7178,13 @@ var Customize = function Customize(_ref) {
|
|
|
7169
7178
|
});
|
|
7170
7179
|
})), /*#__PURE__*/React.createElement("div", {
|
|
7171
7180
|
className: "neeto-ui-bg-white neeto-ui-shadow-s sticky bottom-0 left-0 right-0 flex justify-end gap-x-2 px-4 py-6"
|
|
7172
|
-
}, /*#__PURE__*/React.createElement(Button, {
|
|
7181
|
+
}, /*#__PURE__*/React.createElement(Button$1, {
|
|
7173
7182
|
"data-cy": "reset-button",
|
|
7174
7183
|
disabled: !dirty || isSubmitting,
|
|
7175
7184
|
label: t("neetoThemes.buttons.reset"),
|
|
7176
7185
|
style: "text",
|
|
7177
7186
|
type: "reset"
|
|
7178
|
-
}), /*#__PURE__*/React.createElement(Button, {
|
|
7187
|
+
}), /*#__PURE__*/React.createElement(Button$1, {
|
|
7179
7188
|
"data-cy": "save-changes-button",
|
|
7180
7189
|
disabled: !dirty && (theme === null || theme === void 0 ? void 0 : theme.id) || isSubmitting,
|
|
7181
7190
|
label: t("neetoThemes.buttons.save"),
|
|
@@ -7340,7 +7349,7 @@ var Card = function Card(_ref) {
|
|
|
7340
7349
|
"data-cy": "active-theme-label",
|
|
7341
7350
|
label: t("neetoThemes.common.active"),
|
|
7342
7351
|
style: "success"
|
|
7343
|
-
}) : /*#__PURE__*/React.createElement(Button, {
|
|
7352
|
+
}) : /*#__PURE__*/React.createElement(Button$1, {
|
|
7344
7353
|
className: "flex-shrink-0",
|
|
7345
7354
|
"data-cy": "apply-theme-button",
|
|
7346
7355
|
disabled: isApplyingTheme,
|
|
@@ -7458,7 +7467,7 @@ var Themes = function Themes(_ref) {
|
|
|
7458
7467
|
if (isLoading || isCurrentThemeLoading) {
|
|
7459
7468
|
return /*#__PURE__*/React.createElement("div", {
|
|
7460
7469
|
className: "flex h-full w-full items-center justify-center"
|
|
7461
|
-
}, /*#__PURE__*/React.createElement(Spinner, null));
|
|
7470
|
+
}, /*#__PURE__*/React.createElement(Spinner$1, null));
|
|
7462
7471
|
}
|
|
7463
7472
|
return /*#__PURE__*/React.createElement("div", {
|
|
7464
7473
|
className: "neeto-themes-sidebar__scroll"
|
|
@@ -7533,7 +7542,7 @@ var TitleBar = function TitleBar(_ref) {
|
|
|
7533
7542
|
className: "neeto-themes-sidebar__header px-4"
|
|
7534
7543
|
}, /*#__PURE__*/React.createElement("div", {
|
|
7535
7544
|
className: "flex items-center justify-start space-x-2"
|
|
7536
|
-
}, /*#__PURE__*/React.createElement(Button, {
|
|
7545
|
+
}, /*#__PURE__*/React.createElement(Button$1, {
|
|
7537
7546
|
"data-cy": "customize-themes-back-button",
|
|
7538
7547
|
icon: LeftArrow,
|
|
7539
7548
|
iconPosition: "left",
|
|
@@ -7561,7 +7570,7 @@ var TitleBar = function TitleBar(_ref) {
|
|
|
7561
7570
|
weight: "semibold"
|
|
7562
7571
|
}, t("neetoThemes.build.leftSideBar.headerTabs.themes")), /*#__PURE__*/React.createElement("div", {
|
|
7563
7572
|
className: "self-end"
|
|
7564
|
-
}, /*#__PURE__*/React.createElement(Button, {
|
|
7573
|
+
}, /*#__PURE__*/React.createElement(Button$1, {
|
|
7565
7574
|
"data-cy": "customize-themes-add-theme-button",
|
|
7566
7575
|
icon: Plus,
|
|
7567
7576
|
iconPosition: "left",
|
|
@@ -7758,7 +7767,7 @@ var NeetoThemes = function NeetoThemes(_ref) {
|
|
|
7758
7767
|
className: "neeto-themes-preview__wrapper"
|
|
7759
7768
|
}, isCurrentThemeLoading ? /*#__PURE__*/React.createElement("div", {
|
|
7760
7769
|
className: "m-auto flex h-full w-full items-center justify-center"
|
|
7761
|
-
}, /*#__PURE__*/React.createElement(Spinner, null)) : children));
|
|
7770
|
+
}, /*#__PURE__*/React.createElement(Spinner$1, null)) : children));
|
|
7762
7771
|
};
|
|
7763
7772
|
var index = withTitle(NeetoThemes, t$2("neetoThemes.common.design"));
|
|
7764
7773
|
|