@licklist/design 0.44.467 → 0.44.468

package/dist/iframe/order-process/components/StepsForm/StepsForm.d.ts

@@ -2,8 +2,6 @@ import React from "react";
 import { ProductQuantityCheckResponse } from "@licklist/plugins/dist/types/Api/verifyStock";
 import { MenuStep } from "../../../../types";
 export interface StepsFormProps {
-    relyOnPeopleCategoryIds?: number[];
-    ticketCategoriesIds?: number[];
     step: MenuStep;
     isLastMenuStep: boolean;
     onSubmit: (values: Record<string, any>) => void;

package/dist/iframe/order-process/components/StepsForm/StepsForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StepsForm.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/order-process/components/StepsForm/StepsForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAWf,OAAO,EAAE,4BAA4B,EAAE,MAAM,8CAA8C,CAAC;AAG5F,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAO7C,MAAM,WAAW,cAAc;IAC7B,uBAAuB,CAAC,EAAE,MAAM,EAAE,CAAC;IACnC,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B,IAAI,EAAE,QAAQ,CAAC;IACf,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAChD,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACrD,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACtD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,kBAAkB,CAAC,EAAE,4BAA4B,CAAC,UAAU,CAAC,CAAC;CAC/D;AAED,oBAAY,YAAY,GAAG;IACzB,aAAa,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,SAAS,qFA0JrB,CAAC"}
+{"version":3,"file":"StepsForm.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/order-process/components/StepsForm/StepsForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAKN,MAAM,OAAO,CAAC;AAWf,OAAO,EAAE,4BAA4B,EAAE,MAAM,8CAA8C,CAAC;AAE5F,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAO7C,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,QAAQ,CAAC;IACf,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IAChD,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACrD,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACnC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC;IACtD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,kBAAkB,CAAC,EAAE,4BAA4B,CAAC,UAAU,CAAC,CAAC;CAC/D;AAED,oBAAY,YAAY,GAAG;IACzB,aAAa,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,SAAS,qFAoIrB,CAAC"}

package/dist/iframe/order-process/components/StepsForm/StepsForm.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,r=require("tslib"),t=require("react"),o=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,s=require("react-i18next"),u=require("react-bootstrap"),i=require("react-hook-form"),n=require("lodash"),l=require("@licklist/plugins/dist/hooks/Value/usePreviousValue"),a=require("@licklist/plugins/dist/utils/ScrollUtils"),c=require("@licklist/plugins/dist/utils/FormValues"),d=require("../../../event/event-details/components/number-of-people-input/NumberOfPeopleInput.js"),m=require("../Category/Category.js"),f=require("../../constants.js"),p=require("../CalendarStepsForm/components/ErrorModal.js"),E=require("../utils/category.js"),g="NO_ORDER_ITEMS_ERROR",v=t.forwardRef((function(e,v){var y=e.step,q=e.isLastMenuStep,F=e.relyOnPeopleCategoryIds,S=void 0===F?[]:F,C=e.ticketCategoriesIds,h=void 0===C?[]:C,O=e.setFormValues,V=e.defaultValues,_=e.onSubmit,b=e.setFormErrors,P=e.id,j=void 0===P?f.STEP_FORM_ID:P,I=e.productsWithErrors,k=i.useForm({defaultValues:V}),M=s.useTranslation(["Design","Validation"]).t,R=r.__read(t.useState(""),2),T=R[0],N=R[1],x=E.useCategory().verifyCategoryItems,B=k.control,D=k.formState.errors,K=k.getValues,W=k.setError,L=k.clearErrors,w=k.reset,A=i.useWatch({control:B}),H=l.usePreviousValue(D),U=t.useMemo((function(){if(h.length||!(null==S?void 0:S.length))return!1;var e=Object.values(A).filter(Boolean).filter((function(e){return S.includes(e.productsCategoryId)&&e.quantity>0&&!e.isSoldOut}));return Boolean(e.length)}),[A,S,h]);t.useImperativeHandle(v,(function(){return{getFormValues:function(){return K()}}})),t.useEffect((function(){I&&N(M("soldOutProduct"))}),[I]);return t.useEffect((function(){D&&setTimeout(L,0),O(A)}),[A]),t.useEffect((function(){c.isFormValuesEmpty(A)||L(g)}),[A,L]),t.useEffect((function(){w(V)}),[V]),t.useEffect((function(){!n.isEqual(D,H)&&b&&b(D)}),[D,H,b]),o.createElement(u.Form,{onSubmit:k.handleSubmit((function(e){if(q&&c.isFormValuesEmpty(e))return W(g,{}),void a.scrollToError(g);var r=x(e,y);if(r)return N(r.message),void W("category_".concat(r.id),{message:r.message});_(e)}),(function(e){a.scrollToError(c.getFirstErrorKey(e)),N(M("pleaseCheckSelectedProducts"))})),id:j},o.createElement(i.FormProvider,r.__assign({},k),o.createElement(p.ErrorModal,{isOpen:Boolean(T),messageKey:T,onClose:function(){return N("")}}),o.createElement("div",null,o.createElement("div",{className:"iframe-event"},o.createElement(m.Category,{productCategories:null==y?void 0:y.productCategories,productsWithErrors:I,errors:D}),U&&q&&o.createElement(d.NumberOfPeopleInput,null),D[g]&&o.createElement("div",{className:"d-flex m-5 justify-content-center form-error",id:g},o.createElement(s.Trans,{t:M,i18nKey:"pleaseSelectAtLeastFrom",values:{min:1,type:"item",from:"those categories"}}))))))}));exports.StepsForm=v;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,r=require("tslib"),t=require("react"),s=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,o=require("react-i18next"),i=require("react-bootstrap"),u=require("react-hook-form"),a=require("lodash"),l=require("@licklist/plugins/dist/hooks/Value/usePreviousValue"),n=require("@licklist/plugins/dist/utils/ScrollUtils"),c=require("@licklist/plugins/dist/utils/FormValues"),m=require("../Category/Category.js"),d=require("../../constants.js"),f=require("../CalendarStepsForm/components/ErrorModal.js"),E=require("../utils/category.js"),p="NO_ORDER_ITEMS_ERROR",g=t.forwardRef((function(e,g){var v=e.step,y=e.isLastMenuStep,q=e.setFormValues,F=e.defaultValues,S=e.onSubmit,V=e.setFormErrors,_=e.id,C=void 0===_?d.STEP_FORM_ID:_,h=e.productsWithErrors,b=u.useForm({defaultValues:F}),j=o.useTranslation(["Design","Validation"]).t,O=r.__read(t.useState(""),2),P=O[0],R=O[1],T=E.useCategory().verifyCategoryItems,k=b.control,M=b.formState.errors,x=b.getValues,I=b.setError,D=b.clearErrors,K=b.reset,N=u.useWatch({control:k}),W=l.usePreviousValue(M);t.useImperativeHandle(g,(function(){return{getFormValues:function(){return x()}}})),t.useEffect((function(){h&&R(j("soldOutProduct"))}),[h]);return t.useEffect((function(){M&&setTimeout(D,0),q(N)}),[N]),t.useEffect((function(){c.isFormValuesEmpty(N)||D(p)}),[N,D]),t.useEffect((function(){K(F)}),[F]),t.useEffect((function(){!a.isEqual(M,W)&&V&&V(M)}),[M,W,V]),s.createElement(i.Form,{onSubmit:b.handleSubmit((function(e){if(y&&c.isFormValuesEmpty(e))return I(p,{}),void n.scrollToError(p);var r=T(e,v);if(r)return R(r.message),void I("category_".concat(r.id),{message:r.message});S(e)}),(function(e){n.scrollToError(c.getFirstErrorKey(e)),R(j("pleaseCheckSelectedProducts"))})),id:C},s.createElement(u.FormProvider,r.__assign({},b),s.createElement(f.ErrorModal,{isOpen:Boolean(P),messageKey:P,onClose:function(){return R("")}}),s.createElement("div",null,s.createElement("div",{className:"iframe-event"},s.createElement(m.Category,{productCategories:null==v?void 0:v.productCategories,productsWithErrors:h,errors:M}),M[p]&&s.createElement("div",{className:"d-flex m-5 justify-content-center form-error",id:p},s.createElement(o.Trans,{t:j,i18nKey:"pleaseSelectAtLeastFrom",values:{min:1,type:"item",from:"those categories"}}))))))}));exports.StepsForm=g;

package/dist/styles/iframe-events/Event.scss

@@ -109,7 +109,7 @@
   }
 
   &__product-count {
-    margin-left: 3rem;
+    margin-left: 1.5rem;
   }
 
   &__product-count.error {

package/dist/styles/iframe-page/PageBody.scss

@@ -119,6 +119,7 @@
 
         &.show {
           overflow: scroll;
+          overflow-x: hidden;
         }
 
         @include media-breakpoint-down(sm) {
@@ -164,7 +165,8 @@
     }
   }
 
-  input, select {
+  input,
+  select {
     border-radius: $iframe-border-radius;
     height: 2.25rem;
     padding: 0.25rem 0.5rem;
@@ -205,16 +207,16 @@
     &:focus,
     &.focus {
       &:not(:disabled) {
-        background-color:  darken(#0E8CE2, 10%);
-        box-shadow: 0 0 0 $input-btn-focus-width darken(#0E8CE2, 10%);
+        background-color: darken(#0e8ce2, 10%);
+        box-shadow: 0 0 0 $input-btn-focus-width darken(#0e8ce2, 10%);
       }
     }
 
     &:active,
     &.active {
       &:not(:disabled) {
-        background-color: darken(#0E8CE2, 10%);
-        box-shadow: 0 0 0 $input-btn-focus-width darken(#0E8CE2, 10%);
+        background-color: darken(#0e8ce2, 10%);
+        box-shadow: 0 0 0 $input-btn-focus-width darken(#0e8ce2, 10%);
       }
     }
   }
@@ -229,7 +231,7 @@
     font-size: 0.875rem;
     height: 2.25rem;
 
-    &:focus{
+    &:focus {
       box-shadow: unset;
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.44.467",
+  "version": "0.44.468",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"

package/src/iframe/order-process/components/StepsForm/StepsForm.tsx

@@ -1,6 +1,5 @@
 import React, {
   useEffect,
-  useMemo,
   forwardRef,
   useImperativeHandle,
   useState,
@@ -17,7 +16,6 @@ import {
 } from "@licklist/plugins/dist/utils/FormValues";
 import { ProductQuantityCheckResponse } from "@licklist/plugins/dist/types/Api/verifyStock";
 import { Category } from "../Category";
-import { NumberOfPeopleInput } from "../../../event/event-details/components/number-of-people-input";
 import { MenuStep } from "../../../../types";
 import { STEP_FORM_ID } from "../../constants";
 import { ErrorModal } from "../CalendarStepsForm/components/ErrorModal";
@@ -26,8 +24,6 @@ import { useCategory } from "../utils/category";
 const NO_ORDER_ITEMS_ERROR = "NO_ORDER_ITEMS_ERROR";
 
 export interface StepsFormProps {
-  relyOnPeopleCategoryIds?: number[];
-  ticketCategoriesIds?: number[];
   step: MenuStep;
   isLastMenuStep: boolean;
   onSubmit: (values: Record<string, any>) => void;
@@ -47,8 +43,6 @@ export const StepsForm = forwardRef<StepsFormRef, StepsFormProps>(
     {
       step,
       isLastMenuStep,
-      relyOnPeopleCategoryIds = [],
-      ticketCategoriesIds = [],
       setFormValues,
       defaultValues,
       onSubmit,
@@ -74,22 +68,6 @@ export const StepsForm = forwardRef<StepsFormRef, StepsFormProps>(
     const formValues = useWatch({ control });
     const prevErrors = usePreviousValue(errors);
 
-    const shouldShowPeopleInput = useMemo(() => {
-      if (ticketCategoriesIds.length || !relyOnPeopleCategoryIds?.length) {
-        return false;
-      }
-      const values = Object.values(formValues)
-        .filter(Boolean)
-        .filter(
-          (product) =>
-            relyOnPeopleCategoryIds.includes(product.productsCategoryId) &&
-            product.quantity > 0 &&
-            !product.isSoldOut
-        );
-
-      return Boolean(values.length);
-    }, [formValues, relyOnPeopleCategoryIds, ticketCategoriesIds]);
-
     useImperativeHandle(ref, () => {
       return {
         getFormValues: () => getValues(),
@@ -174,10 +152,6 @@ export const StepsForm = forwardRef<StepsFormRef, StepsFormProps>(
                 errors={errors}
               />
 
-              {shouldShowPeopleInput && isLastMenuStep && (
-                <NumberOfPeopleInput />
-              )}
-
               {errors[NO_ORDER_ITEMS_ERROR] && (
                 <div
                   className="d-flex m-5 justify-content-center form-error"

package/src/styles/iframe-events/Event.scss

@@ -109,7 +109,7 @@
   }
 
   &__product-count {
-    margin-left: 3rem;
+    margin-left: 1.5rem;
   }
 
   &__product-count.error {

package/src/styles/iframe-page/PageBody.scss

@@ -119,6 +119,7 @@
 
         &.show {
           overflow: scroll;
+          overflow-x: hidden;
         }
 
         @include media-breakpoint-down(sm) {
@@ -164,7 +165,8 @@
     }
   }
 
-  input, select {
+  input,
+  select {
     border-radius: $iframe-border-radius;
     height: 2.25rem;
     padding: 0.25rem 0.5rem;
@@ -205,16 +207,16 @@
     &:focus,
     &.focus {
       &:not(:disabled) {
-        background-color:  darken(#0E8CE2, 10%);
-        box-shadow: 0 0 0 $input-btn-focus-width darken(#0E8CE2, 10%);
+        background-color: darken(#0e8ce2, 10%);
+        box-shadow: 0 0 0 $input-btn-focus-width darken(#0e8ce2, 10%);
       }
     }
 
     &:active,
     &.active {
       &:not(:disabled) {
-        background-color: darken(#0E8CE2, 10%);
-        box-shadow: 0 0 0 $input-btn-focus-width darken(#0E8CE2, 10%);
+        background-color: darken(#0e8ce2, 10%);
+        box-shadow: 0 0 0 $input-btn-focus-width darken(#0e8ce2, 10%);
       }
     }
   }
@@ -229,7 +231,7 @@
     font-size: 0.875rem;
     height: 2.25rem;
 
-    &:focus{
+    &:focus {
       box-shadow: unset;
     }
   }