Convert `<annotation-share-dialog>` element directive to a component

As part of an effort to make it clearer how the client uses Angular,
register UI components with `component()` instead of `directive()`.

Components in Angular 1.x [1] are essentially directives with "best
practices" defaults set (restricted to elements, isolated scope, bound
to controller) and deprecated/discouraged features of $compile
disallowed. These defaults/restrictions match how we are already using
Angular for most UI components.

[1] See https://docs.angularjs.org/guide/component

src/sidebar/app.js

@@ -135,9 +135,10 @@ module.exports = angular.module('h', [
   // The root component for the application
   .directive('hypothesisApp', require('./directive/app'))
 
-  // UI components and helpers
+  // UI components
+  .component('annotationShareDialog', require('./directive/annotation-share-dialog'))
+
   .directive('annotation', require('./directive/annotation').directive)
-  .directive('annotationShareDialog', require('./directive/annotation-share-dialog'))
   .directive('annotationThread', require('./directive/annotation-thread'))
   .directive('dropdownMenuBtn', require('./directive/dropdown-menu-btn'))
   .directive('excerpt', require('./directive/excerpt').directive)

src/sidebar/directive/annotation-share-dialog.js

@@ -4,11 +4,8 @@ var angular = require('angular');
 
 var scopeTimeout = require('../util/scope-timeout');
 
-module.exports = function () {
-  return {
-    bindToController: true,
+module.exports = {
   controllerAs: 'vm',
-    restrict: 'E',
   template: require('../templates/annotation_share_dialog.html'),
   // @ngInject
   controller: function ($scope, $element) {
@@ -65,12 +62,11 @@ module.exports = function () {
       }
     }.bind(this);
   },
-    scope: {
+  bindings: {
     group: '<',
     uri: '<',
     isPrivate: '<',
     isOpen: '<',
     onClose: '&',
   },
-  };
 };

src/sidebar/directive/test/annotation-share-dialog-test.js

@@ -13,7 +13,7 @@ describe('annotationShareDialog', function () {
 
   before(function () {
     angular.module('app', [])
-      .directive('annotationShareDialog',
+      .component('annotationShareDialog',
         require('../annotation-share-dialog'))
       .value('urlEncodeFilter', function (val) { return val; });
   });