Dear @cdtuapp

The problem arises from overflow: hidden on the .sb-item-body - that is hiding the Datepicker. You can override it like below:

<mdb-accordion [multiple]="false">
  <mdb-accordion-item [collapsed]="false">
    <mdb-accordion-item-head (click)="addClass()"
      >Collapsible Group Item #1</mdb-accordion-item-head
    >
    <mdb-accordion-item-body>
      <mdb-date-picker
        [inline]="true"
        name="mydate"
        [options]="myDatePickerOptions"
        [placeholder]="'Selected date'"
        [(ngModel)]="model"
        required
      ></mdb-date-picker>
    </mdb-accordion-item-body>
  </mdb-accordion-item>

  <mdb-accordion-item>
    <mdb-accordion-item-head (click)="addClass()"
      >Collapsible Group Item #2</mdb-accordion-item-head
    >
    <mdb-accordion-item-body>
      <div class="dropdown" mdbDropdown>
        <button
          mdbDropdownToggle
          mdbBtn
          color="primary"
          class="dropdown-toggle waves-light"
          type="button"
          mdbWavesEffect
        >
          Dropdown primary
        </button>

        <div class="dropdown-menu dropdown-primary">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <a class="dropdown-item" href="#">Something else here</a>
          <a class="dropdown-item" href="#">Something else here</a>
        </div>
      </div>
    </mdb-accordion-item-body>
  </mdb-accordion-item>

  <mdb-accordion-item>
    <mdb-accordion-item-head (click)="addClass()"
      >Collapsible Group Item #3</mdb-accordion-item-head
    >
    <mdb-accordion-item-body>
      Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad
      squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa
    </mdb-accordion-item-body>
  </mdb-accordion-item>
</mdb-accordion>

TS:

 public myDatePickerOptions: IMyOptions = {
    // Your options
  };
  constructor(private renderer: Renderer2, private el: ElementRef) {}

  addClass() {
    const elements = this.el.nativeElement.querySelectorAll('.sb-item-body');

    for (const e of elements) {
      this.renderer.removeClass(e, 'overflow-vis');
      setTimeout(() => {
        this.renderer.addClass(e, 'overflow-vis');
      }, 550);
    }
  }

styles.scss:

.overflow-vis {
  overflow: visible !important;
}

Hope it helps!

Best Regards, Bartosz.

We are aware of this problem and are already working to solve it. Unfortunately I can't provide an ETA for this fix yet.