@licklist/design 0.74.0-dev.1 → 0.74.0

package/src/product-set/form/context.tsx

@@ -8,9 +8,12 @@ import {
 } from 'react'
 import { VenueMapSet } from '@licklist/core/dist/DataMapper/Product/VenueMapSetDataMapper'
 import { ModifierSet } from '@licklist/core/dist/DataMapper/Product/ModifierSetDataMapper'
+// eslint-disable-next-line max-len
+import { ProviderBookingManagementSetting } from '@licklist/core/dist/DataMapper/Provider/ProviderBookingManagementSettingDataMapper'
 import { Zone } from '@licklist/core/dist/DataMapper/Provider/ZoneDataMapper'
 import { SelectItem } from '../../types/generic/SelectItem'
 
+
 interface LoadingContext {
   isLoading: boolean
   setLoading: (loading: boolean) => void
@@ -18,7 +21,7 @@ interface LoadingContext {
   modifiersSetList?: ModifierSet[] | null
   providerHasMap?: boolean | null
   venueMapSets?: VenueMapSet[]
-  providerHasBookingManagement?: boolean
+  providerHasBookingManagement?: ProviderBookingManagementSetting['hasBookingManagement']
   zones?: Zone[] | null
   expandedProductCategories: Record<string, boolean>
   setExpandedProductCategories: Dispatch<
@@ -43,7 +46,7 @@ type ProductSetContextProviderProps = PropsWithChildren<
 export function ProductSetContextProvider({
   children,
   productGroupList = [],
-  modifiersSetList = [],
+  modifiersSetList =[],
   providerHasMap = false,
   venueMapSets = [],
   providerHasBookingManagement,

package/src/product-set/product/ProductControl.tsx

@@ -1,13 +1,11 @@
 import {
   CategoryType,
   QuantityType,
+  QUANTITY_TYPE_CONSTANT,
+  QUANTITY_TYPE_LIST_DTO,
+  QUANTITY_TYPE_RECHARGING,
 } from '@licklist/core/dist/DataMapper/Product/ProductCategoryDataMapper'
-import {
-  PRODUCT_WAIVER_TYPE_ADULT,
-  PRODUCT_WAIVER_TYPE_CHILD,
-  ProductType,
-  ProductWaiverType,
-} from '@licklist/core/dist/DataMapper/Product/ProductDataMapper'
+import { ProductType } from '@licklist/core/dist/DataMapper/Product/ProductDataMapper'
 import HookFormService from '@licklist/plugins/dist/services/Form/HookFormService'
 import clsx from 'clsx'
 import {
@@ -30,11 +28,13 @@ import {
   Controller,
   Path,
   useFormContext,
+  useWatch,
   UnpackNestedValue,
   PathValue,
 } from 'react-hook-form'
 import { useTranslation } from 'react-i18next'
 import { useImages } from '@licklist/plugins/dist/hooks/Media/useImages'
+
 import {
   Image,
   IMAGE_TYPE_IMAGE,
@@ -65,7 +65,7 @@ import { MAX_PRODUCT_DESCRIPTION_CHARACTERS_LENGTH } from './constants'
 import { ProductZoneControlValues } from '../product-zone'
 import { AdvancedOptions } from './advanced-options'
 import { ProductZonesControl } from '../form/ProductZonesControl'
-import { ProductScanRangeControl } from './scanRange'
+
 
 export interface ModifiersSet {
   id: number
@@ -87,8 +87,6 @@ export interface ProductControlValues
   deposit: number
   minQuantity: number
   maxQuantity: number
-  scanRangeStart?: number
-  scanRangeEnd?: number
   totalQuantity: number
   isAvailable: boolean
   isSoldOut: boolean
@@ -108,7 +106,6 @@ export interface ProductControlValues
   sort: number | null
   color?: string
   productZones?: ProductZoneControlValues[]
-  waiverType?: ProductWaiverType | null
 }
 
 export interface ProductControlProps<T>
@@ -125,7 +122,7 @@ export interface ProductControlProps<T>
   hasTicket?: boolean
   categoryType?: CategoryType
   isOverrides?: boolean
-  isWaiverEnabled: boolean
+
 }
 
 export function ProductControl<T extends FormValues>({
@@ -139,8 +136,8 @@ export function ProductControl<T extends FormValues>({
   productName,
   categoryType,
   isOverrides = false,
-  isWaiverEnabled,
 }: ProductControlProps<T>) {
+
   const {
     register,
     control,
@@ -206,6 +203,7 @@ export function ProductControl<T extends FormValues>({
     setInitialImages(formImages as Image[])
   }, [getValues, setInitialImages, fieldNamePrefix])
 
+
   useEffect(() => {
     if (Array.isArray(images)) {
       setValue(
@@ -301,21 +299,14 @@ export function ProductControl<T extends FormValues>({
               isOverrides={isOverrides}
               onFocus={onFocus}
             />
-
-            <ProductQuantityRechargingControl<T>
-              isLoading={isLoading}
-              fieldNamePrefix={fieldNamePrefix}
-              onFocus={onFocus}
-              disabled={isUnlimited}
-            />
-
-            <ProductScanRangeControl<T>
-              isLoading={isLoading}
-              fieldNamePrefix={fieldNamePrefix}
-              isOverrides={isOverrides}
-              onFocus={onFocus}
-            />
-
+   
+              <ProductQuantityRechargingControl<T>
+                isLoading={isLoading}
+                fieldNamePrefix={fieldNamePrefix}
+                onFocus={onFocus}
+                disabled={isUnlimited}
+              />
+            
             <Form.Group
               controlId={unlimitedQuantityId}
               className='custom-checkbox'
@@ -420,36 +411,6 @@ export function ProductControl<T extends FormValues>({
             name={`${fieldNamePrefix}.isSoldOut` as Path<T>}
           />
         </Form.Group>
-
-        {isWaiverEnabled && (
-          <Form.Group>
-            <Form.Label>{t('Design:waiverType')}</Form.Label>
-            <Form.Control
-              {...register(`${fieldNamePrefix}.waiverType` as Path<T>)}
-              as='select'
-              defaultValue={PRODUCT_WAIVER_TYPE_ADULT}
-              disabled={isOverrides}
-              isInvalid={HookFormService.isInvalid(
-                `${fieldNamePrefix}.waiverType` as Path<T>,
-                errors,
-              )}
-            >
-              <option value={PRODUCT_WAIVER_TYPE_ADULT}>
-                {t('Design:adult')}
-              </option>
-              <option value={PRODUCT_WAIVER_TYPE_CHILD}>
-                {t('Design:child')}
-              </option>
-            </Form.Control>
-            <Form.Control.Feedback type='invalid'>
-              {HookFormService.getErrors(
-                `${fieldNamePrefix}.waiverType` as Path<T>,
-                errors,
-              )}
-            </Form.Control.Feedback>
-          </Form.Group>
-        )}
-
         <Form.Group controlId={advancedId} className='custom-checkbox'>
           <Form.Check
             custom

package/src/product-set/product/advanced-options/AdvancedOptions.tsx

@@ -1,4 +1,4 @@
-import { useContext } from 'react'
+import React, { useContext } from 'react'
 import { Col, Form } from 'react-bootstrap'
 import { Controller, Path, useFormContext } from 'react-hook-form'
 import { HookFormService } from '@licklist/plugins'

package/src/product-set/product/booking-management/ProductBookingManagementControl.tsx

@@ -86,7 +86,6 @@ export function ProductBookingManagementControl<T extends FormValues>(
               <Form.Control
                 ref={ref}
                 type='number'
-                onWheel={(event) => event.currentTarget.blur()}
                 min={0}
                 step={1}
                 value={value as string}
@@ -130,7 +129,6 @@ export function ProductBookingManagementControl<T extends FormValues>(
               <Form.Control
                 ref={ref}
                 type='number'
-                onWheel={(event) => event.currentTarget.blur()}
                 min='0'
                 step='1'
                 value={value as string}

package/src/product-set/product/deposit/ProductDepositControl.tsx

@@ -50,7 +50,6 @@ export function ProductDepositControl<T extends FormValues>(
               <Form.Control
                 ref={ref}
                 type='number'
-                onWheel={(event) => event.currentTarget.blur()}
                 min={0}
                 max={Number(totalPrice)}
                 step='0.01'

package/src/product-set/product/duration/ProductDurationControl.tsx

@@ -91,7 +91,6 @@ export const ProductDurationControl = <T,>({
                 <Form.Control
                   type='number'
                   min={0}
-                  onWheel={(event) => event.currentTarget.blur()}
                   step={1}
                   value={durationHours}
                   disabled={disabled}
@@ -128,7 +127,6 @@ export const ProductDurationControl = <T,>({
                   type='number'
                   min={0}
                   step={1}
-                  onWheel={(event) => event.currentTarget.blur()}
                   disabled={disabled}
                   value={durationMinutes}
                   isInvalid={isInvalid}

package/src/product-set/product/price/ProductPriceControl.tsx

@@ -59,7 +59,6 @@ export function ProductPriceControl<T extends FormValues>({
                 ref={ref}
                 type='number'
                 min={0}
-                onWheel={(event) => event.currentTarget.blur()}
                 max={999999.99}
                 step='0.01'
                 value={value as string}

package/src/product-set/product/quantity/ProductQuantityConstantControl.tsx

@@ -111,7 +111,6 @@ export function ProductQuantityConstantControl<T extends FormValues>(
                   type='number'
                   min={0}
                   step={1}
-                  onWheel={(event) => event.currentTarget.blur()}
                   value={value as string}
                   isInvalid={HookFormService.isInvalid<T>(
                     `${fieldNamePrefix}.totalQuantity` as Path<T>,
@@ -166,7 +165,6 @@ export function ProductQuantityConstantControl<T extends FormValues>(
                   type='number'
                   min={0}
                   step={1}
-                  onWheel={(event) => event.currentTarget.blur()}
                   value={value as string}
                   onChange={onChange}
                   onFocus={onFocus}

package/src/product-set/product/quantity/ProductQuantityControl.tsx

@@ -85,7 +85,6 @@ export function ProductQuantityControl<T extends FormValues>(
                   type='number'
                   min={0}
                   step={1}
-                  onWheel={(event) => event.currentTarget.blur()}
                   value={value as string}
                   onChange={onChange}
                   onFocus={onFocus}
@@ -144,7 +143,6 @@ export function ProductQuantityControl<T extends FormValues>(
                   type='number'
                   min={0}
                   step={1}
-                  onWheel={(event) => event.currentTarget.blur()}
                   value={value && (value as string)}
                   onFocus={onFocus}
                   onChange={onChange}

package/src/product-set/product/quantity/ProductQuantityRechargingControl.tsx

@@ -69,7 +69,6 @@ export function ProductQuantityRechargingControl<T extends FormValues>(
                 type='number'
                 min={0}
                 step={1}
-                onWheel={(event) => event.currentTarget.blur()}
                 {...register(`${fieldNamePrefix}.totalQuantity` as Path<T>, {
                   validate: (value) => {
                     if (unlimited) return true

package/src/product-set/product-category/ProductCategoryControl.tsx

@@ -221,7 +221,6 @@ export function ProductCategoryControl({
                       step={1}
                       value={value === null ? '' : value}
                       onChange={onChange}
-                      onWheel={(event) => event.currentTarget.blur()}
                       isInvalid={HookFormService.isInvalid<ProductSetFormValues>(
                         `${fieldNamePrefix}.minSubItems` as const,
                         errors,
@@ -294,7 +293,6 @@ export function ProductCategoryControl({
                       name={name}
                       value={value === null ? '' : value}
                       onChange={onChange}
-                      onWheel={(event) => event.currentTarget.blur()}
                       isInvalid={HookFormService.isInvalid<ProductSetFormValues>(
                         `${fieldNamePrefix}.maxSubItems` as const,
                         errors,
@@ -355,7 +353,6 @@ export function ProductCategoryControl({
                       min={0}
                       step={1}
                       type='number'
-                      onWheel={(event) => event.currentTarget.blur()}
                       disabled={isOverride}
                       isInvalid={HookFormService.isInvalid<ProductSetFormValues>(
                         `${fieldNamePrefix}.overallQuantity`,
@@ -546,7 +543,6 @@ export function ProductCategoryControl({
                       step={1}
                       value={value}
                       onChange={onChange}
-                      onWheel={(event) => event.currentTarget.blur()}
                       isInvalid={HookFormService.isInvalid<ProductSetFormValues>(
                         `${fieldNamePrefix}.remainderExpireAfter` as const,
                         errors,

package/src/product-set/product-zone/ProductZoneControl.tsx

@@ -1,4 +1,4 @@
-import { useContext, useEffect, useMemo } from 'react'
+import React, { useContext, useEffect, useMemo } from 'react'
 import { Col, Form, Row } from 'react-bootstrap'
 import {
   ArrayPath,

package/src/recurrence-input/RecurrenceEndInput.tsx

@@ -109,7 +109,6 @@ function RecurrenceEndInput({
                 type='number'
                 min={1}
                 max={500}
-                onWheel={(event) => event.currentTarget.blur()}
                 disabled={disabled || !count || count === 500}
                 aria-label='Occurrence count'
                 value={count ?? defaultOccurrences[frequency]}

package/src/recurring-date-picker-input/RecurrenceEndInput.tsx

@@ -91,7 +91,6 @@ function RecurrenceEndInput({
                 type='number'
                 min={1}
                 max={500}
-                onWheel={(event) => event.currentTarget.blur()}
                 disabled={disabled || !count || count === 500}
                 aria-label='Occurrence count'
                 value={count ?? defaultOccurrences[frequency]}

package/src/resource/form/components/CapacityControl.tsx

@@ -27,7 +27,6 @@ export const CapacityControl = ({ isLoading }: CapacityControlProps) => {
           required: true,
           min: 1,
         })}
-        onWheel={(event) => event.currentTarget.blur()}
         placeholder={t('Design:capacity')}
         isInvalid={Boolean(errors.capacity)}
         disabled={isLoading}

package/src/resource/form/components/SortControl.tsx

@@ -27,7 +27,6 @@ export const SortControl = ({ isLoading }: SortControlProps) => {
           required: false,
           min: 1,
         })}
-        onWheel={(event) => event.currentTarget.blur()}
         placeholder={t('Design:ordering')}
         isInvalid={Boolean(errors.sort)}
         disabled={isLoading}

package/src/sales/booking/results/components/ResultCard.tsx

@@ -20,6 +20,8 @@ export type ResultCardProps = {
   onCardClick?: (id: number) => void
 }
 
+// @TODO integrate when API will be available
+// activity and staff keys
 export const ResultCard = ({
   order,
   className,

package/src/sales/coupon/control/CouponFormControl.tsx

@@ -179,7 +179,6 @@ export const CouponFormControl = ({
               <Form.Label>{t('Design:discount')}</Form.Label>
               <Form.Control
                 type='number'
-                onWheel={(event) => event.currentTarget.blur()}
                 isInvalid={errors.discount !== undefined}
                 {...register('discount', {
                   required: t('Validation:fieldRequired', {
@@ -317,7 +316,6 @@ export const CouponFormControl = ({
               <Form.Control
                 {...register('totalCoupons')}
                 type='number'
-                onWheel={(event) => event.currentTarget.blur()}
                 isInvalid={errors.totalCoupons !== undefined}
                 disabled={isLoading}
               />
@@ -332,7 +330,6 @@ export const CouponFormControl = ({
               <Form.Control
                 type='number'
                 {...register('usesPerUser')}
-                onWheel={(event) => event.currentTarget.blur()}
                 disabled={isLoading}
               />
             </Form.Group>
@@ -345,7 +342,6 @@ export const CouponFormControl = ({
               <Form.Control
                 type='number'
                 {...register('useAgain')}
-                onWheel={(event) => event.currentTarget.blur()}
                 disabled={isLoading}
               />
               <Form.Text className='text-muted'>
@@ -359,7 +355,6 @@ export const CouponFormControl = ({
               <Form.Control
                 type='number'
                 {...register('usesPerUserDay')}
-                onWheel={(event) => event.currentTarget.blur()}
                 disabled={isLoading}
               />
               <Form.Text className='text-muted'>
@@ -375,7 +370,6 @@ export const CouponFormControl = ({
               <Form.Control
                 type='number'
                 {...register('minAmount')}
-                onWheel={(event) => event.currentTarget.blur()}
                 disabled={isLoading}
               />
               <Form.Text className='text-muted'>
@@ -389,7 +383,6 @@ export const CouponFormControl = ({
               <Form.Control
                 type='number'
                 {...register('maxAmount')}
-                onWheel={(event) => event.currentTarget.blur()}
                 disabled={isLoading}
               />
               <Form.Text className='text-muted'>

package/src/setting/dashboard/DashboardSettingForm.tsx

@@ -178,7 +178,6 @@ export const DashboardSettingForm = ({
               <Form.Label>{t('metaPixelId')}</Form.Label>
               <Form.Control
                 type='number'
-                onWheel={(event) => event.currentTarget.blur()}
                 {...register('metaPixelId', {
                   minLength: {
                     value: 15,

package/src/sortable-tree/SortableTreeItem.tsx

@@ -1,4 +1,9 @@
-import { ReactNode, useCallback, useEffect, useState } from 'react'
+import {
+  ReactNode,
+  useCallback,
+  useEffect,
+  useState,
+} from 'react'
 import { DndContext, useDraggable } from '@dnd-kit/core'
 import {
   SortableContext,

package/src/static/CurrencyNumberInput.tsx

@@ -45,7 +45,6 @@ export const CurrencyNumberInput = forwardRef<
           disabled={disabled}
           value={value}
           onChange={onChange}
-          onWheel={(event) => event.currentTarget.blur()}
           ref={ref}
           {...props}
         />

package/src/static/form-number-input/FormNumberInput.tsx

@@ -75,7 +75,6 @@ export const FormNumberInput = ({
               type='number'
               step={step}
               disabled={disabled}
-              onWheel={(event) => event.currentTarget.blur()}
               isInvalid={HookFormService.isInvalid(fieldName, errors)}
               {...field}
               onChange={(event) => {

package/src/static/number-input/NumberInput.tsx

@@ -49,7 +49,6 @@ export function NumberInput({
     <div className={inputWrapperClasses}>
       <FormControl
         type='number'
-        onWheel={(event) => event.currentTarget.blur()}
         onChange={(e) => onChange(Number(e.target.value))}
         value={value}
         min={min}

package/src/styles/form/CustomCheckbox.scss

@@ -28,34 +28,3 @@
     z-index: 2;
   }
 }
-
-.checkbox-second-column {
-  margin-top: 1rem;
-  display: flex;
-  z-index: 2;
-  align-items: center;
-
-  .custom-checkbox .custom-control-label::before {
-    width: 1.5rem;
-    height: 1.5rem;
-    border-radius: 0.5rem;
-    border: 2px solid #0e8ce2;
-    margin-top: -0.3rem;
-  }
-  .custom-checkbox .custom-control-label::after {
-    width: 1.5rem;
-    height: 1.5rem;
-    top: 0;
-  }
-
-  .custom-control-label {
-    padding-left: 0.5rem;
-    font-weight: 400;
-    font-size: 1rem;
-    min-height: 3rem;
-  }
-
-  .checkbox-input {
-    z-index: 2;
-  }
-}

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

@@ -74,7 +74,7 @@
     .calendar-dates-wrapper {
       .calendar-dates {
         display: grid;
-        grid-template-columns: repeat(7, auto);
+        grid-template-columns: repeat(7, 1fr);
         grid-gap: 0.5rem 1rem;
         overflow-x: auto;
       }

package/src/styles/iframe-external-modal/IframeExternalModal.scss

@@ -15,7 +15,7 @@ body[bkdt-scrollable='false'] .bkdt-mask {
   left: 0;
   width: 100%;
   height: 100%;
-  z-index: 2147483646;
+  z-index: 1000000;
   background-color: rgba(0, 0, 0, 0.5);
   display: none;
 }
@@ -24,7 +24,7 @@ body[bkdt-scrollable='false'] .bkdt-mask {
   position: fixed;
   top: 0;
   left: 0;
-  z-index: 2147483647;
+  z-index: 1000001;
   display: none;
   width: 100%;
   height: 100%;

package/src/styles/product-set/ProductSetForm.scss

@@ -1,4 +1,5 @@
 .product-set-form {
+
   input,
   textarea,
   select,
@@ -210,8 +211,8 @@
 
 .sortable-tree-item-toggle {
   .product-zone-badge {
-    background-color: #efe9f5;
-    color: #84269b;
+    background-color: #EFE9F5;
+    color: #84269B;
     font-size: 0.875rem;
     font-weight: 600;
   }

package/src/styles/ryft-payment-form/RyftPaymentForm.scss

@@ -102,6 +102,7 @@
 }
 
 .ryft-payment-form {
+
   .form-disable-box {
     display: none;
     position: absolute;
@@ -183,6 +184,7 @@
 }
 
 @include media-breakpoint-up(md) {
+
   .ryft-payment-form,
   .form-disable-box {
     height: 50%;
@@ -211,4 +213,4 @@
   .divider {
     display: none !important;
   }
-}
+}

package/src/styles/sales/BookingResults.scss

@@ -5,7 +5,7 @@
     flex-wrap: wrap;
 
     .result-card {
-      height: 14rem;
+      height: 14.25rem;
       border: 1px solid $gray-400;
       max-width: calc(50% - 0.75rem);
       flex: 0 0 calc(50% - 0.75rem);

package/src/zone/form/components/GameDurationControl.tsx

@@ -29,7 +29,6 @@ export const GameDurationControl = ({
           required: false,
           min: 1,
         })}
-        onWheel={(event) => event.currentTarget.blur()}
         placeholder={t('Design:duration')}
         isInvalid={Boolean(errors.defaultDuration)}
         disabled={isLoading}

package/src/zone/form/components/SortControl.tsx

@@ -27,7 +27,6 @@ export const SortControl = ({ isLoading }: SortControlProps) => {
           required: false,
           min: 1,
         })}
-        onWheel={(event) => event.currentTarget.blur()}
         placeholder={t('Design:ordering')}
         isInvalid={Boolean(errors.sort)}
         disabled={isLoading}