├── .github
    └── ISSUE_TEMPLATE
    │   ├── bug-report.md
    │   └── config.yml
├── .gitignore
├── README.md
├── babel.config.js
├── docs
    ├── appmenu.md
    ├── butterbar.md
    ├── changelog.md
    ├── common-data-types.md
    ├── compose.md
    ├── conversations.md
    ├── getting-started.md
    ├── global.md
    ├── inboxsdk-star.md
    ├── keyboard-shortcuts.md
    ├── lists.md
    ├── navmenu.md
    ├── resources.md
    ├── router.md
    ├── search.md
    ├── toolbars.md
    ├── user.md
    └── widgets.md
├── docusaurus.config.js
├── package.json
├── sidebars.js
├── src
    ├── css
    │   └── custom.css
    └── pages
    │   ├── exampleReactPage.js
    │   └── styles.module.css
├── static
    ├── .nojekyll
    └── img
    │   ├── favicon.ico
    │   ├── full_logo.svg
    │   ├── logo.svg
    │   ├── undraw_docusaurus_mountain.svg
    │   ├── undraw_docusaurus_react.svg
    │   └── undraw_docusaurus_tree.svg
└── yarn.lock


/.github/ISSUE_TEMPLATE/bug-report.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | name: "\U0001F41B Docs bug"
 3 | about: Report an issue with the documentation.
 4 | title: 'Bug: '
 5 | labels: 'status: Unconfirmed'
 6 | ---
 7 | 
 8 | <!--
 9 |   Please provide a clear and concise description of what the bug is.
10 |   Include screenshots if needed.
11 | -->
12 | 
13 | **Describe the bug**
14 | 
15 | **Expected behavior**
16 | 
17 | **Screenshots**
18 | 
19 | **Add any other context about the problem here if anything**
20 | 


--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/config.yml:
--------------------------------------------------------------------------------
1 | contact_links:
2 |   - name: 📃 Bugs with InboxSDK Implementation
3 |     url: https://github.com/InboxSDK/inboxsdk/issues/new
4 |     about: This issue tracker is only for documentation issues. Please file bugs in the actual SDK here.
5 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | # Dependencies
 2 | /node_modules
 3 | 
 4 | # Production
 5 | /build
 6 | 
 7 | # Generated files
 8 | .docusaurus
 9 | .cache-loader
10 | 
11 | # Misc
12 | .DS_Store
13 | .env.local
14 | .env.development.local
15 | .env.test.local
16 | .env.production.local
17 | 
18 | npm-debug.log*
19 | yarn-debug.log*
20 | yarn-error.log*
21 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Website
 2 | 
 3 | This website is built using [Docusaurus 2](https://v2.docusaurus.io/), a modern static website generator.
 4 | 
 5 | ### Installation
 6 | 
 7 | ```
 8 | $ yarn
 9 | ```
10 | 
11 | ### Local Development
12 | 
13 | ```
14 | $ yarn start
15 | ```
16 | 
17 | This command starts a local development server and open up a browser window. Most changes are reflected live without having to restart the server.
18 | 
19 | ### Build
20 | 
21 | ```
22 | $ yarn build
23 | ```
24 | 
25 | This command generates static content into the `build` directory and can be served using any static contents hosting service.
26 | 
27 | ### Deployment
28 | 
29 | ```
30 | $ GIT_USER=<Your GitHub username> USE_SSH=true yarn deploy
31 | ```
32 | 
33 | This command builds the website and pushes to the `gh-pages` branch.
34 | 


--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
3 | };
4 | 


--------------------------------------------------------------------------------
/docs/appmenu.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: AppMenu
  3 | ---
  4 | 
  5 | This namespace contains functionality associated with adding app menu items to the app menu panel of Gmail. Typically, these app menu items are accessible by the user on the left side of the email client and include built in app menu items like the Mail and optionally either Chat, Meet, or both. If both Chat and Meet aren't enabled, the AppMenu will not be displayed.
  6 | 
  7 | This namespace allows you to add your own items to this App menu. Typically, these app menu items are useful to either place high level collapsible panels like the NavMenu or send users to different Routes that you have already registered providing navigation for your entire application.
  8 | The app menu is represented as a list of items. Each item can have either a CollapsiblePanel or click handler.
  9 | Items with CollapsiblePanels can also have accessories which provide primary actions like providing a "create new" action.
 10 | 
 11 | ### Namespace methods
 12 | 
 13 | #### isShown()
 14 | 
 15 | Returns true if the app menu is visible. At time of writing, this typically means they have chose to enable Chat, Meet, or both.
 16 | 
 17 | #### addMenuItem(appMenuItemDescriptor)
 18 | 
 19 | Adds an app menu item to the app menu. Because the AppMenu may not be shown, this method expects `AppMenu.isShown` to be called first.
 20 | 
 21 | If the `AppMenu.isShown` returns `false` and this method is called, the SDK waits a bit for the AppMenu selector and then logs a warning.
 22 | 
 23 | If the `insertOrder` option is provided, the app menu item will be added at that index. If it is not, the SDK adds the app menu item after Gmail's default app menu icons.
 24 | 
 25 | | Parameters                | Type                    | Description                         |
 26 | | :------------------------ | :---------------------- | :---------------------------------- |
 27 | | **appMenuItemDescriptor** | `AppMenuItemDescriptor` | A descriptor for the app menu item. |
 28 | 
 29 | _Returns_ an `AppMenuItemView`
 30 | 
 31 | #### isMenuOpen
 32 | 
 33 | _Returns_ whether or not the AppMenu Burger is uncollapsed or not.
 34 | 
 35 | ### Properties
 36 | 
 37 | | Property   | Type     | Description                                        | Required? | Default |
 38 | | :--------- | :------- | :------------------------------------------------- | :-------- | :------ |
 39 | | **events** | `Events` | A kefir stream of events related to the namespace. |           |         |
 40 | 
 41 | ### Events
 42 | 
 43 | #### collapseToggled
 44 | 
 45 | The TransitionEvent that was fired when the AppMenu's collapsiblepanel toggle collapsed or open started, canceled, or ended. `transactionstart` and `transitioncancel` are currently fired. We also theoretically handle `transactionend`, but it isn't currently fired.
 46 | 
 47 | ---
 48 | 
 49 | ## AppMenuItemView
 50 | 
 51 | Each AppMenuItemView represents an entry in the app menu of Gmail. Typically the main action of a AppMenuItemView is performed when the user clicks or hovers on the app menu item.
 52 | 
 53 | ### Methods
 54 | 
 55 | #### addCollapsiblePanel(appMenuItemPanelDescriptor)
 56 | 
 57 | Add a panel to an AppMenuItemView.
 58 | 
 59 | | Parameters                     | Type                         | Description                                      |
 60 | | :----------------------------- | :--------------------------- | :----------------------------------------------- |
 61 | | **appMenuItemPanelDescriptor** | `AppMenuItemPanelDescriptor` | A single descriptor for the app menu item panel. |
 62 | 
 63 | _Returns_ a `Promise<CollapsiblePanelView | undefined>`. The result is `undefined` if the SDK doesn't detect the AppMenu being shown.
 64 | 
 65 | #### update(menuItemDescriptor)
 66 | 
 67 | | Parameters                     | Type                         | Description                                     |
 68 | | :----------------------------- | :--------------------------- | :---------------------------------------------- |
 69 | | **appMenuItemPanelDescriptor** | `AppMenuItemPanelDescriptor` | The new descriptor for the app menu item panel. |
 70 | 
 71 | Updates the AppMenuItem's AppMenuItemDescriptor
 72 | 
 73 | #### remove()
 74 | 
 75 | Remove this AppMenuItemView from its parent
 76 | 
 77 | ### Events
 78 | 
 79 | #### blur
 80 | 
 81 | Fires when this AppMenuItemView's menuItem has a `mouseenter` event triggered.
 82 | 
 83 | #### click
 84 | 
 85 | Fires when this AppMenuItemView's menuItem has a `click` event triggered.
 86 | 
 87 | #### hover
 88 | 
 89 | Fires when this AppMenuItemView's menuItem has a `mouseleave` event triggered.
 90 | 
 91 | #### destroy
 92 | 
 93 | Fires when this view is destroyed.
 94 | 
 95 | ### Properties
 96 | 
 97 | | Property               | Type                    | Description                             | Required? | Default |
 98 | | :--------------------- | :---------------------- | :-------------------------------------- | :-------- | :------ |
 99 | | **menuItemDescriptor** | `AppMenuItemDescriptor` | The current configuration for the view. | Yes       |         |
100 | 
101 | ---
102 | 
103 | ## AppMenuItemDescriptor
104 | 
105 | This object represents the set of options to configure a new NavItemView.
106 | 
107 | | Property          | Type                                                  | Description                                                                                                                                 | Required? | Default                   |
108 | | :---------------- | :---------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------ | :-------- | :------------------------ |
109 | | **name**          | `string`                                              | Name of the AppMenuItem to be used for display                                                                                              | Yes       |                           |
110 | | **iconUrl**       | `{ darkTheme?: ThemedIcon; lightTheme?: ThemedIcon }` | The icon to be used for the AppMenuItem. If `darkTheme` doesn't have a value provided, `lightTheme` is used when the Gmail theme is 'dark'. | No        |                           |
111 | | **className**     | `string`                                              | A custom class name added to the app menu item. Can be used to customize the AppMenuItem's appearance.                                      | No        |                           |
112 | | **iconClassName** | `string`                                              | A custom class name added to the app menu item. Can be used to customize the AppMenuItem's icon element's appearance.                       | No        |                           |
113 | | **insertIndex**   | `number`                                              | The desired index for placement of the AppMenuItem.                                                                                         | No        | The count of AppMenuItems |
114 | | **onClick**       | `(e?: MouseEvent) => void`                            | A callback fired when the AppMenuItem is clicked                                                                                            | No        |                           |
115 | | **onHover**       | `(e?: MouseEvent) => void`                            | A callback fired when the AppMenuItem or its CollapsiblePanel has a `mouseenter` event fired                                                | No        |
116 | | **routeID**       | `string`                                              | The SDK route associated with the AppMenuItem. If the `routeID` option is provided, `isRouteActive` should be as well.                      | No        |                           |
117 | | **routeParams**   | `Record<string, string>`                              | RouteParams provided to the SDK route ID when the AppMenuItem is clicked along with the `routeID`                                           | No        |                           |
118 | | **isRouteActive** | `(routeView: RouteView) => boolean`                   | Whether AppMenuItem is active based on the SDK `RouteView`.                                                                                 | Yes       |                           |
119 | 
120 | ---
121 | 
122 | ## ThemedIcon
123 | 
124 | ThemedIcon allows you to add an icon and optionally have it reflect `active` or `default` states for the ActiveMenuIcon. ThemedIcons can also just be strings if the same icon is preferred by both `active` and `default`.
125 | 
126 | | Property    | Type     | Description                                                    | Required? | Default |
127 | | :---------- | :------- | :------------------------------------------------------------- | :-------- | :------ |
128 | | **active**  | `string` | The AppMenuItem icon when the AppMenuItem is currently active. | Yes       |         |
129 | | **default** | `string` | The AppMenuItem icon when a different AppMenuItem is active.   | Yes       |         |
130 | 
131 | ---
132 | 
133 | ## AppMenuItemPanelDescriptor
134 | 
135 | The AppMenuItemPanelDescriptor allows you to add a CollapsiblePanel right next your AppMenuItem which lets the user take a primary or second action.
136 | 
137 | | Property          | Type                            | Description                                                                                                 | Required? | Default |
138 | | :---------------- | :------------------------------ | :---------------------------------------------------------------------------------------------------------- | :-------- | :------ |
139 | | **className**     | `string`                        | The custom class added to CollapsiblePanel.                                                                 | No        |         |
140 | | **loadingIcon**   | `string`                        | In the form of HTML as a string. If this option is provided, the CollapsiblePanel defaults to loading=true. | No        |         |
141 | | **primaryButton** | `AppMenuItemPanelPrimaryButton` | Configuration for the CollapsiblePanel's optional primary action button.                                    | No        |         |
142 | 
143 | ---
144 | 
145 | ## AppMenuItemPanelPrimaryButton
146 | 
147 | The primary action for a CollapsiblePanel.
148 | 
149 | | Property    | Type                                                                                    | Description                                                    | Required? | Default                                       |
150 | | :---------- | :-------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :-------- | :-------------------------------------------- |
151 | | **name**    | `string`                                                                                | The display name of the primary action button                  | Yes       |                                               |
152 | | **onClick** | `(e: MouseEvent) => void`                                                               | The button's click handler                                     | Yes       |                                               |
153 | | **iconUrl** | `{darkTheme?: PanelPrimaryButtonThemedIcon;lightTheme?: PanelPrimaryButtonThemedIcon;}` | Icon URLs to display based on the button being hovered or not. | No        | The Gmail default icon is a multicolored plus |
154 | 
155 | ---
156 | 
157 | ## CollapsiblePanelView
158 | 
159 | Each AppMenuItem can have a CollapsiblePanelView.
160 | 
161 | Typically the main action of a CollapsiblePanelView is performed when the user clicks or hovers on the app menu item.
162 | 
163 | ### Methods
164 | 
165 | #### setLoading(loading: boolean)
166 | 
167 | Updates the loading property of the CollapsiblePanelView.
168 | 
169 | #### remove()
170 | 
171 | Remove this CollapsiblePanelView from its parent
172 | 
173 | #### addNavItem(navItemDescriptor)
174 | 
175 | | Parameters            | Type                              | Description                                                             |
176 | | :-------------------- | :-------------------------------- | :---------------------------------------------------------------------- |
177 | | **navItemDescriptor** | CollapsiblePanelNavItemDescriptor | Add a single or Kefir.Observable nav menu item to the CollapsiblePanel. |
178 | 
179 | ##### CollapsiblePanelNavItemDescriptor
180 | 
181 | CollapsiblePanelNavItemDescriptor is represented by the following TS types `NavItemDescriptor | Kefir.Observable<NavItemDescriptor, any>`
182 | 
183 | ### Events
184 | 
185 | #### blur
186 | 
187 | Fires when this CollapsiblePanelView's panel has a `mouseenter` event triggered.
188 | 
189 | #### destroy
190 | 
191 | Fires when this view is destroyed.
192 | 
193 | ### Properties
194 | 
195 | | Property            | Type                         | Description                                                           | Required? | Default                                                                 |
196 | | :------------------ | :--------------------------- | :-------------------------------------------------------------------- | :-------- | :---------------------------------------------------------------------- |
197 | | **loading**         | `boolean`                    | Whether the `AppMenuItemPanelDescriptor['loadingIcon']` is displayed. | No        | Defaults to true if `AppMenuItemPanelDescriptor['loadingIcon']` is set. |
198 | | **panelDescriptor** | `AppMenuItemPanelDescriptor` | The current configuration for the CollapsiblePanel                    | Yes       |                                                                         |
199 | 


--------------------------------------------------------------------------------
/docs/butterbar.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: ButterBar
  3 | ---
  4 | This namespace contains methods for showing informative messages to the user. In Gmail this is a small yellow "butter bar" overlay near the top.
  5 | 
  6 | ### Namespace methods
  7 | #### showMessage(options)
  8 | Spawns a new message.
  9 | 
 10 | | Parameters | Type | Description |
 11 | | :--- | :--- | :--- |
 12 | | **options** | `MessageDescriptor` | message options |
 13 | 
 14 | _Returns_ an `Object` that contains a destroy method that can be called to remove the message.
 15 | 
 16 | #### showLoading(options)
 17 | Spawns a "Loading..." message that stays until it's destroyed.
 18 | 
 19 | | Parameters | Type | Description |
 20 | | :--- | :--- | :--- |
 21 | | **options** | `LoadingMessageDescriptor` | message options |
 22 | 
 23 | _Returns_ an `Object` which has a destroy method that can be called to remove the message.
 24 | 
 25 | #### showError(options)
 26 | Spawns a new error message. Error messages also have a default priority of 100 instead of 0 (as in the case of ButterBar.showMessage).
 27 | 
 28 | | Parameters | Type | Description |
 29 | | :--- | :--- | :--- |
 30 | | **options** | `MessageDescriptor` | message options |
 31 | 
 32 | _Returns_ an `Object` which contains a destroy method that can be called to remove the message. 
 33 | 
 34 | #### showSaving(options)
 35 | Spawns a "Saving..." message that stays until it's removed. 
 36 | 
 37 | | Parameters | Type | Description |
 38 | | :--- | :--- | :--- |
 39 | | **options** | `SavingMessageDescriptor` | message options |
 40 | 
 41 | _Returns_ an `Object` which has a resolve method that can be called to show a "Saved" confirmation message, and a reject method that can be called to remove the message immediately with no confirmation.
 42 | 
 43 | #### hideMessage(messageKey)
 44 | Hides all messages created by the same app with the given messageKey.
 45 | 
 46 | | Parameters | Type | Description |
 47 | | :--- | :--- | :--- |
 48 | | **messageKey** | `Object` | the key of the message to hide |
 49 | 
 50 | 
 51 | #### hideGmailMessage()
 52 | Hides any messages currently displayed by Gmail.
 53 | 
 54 | 
 55 | --
 56 | ## MessageDescriptor
 57 | This type is used to describe a message for ButterBar to show.
 58 | 
 59 | | Property | Type | Description | Required? | Default |
 60 | | :--- | :--- | :--- | :--- | :--- |
 61 | | **text** | `string` | Text to show. Either the text property or the html property must be passed. | No |  |
 62 | | **html** | `string` | String to use as the innerHTML of the ButterBar instead of using the given text. | No |  |
 63 | | **el** | `HTMLElement` | HTML element to insert into the ButterBar instead of using the given text. | No |  |
 64 | | **className** | `string` | String to add as a css class to the ButterBar container element. | No |  |
 65 | | **priority** | `number` | Messages with lower priorities won't interrupt a currently displayed message. | No | `0` |
 66 | | **time** | `number` | Number of milliseconds the message is displayed before going away on its own. | No | `15000` |
 67 | | **hideOnViewChanged** | `boolean` | If true, the message will immediately disappear if the user navigates to another route view. | No | `true` |
 68 | | **persistent** | `boolean` | Whether this message should re-appear after being interrupted by another message. | No | `false` |
 69 | | **messageKey** | `Object` | If a new message has the same messageKey as the current message, then the current message will always be destroyed, regardless of its priority. | No |  |
 70 | | **buttons** | `Array<MessageButtonDescriptor>` | An array of buttons to support functionality in addition to the preview functionality | No |  |
 71 | 
 72 | 
 73 | 
 74 | 
 75 | --
 76 | ## MessageButtonDescriptor
 77 | This type is used to describe the buttons for ButterBar to show.
 78 | 
 79 | | Property | Type | Description | Required? | Default |
 80 | | :--- | :--- | :--- | :--- | :--- |
 81 | | **onClick** | `function(event)` | This is called when a button is clicked and gets passed an event object. | Yes |  |
 82 | | **title** | `string` | Text of the button. | Yes |  |
 83 | 
 84 | 
 85 | 
 86 | 
 87 | --
 88 | ## LoadingMessageDescriptor
 89 | This type is used to describe the messages for ButterBar.showLoading to show
 90 | 
 91 | | Property | Type | Description | Required? | Default |
 92 | | :--- | :--- | :--- | :--- | :--- |
 93 | | **text** | `string` | Text shown while the loading is ongoing. | No | `'Loading...'` |
 94 | | **html** | `string` | String to use as the innerHTML of the ButterBar instead of using the given text. | No |  |
 95 | | **el** | `HTMLElement` | HTML element to insert into the ButterBar instead of using the given text. | No |  |
 96 | | **className** | `string` | String to add as a css class to the ButterBar container element. | No |  |
 97 | | **priority** | `number` | Messages with lower priorities won't interrupt a currently displayed message. Loading messages default to a lower priority than other message types. | No | `-3` |
 98 | | **hideOnViewChanged** | `boolean` | If true, the message will immediately disappear if the user navigates to another route view. | No | `true` |
 99 | | **persistent** | `boolean` | Whether this message should re-appear after being interrupted by another message. | No | `true` |
100 | | **messageKey** | `Object` | If a new message has the same messageKey as the current message, then the current message will always be destroyed, regardless of its priority. Sets the messageKey of both the initial message and the confirmation message. | No |  |
101 | 
102 | --
103 | ## SavingMessageDescriptor
104 | This type is used to describe the messages for ButterBar.showSaving to show
105 | 
106 | | Property | Type | Description | Required? | Default |
107 | | :--- | :--- | :--- | :--- | :--- |
108 | | **text** | `string` | Text shown while the saving is ongoing. | No | `'Saving...'` |
109 | | **confirmationText** | `string` | Text shown when the save is complete. | No | `'Saved'` |
110 | | **confirmationTime** | `number` | Number of milliseconds the confirmation text is shown. | No | `1000` |
111 | | **showConfirmation** | `boolean` | Whether or not to show the confirmation message when the initial message is resolved. | No | `true` |
112 | | **html** | `string` | String to use as the innerHTML of the ButterBar instead of using the given text. | No |  |
113 | | **el** | `HTMLElement` | HTML element to insert into the ButterBar instead of using the given text. | No |  |
114 | | **className** | `string` | String to add as a css class to the ButterBar container element. | No |  |
115 | | **priority** | `number` | Messages with lower priorities won't interrupt a currently displayed message. Loading messages default to a lower priority than other message types. | No | `-3` |
116 | | **hideOnViewChanged** | `boolean` | If true, the message will immediately disappear if the user navigates to another route view. | No | `true` |
117 | | **persistent** | `boolean` | Whether this message should re-appear after being interrupted by another message. | No | `true` |
118 | | **messageKey** | `Object` | If a new message has the same messageKey as the current message, then the current message will always be destroyed, regardless of its priority. Sets the messageKey of both the initial message and the confirmation message. | No |  |
119 | 


--------------------------------------------------------------------------------
/docs/changelog.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Change Log
  3 | ---
  4 | 
  5 | The InboxSDK loads its code remotely from our servers, so users get the latest code and bug fixes automatically without extension developers being required to make any changes. We also often introduce new features over time, and on occasion we deprecate old APIs and recommend new ones. These API changes will be listed here and announced in emails to registered developers as necessary.
  6 | 
  7 | This changelog mostly includes details about API changes. Not all bug fixes have been documented here.
  8 | 
  9 | **2022-09-12** Support new network request format used by Gmail. This fixes issues with a new rollout of Gmail that affected the functionality of multiple APIs in the InboxSDK
 10 | 
 11 | **2022-08-22** Mole views now use an icon color that matches Gmail's native icon color regardless of the version of Gmail that is enabled
 12 | 
 13 | **2022-08-10** Added Widgets.isMoleViewTitleBarLightColor() method for detecting if MoleViews have the original dark titlebar or the new lighter titlebar
 14 | 
 15 | **2022-02-24** Added ThreadRowView.getElement().
 16 | 
 17 | **2022-02-24** Deprecated User.getAccountSwitcherContactList() because of Gmail changes that prevent us from continuing to support the feature. Depending on the version of Gmail in use, the function may now return a one-item list containing only the currently-signed-in user.
 18 | 
 19 | **2019-06-13** Removed the limitation on ContentPanelView.open() where it could only be used within a user-input event. The limit was made to discourage extensions from being too aggressive with opening the sidebar, but this limit seemed to be too restrictive.
 20 | 
 21 | **2019-06-13** Added Lists.getSelectedThreadRowViews() and Lists.registerThreadRowViewSelectionHandler() methods for detecting selected thread rows.
 22 | 
 23 | **2019-05-29** Fixed an issue caused by a Gmail change that caused ComposeView.getDraftID() to not work in some situations.
 24 | 
 25 | **2019-04-30** Added ComposeView.addComposeNotice() method to allow adding HTML elements in the compose view.
 26 | 
 27 | **2019-02-24** Improved ListRouteView.addCollapsibleSection and ListRouteView.addSection so that if a user leaves the ListRouteView and then returns to it, their scroll position is correctly restored, adjusted for the new sections' heights.
 28 | 
 29 | **2019-02-11** Fixed an issue where custom thread lists could cause a Gmail error message to be displayed while open.
 30 | 
 31 | **2019-02-11** Fixed an issue where custom thread lists may have threads shown in the wrong order.
 32 | 
 33 | **2019-02-06** Fixed an issue where ListRouteView.addCollapsibleSection didn't support the iconUrl and iconClass options being used together on a row.
 34 | 
 35 | **2019-02-06** Fixed an issue where some MessageView methods could cause the "Show details" dropdown on a message to close itself. (Some methods that read information about the message work by opening the details dropdown, reading text out of it, and then closing it. These methods didn't account for the situation where the dropdown was already open.)
 36 | 
 37 | **2019-02-05** Changed Router.goto to return a Promise (instead of undefined) that resolves once the navigation is complete. Some kinds of navigations to Gmail pages require the InboxSDK to do some work asynchronously before the navigation can happen.
 38 | 
 39 | **2019-01-24** Fixed an issue where MessageView.getMessageIDAsync sometimes returned an incorrect value after a pre-existing reply draft was sent.
 40 | 
 41 | **2019-01-18** Fixed an issue where ComposeView sent events weren't emitted in some cases when conversation mode was disabled in Gmail.
 42 | 
 43 | **2019-01-16** Fixed multiple issues that could cause incorrect ComposeView sent events.
 44 | 
 45 | **2018-12-31** Fixed an issue where MessageView.getSender threw an exception on collapsed messages.
 46 | 
 47 | **2018-12-03** Fixed an issue caused by a Gmail change that caused ComposeView.getRecipientEmailAddresses and ComposeView.getRecipientsFull to fail sometimes.
 48 | 
 49 | **2018-11-13** Fixed an issue where MoleViews were not moved to the left out of the way of the sidebar when an InboxSDK-created sidebar was opened.
 50 | 
 51 | **2018-11-02** Fixed an issue where switching between multiple sidebars added by Global.addSidebarContentPanel didn't always work correctly.
 52 | 
 53 | **2018-10-10** Added ContentPanelView.open method.
 54 | 
 55 | **2018-08-31** Fixed an issue caused by a Gmail change that caused link chips added by ComposeView.insertLinkChipIntoBodyAtCursor to not show up in forwarded emails.
 56 | 
 57 | **2018-07-31** Fixed multiple issues where a global or thread sidebar would fail to load if the sidebar was added before certain Gmail elements were present in the page.
 58 | 
 59 | **2018-07-31** Added the ContentPanelView.isActive method.
 60 | 
 61 | **2018-07-23** Fixed an issue caused by a Gmail change where Widgets.showMoleView() sometimes failed to render a [MoleView](www.FFIIIIIXXXXMEEEE.com) correctly.
 62 | 
 63 | **2018-07-09** Fixed an issue caused by a Gmail change where the ComposeView sent event could contain the wrong message and thread IDs.
 64 | 
 65 | **2018-07-06** Fixed an issue caused by a Gmail change where Router.goto could no longer navigate to Gmail threads.
 66 | 
 67 | **2018-06-27** Fixed an issue caused by a Gmail change where links created by Router.createLink to custom views would not work.
 68 | 
 69 | **2018-05-17** Fixed an issue causing [AttachmentCardClickEvent.getDownloadURL()](www.FFIIIIIXXXXMEEEE.com) to not work sometimes in the Gmail redesign.
 70 | 
 71 | **2018-05-09** Fixed an issue where ComposeView's sent event didn't fire in some situations.
 72 | 
 73 | **2018-05-03** Added isUsingGmailMaterialUI, isConversationViewDisabled and getLanguage to [User](www.FFIIIIIXXXXMEEEE.com). Add new [Global](www.FFIIIIIXXXXMEEEE.com) namespace. Add preautoclose event to [DropdownView](www.FFIIIIIXXXXMEEEE.com).
 74 | 
 75 | **2018-03-15** Add title property to [ThreadRowButtonDescriptor](www.FFIIIIIXXXXMEEEE.com), color property to [ModalButtonDescriptor](www.FFIIIIIXXXXMEEEE.com), and constrainTitleWidth property to [ModalOptions](www.FFIIIIIXXXXMEEEE.com).
 76 | 
 77 | **2017-07-26** [Lists](www.FFIIIIIXXXXMEEEE.com).registerThreadRowViewHandler, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).addLabel, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).addImage, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).replaceDraftLabel, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).getSubject, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).getThreadIDAsync, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).getThreadIDIfStableAsync, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).getDraftID, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).getVisibleDraftCount, [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).getVisibleMessageCount, and [ThreadRowView](www.FFIIIIIXXXXMEEEE.com).getContacts are now all supported in Inbox.
 78 | 
 79 | **2017-07-26** [Toolbars](www.FFIIIIIXXXXMEEEE.com).registerThreadButton, [Toolbars](www.FFIIIIIXXXXMEEEE.com).registerToolbarButtonForList, and [Toolbars](www.FFIIIIIXXXXMEEEE.com).registerToolbarButtonForThreadView are now supported in Inbox.
 80 | 
 81 | **2017-07-26** The new function [Toolbars](www.FFIIIIIXXXXMEEEE.com).registerThreadButton has been added which supersedes [Toolbars](www.FFIIIIIXXXXMEEEE.com).registerToolbarButtonForList and [Toolbars](www.FFIIIIIXXXXMEEEE.com).registerToolbarButtonForThreadView.
 82 | 
 83 | **2017-06-22** The ComposeView "sent" event is now properly supported in Inbox. Its threadID and messageID properties have been deprecated in favor of its new asynchronous getThreadID() and getMessageID() methods.
 84 | 
 85 | **2017-06-14** Deprecated the getThreadID, getThreadIDIfStable, and getMessageID methods of [ThreadView](www.FFIIIIIXXXXMEEEE.com), [ThreadRowView](www.FFIIIIIXXXXMEEEE.com), and [MessageView](www.FFIIIIIXXXXMEEEE.com) in favor of getThreadIDAsync, getThreadIDIfStableAsync, and getMessageIDAsync methods. This is done because it turns out that in some cases in Inbox the InboxSDK needs to make network requests against Gmail in order to correctly resolve the ID.
 86 | 
 87 | **2017-06-14** Fixed the modal and its backdrop to display over any open [DrawerView](www.FFIIIIIXXXXMEEEE.com).
 88 | 
 89 | **2017-05-16** Fixed an issue where [MessageView](www.FFIIIIIXXXXMEEEE.com).getBodyElement() would on a message if it was an exact duplicate of a previous message within the same thread. (Surprisingly, Gmail put a different classname on the element in that specific case.)
 90 | 
 91 | **2017-04-13** The InboxSDK was updated to deal with changes to the format of some of Gmail's network requests. The custom thread list feature was briefly broken today after Gmail's change and before our update.
 92 | 
 93 | **2017-04-11** Inbox support for [ComposeView](www.FFIIIIIXXXXMEEEE.com)'s getDraftID() method and some of its events was added.
 94 | 
 95 | **2017-01-23** Our initial Inbox support is live!
 96 | 
 97 | **2017-01-09** The new ThreadView sidebar design has replaced the old design after an opt-in period.
 98 | 
 99 | **2016-11-14** The ThreadView sidebar has been re-designed, and developers are encouraged [to opt-in, try out the new design, and give feedback](https://groups.google.com/forum/#!topic/inboxsdk/hNwHc5ohOPc) before it becomes the default.
100 | 
101 | **2016-09-14** Added the [DrawerView.associateComposeView](www.FFIIIIIXXXXMEEEE.com) method.
102 | 
103 | **2016-08-18** Added the [AttachmentCardClickEvent.getDownloadURL()](www.FFIIIIIXXXXMEEEE.com) method, and deprecated the [AttachmentCardView.getDownloadURL()](www.FFIIIIIXXXXMEEEE.com) method. In Inbox, the download URL of an attachment card view can't be retrieved until after the card's preview overlay has been opened by the user, so the API has been restructured to reflect this.
104 | 
105 | **2016-08-09** Added the Conversations.registerFileAttachmentCardViewHandler() method to allow AttachmentCardViews to be handled directly rather than require them to be retrieved from a MessageView instance. Google Inbox often shows attachment cards outside of messages, so this API is being introduced to allow code to be made forward-compatible with that case now.
106 | 
107 | **2016-07-21** Added the [Widgets.showDrawerView](www.FFIIIIIXXXXMEEEE.com) method and the [DrawerView](www.FFIIIIIXXXXMEEEE.com) class.
108 | 
109 | **2015-12-14** Added the ComposeView.getCurrentDraftID() method to allow determining whether a ComposeView has been assigned a draft ID yet.
110 | 
111 | **2015-12-10** Added the ThreadRowView.getDraftID() method to allow identifying the draft ID from a thread row that represents a draft.
112 | 
113 | **2015-12-09** Added the ComposeView.getDraftID() method.
114 | 
115 | **2015-06-17** Added the ComposeView.getInitialMessageID() method and the "messageID" property on the ComposeView destroy event object. The ComposeView.getMessageID() method and the ComposeView messageIDChange event have been deprecated as they weren't dependable for use directly because there was no guarantee that the message ID hadn't been changed on the server by the time a user tried to do anything with the message ID.
116 | 
117 | **2015-06-26** Deprecate User.getUserContact() in favor of User.getEmailAddress() because it seems that there are situations that the page doesn't contain the data we need to meet the API of User.getUserContact(), and its usage is rare.
118 | 
119 | **2015-06-17** Added the Widgets.showMoleView() method.
120 | 


--------------------------------------------------------------------------------
/docs/common-data-types.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Common Data Types
  3 | ---
  4 | 
  5 | ---
  6 | ## Contact
  7 | This type represents a contact
  8 | 
  9 | | Property | Type | Description | Required? | Default |
 10 | | :--- | :--- | :--- | :--- | :--- |
 11 | | **name** | `string` | The name of the contact, may be null. | Yes |  |
 12 | | **emailAddress** | `string` | The email address of the contact. | Yes |  |
 13 | 
 14 | 
 15 | 
 16 | 
 17 | 
 18 | 
 19 | 
 20 | 
 21 | 
 22 | ---
 23 | ## SimpleElementView
 24 | Base view for many other views
 25 | 
 26 | ### Methods
 27 | #### destroy()
 28 | Removes the element and executes any necessary clean-up.
 29 | 
 30 | ### Events
 31 | #### destroy
 32 | Fires when the view is destroyed. This can be triggered by the app calling the destroy() method or by the InboxSDK internally calling the destroy() method.
 33 | 
 34 | ### Properties
 35 | 
 36 | | Property | Type | Description | Required? | Default |
 37 | | :--- | :--- | :--- | :--- | :--- |
 38 | | **el** | `HTMLElement` | An element that you should modify and fill with your app's content. | Yes |  |
 39 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
 40 | 
 41 | 
 42 | 
 43 | 
 44 | 
 45 | 
 46 | 
 47 | 
 48 | 
 49 | 
 50 | ---
 51 | ## DropdownView
 52 | This class represents a Dropdown returned by the SDK to the app in various places. The dropdown can be filled with your apps content, but it automatically handles dismissing the dropdown on certain user actions.
 53 | 
 54 | ### Methods
 55 | #### setPlacementOptions(options)
 56 | This allows the position settings of the dropdown to be changed.
 57 | 
 58 | | Parameters | Type | Description |
 59 | | :--- | :--- | :--- |
 60 | | **options** | `PositionOptions` |  |
 61 | 
 62 | #### close()
 63 | Closes the dropdown
 64 | 
 65 | #### reposition()
 66 | Causes the dropdown element to recalculate its position relative to its button anchor. Use this method if you've changed the height of the dropdown while it is displayed.
 67 | 
 68 | 
 69 | ### Events
 70 | #### destroy
 71 | Fires when this DropdownView instance is closed.
 72 | 
 73 | #### preautoclose
 74 | Fires when this DropdownView instance is about to close itself in response to a user clicking outside of the dropdown or pressing escape. This event may be canceled in order to stop the dropdown from closing itself. You may want to do this if you have created a "subdropdown" menu from this dropdown that isn't part of this DropdownView's element, and you don't want clicks on your subdropdown to cause this DropdownView to auto-close.
 75 | 
 76 | | Event properties | Type | Description |
 77 | | :--- | :--- | :--- |
 78 | | **type** | `string` | This will be "outsideInteraction" if the cause is a click or focus outside of the DropdownView, or "escape" if the cause is the user pressing the Escape key. |
 79 | | **cause** | `Event` | This is the DOM event that is triggering the DropdownView to auto-close. If `type` is "outsideInteraction", then you may want to check if your your subdropdown element contains the `cause.target` element. |
 80 | | **cancel** | `function` | Calling this method will prevent this DropdownView from closing itself. |
 81 | 
 82 | 
 83 | ### Properties
 84 | 
 85 | | Property | Type | Description | Required? | Default |
 86 | | :--- | :--- | :--- | :--- | :--- |
 87 | | **el** | `HTMLElement` | The HTML element that is displayed in the dropdown. | Yes |  |
 88 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
 89 | 
 90 | 
 91 | 
 92 | 
 93 | 
 94 | 
 95 | 
 96 | 
 97 | 
 98 | 
 99 | 
100 | ---
101 | ## PositionOptions
102 | This object is used to control the positioning of an element (such as a drop-down menu) relative to an anchor element (the button that opened the drop-down menu). It is used by DropdownView.setPlacementOptions().
103 | 
104 | 
105 | | Property | Type | Description | Required? | Default |
106 | | :--- | :--- | :--- | :--- | :--- |
107 | | **position** | `string` | This value sets the prioritized position for the element relative to its anchor. It may be set to null, "top", "bottom", "left", or "right". The element will use this position unless it is not possible to do so while fitting the element on-screen. | No | `null` |
108 | | **forcePosition** | `boolean` | If true, then the configured position value will be used even if it results in the element going off of the screen. | No | `false` |
109 | | **hAlign** | `string` | This value sets the prioritized horizontal alignment mode for the element relative to its anchor. The horizontal alignment mode is used if the element is positioned in the top or bottom positions relative to the anchor, and causes the element to be moved horizontally in order to make a specific edge align. It may be set to null, "center", "left", or "right". The element will use this alignment unless it is not possible to do so while fitting the element on-screen. | No | `null` |
110 | | **forceHAlign** | `boolean` | If true, then the configured hAlign value will be used even if it results in the element going off of the screen. | No | `false` |
111 | | **vAlign** | `string` | This value sets the prioritized vertical alignment mode for the element relative to its anchor. The vertical alignment mode is used if the element is positioned in the left or right positions relative to the anchor, and causes the element to be moved vertically in order to make a specific edge align. It may be set to null, "center", "top", or "bottom". The element will use this alignment unless it is not possible to do so while fitting the element on-screen. | No | `null` |
112 | | **forceVAlign** | `boolean` | If true, then the configured vAlign value will be used even if it results in the element going off of the screen. | No | `false` |
113 | | **buffer** | `number` | This property specifies a number of pixels to be used as a buffer zone around the element. For screen-fitting purposes, the element will be treated as if it was this much larger in all directions, requiring it to be placed with the given amount of space between it, the anchor element, and the edges of the screen. The buffer option is useful if the element has children which are positioned such that they escape the boundaries of the element. Buffers do not affect alignment with the anchor element. | No | `0` |
114 | | **topBuffer** | `number` | See buffer property. This specifies an additional buffer space only for the top edge. | No | `0` |
115 | | **bottomBuffer** | `number` | See buffer property. This specifies an additional buffer space only for the bottom edge. | No | `0` |
116 | | **leftBuffer** | `number` | See buffer property. This specifies an additional buffer space only for the left edge. | No | `0` |
117 | | **rightBuffer** | `number` | See buffer property. This specifies an additional buffer space only for the right edge. | No | `0` |
118 | 
119 | 


--------------------------------------------------------------------------------
/docs/compose.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Compose
  3 | ---
  4 | 
  5 | This namespace contains methods and types related to adding your application elements to the Gmail Compose UI. The compose UI has two variants. The New Compose UI appears when users are composing new messages and appear as windows above the rest of the app content. The second, the Reply UI, appears when users are replying to existing messages from the message they are replying to. This namespace handles both of these variants equivalently.
  6 | 
  7 | The [`ComposeView`](#composeview) type is how you interact with compose windows in gmail. the most common way to get access to a compose view is to use the [`Compose.registerComposeViewHandler()`](#registercomposeviewhandlerhandler) method which calls you back with every existing [`composeview`](composeview) and all future [`ComposeView`](#composeview)s. From there a typical application will modify the [`ComposeView`](composeview) as needed by adding buttons, adding content to the message, or accessing the recipient data.
  8 | 
  9 | 
 10 | ### Namespace methods
 11 | #### registerComposeViewHandler(handler)
 12 | Register a handler to be called for every existing ComposeView as well as for all future ComposeViews that may come into existence. This method is the preferred way to add your application to every compose area such as a new compose window or inline reply compose areas. Returns a `function` which removes the handler registration.
 13 | 
 14 | | Parameters | Type | Description |
 15 | | :--- | :--- | :--- |
 16 | | **handler** | `function(ComposeView)` | The function to be called |
 17 | 
 18 | 
 19 | 
 20 | ```javascript
 21 | InboxSDK.load(1, 'YOUR_APP_ID_HERE').then(function(sdk){
 22 |   sdk.Compose.registerComposeViewHandler(function(composeView){
 23 |     console.log("compose view exists!");
 24 |   });
 25 | });
 26 | ```
 27 | 
 28 | #### openNewComposeView()
 29 | Opens a new compose view. Any handlers you've registered for ComposeViews will be called as well. Returns a `Promise<ComposeView>` which will resolve with the new ComposeView once it has opened.
 30 | 
 31 | 
 32 | 
 33 | 
 34 | 
 35 | 
 36 | 
 37 | ---
 38 | ## ComposeView 
 39 | Object that represents an open compose window **or** reply widget. The fields can be easily read and modified, and certain elements can be attached to it. This includes buttons and sidebars.  
 40 | 
 41 | ### Methods
 42 | > [addButton](#addbuttonbuttondescriptor),
 43 | [addComposeNotice](#addcomposenoticecomposenoticedescriptor),
 44 | [addStatusBar](#addstatusbarstatusbardescriptor),
 45 | [attachFiles](#attachfilesfiles),
 46 | [attachInlineFiles](#attachinlinefilesfiles),
 47 | [close](#close),
 48 | [getBodyElement](#getbodyelement),
 49 | [getMetadataForm](#getmetadataform),
 50 | [getInitialMessageID](#getinitialmessageid),
 51 | [getThreadID](#getthreadid),
 52 | [getDraftID](#getdraftid),
 53 | [getCurrentDraftID](#getcurrentdraftid),
 54 | [getHTMLContent](#gethtmlcontent),
 55 | [getSelectedBodyHTML](#getselectedbodyhtml),
 56 | [getSelectedBodyText](#getselectedbodytext),
 57 | [getSubject](#getsubject),
 58 | [getTextContent](#gettextcontent),
 59 | [getToRecipients](#gettorecipients),
 60 | [getCcRecipients](#getccrecipients),
 61 | [getBccRecipients](#getbccrecipients),
 62 | [getFromContact](#getfromcontact),
 63 | [getFromContactChoices](#getfromcontactchoices),
 64 | [insertHTMLIntoBodyAtCursor](#inserthtmlintobodyatcursorhtml),
 65 | [insertTextIntoBodyAtCursor](#inserttextintobodyatcursortext),
 66 | [insertLinkChipIntoBodyAtCursor](#insertlinkchipintobodyatcursortext-url-iconurl),
 67 | [insertLinkIntoBodyAtCursor](#insertlinkintobodyatcursortext-url),
 68 | [isForward](#isforward),
 69 | [isFullscreen](#isfullscreen),
 70 | [isInlineReplyForm](#isinlinereplyform),
 71 | [isMinimized](#isminimized),
 72 | [isReply](#isreply),
 73 | [popOut](#popout),
 74 | [send](#sendsendoptions),
 75 | [setFullscreen](#setfullscreenminimized),
 76 | [setMinimized](#setminimizedminimized),
 77 | [setTitleBarColor](#settitlebarcolorcolor),
 78 | [setToRecipients](#settorecipientsemails),
 79 | [setCcRecipients](#setccrecipientsemails),
 80 | [setBccRecipients](#setbccrecipientsemails),
 81 | [setFromEmail](#setfromemailemail),
 82 | [setSubject](#setsubjecttext),
 83 | [setBodyHTML](#setbodyhtmlhtml),
 84 | [setBodyText](#setbodytexttext)
 85 | 
 86 | 
 87 | 
 88 | #### addButton(buttonDescriptor)
 89 | 
 90 | <img width="582" alt="readme-example" src="https://user-images.githubusercontent.com/577345/195166155-cb2b35aa-b998-4f21-ad08-5ec1ad851f10.png" />
 91 | 
 92 | Inserts a button into the compose bar. This method also accepts a stream of ComposeButtonDescriptors so that you can change the appearance of your button after you've added it.
 93 | 
 94 | | Parameters | Type | Description |
 95 | | :--- | :--- | :--- |
 96 | | **buttonDescriptor** | `ComposeButtonDescriptor or Stream(ComposeButtonDescriptor)` | The details of the button to add to the compose bar |
 97 | 
 98 | #### addComposeNotice(composeNoticeDescriptor)
 99 | Adds a notice bar above the compose area of an email. Returns a `ComposeNoticeView`
100 | 
101 | | Parameters | Type | Description |
102 | | :--- | :--- | :--- |
103 | | **composeNoticeDescriptor** | `ComposeNoticeDescriptor` | The details of the compose notice to add to the compose view |
104 | 
105 | #### addStatusBar(statusBarDescriptor)
106 | Adds a horizontal bar underneath the control section of the ComposeView. This is useful to add more complex UI interactions but should be used sparingly. Returns a `StatusBarView`
107 | 
108 | | Parameters | Type | Description |
109 | | :--- | :--- | :--- |
110 | | **statusBarDescriptor** | `StatusBarDescriptor` | The details of the status bar to add to the compose view |
111 | 
112 | #### attachFiles(files)
113 | Returns a `Promise<void>`
114 | Attaches a set of files into the compose view. The parameter must be an array of File objects, or Blob objects with their name properties set. This function's implementation is asynchronous, and the function returns a `Promise<void>` that resolves after the InboxSDK has handed the files to the page to be uploaded and the file has begun uploading.
115 | 
116 | | Parameters | Type | Description |
117 | | :--- | :--- | :--- |
118 | | **files** | `Array<Blob>` | The file blobs |
119 | 
120 | #### attachInlineFiles(files)
121 | Returns a `Promise<void>`
122 | Attaches a set of files into the compose view inline in the message if possible. This works with images. The parameter must be an array of File objects, or Blob objects with their name properties set. This function's implementation is asynchronous, and the function returns a `Promise` that resolves after the InboxSDK has handed the files to the page to be uploaded and the file has begun uploading.
123 | 
124 | | Parameters | Type | Description |
125 | | :--- | :--- | :--- |
126 | | **files** | `Array<Blob>` | The file blobs |
127 | 
128 | #### close()
129 | Closes the compose window.
130 | 
131 | #### getBodyElement()
132 | Returns the `HTMLElement` of the body of the compose view.
133 | 
134 | #### getMetadataForm()
135 | Returns a `HTMLElement` of the metadata form of the compose view. This is the form that holds the To, CC, BCC, elements.
136 | 
137 | #### getInitialMessageID()
138 | Returns a `string` with the initial message ID of the draft. If this is a new compose then the message ID will be null. If the user has opened an existing draft then this function returns the message ID of the draft when it was first opened. The use of the getDraftID() method is recommended over this method.
139 | 
140 | #### getThreadID()
141 | Returns a `string` of the thread ID of the draft. If the draft is not a reply, then this will be null.
142 | 
143 | #### getDraftID()
144 | Returns a `Promise<string>` for the compose view's draft ID. If this is called on an empty draft that doesn't have a draft ID assigned yet, then the promise won't resolve until the draft gets assigned an ID, or the promise may resolve to null if the draft remains empty and is closed before being assigned an ID.
145 | 
146 | #### getCurrentDraftID()
147 | Returns a `Promise<string>` for the compose view's draft ID. Acts the same as ComposeView.getDraftID(), except that if the ComposeView does not yet have a draft ID assigned, then the returned Promise resolves to null immediately instead of waiting.
148 | 
149 | #### getHTMLContent()
150 | Returns an html `string` of the contents of the body of the compose view.
151 | 
152 | #### getSelectedBodyHTML()
153 | Returns a HTML `string` containing any text and elements highlighted by the user inside the email body.
154 | 
155 | #### getSelectedBodyText()
156 | Returns a `string` containing any text highlighted by the user inside the email body.
157 | 
158 | #### getSubject()
159 | Returns a `string` containing the subject of the email.
160 | 
161 | #### getTextContent()
162 | Returns a `string` containing all the text of the email body.
163 | 
164 | #### getToRecipients()
165 | Returns an `Array<Contact>` containing the name and email address of all recipients on the TO line.
166 | 
167 | #### getCcRecipients()
168 | Returns an `Array<Contact>` containing the name and email address of all recipients on the CC line.
169 | 
170 | #### getBccRecipients()
171 | Returns an `Array<Contact>` containing the name and email address of all recipients on the BCC line.
172 | 
173 | #### getFromContact()
174 | Returns a `Contact` of the value selection in the "From" field. Gives information about the user even if the From field isn't visible.
175 | 
176 | #### getFromContactChoices()
177 | Returns an `Array<Contact>` of all the options available in the "From" field.
178 | 
179 | #### insertHTMLIntoBodyAtCursor(html)
180 | Places HTML inside the body of the message at the cursor or at the beginning of the message if the cursor is not in the body of the message. If anything inside the body is selected, it will be replaced. Returns the root `HTMLElement` of the inserted link.
181 | 
182 | | Parameters | Type | Description |
183 | | :--- | :--- | :--- |
184 | | **html** | `string` or `HTMLElement` | The HTML to insert. You can provide an HTML string or a DOM element |
185 | 
186 | #### insertTextIntoBodyAtCursor(text)
187 | Places text inside the body of the message at the cursor or at the beginning of the message if the cursor is not in the body of the message. If anything inside the body is selected, it will be replaced.
188 | 
189 | | Parameters | Type | Description |
190 | | :--- | :--- | :--- |
191 | | **text** | `string` | The text to insert |
192 | 
193 | #### insertLinkChipIntoBodyAtCursor(text, url, iconUrl)
194 | Places a link chip inside the body of the message at the cursor or at the beginning of the message if the cursor is not in the body of the message. If anything inside the body is selected, it will be replaced. A link chip is an enhanced link with an icon and a callout. These are typically used by Gmail when inserting a Google Drive link. Returns the `HTMLElement` of the inserted chip
195 | 
196 | | Parameters | Type | Description |
197 | | :--- | :--- | :--- |
198 | | **text** | `string` | The anchor text of the link to insert |
199 | | **url** | `string` | The URL of the link to insert |
200 | | **iconUrl** | `string` | The URL of the icon that will be shown in the chip |
201 | 
202 | 
203 | #### insertLinkIntoBodyAtCursor(text, url)
204 | Places a link inside the body of the message at the cursor or at the beginning of the message if the cursor is not in the body of the message. If anything inside the body is selected, it will be replaced. Returns the `HTMLElement` of the inserted link.
205 | 
206 | | Parameters | Type | Description |
207 | | :--- | :--- | :--- |
208 | | **text** | `string` | The anchor text of the link to insert |
209 | | **url** | `string` | The URL of the link to insert |
210 | 
211 | #### isForward()
212 | Returns a `boolean` whether the compose view is in "forward" mode. A compose view may be started in forward mode if it was opened by Gmail's Forward button, and a compose view's mode may be changed while it is active. Changes to this value will be reported by the "responseTypeChanged" event.
213 | 
214 | #### isFullscreen()
215 | Returns a `boolean` whether or not this compose view is in full-screen mode.
216 | 
217 | #### isInlineReplyForm()
218 | Returns a `boolean` whether or not this compose view is an inline reply. Inline replies are used by Gmail when responding to a message right underneath the original message. You typically will not need to use this.
219 | 
220 | #### isMinimized()
221 | Returns a `boolean` whether or not this compose view is minimized.
222 | 
223 | #### isReply()
224 | Returns a `boolean` whether or not this compose view is a reply. Replies can be inline or in a seperate pop out window. You typically will not need to use this.
225 | 
226 | #### popOut()
227 | If the compose is an inline reply form, this triggers it to be converted to a full compose view. Note that the current ComposeView object will emit its destroy event, and a new ComposeView object will be created. This function Returns a `Promise<ComposeView>`.
228 | 
229 | #### send(sendOptions)
230 | Simulates clicking the compose's send button.
231 | 
232 | | Parameters | Type | Description |
233 | | :--- | :--- | :--- |
234 | | **sendOptions** | `SendOptions` | An optional configuration object for the send |
235 | 
236 | #### setFullscreen(minimized)
237 | This allows the fullscreen state to be changed.
238 | 
239 | | Parameters | Type | Description |
240 | | :--- | :--- | :--- |
241 | | **minimized** | `boolean` | If true, the compose view will be made fullscreen |
242 | 
243 | #### setMinimized(minimized)
244 | This allows the minimize state to be changed.
245 | 
246 | | Parameters | Type | Description |
247 | | :--- | :--- | :--- |
248 | | **minimized** | `boolean` | If true, the compose view will be minimized |
249 | 
250 | #### setTitleBarColor(color)
251 | Sets the background color of the title bar for non-inline compose views. Will not work for inline compose views (you can check for this via `ComposeView.isInlineReplyForm())`. Returns a `function` which removes the custom title bar color when called.
252 | 
253 | | Parameters | Type | Description |
254 | | :--- | :--- | :--- |
255 | | **color** | `string` | A valid CSS color string (rgba, hex, hsla, etc.) |
256 | 
257 | #### setToRecipients(emails)
258 | Sets the "To" field of the draft, replacing the existing values.
259 | 
260 | | Parameters | Type | Description |
261 | | :--- | :--- | :--- |
262 | | **emails** | `Array<string>` | Array of email addresses to set |
263 | 
264 | #### setCcRecipients(emails)
265 | Sets the "CC" field of the draft, replacing the existing values.
266 | 
267 | | Parameters | Type | Description |
268 | | :--- | :--- | :--- |
269 | | **emails** | `Array<string>` | Array of email addresses to set |
270 | 
271 | #### setBccRecipients(emails)
272 | Sets the "BCC" field of the draft, replacing the existing values.
273 | 
274 | | Parameters | Type | Description |
275 | | :--- | :--- | :--- |
276 | | **emails** | `Array<string>` | Array of email addresses to set |
277 | 
278 | #### setFromEmail(email)
279 | Changes the email address picked in the from field. Throws an exception if the requested choice isn't available. No error is thrown if the From field is not visible if the user's own email address is chosen.
280 | 
281 | | Parameters | Type | Description |
282 | | :--- | :--- | :--- |
283 | | **email** | `string` | Address to set the from field to use |
284 | 
285 | #### setSubject(text)
286 | Replaces the entirety of the current subject of the compose and replaces the subject with the passed in text
287 | 
288 | | Parameters | Type | Description |
289 | | :--- | :--- | :--- |
290 | | **text** | `string` | text to use for the subject |
291 | 
292 | #### setBodyHTML(html)
293 | Replaces the entirety of the compose's email body with the html value passed in.
294 | 
295 | | Parameters | Type | Description |
296 | | :--- | :--- | :--- |
297 | | **html** | `string` |html to use for the body |
298 | 
299 | #### setBodyText(text)
300 | Replaces the entirety of the compose's email body with the text value passed in.
301 | 
302 | | Parameters | Type | Description |
303 | | :--- | :--- | :--- |
304 | | **text** | `string` | text to use for the body |
305 | 
306 | 
307 | 
308 | 
309 | 
310 | 
311 | 
312 | 
313 | 
314 | 
315 | 
316 | 
317 | ### Events
318 | 
319 | #### destroy
320 | Fires when the compose view is closed. This can be triggered by the `close()` method, the user clicking the close or discard buttons, the message being sent, etc.
321 | 
322 | | Event properties | Type | Description |
323 | | :--- | :--- | :--- |
324 | | **messageID** | `string` | If the composeView was closed without being sent and the draft was saved, then this property will have the draft's message ID after it saved. Otherwise it will be null. This property is only present in Gmail |
325 | | **closedByInboxSDK** | `boolean` | Whether or not the ComposeView was closed by an extension calling ComposeView.close(), including other extensions besides your own. False if the ComposeView was closed due to a user action like clicking the discard/close buttons or hitting escape |
326 | 
327 | #### discard
328 | Fires when the compose view is discarded (deleted). `discard` event handlers will always be called before `destroy` handlers.
329 | 
330 | #### fullscreenChanged
331 | Fires when the From value is changed.
332 | 
333 | | Event properties | Type | Description |
334 | | :--- | :--- | :--- |
335 | | **fullscreen** | `boolean` | tells whether the compose is now fullscreen |
336 | 
337 | #### presending
338 | Fires when the user presses send. During this phase (between the presending and sending events) you can modify the `ComposeView` before the message actually starts sending. Note that multiple applications may modify the message. This event is the only one which allows you to modify or cancel the sent message. This event may be emitted multiple times for one message.
339 | 
340 | | Event properties | Type | Description |
341 | | :--- | :--- | :--- |
342 | | **cancel** | `function` | a function you can call to cancel the sending of this message. This will prevent the message from being sent. |
343 | 
344 | #### sendCanceled
345 | Fires after an extension cancels the send during presending (see the `presending` event). Because multiple extensions may choose to cancel the send, your extension may receive a `sendCanceled` event even if it did not initiate the cancellation. This event may be emitted multiple times for one message.
346 | 
347 | #### sending
348 | Fires when an AJAX request to Gmail has been initiated but the response has not yet been received. Any modifications you make to the ComposeView at this point will not have an effect as the AJAX request has already been sent. You'd typically use this event to record stats about what messages are being sent.
349 | 
350 | #### sent
351 | Fires when the Gmail server has confirmed receiving the message. An event object containing properties about the sent message will be passed to the event listeners.
352 | 
353 | | Event methods | Type | Description |
354 | | :--- | :--- | :--- |
355 | | **getThreadID()** | `Promise<string>` | retrieves the thread ID of the message that was just sent |
356 | | **getMessageID()** | `Promise<string>` | retrieves the message ID of the message that was just sent |
357 | 
358 | #### bodyChanged
359 | Fires whenever the message body's contents change.
360 | 
361 | #### fromContactChanged
362 | Fires when the From value is changed.
363 | 
364 | | Event properties | Type | Description |
365 | | :--- | :--- | :--- |
366 | | **contact** | `Contact` | the contact that was added to the "To" recipients |
367 | 
368 | #### recipientsChanged
369 | Fires when any of the To/Cc/Bcc fields are changed.
370 | 
371 | | Event properties | Type | Description |
372 | | :--- | :--- | :--- |
373 | | **to.added** | `Array<Contact>` | a list of contacts that were added to the "To" recipients |
374 | | **to.removed** | `Array<Contact>` | a list of contacts that were removed from the "To" recipients |
375 | | **cc.added** | `Array<Contact>` | a list of contacts that were added to the "CC" recipients |
376 | | **cc.removed** | `Array<Contact>` | a list of contacts that were removed from the "CC" recipients |
377 | | **bcc.added** | `Array<Contact>` | a list of contacts that were added to the "BCC" recipients |
378 | | **bcc.removed** | `Array<Contact>` | a list of contacts that were removed from the "BCC" recipients |
379 | 
380 | #### toContactAdded
381 | Fires when a to contact is added.
382 | 
383 | | Event properties | Type | Description |
384 | | :--- | :--- | :--- |
385 | | **contact** | `Contact` | the contact that was added to the "To" recipients |
386 | 
387 | #### toContactRemoved
388 | Fires when a to contact is removed.
389 | 
390 | | Event properties | Type | Description |
391 | | :--- | :--- | :--- |
392 | | **contact** | `Contact` | the contact that was removed from the "To" recipients |
393 | 
394 | #### ccContactAdded
395 | Fires when a CC contact is added.
396 | 
397 | | Event properties | Type | Description |
398 | | :--- | :--- | :--- |
399 | | **contact** | `Contact` | the contact that was added to the "CC" recipients |
400 | 
401 | #### ccContactRemoved
402 | Fires when a CC contact is removed.
403 | 
404 | | Event properties | Type | Description |
405 | | :--- | :--- | :--- |
406 | | **contact** | `Contact` | the contact that was removed from the "CC" recipients |
407 | 
408 | #### bccContactAdded
409 | Fires when BCC to contact is added.
410 | 
411 | | Event properties | Type | Description |
412 | | :--- | :--- | :--- |
413 | | **contact** | `Contact` | the contact that was added to the "BCC" recipients |
414 | 
415 | #### bccContactRemoved
416 | 
417 | Fires when a BCC contact is removed.
418 | 
419 | | Event properties | Type | Description |
420 | | :--- | :--- | :--- |
421 | | **contact** | `Contact` | the contact that was removed from the "BCC" recipients |
422 | 
423 | #### minimized
424 | Fires when the compose view is minimized
425 | 
426 | #### restored
427 | Fires when the compose view is restored
428 | 
429 | #### responseTypeChanged
430 | Fires when the compose view's response type is changed.
431 | 
432 | | Event properties | Type | Description |
433 | | :--- | :--- | :--- |
434 | | **isForward** | `boolean` |  |## **ComposeView** properties
435 | 
436 | 
437 | 
438 | 
439 | 
440 | 
441 | 
442 | ### Properties
443 | | Property | Type | Description |
444 | | :--- | :--- | :--- |
445 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed |
446 | 
447 | 
448 | 
449 | 
450 | 
451 | 
452 | ---
453 | ## ComposeButtonDescriptor 
454 | This type is passed into the ComposeView.addButton() method as a way to configure the button shown.
455 | 
456 | | Property | Type | Description | Required? | Default |
457 | | :--- | :--- | :--- | :--- | :--- |
458 | | **title** | `string` | Text to show when the user hovers the mouse over the button. | Yes |
459 | | **onClick** | `function(event)` | This is called when the button is clicked, and gets passed an event object. The event object will have a composeView object and optionally a dropdown property if the button had a dropdown. |  Yes |
460 | | **iconUrl** | `string` | URL for the icon to show on the button. Should be a local extension file URL or a HTTPS URL. | No | `null` |
461 | | **iconClass** | `string` | An optional class to apply to the icon. | No | `null` |
462 | | **hasDropdown** | `boolean` | If true, the button will open a dropdown menu above it, and the event object will have a dropdown property of type DropdownView that allows the dropdown to be customized when opened. | No | `false`
463 | | **type** | `string` | There are currently two supported types of compose buttons, one which results in the message being sent and another which just modifies the current message but does not send it. The button is placed according to its type. The permissable values for type are SEND_ACTION and MODIFIER. Only MODIFIER is supported in Inbox currently. | No | `MODIFIER` |
464 | | **orderHint** | `number` | If multiple buttons are placed next to each other, then they will be ordered by this value. | No | `0` |
465 | | **enabled** | `boolean` | If false, the button will be disabled and will not emit any events. | No | `true` |
466 | | **noOverflow** | `boolean` | If true, the button will not move to the responsive overflow menu. | No | `false` |
467 | 
468 | 
469 | 
470 | 
471 | 
472 | 
473 | ---
474 | ## SendOptions
475 | This type is optionally passed into the ComposeView.send() method as a way to configure the send.
476 | 
477 | | Property | Type | Description | Required? | Default |
478 | | :--- | :--- | :--- | :--- | :--- |
479 | | **sendAndArchive** | `boolean` | Whether or not the message should be sent using Gmail's 'send and archive' feature when available. If you set this to true but the ComposeView does not have a Send and Archive button available, ComposeView.send() will fall back to the normal Send button. | No | `false` |
480 | 
481 | 
482 | 
483 | 
484 | 
485 | 
486 | 
487 | 
488 | 
489 | 
490 | ---
491 | ## ComposeNoticeView 
492 | Object that represents an open compose window **or** reply widget. The fields can be easily read and modified, and certain elements can be attached to it. This includes buttons and sidebars.  
493 | 
494 | 
495 | ### Methods
496 | 
497 | #### destroy()
498 | Removes the element and executes any necessary clean-up.
499 | 
500 | 
501 | ### Events
502 | 
503 | #### destroy
504 | Fires when the view is destroyed. This can be triggered by the app calling the destroy() method or by the InboxSDK internally calling the destroy() method.
505 | 
506 | 
507 | ### Properties
508 | | Property | Type | Description |
509 | | :--- | :--- | :--- |
510 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed |
511 | | **el** | `HTMLElement` | An element that you should modify and fill with your app's content. |
512 | 
513 | 
514 | 
515 | 
516 | 
517 | 
518 | 
519 | 
520 | ---
521 | ## ComposeNoticeDescriptor
522 | This type is passed into the `ComposeView.addComposeNotice()` method as a way to configure the compose notice shown.
523 | 
524 | | Property | Type | Description | Required? | Default |
525 | | :--- | :--- | :--- | :--- | :--- |
526 | | **orderHint** | `Number` | The order in which to show the compose notice. | No | `0` |
527 | 
528 | 
529 | 
530 | 
531 | 
532 | 
533 | 
534 | 
535 | 
536 | ---
537 | ## StatusBarView 
538 | Object that represents an open compose window **or** reply widget. The fields can be easily read and modified, and certain elements can be attached to it. This includes buttons and sidebars.  
539 | 
540 | 
541 | ### Methods
542 | 
543 | #### destroy()
544 | Removes the element and executes any necessary clean-up.
545 | 
546 | #### setHeight(height)
547 | Replaces the entirety of the compose's email body with the text value passed in.
548 | 
549 | | Parameters | Type | Description |
550 | | :--- | :--- | :--- |
551 | | **height** | `number` | Desired height for status bar in pixels. |
552 | 
553 | 
554 | 
555 | ### Events
556 | 
557 | #### destroy
558 | Fires when the view is destroyed. This can be triggered by the app calling the destroy() method or by the InboxSDK internally calling the destroy() method.
559 | 
560 | 
561 | ### Properties
562 | | Property | Type | Description |
563 | | :--- | :--- | :--- |
564 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed |
565 | | **el** | `HTMLElement` | An element that you should modify and fill with your app's content. |
566 | 
567 | 
568 | 
569 | 
570 | ---
571 | ## StatusBarDescriptor
572 | This type is passed into the `ComposeView.addStatusBar()` method as a way to configure the status bar shown.
573 | 
574 | | Property | Type | Description | Required? | Default |
575 | | :--- | :--- | :--- | :--- | :--- |
576 | | **height** | `Number` | The vertical height of the status bar in pixels. | No | `40` |
577 | | **orderHint** | `Number` | The order in which to show the status bars. | No | `0` |


--------------------------------------------------------------------------------
/docs/conversations.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Conversations
  3 | ---
  4 | This namespace allows you to interact with Gmail conversations (typically called threads). The fundamental views you interact with are ThreadView and MessageView and there is a 1 to many relationship between them. The functions in Conversations.* allow you to obtain these views which you can then further manipulate.
  5 | 
  6 | It's important to note that ThreadViews and MessageViews can be navigated to in various ways by the user depending on their email client and their settings (i.e. preview pane on in Gmail). This is abstracted completely away from you so you can just focus on manipulating the views once they are given to you.
  7 | 
  8 | Finally, when a ThreadView loads, you're not guranteed that every MessageView in it is also loaded. When you call ThreadView.getMessageViews it will return all MessageViews, but its important to remember that the MessageViews might not be loaded. MessageViews can be in several states. Consult the MessageView documentation to learn about what functionality is available in each state.
  9 | 
 10 | ### Namespace methods
 11 | #### registerThreadViewHandler(handler)
 12 | Registers your handler to be called when the user navigates to a ThreadView. Your handler is given a ThreadView which you can then further manipulate.
 13 | 
 14 | | Parameters | Type | Description |
 15 | | :--- | :--- | :--- |
 16 | | **handler** | `function(ThreadView)` | The handler to call when a ThreadView is displayed. This handler is passed one parameter, a ThreadView. |
 17 | _Returns_ a `function` which removes the handler registration.
 18 | 
 19 | 
 20 | #### registerMessageViewHandler(handler)
 21 | Registers your handler to be called when a MessageView is displayed. Your handler is given a MessageView which you can then further manipulate.
 22 | 
 23 | IMPORTANT: Your handler will only be called for MessageViews that are "loaded". See docs for MessageView to understand the distinction.
 24 | 
 25 | | Parameters | Type | Description |
 26 | | :--- | :--- | :--- |
 27 | | **handler** | `function(MessageView)` | The handler to call when a MessageView is displayed. |
 28 | _Returns_ a `function` which removes the handler registration.
 29 | 
 30 | 
 31 | #### registerMessageViewHandlerAll(handler)
 32 | Registers your handler to be called when the user navigates to a MessageView. Your handler is given a MessageView which you can then further manipulate.
 33 | 
 34 | IMPORTANT: Your handler will be called for MessageViews that are both "loaded" and "unloaded". See docs for MessageView to understand the distinction.
 35 | 
 36 | | Parameters | Type | Description |
 37 | | :--- | :--- | :--- |
 38 | | **handler** | `function(MessageView)` | The handler to call when a message view is displayed. |
 39 | _Returns_ a `function` which removes the handler registration.
 40 | 
 41 | 
 42 | #### registerFileAttachmentCardViewHandler(handler)
 43 | Registers your handler to be called when an AttachmentCardView is visible.
 44 | 
 45 | | Parameters | Type | Description |
 46 | | :--- | :--- | :--- |
 47 | | **handler** | `function(ComposeView)` | The handler to call when am attachment card view is displayed. |
 48 | _Returns_ a `function` which removes the handler registration.
 49 | 
 50 | ---
 51 | ## ThreadView
 52 | Object that represents a visible thread view that the user has navigated to
 53 | 
 54 | ### Methods
 55 | #### addNoticeBar()
 56 | Inserts a "notice bar" element below the thread subject. The element defaults to having a yellow background color and specific padding to make it look like a warning on the thread, but your code may override these styles of the element.
 57 | 
 58 | _Returns_ a `SimpleElementView`
 59 | 
 60 | #### addLabel()
 61 | Inserts a "label" element alongside the thread subject and all native labels. The element has no default styling. Adding your own is recommended.
 62 | 
 63 | _Returns_ a `SimpleElementView`
 64 | 
 65 | #### addSidebarContentPanel(contentPanelDescriptor)
 66 | Inserts a content panel into the sidebar of a thread view. A content panel simply displays your content to the user, typically in the form of a sidebar. ThreadViews can have multiple content panels added to them and the SDK will handle creating a tabbed interface if needed.
 67 | 
 68 | | Parameters | Type | Description |
 69 | | :--- | :--- | :--- |
 70 | | **contentPanelDescriptor** | `ContentPanelDescriptor` | The details of the content panel to add to the thread's sidebar. |
 71 | 
 72 | _Returns_ a `ContentPanelView`
 73 | 
 74 | #### getMessageViews()
 75 | _Returns_ an `Array<MessageView>` of all the loaded MessageView objects currently in the thread. See MessageView for more information on what "loaded" means. Note that more messages may load into the thread later! If it's important to get future messages, use Conversations.registerMessageViewHandler instead.
 76 | 
 77 | #### getMessageViewsAll()
 78 | _Returns_ an `Array<MessageView>` of all the MessageView objects in the thread regardless of their load state. See MessageView for more information on what "loaded" means.
 79 | 
 80 | #### getSubject()
 81 | _Returns_ a `string` of the subject of this thread.
 82 | 
 83 | #### getThreadIDAsync()
 84 | _Returns_ a `Promise<string>` of the Gmail Thread ID of the thread
 85 | 
 86 | 
 87 | 
 88 | ### Events
 89 | #### contactHover
 90 | Fires when the user hovers over a contact on any message in the thread ContactHoverEvent.
 91 | 
 92 | | Event properties | Type | Description |
 93 | | :--- | :--- | :--- |
 94 | | **contact** | `Contact` | the contact that was hovered over |
 95 | | **contactType** | `string` | whether the hovered contact was a 'sender' or 'recipient' |
 96 | | **messageView** | `MessageView` | the message view that the contact was a part of |
 97 | | **threadView** | `ThreadView` | the thread view that the contact was a part of |
 98 | 
 99 | 
100 | #### destroy
101 | Fires when the thread view is no longer visible (i.e. the user navigates away from the thread).
102 | 
103 | 
104 | 
105 | ### Properties
106 | | Property | Type | Description | Required? | Default |
107 | | :--- | :--- | :--- | :--- | :--- |
108 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
109 | 
110 | 
111 | 
112 | 
113 | 
114 | 
115 | 
116 | 
117 | ---
118 | ## MessageView
119 | Object that represents a visible message in the UI. There are properties to access data about the message itself as well as change the state of the UI. MessageViews have a view state as well as a loaded state. These 2 properties are orthogonal to each other.
120 | 
121 | A messages' view state can be one of MessageViewViewStates.EXPANDED, MessageViewViewStates.COLLAPSED or MessageViewViewStates.HIDDEN. Gmail visually display messages in a thread in different ways depending on what they are trying to show a user. These values are described in the enum MessageViewViewStates.
122 | The load state of a message determines whether all of the data pertaining to a message has been loaded in the UI. In some case, not all the information (such as recipients or the body) may be loaded, typically when the the view state is COLLAPSED or HIDDEN. You should not depend on any relationship between the view state and load state. Instead, use the provided MessageView.getViewState() and MessageView.isLoaded() methods.
123 | 
124 | ### Methods
125 | #### addAttachmentCardView(cardOptions)
126 | Adds an AttachmentCardView to the message. Each message has an area where attachments of that message are shown as a set of preview cards. These may be for file attachments or even inline YouTube links. This method allows you to add your own.
127 | 
128 | | Parameters | Type | Description |
129 | | :--- | :--- | :--- |
130 | | **cardOptions** | `AttachmentCardOptions` or `AttachmentCardNoPreviewOptions` | The configuration of the AttachmentCardView to create. |
131 | 
132 | _Returns_ an `AttachmentCardView`
133 | 
134 | #### addAttachmentsToolbarButton(buttonOptions)
135 | Adds a button to the download all area of the attachments tray.
136 | 
137 | | Parameters | Type | Description |
138 | | :--- | :--- | :--- |
139 | | **buttonOptions** | `AttachmentsToolbarButtonDescriptor` | The configuration of the button to create. |
140 | 
141 | #### addToolbarButton(options)
142 | Adds a button to the message.
143 | 
144 | | Parameters | Type | Description |
145 | | :--- | :--- | :--- |
146 | | **options** | `MessageViewToolbarButtonDescriptor` | The configuration of the button to create. |
147 | 
148 | #### getBodyElement()
149 | Returns the body element of the message as displayed to the user. This element includes any qouted areas. Use this method when you want to decorate the body of the message, i.e. if you wanted to linkify all dates you found in a message for scheduling purposes
150 | 
151 | _Returns_ a `HTMLElement`
152 | 
153 | #### getMessageIDAsync()
154 | Gets the ID of the message and returns it as a Promise. The promise will reject with an error if this is called on a message that isn't loaded yet.
155 | 
156 | _Returns_ a `Promise<string>`
157 | 
158 | #### getFileAttachmentCardViews()
159 | Returns all the attachment card views of type FILE currently visible for this message.
160 | 
161 | _Returns_ an `Array<AttachmentCardView>`
162 | 
163 | #### isElementInQuotedArea()
164 | Returns whether the element you provided or not is contained within the qouted area of the MessageView. This is useful when you want to parse through the contents of the HTMLElement returned by MessageView.getBodyElement() and test whether one if its children is in the qouted area (because you'll usually ignore those elements).
165 | 
166 | _Returns_ a `boolean`
167 | 
168 | #### isLoaded()
169 | Returns whether this message has been loaded yet. If the message has not been loaded, some of the data related methods on this object may return empty results. The message may be loaded once the user clicks on the message stub.
170 | 
171 | _Returns_ a `boolean`
172 | 
173 | #### getLinksInBody()
174 | Returns an array of MessageViewLinkDescriptors representing all the links in the message and their associated metadata. This is useful when you want to parse links in a message and take some action on them, this takes care of detecting whether the link is in the qouted area or not and parsing out the url/anchor text of the link. i.e. if you wanted to linkify all dates you found in a message for scheduling purposes
175 | 
176 | _Returns_ an `Array<MessageViewLinkDescriptor>`
177 | 
178 | #### getSender()
179 | Get the contact of the sender of this message.
180 | 
181 | _Returns_ a `Contact`
182 | 
183 | #### getRecipientEmailAddresses()
184 | Get all the recipient email addresses of this message (to, cc, bcc). This only reads the values directly present in the page, which may be truncated if there are many items. The asynchronous method getRecipientsFull() should be used instead if the full list is desired.
185 | 
186 | _Returns_ an `Array<string>`
187 | 
188 | #### getRecipientsFull()
189 | Get all the recipients of this message (to, cc, bcc). Returns a promise for an array of contact objects.
190 | 
191 | _Returns_ a `Array<Contact>`
192 | 
193 | #### getThreadView()
194 | Get the ThreadView that this MessageView is in.
195 | 
196 | _Returns_ a `ThreadView`
197 | 
198 | #### getDateString()
199 | Gets Gmail's representation of the timestamp of the message. Note: this returns a string representation because timezone information is not available, the accuracy is limited to minutes, and it is formatted to the user's language.
200 | 
201 | _Returns_ a `string`
202 | 
203 | #### addAttachmentIcon(iconDescriptor)
204 | Adds an attachment message's top line near the date. It returns an instance of AttachmentIcon which can subsribe to events 'tooltipShown' and 'tooltipHidden'.
205 | 
206 | | Parameters | Type | Description |
207 | | :--- | :--- | :--- |
208 | | **iconDescriptor** | `MessageAttachmentIconDescriptor` or `Stream(MessageAttachmentIconDescriptor)` | The options for the icon to add. |
209 | 
210 | _Returns_ an `AttachmentIcon`
211 | 
212 | #### getViewState()
213 | Returns the view state of this Message view. The possible view states are MessageViewViewStates.HIDDEN (no information visible), MessageViewViewStates.COLLAPSED (partial information visible) or MessageViewViewStates.EXPANDED
214 | 
215 | _Returns_ a `MessageViewViewStates`
216 | 
217 | 
218 | 
219 | ### Events
220 | #### viewStateChange
221 | Fires when message viewState is changed
222 | 
223 | | Event properties | Type | Description |
224 | | :--- | :--- | :--- |
225 | | **newViewState** | `MessageViewViewStates` | the new state the message view is in |
226 | | **oldViewState** | `MessageViewViewStates` | the old state the message view was in |
227 | | **messageView** | `MessageView` | the message view whose state changed |
228 | 
229 | 
230 | #### contactHover
231 | Fires when the user hovers over a contact.
232 | 
233 | | Event properties | Type | Description |
234 | | :--- | :--- | :--- |
235 | | **contact** | `Contact` | the contact that was hovered over |
236 | | **contactType** | `string` | whether the hovered contact was a 'sender' or 'recipient' |
237 | | **messageView** | `MessageView` | the message view that the contact was a part of |
238 | | **threadView** | `ThreadView` | the thread view that the contact was a part of |
239 | 
240 | 
241 | #### load
242 | Fires when the data for a message is loaded. This can happen when the message view is first presented or later when the user chooses to expand its view state.
243 | 
244 | 
245 | #### destroy
246 | Fires when the view card is destroyed
247 | 
248 | 
249 | 
250 | ### Properties
251 | | Property | Type | Description | Required? | Default |
252 | | :--- | :--- | :--- | :--- | :--- |
253 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
254 | 
255 | 
256 | 
257 | 
258 | 
259 | ---
260 | ## ContentPanelView
261 | A view representing a panel of your apps content. This is the object that is returned when you add a sidebar content panel to a thread view or similar.
262 | 
263 | ### Methods
264 | #### isActive()
265 | _Returns_ a `boolean` whether the content panel is currently visible.
266 | 
267 | #### open()
268 | Makes the content panel visible, opening the sidebar if necessary.
269 | 
270 | #### remove()
271 | Removes the content panel from its host.
272 | 
273 | 
274 | ### Events
275 | #### activate
276 | Fires when the content panel becomes visisble. This can happen the first time the Panel is shown or subsequent times if the panel is presented in a tabbed interface and the ContentPanels tab is selected.
277 | 
278 | #### deactivate
279 | Fires when the content panel is hidden. Typically this occurs when the user switches to another ContentPanel.
280 | 
281 | #### destroy
282 | Fires when the content panel view is no longer valid (i.e. the user navigates away from the thread with the sidebar).
283 | 
284 | 
285 | ### Properties
286 | | Property | Type | Description | Required? | Default |
287 | | :--- | :--- | :--- | :--- | :--- |
288 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
289 | 
290 | 
291 | 
292 | 
293 | 
294 | 
295 | ---
296 | ## AttachmentCardView
297 | Object that represents an Attachment Card visible in a message containing attachments.
298 | 
299 | ### Methods
300 | #### getAttachmentType()
301 | Returns the type of the attachment card. Values returned include FILE (regular file attachments), DRIVE (Drive attachments that are present as links in the message), CUSTOM (attachment cards added by this or other apps built on the SDK), and UNKNOWN (for other types of attachment cards rendered by Gmail that aren't specifically supported currently such as YouTube and Yelp links).
302 | 
303 | _Returns_ a `string`
304 | 
305 | #### addButton(buttonDescriptor)
306 | Adds a button to this attachment card.
307 | 
308 | | Parameters | Type | Description |
309 | | :--- | :--- | :--- |
310 | | **buttonDescriptor** | `CustomButtonDescriptor` | The description of the button. |
311 | 
312 | #### getTitle()
313 | Reads the title on the attachment card. Typically this will be a filename.
314 | 
315 | _Returns_ a `string`
316 | 
317 | #### getDownloadURL()
318 | Get the URL for the attachment card's download link as a promise for a string. For FILE attachment cards, the URL will be a short-lived URL that can be accessed without cookies. For CUSTOM attachment cards, the URL will be the downloadUrl property of the card's download button if it has one, otherwise null. Other attachment card types may not have a download URL, and the promise may resolve to null.
319 | 
320 | _Returns_ a `Promise<string>`
321 | 
322 | #### getMessageView()
323 | Get the MessageView that this attachment card belongs to if it belongs to one. AttachmentCardViews in Gmail always belong to a MessageView.
324 | 
325 | _Returns_ `null` or a `MessageView`
326 | 
327 | ### Events
328 | #### destroy
329 | Fires when the view card is destroyed.
330 | 
331 | ### Properties
332 | | Property | Type | Description | Required? | Default |
333 | | :--- | :--- | :--- | :--- | :--- |
334 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
335 | 
336 | 
337 | 
338 | 
339 | 
340 | 
341 | ---
342 | ## AttachmentCardClickEvent
343 | This object is given to the onClick function defined in a CustomButtonDescriptor added to an AttachmentCardView.
344 | #### getDownloadURL()
345 | Get the URL for the attachment card's download link as a promise for a string. For FILE attachment cards, the URL will be a short-lived URL that can be accessed without cookies. For CUSTOM attachment cards, the URL will be the downloadUrl property of the card's download button if it has one, otherwise null. Other attachment card types may not have a download URL, and the promise may resolve to null.
346 | 
347 | _Returns_ a `Promise<string>`
348 | 
349 | 
350 | 
351 | 
352 | 
353 | 
354 | ---
355 | ## AttachmentIcon
356 | Object that represents an AttachmentIcon returned by addAttachmentIcon in message view.
357 | #### tooltipShown
358 | Fires when mouse enters message attachment icon to show custom tooltip html element.
359 | 
360 | #### tooltipHidden
361 | Fires when mouse leaves message attachment icon to hide custom tooltip html element.
362 | 
363 | 
364 | 
365 | 
366 | 
367 | 
368 | ---
369 | ## AttachmentCardOptions
370 | This type is accepted by the MessageView.addAttachmentCardView() method to insert an AttachmentCardView for a message. An attachment card offers a way to display a rich preview of any 'attachment' to a message. Note that 'attachments' is referenced in the generic sense and need not be a downloadable file specifically. One example would be to show you YouTube attachment cards for any YouTube links present in an email.
371 | 
372 | 
373 | | Property | Type | Description | Required? | Default |
374 | | :--- | :--- | :--- | :--- | :--- |
375 | | **title** | `string` | The title of the attachment card. Typically a filename is set here. | Yes |  |
376 | | **description** | `string` | A description of the attachment card displayed subtly. | Yes |  |
377 | | **previewUrl** | `string` | The url of an "open" or "preview" action for this attachment. The attachment cards primary action (clicking on the card) takes the user in a new window to the URL specified here. This is also the URL used if the user right clicks and copies the link address. | Yes |  |
378 | | **previewThumbnailUrl** | `string` | A URL to an image representing the thumbnail preview of the attachment card | Yes |  |
379 | | **failoverPreviewIconUrl** | `string` | URL to an icon to fallback on in case the previewThumbnailUrl fails to load. | Yes |  |
380 | | **previewOnClick** | `function(event)` | A callback to call when the user clicks on the preview area. Note that if the previewUrl is also set, the preview will open in a new window in addition to this callback being called. The PreviewEvent has one property - attachmentCardView. It also has a preventDefault() function. Calling this function prevents the preview from opening in a new window. | Yes |  |
381 | | **fileIconImageUrl** | `string` | The url of the icon of the attachment. | Yes |  |
382 | | **buttons** | `Array<(DownloadButtonDescriptor|CustomButtonDescriptor)>` | An array of buttons to support functionality in addition to the preview functionality | Yes |  |
383 | | **foldColor** | `string` | The color of the attachment card fold and an accompying accent color. | No | `#BEBEBE` |
384 | | **mimeType** | `string` | The mime type of the attachment if it has one. This is used to render image mime types slightly differently to be consistent with Gmail. Specifically, the previewThumbnailUrl images are rendered full bleed to show as much of the image as possible. As such the hover UI looks slightly different. | No | `null` |
385 | 
386 | 
387 | 
388 | 
389 | 
390 | 
391 | 
392 | ---
393 | ## AttachmentCardNoPreviewOptions
394 | This type is accepted by the MessageView.addAttachmentCardView() method to insert an AttachmentCardView for a message. An attachment card offers a way to display a rich preview of any 'attachment' to a message. Note that 'attachments' is referenced in the generic sense and need not be a downloadable file specifically. One example would be to show you YouTube attachment cards for any YouTube links present in an email.
395 | 
396 | These options differ from AttachmentCardOptions in that there is no previewThumbnailUrl, instead you use a iconThumbnailUrl to show a generic icon. These are rendered and positioned slightly differently than preview images.
397 | 
398 | | Property | Type | Description | Required? | Default |
399 | | :--- | :--- | :--- | :--- | :--- |
400 | | **title** | `string` | The title of the attachment card. Typically a filename is set here. | Yes |  |
401 | | **description** | `string` | A description of the attachment card displayed subtly. | Yes |  |
402 | | **previewUrl** | `string` | The url of an "open" or "preview" action for this attachment. The attachment cards primary action (clicking on the card) takes the user in a new window to the URL specified here. This is also the URL used if the user right clicks and copies the link address. | Yes |  |
403 | | **iconThumbnailUrl** | `string` | A URL to an icon to show in the thumbnail area of the attachment card | Yes |  |
404 | | **previewOnClick** | `function(event)` | A callback to call when the user clicks on the preview area. Note that if the previewUrl is also set, the preview will open in a new window in addition to this callback being called. The PreviewEvent has one property - attachmentCardView. It also has a preventDefault() function. Calling this function prevents the preview from opening in a new window. | Yes |  |
405 | | **fileIconImageUrl** | `string` | The url of the icon of the attachment. | Yes |  |
406 | | **buttons** | `Array<(DownloadButtonDescriptor|CustomButtonDescriptor)>` | An array of buttons to support functionality in addition to the preview functionality. | Yes |  |
407 | | **foldColor** | `string` | The color of the attachment card fold and an accompying accent color. | No | `#BEBEBE` |
408 | 
409 | 
410 | 
411 | 
412 | 
413 | 
414 | 
415 | ---
416 | ## ContentPanelDescriptor
417 | This type is passed into the ThreadView.addSidebarContentPanel() method as a way to configure the content panel shown. ContentPanels are typically shown in a sidebar and when multiple are shown they are displayed in a multi tab interface.
418 | 
419 | | Property | Type | Description | Required? | Default |
420 | | :--- | :--- | :--- | :--- | :--- |
421 | | **el** | `HTMLElement` | The element to display in the content panel. | Yes |  |
422 | | **title** | `string` | The text to show in the tab. | Yes |  |
423 | | **iconUrl** | `string` | URL for the icon to show in the tab. Should be a local extension file URL or a HTTPS url. | Yes |  |
424 | | **appName** | `string` | When a thread is open but the sidebar isn't, then buttons to open the sidebar will be shown next to the thread. Each button may be associated with multiple sidebars. The sidebars are grouped into buttons based on this appName property, their app's appName passed to `InboxSDK.load()`, or the title property. | No |  |
425 | | **appIconUrl** | `string` | Overrides the icon for the sidebar-opener button. | No |  |
426 | | **id** | `string` | A string can be passed to identify this panel so that user preferences specific to this panel may be saved. If this property is not present, then the title will be used as the id. | No |  |
427 | | **hideTitleBar** | `boolean` | Hide the title bar if this is the only sidebar panel attached to the thread. If multiple panels are added (including panels from other extensions) then the title bar will appear so that the user can adjust the panels with the title bar controls. | No | `false` |
428 | | **orderHint** | `number` | If multiple content panels for your app are added then they will be ordered by this value. | No | `0` |
429 | 
430 | 
431 | 
432 | 
433 | 
434 | 
435 | 
436 | ---
437 | ## DownloadButtonDescriptor
438 | 
439 | | Property | Type | Description | Required? | Default |
440 | | :--- | :--- | :--- | :--- | :--- |
441 | | **downloadUrl** | `string` | The url of the file to download when the user presses the download button. | Yes |  |
442 | | **downloadFilename** | `string` | If the URL is a data: or blob: URI, then this sets the filename for the file to be saved as. This works by setting the "download" attribute on an anchor element to the given value. | No | `null` |
443 | | **onClick** | `function(event)` | A callback that is called when the user presses the download button. Note, this is called in addition to file actually downloading which happens automatically. | Yes |  |
444 | | **openInNewTab** | `boolean` | Whether the download action should open in a new tab. It may be useful to open a new tab to perform the download if for example you want to sometimes redirect the user to a login or permission page. By default, the SDK will attempt to download the file in the same tab and not open a new one. This is typically a better user experience. | No | `false` |
445 | 
446 | 
447 | 
448 | 
449 | 
450 | 
451 | 
452 | ---
453 | ## CustomButtonDescriptor
454 | 
455 | | Property | Type | Description | Required? | Default |
456 | | :--- | :--- | :--- | :--- | :--- |
457 | | **iconUrl** | `string` | The icon to use. Use a white image with transparent background for consistency. | Yes |  |
458 | | **tooltip** | `string` | The tooltip to show when the user hovers over the button. | Yes |  |
459 | | **onClick** | `function(AttachmentCardClickEvent)` | A callback that is called when the user presses the button. | Yes |  |
460 | 
461 | 
462 | 
463 | 
464 | 
465 | 
466 | 
467 | ---
468 | ## AttachmentsToolbarButtonDescriptor
469 | 
470 | | Property | Type | Description | Required? | Default |
471 | | :--- | :--- | :--- | :--- | :--- |
472 | | **tooltip** | `string` | The tooltip of the button. | Yes |  |
473 | | **iconUrl** | `string` | The url of an icon image to use. A black icon with transparent background is preferred. | Yes |  |
474 | | **onClick** | `function(event)` | The callback when the button is clicked. The event object has a property event.attachmentCardViews which is an array of AttachmentCardViews. | Yes |  |
475 | 
476 | 
477 | 
478 | 
479 | 
480 | 
481 | 
482 | ---
483 | ## MessageViewLinkDescriptor
484 | 
485 | | Property | Type | Description | Required? | Default |
486 | | :--- | :--- | :--- | :--- | :--- |
487 | | **text** | `string` | The anchor text of the link. | Yes |  |
488 | | **html** | `string` | The html string of the link found. | Yes |  |
489 | | **element** | `HTMLElement` | The actual HTMLElement of the link found. | Yes |  |
490 | | **href** | `string` | The url of the link. | Yes |  |
491 | | **isInQuotedArea** | `boolean` | Whether the link was found in the qouted area of the message or not | Yes |  |
492 | 
493 | 
494 | 
495 | 
496 | 
497 | 
498 | 
499 | ---
500 | ## MessageAttachmentIconDescriptor
501 | This type is used to describe a button you add to a MessageView.
502 | 
503 | | Property | Type | Description | Required? | Default |
504 | | :--- | :--- | :--- | :--- | :--- |
505 | | **iconUrl** | `string` | URL for the icon to show on in the attachments column. Should be a local extension file URL or a HTTPS URL. | Yes |  |
506 | | **iconClass** | `string` | A CSS class to apply to the icon. | No | `MODIFIER` |
507 | | **iconHtml** | `string` | An optional Html for the icon to show. This property can not be used with iconUrl. | No | `null` |
508 | | **tooltip** | `string` or `HTMLElement` | The tooltip text or custom tooltip element to show when the user hovers over the icon. | Yes |  |
509 | | **onClick** | `function` | Function to call when the user clicks the icon. | No |  |
510 | 
511 | 
512 | 
513 | 
514 | 
515 | ---
516 | ## MessageViewToolbarButtonDescriptor
517 | The options to use to configure buttons added to the message.
518 | 
519 | | Property | Type | Description | Required? | Default |
520 | | :--- | :--- | :--- | :--- | :--- |
521 | | **section** | `MessageViewToolbarSectionNames` | The section of the message to place the button. | Yes |  |
522 | | **title** | `string` | Text to show on the menu item. | Yes |  |
523 | | **iconUrl** | `string` | URL for the icon to show on the menu item. Should be a local extension file URL or a HTTPS URL. The image will be displayed with a height and width of 16px. | Yes |  |
524 | | **iconClass** | `string` | An optional class to apply to the icon. | No |  |
525 | | **onClick** | `function` | This is called when the menu item is clicked. | Yes |  |
526 | | **orderHint** | `number` | Used to specify the order of added menu items. | Yes |  |
527 | 
528 | 
529 | 
530 | 
531 | 
532 | 
533 | ---
534 | ## Enums and Constants
535 | ### MessageViewViewStates
536 | The various UI states a MessageView can be in.
537 | 
538 | | Enum | Description |
539 | | :--- | :--- |
540 | | **HIDDEN** | In this state none of the message is visible except for the outline of its existence. |
541 | | **COLLAPSED** | In this state most of the body of the message is not visible and some recipients may not be showing. |
542 | | **EXPANDED** | In this state all of the message is visible including the body. |
543 | 
544 | ### MessageViewToolbarSectionNames
545 | The locations that a button can be added to on a MessageView.
546 | 
547 | | Enum | Description |
548 | | :--- | :--- |
549 | | **MORE** | The button will be added to the message's "More" dropdown menu. |
550 | 


--------------------------------------------------------------------------------
/docs/getting-started.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Getting Started
  3 | slug: /
  4 | ---
  5 | 
  6 | ## What is the InboxSDK?
  7 | The InboxSDK is a library for building browser extensions for Gmail. It provides APIs for browser extensions to interact with and extend the Gmail UI. The SDK is built so that multiple extensions can use it on a page at once without conflicting with each other.
  8 | 
  9 | The library is intended to facilitate the creation of extensions like our [Streak extension](https://www.streak.com). The library is sophisticated enough for the Streak extension itself to be built on, but the library does not provide facilities for other extensions to interact with user data specific to the Streak extension (pipelines, boxes, etc.). To integrate with Streak itself, see the [Streak API docs](https://www.streak.com/api).
 10 | 
 11 | :::info AppId Registration
 12 | Don't forget to register for an AppId to run your app in production, it's quick and free: [AppId Registration](https://register.inboxsdk.com)
 13 | :::
 14 | 
 15 | ## Quick Start
 16 | 
 17 | Get your AppId here: [`🌎 AppId Registration`](https://register.inboxsdk.com)  
 18 | 
 19 | :::tip MV3 Compatible Version now on NPM
 20 | The InboxSDK is now available on NPM in a Chrome MV3-compatible form which does not use remote loading. This Getting Started page is still being updated for the NPM version. Please see instead the [Hello World example extension GitHub repo](https://github.com/InboxSDK/hello-world) and the [NPM version announcement post](https://groups.google.com/g/inboxsdk/c/MAT_zImFu5I/m/N_7nDojRAgAJ).
 21 | :::
 22 | 
 23 | **The instructions below referring to `inboxsdk.js` are currently mostly about the non-NPM Chrome MV2 compatible release that uses remote code loading.**
 24 | 
 25 | Download the SDK here: [`⬇️  inboxsdk.js`](https://www.inboxsdk.com/build/inboxsdk.js)
 26 | 
 27 | ### Hello World! Sample MV2 Extension
 28 | 
 29 | Here's how simple it is to build a basic app, you need two files: `myapp.js` which is your application code that interacts with the SDK, and the `manifest.json` which describes a basic Chrome extension.
 30 | 
 31 | import Tabs from '@theme/Tabs';
 32 | import TabItem from '@theme/TabItem';
 33 | 
 34 | <Tabs
 35 |   defaultValue="myapp.js"
 36 |   values={[
 37 |     { label: 'myapp.js', value: 'myapp.js', },
 38 |     { label: 'manifest.json', value: 'manifest.json', },
 39 |   ]
 40 | }>
 41 | <TabItem value="myapp.js">
 42 | 
 43 | ```js
 44 | InboxSDK.load(2, 'YOUR_APP_ID_HERE').then(function(sdk){
 45 |   // the SDK has been loaded, now do something with it!
 46 |   sdk.Compose.registerComposeViewHandler(function(composeView){
 47 |     // a compose view has come into existence, do something with it!
 48 |     composeView.addButton({
 49 |       title: "My Nifty Button!",
 50 |       iconUrl: 'https://example.com/foo.png',
 51 |       onClick: function(event) {
 52 |         event.composeView.insertTextIntoBodyAtCursor('Hello World!');
 53 |       },
 54 |     });
 55 |   });
 56 | });
 57 | ```
 58 | 
 59 | </TabItem>
 60 | <TabItem value="manifest.json">
 61 | 
 62 | ```json
 63 | {
 64 |   "manifest_version": 2,
 65 |   "name": "Hello World Extension",
 66 |   "version": "1.0",
 67 |   "permissions": [
 68 |     "https://mail.google.com/",
 69 |     "https://inbox.google.com/"
 70 |   ],
 71 |   "content_scripts" : [
 72 |     {
 73 |       "matches": ["https://mail.google.com/*", "https://inbox.google.com/*"],
 74 |       "js": ["inboxsdk.js", "myapp.js"]
 75 |     }
 76 |   ]
 77 | }
 78 | ```
 79 | 
 80 | </TabItem>
 81 | </Tabs>
 82 | 
 83 | 
 84 | ### Running your Hello World! Extension
 85 | To test your new app, open Chrome to `chrome://extensions` and check the "Developer Mode" checkbox. Then click on "Load Unpacked Extension" and point it to your extension directory. Next, open Gmail, Compose a new message, and stand in awe - a new "Nifty Button" has been added to the compose toolbar! For more details on testing Chrome extensions, see [Chrome Getting Started Docs](https://developer.chrome.com/extensions/getstarted#unpacked).
 86 | 
 87 | 
 88 | ## Structuring Your App
 89 | 
 90 | ### Required Setup
 91 | Browser extensions built using the InboxSDK are structured like normal browser extensions. You must additionally:
 92 | 
 93 | 1. `inboxsdk.js` should be placed inside your extension directory
 94 | 2. The `manifest.json` (Chrome) or `info.plist` (Safari) needs to list the above file as a content script which runs on "https://mail.google.com" and "https://inbox.google.com"
 95 | 3. You must [register for an AppId](https://register.inboxsdk.com) to use your app in production. This is a 100% free step and takes about 5 seconds to complete. Your AppId will be tied to your Google account.
 96 | 4. One of the "Loading Your App" methods must be done as described below
 97 | 
 98 | For more basics of Chrome extensions, see: [Chrome Extension Reference](https://developer.chrome.com/extensions)  
 99 | For more basics of Safari extensions, see: [Safari Extension Reference](https://developer.apple.com/library/safari/documentation/Tools/Conceptual/SafariExtensionGuide/Introduction/Introduction.html)
100 | 
101 | ### Loading using Local App (Basic)
102 | The simplest and easiest way to use the SDK is to have a myapp.js file placed inside your extension. This file will then load the SDK using [`InboxSDK.load()`](WWW.FFIIIIIXXXXMEEEE.COM) 
103 | 
104 | <Tabs
105 |   defaultValue="myapp.js"
106 |   values={[
107 |     { label: 'myapp.js', value: 'myapp.js', },
108 |     { label: 'manifest.json', value: 'manifest.json', },
109 |   ]
110 | }>
111 | <TabItem value="myapp.js">
112 | 
113 | ```js
114 | InboxSDK.load(2, 'YOUR_APP_ID_HERE').then(function(sdk){
115 |   // your app code using 'sdk' goes in here
116 | });
117 | ```
118 | 
119 | </TabItem>
120 | <TabItem value="manifest.json">
121 | 
122 | ```json
123 | {
124 |   "manifest_version": 2,
125 |   "name": "Hello World Extension",
126 |   "version": "1.0",
127 |   "permissions": [
128 |     "https://mail.google.com/",
129 |     "https://inbox.google.com/"
130 |   ],
131 |   "content_scripts" : [
132 |     {
133 |       "matches": ["https://mail.google.com/*", "https://inbox.google.com/*"],
134 |       "js": ["inboxsdk.js", "myapp.js"]
135 |     }
136 |   ]
137 | }
138 | ```
139 | 
140 | </TabItem>
141 | </Tabs>
142 | 
143 | ### Loading using Remote App
144 | The previous method, while simple, implies that you must release a new extension (typically to the Chrome Web Store) if you want to make changes to the app. For high usage or frequently updated apps, you may not want to wait for the chrome extension system to update all your users extensions to the latest version.
145 | 
146 | To handle this scenario, you can host your actual application code on your own server (or somewhere convenient) and remotely load it when needed. This allows you to make updates to it and your users will simply need to refresh Gmail to get the changes.
147 | 
148 | The InboxSDK has convenient functions for remotely loading your application code, you'll need the following files.
149 | 
150 | <Tabs
151 |   defaultValue="loader.js"
152 |   values={[
153 |     { label: 'loader.js (in extension)', value: 'loader.js', },
154 |     { label: 'myapp.js (on your server)', value: 'myapp.js', },
155 |     { label: 'manifest.json', value: 'manifest.json', },
156 |   ]
157 | }>
158 | <TabItem value="loader.js">
159 | 
160 | ```js
161 | // This file will get downloaded and run by your extension making it easy to update
162 | // Don't forget to add this domain to your manifest.json!
163 | 
164 | InboxSDK.loadScript('https://www.myserver.com/myapp.js')
165 | ```
166 | 
167 | </TabItem>
168 | <TabItem value="myapp.js">
169 | 
170 | ```js
171 | // notice how this file is exactly the same as what content.js would have been in Method 1 above?
172 | 
173 | InboxSDK.load(2, 'YOUR_APP_ID_HERE').then(function(sdk){
174 |   // your app code using 'sdk' goes in here
175 | });
176 | ```
177 | 
178 | </TabItem>
179 | <TabItem value="manifest.json">
180 | 
181 | ```json
182 | {
183 |   "manifest_version": 2,
184 |   "name": "Hello World Extension",
185 |   "version": "1.0",
186 |   "permissions": [
187 |     "https://mail.google.com/",
188 |     "https://inbox.google.com/",
189 |     "https://www.myserver.com/"
190 |   ],
191 |   "content_scripts" : [
192 |     {
193 |       "matches": ["https://mail.google.com/*", "https://inbox.google.com/*"],
194 |       "js": ["inboxsdk.js", "loader.js"]
195 |     }
196 |   ]
197 | }
198 | ```
199 | 
200 | </TabItem>
201 | </Tabs>
202 | 
203 | 
204 | ### Loading Dependencies
205 | You may want to load other JS libraries like mapping or charting libraries for your application to use. You can compile these libraries directly into your `myapp.js` (for libraries like jquery, this may make sense), but sometimes you may want to remotely load these instead.
206 | 
207 | We recommend that you load these dependencies in your `myapp.js` file so that they can be updated in the same way your application can.
208 | 
209 | The `InboxSDK.loadScript()` function provides a convenient way to remote load these scripts. This function returns a promise which can be used to chain dependencies or load them in parallel. Conveniently, `InboxSDK.load()` also returns a promise so you can fine tune your ordering of dependencies and the SDK. The following example shows how you would parallel load a dependency.
210 | 
211 | 
212 | <Tabs
213 |   defaultValue="myapp.js"
214 |   values={[
215 |     { label: 'loader.js', value: 'loader.js', },
216 |     { label: 'myapp.js', value: 'myapp.js', },
217 |     { label: 'manifest.json', value: 'manifest.json', },
218 |   ]
219 | }>
220 | <TabItem value="loader.js">
221 | 
222 | ```js
223 | // This file will get downloaded and run by your extension making it easy to update
224 | // Don't forget to add this domain to your manifest.json!
225 | 
226 | InboxSDK.loadScript('https://www.myserver.com/myapp.js')
227 | ```
228 | 
229 | </TabItem>
230 | <TabItem value="myapp.js">
231 | 
232 | ```js
233 | Promise.all([
234 |   InboxSDK.load(2, 'YOUR_APP_ID_HERE'),
235 |   InboxSDK.loadScript('https://www.somedependency.com/somedependency.js')
236 | ])
237 | .then(function(results){
238 |   var sdk = results[0];
239 |   // the rest of your app code here
240 | });
241 | ```
242 | 
243 | </TabItem>
244 | <TabItem value="manifest.json">
245 | 
246 | ```json
247 | {
248 |   "manifest_version": 2,
249 |   "name": "Hello World Extension",
250 |   "version": "1.0",
251 |   "permissions": [
252 |     "https://mail.google.com/",
253 |     "https://www.myserver.com"
254 |   ],
255 |   "content_scripts" : [
256 |     {
257 |       "matches": ["https://mail.google.com/*"],
258 |       "js": ["inboxsdk.js", "loader.js"]
259 |     }
260 |   ]
261 | }
262 | ```
263 | 
264 | </TabItem>
265 | </Tabs>
266 | 
267 | 
268 | ## Concepts
269 | 
270 | ### How It Works
271 | To use the InboxSDK, you must include the `inboxsdk.js` file in your extension. This file is just a small shim and is only responsible for remotely loading the full implementation of the SDK. This is done so that the actual implementation of the SDK can be updated to keep compatibility with Gmail without requiring you to update your extension for every change. The implementation is often updated to maintain compatibility with Gmail, fix bugs, and add new SDK features. All that is required for your end users to reap this benefit is for them to refresh Gmail in their browser.
272 | 
273 | Since the SDK is remotely loaded, you can't start interacting with it until its been loaded.
274 | 
275 | The `inboxsdk.js` shim defines a few functions which you can directly use immediately without waiting for the remote implementation to load. These are documented in the `InboxSDK.*` namespace.
276 | 
277 | ### Views & Events
278 | Several methods in the InboxSDK return `View` types. These `View` classes have a variety of functionality depending on the UI element they represent. However, one critical commonality is that they are all `EventEmitter`s. This means that you can subscribe to a variety of events that each `View` emits.
279 | 
280 | The events they emit are all documented in their respective documentation sections (i.e. see `ComposeView` has a section for events). One commonality is that they all emit a `destroy` event and have their `destroyed` property set to true when they are no longer available in the page. It's often useful to subscribe to this event and then cleanup any resources/memory/references you may no longer need. Performance inside Gmail is important to maintain, so it's critical you release any relevant resources when this event is emitted.
281 | 
282 | To subscribe to events, refer to the documentation for `EventEmitter`s. Here's a simple example showing how to subscribe to events:
283 | 
284 | ```js
285 | InboxSDK.load(2, 'YOUR_APP_ID_HERE').then(function(sdk){
286 |   sdk.Compose.registerComposeViewHandler(function(composeView){
287 |     composeView.on('recipientsChanged', function(event) {
288 |       console.log('Recipients have changed to: ' + event);
289 |     });
290 | 
291 |     composeView.on('destroy', function(event) {
292 |       console.log('compose view going away, time to clean up');
293 |     });
294 |   });
295 | });
296 | ```
297 | 
298 | ### Compatibility
299 | The SDK is currently at version 2 and when loading the SDK that is the number you should specify. The SDK may add backwards compatible API's to the current version, but incompatible changes will come with a version update. Your code is guranteed to work so long as you specify the correct version number AND that version number is at most two releases old.
300 | 


--------------------------------------------------------------------------------
/docs/global.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Global
 3 | ---
 4 | This namespace contains methods and types related to the UI Elements that are available Globally in Gmail.
 5 | 
 6 | ### Namespace methods
 7 | #### addSidebarContentPanel(contentPanelDescriptor)
 8 | Adds an icon in the "global app" icon area on the right side of Gmail. When the user clicks the icon the global sidebar will be open with the el displayed.
 9 | 
10 | | Parameters | Type | Description |
11 | | :--- | :--- | :--- |
12 | | **contentPanelDescriptor** | `ContentPanelDescriptor` | The details of the content panel to add to the global sidebar. |
13 | 
14 | _Returns_ a `Promise<ContentPanelView>`
15 | 
16 | #### addSupportItem(supportItemDescriptor)
17 | Adds a support item right in the Gmail support menu.
18 | 
19 | | Parameters | Type | Description |
20 | | :--- | :--- | :--- |
21 | | **supportItemDescriptor** | `SupportItemDescriptor` | The details of the support item to be added to the Gmail support menu. |
22 | 
23 | _Returns_ a `SupportItemView`
24 | 
25 | ---
26 | ## SupportItemView
27 | Object that represents a Gmail support item in the support menu. This class is returned by Global.addSupportItem().
28 | ### Methods
29 | #### destroy()
30 | Remove the support view item from support menu
31 | 
32 | 
33 | ---
34 | ## SupportItemDescriptor
35 | This type is accepted by the Global.addSupportItem() method to insert a SupportItemView for a Gmail support item. A support item view allows you adding an element that is used for displaying and a callback function to call when the user clicks on the item. Support item view also supports arrow key up/down navigation same as other Gmail support items in the menu and on Enter key press down it fires the onClick call back.
36 | 
37 | | Property | Type | Description | Required? | Default |
38 | | :--- | :--- | :--- | :--- | :--- |
39 | | **element** | `HTMLElement` | The actual HTMLElement of the support item. | Yes |  |
40 | | **onClick** | `function(event)` | The callback when the item is clicked. | Yes |  |
41 | 


--------------------------------------------------------------------------------
/docs/inboxsdk-star.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: InboxSDK.*
 3 | ---
 4 | 
 5 | The functions in this class are only used for load related functionality like loading the SDK itself or other external scripts.
 6 | 
 7 | ### `load()` 
 8 | <Method returns="Promise"></Method>
 9 | 
10 | Loads InboxSDK remotely and prepares it to be used. Returns a promise which resolves with the SDK interface (see usage examples under "Structuring Your App") when the SDK is loaded and ready to be used.
11 | 
12 | | Parameter        |      Description      |   Type |
13 | | ---------------- | ------------------- | -----: |
14 | | **version**      | The API version of the SDK to use. The recommended value right now is 2. | `number` |
15 | | **appId**      |   The AppId that you registered for on the [AppId Registration](http://localhost:3000/inboxsdk-docs/api-reference) page. | `string` |
16 | | **options** | Optional options object | `LoadOptions` |
17 | 
18 | 
19 | ### `loadScript()`
20 | <Method returns="Promise"></Method>
21 | 
22 | Loads a remote script into the extension's content script space and evals it. Returns a promise which resolves when the script is finished downloading and eval'ing.
23 | 
24 | | Parameter        |      Description      |   Type |
25 | | ---------------- | ------------------- | -----: |
26 | | **url**      | The URL of the remote script to load | `string` |
27 | | **options** | Optional options object | `LoadScriptOptions` |
28 | 
29 | 
30 | ### `LoadOptions`
31 | <Type usedBy="InboxSDK.load()" usedByAnchor="load"></Type>
32 | 
33 | | Property        |      Description      |   Type |
34 | | ---------------- | ------------------- | -----: |
35 | | **appName**      | The name of your app. This is used by several methods in the SDK. | `string`, _default: `null`_ |
36 | | **appIconUrl** | The URL of the icon of your app. Can be HTTPS or a chrome runtime url. | `string`, _default: `null`_ |
37 | | **suppressAddonTitle** | The name of the Gmail Add-On you want to hide. Use this if you have both an extension and a Gmail Add-On that provide similar functionality. | `string`, _default: `null`_ |
38 | 
39 | ### `LoadScriptOptions`
40 | <Type usedBy="InboxSDK.loadScript()" usedByAnchor="loadscript"></Type>
41 | 
42 | | Property        |      Description      |   Type |
43 | | ---------------- | ------------------- | -----: |
44 | | **nowrap**      | The name of your app. This is used by several methods in the SDK. | `boolean`, _default: `false`_ |
45 | 
46 | export const Method = ({children, returns}) => ( <div style={{marginBottom: '8px', marginTop: '8px'}}>
47 |     <div style={{
48 |         display: "inline-block",        
49 |         marginBottom: "12px",
50 |         borderBottom: "dashed 4px #1877F2",
51 |     }}>Method returns:</div>
52 |     <span> <code>{returns}</code></span>
53 | </div> );
54 | 
55 | export const Type = ({children, usedByAnchor, usedBy}) => ( <div style={{marginBottom: '8px', marginTop: '8px'}}>
56 |     <div style={{
57 |         display: "inline-block",
58 |         marginBottom: "12px",
59 |         borderBottom: "dashed 4px rgb(241 119 32)",
60 |     }}>Type, used by: <a href={'#' + usedByAnchor}>{usedBy}</a></div>
61 | </div> );


--------------------------------------------------------------------------------
/docs/keyboard-shortcuts.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Keyboard Shortcuts
 3 | ---
 4 | This namespace allows you to setup keyboard shortcuts that your application can response to.
 5 | 
 6 | ### Namespace methods
 7 | #### createShortcutHandle(keyboardShortcutDescriptor)
 8 | This method creates a shortcut handle. A shortcut handle can be used in various APIs in the SDK to keyboard enable them.
 9 | 
10 | | Parameters | Type | Description |
11 | | :--- | :--- | :--- |
12 | | **keyboardShortcutDescriptor** | `KeyboardShortcutDescriptor` | details of the shortcut. |
13 | 
14 | _Returns_ a `KeyboardShortcutHandle`
15 | 
16 | 
17 | ---
18 | ## KeyboardShortcutHandle
19 | This class registers a keyboard shortcut. It just defines the key combination itself but not what to when that shortcut is executed. In order to actually do something when this handle is executed, you need to pass this handle to other functions that accept KeyboardShortcutHandle like the toolbar button registration functions.
20 | 
21 | #### remove()
22 | Deactivates the keyboard shortcut.
23 | 
24 | 
25 | 
26 | 
27 | 
28 | ---
29 | ## KeyboardShortcutDescriptor
30 | Describes a keyboard shortcut combination
31 | 
32 | | Property | Type | Description | Required? | Default |
33 | | :--- | :--- | :--- | :--- | :--- |
34 | | **chord** | `string` | The keys the user has to press to activate the shortcut. Simultaneous keypresses can be defined with "+". For multi-key chords like Gmail's, include a space between the keys, i.e. "g i". Syntax matches the combokeys library. | Yes |  |
35 | | **description** | `string` | The description text that shows up in Gmail's keyboard shortcut help (when the user presses '?'). | Yes |  |
36 | 


--------------------------------------------------------------------------------
/docs/lists.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Lists
  3 | ---
  4 | 
  5 | This namespace allows you to interact with Lists of emails. They typically appear in various views like Inbox, Search or Labels. The interaction primarily lets you view and modify data in each row of the list.
  6 | 
  7 | ### Namespace methods
  8 | 
  9 | #### registerThreadRowViewHandler(handler)
 10 | Registers a handler that gets called whenever a new ThreadRowView becomes visible on screen. Your handler is guaranteed to be called exactly once per thread per route. That is, each time your user visits a route with ThreadRowViews, this handler will get called once for each ThreadRowView. 
 11 | 
 12 | | Parameters | Type | Description |
 13 | | :--- | :--- | :--- |
 14 | | **handler** | `function(ThreadRowView)` | The function to call on each new visible ThreadRowView. |
 15 | 
 16 | _Returns_ a `function` which removes the handler registration.
 17 | 
 18 | 
 19 | #### getSelectedThreadRowViews()
 20 | _Returns_ an `Array<ThreadRowView>` of all the currently checkmarked ThreadRowViews.
 21 | 
 22 | 
 23 | #### registerThreadRowViewSelectionHandler(handler)
 24 | Registers a handler that gets called whenever a user makes a change in the list of selected threads. 
 25 | 
 26 | | Parameters | Type | Description |
 27 | | :--- | :--- | :--- |
 28 | | **handler** | `function(Array<ThreadRowView>)` | The function to call each time the set of selected thread row views changes. |
 29 | 
 30 | _Returns_ a `function` which removes the handler registration.
 31 | 
 32 | 
 33 | 
 34 | 
 35 | 
 36 | 
 37 | ---
 38 | ## ThreadRowView
 39 | ### Methods
 40 | 
 41 | #### addLabel(labelDescriptor)
 42 | Adds a label to the thread row view. This label will appear like a normal Gmail label, but it is purely a temporary visual modification. This method does not cause any change to persist to the user's thread in Gmail.
 43 | 
 44 | | Parameters | Type | Description |
 45 | | :--- | :--- | :--- |
 46 | | **labelDescriptor** | `LabelDescriptor` or `Stream(LabelDescriptor)` | An options object for the label. |
 47 | 
 48 | #### addImage(imageDescriptor)
 49 | Adds an image to the thread row view.
 50 | 
 51 | | Parameters | Type | Description |
 52 | | :--- | :--- | :--- |
 53 | | **imageDescriptor** | `ImageDescriptor` or `Stream(ImageDescriptor)` | An options object for the image. |
 54 | 
 55 | #### addButton(buttonDescriptor)
 56 | Adds an icon style button to this row, placed right next to the star button.
 57 | 
 58 | | Parameters | Type | Description |
 59 | | :--- | :--- | :--- |
 60 | | **buttonDescriptor** | `ThreadRowButtonDescriptor` or `Stream(ThreadRowButtonDescriptor)` | An options object for the button. |
 61 | 
 62 | #### addActionButton(buttonDescriptor)
 63 | Adds an action button to the right of the subject.
 64 | 
 65 | | Parameters | Type | Description |
 66 | | :--- | :--- | :--- |
 67 | | **buttonDescriptor** | `ThreadRowActionButtonDescriptor` or `Stream(ThreadRowActionButtonDescriptor)` | An options object for the button. |
 68 | 
 69 | #### addAttachmentIcon(threadRowAttachmentIconDescriptor)
 70 | Adds an attachment icon to the row.
 71 | 
 72 | | Parameters | Type | Description |
 73 | | :--- | :--- | :--- |
 74 | | **threadRowAttachmentIconDescriptor** | `ThreadRowAttachmentIconDescriptor` or `Stream(ThreadRowAttachmentIconDescriptor)` | The options for the icon to add. |
 75 | 
 76 | #### replaceDate(threadRowDateDescriptor)
 77 | Replaces the text inside the date column.
 78 | 
 79 | | Parameters | Type | Description |
 80 | | :--- | :--- | :--- |
 81 | | **threadRowDateDescriptor** | `ThreadRowDateDescriptor` or `Stream(ThreadRowDateDescriptor)` | The options for the date replacement. |
 82 | 
 83 | #### replaceDraftLabel(draftLabelDescriptor)
 84 | If this row represents a draft, then this allows the word "Draft" and the number next to it to be replaced.
 85 | 
 86 | | Parameters | Type | Description |
 87 | | :--- | :--- | :--- |
 88 | | **draftLabelDescriptor** | `ThreadRowDraftLabelDescriptor` or `Stream(ThreadRowDraftLabelDescriptor)` | The options for the replacement. |
 89 | 
 90 | #### getSubject()
 91 | _Returns_ a `String` of the subject of this thread.
 92 | 
 93 | #### getDateString()
 94 | _Returns_ a `String` representation of the timestamp of the most recent message on the thread. Note: this returns a string representation because timezone information is not available, the accuracy is limited to minutes, and it is formatted to the user's locale.
 95 | 
 96 | #### getThreadIDAsync()
 97 | _Returns_ a `Promise<String>` of the Gmail Thread ID of the thread
 98 | 
 99 | #### getThreadIDIfStableAsync()
100 | Gets the Gmail Thread ID of the thread only if the thread ID is stable. Some threads such as those with only a single Draft message in them will occasionally change their thread ID. If you're using the thread ID as a key, you may experience unexpected behaviour if you're not careful about this fact. This method provides you with an easy way to tell if the thread has a stable ID. 
101 | _Returns_ a `Promise<String>` for the thread ID if it is expected to stay the same, otherwise it will return a `Promise<null>`
102 | 
103 | #### getDraftID()
104 | _Returns_ a `Promise<String>` for the thread row's draft ID, if the thread row represents a single draft. Otherwise the promise may resolve to null.
105 | 
106 | #### getVisibleDraftCount()
107 | _Returns_ a `Number` of visible draft messages in the row. This is purely an estimate based on what is visible in the row.
108 | 
109 | #### getVisibleMessageCount()
110 | _Returns_ a `Number` of visible messages in the thread based on the visible numeric marker.
111 | 
112 | #### getContacts()
113 | _Returns_ an `Array<Contact>` of the visible contacts listed on the row. Note: this may not include all participants on the thread as this information is not visible.
114 | 
115 | #### getElement()
116 | _Returns_ a `HTMLElement`. Use if you need direct access to the DOM element for the row. Be careful when using this because you're exposed to the raw Gmail DOM, and it's up to you to handle all possible Gmail settings and updates.
117 | 
118 | 
119 | 
120 | ### Events
121 | #### destroy
122 | Fires when the thread row is no longer visible.
123 | 
124 | 
125 | 
126 | 
127 | ### Properties
128 | | Property | Type | Description |
129 | | :--- | :--- | :--- |
130 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed |
131 | 
132 | 
133 | 
134 | 
135 | 
136 | 
137 | 
138 | 
139 | 
140 | 
141 | 
142 | ---
143 | ## ThreadRowButtonDescriptor
144 | This type is used to describe a button you add to a ThreadRowView.
145 | 
146 | | Property | Type | Description | Required? | Default |
147 | | :--- | :--- | :--- | :--- | :--- |
148 | | **title** | `string` | Text to show when the user hovers the mouse over the button. | Yes ||
149 | | **iconUrl** | `string` | URL for the icon to show on the button. Should be a local extension file URL or a HTTPS URL. | Yes ||
150 | | **iconClass** | `string` | A CSS class to apply to the icon button. | No ||
151 | | **onClick** | `function(event)` | A handler that gets called when the button is clicked on. The event object contains a threadRowView property and optionally a dropdown property if the hasDropdown was set to true. | Yes ||
152 | | **hasDropdown** | `boolean` | If true, the button will open a dropdown menu above it, and the event object will have a dropdown property of type DropdownView that allows the dropdown to be customized when opened. | No | `false` |
153 | 
154 | 
155 | ---
156 | ## ThreadRowActionButtonDescriptor
157 | This type is used to describe an action button you add to a ThreadRowView.
158 | 
159 | | Property | Type | Description | Required? | Default |
160 | | :--- | :--- | :--- | :--- | :--- |
161 | | **type** | `ActionButtonTypes` | The type of action button to show. Only LINK is currently supported. | Yes |
162 | | **title** | `string` | Text of the button. | Yes |
163 | | **className** | `string` | A CSS class to apply to the action button. | No ||
164 | | **onClick** | `function(event)` | A handler that gets called when the action button is clicked on. | No ||
165 | | **url** | `string` | For LINK action buttons only. This is the URL to open when the button is clicked. | Yes |
166 | 
167 | 
168 | ---
169 | ## LabelDescriptor
170 | This type is used to describe labels that you add to ThreadRowView and CollapsibleSectionView.
171 | 
172 | | Property | Type | Description | Required? | Default |
173 | | :--- | :--- | :--- | :--- | :--- |
174 | | **title** | `string` | Text of the label. | Yes |
175 | | **foregroundColor** | `string` | The text color of the label. | No ||
176 | | **backgroundColor** | `string` | The background color of the label. | No ||
177 | | **maxWidth** | `string` | Max width for the label title. The default label title max-width is 90px. | No ||
178 | | **iconHtml** | `string` | Html for the icon to show on the label. This property can't be used with iconUrl or iconClass. | No ||
179 | | **iconUrl** | `string` | URL for the icon to show on the label. Should be a local extension file URL or a HTTPS URL. | Yes |
180 | | **iconClass** | `string` | A CSS class to apply to the icon. | No ||
181 | | **iconBackgroundColor** | `string` | A background color to put on the icon element if present. | No ||
182 | 
183 | 
184 | ---
185 | ## ImageDescriptor
186 | This type is used to describe images that you add to ThreadRowView.
187 | 
188 | | Property | Type | Description | Required? | Default |
189 | | :--- | :--- | :--- | :--- | :--- |
190 | | **imageUrl** | `string` | URL for the image to show on the row. Should be a local extension file URL or a HTTPS URL. | Yes |
191 | | **imageClass** | `string` | A CSS class to apply to the image. | No ||
192 | | **tooltip** | `string` | The tooltip text to show when the user hovers over the image. | No ||
193 | | **orderHint** | `number` | If multiple images from your app are added then they will be ordered by this value, | No | `0`
194 | 
195 | 
196 | ---
197 | ## ThreadRowDateDescriptor
198 | This type is used to modify ThreadRowView's which represent drafts.
199 | 
200 | | Property | Type | Description | Required? | Default |
201 | | :--- | :--- | :--- | :--- | :--- |
202 | | **text** | `string` | The date text to replace with. | Yes |
203 | | **textColor** | `string` | The text color of the replaced date text. | No ||
204 | | **tooltip** | `string` | The tooltip text to show when the user hovers over the date. | No ||
205 | 
206 | 
207 | ---
208 | ## ThreadRowAttachmentIconDescriptor
209 | This type is used to describe an icon you add to a ThreadRowView.
210 | 
211 | | Property | Type | Description | Required? | Default |
212 | | :--- | :--- | :--- | :--- | :--- |
213 | | **iconUrl** | `string` | URL for the icon to show on in the attachments column. Should be a local extension file URL or a HTTPS URL. | No ||
214 | | **iconClass** | `string` | A CSS class to apply to the icon. | No ||
215 | | **iconHtml** | `string` | An optional Html for the icon to show. This property can not be used with iconUrl. | No ||
216 | | **tooltip** | `string` | The tooltip text to show when the user hovers over the icon. | No ||
217 | 
218 | 
219 | ---
220 | ## ThreadRowDraftLabelDescriptor
221 | This type is used to describe a modification you can do to a ThreadRowView.
222 | 
223 | | Property | Type | Description | Required? | Default |
224 | | :--- | :--- | :--- | :--- | :--- |
225 | | **text** | `string` | The text to replace "Draft" with. | Yes |
226 | | **count** | `string` | The number to show in parentheses next to "Draft". No number will be shown if this is 1. | No | `1` |
227 | 
228 | 
229 | 
230 | 
231 | 
232 | 
233 | ---
234 | ## Enums and Constants
235 | ### ActionButtonTypes
236 | The types of action buttons available to ThreadRowView.
237 | 
238 | | Enum | Description |
239 | | :--- | :--- |
240 | | **`LINK`** | Always opens an external URL. Marked with an arrow icon. |
241 | 


--------------------------------------------------------------------------------
/docs/navmenu.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: NavMenu
  3 | ---
  4 | This namespace contains functionality associated with adding navigation items to the navigation menu of Gmail. Typically, these navigation links are accessible by the user on the left side of the email client and include built in navigation items like the Inbox, Sent Mail or Drafts links.
  5 | 
  6 | This namespace allows you to add your own items to this Navigation menu. Typically, these navigation items are useful to send users to different Routes that you have already registered providing navigation for your entire application.
  7 | The navigation menu is represented as a tree structure of items. Each item can have 0 or more children and there are several options to configure the appearance of the items.
  8 | Items can also have accessories which provide secondary actions like opening a dropdown (like Gmails labels) or providing a "create new" action. There are several predefined accesories, see CreateAccessoryDescriptor, IconButtonAccessoryDescriptor or DropdownButtonAccessoryDescriptor.
  9 | 
 10 | ### Namespace methods
 11 | #### addNavItem(navItemDescriptor)
 12 | Adds a navigation item to the root of the navigation menu. Navigation items from your app are grouped together where possible but ultimately the SDK optimizes for the best user experience when displaying navigation items.
 13 | 
 14 | | Parameters | Type | Description |
 15 | | :--- | :--- | :--- |
 16 | | **navItemDescriptor** | `NavItemDescriptor` | A single descriptor for the nav item or stream of NavItemDescriptors. |
 17 | 
 18 | _Returns_ a `NavItemView`
 19 | 
 20 | 
 21 | ---
 22 | ## NavItemView
 23 | NavItemsViews are the elements placed inside a NavMenu. Each NavItemView represents an entry in the left navigation of Gmail. These NavItemViews can be nested.
 24 | 
 25 | Typically the main action of a NavItemView is performed when the user clicks on the main text. However, you can also provide accessories which are secondary actions which typically appear on the right side of the NavItemView but may be rendered in other ways.
 26 | For nested NavItemViews, the SDK will handle collapsing and expanding children depending on user input.
 27 | 
 28 | ### Methods
 29 | #### addNavItem(navItemDescriptor)
 30 | Add a nested child NavItemView
 31 | 
 32 | | Parameters | Type | Description |
 33 | | :--- | :--- | :--- |
 34 | | **navItemDescriptor** | `NavItemDescriptor` | A single descriptor for the nav item or stream of NavItemDescriptors. |
 35 | 
 36 | _Returns_ a `NavItemView`
 37 | 
 38 | #### remove()
 39 | Remove this NavItemView from its parent
 40 | 
 41 | #### isCollapsed()
 42 | _Returns_ a `boolean` whether the NavItemView is currently collapsed and hiding its children
 43 | 
 44 | #### setCollapsed(collapseValue)
 45 | Collapse or uncollapse this NavItemView
 46 | 
 47 | | Parameters | Type | Description |
 48 | | :--- | :--- | :--- |
 49 | | **collapseValue** | `boolean` | whether to collapse or uncollapse |
 50 | 
 51 | #### getElement()
 52 | _Returns_ the underlying HTMLElement for the `NavItemView`.
 53 | 
 54 | 
 55 | ### Events
 56 | #### destroy
 57 | Fires when this view is destroyed.
 58 | 
 59 | ### Properties
 60 | | Property | Type | Description | Required? | Default |
 61 | | :--- | :--- | :--- | :--- | :--- |
 62 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
 63 | 
 64 | 
 65 | 
 66 | 
 67 | ---
 68 | ## NavItemDescriptor
 69 | This object represents the set of options to configure a new NavItemView.
 70 | 
 71 | | Property | Type | Description | Required? | Default |
 72 | | :--- | :--- | :--- | :--- | :--- |
 73 | | **name** | `string` | Name of the NavItem to be used for display | Yes |  |
 74 | | **key** | `string` | Unique identifier for the nav item used for remembering collapse state between sessions. | No | value of name |
 75 | | **routeID** | `string` | The ID of the route to navigate to when the NavItemView is clicked on. | No | `null` |
 76 | | **routeParams** | `Object` | The parameters of the route being navigated to when the NavItemView is clicked on. | No | `null` |
 77 | | **onClick** | `function` | A function that will be called when the NavItemView is clicked. Passed a single event object parameter which includes a preventDefault() function. If the NavItemView has a routeID, calling preventDefault() will prevent navigation to the given route. | No | `null` |
 78 | | **orderHint** | `integer` | Used to specify the order in which your NavItemViews should be relative to each other | No | `Number.MAX_SAFE_INTEGER` |
 79 | | **accessory** | `CreateAccessoryDescriptor` or `IconButtonAccessoryDescriptor` or `DropdownButtonAccessoryDescriptor` | There are several "accessories" which can provide secondary actions for NavItemViews | No | `null` |
 80 | | **iconUrl** | `string` | An optional url to an icon to display an icon alongside the name of the NavItemView | No | `null` |
 81 | | **iconClass** | `string` | An optional class to apply to the icon. | No | `null` |
 82 | | **iconElement** | `HTMLElement` | An optional icon element to use as the icon. This property can't be used with iconUrl or iconClass. | No | `null` |
 83 | | **backgroundColor** | `string` | If you provide none of the iconUrl, iconElement, iconClass properties, then a colored circle will be displayed next to the NavItemView that has its color set by this property, or gray by default. | No | `null` |
 84 | | **type** | `NavItemTypes` | The nav item type affects how the item is displayed. | No | `NAVIGATION` |
 85 | 
 86 | 
 87 | 
 88 | 
 89 | ---
 90 | ## CreateAccessoryDescriptor
 91 | The CreateAccessoryDescriptor allows you to add an action to allow the user to create a new child of this item.
 92 | 
 93 | | Property | Type | Description | Required? | Default |
 94 | | :--- | :--- | :--- | :--- | :--- |
 95 | | **type** | `string` | For CreateAccessoryDescriptors this should always be set to CREATE | Yes |  |
 96 | | **onClick** | `function` | Callback for when the "Create New" accessory is pressed. | Yes |  |
 97 | 
 98 | 
 99 | 
100 | 
101 | ---
102 | ## IconButtonAccessoryDescriptor
103 | The IconButtonAccessoryDescriptor allows you to add an icon button right next your NavItem which lets the user take a secondary action
104 | 
105 | | Property | Type | Description | Required? | Default |
106 | | :--- | :--- | :--- | :--- | :--- |
107 | | **type** | `string` | For IconButtonAccessoryDescriptors this should always be set to ICON_BUTTON | Yes |  |
108 | | **onClick** | `function` | Callback for when the IconButton accessory is pressed. | Yes |  |
109 | | **iconUrl** | `string` | A URL for the icon to be displayed in the button. | Yes |  |
110 | | **iconClass** | `string` | An optional class to add to the icon. | No | `null` |
111 | 
112 | 
113 | 
114 | 
115 | ---
116 | ## DropdownButtonAccessoryDescriptor
117 | The DropdownButtonAccessoryDescriptor allows you to add a dropdown right next your NavItemView
118 | 
119 | | Property | Type | Description | Required? | Default |
120 | | :--- | :--- | :--- | :--- | :--- |
121 | | **type** | `string` | For DropdownButtonAccessoryDescriptors this should always be set to DROPDOWN_BUTTON | Yes |  |
122 | | **onClick** | `function(event)` | A callback when the dropdown button is pressed. The event object passed to you has a dropdown (DropdownView) property which you can fill your content with. | Yes |  |
123 | 
124 | 
125 | 
126 | 
127 | ## Enums and Constants
128 | ### NavItemTypes
129 | | Enum | Description |
130 | | :--- | :--- |
131 | | **NAVIGATION** | standard nav item for navigating |
132 | | **LINK** | nav item that looks like a link |
133 | 


--------------------------------------------------------------------------------
/docs/resources.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Resources
 3 | ---
 4 | 
 5 | ## Example Apps
 6 | We've developed several sample extensions that demostrate the use of the InboxSDK. The examples are all hosted on [GitHub](https://github.com/InboxSDK). If you'd like to help develop more samples, let us know!
 7 | 
 8 | ## Advanced Patterns
 9 | 
10 | ### Promises
11 | Several of our API methods accept or provide a promise for a certain value instead of the value itself. A promise is an object that represents an eventual value, and allows callbacks to be registered to be called when the value becomes present. Promises are standardized and are natively available as part of Javascript in modern browsers. Promises help to provide a consistent interface to writing asynchronous code.
12 | Here is a simple example of creating a promise that resolves to a value after a second, and then an example of how to listen to the promise:
13 | ```js
14 | var promise = new Promise(function(resolve, reject) {
15 |     setTimeout(function() {
16 |     resolve('foo');
17 |     }, 1000);
18 | });
19 | promise.then(function(value) {
20 |     console.log("received", value);
21 | });
22 | // Prints "received foo" after one second.
23 | ```
24 | 
25 | Promises can also be created by chaining from existing promises. For more information on promises, see resources such as the [HTML5 Rocks](http://www.html5rocks.com/en/tutorials/es6/promises/) or [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) pages on promises.
26 | 
27 | ### Streams
28 | Several of our API methods accept reactive streams as arguments. A reactive stream is an object that represents a series of eventual values, like a promise that can resolve repeatedly with new values over time. Streams are implemented in libraries such as [Kefir](https://pozadi.github.io/kefir/), [Bacon.js](https://baconjs.github.io/), and [Reactive Extensions for Javascript](https://github.com/Reactive-Extensions/RxJS), which are each supported by the InboxSDK. Streams help to provide a consistent and composable interface to writing asynchronous code, like promises.
29 | In order to create streams, you must include one of the above libraries in your extension. Here is an example of creating and then consuming a stream using the Kefir library:
30 | ```js
31 | var stream = Kefir.stream(function(emitter) {
32 |     var timer = setInterval(function() {
33 |     emitter.emit('foo');
34 |     }, 1000);
35 | 
36 |     // Return a function to be called when the stream is unsubscribed from.
37 |     // Unlike promises, streams can know when they're no longer listened to!
38 |     return function() {
39 |     clearInterval(timer);
40 |     };
41 | });
42 | stream.take(5).onValue(function(value) {
43 |     console.log("received", value);
44 | });
45 | // Prints "received foo" five times each one second apart, and then stops.
46 | ```
47 | 
48 | Note that reactive libraries often contain many specialized functions for creating streams from timers, event listeners, and other streams. This example purposefully uses a general method instead that can be quickly adapted to many uses. The above example should be enough to show you how to interact with the InboxSDK's stream-compatible methods, but if you want more information on reactive streams in order to use them more effectively, some recommended resources include the documentation of the above libraries, [Netflix's talk on Reactive Programming](https://www.youtube.com/watch?v=XRYN2xt11Ek), and [The introduction to Reactive Programming you've been missing](https://gist.github.com/staltz/868e7e9bc2a7b8c1f754).
49 | 
50 | ## FAQ
51 | ### What browsers are supported?
52 | Chrome and Safari are currently supported.  Chrome version 86 and Safari 14 are the minimum versions we support.
53 | Firefox support is under consideration; please let us know if you're interested.


--------------------------------------------------------------------------------
/docs/router.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Router
  3 | ---
  4 | This namespace contains functionality associated with creating your own content inside Gmail. It allows you to define "Routes" which define a full page of content and an associated URL space for which they are active. You can think of routes as different pages in your application. Gmail already have a few routes built in (Inbox, Sent, Drafts, etc). This namespace allows you to define your own as well as listen in on the built in routes being navigated to.
  5 | 
  6 | This is typically used when you want to create content to fill the main content area of Gmail.
  7 | Every route has a URL associated with it and can have optional parameters. However, you never construct these URL's manually. The SDK will take care of creating a URL that will work in Gmail for your Route. Since these URL's may change due to implementations of Gmail, you should always create new links when trying to set URL on elements or simply use the goto function which naviagtes to the created link automatically.
  8 | Using the handleX family of methods, you can specify which routes your application can handle. You will be called back with and instance of a RouteView or similar when the user navigates to a route you've declared you can handle. For custom routes, you'll typically add your own content and for built in routes, you'll typically modify the existing content.
  9 | Route ID's are path like strings with named parameters, for example: "myroute/:someParamMyRouteNeeds".
 10 | 
 11 | ### Namespace methods
 12 | #### createLink(routeID, params)
 13 | Get a URL that can be used to navigate to a view. You'll typically want to use this to set the href of an element or similar. Returns the encoded URL string.
 14 | 
 15 | | Parameters | Type | Description |
 16 | | :--- | :--- | :--- |
 17 | | **routeID** | `string` | A route specifying where the link should navigate the user to. This should either be a routeID registered with Router.handleCustomRoute or Router.handleCustomListRoute, or a value from Router.NativeRouteIDs. |
 18 | | **params** | `Object` | an object containing the parameters that will be encoded in the link and decoded when the user subsequently visits the route. Handlers for the specified routeID will receive a copy of this object. This object must contain only simple key value pairs with no nested arrays/objects. |
 19 | 
 20 | _Returns_ a `string`
 21 | 
 22 | #### goto(routeID, params)
 23 | Change the route to be the one with the given ID and have the given parameters.
 24 | 
 25 | | Parameters | Type | Description |
 26 | | :--- | :--- | :--- |
 27 | | **routeID** | `string` | A route specifying where the link should navigate the user to. This should either be a routeID registered with Router.handleCustomRoute or Router.handleCustomListRoute, a value from Router.NativeRouteIDs, or a value previously returned by Router.createLink. If it's a value previously returned by Router.createLink, then the params argument must be omitted. |
 28 | | **params** | `Object` | an object containing the parameters that will be encoded in the link and decoded when the user subsequently visits the route. Handlers for the specified routeID will receive a copy of this object. This object must contain only simple key value pairs with no nested arrays/objects. |
 29 | 
 30 | _Returns_ a `Promise<void>`
 31 | 
 32 | #### handleCustomRoute(routeID, handler)
 33 | Registers a handler (callback) to be called when the user navigates to a custom route which matches the routeID you provide. Use this to create your own routes (pages) with your own custom content. Your callback will be passed an instance of a CustomRouteView whose contents you may modify.
 34 | 
 35 | | Parameters | Type | Description |
 36 | | :--- | :--- | :--- |
 37 | | **routeID** | `string` | which route this handler is registering for |
 38 | | **handler** | `function(CustomRouteView)` | The callback to call when the route changes to a custom route matching the provided routeID |
 39 | 
 40 | _Returns_ a `function` which removes the handler registration.
 41 | 
 42 | #### handleAllRoutes(handler)
 43 | Registers a handler (callback) to be called when the user navigates to any route (both customs and built in routes). Because this can apply to any route, your callback will be given only a generic RouteView. This is typically used when you want to monitor for page changes but don't necessarily need to modify the page. 
 44 | 
 45 | | Parameters | Type | Description |
 46 | | :--- | :--- | :--- |
 47 | | **handler** | `function(RouteView)` | The callback to call when the route changes |
 48 | 
 49 | _Returns_ a `function` which removes the handler registration.
 50 | 
 51 | #### handleListRoute(routeID, handler)
 52 | Registers a handler (callback) to be called when the user navigates to a list route which matches the routeID you provide. Gmail have several built in routes which are "Lists". These include routes like Inbox, All Mail, Sent, Drafts, etc. You'll typically use this to modify Gmail's built in List routes.
 53 | 
 54 | | Parameters | Type | Description |
 55 | | :--- | :--- | :--- |
 56 | | **routeID** | `NativeListRouteIDs` | which list route this handler is registering for. |
 57 | | **handler** | `function(ListRouteView)` | The callback to call when the route changes to a list route matching the routeId. |
 58 | 
 59 | _Returns_ a `function` which removes the handler registration.
 60 | 
 61 | Example:
 62 | 
 63 | ```ts
 64 | sdk.Router.handleListRoute(sdk.Router.NativeRouteIDs.INBOX, (listRouteView) => {
 65 |   // ...
 66 | });
 67 | ```
 68 | 
 69 | #### handleCustomListRoute(routeID, handler)
 70 | Used to create a custom view that shows a list of threads. When the user navigates to the given routeID, the handler function will be called. The handler function will be passed the starting offset (if the user sees 50 threads per page and is on page 2, then the offset will be 50), and a maximum number of threads to return. It must return a CustomListDescriptor, or a promise which resolves to one.
 71 | 
 72 | | Parameters | Type | Description |
 73 | | :--- | :--- | :--- |
 74 | | **routeID** | `string` | Which route this handler is registering for. |
 75 | | **handler** | `function(offset, max)` | Passed a page offset and a maximum number of threads to return. Must return a CustomListDescriptor, or a promise which resolves to one. |
 76 | 
 77 | _Returns_ a `function` which removes the handler registration.
 78 | 
 79 | #### getCurrentRouteView()
 80 | _Returns_ a `RouteView` of the current route view
 81 | 
 82 | ---
 83 | ## RouteView
 84 | RouteViews represent pages within Gmail that a user can navigate to. RouteViews can be "custom", those that the application developer registers, or they can be "builtin" which are those that the email client natively supports like "Sent", "Drafts", or "Inbox"
 85 | 
 86 | This class mostly just gives you metadata about the route, most of the functionality to modify the route are defined in subclasses like ListRouteView and CustomRouteView, which you get by handling those types specifically in the Router.
 87 | 
 88 | ### Methods
 89 | #### getRouteID()
 90 | _Returns_ a `string` of the ID of the RouteView. This is the same routeID that you give Router.goto() or Router.createLink(). This will be a value from NativeRouteIDs.
 91 | 
 92 | #### getRouteType()
 93 | _Returns_ a `string` of the type of the route. This will be one of the values in RouteTypes.
 94 | 
 95 | #### getParams()
 96 | _Returns_ an `Object` of the URL parameters of this RouteView instance. This will be an object where the properties are strings.
 97 | 
 98 | 
 99 | ### Events
100 | #### destroy
101 | Fires when this RouteView instance is navigated away from
102 | 
103 | ### Properties
104 | | Property | Type | Description | Required? | Default |
105 | | :--- | :--- | :--- | :--- | :--- |
106 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
107 | 
108 | 
109 | 
110 | 
111 | 
112 | ---
113 | ## CustomRouteView
114 | Extends `RouteView`. CustomRouteViews represent your own custom pages of content.
115 | ### Methods
116 | #### getElement()
117 | _Returns_ a `HTMLElement` of the element representing the content area of this CustomRouteView. You should inject your content into this element.
118 | 
119 | 
120 | 
121 | ---
122 | ## ListRouteView
123 | Extends `RouteView`. ListRouteViews represent pages within Gmail that show a list of emails. Typical examples are the Inbox, Sent Mail, Drafts, etc. However, views like the Conversation view or Settings would *not* be a ListRouteView.
124 | 
125 | ### Methods
126 | #### addCollapsibleSection(options)
127 | Adds a collapsible section to the top of the page.
128 | 
129 | | Parameters | Type | Description |
130 | | :--- | :--- | :--- |
131 | | **options** | `SectionDescriptor` or `Stream(SectionDescriptor)` | configuration options of the CollapsibleSectionView |
132 | 
133 | _Returns_ a `CollapsibleSectionView`
134 | 
135 | #### addSection(options)
136 | Adds a non-collapsible section to the top of the page.
137 | 
138 | | Parameters | Type | Description |
139 | | :--- | :--- | :--- |
140 | | **options** | `SectionDescriptor` or `Stream(SectionDescriptor)` | configuration options of the SectionView |
141 | 
142 | _Returns_ a `SectionView`
143 | 
144 | #### refresh()
145 | Simulates a click on the Gmail thread list refresh button.
146 | 
147 | 
148 | 
149 | 
150 | ---
151 | ## SectionView
152 | SectionViews allow you to display additional content on ListRouteViews. They are typically rendered as additional content above the list of threads below. The visual style is similar to that of multiple inbox sections used in native Gmail. Note that the rendering may vary slightly depending on the actual ListRouteView that the SectionView is rendered in. For example, SectionViews rendered on search results pages use different header styles to match Gmail's style more accurately.
153 | 
154 | You can either render rows (that are visually similar to Gmail rows) or custom content in your SectionView. Until content is provided, the SectionView will simply display a "Loading..." indicator. See ListRouteView.addSection for more information.
155 | ### Methods
156 | #### remove()
157 | Removes this section from the current Route.
158 | 
159 | ### Events
160 | #### destroy
161 | Fires when the SectionView is no longer visible.
162 | 
163 | ### Properties
164 | 
165 | | Property | Type | Description | Required? | Default |
166 | | :--- | :--- | :--- | :--- | :--- |
167 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
168 | 
169 | 
170 | 
171 | 
172 | ---
173 | ## CollapsibleSectionView
174 | Extends `SectionView`. CollapsibleSectionViews allow you to display additional content on ListRouteViews. They are typically rendered as additional content above the list of threads below. The visual style is similar to that of multiple inbox sections used in native Gmail. Note that the rendering may vary slightly depending on the actual ListRouteView that the CollapsibleSectionView is rendered in. For example, CollapsibleSectionViews rendered on search results pages use different header styles to match Gmail's style more accurately.
175 | 
176 | You can either render rows (that are visually similar to Gmail rows) or custom content in your CollapsibleSectionView. Until content is provided, the SectionView will simply display a "Loading..." indicator. See ListRouteView.addCollapsibleSection for more information.
177 | ### Methods
178 | #### setCollapsed(value)
179 | 
180 | | Parameters | Type | Description |
181 | | :--- | :--- | :--- |
182 | | **value** | `boolean` | Whether to collapse (minimize) the section view. |
183 | 
184 | #### remove()
185 | Removes this section from the current Route
186 | 
187 | ### Events
188 | #### destroy
189 | Fires when the CollapsibleSectionView is no longer visible.
190 | 
191 | #### expanded
192 | Fires when the CollapsibleSectionView is expanded.
193 | 
194 | #### collapsed
195 | Fires when the CollapsibleSectionView is collapsed.
196 | 
197 | 
198 | 
199 | 
200 | 
201 | ---
202 | ## CustomListDescriptor
203 | This type is returned from the handler function passed to Router.handleCustomListRoute() as a way to configure the custom list route.
204 | 
205 | | Property | Type | Description | Required? | Default |
206 | | :--- | :--- | :--- | :--- | :--- |
207 | | **threads** | `Array<(ThreadDescriptor|String)>` | An array of threads to display in the custom list view. Each thread may be in the form of a ThreadDescriptor object or a string that is: 1. A Gmail Thread ID. 2. A message's Message-ID header (which must start with "<" and end with ">"). | Yes |  |
208 | | **total** | `Number` | The total number of threads in the custom list view. Note that this is different from the number of threads currently shown on the page (e.g. there may only be 50 threads currently shown on the page but 150 total threads in the list, in this case total would be 150). If you won't know the total number until you've reached the end of the list (e.g. you're fetching data from a search API where calculating a total is expensive), omit this property and use hasMore instead. | No | `null` |
209 | | **hasMore** | `Boolean` | A boolean representing whether or not there are more threads to be shown after the currently shown threads. Use this when you won't know the total number of threads until you've reached the end of the list. If you already know the total number of threads in the list (not just the ones currently shown), omit this proeprty and use total instead. | No | `null` |
210 | 
211 | 
212 | 
213 | ---
214 | ## ThreadDescriptor
215 | An object used to describe a specific thread (e.g. when creating a custom list via Router.handleCustomListRoute()). At least one property must be present to identify a thread.
216 | 
217 | | Property | Type | Description | Required? | Default |
218 | | :--- | :--- | :--- | :--- | :--- |
219 | | **rfcMessageId** | `String` | The value of a message's Message-ID header (which must start with "<" and end with ">"). | No | `null` |
220 | | **gmailThreadId** | `String` | The Gmail thread ID of a message. | No | `null` |
221 | 
222 | 
223 | 
224 | ---
225 | ## SectionDescriptor
226 | The properties required to create a SectionView or CollapsibleSectionView.
227 | 
228 | | Property | Type | Description | Required? | Default |
229 | | :--- | :--- | :--- | :--- | :--- |
230 | | **title** | `string` | Main title | Yes |  |
231 | | **subtitle** | `string` | Subtitle | No | `null` |
232 | | **titleLinkText** | `string` | Link to display in the summary area of the SectionView. Typically page counts are displayed here. | No | `null` |
233 | | **onTitleLinkClick** | `function` | A function to call when the title link has been clicked. | No | `null` |
234 | | **hasDropdown** | `boolean` | Whether to display a dropdown arrow for more options on the collapsible section. | No | `false` |
235 | | **onDropdownClick** | `function(event)` | A function to call when the dropdown is opened. Your function is passed an event object with a single dropdown property. | No | `null` |
236 | | **tableRows** | `Array<RowDescriptor>` | The rows that should be shown. | No | `null` |
237 | | **contentElement** | `HTMLElement` | An arbitrary HTML element to place above the table rows but below the title. | No | `null` |
238 | | **footerLinkText** | `string` | A link to place in the footer of the SectionView. | No | `null` |
239 | | **onFooterLinkClick** | `function(event)` | A function to call when the link in the footer is clicked. | No | `null` |
240 | 
241 | 
242 | 
243 | ---
244 | ## RowDescriptor
245 | Represents the a single row to render in SectionViews and CollapsibleSectionViews
246 | 
247 | | Property | Type | Description | Required? | Default |
248 | | :--- | :--- | :--- | :--- | :--- |
249 | | **title** | `string` | First textual column | Yes |  |
250 | | **body** | `string` | Second textual column | Yes |  |
251 | | **shortDetailText** | `string` | Last text right-aligned. Often used for dates. | Yes |  |
252 | | **isRead** | `string` | Whether the row should be rendered as read or unread similar to Gmail styles. | Yes |  |
253 | | **labels** | `Array<LabelDescriptor>` | Any labels that should be rendered. | Yes |  |
254 | | **iconHtml** | `string` | An optional HTML to an icon to display on the left side of the row | No | `null` |
255 | | **iconUrl** | `string` | An optional url to an icon to display on the left side of the row | No | `null` |
256 | | **iconClass** | `string` | An optional class to apply to the icon. | No | `null` |
257 | | **routeID** | `string` | The name of the route to navigate to when the row is clicked on. | No | `null` |
258 | | **routeParams** | `Array<string>` | The parameters of the route being navigated to when the row is clicked on. | No | `null` |
259 | | **onClick** | `function` | Callback for when the row is clicked on. | No | `null` |
260 | 
261 | 
262 | ---
263 | ## Enums and Constants
264 | ### NativeRouteIDs
265 | All the different route types that exist in Gmail
266 | 
267 | | Enum | Description |
268 | | :--- | :--- |
269 | | **INBOX** | inbox list, Permissible Route Params: page (optional) |
270 | | **ALL_MAIL** | all mail list, Permissible Route Params: page (optional) |
271 | | **SENT** | sent list, Permissible Route Params: page (optional) |
272 | | **STARRED** | starred list, Permissible Route Params: page (optional) |
273 | | **DRAFTS** | drafts list, Permissible Route Params: page (optional) |
274 | | **LABEL** | any label list, Permissible Route Params: labelName, page (optional), |
275 | | **TRASH** | trash list, Permissible Route Params: page (optional) |
276 | | **SPAM** | spam list, Permissible Route Params: page (optional) |
277 | | **IMPORTANT** | built in list of important emails, Permissible Route Params: page (optional) |
278 | | **SEARCH** | any search results page, Permissible Route Params: query, page (optional) |
279 | | **THREAD** | single conversation view, Permissible Route Params: threadID |
280 | | **CHATS** | list of chats, Permissible Route Params: page (optional) |
281 | | **CHAT** | single chat view, Permissible Route Params: chatID |
282 | | **CONTACTS** | google contacts view, Permissible Route Params: page (optional) |
283 | | **CONTACT** | single google contact view, Permissible Route Params: contactID |
284 | | **SETTINGS** | the settings view, Permissible Route Params: section |
285 | | **ANY_LIST** | this refers to any of the above lists |
286 | 
287 | 
288 | 
289 | 
290 | 
291 | 
292 | ### NativeListRouteIDs
293 | The different list routes natively available in Gmail. List routes display lists of threads or messages or other types.
294 | 
295 | | Enum | Description |
296 | | :--- | :--- |
297 | | **INBOX** | inbox list, Permissible Route Params: page (optional) |
298 | | **ALL_MAIL** | all mail list, Permissible Route Params: page (optional) |
299 | | **SENT** | sent list, Permissible Route Params: page (optional) |
300 | | **STARRED** | starred list, Permissible Route Params: page (optional) |
301 | | **DRAFTS** | drafts list, Permissible Route Params: page (optional) |
302 | | **LABEL** | any label list, Permissible Route Params: labelName, page (optional), |
303 | | **TRASH** | trash list, Permissible Route Params: page (optional) |
304 | | **SPAM** | spam list, Permissible Route Params: page (optional) |
305 | | **IMPORTANT** | built in list of important emails, Permissible Route Params: page (optional) |
306 | | **SEARCH** | any search results page, Permissible Route Params: query, page (optional) |
307 | | **ANY_LIST** | This refers to any of the above lists |
308 | 
309 | ### RouteTypes
310 | The different route types that exist
311 | 
312 | | Enum | Description |
313 | | :--- | :--- |
314 | | **LIST** | a list of threads or messages |
315 | | **THREAD** | a single thread or message |
316 | | **SETTINGS** | a Gmail settings page |
317 | | **CHAT** | a single chat history |
318 | | **CUSTOM** | a custom route created by any app |
319 | | **UNKNOWN** | an unknown route |


--------------------------------------------------------------------------------
/docs/search.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | id: search-docs
 3 | title: Search
 4 | ---
 5 | This namespace allows you to interact with Gmail's default search behaviour. It allows for two use cases: 1) To provide autocomplete suggestions as the user types in their query and 2) To rewrite sarch queries.
 6 | 
 7 | ### Namespace methods
 8 | #### registerSearchSuggestionsProvider(handler)
 9 | Registers a search autocomplete suggestion provider. This allows you to add results to Gmails autocomplete results when a user types into a search box. Each providers results are visually seperated from each other in the UI.
10 | 
11 | | Parameters | Type | Description |
12 | | :--- | :--- | :--- |
13 | | **handler** | `function` | A handler that takes in a string query and returns an Array (or Promise for one) of AutocompleteSearchResults. |
14 | 
15 | #### registerSearchQueryRewriter(rewriter)
16 | Allows you to rewrite certain queries that may be typed in or programatically set. If a user types in a search, their search term will still be visible but the search that is actually executed by Gmails servers will be what you rewrite the query to.
17 | 
18 | | Parameters | Type | Description |
19 | | :--- | :--- | :--- |
20 | | **rewriter** | `SearchQueryRewriter` | A rewriter object that specifies the term to rewrite and a function to get the new query. |
21 | 
22 | 
23 | 
24 | 
25 | 
26 | --
27 | ## AutocompleteSearchResult
28 | This type is returned by the function you pass into the Search.registerSearchSuggestionsProvider() method as a way to add autocomplete suggestions to the Gmail search box.
29 | 
30 | | Property | Type | Description | Required? | Default |
31 | | :--- | :--- | :--- | :--- | :--- |
32 | | **name** | `string` | The name of the result to display. This property or nameHTML must be set. | No | `null` |
33 | | **nameHTML** | `string` | HTML to display in the name area of the result. This property or name must be set. | No | `null` |
34 | | **description** | `string` | The name of the result to display. This property or descriptionHTML must be set. | No | `null` |
35 | | **descriptionHTML** | `string` | HTML to display in the name area of the result. This property or description must be set. | No | `null` |
36 | | **iconUrl** | `string` | URL for the icon to show in the result. Should be a local extension file URL or a HTTPS url. | No | `null` |
37 | | **iconHTML** | `string` | HTML to display in the icon area of the result. This property can not be used with iconUrl. | No | `null` |
38 | | **routeName** | `string` | The name of the route to navigate to when the autocomplete search result is selected. | No | `null` |
39 | | **routeParams** | `Array<string>` | The parameters of the route being navigated to when the autocomplete search result is selected. | No | `[]` |
40 | | **externalURL** | `string` | An external URL to navigate to when the autocomplete search result is selected. | No | `null` |
41 | | **onClick** | `func()` | A function to call when the autocomplete search result is selected. | No | `null` |
42 | 
43 | 
44 | 
45 | 
46 | 
47 | 
48 | 
49 | 
50 | --
51 | ## SearchQueryRewriter
52 | This type is passed into the Search.registerSearchQueryRewriter() method as a way to add rewrite search queries.
53 | 
54 | | Property | Type | Description | Required? | Default |
55 | | :--- | :--- | :--- | :--- | :--- |
56 | | **term** | `string` | The query term that you'd like to rewrite/replace. No wildcards are currently supported. Currently it must begin with "app:" or "has:". | Yes |  |
57 | | **termReplacer** | `function` | A function which returns a String (or Promise for a string) to replace the specified term in the search query. | Yes |  |
58 | 


--------------------------------------------------------------------------------
/docs/toolbars.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Toolbars
  3 | ---
  4 | The Toolbar namespace allows you to add your own buttons and actions to various toolbars in Gmail or Inbox. Toolbars appear in various Lists, ThreadViews and MessageViews. Within a toolbar, you have control over the placement of your buttons.
  5 | 
  6 | Toolbar buttons are typically used to take actions on the email(s) that the toolbar applies to. Do not use this API to add buttons that don't take a direct action on the selected email.
  7 | Since toolbar buttons only apply to emails, they will ONLY appear when an email is selected or you are on a ThreadView.
  8 | 
  9 | ### Namespace methods
 10 | #### registerThreadButton(toolbarButtonDescriptor)
 11 | Registers a toolbar button to appear on thread rows, above the thread list when some rows are checked, and above threads.
 12 | 
 13 | | Parameters | Type | Description |
 14 | | :--- | :--- | :--- |
 15 | | **toolbarButtonDescriptor** | `ToolbarButtonDescriptor` | The options for the button. |
 16 | 
 17 | _Returns_ a `function` which removes the button registration.
 18 | 
 19 | #### registerToolbarButtonForList(toolbarButtonDescriptor)
 20 | (This function is deprecated in favor of registerThreadButton.) Registers a toolbar button to appear above any list page such as the Inbox or Sent Mail.
 21 | 
 22 | | Parameters | Type | Description |
 23 | | :--- | :--- | :--- |
 24 | | **toolbarButtonDescriptor** | `LegacyToolbarButtonDescriptor` | The options for the button. |
 25 | 
 26 | _Returns_ a `function` which removes the button registration.
 27 | 
 28 | #### registerToolbarButtonForThreadView(toolbarButtonDescriptor)
 29 | (This function is deprecated in favor of registerThreadButton.) Registers a toolbar button to appear when viewing a thread.
 30 | 
 31 | | Parameters | Type | Description |
 32 | | :--- | :--- | :--- |
 33 | | **toolbarButtonDescriptor** | `LegacyToolbarButtonDescriptor` | The options for the button. |
 34 | 
 35 | _Returns_ a `function` which removes the button registration.
 36 | 
 37 | #### addToolbarButtonForApp(appToolbarButtonDescriptor)
 38 | Adds a button and dropdown to the "Global Toolbar". This is typically used to show a dropdown with general information about your application. In Gmail this refers to the navigation area at the top right of the window.
 39 | 
 40 | | Parameters | Type | Description |
 41 | | :--- | :--- | :--- |
 42 | | **appToolbarButtonDescriptor** | `AppToolbarButtonDescriptor` | The options for the app toolbar button |
 43 | 
 44 | _Returns_ a `AppToolbarButtonView`
 45 | 
 46 | ## ToolbarButtonDescriptor
 47 | This type is passed into the Toolbars.registerThreadButton() to configure the toolbar button shown.
 48 | 
 49 | | Property | Type | Description | Required? | Default |
 50 | | :--- | :--- | :--- | :--- | :--- |
 51 | | **title** | `string` | Text to show when the user hovers the mouse over the button, or to show on the button when the user has the Gmail "Button labels" setting set to "Text". | Yes |  |
 52 | | **iconUrl** | `string` | URL for the icon to show on the button. Should be a local extension file URL or a HTTPS URL. Either this property, iconClass, or both must be specified. | No | `null` |
 53 | | **iconClass** | `string` | An optional class to apply to the icon. Either this property, iconUrl, or both must be specified. | No | `null` |
 54 | | **positions** | `Array<string>` | An optional array of strings specifying the locations the button will be displayed in. The default value of null is treated as equal to the array of all of the possible values: "THREAD", "ROW", and "LIST". | No | `null` |
 55 | | **threadSection** | `SectionNames` | The section of the toolbar to place the button when placing it on a thread. Currently this option only has an effect in Gmail. | No | `'METADATA_STATE'` |
 56 | | **listSection** | `SectionNames` | The section of the toolbar to place the button when placing it above a thread list. Currently this option only has an effect in Gmail. | No | `'METADATA_STATE'` |
 57 | | **onClick** | `function(event)` | This is called when the button is clicked, and gets passed an event object. The event object will have a position property set to 'THREAD', 'ROW', or 'LIST' specifying where the button was that was interacted with. The event object will have selectedThreadViews (ThreadView[]) and selectedThreadRowViews (ThreadRowView[]) properties containing the thread or thread row objects that this button was activated on. The event object will have a dropdown (DropdownView) property if the hasDropdown property was set to true on the button descriptor. | Yes |  |
 58 | | **hasDropdown** | `boolean` | If true, the button will open a dropdown menu above it, and the event object will have a dropdown property of type DropdownView that allows the dropdown to be customized when opened. | No | `false` |
 59 | | **hideFor** | `function(RouteView)` | A function that determines when this toolbar button should be hidden. You may want to hide the toolbar button on certain Routes or in certain conditions. The function should return true when the toolbar button should be hidden. Your function is passed a RouteView. | No | `null` |
 60 | | **orderHint** | `number` | If multiple buttons are placed next to each other, then they will be ordered by this value. | No | `0` |
 61 | | **keyboardShortcutHandle** | `keyboardShortcutHandle` | The keyboard shortcut that will activate this button. This is currently only supported in Gmail. | No | `null` |
 62 | 
 63 | 
 64 | 
 65 | ## LegacyToolbarButtonDescriptor
 66 | This type is passed into the Toolbars.registerToolbarButtonForList() and Toolbars.registerToolbarButtonForThreadView() method as a way to configure the toolbar button shown.
 67 | 
 68 | | Property | Type | Description | Required? | Default |
 69 | | :--- | :--- | :--- | :--- | :--- |
 70 | | **title** | `string` | Text to show when the user hovers the mouse over the button, or to show on the button when the user has the Gmail "Button labels" setting set to "Text". | Yes |  |
 71 | | **iconUrl** | `string` | URL for the icon to show on the button. Should be a local extension file URL or a HTTPS URL. Either this property, iconClass, or both must be specified. | No | `null` |
 72 | | **iconClass** | `string` | An optional class to apply to the icon. Either this property, iconUrl, or both must be specified. | No | `null` |
 73 | | **section** | `SectionNames` | The section of the toolbar to place the button. | Yes |  |
 74 | | **onClick** | `function(event)` | This is called when the button is clicked, and gets passed an event object. If this was registered with Toolbars.registerToolbarButtonForList(), then the event object will have a selectedThreadRowViews (ThreadRowView[]) property and a threadRowViews (ThreadRowView[]) property. If this was registered with Toolbars.registerToolbarButtonForThreadView(), then the event object will have a threadView (ThreadView) property. In both cases the event object will optionally have a dropdown (DropdownView) property if you set the hasDropdown property to true on the descriptor | Yes |  |
 75 | | **hasDropdown** | `boolean` | If true, the button will open a dropdown menu above it, and the event object will have a dropdown property of type DropdownView that allows the dropdown to be customized when opened. | No | `false` |
 76 | | **hideFor** | `function(RouteView)` | A function that determines when this toolbar button should be hidden. You may want to hide the toolbar button on certain Routes or in certain conditions. The function should return true when the toolbar button should be hidden. Your function is passed a RouteView. | No | `null` |
 77 | | **keyboardShortcutHandle** | `keyboardShortcutHandle` | The keyboard shortcut that will activate this button. | No | `null` |
 78 | 
 79 | 
 80 | ## AppToolbarButtonDescriptor
 81 | This type is passed into the Toolbars.addToolbarButtonForApp() method as a way to configure the toolbar button shown.
 82 | 
 83 | | Property | Type | Description | Required? | Default |
 84 | | :--- | :--- | :--- | :--- | :--- |
 85 | | **title** | `string` | Text to show on the button. | Yes |  |
 86 | | **titleClass** | `string` | An optional class to apply to the title. | No | `null` |
 87 | | **iconUrl** | `string` | URL for the icon to show on the button. Should be a local extension file URL or a HTTPS URL. | Yes |  |
 88 | | **iconClass** | `string` | An optional class to apply to the icon. | No | `null` |
 89 | | **onClick** | `function(event)` | This is called when the button is clicked, and gets passed an event object. The event object will have a dropdown (DropdownView) property. | Yes |  |
 90 | | **arrowColor** | `string` | The color to use for the top arrow of the dropdown. Useful if you want the contents of your dropdown to have a specific background color | No | `null` |
 91 | 
 92 | 
 93 | ## AppToolbarButtonView
 94 | Object that represents an app toolbar button that has been already added to the top navigation area of Gmail. This class is returned by Toolbars.addToolbarButtonForApp().
 95 | 
 96 | ### Methods
 97 | #### open()
 98 | Open the dropdown for the app toolbar button
 99 | 
100 | #### close()
101 | Close the dropdown for the app toolbar button
102 | 
103 | #### remove()
104 | Remove the app toolbar button from Gmail
105 | 
106 | 
107 | ### Events
108 | #### destroy
109 | Fires when this view has been removed.
110 | 
111 | ### Properties
112 | 
113 | | Property | Type | Description | Required? | Default |
114 | | :--- | :--- | :--- | :--- | :--- |
115 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
116 | 
117 | 
118 | ## Enums and Constants
119 | ### SectionNames
120 | The different toolbar sections that exist
121 | 
122 | | Enum | Description |
123 | | :--- | :--- |
124 | | **INBOX_STATE** | The section is for buttons that move emails out of or into the users inbox. |
125 | | **COLLAPSED** | This section is for buttons that alter metadata of emails. Common examples are labeling or moving an email. |
126 | | **METADATA_STATE** | This sectiom is used for other actions. Typically these will be placed in the "More" menu. |
127 | 


--------------------------------------------------------------------------------
/docs/user.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: User
 3 | ---
 4 | This namespace contains methods and types related to the currently logged in user.
 5 | 
 6 | ### Namespace methods
 7 | #### getEmailAddress()
 8 | _Returns_ a `string` of the email address of the currently logged in user.
 9 | 
10 | #### isConversationViewDisabled()
11 | _Returns_ a `boolean` whether conversation view disabled by the user
12 | 
13 | #### getLanguage()
14 | _Returns_ a `string` of the current locale code of Gmail
15 | 
16 | 


--------------------------------------------------------------------------------
/docs/widgets.md:
--------------------------------------------------------------------------------
  1 | ---
  2 | title: Widgets
  3 | ---
  4 | This namespace contains functions for creating various widgets that are styled to look and feel native to Gmail.
  5 | 
  6 | ### Namespace methods
  7 | #### isMoleViewTitleBarLightColor()
  8 | Returns true if the mole view has a light color title bar as part of Gmail's "new view" styling, and returns false if the Compose has a dark title bar.
  9 | 
 10 | #### showModalView(options)
 11 | This creates a ModalView and shows it. You can insert an arbitrary HTMLElement for content of the modal.
 12 | 
 13 | | Parameters | Type | Description |
 14 | | :--- | :--- | :--- |
 15 | | **options** | `ModalOptions` | The options to configure the returned ModalView. |
 16 | 
 17 | _Returns_ a `ModalView`
 18 | 
 19 | #### showMoleView(options)
 20 | This creates a MoleView and shows it. A mole view is a modal that is attached to the bottom of the viewport and has minimize and close buttons just like a compose view. Use isMoleViewTitleBarLightColor() to determine the color of the view titlebar if you need to know whether to place light or dark images inside the titlebar.
 21 | 
 22 | | Parameters | Type | Description |
 23 | | :--- | :--- | :--- |
 24 | | **options** | `MoleOptions` | The options to configure the returned MoleView. |
 25 | 
 26 | _Returns_ a `MoleView`
 27 | 
 28 | #### showDrawerView(options)
 29 | This creates a DrawerView and shows it. A drawer view is a panel that slides in from the right side of the screen, and it fades the rest of the screen out. By default, it has a title and a close button.
 30 | 
 31 | | Parameters | Type | Description |
 32 | | :--- | :--- | :--- |
 33 | | **options** | `DrawerOptions` | The options to configure the returned DrawerView. |
 34 | 
 35 | _Returns_ a `DrawerView`
 36 | 
 37 | 
 38 | ---
 39 | ## ModalOptions
 40 | The options used to configure a modal when calling Widgets.showModalView().
 41 | 
 42 | | Property | Type | Description | Required? | Default |
 43 | | :--- | :--- | :--- | :--- | :--- |
 44 | | **el** | `HTMLElement` | An HTMLElement representing the content you'd like to put inside the modal | Yes |  |
 45 | | **chrome** | `boolean` | Whether to show the close (X) button in the top right of the Modal as well as padding around your content. | No | `true` |
 46 | | **constrainTitleWidth** | `boolean` | If true, then the modal's width is determined solely by the content and not the title's width, and the title's text is line-wrapped if necessary. | No | `false` |
 47 | | **showCloseButton** | `boolean` | When chrome is set to false, this option controls whether a close (X) button should be added to the modal anyway. If chrome is set to true then this property doesn't do anything. | No | `false` |
 48 | | **title** | `string` | Text to show as the title of the modal | No | `''` |
 49 | | **buttons** | `Array<ModalButtonDescriptor>` | An array of buttons to add to the modal. The UI will be consistent with native Gmail buttons. If none are provided, your el will occupy all of the modal. There may only be one button with a type of PRIMARY_ACTION, see ModalButtonDescriptor docs | No | `[]` |
 50 | 
 51 | 
 52 | 
 53 | 
 54 | 
 55 | 
 56 | ---
 57 | ## ModalButtonDescriptor
 58 | The options to use to configure buttons in a modal.
 59 | 
 60 | | Property | Type | Description | Required? | Default |
 61 | | :--- | :--- | :--- | :--- | :--- |
 62 | | **text** | `string` | The text displayed in the button. | Yes |  |
 63 | | **title** | `string` | Text to show when the user hovers the mouse over the button. | Yes |  |
 64 | | **onClick** | `function` | This is called when the button is clicked. | Yes |  |
 65 | | **type** | `string` | There are currently two supported types of modal buttons, PRIMARY_ACTION and SECONDARY action. There may only be one PRIMARY_ACTION button per modal. | No | `SECONDARY_ACTION` |
 66 | | **color** | `string` | Color of the modal button. Only 'blue', 'red', or 'green' string values are valid. | No | `null` |
 67 | | **orderHint** | `number` | If multiple buttons are placed next to each other, then they will be ordered by this value. | No | `0` |
 68 | 
 69 | 
 70 | 
 71 | 
 72 | 
 73 | 
 74 | ---
 75 | ## MoleOptions
 76 | The options used to configure a modal when calling Widgets.showMoleView().
 77 | 
 78 | | Property | Type | Description | Required? | Default |
 79 | | :--- | :--- | :--- | :--- | :--- |
 80 | | **el** | `HTMLElement` | An HTMLElement representing the content to put inside the mole view. | Yes |  |
 81 | | **title** | `string` | Text that the modal should start with as the title. | No | `''` |
 82 | | **titleEl** | `HTMLElement` | An HTMLElement to place in the title bar instead of the title text. | No |  |
 83 | | **minimizedTitleEl** | `HTMLElement` | An HTMLElement to place in the title bar when the mole is minimized instead of the title text. | No |  |
 84 | | **className** | `string` | Extra CSS class names to add to the mole widget. | No | `''` |
 85 | | **titleButtons** | `Array<MoleButtonDescriptor>` | An array of buttons to add to the mole widget between the minimize and close buttons in the title bar. | No | `[]` |
 86 | | **chrome** | `boolean` | When chrome is set to false then the header of the mole is not rendered. This includes the title and mimize/close buttons. This means the app is totally responsible for the look and behavior of the mole, while the SDK is responsible only for the positioning. | No | `true` |
 87 | 
 88 | 
 89 | 
 90 | 
 91 | 
 92 | 
 93 | ---
 94 | ## MoleButtonDescriptor
 95 | The options to use to configure buttons in a mole.
 96 | 
 97 | | Property | Type | Description | Required? | Default |
 98 | | :--- | :--- | :--- | :--- | :--- |
 99 | | **title** | `string` | Text to show when the user hovers the mouse over the button. | Yes |  |
100 | | **iconUrl** | `string` | URL for the icon to show on the button. Should be a local extension file URL or a HTTPS URL. The image will be displayed with a height and width of 24px. | Yes |  |
101 | | **iconClass** | `string` | An optional class to apply to the icon. | No |  |
102 | | **onClick** | `function` | This is called when the button is clicked. | Yes |  |
103 | 
104 | 
105 | 
106 | 
107 | 
108 | 
109 | 
110 | ---
111 | ## DrawerOptions
112 | The options used to configure a drawer when calling Widgets.showDrawerView().
113 | 
114 | | Property | Type | Description | Required? | Default |
115 | | :--- | :--- | :--- | :--- | :--- |
116 | | **el** | `HTMLElement` | An HTMLElement representing the content you'd like to put inside the drawer. Use the CSS property "flex-grow: 1" on it if you want it to expand to the available space in the drawer. | Yes |  |
117 | | **chrome** | `boolean` | Whether to show the close (X) button and the title at the top of the drawer. | No | `true` |
118 | | **title** | `string` | Text to show as the title of the drawer. Not shown if chrome is set to false. | No |  |
119 | | **composeView** | `ComposeView` | You can optionally specify a ComposeView to associate with the DrawerView. The ComposeView will be interactable next to the DrawerView instead of being blocked. Using this option will animate the ComposeView into position along with the opening DrawerView unlike the DrawerView.associateComposeView() method. | No |  |
120 | | **closeWithCompose** | `boolean` | If this is true, then if any associated ComposeView is closed or otherwise becomes inaccessible, then the DrawerView will close too. | No | `false` |
121 | | **matchSidebarContentPanelWidth** | `boolean` | When true, uses a slimmer drawer that matches the width of the sidebar content panel. | No | `false` |
122 | 
123 | 
124 | 
125 | 
126 | 
127 | 
128 | 
129 | ---
130 | ## ModalView
131 | Represents a modal dialog.
132 | 
133 | ### Methods
134 | #### close()
135 | This closes the modal. Does nothing if already closed.
136 | 
137 | ### Events
138 | #### destroy
139 | Fires when this ModalView instance is closed.
140 | 
141 | ### Properties
142 | 
143 | | Property | Type | Description | Required? | Default |
144 | | :--- | :--- | :--- | :--- | :--- |
145 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
146 | 
147 | 
148 | 
149 | 
150 | 
151 | 
152 | 
153 | ---
154 | ## MoleView
155 | Represents a mole view. These are modals attached to the bottom of the viewport, like a compose view.
156 | 
157 | ### Methods
158 | #### close()
159 | This closes the mole view. Does nothing if already closed.
160 | 
161 | #### setTitle(text)
162 | This allows the title to be changed.
163 | 
164 | | Parameters | Type | Description |
165 | | :--- | :--- | :--- |
166 | | **text** | `string` |  |
167 | 
168 | #### setMinimized(minimized)
169 | This allows the minimize state to be changed.
170 | 
171 | | Parameters | Type | Description |
172 | | :--- | :--- | :--- |
173 | | **minimized** | `boolean` | If true, the mole view will be minimized. |
174 | 
175 | #### getMinimized()
176 | _Returns_ a `boolean` of the minimize state
177 | 
178 | 
179 | ### Events
180 | #### destroy
181 | Fires when this MoleView instance is closed.
182 | 
183 | 
184 | #### minimize
185 | Fires when this MoleView instance is minimized.
186 | 
187 | 
188 | #### restore
189 | Fires when this MoleView instance is restored.
190 | 
191 | 
192 | ### Properties
193 | 
194 | | Property | Type | Description | Required? | Default |
195 | | :--- | :--- | :--- | :--- | :--- |
196 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
197 | 
198 | 
199 | 
200 | 
201 | 
202 | 
203 | ---
204 | ## DrawerView
205 | Represents a drawer panel.
206 | 
207 | ### Methods
208 | #### close()
209 | This closes the drawer. Does nothing if already closed.
210 | 
211 | #### associateComposeView(composeView, closeWithCompose)
212 | This method allows a compose view to be associated with a pre-existing drawer. The compose view will be usable and shown next to the drawer instead of being hidden behind it.
213 | 
214 | | Parameters | Type | Description |
215 | | :--- | :--- | :--- |
216 | | **composeView** | `ComposeView` |  |
217 | | **closeWithCompose** | `boolean` | Controls whether the DrawerView should close if the ComposeView is closed or otherwise becomes inaccessible. |
218 | 
219 | #### disassociateComposeView()
220 | If there is a ComposeView currently associated, this will remove its association and visually place the ComposeView back behind the darkened DrawerView backdrop.
221 | 
222 | ### Events
223 | #### slideAnimationDone
224 | Fires when this DrawerView instance is visible and in position.
225 | 
226 | #### closing
227 | Fires when this DrawerView has started closing and animating to off-screen.
228 | 
229 | #### destroy
230 | Fires when this DrawerView instance is closed and not visible.
231 | 
232 | #### preautoclose
233 | Fires when this DrawerView instance is about to close itself in response to a user clicking outside of the drawer or pressing escape. This event may be canceled in order to stop the drawer from closing itself. You may want to do this if you want to show a confirmation dialog before the drawer closes.
234 | 
235 | | Event properties | Type | Description |
236 | | :--- | :--- | :--- |
237 | | **type** | `string` | This will be "outsideInteraction" if the cause is a click or focus outside of the DrawerView, or "escape" if the cause is the user pressing the Escape key. |
238 | | **cause** | `Event` | This is the DOM event that is triggering the DrawerView to auto-close. |
239 | | **cancel** | `function` | Calling this method will prevent this DrawerView from closing itself. |
240 | 
241 | 
242 | ### Properties
243 | 
244 | | Property | Type | Description | Required? | Default |
245 | | :--- | :--- | :--- | :--- | :--- |
246 | | **destroyed** | `boolean` | This property is set to true once the view is destroyed. | Yes |  |
247 | 
248 | 
249 | 
250 | 
251 | 


--------------------------------------------------------------------------------
/docusaurus.config.js:
--------------------------------------------------------------------------------
  1 | module.exports = {
  2 |   title: 'InboxSDK',
  3 |   tagline: 'Build apps inside of Gmail',
  4 |   url: 'https://inboxsdk.github.io',
  5 |   baseUrl: '/inboxsdk-docs/',
  6 |   onBrokenLinks: 'warn',
  7 |   onBrokenMarkdownLinks: 'warn',
  8 |   favicon: 'img/favicon.ico',
  9 |   organizationName: 'InboxSDK', // Usually your GitHub org/user name.
 10 |   projectName: 'inboxsdk-docs', // Usually your repo name.
 11 |   trailingSlash: true,
 12 |   themeConfig: {
 13 |     // algolia: {
 14 |     //   apiKey: '319308999ead35d0a17df976af4a951a',
 15 |     //   appId: 'inboxsdk',
 16 |     //   indexName: 'inboxsdk',
 17 |     //   searchParameters: {}, // Optional (if provided by Algolia)
 18 |     // },
 19 |     navbar: {
 20 |       title: 'InboxSDK Documentation',
 21 |       logo: {
 22 |         href: "/",
 23 |         alt: 'InboxSDK Logo',
 24 |         src: 'img/logo.svg',
 25 |       },
 26 |       items: [
 27 |         {
 28 |           href: 'https://github.com/InboxSDK/InboxSDK',
 29 |           position: 'right',
 30 |           className: 'header-github-link',
 31 |           'aria-label': 'GitHub repository',
 32 |         },
 33 |       ],
 34 |     },
 35 |     footer: {
 36 |       style: 'dark',
 37 |       links: [
 38 |         {
 39 |           title: 'Docs',
 40 |           items: [
 41 |             {
 42 |               label: 'Getting Started',
 43 |               to: 'getting-started',
 44 |             },
 45 |             {
 46 |               label: 'API Reference',
 47 |               to: 'api-reference',
 48 |             },
 49 |             {
 50 |               label: 'Resources',
 51 |               to: 'resources',
 52 |             },
 53 |             {
 54 |               label: 'Changelog',
 55 |               to: 'changelog',
 56 |             },
 57 |           ],
 58 |         },
 59 |         {
 60 |           title: 'Community',
 61 |           items: [
 62 |             {
 63 |               label: 'Twitter',
 64 |               href: 'https://twitter.com/inboxsdk',
 65 |             },
 66 |           ],
 67 |         },
 68 |         {
 69 |           title: 'More',
 70 |           items: [
 71 |             {
 72 |               label: 'GitHub',
 73 |               href: 'https://github.com/inboxsdk/inboxsdk-docs',
 74 |             },
 75 |           ],
 76 |         },
 77 |       ],
 78 |       copyright: `Copyright © ${new Date().getFullYear()} Rewardly, Inc. Brought to you by <a href="www.streak.com">Streak</a>`,
 79 |     },
 80 |   },
 81 |   presets: [
 82 |     [
 83 |       '@docusaurus/preset-classic',
 84 |       {
 85 |         docs: {
 86 |           routeBasePath: '/', 
 87 |           sidebarCollapsible: false,
 88 |           sidebarPath: require.resolve('./sidebars.js'),
 89 |           // Please change this to your repo.
 90 |           editUrl:
 91 |             'https://github.com/InboxSDK/inboxsdk-docs/edit/main',
 92 |         },
 93 |         theme: {
 94 |           customCss: require.resolve('./src/css/custom.css'),
 95 |         },
 96 |       },
 97 |     ],
 98 |   ],
 99 | };
100 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "inboxsdk-docs",
 3 |   "version": "0.0.0",
 4 |   "private": true,
 5 |   "scripts": {
 6 |     "docusaurus": "docusaurus",
 7 |     "start": "docusaurus start",
 8 |     "build": "docusaurus build",
 9 |     "swizzle": "docusaurus swizzle",
10 |     "deploy": "docusaurus deploy",
11 |     "serve": "docusaurus serve",
12 |     "clear": "docusaurus clear"
13 |   },
14 |   "dependencies": {
15 |     "@docusaurus/core": "2.1.0",
16 |     "@docusaurus/preset-classic": "2.1.0",
17 |     "@mdx-js/react": "^1.6.21",
18 |     "clsx": "^1.2.1",
19 |     "react": "^18.2.0",
20 |     "react-dom": "^18.2.0"
21 |   },
22 |   "browserslist": {
23 |     "production": [
24 |       ">0.5%",
25 |       "not dead",
26 |       "not op_mini all"
27 |     ],
28 |     "development": [
29 |       "last 1 chrome version",
30 |       "last 1 firefox version",
31 |       "last 1 safari version"
32 |     ]
33 |   }
34 | }


--------------------------------------------------------------------------------
/sidebars.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   someSidebar: [
 3 |     'getting-started', 
 4 |     {'API Reference':[
 5 |       "inboxsdk-star",
 6 |       "compose",
 7 |       "lists",
 8 |       "conversations",
 9 |       "toolbars",
10 |       "router",
11 |       "appmenu",
12 |       "navmenu",
13 |       "widgets",
14 |       "butterbar",
15 |       "search-docs",
16 |       "user",
17 |       "global",
18 |       "keyboard-shortcuts",
19 |       "common-data-types"      
20 |     ]}, 
21 |     'resources', 
22 |     'changelog'
23 |   ]
24 | };


--------------------------------------------------------------------------------
/src/css/custom.css:
--------------------------------------------------------------------------------
 1 | /* stylelint-disable docusaurus/copyright-header */
 2 | /**
 3 |  * Any CSS included here will be global. The classic template
 4 |  * bundles Infima by default. Infima is a CSS framework designed to
 5 |  * work well for content-centric websites.
 6 |  */
 7 | 
 8 | /* You can override the default Infima variables here. */
 9 | :root {
10 |   --ifm-color-primary: #25c2a0;
11 |   --ifm-color-primary-dark: rgb(33, 175, 144);
12 |   --ifm-color-primary-darker: rgb(31, 165, 136);
13 |   --ifm-color-primary-darkest: rgb(26, 136, 112);
14 |   --ifm-color-primary-light: rgb(70, 203, 174);
15 |   --ifm-color-primary-lighter: rgb(102, 212, 189);
16 |   --ifm-color-primary-lightest: rgb(146, 224, 208);
17 |   --ifm-code-font-size: 95%;
18 | }
19 | 
20 | .docusaurus-highlight-code-line {
21 |   background-color: rgb(72, 77, 91);
22 |   display: block;
23 |   margin: 0 calc(-1 * var(--ifm-pre-padding));
24 |   padding: 0 var(--ifm-pre-padding);
25 | }
26 | 
27 | .header-github-link:hover {
28 |   opacity: 0.6;
29 | }
30 | 
31 | .header-github-link:before {
32 |   content: '';
33 |   width: 24px;
34 |   height: 24px;
35 |   display: flex;
36 |   background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E")
37 |     no-repeat;
38 | }
39 | 
40 | html[data-theme='dark'] .header-github-link:before {
41 |   background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='white' d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E")
42 |     no-repeat;
43 | }


--------------------------------------------------------------------------------
/src/pages/exampleReactPage.js:
--------------------------------------------------------------------------------
 1 | import React from 'react';
 2 | import clsx from 'clsx';
 3 | import Layout from '@theme/Layout';
 4 | import Link from '@docusaurus/Link';
 5 | import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 6 | import useBaseUrl from '@docusaurus/useBaseUrl';
 7 | import styles from './styles.module.css';
 8 | 
 9 | const features = [
10 |   {
11 |     title: <>Easy to Use</>,
12 |     imageUrl: 'img/undraw_docusaurus_mountain.svg',
13 |     description: (
14 |       <>
15 |         Docusaurus was designed from the ground up to be easily installed and
16 |         used to get your website up and running quickly.
17 |       </>
18 |     ),
19 |   },
20 |   {
21 |     title: <>Focus on What Matters</>,
22 |     imageUrl: 'img/undraw_docusaurus_tree.svg',
23 |     description: (
24 |       <>
25 |         Docusaurus lets you focus on your docs, and we&apos;ll do the chores. Go
26 |         ahead and move your docs into the <code>docs</code> directory.
27 |       </>
28 |     ),
29 |   },
30 |   {
31 |     title: <>Powered by React</>,
32 |     imageUrl: 'img/undraw_docusaurus_react.svg',
33 |     description: (
34 |       <>
35 |         Extend or customize your website layout by reusing React. Docusaurus can
36 |         be extended while reusing the same header and footer.
37 |       </>
38 |     ),
39 |   },
40 | ];
41 | 
42 | function Feature({imageUrl, title, description}) {
43 |   const imgUrl = useBaseUrl(imageUrl);
44 |   return (
45 |     <div className={clsx('col col--4', styles.feature)}>
46 |       {imgUrl && (
47 |         <div className="text--center">
48 |           <img className={styles.featureImage} src={imgUrl} alt={title} />
49 |         </div>
50 |       )}
51 |       <h3>{title}</h3>
52 |       <p>{description}</p>
53 |     </div>
54 |   );
55 | }
56 | 
57 | function Home() {
58 |   const context = useDocusaurusContext();
59 |   const {siteConfig = {}} = context;
60 |   return (
61 |     <Layout
62 |       title={`Hello from ${siteConfig.title}`}
63 |       description="Description will go into a meta tag in <head />">
64 |       <header className={clsx('hero hero--primary', styles.heroBanner)}>
65 |         <div className="container">
66 |           <h1 className="hero__title">{siteConfig.title}</h1>
67 |           <p className="hero__subtitle">{siteConfig.tagline}</p>
68 |           <div className={styles.buttons}>
69 |             <Link
70 |               className={clsx(
71 |                 'button button--outline button--secondary button--lg',
72 |                 styles.getStarted,
73 |               )}
74 |               to={'https://www.google.com'}>
75 |               Get Started
76 |             </Link>
77 |           </div>
78 |         </div>
79 |       </header>
80 |       <main>
81 |         {features && features.length > 0 && (
82 |           <section className={styles.features}>
83 |             <div className="container">
84 |               <div className="row">
85 |                 {features.map((props, idx) => (
86 |                   <Feature key={idx} {...props} />
87 |                 ))}
88 |               </div>
89 |             </div>
90 |           </section>
91 |         )}
92 |       </main>
93 |     </Layout>
94 |   );
95 | }
96 | 
97 | export default Home;
98 | 


--------------------------------------------------------------------------------
/src/pages/styles.module.css:
--------------------------------------------------------------------------------
 1 | /* stylelint-disable docusaurus/copyright-header */
 2 | 
 3 | /**
 4 |  * CSS files with the .module.css suffix will be treated as CSS modules
 5 |  * and scoped locally.
 6 |  */
 7 | 
 8 |  .heroBanner {
 9 |   padding: 4rem 0;
10 |   text-align: center;
11 |   position: relative;
12 |   overflow: hidden;
13 | }
14 | 
15 | @media screen and (max-width: 966px) {
16 |   .heroBanner {
17 |     padding: 2rem;
18 |   }
19 | }
20 | 
21 | .buttons {
22 |   display: flex;
23 |   align-items: center;
24 |   justify-content: center;
25 | }
26 | 
27 | .features {
28 |   display: flex;
29 |   align-items: center;
30 |   padding: 2rem 0;
31 |   width: 100%;
32 | }
33 | 
34 | .featureImage {
35 |   height: 200px;
36 |   width: 200px;
37 | }
38 | 


--------------------------------------------------------------------------------
/static/.nojekyll:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/InboxSDK/inboxsdk-docs/15763aa0058e8888dfff605c00fee49e13e6a31d/static/.nojekyll


--------------------------------------------------------------------------------
/static/img/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/InboxSDK/inboxsdk-docs/15763aa0058e8888dfff605c00fee49e13e6a31d/static/img/favicon.ico


--------------------------------------------------------------------------------
/static/img/full_logo.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" width="176" height="29.743" viewBox="0 0 176 29.743"><defs><style>.a{fill:#172033;}</style></defs><g transform="translate(-794.133 299.048)"><g transform="translate(850.213 -293.656)"><path class="a" d="M1086.176-251.953a1.711,1.711,0,0,1-.464-1.246v-15.563a1.666,1.666,0,0,1,.464-1.233,1.667,1.667,0,0,1,1.233-.464,1.7,1.7,0,0,1,1.259.464,1.668,1.668,0,0,1,.464,1.233V-253.2a1.713,1.713,0,0,1-.464,1.246,1.676,1.676,0,0,1-1.259.477A1.641,1.641,0,0,1,1086.176-251.953Z" transform="translate(-1085.712 270.565)"/><path class="a" d="M1133.934-240.322a6.013,6.013,0,0,1,1.14,4v6.522a1.549,1.549,0,0,1-.438,1.166,1.66,1.66,0,0,1-1.206.424,1.707,1.707,0,0,1-1.22-.424,1.523,1.523,0,0,1-.451-1.166v-6.337a3.438,3.438,0,0,0-.57-2.2,2.191,2.191,0,0,0-1.79-.689,3.025,3.025,0,0,0-2.293.9,3.346,3.346,0,0,0-.862,2.413v5.913a1.524,1.524,0,0,1-.451,1.166,1.709,1.709,0,0,1-1.22.424,1.66,1.66,0,0,1-1.206-.424,1.549,1.549,0,0,1-.437-1.166v-10.261a1.458,1.458,0,0,1,.451-1.114,1.708,1.708,0,0,1,1.22-.424,1.58,1.58,0,0,1,1.127.411,1.406,1.406,0,0,1,.438,1.074v.716a4.483,4.483,0,0,1,1.776-1.67,5.348,5.348,0,0,1,2.519-.583A4.334,4.334,0,0,1,1133.934-240.322Z" transform="translate(-1115.773 247.295)"/><path class="a" d="M1214.021-264.1a5.527,5.527,0,0,1,2.028,2.333,8.029,8.029,0,0,1,.729,3.526,8.292,8.292,0,0,1-.729,3.566,5.627,5.627,0,0,1-2.041,2.4,5.371,5.371,0,0,1-2.983.849,5.083,5.083,0,0,1-2.505-.61,4.147,4.147,0,0,1-1.684-1.7v.663a1.491,1.491,0,0,1-.451,1.14,1.67,1.67,0,0,1-1.193.424,1.621,1.621,0,0,1-1.18-.424,1.513,1.513,0,0,1-.438-1.14v-15.855a1.438,1.438,0,0,1,.464-1.114,1.718,1.718,0,0,1,1.206-.424,1.738,1.738,0,0,1,1.193.4,1.376,1.376,0,0,1,.451,1.087v6.257a3.963,3.963,0,0,1,1.67-1.631,5.231,5.231,0,0,1,2.466-.57A5.487,5.487,0,0,1,1214.021-264.1Zm-1.432,8.988a4.955,4.955,0,0,0,.875-3.129,4.73,4.73,0,0,0-.862-3.049,2.98,2.98,0,0,0-2.452-1.061,2.963,2.963,0,0,0-2.453,1.074,4.834,4.834,0,0,0-.862,3.089,4.891,4.891,0,0,0,.862,3.1,2.947,2.947,0,0,0,2.453,1.087A2.928,2.928,0,0,0,1212.59-255.108Z" transform="translate(-1180.906 270.565)"/><path class="a" d="M1285.845-228.975a5.683,5.683,0,0,1-2.32-2.36,7.481,7.481,0,0,1-.822-3.579,7.4,7.4,0,0,1,.822-3.566,5.707,5.707,0,0,1,2.32-2.347,7.137,7.137,0,0,1,3.487-.822,7.138,7.138,0,0,1,3.486.822,5.629,5.629,0,0,1,2.307,2.347,7.506,7.506,0,0,1,.808,3.566,7.585,7.585,0,0,1-.808,3.579,5.607,5.607,0,0,1-2.307,2.36,7.132,7.132,0,0,1-3.486.822A7.13,7.13,0,0,1,1285.845-228.975Zm5.926-2.81a4.928,4.928,0,0,0,.849-3.129,4.939,4.939,0,0,0-.849-3.115,2.925,2.925,0,0,0-2.439-1.074,2.963,2.963,0,0,0-2.453,1.074,4.881,4.881,0,0,0-.862,3.115,4.926,4.926,0,0,0,.848,3.129,2.941,2.941,0,0,0,2.439,1.061A2.971,2.971,0,0,0,1291.771-231.785Z" transform="translate(-1244.815 247.295)"/><path class="a" d="M1371.689-229.382a1.466,1.466,0,0,1-.451,1.047,1.434,1.434,0,0,1-1.061.464,1.455,1.455,0,0,1-1.14-.557l-3.738-4.136-3.739,4.136a1.538,1.538,0,0,1-1.14.53,1.421,1.421,0,0,1-1.034-.451,1.421,1.421,0,0,1-.451-1.034,1.5,1.5,0,0,1,.477-1.087l3.871-4.216-3.659-3.977a1.5,1.5,0,0,1-.477-1.087,1.408,1.408,0,0,1,.451-1.047,1.443,1.443,0,0,1,1.034-.437,1.539,1.539,0,0,1,1.14.53l3.526,3.871,3.526-3.871a1.539,1.539,0,0,1,1.14-.53,1.429,1.429,0,0,1,1.047.437,1.43,1.43,0,0,1,.438,1.047,1.5,1.5,0,0,1-.477,1.087l-3.659,3.977,3.9,4.216A1.5,1.5,0,0,1,1371.689-229.382Z" transform="translate(-1306.386 246.961)"/><path class="a" d="M1437.771-252.385a8.486,8.486,0,0,1-2.956-1.472,1.49,1.49,0,0,1-.61-1.273,1.494,1.494,0,0,1,.331-.968.981.981,0,0,1,.782-.411,2.156,2.156,0,0,1,1.087.371,7.932,7.932,0,0,0,2.386,1.193,9.625,9.625,0,0,0,2.757.371,5.43,5.43,0,0,0,2.97-.676,2.213,2.213,0,0,0,1.034-1.975,1.7,1.7,0,0,0-.968-1.551,12.852,12.852,0,0,0-3.221-1.047,19.037,19.037,0,0,1-3.792-1.167,5.35,5.35,0,0,1-2.2-1.7,4.39,4.39,0,0,1-.742-2.625,4.937,4.937,0,0,1,.928-2.943,6.114,6.114,0,0,1,2.585-2.028,9.157,9.157,0,0,1,3.725-.729,9.249,9.249,0,0,1,6.178,2.015,2,2,0,0,1,.49.57,1.51,1.51,0,0,1,.146.7,1.5,1.5,0,0,1-.331.968.981.981,0,0,1-.782.411,1.46,1.46,0,0,1-.49-.079,3.889,3.889,0,0,1-.6-.292,8.975,8.975,0,0,0-2.108-1.18,7.153,7.153,0,0,0-2.505-.384,4.916,4.916,0,0,0-2.85.729,2.335,2.335,0,0,0-1.047,2.028,1.86,1.86,0,0,0,.928,1.67,10.866,10.866,0,0,0,3.155,1.087,21.265,21.265,0,0,1,3.831,1.18,5.685,5.685,0,0,1,2.254,1.657,3.986,3.986,0,0,1,.782,2.519,4.811,4.811,0,0,1-.915,2.9,5.963,5.963,0,0,1-2.572,1.962,9.682,9.682,0,0,1-3.8.7A13.4,13.4,0,0,1,1437.771-252.385Z" transform="translate(-1367.179 271.011)"/><path class="a" d="M1527.553-251.5a1.584,1.584,0,0,1-.437-1.193v-15.457a1.586,1.586,0,0,1,.438-1.193,1.66,1.66,0,0,1,1.206-.424h5.25a9.811,9.811,0,0,1,7.119,2.452,9.135,9.135,0,0,1,2.532,6.88,9.17,9.17,0,0,1-2.532,6.907,9.809,9.809,0,0,1-7.119,2.453h-5.25A1.658,1.658,0,0,1,1527.553-251.5Zm12.687-8.935q0-6.549-6.443-6.549h-3.261v13.124h3.261Q1540.24-253.862,1540.24-260.437Z" transform="translate(-1442.22 270.009)"/><path class="a" d="M1646.091-253.066a1.474,1.474,0,0,1-.464,1.074,1.5,1.5,0,0,1-1.1.464,1.7,1.7,0,0,1-1.22-.557l-8.829-8.272v7.159a1.713,1.713,0,0,1-.464,1.246,1.676,1.676,0,0,1-1.26.477,1.64,1.64,0,0,1-1.233-.477,1.712,1.712,0,0,1-.464-1.246v-15.563a1.667,1.667,0,0,1,.464-1.233,1.666,1.666,0,0,1,1.233-.464,1.7,1.7,0,0,1,1.26.464,1.668,1.668,0,0,1,.464,1.233v6.814l8.537-8.007a1.5,1.5,0,0,1,1.087-.477,1.476,1.476,0,0,1,1.074.464,1.475,1.475,0,0,1,.464,1.074,1.513,1.513,0,0,1-.53,1.114l-7.132,6.522,7.583,7.053A1.539,1.539,0,0,1,1646.091-253.066Z" transform="translate(-1526.171 270.565)"/></g><g transform="translate(794.133 -299.048)"><path class="a" d="M834.612-294.758a6.662,6.662,0,0,0-6.276-4.29h-27.53a6.657,6.657,0,0,0-6.259,4.275,6.636,6.636,0,0,0-.4,1.9l-.014.24v21.856a1.475,1.475,0,0,0,1.474,1.474h.228a1.475,1.475,0,0,0,1.474-1.474v-16L810.3-275.55a6.56,6.56,0,0,0,2.788,1.421,6.417,6.417,0,0,0,2.979,0,6.559,6.559,0,0,0,2.788-1.421l12.982-11.22v15.991a1.475,1.475,0,0,0,1.474,1.474h.228a1.475,1.475,0,0,0,1.474-1.474V-292.2A6.569,6.569,0,0,0,834.612-294.758Zm-37.054,1.1a3.412,3.412,0,0,1,3.219-2.18h27.6a3.476,3.476,0,0,1,2.606,1.158,3.236,3.236,0,0,1,.785,2.573,3.479,3.479,0,0,1-1.21,2.2l-13.8,11.93a3.374,3.374,0,0,1-1.974.8,3.031,3.031,0,0,1-.422,0,3.35,3.35,0,0,1-1.959-.8l-13.893-12.008A3.3,3.3,0,0,1,797.558-293.658Z" transform="translate(-794.133 299.048)"/></g></g></svg>


--------------------------------------------------------------------------------
/static/img/logo.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 2 | <svg
 3 |    width="40.88604"
 4 |    height="29.745192"
 5 |    viewBox="0 0 40.88604 29.745192"
 6 |    version="1.1"
 7 |    id="svg101"
 8 |    sodipodi:docname="logo.svg"
 9 |    inkscape:version="1.1.2 (b8e25be8, 2022-02-05)"
10 |    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
11 |    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
12 |    xmlns="http://www.w3.org/2000/svg"
13 |    xmlns:svg="http://www.w3.org/2000/svg">
14 |   <sodipodi:namedview
15 |      id="namedview103"
16 |      pagecolor="#ffffff"
17 |      bordercolor="#666666"
18 |      borderopacity="1.0"
19 |      inkscape:pageshadow="2"
20 |      inkscape:pageopacity="0.0"
21 |      inkscape:pagecheckerboard="0"
22 |      showgrid="false"
23 |      inkscape:zoom="4.6082213"
24 |      inkscape:cx="96.458042"
25 |      inkscape:cy="26.148918"
26 |      inkscape:window-width="1312"
27 |      inkscape:window-height="793"
28 |      inkscape:window-x="0"
29 |      inkscape:window-y="25"
30 |      inkscape:window-maximized="0"
31 |      inkscape:current-layer="svg101" />
32 |   <defs
33 |      id="defs75">
34 |     <style
35 |        id="style73">.a{fill:#172033;}</style>
36 |   </defs>
37 |   <g
38 |      id="g97"
39 |      transform="translate(0,1.9145542e-4)">
40 |     <path
41 |        class="a"
42 |        d="m 834.612,-294.758 a 6.662,6.662 0 0 0 -6.276,-4.29 h -27.53 a 6.657,6.657 0 0 0 -6.259,4.275 6.636,6.636 0 0 0 -0.4,1.9 l -0.014,0.24 v 21.856 a 1.475,1.475 0 0 0 1.474,1.474 h 0.228 a 1.475,1.475 0 0 0 1.474,-1.474 v -16 l 12.991,11.227 a 6.56,6.56 0 0 0 2.788,1.421 6.417,6.417 0 0 0 2.979,0 6.559,6.559 0 0 0 2.788,-1.421 l 12.982,-11.22 v 15.991 a 1.475,1.475 0 0 0 1.474,1.474 h 0.228 a 1.475,1.475 0 0 0 1.474,-1.474 V -292.2 a 6.569,6.569 0 0 0 -0.401,-2.558 z m -37.054,1.1 a 3.412,3.412 0 0 1 3.219,-2.18 h 27.6 a 3.476,3.476 0 0 1 2.606,1.158 3.236,3.236 0 0 1 0.785,2.573 3.479,3.479 0 0 1 -1.21,2.2 l -13.8,11.93 a 3.374,3.374 0 0 1 -1.974,0.8 3.031,3.031 0 0 1 -0.422,0 3.35,3.35 0 0 1 -1.959,-0.8 l -13.893,-12.008 a 3.3,3.3 0 0 1 -0.952,-3.673 z"
43 |        transform="translate(-794.133,299.048)"
44 |        id="path95" />
45 |   </g>
46 | </svg>
47 | 


--------------------------------------------------------------------------------
/static/img/undraw_docusaurus_tree.svg:
--------------------------------------------------------------------------------
1 | <svg id="ac356da0-b129-4ca5-aecc-4700531dd101" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="1129" height="663" viewBox="0 0 1129 663"><title>docu_tree</title><circle cx="321" cy="321" r="321" fill="#f2f2f2"/><ellipse cx="559" cy="635.49998" rx="514" ry="27.50002" fill="#3f3d56"/><ellipse cx="558" cy="627" rx="460" ry="22" opacity="0.2"/><rect x="131" y="152.5" width="840" height="50" fill="#3f3d56"/><path d="M166.5,727.3299A21.67009,21.67009,0,0,0,188.1701,749H984.8299A21.67009,21.67009,0,0,0,1006.5,727.3299V296h-840Z" transform="translate(-35.5 -118.5)" fill="#3f3d56"/><path d="M984.8299,236H188.1701A21.67009,21.67009,0,0,0,166.5,257.6701V296h840V257.6701A21.67009,21.67009,0,0,0,984.8299,236Z" transform="translate(-35.5 -118.5)" fill="#3f3d56"/><path d="M984.8299,236H188.1701A21.67009,21.67009,0,0,0,166.5,257.6701V296h840V257.6701A21.67009,21.67009,0,0,0,984.8299,236Z" transform="translate(-35.5 -118.5)" opacity="0.2"/><circle cx="181" cy="147.5" r="13" fill="#3f3d56"/><circle cx="217" cy="147.5" r="13" fill="#3f3d56"/><circle cx="253" cy="147.5" r="13" fill="#3f3d56"/><rect x="168" y="213.5" width="337" height="386" rx="5.33505" fill="#606060"/><rect x="603" y="272.5" width="284" height="22" rx="5.47638" fill="#2e8555"/><rect x="537" y="352.5" width="416" height="15" rx="5.47638" fill="#2e8555"/><rect x="537" y="396.5" width="416" height="15" rx="5.47638" fill="#2e8555"/><rect x="537" y="440.5" width="416" height="15" rx="5.47638" fill="#2e8555"/><rect x="537" y="484.5" width="416" height="15" rx="5.47638" fill="#2e8555"/><rect x="865" y="552.5" width="88" height="26" rx="7.02756" fill="#3ecc5f"/><path d="M1088.60287,624.61594a30.11371,30.11371,0,0,0,3.98291-15.266c0-13.79652-8.54358-24.98081-19.08256-24.98081s-19.08256,11.18429-19.08256,24.98081a30.11411,30.11411,0,0,0,3.98291,15.266,31.248,31.248,0,0,0,0,30.53213,31.248,31.248,0,0,0,0,30.53208,31.248,31.248,0,0,0,0,30.53208,30.11408,30.11408,0,0,0-3.98291,15.266c0,13.79652,8.54353,24.98081,19.08256,24.98081s19.08256-11.18429,19.08256-24.98081a30.11368,30.11368,0,0,0-3.98291-15.266,31.248,31.248,0,0,0,0-30.53208,31.248,31.248,0,0,0,0-30.53208,31.248,31.248,0,0,0,0-30.53213Z" transform="translate(-35.5 -118.5)" fill="#3f3d56"/><ellipse cx="1038.00321" cy="460.31783" rx="19.08256" ry="24.9808" fill="#3f3d56"/><ellipse cx="1038.00321" cy="429.78574" rx="19.08256" ry="24.9808" fill="#3f3d56"/><path d="M1144.93871,339.34489a91.61081,91.61081,0,0,0,7.10658-10.46092l-50.141-8.23491,54.22885.4033a91.566,91.566,0,0,0,1.74556-72.42605l-72.75449,37.74139,67.09658-49.32086a91.41255,91.41255,0,1,0-150.971,102.29805,91.45842,91.45842,0,0,0-10.42451,16.66946l65.0866,33.81447-69.40046-23.292a91.46011,91.46011,0,0,0,14.73837,85.83669,91.40575,91.40575,0,1,0,143.68892,0,91.41808,91.41808,0,0,0,0-113.02862Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd"/><path d="M981.6885,395.8592a91.01343,91.01343,0,0,0,19.56129,56.51431,91.40575,91.40575,0,1,0,143.68892,0C1157.18982,436.82067,981.6885,385.60008,981.6885,395.8592Z" transform="translate(-35.5 -118.5)" opacity="0.1"/><path d="M365.62,461.43628H477.094v45.12043H365.62Z" transform="translate(-35.5 -118.5)" fill="#fff" fill-rule="evenodd"/><path d="M264.76252,608.74122a26.50931,26.50931,0,0,1-22.96231-13.27072,26.50976,26.50976,0,0,0,22.96231,39.81215H291.304V608.74122Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd"/><path d="M384.17242,468.57061l92.92155-5.80726V449.49263a26.54091,26.54091,0,0,0-26.54143-26.54143H331.1161l-3.31768-5.74622a3.83043,3.83043,0,0,0-6.63536,0l-3.31768,5.74622-3.31767-5.74622a3.83043,3.83043,0,0,0-6.63536,0l-3.31768,5.74622L301.257,417.205a3.83043,3.83043,0,0,0-6.63536,0L291.304,422.9512c-.02919,0-.05573.004-.08625.004l-5.49674-5.49541a3.8293,3.8293,0,0,0-6.4071,1.71723l-1.81676,6.77338L270.607,424.1031a3.82993,3.82993,0,0,0-4.6912,4.69253l1.84463,6.89148-6.77072,1.81411a3.8315,3.8315,0,0,0-1.71988,6.40975l5.49673,5.49673c0,.02787-.004.05574-.004.08493l-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74621,3.31768L259.0163,466.081a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31767a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31767a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83042,3.83042,0,0,0,0,6.63535l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768L259.0163,558.976a3.83042,3.83042,0,0,0,0,6.63535l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768-5.74622,3.31768a3.83042,3.83042,0,0,0,0,6.63535l5.74622,3.31768-5.74622,3.31768a3.83043,3.83043,0,0,0,0,6.63536l5.74622,3.31768A26.54091,26.54091,0,0,0,291.304,635.28265H450.55254A26.5409,26.5409,0,0,0,477.094,608.74122V502.5755l-92.92155-5.80727a14.12639,14.12639,0,0,1,0-28.19762" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd"/><path d="M424.01111,635.28265h39.81214V582.19979H424.01111Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd"/><path d="M490.36468,602.10586a6.60242,6.60242,0,0,0-.848.08493c-.05042-.19906-.09821-.39945-.15393-.59852A6.62668,6.62668,0,1,0,482.80568,590.21q-.2203-.22491-.44457-.44589a6.62391,6.62391,0,1,0-11.39689-6.56369c-.1964-.05575-.39414-.10218-.59056-.15262a6.63957,6.63957,0,1,0-13.10086,0c-.1964.05042-.39414.09687-.59056.15262a6.62767,6.62767,0,1,0-11.39688,6.56369,26.52754,26.52754,0,1,0,44.23127,25.52756,6.6211,6.6211,0,1,0,.848-13.18579" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd"/><path d="M437.28182,555.65836H477.094V529.11693H437.28182Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd"/><path d="M490.36468,545.70532a3.31768,3.31768,0,0,0,0-6.63536,3.41133,3.41133,0,0,0-.42333.04247c-.02655-.09953-.04911-.19907-.077-.29859a3.319,3.319,0,0,0-1.278-6.37923,3.28174,3.28174,0,0,0-2.00122.68742q-.10947-.11346-.22294-.22295a3.282,3.282,0,0,0,.67149-1.98265,3.31768,3.31768,0,0,0-6.37-1.2992,13.27078,13.27078,0,1,0,0,25.54082,3.31768,3.31768,0,0,0,6.37-1.2992,3.282,3.282,0,0,0-.67149-1.98265q.11347-.10947.22294-.22294a3.28174,3.28174,0,0,0,2.00122.68742,3.31768,3.31768,0,0,0,1.278-6.37923c.02786-.0982.05042-.19907.077-.29859a3.41325,3.41325,0,0,0,.42333.04246" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd"/><path d="M317.84538,466.081a3.31768,3.31768,0,0,1-3.31767-3.31768,9.953,9.953,0,1,0-19.90608,0,3.31768,3.31768,0,1,1-6.63535,0,16.58839,16.58839,0,1,1,33.17678,0,3.31768,3.31768,0,0,1-3.31768,3.31768" transform="translate(-35.5 -118.5)" fill-rule="evenodd"/><path d="M370.92825,635.28265h79.62429A26.5409,26.5409,0,0,0,477.094,608.74122v-92.895H397.46968a26.54091,26.54091,0,0,0-26.54143,26.54143Z" transform="translate(-35.5 -118.5)" fill="#ffff50" fill-rule="evenodd"/><path d="M457.21444,556.98543H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.54143H390.80778a1.32707,1.32707,0,1,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.54143H390.80778a1.32707,1.32707,0,1,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0-66.10674H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.29459H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414m0,26.54143H390.80778a1.32707,1.32707,0,0,1,0-2.65414h66.40666a1.32707,1.32707,0,0,1,0,2.65414M477.094,474.19076c-.01592,0-.0292-.008-.04512-.00663-4.10064.13934-6.04083,4.24132-7.75274,7.86024-1.78623,3.78215-3.16771,6.24122-5.43171,6.16691-2.50685-.09024-3.94007-2.92222-5.45825-5.91874-1.74377-3.44243-3.73438-7.34667-7.91333-7.20069-4.04227.138-5.98907,3.70784-7.70631,6.857-1.82738,3.35484-3.07084,5.39455-5.46887,5.30033-2.55727-.09289-3.91619-2.39536-5.48877-5.06013-1.75306-2.96733-3.77951-6.30359-7.8775-6.18946-3.97326.13669-5.92537,3.16507-7.64791,5.83912-1.82207,2.82666-3.09872,4.5492-5.52725,4.447-2.61832-.09289-3.9706-2.00388-5.53522-4.21611-1.757-2.4856-3.737-5.299-7.82308-5.16231-3.88567.13271-5.83779,2.61434-7.559,4.80135-1.635,2.07555-2.9116,3.71846-5.61218,3.615a1.32793,1.32793,0,1,0-.09555,2.65414c4.00377.134,6.03154-2.38873,7.79257-4.6275,1.562-1.9853,2.91027-3.69855,5.56441-3.78879,2.55594-.10882,3.75429,1.47968,5.56707,4.04093,1.7212,2.43385,3.67465,5.19416,7.60545,5.33616,4.11789.138,6.09921-2.93946,7.8536-5.66261,1.56861-2.43385,2.92221-4.53461,5.50734-4.62352,2.37944-.08892,3.67466,1.79154,5.50072,4.885,1.72121,2.91557,3.67069,6.21865,7.67977,6.36463,4.14709.14332,6.14965-3.47693,7.89475-6.68181,1.51155-2.77092,2.93814-5.38791,5.46621-5.4755,2.37944-.05573,3.62025,2.11668,5.45558,5.74622,1.71459,3.388,3.65875,7.22591,7.73019,7.37321l.22429.004c4.06614,0,5.99571-4.08074,7.70364-7.68905,1.51154-3.19825,2.94211-6.21069,5.3972-6.33411Z" transform="translate(-35.5 -118.5)" fill-rule="evenodd"/><path d="M344.38682,635.28265h53.08286V582.19979H344.38682Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd"/><path d="M424.01111,602.10586a6.60242,6.60242,0,0,0-.848.08493c-.05042-.19906-.09821-.39945-.15394-.59852A6.62667,6.62667,0,1,0,416.45211,590.21q-.2203-.22491-.44458-.44589a6.62391,6.62391,0,1,0-11.39689-6.56369c-.1964-.05575-.39413-.10218-.59054-.15262a6.63957,6.63957,0,1,0-13.10084,0c-.19641.05042-.39414.09687-.59055.15262a6.62767,6.62767,0,1,0-11.39689,6.56369,26.52755,26.52755,0,1,0,44.2313,25.52756,6.6211,6.6211,0,1,0,.848-13.18579" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd"/><path d="M344.38682,555.65836h53.08286V529.11693H344.38682Z" transform="translate(-35.5 -118.5)" fill="#3ecc5f" fill-rule="evenodd"/><path d="M410.74039,545.70532a3.31768,3.31768,0,1,0,0-6.63536,3.41133,3.41133,0,0,0-.42333.04247c-.02655-.09953-.04911-.19907-.077-.29859a3.319,3.319,0,0,0-1.278-6.37923,3.28174,3.28174,0,0,0-2.00122.68742q-.10947-.11346-.22294-.22295a3.282,3.282,0,0,0,.67149-1.98265,3.31768,3.31768,0,0,0-6.37-1.2992,13.27078,13.27078,0,1,0,0,25.54082,3.31768,3.31768,0,0,0,6.37-1.2992,3.282,3.282,0,0,0-.67149-1.98265q.11347-.10947.22294-.22294a3.28174,3.28174,0,0,0,2.00122.68742,3.31768,3.31768,0,0,0,1.278-6.37923c.02786-.0982.05042-.19907.077-.29859a3.41325,3.41325,0,0,0,.42333.04246" transform="translate(-35.5 -118.5)" fill="#44d860" fill-rule="evenodd"/><path d="M424.01111,447.8338a3.60349,3.60349,0,0,1-.65028-.06636,3.34415,3.34415,0,0,1-.62372-.18579,3.44679,3.44679,0,0,1-.572-.30522,5.02708,5.02708,0,0,1-.50429-.4114,3.88726,3.88726,0,0,1-.41007-.50428,3.27532,3.27532,0,0,1-.55737-1.84463,3.60248,3.60248,0,0,1,.06636-.65027,3.82638,3.82638,0,0,1,.18447-.62373,3.48858,3.48858,0,0,1,.30656-.57064,3.197,3.197,0,0,1,.91436-.91568,3.44685,3.44685,0,0,1,.572-.30523,3.344,3.344,0,0,1,.62372-.18578,3.06907,3.06907,0,0,1,1.30053,0,3.22332,3.22332,0,0,1,1.19436.491,5.02835,5.02835,0,0,1,.50429.41139,4.8801,4.8801,0,0,1,.41139.50429,3.38246,3.38246,0,0,1,.30522.57064,3.47806,3.47806,0,0,1,.25215,1.274A3.36394,3.36394,0,0,1,426.36,446.865a5.02708,5.02708,0,0,1-.50429.4114,3.3057,3.3057,0,0,1-1.84463.55737m26.54143-1.65884a3.38754,3.38754,0,0,1-2.35024-.96877,5.04185,5.04185,0,0,1-.41007-.50428,3.27532,3.27532,0,0,1-.55737-1.84463,3.38659,3.38659,0,0,1,.96744-2.34892,5.02559,5.02559,0,0,1,.50429-.41139,3.44685,3.44685,0,0,1,.572-.30523,3.3432,3.3432,0,0,1,.62373-.18579,3.06952,3.06952,0,0,1,1.30052,0,3.22356,3.22356,0,0,1,1.19436.491,5.02559,5.02559,0,0,1,.50429.41139,3.38792,3.38792,0,0,1,.96876,2.34892,3.72635,3.72635,0,0,1-.06636.65026,3.37387,3.37387,0,0,1-.18579.62373,4.71469,4.71469,0,0,1-.30522.57064,4.8801,4.8801,0,0,1-.41139.50429,5.02559,5.02559,0,0,1-.50429.41139,3.30547,3.30547,0,0,1-1.84463.55737" transform="translate(-35.5 -118.5)" fill-rule="evenodd"/></svg>


--------------------------------------------------------------------------------