Merge pull request #414 from microsoftgraph/nmetulev/typescleanup

ensured types are correct and exported

Author: beth-panx

src/components/components.ts

@@ -25,6 +25,4 @@ export * from './mgt-person/mgt-person';
 export * from './mgt-tasks/mgt-tasks';
 export * from './mgt-teams-channel-picker/mgt-teams-channel-picker';
 
-// Sub-Components, not for export!
-// export * from './sub-components/mgt-dot-options/mgt-dot-options';
-// export * from './sub-components/mgt-arrow-options/mgt-arrow-options';
+export { ComponentMediaQuery } from './baseComponent';

src/components/mgt-agenda/mgt-agenda.ts

@@ -24,6 +24,8 @@ import { getEventsPageIterator } from './mgt-agenda.graph';
  * @class MgtAgenda
  * @extends {MgtTemplatedComponent}
  *
+ * @fires eventClick - Fired when user click an event
+ *
  * @cssprop --event-box-shadow - {String} Event box shadow color and size
  * @cssprop --event-margin - {String} Event margin
  * @cssprop --event-padding - {String} Event padding
@@ -150,7 +152,7 @@ export class MgtAgenda extends MgtTemplatedComponent {
 
   /**
    * allows developer to define agenda to group events by day.
-   * @type {Boolean}
+   * @type {boolean}
    */
   @property({
     attribute: 'group-by-day',

src/components/mgt-get/mgt-get.ts

@@ -15,6 +15,8 @@ import { MgtTemplatedComponent } from '../templatedComponent';
 /**
  * Custom element for making Microsoft Graph get queries
  *
+ * @fires dataChange - Fired when data changes
+ *
  * @export
  * @class mgt-get
  * @extends {MgtTemplatedComponent}
@@ -94,15 +96,15 @@ export class MgtGet extends MgtTemplatedComponent {
   /**
    * Gets or sets the response of the request
    *
-   * @type {*}
+   * @type any
    * @memberof MgtGet
    */
   @property({ attribute: false }) public response: any;
 
   /**
    *
    * Gets or sets the error (if any) of the request
-   * @type {*}
+   * @type any
    * @memberof MgtGet
    */
   @property({ attribute: false }) public error: any;

src/components/mgt-login/mgt-login.ts

@@ -5,9 +5,9 @@
  * -------------------------------------------------------------------------------------------
  */
 
-import { User } from '@microsoft/microsoft-graph-types';
-import { customElement, html, property, query } from 'lit-element';
+import { customElement, html, property } from 'lit-element';
 import { classMap } from 'lit-html/directives/class-map';
+import { IDynamicPerson } from '../../graph/types';
 import { Providers } from '../../Providers';
 import { ProviderState } from '../../providers/IProvider';
 import '../../styles/fabric-icon-font';
@@ -23,6 +23,12 @@ import { styles } from './mgt-login-css';
  * @class MgtLogin
  * @extends {MgtBaseComponent}
  *
+ * @fires loginInitiated - Fired when login is initiated by the user
+ * @fires loginCompleted - Fired when login completes
+ * @fires loginFailed - Fired when login fails
+ * @fires logoutInitiated - Fired when logout is initiated by the user
+ * @fires logoutCompleted - Fired when logout completed
+ *
  * @cssprop --font-size - {Length} Login font size
  * @cssprop --font-weight - {Length} Login font weight
  * @cssprop --height - {String} Login height percentage
@@ -46,13 +52,13 @@ export class MgtLogin extends MgtBaseComponent {
 
   /**
    * allows developer to use specific user details for login
-   * @type {MgtPersonDetails}
+   * @type {IDynamicPerson}
    */
   @property({
     attribute: 'user-details',
     type: Object
   })
-  public userDetails: User;
+  public userDetails: IDynamicPerson;
 
   /**
    * Gets the flyout element

src/components/mgt-people-picker/mgt-people-picker.ts

@@ -41,6 +41,8 @@ interface IFocusable {
  * @class MgtPicker
  * @extends {MgtTemplatedComponent}
  *
+ * @fires selectionChanged - Fired when selection changes
+ *
  * @cssprop --people-list-background-color - {Color} People list background color
  * @cssprop --accent-color - {Color} Accent color
  */
@@ -55,8 +57,8 @@ export class MgtPeoplePicker extends MgtTemplatedComponent {
   }
 
   /**
-   * containing object of MgtPersonDetails.
-   * @type {MgtPersonDetails}
+   * containing object of IDynamicPerson.
+   * @type {IDynamicPerson[]}
    */
   @property({
     attribute: 'people',
@@ -76,7 +78,7 @@ export class MgtPeoplePicker extends MgtTemplatedComponent {
 
   /**
    *  array of user picked people.
-   * @type {Array<IDynamicPerson>}
+   * @type {IDynamicPerson[]}
    */
   @property({
     attribute: 'selected-people',

src/components/mgt-people/mgt-people.ts

@@ -6,7 +6,6 @@
  */
 
 import * as MicrosoftGraph from '@microsoft/microsoft-graph-types';
-import { Presence } from '@microsoft/microsoft-graph-types-beta';
 import { customElement, html, property, TemplateResult } from 'lit-element';
 import { repeat } from 'lit-html/directives/repeat';
 import { getPeople, getPeopleFromGroup } from '../../graph/graph.people';
@@ -21,6 +20,8 @@ import { MgtTemplatedComponent } from '../templatedComponent';
 import { PersonCardInteraction } from './../PersonCardInteraction';
 import { styles } from './mgt-people-css';
 
+export { PersonCardInteraction } from './../PersonCardInteraction';
+
 /**
  * web component to display a group of people or contacts by using their photos or initials.
  *
@@ -84,7 +85,7 @@ export class MgtPeople extends MgtTemplatedComponent {
 
   /**
    * containing array of people used in the component.
-   * @type {Array<MgtPersonDetails>}
+   * @type {IDynamicPerson[]}
    */
   @property({
     attribute: 'people',

src/components/mgt-person-card/mgt-person-card.ts

@@ -6,7 +6,7 @@
  */
 
 import * as MicrosoftGraph from '@microsoft/microsoft-graph-types';
-import { Presence } from '@microsoft/microsoft-graph-types-beta';
+import * as MicrosoftGraphBeta from '@microsoft/microsoft-graph-types-beta';
 import { customElement, html, property, TemplateResult } from 'lit-element';
 import { findPeople, getEmailFromGraphEntity } from '../../graph/graph.people';
 import { getPersonImage } from '../../graph/graph.photos';
@@ -131,14 +131,14 @@ export class MgtPersonCard extends MgtTemplatedComponent {
   /**
    * Gets or sets presence of person
    *
-   * @type {Presence}
+   * @type {MicrosoftGraphBeta.Presence}
    * @memberof MgtPerson
    */
   @property({
     attribute: 'person-presence',
     type: Object
   })
-  public personPresence: Presence;
+  public personPresence: MicrosoftGraphBeta.Presence;
 
   /**
    * Invoked each time the custom element is appended into a document-connected element
@@ -260,7 +260,11 @@ export class MgtPersonCard extends MgtTemplatedComponent {
    * @param {*} image
    * @memberof MgtPersonCard
    */
-  protected renderPersonImage(imageSrc?: string, presence?: Presence, showPresence?: boolean): TemplateResult {
+  protected renderPersonImage(
+    imageSrc?: string,
+    presence?: MicrosoftGraphBeta.Presence,
+    showPresence?: boolean
+  ): TemplateResult {
     imageSrc = imageSrc || this.getImage();
     presence = presence || this.personPresence;
     showPresence = showPresence || this.showPresence;

src/components/mgt-person/mgt-person.ts

@@ -6,7 +6,7 @@
  */
 
 import * as MicrosoftGraph from '@microsoft/microsoft-graph-types';
-import { Presence } from '@microsoft/microsoft-graph-types-beta';
+import * as MicrosoftGraphBeta from '@microsoft/microsoft-graph-types-beta';
 import { customElement, html, property, query, TemplateResult } from 'lit-element';
 import { classMap } from 'lit-html/directives/class-map';
 import { findPeople, getEmailFromGraphEntity } from '../../graph/graph.people';
@@ -25,6 +25,8 @@ import { MgtTemplatedComponent } from '../templatedComponent';
 import { PersonCardInteraction } from './../PersonCardInteraction';
 import { styles } from './mgt-person-css';
 
+export { PersonCardInteraction } from './../PersonCardInteraction';
+
 /**
  * The person component is used to display a person or contact by using their photo, name, and/or email address.
  *
@@ -156,14 +158,14 @@ export class MgtPerson extends MgtTemplatedComponent {
   /**
    * Gets or sets presence of person
    *
-   * @type {Presence}
+   * @type {MicrosoftGraphBeta.Presence}
    * @memberof MgtPerson
    */
   @property({
     attribute: 'person-presence',
     type: Object
   })
-  public personPresence: Presence;
+  public personPresence: MicrosoftGraphBeta.Presence;
 
   /**
    * Sets how the person-card is invoked
@@ -384,7 +386,7 @@ export class MgtPerson extends MgtTemplatedComponent {
    * @param
    * @memberof MgtPersonCard
    */
-  protected renderPresence(presence?: Presence): TemplateResult {
+  protected renderPresence(presence?: MicrosoftGraphBeta.Presence): TemplateResult {
     if (!this.showPresence) {
       return html``;
     }
@@ -492,7 +494,7 @@ export class MgtPerson extends MgtTemplatedComponent {
    * @param
    * @memberof MgtPersonCard
    */
-  protected renderImageWithPresence(image?: string, presence?: Presence): TemplateResult {
+  protected renderImageWithPresence(image?: string, presence?: MicrosoftGraphBeta.Presence): TemplateResult {
     if (!image) {
       image = this.getImage();
     }

src/components/mgt-tasks/mgt-tasks.ts

@@ -34,6 +34,8 @@ import { MgtFlyout } from '../sub-components/mgt-flyout/mgt-flyout';
  * @export
  * @enum {number}
  *
+ * @fires taskClick - Fired when the user clicks a task
+ *
  * @cssprop --tasks-header-padding - {String} Tasks header padding
  * @cssprop --tasks-header-margin - {String} Tasks header margin
  * @cssprop --tasks-title-padding - {String} Tasks title padding
@@ -93,6 +95,56 @@ export enum TasksSource {
   todo
 }
 
+/**
+ * String resources for Mgt Tasks
+ *
+ * @export
+ * @interface TasksStringResource
+ */
+export interface TasksStringResource {
+  /**
+   * Self Assigned string
+   *
+   * @type {string}
+   * @memberof TasksStringResource
+   */
+  BASE_SELF_ASSIGNED: string;
+  /**
+   * Self Assigned Buckets string
+   *
+   * @type {string}
+   * @memberof TasksStringResource
+   */
+  BUCKETS_SELF_ASSIGNED: string;
+  /**
+   * Buckets not found string
+   *
+   * @type {string}
+   * @memberof TasksStringResource
+   */
+  BUCKET_NOT_FOUND: string;
+  /**
+   * Self Assigned Plans string
+   *
+   * @type {string}
+   * @memberof TasksStringResource
+   */
+  PLANS_SELF_ASSIGNED: string;
+  /**
+   * Plan not found string
+   *
+   * @type {string}
+   * @memberof TasksStringResource
+   */
+  PLAN_NOT_FOUND: string;
+}
+
+/*
+ * Filter function
+ */
+// tslint:disable-next-line: completed-docs
+export type TaskFilter = (task: PlannerTask | OutlookTask) => boolean;
+
 // Strings and Resources for different task contexts
 // tslint:disable-next-line: completed-docs
 const TASK_RES = {
@@ -131,6 +183,7 @@ export class MgtTasks extends MgtTemplatedComponent {
    * determines whether todo, or planner functionality for task component
    *
    * @readonly
+   * @type {TasksStringResource}
    * @memberof MgtTasks
    */
   public get res() {
@@ -256,7 +309,7 @@ export class MgtTasks extends MgtTemplatedComponent {
    *
    * @memberof MgtTasks
    */
-  public taskFilter: (task: PlannerTask | OutlookTask) => boolean;
+  public taskFilter: TaskFilter;
 
   @property() private _isNewTaskVisible: boolean;
   @property() private _newTaskBeingAdded: boolean;

src/components/mgt-teams-channel-picker/mgt-teams-channel-picker.ts

@@ -122,6 +122,8 @@ interface ChannelPickerItemState {
  * @class MgtTeamsChannelPicker
  * @extends {MgtTemplatedComponent}
  *
+ * @fires selectionChanged - Fired when the selection changes
+ *
  * @cssprop --font-color - {font} Default font color
  *
  * @cssprop --input-border - {String} Input section entire border