@licklist/design 0.44.492 → 0.44.493
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepsControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/StepsControl.tsx"],"names":[],"mappings":";AAgBA,UAAU,iBAAiB;IACzB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"StepsControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/form/StepsControl.tsx"],"names":[],"mappings":";AAgBA,UAAU,iBAAiB;IACzB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,EAAE,iBAAiB,eAkI5D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),r=require("react"),
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),r=require("react"),o=e(r),a=require("react-i18next"),n=require("react-hook-form"),s=e(require("@licklist/plugins/dist/services/Form/HookFormService")),i=require("../../sortable-tree/SortableTreeItem.js"),l=require("../../sortable-tree/SortableTree.js"),d=e(require("react-bootstrap/Badge")),u=require("../item/CreateProductSetItem.js"),c=require("../step/StepControl.js"),m=require("./ProductCategoriesControl.js");exports.StepsControl=function(e){var p=e.isLoading,v=n.useFormContext(),g=a.useTranslation("Design").t,f=t.__read(r.useState(!1),2),C=f[0],b=f[1],S=v.control,E=v.formState,q=E.errors,I=E.isSubmitting,N=v.clearErrors,h=v.getValues,y=v.setFocus,j=n.useFieldArray({name:"steps",control:S,keyName:"_id"}),x=j.fields,P=j.append,_=j.remove;r.useEffect((function(){I&&b(!I)}),[I]);var k=1===x.length;return o.createElement(o.Fragment,null,x.map((function(e,t){var r="steps.".concat(t),a=h(r);return o.createElement(n.Controller,{key:"step-".concat(e._id),name:"".concat(r,".name"),control:S,rules:{required:g("Validation:fieldRequired",{attribute:g("name")})},render:function(n){var s,u,v=n.field,f=v.value,b=v.onChange;return o.createElement(l.SortableTree.Item,{id:e._id,title:f,badge:o.createElement(d,{className:"step-badge"},g("step")),isExpanded:k,isInvalid:!!(null===(s=q.steps)||void 0===s?void 0:s[t]),isIconInHeader:!1,modalLabel:g("addNewStep"),modalClass:i.ProductSetModalClasses.step,isNewAdded:C,subTitle:o.createElement("div",{className:"product-set-badges-container"},o.createElement("div",{className:"product-set-subtitle-dot product-set-subtitle-step-dot"}),o.createElement("span",null,null===(u=a.productCategories)||void 0===u?void 0:u.length," ",g("categories"))),treeLineIconColor:"#D52902",body:o.createElement(c.StepControl,{isLoading:p,stepIndex:t,stepName:f,onStepNameChange:b}),onDelete:function(){return _(t)},sortableItems:e.productCategories?e.productCategories.map((function(e){var t=e.id;return String(t)})):[],validate:function(){var e,o,a=null===(o=null===(e=q.steps)||void 0===e?void 0:e[t])||void 0===o?void 0:o.name;return a&&y("".concat(r,".name")),Promise.resolve(!a)}},o.createElement(m.ProductCategoriesControl,{isLoading:p,stepIndex:t}))}})})),o.createElement(u.CreateProductSetItem,{title:g("addStep"),onClick:function(){var e;P({id:null,name:"".concat(g("step")," ").concat(x.length+1),productCategories:[],weight:0,hasMap:!1,venueMapSetId:null}),b(!0),(null===(e=q.steps)||void 0===e?void 0:e.type)===s.manualErrorType&&N("steps")}}),o.createElement("div",{className:"manual-form-error"},q.steps&&q.steps.message))};
|
package/package.json
CHANGED
|
@@ -28,6 +28,7 @@ export function StepsControl({ isLoading }: StepsControlProps) {
|
|
|
28
28
|
formState: { errors, isSubmitting },
|
|
29
29
|
clearErrors,
|
|
30
30
|
getValues,
|
|
31
|
+
setFocus,
|
|
31
32
|
} = form;
|
|
32
33
|
|
|
33
34
|
const { fields, append, remove } = useFieldArray({
|
|
@@ -57,12 +58,14 @@ export function StepsControl({ isLoading }: StepsControlProps) {
|
|
|
57
58
|
return (
|
|
58
59
|
<>
|
|
59
60
|
{fields.map((step, index) => {
|
|
60
|
-
const
|
|
61
|
+
const stepFieldName = `steps.${index}` as const;
|
|
62
|
+
|
|
63
|
+
const stepData = getValues(stepFieldName);
|
|
61
64
|
|
|
62
65
|
return (
|
|
63
66
|
<Controller
|
|
64
67
|
key={`step-${step._id}`}
|
|
65
|
-
name={
|
|
68
|
+
name={`${stepFieldName}.name` as const}
|
|
66
69
|
control={control}
|
|
67
70
|
rules={{
|
|
68
71
|
required: t("Validation:fieldRequired", {
|
|
@@ -104,6 +107,21 @@ export function StepsControl({ isLoading }: StepsControlProps) {
|
|
|
104
107
|
? step.productCategories.map(({ id }) => String(id))
|
|
105
108
|
: []
|
|
106
109
|
}
|
|
110
|
+
validate={() => {
|
|
111
|
+
// @TODO investigate why form return true in case
|
|
112
|
+
// when required field not filled. Looks like
|
|
113
|
+
// we cann't use default hookForm trigger function
|
|
114
|
+
// because we have venueMap outside this form.
|
|
115
|
+
// So before closing we need to check directly by
|
|
116
|
+
// error on name field. Instead of run trugger.
|
|
117
|
+
const error = errors.steps?.[index]?.name;
|
|
118
|
+
|
|
119
|
+
if (error) {
|
|
120
|
+
setFocus(`${stepFieldName}.name` as const);
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
return Promise.resolve(!error);
|
|
124
|
+
}}
|
|
107
125
|
>
|
|
108
126
|
<ProductCategoriesControl
|
|
109
127
|
isLoading={isLoading}
|