guestbell-forms 3.0.46 → 3.0.48

package/src/lib/components/inputHeader/InputHeader.tsx

@@ -165,6 +165,11 @@ export class InputHeaderRaw
       this.props.collapsed !== undefined
         ? !this.props.collapsed
         : !this.state.collapsed;
+    const showButtons = Boolean(
+      this.props.mainButton ||
+        this.props.extraButtons?.length ||
+        this.props.collapsible
+    );
     return (
       <div
         className={
@@ -214,43 +219,45 @@ export class InputHeaderRaw
               {this.props.subTitle}
             </div>
           )}
-          <div
-            className="input__header__top__button-container"
-            onClick={this.mainButtonClick}
-          >
-            {this.props.mainButton && this.props.mainButton}
-            {this.props.extraButtons ? (
-              <Dropdown
-                header={
-                  <Button
-                    blank={true}
-                    circular={true}
-                    {...this.props.extraButtonsButtonProps}
-                  >
-                    <MoreIcon />
-                  </Button>
-                }
-                showArrow={false}
-                headerClassName={'line-height--0'}
-                className={''}
-              >
-                {this.renderExtraButtons()}
-              </Dropdown>
-            ) : null}
-            {this.props.collapsible && (
-              <Button
-                circular={true}
-                blank={true}
-                className={`input__header__collapse-button line-height--0 ${
-                  this.state.collapsed ? 'collapsed' : ''
-                }`}
-                {...this.props.collapseButtonsButtonProps}
-                onClick={this.toggleClick}
-              >
-                <PlusIcon />
-              </Button>
-            )}
-          </div>
+          {showButtons && (
+            <div
+              className="input__header__top__button-container"
+              onClick={this.mainButtonClick}
+            >
+              {this.props.mainButton && this.props.mainButton}
+              {this.props.extraButtons ? (
+                <Dropdown
+                  header={
+                    <Button
+                      blank={true}
+                      circular={true}
+                      {...this.props.extraButtonsButtonProps}
+                    >
+                      <MoreIcon />
+                    </Button>
+                  }
+                  showArrow={false}
+                  headerClassName={'line-height--0'}
+                  className={''}
+                >
+                  {this.renderExtraButtons()}
+                </Dropdown>
+              ) : null}
+              {this.props.collapsible && (
+                <Button
+                  circular={true}
+                  blank={true}
+                  className={`input__header__collapse-button line-height--0 ${
+                    this.state.collapsed ? 'collapsed' : ''
+                  }`}
+                  {...this.props.collapseButtonsButtonProps}
+                  onClick={this.toggleClick}
+                >
+                  <PlusIcon />
+                </Button>
+              )}
+            </div>
+          )}
           {this.props.showExpandAll &&
             Object.keys(this.state.inputHeaderContext.components).length > 0 &&
             this.renderCollapseExpandAll()}

package/src/lib/scss/components/bookingCalendar/bookingCalendar.scss

@@ -122,7 +122,6 @@ $border-color-dark: black;
   height: 100%;
   pointer-events: none;
   grid-column: 2;
-  grid-row-start: 2;
 }
 
 .bookingCalendar__grid__item {
@@ -255,7 +254,6 @@ $border-color-dark: black;
   right: 0;
   height: 100%;
   grid-column: 2;
-  grid-row-start: 2;
 }
 
 .bookingCalendar__selection {
@@ -282,14 +280,12 @@ $border-color-dark: black;
   height: 100%;
   pointer-events: none;
   grid-column: 2;
-  grid-row-start: 2;
   display: flex;
 }
 
 .bookingCalendar__nowSection__now {
   width: 1px;
   background-color: rgba(0, 0, 0, 0.35);
-  // create a dashed line
   background-image: repeating-linear-gradient(
     45deg,
     white,

package/src/stories/OverlappingSchedule.tsx

@@ -18,7 +18,7 @@ const generateBookingItemsBetweenDates = (
   const width = till.valueOf() - from.valueOf();
   const startMs = from.valueOf();
   const nonOverlappingCount = 10;
-  const laneCount = 5;
+  const laneCount = 6;
   let i = 0;
   return new Array(laneCount)
     .fill(0)
@@ -109,7 +109,7 @@ const generateBookingItemsBetweenDates = (
         : []),
     ])
     .reduce((acc, val) => acc.concat(val), [])
-    .filter((a) => a /*&&a?.laneKey === 1*/);
+    .filter((a) => a /* && a?.laneKey === 0*/);
 };
 
 export const Schedule = () => {
@@ -155,8 +155,8 @@ export const Schedule = () => {
         onRangeChange={setRange}
         onSelection={onSelection}
         selectionContent={'Hold CTRL to zoom'}
-        // lanesCount={3}
-        lanesSource={new Array(5).fill(0).map((_, index) => ({
+        // showHeader={false}
+        lanesSource={new Array(6).fill(0).map((_, index) => ({
           laneKey: index,
           data: { data: 'test' },
           rowClassName: 'test',