@enplug/sdk-dashboard 5.4.0 → 5.4.2-2.1-dev
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +83 -0
- package/dist/dashboard.js +1857 -1464
- package/dist/dashboard.js.map +1 -1
- package/index.d.ts +6 -6
- package/package.json +96 -89
- package/types/account.d.ts +303 -159
- package/types/bridge/bridge-base.d.ts +21 -21
- package/types/dashboard.d.ts +375 -196
- package/types/external-types.d.ts +660 -526
- package/types/index.ts +2 -2
- package/types/internal-types.d.ts +167 -161
- package/types/sdk.d.ts +8 -8
- package/types/social.d.ts +52 -39
- package/types/utils.d.ts +5 -5
package/README.md
ADDED
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
# Dashboard SDK
|
|
2
|
+
|
|
3
|
+
The Dashboard SDK is a JavaScript library which provides communication between the app hosted within the Dashboard's iframe with the hosting [Dashboard](https://dashboard.enplug.com/). It allows to manage assets, themes, fetch various configurations and present standardized User Interface components.
|
|
4
|
+
|
|
5
|
+
:::note Development tips
|
|
6
|
+
The app using Dashboard SDK has to be run inside of the Dashboard's iframe to function properly as the SDK serves as a transport channel of the messages only. All commands are actually executed by the hosting Dashboard. This means that running your app outside of the Dashboard will not work. To run your app inside of the Dashboard, you need to add it to the system. See [Creating an App](/docs/getting-started/creating-an-app).
|
|
7
|
+
:::
|
|
8
|
+
|
|
9
|
+
## Installing the Dashboard SDK
|
|
10
|
+
|
|
11
|
+
Include the Dashboard SDK script in your app, by adding the following code to the `<head>` section of your app's HTML file:
|
|
12
|
+
```html title="Loading Dashboard SDK into the project"
|
|
13
|
+
<script type="text/javascript" src="https://apps.enplug.com/sdk/v1/dashboard.js"></script>
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
This will create a global [`enplug`/`window.enplug`](/docs/sdk-dashboard/interfaces/enplug) object which gives you the access to the methods provided by the Dashboard.
|
|
17
|
+
|
|
18
|
+
### Type support
|
|
19
|
+
|
|
20
|
+
If you use TypeScript and would like to have the typings checked in your IDE you can load the following NPM package:
|
|
21
|
+
|
|
22
|
+
```bash
|
|
23
|
+
npm install @enplug/sdk-dashboard --save-dev
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
Then, add `"@enplug/sdk-dashboard"` to the `types` array in your TypeScript config file. Make sure that `typeRoots` array has the `"node_modules"` entry, so that the whole path is available to the compiler.
|
|
27
|
+
|
|
28
|
+
## Usage
|
|
29
|
+
|
|
30
|
+
After the Dashboard SDK script gets loaded into your app, it will instantly create a global [`enplug`/`window.enplug`](/docs/sdk-dashboard/interfaces/enplug) object which gives you the access to the methods provided by the Dashboard.
|
|
31
|
+
|
|
32
|
+
*See more: [`enplug`](/docs/sdk-dashboard/interfaces/enplug)*
|
|
33
|
+
|
|
34
|
+
## Useful APIs
|
|
35
|
+
|
|
36
|
+
### Account API
|
|
37
|
+
|
|
38
|
+
Use [`enplug.account`](/docs/sdk-dashboard/classes/Account) to manipulate assets, access account and configuration related commands.
|
|
39
|
+
|
|
40
|
+
#### Assets
|
|
41
|
+
- {@link getAssets|`enplug.account.getAssets()`} - fetch the asset list
|
|
42
|
+
- {@link getAssetsByIds|`enplug.account.getAssetsByIds()`} - fetch provided assets
|
|
43
|
+
- {@link saveAsset|`enplug.account.saveAsset()`} - creates/updates an asset, can display Deploy Dialog for editing
|
|
44
|
+
- {@link deleteAsset|`enplug.account.deleteAsset()`} - removes an asset
|
|
45
|
+
- {@link touchAsset|`enplug.account.touchAsset()`} - marks asset as recently viewed
|
|
46
|
+
|
|
47
|
+
#### Others
|
|
48
|
+
- {@link getAccount|`enplug.account.getAccount()`} - fetch current account data
|
|
49
|
+
- {@link getUser|`enplug.account.getUser()`} - fetch current user data
|
|
50
|
+
- {@link getThemes|`enplug.account.getThemes()`} - fetches list of themes
|
|
51
|
+
- {@link getTheme|`enplug.account.getTheme()`} - fetches theme
|
|
52
|
+
- {@link editTheme|`enplug.account.editTheme()`} - edits the theme
|
|
53
|
+
- {@link deleteTheme|`enplug.account.deleteTheme()`} - deletes the theme
|
|
54
|
+
|
|
55
|
+
*See more: [`enplug.account`](/docs/sdk-dashboard/classes/Account)*
|
|
56
|
+
|
|
57
|
+
### Dashboard API
|
|
58
|
+
|
|
59
|
+
Use [`enplug.dashboard`](/docs/sdk-dashboard/classes/Dashboard) to use standardized User Interface components and actions.
|
|
60
|
+
|
|
61
|
+
#### Header section
|
|
62
|
+
|
|
63
|
+
- {@link setHeaderTitle|`enplug.dashboard.setHeaderTitle()`} - sets header title
|
|
64
|
+
- {@link setHeaderButtons|`enplug.dashboard.setHeaderButtons()`} - sets header buttons
|
|
65
|
+
- {@link setDisplaySelectorCallback|`enplug.dashboard.setDisplaySelectorCallback()`} - sets Display Group selector callback
|
|
66
|
+
- {@link setDisplaySelectorVisibility|`enplug.dashboard.setDisplaySelectorVisibility()`} - sets Display Group selector visibility
|
|
67
|
+
|
|
68
|
+
#### Progress indicator
|
|
69
|
+
|
|
70
|
+
- {@link pageLoading|`enplug.dashboard.pageLoading()`} - sets the app's loader visibility
|
|
71
|
+
- {@link loadingIndicator|`enplug.dashboard.loadingIndicator()`} - shows **Loading** indicator
|
|
72
|
+
- {@link successIndicator|`enplug.dashboard.successIndicator()`} - shows **Success** indicator
|
|
73
|
+
- {@link errorIndicator|`enplug.dashboard.errorIndicator()`} - shows **Error** indicator
|
|
74
|
+
|
|
75
|
+
#### Dialogs
|
|
76
|
+
|
|
77
|
+
- {@link Dashboard.previewAsset|`enplug.dashboard.previewAsset()`} - shows asset preview
|
|
78
|
+
- {@link upload|`enplug.dashboard.upload()`} - shows upload dialog
|
|
79
|
+
- {@link openConfirm|`enplug.dashboard.openConfirm()`} - shows custom confirmation dialog
|
|
80
|
+
- {@link confirmUnsavedChanges|`enplug.dashboard.confirmUnsavedChanges()`} - shows unsaved changes dialog
|
|
81
|
+
- {@link setAppHasUnsavedChanges|`enplug.dashboard.setAppHasUnsavedChanges()`} - sets dashboard's navigation guard
|
|
82
|
+
|
|
83
|
+
*See more: [`enplug.dashboard`](/docs/sdk-dashboard/classes/Dashboard)*
|