@dytesdk/angular-ui-kit 3.0.6 → 3.0.7
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/dist/README.md +83 -0
- package/package.json +20 -3
package/dist/README.md
ADDED
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
<!-- PROJECT LOGO -->
|
|
2
|
+
<p align="center">
|
|
3
|
+
<a href="https://dyte.io">
|
|
4
|
+
<img src="https://assets.dyte.io/logo-outlined.png" alt="Logo" width="120" />
|
|
5
|
+
</a>
|
|
6
|
+
|
|
7
|
+
<h2 align="center">Angular UI Kit by dyte</h3>
|
|
8
|
+
|
|
9
|
+
<p align="center">
|
|
10
|
+
A set of UI components to truly customize your meeting UI, in Angular
|
|
11
|
+
<br />
|
|
12
|
+
<a href="https://docs.dyte.io"><strong>Explore the docs »</strong></a>
|
|
13
|
+
<br />
|
|
14
|
+
<br />
|
|
15
|
+
<a href="https://community.dyte.io">Report Bug</a>
|
|
16
|
+
·
|
|
17
|
+
<a href="https://community.dyte.io">Request Feature</a>
|
|
18
|
+
</p>
|
|
19
|
+
</p>
|
|
20
|
+
|
|
21
|
+
<!-- TABLE OF CONTENTS -->
|
|
22
|
+
|
|
23
|
+
## Table of Contents
|
|
24
|
+
|
|
25
|
+
- [Getting Started](#getting-started)
|
|
26
|
+
- [Usage](#usage)
|
|
27
|
+
- [About](#about)
|
|
28
|
+
|
|
29
|
+
<!-- GETTING STARTED -->
|
|
30
|
+
|
|
31
|
+
## Getting Started
|
|
32
|
+
|
|
33
|
+
> There are separate UI Kit packages for VanillaJS and React. Check out the links to the packages below
|
|
34
|
+
|
|
35
|
+
> [UI Kit](https://npmjs.com/package/@dytesdk/ui-kit) · [React UI Kit](https://npmjs.com/package/@dytesdk/react-ui-kit)
|
|
36
|
+
|
|
37
|
+
First, you will need to install the ui-kit along with the [web-core](https://npmjs.com/package/@dytesdk/web-core) package:
|
|
38
|
+
|
|
39
|
+
```sh
|
|
40
|
+
npm i @dytesdk/angular-ui-kit @dytesdk/web-core
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
The `web-core` package is the package which handles all the low level logic required for a meeting by interating with our servers. Use it to create a meeting object, which you can pass along to the UI Kit components.
|
|
44
|
+
|
|
45
|
+
## Usage
|
|
46
|
+
|
|
47
|
+
Load the component in your template file (component.html):
|
|
48
|
+
|
|
49
|
+
```html
|
|
50
|
+
<dyte-meeting #myid></dyte-meeting>
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Then initialize and pass the meeting object to the component:
|
|
54
|
+
|
|
55
|
+
```tsx
|
|
56
|
+
class AppComponent {
|
|
57
|
+
title = 'MyProject';
|
|
58
|
+
@ViewChild('myid') meetingComponent: DyteMeeting;
|
|
59
|
+
dyteMeeting: DyteClient;
|
|
60
|
+
|
|
61
|
+
async ngAfterViewInit() {
|
|
62
|
+
const meeting = await DyteClient.init({
|
|
63
|
+
roomName: '<room-name>',
|
|
64
|
+
authToken: '<auth-token>',
|
|
65
|
+
defaults: {
|
|
66
|
+
video: true,
|
|
67
|
+
audio: true,
|
|
68
|
+
},
|
|
69
|
+
});
|
|
70
|
+
meeting.joinRoom();
|
|
71
|
+
this.dyteMeeting = meeting;
|
|
72
|
+
if (this.meetingComponent) this.meetingComponent.meeting = meeting;
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
## About
|
|
78
|
+
|
|
79
|
+
`angular-ui-kit` is created & maintained by Dyte, Inc. You can find us on Twitter - [@dyte_io](https://twitter.com/dyte_io) or write to us at `dev [at] dyte.io`.
|
|
80
|
+
|
|
81
|
+
The names and logos for Dyte are trademarks of Dyte, Inc.
|
|
82
|
+
|
|
83
|
+
We love open source software! See [our other projects](https://github.com/dyte-in) and [our products](https://dyte.io).
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dytesdk/angular-ui-kit",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.7",
|
|
4
4
|
"description": "Dyte's UI Kit to support easy UI development for Angular Projects",
|
|
5
5
|
"peerDependencies": {
|
|
6
6
|
"@angular/common": ">=12",
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
},
|
|
9
9
|
"dependencies": {
|
|
10
10
|
"tslib": "^2.3.0",
|
|
11
|
-
"@dytesdk/ui-kit": "3.0.
|
|
11
|
+
"@dytesdk/ui-kit": "3.0.7"
|
|
12
12
|
},
|
|
13
13
|
"publishConfig": {
|
|
14
14
|
"access": "public",
|
|
@@ -26,5 +26,22 @@
|
|
|
26
26
|
"postpublish": "mv package.json.bak package.json"
|
|
27
27
|
},
|
|
28
28
|
"module": "dist/fesm2022/dytesdk-angular-ui-kit.mjs",
|
|
29
|
-
"typings": "dist/index.d.ts"
|
|
29
|
+
"typings": "dist/index.d.ts",
|
|
30
|
+
"es2020": "dist/fesm2020/dytesdk-angular-ui-kit.mjs",
|
|
31
|
+
"esm2020": "dist/esm2020/dytesdk-angular-ui-kit.mjs",
|
|
32
|
+
"fesm2020": "dist/fesm2020/dytesdk-angular-ui-kit.mjs",
|
|
33
|
+
"fesm2015": "dist/fesm2015/dytesdk-angular-ui-kit.mjs",
|
|
34
|
+
"exports": {
|
|
35
|
+
"./package.json": {
|
|
36
|
+
"default": "./package.json"
|
|
37
|
+
},
|
|
38
|
+
".": {
|
|
39
|
+
"types": "./dist/dytesdk-angular-ui-kit.d.ts",
|
|
40
|
+
"esm2020": "./dist/esm2020/dytesdk-angular-ui-kit.mjs",
|
|
41
|
+
"es2020": "./dist/fesm2020/dytesdk-angular-ui-kit.mjs",
|
|
42
|
+
"es2015": "./dist/fesm2015/dytesdk-angular-ui-kit.mjs",
|
|
43
|
+
"node": "./dist/fesm2015/dytesdk-angular-ui-kit.mjs",
|
|
44
|
+
"default": "./dist/fesm2020/dytesdk-angular-ui-kit.mjs"
|
|
45
|
+
}
|
|
46
|
+
}
|
|
30
47
|
}
|