ngxbootstarp daterangepicker calenders not come on side by side come as top of another

Question

I upgraded ngx-datepicker to version so now my daterangepicker style changed that calenders are placing one on the top of another.No other change i made.Please suggest any solution

enter image description here

<div class="filter-value" *ngIf="dateRange">
        <div class="form-group date-picker">
            <label for="designation">Date</label>
            <input type="text" id="date-of-joing" class="form-control" placeholder="Select Date Range" bsDaterangepicker [minDate]="minDate" [maxDate]="currentFYendDate" [readonly]="true" [bsConfig]="{ rangeInputFormat: 'DD-MM-YYYY',selectFromOtherMonth: true}" value="{{dateValue | date:'dd-MM-yyyy'}}" [(bsValue)]="dateRangeValue" (bsValueChange)="dateRangeChange($event)">
        </div>
    </div>

before upgrade calenders placed as side by side

its view also i'm placing here