@licklist/design 0.71.18-dev.4 → 0.71.18-dev.5

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 (18) hide show
  1. package/dist/iframe/ProductWithModifierModal/ModifierSetModal/ProductWithModifierSetForm.js +3 -3
  2. package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.d.ts +1 -3
  3. package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.d.ts.map +1 -1
  4. package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.js +171 -219
  5. package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.d.ts +1 -3
  6. package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.d.ts.map +1 -1
  7. package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.js +77 -35
  8. package/dist/iframe/ProductWithModifierModal/utils.d.ts +5 -0
  9. package/dist/iframe/ProductWithModifierModal/utils.d.ts.map +1 -0
  10. package/dist/iframe/ProductWithModifierModal/utils.js +19 -0
  11. package/dist/styles/themes/bookedit/index.scss +5 -0
  12. package/package.json +1 -1
  13. package/src/iframe/ProductWithModifierModal/ModifierSetModal/ProductWithModifierSetForm.tsx +3 -3
  14. package/src/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.tsx +47 -131
  15. package/src/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.tsx +76 -35
  16. package/src/iframe/ProductWithModifierModal/utils.ts +28 -0
  17. package/src/styles/themes/bookedit/index.scss +5 -0
  18. package/yarn.lock +12 -12
package/dist/iframe/ProductWithModifierModal/ModifierSetModal/ProductWithModifierSetForm.js CHANGED
@@ -134,7 +134,7 @@ var ProductWithModifierSetForm = function(param) {
134
134
  'Sale',
135
135
  'Validation'
136
136
  ]).t;
137
- var _form_formState = form.formState, errors = _form_formState.errors, isSubmitting = _form_formState.isSubmitting, control = form.control, trigger = form.trigger, watch = form.watch;
137
+ var _form_formState = form.formState, errors = _form_formState.errors, isSubmitting = _form_formState.isSubmitting, isValid = _form_formState.isValid, control = form.control, trigger = form.trigger, watch = form.watch;
138
138
  var _editOrderModifier_productQuantity;
139
139
  var defaultProductQuantity = (_editOrderModifier_productQuantity = editOrderModifier === null || editOrderModifier === void 0 ? void 0 : editOrderModifier.productQuantity) !== null && _editOrderModifier_productQuantity !== void 0 ? _editOrderModifier_productQuantity : 0;
140
140
  var valuesOrder = watch();
@@ -149,7 +149,8 @@ var ProductWithModifierSetForm = function(param) {
149
149
  ];
150
150
  var onSubmit = function(event) {
151
151
  event.preventDefault();
152
- trigger();
152
+ trigger("".concat(product.id));
153
+ if (!isValid) return undefined;
153
154
  var productOrder = {
154
155
  id: product.id,
155
156
  name: product.name,
@@ -191,7 +192,6 @@ var ProductWithModifierSetForm = function(param) {
191
192
  children: [
192
193
  /*#__PURE__*/ jsx(ProductControl, {
193
194
  product: product,
194
- errors: errors,
195
195
  editOrderModifier: editOrderModifier
196
196
  }),
197
197
  /*#__PURE__*/ jsxs("div", {
package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.d.ts CHANGED
@@ -1,16 +1,14 @@
1
1
  import { OrderModifier } from '@licklist/core/dist/DataMapper/Order/OrderModifierDataMapper';
2
2
  import { Modifier } from '@licklist/core/dist/DataMapper/Product/ModifierDataMapper';
3
3
  import { ModifierSet } from '@licklist/core/dist/DataMapper/Product/ModifierSetDataMapper';
4
- import { FieldErrors, FieldValues } from 'react-hook-form';
5
4
  interface ModifiersSetControllProps {
6
5
  modifiers?: Modifier[];
7
6
  modifierSet: ModifierSet;
8
- modifiersSetWithErrors?: FieldErrors<FieldValues>;
9
7
  isLoading?: boolean;
10
8
  isEditMode?: boolean;
11
9
  productId: number;
12
10
  orderProductModifierSets?: OrderModifier[];
13
11
  }
14
- export declare const ModifiersSetControl: ({ modifierSet, modifiers, modifiersSetWithErrors, productId, isLoading, isEditMode, orderProductModifierSets, }: ModifiersSetControllProps) => import("react/jsx-runtime").JSX.Element;
12
+ export declare const ModifiersSetControl: ({ modifierSet, modifiers, productId, isLoading, isEditMode, orderProductModifierSets, }: ModifiersSetControllProps) => import("react/jsx-runtime").JSX.Element;
15
13
  export {};
16
14
  //# sourceMappingURL=ModifierSetControll.d.ts.map
package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ModifierSetControll.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,8DAA8D,CAAA;AAC5F,OAAO,EAAE,QAAQ,EAAE,MAAM,2DAA2D,CAAA;AACpF,OAAO,EAAE,WAAW,EAAE,MAAM,8DAA8D,CAAA;AAG1F,OAAO,EAEL,WAAW,EACX,WAAW,EAEZ,MAAM,iBAAiB,CAAA;AAQxB,UAAU,yBAAyB;IACjC,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAA;IACtB,WAAW,EAAE,WAAW,CAAA;IACxB,sBAAsB,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAA;IACjD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,EAAE,MAAM,CAAA;IACjB,wBAAwB,CAAC,EAAE,aAAa,EAAE,CAAA;CAC3C;AAID,eAAO,MAAM,mBAAmB,oHAQ7B,yBAAyB,4CAkZ3B,CAAA"}
1
+ {"version":3,"file":"ModifierSetControll.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,8DAA8D,CAAA;AAC5F,OAAO,EAAE,QAAQ,EAAE,MAAM,2DAA2D,CAAA;AACpF,OAAO,EAAE,WAAW,EAAE,MAAM,8DAA8D,CAAA;AAY1F,UAAU,yBAAyB;IACjC,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAA;IACtB,WAAW,EAAE,WAAW,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,EAAE,MAAM,CAAA;IACjB,wBAAwB,CAAC,EAAE,aAAa,EAAE,CAAA;CAC3C;AAED,eAAO,MAAM,mBAAmB,4FAO7B,yBAAyB,4CAsU3B,CAAA"}
package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ModifierSetControll.js CHANGED
@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
4
4
  import { useMemo, useEffect } from 'react';
5
5
  import { useId } from '@mantine/hooks';
6
6
  import { useFormContext, Controller } from 'react-hook-form';
7
- import { xor, uniqBy } from 'lodash';
7
+ import { xor } from 'lodash';
8
8
  import clsx from 'clsx';
9
9
  import { Currency } from '@licklist/core/dist/Config';
10
10
  import { useIntl } from 'react-intl';
@@ -61,18 +61,9 @@ import '../../../../table/utils/index.js';
61
61
  import '@tanstack/react-table';
62
62
 
63
63
  var ModifiersSetControl = function(param) {
64
- var modifierSet = param.modifierSet, modifiers = param.modifiers, modifiersSetWithErrors = param.modifiersSetWithErrors, productId = param.productId, _param_isLoading = param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, _param_isEditMode = param.isEditMode, isEditMode = _param_isEditMode === void 0 ? false : _param_isEditMode, orderProductModifierSets = param.orderProductModifierSets;
64
+ var modifierSet = param.modifierSet, modifiers = param.modifiers, productId = param.productId, _param_isLoading = param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, _param_isEditMode = param.isEditMode, isEditMode = _param_isEditMode === void 0 ? false : _param_isEditMode, orderProductModifierSets = param.orderProductModifierSets;
65
65
  var _useFormContext = useFormContext(), control = _useFormContext.control, watch = _useFormContext.watch, setValue = _useFormContext.setValue, trigger = _useFormContext.trigger;
66
66
  var t = useTranslation('App').t;
67
- var filteredOrderModifierSets = function(modifiersSet) {
68
- if (!modifiersSet) return [];
69
- var orderModifier = modifiersSet.flat().filter(function(modifier) {
70
- return !!(modifier === null || modifier === void 0 ? void 0 : modifier.quantity);
71
- });
72
- return uniqBy(orderModifier, function(item) {
73
- return "".concat(item.modifierId, "-").concat(item.modifierSetId);
74
- });
75
- };
76
67
  var orderModifiersSets = watch("".concat(productId, ".orderProductModifiers"));
77
68
  var formatNumber = useIntl().formatNumber;
78
69
  var formatToCurrency = function(value) {
@@ -81,13 +72,6 @@ var ModifiersSetControl = function(param) {
81
72
  currency: Currency.GBP
82
73
  });
83
74
  };
84
- var orderProductModifiersQuantity = function(orderModifiersSets) {
85
- var filteredOrderModifier = filteredOrderModifierSets(orderModifiersSets);
86
- return filteredOrderModifier.flat().filter(function(item) {
87
- return item && item.modifierSetId === modifierSet.id;
88
- }).length;
89
- };
90
- var orderProductModifiersMaxQuantity = orderProductModifiersQuantity(orderModifiersSets);
91
75
  var currentOrderModifiersSets = useMemo(function() {
92
76
  return (orderProductModifierSets === null || orderProductModifierSets === void 0 ? void 0 : orderProductModifierSets.filter(function(modifier) {
93
77
  return modifier.modifierSetId === modifierSet.id;
@@ -141,6 +125,7 @@ var ModifiersSetControl = function(param) {
141
125
  };
142
126
  setValue("".concat(productId, ".orderProductModifiers.").concat(modifierSet.id, ".").concat(selectedModifier.id), orderModifiers1);
143
127
  }
128
+ trigger("".concat(productId, ".orderProductModifiers"));
144
129
  };
145
130
  useEffect(function() {
146
131
  if (!(orderProductModifierSets === null || orderProductModifierSets === void 0 ? void 0 : orderProductModifierSets.length)) return;
@@ -150,50 +135,49 @@ var ModifiersSetControl = function(param) {
150
135
  }, [
151
136
  isEditMode
152
137
  ]);
153
- var modifiersErrors = modifiersSetWithErrors === null || modifiersSetWithErrors === void 0 ? void 0 : modifiersSetWithErrors.modifiers;
154
138
  return /*#__PURE__*/ jsx(Fragment, {
155
139
  children: (modifierSet === null || modifierSet === void 0 ? void 0 : modifierSet.maxItems) === 1 && modifiers.every(function(modifier) {
156
140
  return modifier.maxItems === 1;
157
141
  }) && !(currentOrderModifiersSets === null || currentOrderModifiersSets === void 0 ? void 0 : currentOrderModifiersSets.find(function(modifier) {
158
142
  return !!(modifier === null || modifier === void 0 ? void 0 : modifier.quantity);
159
- })) ? /*#__PURE__*/ jsxs(Fragment, {
160
- children: [
161
- /*#__PURE__*/ jsx(Controller, {
162
- name: "".concat(modifierSet.id),
163
- "data-testid": "modifierSet-values-select",
164
- control: control,
165
- rules: {
166
- required: !!modifierSet.minItems
167
- },
168
- render: function(param) {
169
- var field = param.field;
170
- var onChange = function(e) {
171
- onChangeModifiers(e, 'radio');
172
- field.onChange(e.target.id);
173
- };
174
- return /*#__PURE__*/ jsx(Fragment, {
175
- children: modifiers === null || modifiers === void 0 ? void 0 : modifiers.map(function(modifier) {
143
+ })) ? /*#__PURE__*/ jsx(Fragment, {
144
+ children: /*#__PURE__*/ jsx(Controller, {
145
+ name: "".concat(productId, ".orderProductModifiers.").concat(modifierSet.id),
146
+ control: control,
147
+ rules: {
148
+ required: {
149
+ value: !!modifierSet.minItems,
150
+ message: t('Validation:fieldRequired')
151
+ }
152
+ },
153
+ render: function(param) {
154
+ var field = param.field, fieldState = param.fieldState;
155
+ var onChange = function(e) {
156
+ onChangeModifiers(e, 'radio');
157
+ field.onChange(e.target.id);
158
+ };
159
+ return /*#__PURE__*/ jsxs(Fragment, {
160
+ children: [
161
+ modifiers.map(function(modifier) {
176
162
  var _currentOrderModifiersSets_find_modifierId, _currentOrderModifiersSets_find;
177
163
  var selectedOrderModifierId = currentOrderModifiersSets === null || currentOrderModifiersSets === void 0 ? void 0 : (_currentOrderModifiersSets_find = currentOrderModifiersSets.find(function(orderModifier) {
178
164
  return orderModifier.modifierId === modifier.id;
179
165
  })) === null || _currentOrderModifiersSets_find === void 0 ? void 0 : (_currentOrderModifiersSets_find_modifierId = _currentOrderModifiersSets_find.modifierId) === null || _currentOrderModifiersSets_find_modifierId === void 0 ? void 0 : _currentOrderModifiersSets_find_modifierId.toString();
180
166
  return /*#__PURE__*/ jsx(Col, {
181
- children: /*#__PURE__*/ jsxs(Fragment, {
167
+ children: /*#__PURE__*/ jsxs("div", {
168
+ className: "modifier-container d-flex flex-column p-2",
182
169
  children: [
183
- /*#__PURE__*/ jsx("div", {
184
- className: "modifier-container d-flex justify-content-between align-items-center p-2",
185
- children: /*#__PURE__*/ jsx(Form.Check, {
186
- className: "custom-radio",
187
- inline: true,
188
- id: modifier.id.toString(),
189
- defaultChecked: !!selectedOrderModifierId,
190
- defaultValue: modifier.id.toString(),
191
- checked: field.value === modifier.id.toString(),
192
- onChange: onChange,
193
- type: "radio",
194
- label: modifier.name,
195
- name: modifier.name
196
- })
170
+ /*#__PURE__*/ jsx(Form.Check, {
171
+ className: "custom-radio p-2",
172
+ inline: true,
173
+ id: modifier.id.toString(),
174
+ defaultChecked: !!selectedOrderModifierId,
175
+ defaultValue: modifier.id.toString(),
176
+ checked: field.value === modifier.id.toString(),
177
+ onChange: onChange,
178
+ type: "radio",
179
+ label: modifier.name,
180
+ name: modifier.name
197
181
  }),
198
182
  /*#__PURE__*/ jsxs("div", {
199
183
  className: "mt-3 w-100 pl-2",
@@ -212,56 +196,115 @@ var ModifiersSetControl = function(param) {
212
196
  })
213
197
  ]
214
198
  })
215
- }, modifier.id.toString());
199
+ }, modifier.id);
200
+ }),
201
+ fieldState.error && /*#__PURE__*/ jsx("div", {
202
+ className: "invalid-feedback d-block",
203
+ children: fieldState.error.message
216
204
  })
217
- });
218
- }
219
- }),
220
- (modifiersErrors === null || modifiersErrors === void 0 ? void 0 : modifiersErrors.message) && /*#__PURE__*/ jsx(Col, {
221
- children: /*#__PURE__*/ jsx("div", {
222
- className: "invalid-feedback field-values-error",
223
- children: modifiersSetWithErrors.message || 'test'
224
- })
225
- })
226
- ]
205
+ ]
206
+ });
207
+ }
208
+ })
227
209
  }) : /*#__PURE__*/ jsx(Fragment, {
228
210
  children: modifiers === null || modifiers === void 0 ? void 0 : modifiers.map(function(modifier, index) {
229
- var _currentOrderModifiersSets_find, _modifiersErrors_find;
211
+ var _currentOrderModifiersSets_find;
230
212
  var selectedOrderModifier = currentOrderModifiersSets === null || currentOrderModifiersSets === void 0 ? void 0 : (_currentOrderModifiersSets_find = currentOrderModifiersSets.find(function(orderModifier) {
231
213
  return orderModifier.modifierId === modifier.id;
232
214
  })) === null || _currentOrderModifiersSets_find === void 0 ? void 0 : _currentOrderModifiersSets_find.quantity;
233
- var requiredModifierSet = (modifierSet === null || modifierSet === void 0 ? void 0 : modifierSet.minItems) > currentOrderModifiersSets.length;
234
- var errorMessage = modifiersErrors === null || modifiersErrors === void 0 ? void 0 : (_modifiersErrors_find = modifiersErrors.find(function(modifier) {
235
- return modifier.ref && modifier.ref.name === "modifiers[".concat(index, "]");
236
- })) === null || _modifiersErrors_find === void 0 ? void 0 : _modifiersErrors_find.message;
237
- return /*#__PURE__*/ jsxs(Fragment, {
238
- children: [
239
- modifier.maxItems === 1 ? /*#__PURE__*/ jsx(Fragment, {
240
- children: /*#__PURE__*/ jsx(Controller, {
241
- name: "modifiers[".concat(index, "]"),
215
+ return /*#__PURE__*/ jsx(Fragment, {
216
+ children: modifier.maxItems === 1 ? /*#__PURE__*/ jsx(Fragment, {
217
+ children: /*#__PURE__*/ jsx(Controller, {
218
+ name: "".concat(productId, ".").concat(modifierSet.id, ".modifiers[").concat(index, "]"),
219
+ control: control,
220
+ rules: {
221
+ required: {
222
+ value: !!modifier.minItems,
223
+ message: t('Validation:fieldRequired')
224
+ },
225
+ validate: function(value) {
226
+ var maxItems = modifier.maxItems, minItems = modifier.minItems;
227
+ if ((value === null || value === void 0 ? void 0 : value.length) > maxItems) {
228
+ return t('Validation:quantityMaxNumberModifier', {
229
+ max: maxItems
230
+ });
231
+ }
232
+ if ((value === null || value === void 0 ? void 0 : value.length) < minItems) {
233
+ return t('Validation:quantityMinNumberModifier', {
234
+ min: minItems
235
+ });
236
+ }
237
+ return true;
238
+ }
239
+ },
240
+ render: function(param) {
241
+ var field = param.field, error = param.fieldState.error;
242
+ var onChange = function(e) {
243
+ onChangeModifiers(e, 'checkbox');
244
+ field.onChange(xor(field.value, [
245
+ Number(e.target.value)
246
+ ]));
247
+ };
248
+ return /*#__PURE__*/ jsxs(Col, {
249
+ className: "modifier-container pl-4",
250
+ children: [
251
+ /*#__PURE__*/ jsx("div", {
252
+ className: "d-flex justify-content-between pl-2 align-items-center",
253
+ children: /*#__PURE__*/ jsx(Checkbox, {
254
+ value: modifier.id,
255
+ onChange: onChange,
256
+ label: modifier.name,
257
+ defaultChecked: !!selectedOrderModifier
258
+ })
259
+ }),
260
+ /*#__PURE__*/ jsxs("div", {
261
+ className: "mt-3 w-100 pl-2",
262
+ children: [
263
+ /*#__PURE__*/ jsx("p", {
264
+ children: modifier.description
265
+ }),
266
+ /*#__PURE__*/ jsxs("div", {
267
+ className: "price",
268
+ children: [
269
+ "+ ",
270
+ formatToCurrency(modifier.price)
271
+ ]
272
+ })
273
+ ]
274
+ }),
275
+ (error === null || error === void 0 ? void 0 : error.message) && /*#__PURE__*/ jsx("div", {
276
+ className: "invalid-feedback d-flex",
277
+ children: error === null || error === void 0 ? void 0 : error.message
278
+ })
279
+ ]
280
+ }, modifier.id.toString());
281
+ }
282
+ })
283
+ }) : /*#__PURE__*/ jsxs(Fragment, {
284
+ children: [
285
+ /*#__PURE__*/ jsx("div", {
286
+ className: "modifier-header m-0",
287
+ children: /*#__PURE__*/ jsx("div", {
288
+ className: "title",
289
+ children: modifier.name
290
+ })
291
+ }),
292
+ /*#__PURE__*/ jsx(Controller, {
242
293
  control: control,
294
+ name: "".concat(productId, ".").concat(modifierSet.id, ".modifiers[").concat(index, "].quantity"),
243
295
  rules: {
244
- required: !!modifier.minItems || requiredModifierSet,
296
+ required: {
297
+ value: !!modifier.minItems,
298
+ message: t('Validation:fieldRequired')
299
+ },
245
300
  validate: function(value) {
246
- if (!value) return true;
247
- var maxModifierSet = modifierSet.maxItems, minModifierSet = modifierSet.minItems;
248
- if (orderProductModifiersMaxQuantity < minModifierSet) {
249
- return t('Validation:quantityMinNumberModifier', {
250
- min: minModifierSet
251
- });
252
- }
253
- if (orderProductModifiersMaxQuantity > maxModifierSet) {
254
- return t('Validation:quantityMaxNumberModifier', {
255
- max: maxModifierSet
256
- });
257
- }
258
301
  var maxItems = modifier.maxItems, minItems = modifier.minItems;
259
- if ((value === null || value === void 0 ? void 0 : value.length) > maxItems) {
302
+ if (value > maxItems) {
260
303
  return t('Validation:quantityMaxNumberModifier', {
261
304
  max: maxItems
262
305
  });
263
306
  }
264
- if ((value === null || value === void 0 ? void 0 : value.length) < minItems) {
307
+ if (value < minItems) {
265
308
  return t('Validation:quantityMinNumberModifier', {
266
309
  min: minItems
267
310
  });
@@ -270,159 +313,68 @@ var ModifiersSetControl = function(param) {
270
313
  }
271
314
  },
272
315
  render: function(param) {
273
- var field = param.field;
274
- var onChange = function(e) {
275
- onChangeModifiers(e, 'checkbox');
276
- field.onChange(xor(field.value, [
277
- Number(e.target.value)
278
- ]));
316
+ var _param_field = param.field, onChange = _param_field.onChange, value = _param_field.value, ref = _param_field.ref, _param_fieldState = param.fieldState, invalid = _param_fieldState.invalid, error = _param_fieldState.error;
317
+ var onChangeProductQuantity = function(val) {
318
+ var quantity = Math.min(MAX_PRODUCT_NUMBER, Math.max(0, Math.ceil(val)));
319
+ onChange(quantity);
320
+ trigger("".concat(productId, ".").concat(modifierSet.id, ".modifiers[").concat(index, "].quantity"));
321
+ onChangeModifiers({
322
+ target: {
323
+ id: modifier.id.toString()
324
+ }
325
+ }, 'selector', quantity);
279
326
  };
280
- return /*#__PURE__*/ jsxs(Col, {
281
- className: "modifier-container pl-6",
327
+ var _ref;
328
+ return /*#__PURE__*/ jsxs("div", {
329
+ className: "modifier-container",
282
330
  children: [
283
331
  /*#__PURE__*/ jsx("div", {
284
- className: "d-flex justify-content-between align-items-center",
285
- children: /*#__PURE__*/ jsx(Checkbox, {
286
- value: modifier.id,
287
- onChange: onChange,
288
- label: modifier.name,
289
- defaultChecked: !!selectedOrderModifier
332
+ className: "d-flex align-items-center column mb-8 pl-6 pt-2",
333
+ children: /*#__PURE__*/ jsx("div", {
334
+ className: "quantity-container mb-0",
335
+ children: /*#__PURE__*/ jsx(NumberInputHorizontal, {
336
+ ref: ref,
337
+ size: "big",
338
+ onChange: onChangeProductQuantity,
339
+ onMinusClick: onChangeProductQuantity,
340
+ onPlusClick: onChangeProductQuantity,
341
+ min: 0,
342
+ max: MAX_PRODUCT_NUMBER,
343
+ value: (_ref = value !== null && value !== void 0 ? value : selectedOrderModifier) !== null && _ref !== void 0 ? _ref : 0,
344
+ className: clsx(invalid && 'error'),
345
+ isLoading: isLoading
346
+ })
290
347
  })
291
348
  }),
292
349
  /*#__PURE__*/ jsxs("div", {
293
- className: "mt-3 w-100 pl-2",
350
+ className: "p-2 mt-3 w-100 pl-4",
294
351
  children: [
295
352
  /*#__PURE__*/ jsx("p", {
353
+ className: "pl-2",
296
354
  children: modifier.description
297
355
  }),
298
356
  /*#__PURE__*/ jsxs("div", {
299
- className: "price",
357
+ className: "pl-2 price",
300
358
  children: [
301
359
  "+ ",
302
360
  formatToCurrency(modifier.price)
303
361
  ]
362
+ }),
363
+ (error === null || error === void 0 ? void 0 : error.message) && /*#__PURE__*/ jsx("div", {
364
+ className: "d-flex mt-3 w-100",
365
+ children: /*#__PURE__*/ jsx("p", {
366
+ className: "iframe-event__message-error",
367
+ children: error.message
368
+ })
304
369
  })
305
370
  ]
306
- }),
307
- errorMessage && /*#__PURE__*/ jsx("div", {
308
- className: "invalid-feedback d-flex",
309
- children: errorMessage
310
371
  })
311
372
  ]
312
- }, modifier.id.toString());
373
+ });
313
374
  }
314
375
  })
315
- }) : /*#__PURE__*/ jsxs(Fragment, {
316
- children: [
317
- /*#__PURE__*/ jsx("div", {
318
- className: "modifier-header m-0",
319
- children: /*#__PURE__*/ jsx("div", {
320
- className: "title",
321
- children: modifier.name
322
- })
323
- }),
324
- /*#__PURE__*/ jsx(Controller, {
325
- control: control,
326
- name: "".concat(productId, ".").concat(modifierSet.id, ".modifiers[").concat(index, "].quantity"),
327
- rules: {
328
- required: !!modifier.minItems || requiredModifierSet,
329
- validate: function(value) {
330
- // if (!value) return true
331
- var maxModifierSet = modifierSet.maxItems, minModifierSet = modifierSet.minItems;
332
- if (orderProductModifiersMaxQuantity < minModifierSet) {
333
- return t('Validation:quantityMinNumberModifier', {
334
- min: minModifierSet
335
- });
336
- }
337
- if (orderProductModifiersMaxQuantity > maxModifierSet) {
338
- return t('Validation:quantityMaxNumberModifier', {
339
- max: maxModifierSet
340
- });
341
- }
342
- var maxItems = modifier.maxItems, minItems = modifier.minItems;
343
- if (value > maxItems) {
344
- return t('Validation:quantityMaxNumberModifier', {
345
- max: maxItems
346
- });
347
- }
348
- if (value < minItems) {
349
- return t('Validation:quantityMinNumberModifier', {
350
- min: minItems
351
- });
352
- }
353
- return true;
354
- }
355
- },
356
- render: function(param) {
357
- var _param_field = param.field, onChange = _param_field.onChange, value = _param_field.value, ref = _param_field.ref, _param_fieldState = param.fieldState, invalid = _param_fieldState.invalid, error = _param_fieldState.error;
358
- var onChangeProductQuantity = function(val) {
359
- var quantity = Math.min(MAX_PRODUCT_NUMBER, Math.max(0, Math.ceil(val)));
360
- onChange(quantity);
361
- trigger("".concat(productId, ".").concat(modifierSet.id, ".modifiers[").concat(index, "].quantity"));
362
- onChangeModifiers({
363
- target: {
364
- id: modifier.id.toString()
365
- }
366
- }, 'selector', quantity);
367
- };
368
- var _ref;
369
- return /*#__PURE__*/ jsxs("div", {
370
- className: "modifier-container",
371
- children: [
372
- /*#__PURE__*/ jsx("div", {
373
- className: "d-flex align-items-center column mb-8 pl-6 pt-2",
374
- children: /*#__PURE__*/ jsx("div", {
375
- className: "quantity-container mb-0",
376
- children: /*#__PURE__*/ jsx(NumberInputHorizontal, {
377
- ref: ref,
378
- size: "big",
379
- onChange: onChangeProductQuantity,
380
- onMinusClick: onChangeProductQuantity,
381
- onPlusClick: onChangeProductQuantity,
382
- min: 0,
383
- max: MAX_PRODUCT_NUMBER,
384
- value: (_ref = value !== null && value !== void 0 ? value : selectedOrderModifier) !== null && _ref !== void 0 ? _ref : 0,
385
- className: clsx(invalid && 'error'),
386
- isLoading: isLoading
387
- })
388
- })
389
- }),
390
- /*#__PURE__*/ jsxs("div", {
391
- className: "p-2 mt-3 w-100 pl-4",
392
- children: [
393
- /*#__PURE__*/ jsx("p", {
394
- className: "pl-2",
395
- children: modifier.description
396
- }),
397
- /*#__PURE__*/ jsxs("div", {
398
- className: "pl-2 price",
399
- children: [
400
- "+ ",
401
- formatToCurrency(modifier.price)
402
- ]
403
- }),
404
- (error === null || error === void 0 ? void 0 : error.message) && /*#__PURE__*/ jsx("div", {
405
- className: "d-flex mt-3 w-100",
406
- children: /*#__PURE__*/ jsx("p", {
407
- className: "iframe-event__message-error",
408
- children: error.message
409
- })
410
- })
411
- ]
412
- })
413
- ]
414
- });
415
- }
416
- })
417
- ]
418
- }),
419
- (modifiersErrors === null || modifiersErrors === void 0 ? void 0 : modifiersErrors.message) && /*#__PURE__*/ jsx(Col, {
420
- children: /*#__PURE__*/ jsx("div", {
421
- className: "invalid-feedback field-values-error",
422
- children: modifiersSetWithErrors.message || 'test'
423
- })
424
- })
425
- ]
376
+ ]
377
+ })
426
378
  });
427
379
  })
428
380
  })
package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.d.ts CHANGED
@@ -1,12 +1,10 @@
1
- import { FieldErrors, FieldValues } from 'react-hook-form';
2
1
  import { OrderModifierByProduct } from '@licklist/core/dist/DataMapper/Order/OrderModifiierByProduct';
3
2
  import { Product } from '@licklist/plugins/dist/types/context/sale/menuSteps';
4
3
  interface ProductControlProps {
5
4
  product: Product;
6
5
  isLoading?: boolean;
7
6
  editOrderModifier?: OrderModifierByProduct;
8
- errors?: FieldErrors<FieldValues>;
9
7
  }
10
- export declare const ProductControl: ({ product, isLoading, editOrderModifier, errors, }: ProductControlProps) => import("react/jsx-runtime").JSX.Element;
8
+ export declare const ProductControl: ({ product, isLoading, editOrderModifier, }: ProductControlProps) => import("react/jsx-runtime").JSX.Element;
11
9
  export {};
12
10
  //# sourceMappingURL=ProductControll.d.ts.map
package/dist/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ProductControll.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,WAAW,EACX,WAAW,EACZ,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,sBAAsB,EAAE,MAAM,8DAA8D,CAAA;AACrG,OAAO,EAAE,OAAO,EAAE,MAAM,qDAAqD,CAAA;AAG7E,UAAU,mBAAmB;IAC3B,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,iBAAiB,CAAC,EAAE,sBAAsB,CAAA;IAC1C,MAAM,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAA;CAClC;AAED,eAAO,MAAM,cAAc,uDAKxB,mBAAmB,4CAgCrB,CAAA"}
1
+ {"version":3,"file":"ProductControll.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/ProductWithModifierModal/ModifierSetModal/controll/ProductControll.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,sBAAsB,EAAE,MAAM,8DAA8D,CAAA;AACrG,OAAO,EAAE,OAAO,EAAE,MAAM,qDAAqD,CAAA;AAK7E,UAAU,mBAAmB;IAC3B,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,iBAAiB,CAAC,EAAE,sBAAsB,CAAA;CAC3C;AAED,eAAO,MAAM,cAAc,+CAIxB,mBAAmB,4CA6ErB,CAAA"}