Dropzone styles not being included properly

[zefoy]

Dropzone styles not being included properly

[sconix]

Haven't seen such behavior so can't say what could be wrong. The styles are inlined within the component so can't think of anything that would cause them not to work. If you are using a directive then you need to load the style file separately, but not with component.

[topa]

It seems that setting ViewEncapsulation.None or if you now your target browsers ViewEncapsulation.Native in the component which uses DropzoneComponent fixes that problem.
Probably angular's default is ViewEncapsulation.Emulated due to browser compatibility because ViewEncapsulation seems to be solved through shadow dom.

[topa]

We've wrapped DropzoneComponent into a custom component, copied the styles from this package and imported dropzone styles directly from node_modules. At the end this approach gives us full access to the styles.

import { DropzoneComponent } from 'ngx-dropzone-wrapper';
import {
  Component,
  ViewEncapsulation,
  OnDestroy
} from '@angular/core';

@Component({
  selector: 'my-dropzone',
  templateUrl: './my-dropzone.component.html',
  styleUrls: [
    '../../../../../../node_modules/dropzone/dist/min/dropzone.min.css',
    './ngx-dropzone-wrapper.scss',
    './my-dropzone.scss',
  ],
  encapsulation: ViewEncapsulation.None
})
export class MyDropzoneComponent extends DropzoneComponent implements OnDestroy {

  ngOnDestroy() {
    if (this.dropzone) {
      this.dropzone.destroy();
    }
  }
}

A little bit hacky, but it works for now.

btw.: Overriding ngOnDestroy solved also #23 for us.

[sconix]

Yes thats how the style encapsulation works in Angular. You could always make your own styles fully and not use the Dropzone styles file, then you can do it without the ViewEncapsulation.None, but if you want to use the dropzone styles in your own component you need to have the ViewEncapsulation.None. If you import the styles in the global styles then I think it should also work without the ViewEncapsulation change.

Btw. the latest version should have the check in destroy so there should not be need for overriding.