@licklist/design 0.68.6-dev.2 → 0.68.6

package/src/venue-map-sets/form/components/VenueMapImageControl.tsx

@@ -94,8 +94,8 @@ export const VenueMapImageControl = ({ index }: VenueMapImageControlProps) => {
   const mapUrl = venueMap?.image?.url || venueMap?.localImageBlobURL
 
   return (
-    <Col sm='6' md='6'>
-      <Form.Group controlId='name'>
+    <Col sm="6" md="6">
+      <Form.Group controlId="name">
         <Form.Control
           isInvalid={HookFormService.isInvalid(
             `venueMaps.${index}.image` as const,
@@ -106,7 +106,7 @@ export const VenueMapImageControl = ({ index }: VenueMapImageControlProps) => {
         <FileUpload
           onFilesChange={onFilesChange}
           allowedExtensions={['jpeg', 'jpg', 'png']}
-          subTitle='.jpeg    .jpg    .png'
+          subTitle=".jpeg    .jpg    .png"
           enablePreview
           onFileRemove={onImageRemove}
           defaultFiles={images}
@@ -114,7 +114,7 @@ export const VenueMapImageControl = ({ index }: VenueMapImageControlProps) => {
           withIcon
           title={t('Design:addImage')}
         />
-        <Form.Control.Feedback type='invalid'>
+        <Form.Control.Feedback type="invalid">
           {HookFormService.getErrors(
             `venueMaps.${index}.image` as const,
             errors,
@@ -137,7 +137,7 @@ export const VenueMapImageControl = ({ index }: VenueMapImageControlProps) => {
           }
         >
           {(confirm) => (
-            <Button onClick={confirm} className='pt-3'>
+            <Button onClick={confirm} className="pt-3">
               {t('addPoints')}
             </Button>
           )}

package/src/venue-map-sets/form/components/VenueMapModal.tsx

@@ -45,25 +45,25 @@ export const VenueMapModal = ({
 
   return (
     <Modal
-      size='lg'
+      size="lg"
       show={showModal}
       className={clsx(
         'm-0 edit-product-set-element-modal edit-right-form-modal h-100',
       )}
-      dialogClassName='edit-venue-map-set-dialog edit-venue-map-dialog'
+      dialogClassName="edit-venue-map-set-dialog edit-venue-map-dialog"
       onHide={onModalHide}
     >
-      <div className='edit-step-modal-header'>
+      <div className="edit-step-modal-header">
         <button
-          className='p-0 cancel-add-step-btn border-0'
-          type='button'
+          className="p-0 cancel-add-step-btn border-0"
+          type="button"
           onClick={onModalHide}
         >
           <span>{t('Design:cancel')}</span>
         </button>
       </div>
-      <Modal.Body as='form' noValidate>
-        <div className='top-label-container'>
+      <Modal.Body as="form" noValidate>
+        <div className="top-label-container">
           <span>{t('Design:addANewVenueMap')}</span>
         </div>
         <Row>
@@ -81,7 +81,7 @@ export const VenueMapModal = ({
                     placeholder={t('Design:id')}
                     hidden
                   />
-                  <Form.Group controlId='name'>
+                  <Form.Group controlId="name">
                     <Form.Label>{t('Design:name')}*</Form.Label>
                     <Form.Control
                       {...register(`${key}.name` as const, {
@@ -94,7 +94,7 @@ export const VenueMapModal = ({
                         errors,
                       )}
                     />
-                    <Form.Control.Feedback type='invalid'>
+                    <Form.Control.Feedback type="invalid">
                       {HookFormService.hasError(
                         errors?.venueMaps?.[index]?.name,
                         'required',
@@ -128,10 +128,10 @@ export const VenueMapModal = ({
             )
           })}
         </Row>
-        <div className='d-flex venue-map-element-control-btns justify-content-between'>
+        <div className="d-flex venue-map-element-control-btns justify-content-between">
           <Button
-            className='venue-map-save-btn mt-4'
-            type='button'
+            className="venue-map-save-btn mt-4"
+            type="button"
             onClick={async () => {
               const isValid = await trigger(venueMapsKeys)
 
@@ -144,17 +144,17 @@ export const VenueMapModal = ({
           >
             {t('saveAndAdd')}
           </Button>
-          <div className='d-flex justify-content-end mt-4 delete-btn'>
+          <div className="d-flex justify-content-end mt-4 delete-btn">
             <ConfirmModal>
               {(confirm) => (
                 <Button
                   onClick={() => confirm(onModalDelete)}
-                  variant='outline-danger'
-                  className='d-flex align-items-center'
+                  variant="outline-danger"
+                  className="d-flex align-items-center"
                 >
                   <FaTrashAlt size={16} />
                   &nbsp;
-                  <span className='d-none d-sm-inline ml-2'>{t('delete')}</span>
+                  <span className="d-none d-sm-inline ml-2">{t('delete')}</span>
                 </Button>
               )}
             </ConfirmModal>

package/src/venue-map-sets/form/components/VenueMapsControl.tsx

@@ -162,7 +162,7 @@ export const VenueMapsControl = ({ isLoading }) => {
         }}
         disabled={isLoading}
       />
-      <div className='manual-form-error'>
+      <div className="manual-form-error">
         {errors.venueMaps && errors.venueMaps.message}
       </div>
     </>

package/src/virtualized/components/VirtualizedGrid.tsx

@@ -14,7 +14,7 @@ export const VirtualizedGrid = (props: VirtualizedGridProps) => {
   }, [gridRef.current, setGridRef])
 
   return (
-    <div className='virtualized-grid-container'>
+    <div className="virtualized-grid-container">
       <Grid ref={gridRef} {...props} />
     </div>
   )

package/src/zone/card/ZoneCard.tsx

@@ -30,21 +30,21 @@ export function ZoneCard({
 
   return (
     <div
-      role='button'
+      role="button"
       tabIndex={0}
-      className='border-0 zone-card-wrapper w-100 pb-0'
+      className="border-0 zone-card-wrapper w-100 pb-0"
       onClick={() => RouteService.redirectTo(href)}
       onKeyUp={() => RouteService.redirectTo(href)}
     >
       <div className={ZoneCardClasses}>
-        <div className='zone-card-link'>{name}</div>
-        <div className='d-flex'>
-          <div className='zone-card-menu-eye-container'>
-            <FaEye color='#0E8CE2' size={20} />
+        <div className="zone-card-link">{name}</div>
+        <div className="d-flex">
+          <div className="zone-card-menu-eye-container">
+            <FaEye color="#0E8CE2" size={20} />
           </div>
           <OverlayTrigger
-            trigger='click'
-            placement='bottom'
+            trigger="click"
+            placement="bottom"
             rootClose
             overlay={
               <Popover
@@ -56,12 +56,12 @@ export function ZoneCard({
               >
                 <Popover.Content
                   as={ListGroup}
-                  className='zone-card-menu'
-                  variant='flush'
+                  className="zone-card-menu"
+                  variant="flush"
                 >
                   {hasPermission && (
                     <>
-                      <ListGroup.Item action className='text-danger' as='div'>
+                      <ListGroup.Item action className="text-danger" as="div">
                         {Boolean(onRemove) && (
                           <ConfirmModal>
                             {(confirm) => (
@@ -72,7 +72,7 @@ export function ZoneCard({
                                 }}
                                 name={t('remove')}
                                 icon={<FaTrashAlt size={12} />}
-                                className='zone-card-menu-item-text d-flex w-100 align-items-center'
+                                className="zone-card-menu-item-text d-flex w-100 align-items-center"
                                 rightIcon
                               />
                             )}
@@ -86,8 +86,8 @@ export function ZoneCard({
             }
           >
             <button
-              type='button'
-              className='zone-card-menu-button'
+              type="button"
+              className="zone-card-menu-button"
               onClick={(e) => {
                 e.stopPropagation()
                 setIsOverlayVisible(true)

package/src/zone/form/ZoneForm.tsx

@@ -65,13 +65,13 @@ export const ZoneForm = ({
         <Row>
           <Col md={6} sm={12} />
           <Col
-            className='product-set-save-btn-wrapper p-0 pl-4 d-flex mw-100'
+            className="product-set-save-btn-wrapper p-0 pl-4 d-flex mw-100"
             md={6}
             sm={12}
           >
             <Button
-              className='product-set-save-btn mt-5 ml-5 d-no dne d-md-block'
-              type='submit'
+              className="product-set-save-btn mt-5 ml-5 d-no dne d-md-block"
+              type="submit"
               disabled={isLoading || !formValues.name}
             >
               {t('saveAndClose')}

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

@@ -92,11 +92,11 @@ export const AvailableTimesControl = forwardRef<
     return (
       <Form.Group controlId={nameId}>
         <Form.Label>{t('Design:startTimes')}</Form.Label>
-        <div className='zone-available-times'>
+        <div className="zone-available-times">
           {checkboxes.map((option) => (
             <Form.Check key={option} inline custom id={option}>
               <Form.Check.Input
-                type='checkbox'
+                type="checkbox"
                 value={option}
                 checked={availableTimes.includes(option)}
                 onChange={() => onChange(option)}
@@ -107,8 +107,8 @@ export const AvailableTimesControl = forwardRef<
           ))}
         </div>
 
-        <Form.Control type='hidden' {...register('availableTimes')} />
-        <div className='manual-form-error'>
+        <Form.Control type="hidden" {...register('availableTimes')} />
+        <div className="manual-form-error">
           {errors.availableTimes?.message || errorMessage}
         </div>
       </Form.Group>

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

@@ -37,9 +37,9 @@ export const DescriptionControl = ({ isLoading }: DescriptionControlProps) => {
         )}
         rules={{ required: true }}
         control={control}
-        name='description'
+        name="description"
       />
-      <div className='manual-form-error'>
+      <div className="manual-form-error">
         {HookFormService.hasError(errors.description, 'required') &&
           t('Validation:fieldRequired', {
             attribute: t('Design:description'),

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

@@ -24,17 +24,16 @@ export const GameDurationControl = ({
     <Form.Group controlId={nameId}>
       <Form.Label>{t('Design:defaultGameDuration')}</Form.Label>
       <Form.Control
-        type='number'
+        type="number"
         {...register('defaultDuration', {
           required: false,
           min: 1,
         })}
-        onWheel={(event) => event.currentTarget.blur()}
         placeholder={t('Design:duration')}
         isInvalid={Boolean(errors.defaultDuration)}
         disabled={isLoading}
       />
-      <Form.Control.Feedback type='invalid'>
+      <Form.Control.Feedback type="invalid">
         {HookFormService.hasError(errors.defaultDuration, 'min') &&
           t('Validation:fieldMinNumber', {
             attribute: t('Design:defaultGameDuration').toLowerCase(),

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

@@ -30,7 +30,7 @@ export const NameControl = ({ isLoading }: NameControlProps) => {
         isInvalid={Boolean(errors.name)}
         disabled={isLoading}
       />
-      <Form.Control.Feedback type='invalid'>
+      <Form.Control.Feedback type="invalid">
         {HookFormService.hasError(errors.name, 'required') &&
           t('Validation:fieldRequired', {
             attribute: t('Design:name'),

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

@@ -22,17 +22,16 @@ export const SortControl = ({ isLoading }: SortControlProps) => {
     <Form.Group controlId={nameId}>
       <Form.Label>{t('Design:ordering')}</Form.Label>
       <Form.Control
-        type='number'
+        type="number"
         {...register('sort', {
           required: false,
           min: 1,
         })}
-        onWheel={(event) => event.currentTarget.blur()}
         placeholder={t('Design:ordering')}
         isInvalid={Boolean(errors.sort)}
         disabled={isLoading}
       />
-      <Form.Control.Feedback type='invalid'>
+      <Form.Control.Feedback type="invalid">
         {HookFormService.hasError(errors.sort, 'required') &&
           t('Validation:fieldRequired', {
             attribute: t('Design:ordering'),

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

@@ -20,7 +20,7 @@ export const ZoneControl = ({
   timeZone,
 }: ZoneControlProps) => (
   <Row>
-    <Col md={6} sm={12} className='pr-5'>
+    <Col md={6} sm={12} className="pr-5">
       <NameControl isLoading={isLoading} />
       <ZoneRecurrencesControl workHours={workHours} timeZone={timeZone} />
       <hr />

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

@@ -78,7 +78,7 @@ export const ZoneImageControl = ({
   }, [images])
 
   return (
-    <Form.Group controlId='name'>
+    <Form.Group controlId="name">
       <Form.Control
         isInvalid={HookFormService.isInvalid('image', errors)}
         hidden
@@ -86,7 +86,7 @@ export const ZoneImageControl = ({
       <FileUpload
         onFilesChange={onFilesChange}
         allowedExtensions={['jpeg', 'jpg', 'png']}
-        subTitle='.jpeg    .jpg    .png'
+        subTitle=".jpeg    .jpg    .png"
         enablePreview
         onFileRemove={onImageRemove}
         defaultFiles={images}
@@ -95,7 +95,7 @@ export const ZoneImageControl = ({
         title={t('Design:addImage')}
         disabled={isLoading}
       />
-      <Form.Control.Feedback type='invalid'>
+      <Form.Control.Feedback type="invalid">
         {HookFormService.getErrors('image', errors)}
       </Form.Control.Feedback>
     </Form.Group>

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

@@ -28,7 +28,7 @@ export const ZoneRecurrenceControl = ({
 
   return (
     <div
-      className='sortable-tree-root'
+      className="sortable-tree-root"
       style={{
         transform: CSS.Translate.toString(transform),
         transition,
@@ -36,16 +36,16 @@ export const ZoneRecurrenceControl = ({
       {...attributes}
       {...listeners}
       ref={setNodeRef}
-      role='button'
+      role="button"
       tabIndex={0}
     >
       <div
         key={zoneRecurrence.rrule}
-        className='zone-recurrence d-flex flex-column mr-0 mb-3 p-3 px-4 flex-grow-1'
+        className="zone-recurrence d-flex flex-column mr-0 mb-3 p-3 px-4 flex-grow-1"
       >
-        <span className='d-flex flex-row align-items-center'>
-          <FaCalendar size={16} className='zone-recurrence-icon-calendar' />
-          <span className='zone-recurrence-title d-flex flex-grow-1'>
+        <span className="d-flex flex-row align-items-center">
+          <FaCalendar size={16} className="zone-recurrence-icon-calendar" />
+          <span className="zone-recurrence-title d-flex flex-grow-1">
             {t('from')}{' '}
             {formatDate(zoneRecurrence.startDate, {
               dateStyle: 'medium',
@@ -57,16 +57,16 @@ export const ZoneRecurrenceControl = ({
           </span>
 
           <div
-            className='d-inline-flex'
-            role='button'
+            className="d-inline-flex"
+            role="button"
             tabIndex={0}
             onClick={() => onEdit(zoneRecurrence)}
             onKeyDown={() => onEdit(zoneRecurrence)}
           >
-            <FaEllipsisH size={16} className='zone-recurrence-icon-more' />
+            <FaEllipsisH size={16} className="zone-recurrence-icon-more" />
           </div>
         </span>
-        <span className='zone-recurrence-description'>
+        <span className="zone-recurrence-description">
           {getHumanReadableDate(zoneRecurrence)}
         </span>
       </div>

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

@@ -157,8 +157,8 @@ export const ZoneRecurrencesControl = ({
       <OverlayTrigger
         show={isDatePopoverVisible}
         overlay={
-          <Popover id={popoverId} className='rounded'>
-            <Popover.Content className='shadow-lg rounded' ref={popoverRef}>
+          <Popover id={popoverId} className="rounded">
+            <Popover.Content className="shadow-lg rounded" ref={popoverRef}>
               <RecurringDatePickerInput
                 defaultValues={editState.values}
                 onChange={handleRecurringDateChange}
@@ -170,11 +170,11 @@ export const ZoneRecurrencesControl = ({
             </Popover.Content>
           </Popover>
         }
-        trigger='click'
-        placement='bottom'
+        trigger="click"
+        placement="bottom"
         popperConfig={{ modifiers: [sameWidthPopperModifier] }}
       >
-        <div className='zone-recurrences'>
+        <div className="zone-recurrences">
           <DndContext onDragEnd={handleOnDragEnd}>
             <SortableContext
               items={
@@ -194,18 +194,18 @@ export const ZoneRecurrencesControl = ({
           </DndContext>
 
           <div
-            className='zone-recurrence-icon-wrapper'
-            role='button'
+            className="zone-recurrence-icon-wrapper"
+            role="button"
             tabIndex={0}
             onClick={handleOnAdd}
             onKeyDown={handleOnAdd}
           >
-            <FaPlusCircle size={16} className='zone-recurrence-icon-add mr-2' />
+            <FaPlusCircle size={16} className="zone-recurrence-icon-add mr-2" />
             {t('addDates')}
           </div>
 
           <Form.Control
-            type='hidden'
+            type="hidden"
             {...register('zoneRecurrences', {
               required: {
                 value: true,
@@ -217,7 +217,7 @@ export const ZoneRecurrencesControl = ({
             })}
           />
 
-          <div className='manual-form-error'>
+          <div className="manual-form-error">
             {errors.zoneRecurrences?.message}
           </div>
         </div>

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

@@ -25,7 +25,7 @@ export const ZoneTypeControl = ({ isLoading }: ZoneTypeControlProps) => {
     <Form.Group controlId={nameId}>
       <Form.Label>{t('Design:zoneType')}</Form.Label>
       <Form.Control
-        as='select'
+        as="select"
         {...register('type', {
           required: true,
         })}
@@ -39,7 +39,7 @@ export const ZoneTypeControl = ({ isLoading }: ZoneTypeControlProps) => {
           </option>
         ))}
       </Form.Control>
-      <Form.Control.Feedback type='invalid'>
+      <Form.Control.Feedback type="invalid">
         {HookFormService.hasError(errors.type, 'required') &&
           t('Validation:fieldRequired', {
             attribute: t('Design:name'),