How to use the ngeo/misc/btnComponent.js.name function in ngeo

import {CollectionEvent} from 'ol/Collection.js';
import MapBrowserEvent from 'ol/MapBrowserEvent.js';
import Feature from 'ol/Feature.js';

import 'bootstrap/js/src/dropdown.js';


/**
 * @type {angular.IModule}
 * @hidden
 */
const module = angular.module('GmfDrawFeatureComponent', [
  gmfDrawingDrawFeatureOptionsComponent.name,
  gmfDrawingFeatureStyleComponent.name,
  ngeoEditingExportfeaturesComponent.name,
  ngeoMiscBtnComponent.name,
  ngeoDrawComponent.name,
  ngeoMiscFeatureHelper.name,
  ngeoMiscToolActivateMgr.name,
]);


module.run(
  /**
   * @ngInject
   * @param {angular.ITemplateCacheService} $templateCache
   */
  ($templateCache) => {
    // @ts-ignore: webpack
    $templateCache.put('gmf/drawing/drawFeatureComponent', require('./drawFeatureComponent.html'));
  });

import ngeoQueryModule from 'ngeo/query/module.js';
import olMap from 'ol/Map.js';
import olView from 'ol/View.js';
import olLayerImage from 'ol/layer/Image.js';
import olLayerTile from 'ol/layer/Tile.js';
import olSourceImageWMS from 'ol/source/ImageWMS.js';
import olSourceOSM from 'ol/source/OSM.js';


/** @type {!angular.IModule} */
const module = angular.module('app', [
  'gettext',
  ngeoDatasourceDataSources.name,
  ngeoMapModule.name,
  ngeoMiscBtnComponent.name,
  ngeoQueryModule.name
]);


module.run(/* @ngInject */ ($templateCache) => {
  // @ts-ignore: webpack
  $templateCache.put('partials/queryresult', require('./partials/queryresult.html'));
});


module.value('ngeoQueryOptions', {
  'limit': 20
});


/**

// set style
    this.featureHelper_.setStyle(feature);

    // push in collection
    features.push(feature);
  }
}


/**
 * @type {angular.IModule}
 * @hidden
 */
const module = angular.module('ngeoDrawfeatureController', [
  ngeoDrawFeatures.name,
  ngeoMiscBtnComponent.name,
  ngeoMiscFeatureHelper.name,
]);
module.controller('ngeoDrawfeatureController', DrawController);


export default module;

import ngeoQueryModule from 'ngeo/query/module.js';

import olMap from 'ol/Map.js';
import olView from 'ol/View.js';
import olLayerImage from 'ol/layer/Image.js';
import olLayerTile from 'ol/layer/Tile.js';
import olSourceImageWMS from 'ol/source/ImageWMS.js';
import olSourceOSM from 'ol/source/OSM.js';


/** @type {!angular.IModule} **/
const module = angular.module('app', [
  'gettext',
  ngeoDatasourceDataSources.name,
  ngeoMapModule.name,
  ngeoMiscBtnComponent.name,
  ngeoMiscToolActivateMgr.name,
  ngeoQueryMapQueryComponent.name,
  ngeoQueryModule.name,
]);


module.run(/* @ngInject */ ($templateCache) => {
  // @ts-ignore: webpack
  $templateCache.put('partials/queryresult', require('./partials/queryresult.html'));
});


module.value('ngeoQueryOptions', {
  'limit': 20
});

STOP_EDITING_PENDING: 'stop_editing_pending'
};

/**
 * @type {angular.IModule}
 * @hidden
 */
const module = angular.module('GmfEditingFeatureComponent', [
  gmfEditingEditFeature.name,
  gmfEditingSnapping.name,
  gmfEditingXSDAttributes.name,
  ngeoEditingAttributesComponent.name,
  ngeoEditingCreatefeatureComponent.name,
  ngeoMapLayerHelper.name,
  ngeoMessageModalComponent.name,
  ngeoMiscBtnComponent.name,
  ngeoMiscEventHelper.name,
  ngeoMiscFeatureHelper.name,
  ngeoMiscToolActivateMgr.name,
]);


module.run(
  /**
   * @ngInject
   * @param {angular.ITemplateCacheService} $templateCache
   */
  ($templateCache) => {
    // @ts-ignore: webpack
    $templateCache.put('gmf/editing/editFeatureComponent', require('./editFeatureComponent.html'));
  });

import ngeoQueryModule from 'ngeo/query/module.js';

import olMap from 'ol/Map.js';
import olView from 'ol/View.js';
import olLayerImage from 'ol/layer/Image.js';
import olLayerTile from 'ol/layer/Tile.js';
import olSourceImageWMS from 'ol/source/ImageWMS.js';
import olSourceOSM from 'ol/source/OSM.js';


/** @type {angular.IModule} **/
const module = angular.module('app', [
  'gettext',
  ngeoDatasourceDataSources.name,
  ngeoMapModule.name,
  ngeoMiscBtnComponent.name,
  ngeoMiscToolActivateMgr.name,
  ngeoQueryComponent.name,
  ngeoQueryPanelComponent.name,
  ngeoQueryModule.name,
]);


module.run(
  /**
   * @ngInject
   * @param {angular.ITemplateCacheService} $templateCache
   */
  ($templateCache) => {
    // @ts-ignore: webpack
    $templateCache.put('partials/queryresult', require('./partials/queryresult.html'));
  });

import ngeoMiscFeatureHelper from 'ngeo/misc/FeatureHelper.js';
import ngeoMiscFile from 'ngeo/misc/File.js';
import ngeoMiscFilereaderComponent from 'ngeo/misc/filereaderComponent.js';
import ngeoMiscFilters from 'ngeo/misc/filters.js';
import ngeoMiscGetBrowserLanguage from 'ngeo/misc/getBrowserLanguage.js';
import ngeoMiscSortableComponent from 'ngeo/misc/sortableComponent.js';
import ngeoMiscTime from 'ngeo/misc/Time.js';
import ngeoMiscToolActivateMgr from 'ngeo/misc/ToolActivateMgr.js';
import ngeoMiscWMSTime from 'ngeo/misc/WMSTime.js';

/**
 * @type {!angular.IModule}
 */
export default angular.module('ngeoMiscExtraModule', [
  ngeoMiscAutoProjection.name,
  ngeoMiscBtnComponent.name,
  ngeoMiscControlComponent.name,
  ngeoMiscDatepickerComponent.name,
  ngeoMiscDebounce.name,
  ngeoMiscEventHelper.name,
  ngeoMiscFeatureHelper.name,
  ngeoMiscFile.name,
  ngeoMiscFilereaderComponent.name,
  ngeoMiscFilters.name,
  ngeoMiscGetBrowserLanguage.name,
  ngeoMiscSortableComponent.name,
  ngeoMiscTime.name,
  ngeoMiscToolActivateMgr.name,
  ngeoMiscWMSTime.name,
]);

import ngeoMiscToolActivateMgr from 'ngeo/misc/ToolActivateMgr.js';
import olCollection from 'ol/Collection.js';
import olMap from 'ol/Map.js';
import olView from 'ol/View.js';
import olLayerTile from 'ol/layer/Tile.js';
import olLayerVector from 'ol/layer/Vector.js';
import olSourceOSM from 'ol/source/OSM.js';
import olSourceVector from 'ol/source/Vector.js';
import ngeoMapModule from 'ngeo/map/module.js';


/** @type {!angular.IModule} **/
const module = angular.module('app', [
  'gettext',
  ngeoMapModule.name,
  ngeoMiscBtnComponent.name,
  ngeoMiscToolActivateMgr.name,
  ngeoEditingCreatefeatureComponent.name,
]);


/**
 * @param {import("ngeo/misc/ToolActivateMgr.js").ToolActivateMgr} ngeoToolActivateMgr Ngeo ToolActivate
 *    manager service.
 * @constructor
 * @ngInject
 */
function MainController(ngeoToolActivateMgr) {

  /**
   * @type {import("ol/Collection.js").default}
   */

import gmfProfileDrawLineComponent from 'gmf/profile/drawLineComponent.js';
import ngeoMiscBtnComponent from 'ngeo/misc/btnComponent.js';
import ngeoDownloadCsv from 'ngeo/download/Csv.js';
import ngeoMiscToolActivate from 'ngeo/misc/ToolActivate.js';
import ngeoMiscToolActivateMgr from 'ngeo/misc/ToolActivateMgr.js';


/**
 * @type {!angular.IModule}
 * @hidden
 */
const module = angular.module('gmfLidarprofilePanel', [
  gmfLidarprofileConfig.name,
  gmfLidarprofileManager.name,
  gmfProfileDrawLineComponent.name,
  ngeoMiscBtnComponent.name,
  ngeoDownloadCsv.name,
  ngeoMiscToolActivateMgr.name,
]);


module.value('gmfLidarprofilePanelTemplateUrl',
  /**
   * @param {!JQuery} $element Element.
   * @param {!angular.IAttributes} $attrs Attributes.
   * @return {string} Template.
   */
  ($element, $attrs) => {
    const templateUrl = $attrs['gmfLidarprofilePanelTemplateUrl'];
    return templateUrl !== undefined ? templateUrl :
      'gmf/lidarprofilePanel';
  });