codeapp-js 0.3.0 → 1.0.0

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.
Files changed (158) hide show
  1. package/AI/codeapp.agent.md +105 -0
  2. package/AI/skills/connections/SKILL.md +47 -0
  3. package/AI/skills/dataverse/SKILL.md +99 -0
  4. package/AI/skills/environment-variables/SKILL.md +89 -0
  5. package/AI/skills/frontend-design/SKILL.md +34 -0
  6. package/AI/skills/jira/SKILL.md +81 -0
  7. package/AI/skills/office365-groups/SKILL.md +61 -0
  8. package/AI/skills/office365-outlook/SKILL.md +52 -0
  9. package/AI/skills/office365-users/SKILL.md +78 -0
  10. package/AI/skills/sharepoint/SKILL.md +77 -0
  11. package/AI/skills/sql/SKILL.md +85 -0
  12. package/AI/skills/start/SKILL.md +46 -0
  13. package/AI/skills/teams/SKILL.md +55 -0
  14. package/{examples/combined demo/.power/schemas/office365groups/office365groups.Schema.json → codeApp/.power/schemas/office365groups/office365groups.Schema.json} +2203 -2203
  15. package/codeApp/dist/codeapp.js +95 -1792
  16. package/codeApp/dist/connectors/azureKeyvault.js +459 -0
  17. package/codeApp/dist/connectors/jira.js +1247 -0
  18. package/codeApp/dist/connectors/office365groups.js +642 -0
  19. package/codeApp/dist/connectors/office365users.js +513 -0
  20. package/codeApp/dist/connectors/outlook.js +1393 -0
  21. package/{dev files/sharepoint.js → codeApp/dist/connectors/sharepoint.js} +239 -112
  22. package/codeApp/dist/connectors/sql.js +149 -0
  23. package/codeApp/dist/connectors/teams.js +280 -0
  24. package/codeApp/dist/power-apps-data.js +16 -2
  25. package/examples/{kanban → apps/kanban}/dist/dataverse.js +94 -94
  26. package/examples/{kanban → apps/kanban}/dist/environmentVar.js +55 -55
  27. package/examples/{kanban → apps/kanban}/dist/index.css +605 -605
  28. package/examples/{kanban → apps/kanban}/dist/index.html +21 -21
  29. package/examples/{kanban → apps/kanban}/dist/index.js +860 -860
  30. package/examples/{kanban → apps/kanban}/dist/office365groups.js +97 -97
  31. package/examples/apps/kanban/dist/office365users.js +451 -0
  32. package/examples/{kanban → apps/kanban}/dist/outlook.js +162 -162
  33. package/examples/{planning Poker/dist/power-apps-data.js → apps/kanban/dist/power-apps-data.js} +2953 -2953
  34. package/examples/{kanban → apps/kanban}/dist/sharepoint.js +435 -339
  35. package/examples/{kanban → apps/kanban}/power.config.json +35 -35
  36. package/examples/{planning Poker → apps/planning Poker}/additional files/customizations (tables).xml +6428 -6428
  37. package/examples/{planning Poker → apps/planning Poker}/additional files/dataverse-tables.json +165 -165
  38. package/examples/{planning Poker → apps/planning Poker}/additional files/readme.md +122 -122
  39. package/examples/{planning Poker → apps/planning Poker}/dist/dataverse.js +78 -78
  40. package/examples/{planning Poker → apps/planning Poker}/dist/index.html +198 -198
  41. package/examples/{planning Poker → apps/planning Poker}/dist/index.js +954 -954
  42. package/examples/{todo/dist/power-apps-data.js → apps/planning Poker/dist/power-apps-data.js } +2953 -2953
  43. package/examples/{planning Poker → apps/planning Poker}/dist/styles.css +815 -815
  44. package/examples/{planning Poker → apps/planning Poker}/power.config.json +50 -50
  45. package/examples/{outlook Demo2 → apps/solution explorer}/dist/codeapp.js +9 -245
  46. package/examples/apps/solution explorer/dist/index.html +80 -0
  47. package/examples/apps/solution explorer/dist/index.js +735 -0
  48. package/examples/apps/solution explorer/dist/styles.css +571 -0
  49. package/examples/apps/solution explorer/power.config.json +151 -0
  50. package/examples/{todo → apps/todo}/dist/dataverse.js +64 -64
  51. package/examples/{todo → apps/todo}/dist/index.html +75 -75
  52. package/examples/{todo → apps/todo}/dist/index.js +8 -8
  53. package/examples/{kanban → apps/todo}/dist/power-apps-data.js +2953 -2953
  54. package/examples/{todo → apps/todo}/dist/renderer.js +375 -375
  55. package/examples/{todo → apps/todo}/dist/styles.css +691 -691
  56. package/examples/{todo → apps/todo}/power.config.json +34 -34
  57. package/examples/combined demo/.power/schemas/appschemas/dataSourcesInfo.ts +6275 -7830
  58. package/examples/combined demo/.power/schemas/jira/jira.Schema.json +6903 -0
  59. package/examples/combined demo/.power/schemas/keyvault/keyvault.Schema.json +1600 -0
  60. package/examples/combined demo/.power/schemas/teams/teams.Schema.json +11112 -0
  61. package/examples/combined demo/dist/codeapp.js +394 -1098
  62. package/examples/{outlook Demo2/OutlookDemo_1_0_0_1.zip → combined demo/dist/icon-512.png} +0 -0
  63. package/examples/combined demo/dist/index.html +29 -511
  64. package/examples/combined demo/dist/index.js +490 -470
  65. package/examples/combined demo/dist/office365users.js +513 -0
  66. package/examples/combined demo/dist/outlook.js +1393 -0
  67. package/examples/combined demo/dist/power-apps-data.js +3079 -3006
  68. package/examples/combined demo/dist/styles.css +483 -0
  69. package/examples/combined demo/power.config.json +33 -42
  70. package/examples/combined demo/src/generated/index.ts +12 -14
  71. package/examples/combined demo/src/generated/models/AzureKeyVaultModel.ts +107 -0
  72. package/examples/combined demo/src/generated/models/JiraModel.ts +501 -0
  73. package/examples/combined demo/src/generated/services/AzureKeyVaultService.ts +257 -0
  74. package/examples/combined demo/src/generated/services/JiraService.ts +1124 -0
  75. package/examples/dataverse Demo/dist/codeapp.js +394 -1085
  76. package/examples/dataverse Demo/dist/icon-512.png +0 -0
  77. package/examples/dataverse Demo/dist/index.html +146 -54
  78. package/examples/dataverse Demo/dist/index.js +693 -83
  79. package/examples/dataverse Demo/dist/power-apps-data.js +3079 -2911
  80. package/examples/dataverse Demo/dist/styles.css +528 -0
  81. package/examples/dataverse Demo/power.config.json +41 -35
  82. package/examples/dataverse Demo/readme.md +79 -79
  83. package/examples/groups Demo/dist/codeapp.js +394 -1085
  84. package/examples/groups Demo/dist/icon-512.png +0 -0
  85. package/examples/groups Demo/dist/index.html +21 -25
  86. package/examples/groups Demo/dist/index.js +304 -113
  87. package/examples/groups Demo/dist/office365groups.js +642 -0
  88. package/examples/groups Demo/dist/power-apps-data.js +3079 -2911
  89. package/examples/groups Demo/dist/styles.css +509 -0
  90. package/examples/groups Demo/power.config.json +25 -25
  91. package/examples/myProfile/dist/codeapp.js +398 -0
  92. package/examples/myProfile/dist/index.html +21 -184
  93. package/examples/myProfile/dist/index.js +324 -141
  94. package/examples/myProfile/dist/office365users.js +517 -169
  95. package/examples/myProfile/dist/power-apps-data.js +3080 -2953
  96. package/examples/myProfile/dist/styles.css +458 -0
  97. package/examples/myProfile/power.config.json +24 -23
  98. package/examples/outlook Demo/dist/codeapp.js +394 -1085
  99. package/examples/outlook Demo/dist/index.html +150 -35
  100. package/examples/outlook Demo/dist/index.js +516 -170
  101. package/examples/outlook Demo/dist/outlook.js +1393 -121
  102. package/examples/outlook Demo/dist/power-apps-data.js +3079 -2911
  103. package/examples/outlook Demo/dist/styles.css +408 -84
  104. package/examples/outlook Demo/power.config.json +24 -23
  105. package/examples/outlook Demo/readme.md +92 -82
  106. package/examples/sharePoint Demo/dist/codeapp.js +394 -1085
  107. package/examples/sharePoint Demo/dist/icon-512.png +0 -0
  108. package/examples/sharePoint Demo/dist/index.html +22 -255
  109. package/examples/sharePoint Demo/dist/index.js +899 -262
  110. package/examples/sharePoint Demo/dist/power-apps-data.js +3079 -2911
  111. package/examples/sharePoint Demo/dist/sharepoint.js +466 -0
  112. package/examples/sharePoint Demo/dist/styles.css +587 -0
  113. package/examples/sharePoint Demo/power.config.json +23 -22
  114. package/package.json +1 -1
  115. package/readme.md +465 -76
  116. package/.vscode/settings.json +0 -6
  117. package/dev files/customConnector.js +0 -98
  118. package/dev files/dataverse.js +0 -120
  119. package/dev files/environmentVar.js +0 -55
  120. package/dev files/office365groups.js +0 -65
  121. package/dev files/office365users.js +0 -169
  122. package/dev files/outlook.js +0 -330
  123. package/dev files/power-apps-data.js +0 -2952
  124. package/examples/combined demo/.power/schemas/office365/office365.Schema.json +0 -21098
  125. package/examples/combined demo/.power/schemas/office365users/office365users.Schema.json +0 -2094
  126. package/examples/kanban/agent/decision-log.md +0 -9
  127. package/examples/kanban/agent/mockup-01-editorial-glass.html +0 -159
  128. package/examples/kanban/agent/mockup-02-dark-rail.html +0 -147
  129. package/examples/kanban/agent/mockup-03-paper-grid.html +0 -114
  130. package/examples/kanban/agent/mockup-04-neon-minimal.html +0 -141
  131. package/examples/kanban/agent/mockup-05-mono-architect.html +0 -119
  132. package/examples/kanban/dist/office365users.js +0 -169
  133. package/examples/kanban/src/generated/index.ts +0 -14
  134. package/examples/kanban/src/generated/models/Office365GroupsModel.ts +0 -363
  135. package/examples/kanban/src/generated/models/Office365OutlookModel.ts +0 -2046
  136. package/examples/kanban/src/generated/models/Office365UsersModel.ts +0 -254
  137. package/examples/kanban/src/generated/services/Office365GroupsService.ts +0 -326
  138. package/examples/kanban/src/generated/services/Office365OutlookService.ts +0 -2476
  139. package/examples/kanban/src/generated/services/Office365UsersService.ts +0 -358
  140. package/examples/outlook Demo2/agent/decision-log.md +0 -7
  141. package/examples/outlook Demo2/dist/index.html +0 -98
  142. package/examples/outlook Demo2/dist/index.js +0 -272
  143. package/examples/outlook Demo2/dist/styles.css +0 -639
  144. package/examples/outlook Demo2/power.config.json +0 -23
  145. package/examples/planning Poker/.vscode/settings.json +0 -5
  146. package/examples/sharePoint Demo/agent/decision-log.md +0 -17
  147. /package/examples/{outlook Demo2 → apps/kanban}/src/generated/index.ts +0 -0
  148. /package/examples/{outlook Demo2 → apps/kanban}/src/generated/models/Office365GroupsModel.ts +0 -0
  149. /package/examples/{outlook Demo2 → apps/kanban}/src/generated/models/Office365OutlookModel.ts +0 -0
  150. /package/examples/{outlook Demo2 → apps/kanban}/src/generated/models/Office365UsersModel.ts +0 -0
  151. /package/examples/{outlook Demo2 → apps/kanban}/src/generated/services/Office365GroupsService.ts +0 -0
  152. /package/examples/{outlook Demo2 → apps/kanban}/src/generated/services/Office365OutlookService.ts +0 -0
  153. /package/examples/{outlook Demo2 → apps/kanban}/src/generated/services/Office365UsersService.ts +0 -0
  154. /package/examples/{planning Poker → apps/planning Poker}/additional files/AgilePoker_1_0_0_1.zip +0 -0
  155. /package/examples/{planning Poker → apps/planning Poker}/additional files/PokerTables_1_0_0_1.zip +0 -0
  156. /package/examples/{outlook Demo2 → apps/solution explorer}/dist/icon-512.png +0 -0
  157. /package/examples/{outlook Demo2 → apps/solution explorer}/dist/power-apps-data.js +0 -0
  158. /package/examples/{todo → apps/todo}/dist/icon192.png +0 -0
@@ -1,511 +1,29 @@
1
-
2
- <!DOCTYPE html>
3
- <html lang="en">
4
- <head>
5
- <meta charset="UTF-8" />
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
- <title>Unified User Hub</title>
8
- <script type="importmap">
9
- {
10
- "imports": {
11
- "@microsoft/power-apps/data": "./power-apps-data.js"
12
- }
13
- }
14
- </script>
15
- <style>
16
- :root {
17
- --bg: #0e1116;
18
- --bg-accent: #171b22;
19
- --panel: rgba(20, 24, 32, 0.86);
20
- --panel-strong: rgba(26, 31, 41, 0.96);
21
- --line: rgba(255, 255, 255, 0.08);
22
- --text: #f3f1eb;
23
- --muted: #b8b2a5;
24
- --gold: #d4a44c;
25
- --gold-soft: rgba(212, 164, 76, 0.16);
26
- --red: #d06a5e;
27
- --green: #79b48e;
28
- --shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
29
- --radius: 22px;
30
- }
31
-
32
- * {
33
- box-sizing: border-box;
34
- }
35
-
36
- body {
37
- margin: 0;
38
- min-height: 100vh;
39
- color: var(--text);
40
- background:
41
- radial-gradient(circle at top left, rgba(212, 164, 76, 0.12), transparent 28%),
42
- radial-gradient(circle at bottom right, rgba(92, 110, 140, 0.16), transparent 30%),
43
- linear-gradient(135deg, #0b0e13 0%, #11161e 48%, #0c1017 100%);
44
- font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
45
- }
46
-
47
- .shell {
48
- width: min(1380px, calc(100% - 32px));
49
- margin: 0 auto;
50
- padding: 28px 0 36px;
51
- }
52
-
53
- .hero {
54
- display: grid;
55
- grid-template-columns: 1.6fr 1fr;
56
- gap: 18px;
57
- margin-bottom: 18px;
58
- }
59
-
60
- .panel {
61
- position: relative;
62
- overflow: hidden;
63
- background: var(--panel);
64
- border: 1px solid var(--line);
65
- border-radius: var(--radius);
66
- box-shadow: var(--shadow);
67
- backdrop-filter: blur(20px);
68
- }
69
-
70
- .panel::after {
71
- content: "";
72
- position: absolute;
73
- inset: 0;
74
- pointer-events: none;
75
- background: linear-gradient(125deg, rgba(255,255,255,0.04), transparent 28%, transparent 72%, rgba(212,164,76,0.06));
76
- }
77
-
78
- .heroCard {
79
- padding: 28px;
80
- min-height: 230px;
81
- display: flex;
82
- flex-direction: column;
83
- justify-content: space-between;
84
- }
85
-
86
- .eyebrow {
87
- margin: 0 0 12px;
88
- color: var(--gold);
89
- font-size: 12px;
90
- letter-spacing: 0.22em;
91
- text-transform: uppercase;
92
- font-family: "Segoe UI", sans-serif;
93
- }
94
-
95
- .heroTitle {
96
- margin: 0;
97
- max-width: 11ch;
98
- font-size: clamp(2.4rem, 4vw, 4.8rem);
99
- line-height: 0.96;
100
- font-weight: 700;
101
- }
102
-
103
- .heroText {
104
- max-width: 56ch;
105
- margin: 16px 0 0;
106
- color: var(--muted);
107
- font-size: 1rem;
108
- line-height: 1.65;
109
- font-family: "Segoe UI", sans-serif;
110
- }
111
-
112
- .stats {
113
- display: grid;
114
- grid-template-columns: repeat(3, 1fr);
115
- gap: 12px;
116
- margin-top: 22px;
117
- }
118
-
119
- .statTile {
120
- padding: 14px 16px;
121
- border: 1px solid var(--line);
122
- border-radius: 16px;
123
- background: rgba(255, 255, 255, 0.03);
124
- }
125
-
126
- .statLabel {
127
- display: block;
128
- margin-bottom: 8px;
129
- font-size: 12px;
130
- letter-spacing: 0.16em;
131
- text-transform: uppercase;
132
- color: var(--muted);
133
- font-family: "Segoe UI", sans-serif;
134
- }
135
-
136
- .statValue {
137
- font-size: 1.4rem;
138
- color: var(--text);
139
- }
140
-
141
- .actionCard {
142
- padding: 24px;
143
- display: flex;
144
- flex-direction: column;
145
- gap: 14px;
146
- justify-content: center;
147
- background: var(--panel-strong);
148
- }
149
-
150
- .buttonRow {
151
- display: flex;
152
- gap: 12px;
153
- flex-wrap: wrap;
154
- }
155
-
156
- button {
157
- border: 0;
158
- cursor: pointer;
159
- padding: 12px 18px;
160
- border-radius: 999px;
161
- font-size: 0.96rem;
162
- transition: transform 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
163
- font-family: "Segoe UI", sans-serif;
164
- }
165
-
166
- button:hover {
167
- transform: translateY(-1px);
168
- box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
169
- }
170
-
171
- .buttonPrimary {
172
- background: linear-gradient(135deg, #e0b765, #c88e2c);
173
- color: #16130d;
174
- font-weight: 700;
175
- }
176
-
177
- .buttonSecondary {
178
- background: rgba(255,255,255,0.05);
179
- color: var(--text);
180
- border: 1px solid var(--line);
181
- }
182
-
183
- .statusBar {
184
- margin-bottom: 18px;
185
- padding: 14px 18px;
186
- border-radius: 18px;
187
- border: 1px solid var(--line);
188
- background: rgba(255,255,255,0.03);
189
- color: var(--muted);
190
- font-family: "Segoe UI", sans-serif;
191
- }
192
-
193
- .statusBar.info {
194
- border-color: rgba(212, 164, 76, 0.24);
195
- color: #f0ddba;
196
- background: rgba(212, 164, 76, 0.08);
197
- }
198
-
199
- .statusBar.success {
200
- border-color: rgba(121, 180, 142, 0.3);
201
- color: #d6f1df;
202
- background: rgba(121, 180, 142, 0.1);
203
- }
204
-
205
- .statusBar.error {
206
- border-color: rgba(208, 106, 94, 0.28);
207
- color: #ffd8d1;
208
- background: rgba(208, 106, 94, 0.1);
209
- }
210
-
211
- .grid {
212
- display: grid;
213
- grid-template-columns: 0.94fr 1.06fr;
214
- gap: 18px;
215
- }
216
-
217
- .stack {
218
- display: grid;
219
- gap: 18px;
220
- }
221
-
222
- .section {
223
- padding: 22px;
224
- }
225
-
226
- .sectionHeader {
227
- display: flex;
228
- align-items: center;
229
- justify-content: space-between;
230
- gap: 12px;
231
- margin-bottom: 18px;
232
- }
233
-
234
- .sectionTitle {
235
- margin: 0;
236
- font-size: 1.6rem;
237
- }
238
-
239
- .sectionNote {
240
- color: var(--muted);
241
- font-size: 0.95rem;
242
- font-family: "Segoe UI", sans-serif;
243
- }
244
-
245
- .profileCard {
246
- display: grid;
247
- grid-template-columns: 92px 1fr;
248
- gap: 18px;
249
- align-items: center;
250
- padding: 18px;
251
- border: 1px solid var(--line);
252
- border-radius: 18px;
253
- background: rgba(255,255,255,0.03);
254
- min-height: 140px;
255
- }
256
-
257
- .profileBadge {
258
- width: 92px;
259
- height: 92px;
260
- display: grid;
261
- place-items: center;
262
- border-radius: 24px;
263
- background: linear-gradient(145deg, rgba(212,164,76,0.24), rgba(255,255,255,0.04));
264
- border: 1px solid rgba(212,164,76,0.2);
265
- font-size: 2rem;
266
- color: #f6e5bf;
267
- font-weight: 700;
268
- font-family: "Segoe UI", sans-serif;
269
- }
270
-
271
- .profileName {
272
- margin: 0 0 8px;
273
- font-size: 1.8rem;
274
- }
275
-
276
- .profileMeta,
277
- .profileSubMeta {
278
- margin: 0;
279
- color: var(--muted);
280
- line-height: 1.6;
281
- font-family: "Segoe UI", sans-serif;
282
- }
283
-
284
- .formGrid {
285
- display: grid;
286
- gap: 14px;
287
- }
288
-
289
- .field {
290
- display: grid;
291
- gap: 8px;
292
- }
293
-
294
- label {
295
- color: var(--muted);
296
- font-size: 0.9rem;
297
- letter-spacing: 0.06em;
298
- text-transform: uppercase;
299
- font-family: "Segoe UI", sans-serif;
300
- }
301
-
302
- input,
303
- textarea {
304
- width: 100%;
305
- border: 1px solid var(--line);
306
- border-radius: 16px;
307
- background: rgba(8, 10, 14, 0.45);
308
- color: var(--text);
309
- padding: 14px 16px;
310
- font: inherit;
311
- font-family: "Segoe UI", sans-serif;
312
- outline: none;
313
- }
314
-
315
- input:focus,
316
- textarea:focus {
317
- border-color: rgba(212, 164, 76, 0.42);
318
- box-shadow: 0 0 0 3px rgba(212, 164, 76, 0.12);
319
- }
320
-
321
- textarea {
322
- min-height: 150px;
323
- resize: vertical;
324
- }
325
-
326
- .list {
327
- display: grid;
328
- gap: 12px;
329
- }
330
-
331
- .listCard {
332
- padding: 16px 18px;
333
- border-radius: 18px;
334
- border: 1px solid var(--line);
335
- background: rgba(255,255,255,0.025);
336
- }
337
-
338
- .listTitle {
339
- margin: 0 0 6px;
340
- font-size: 1.08rem;
341
- font-family: "Segoe UI", sans-serif;
342
- font-weight: 700;
343
- }
344
-
345
- .listMeta,
346
- .listBody {
347
- margin: 0;
348
- color: var(--muted);
349
- line-height: 1.6;
350
- font-family: "Segoe UI", sans-serif;
351
- }
352
-
353
- .emptyState {
354
- padding: 28px 18px;
355
- text-align: center;
356
- border-radius: 18px;
357
- border: 1px dashed rgba(255,255,255,0.16);
358
- color: var(--muted);
359
- font-family: "Segoe UI", sans-serif;
360
- }
361
-
362
- .pill {
363
- display: inline-flex;
364
- align-items: center;
365
- padding: 5px 10px;
366
- border-radius: 999px;
367
- margin: 8px 8px 0 0;
368
- font-size: 0.78rem;
369
- color: #f1dfb7;
370
- background: rgba(212, 164, 76, 0.12);
371
- border: 1px solid rgba(212, 164, 76, 0.18);
372
- font-family: "Segoe UI", sans-serif;
373
- }
374
-
375
- @media (max-width: 1100px) {
376
- .hero,
377
- .grid {
378
- grid-template-columns: 1fr;
379
- }
380
- }
381
-
382
- @media (max-width: 720px) {
383
- .shell {
384
- width: min(100% - 20px, 100%);
385
- padding-top: 18px;
386
- }
387
-
388
- .heroCard,
389
- .actionCard,
390
- .section {
391
- padding: 18px;
392
- }
393
-
394
- .stats {
395
- grid-template-columns: 1fr;
396
- }
397
-
398
- .profileCard {
399
- grid-template-columns: 1fr;
400
- }
401
- }
402
- </style>
403
- </head>
404
- <body>
405
- <div id="root" class="shell">
406
- <section class="hero">
407
- <div class="panel heroCard">
408
- <div>
409
- <p class="eyebrow">Combined User Workspace</p>
410
- <h1 class="heroTitle">Mail, groups, and identity in one place.</h1>
411
- <p class="heroText">
412
- This dashboard loads your Microsoft 365 profile, the groups you belong to, your inbox, and gives you a quick compose surface for sending mail.
413
- </p>
414
- </div>
415
- <div class="stats">
416
- <div class="statTile">
417
- <span class="statLabel">Profile</span>
418
- <strong id="profileStatus" class="statValue">Loading</strong>
419
- </div>
420
- <div class="statTile">
421
- <span class="statLabel">Emails</span>
422
- <strong id="emailCount" class="statValue">0</strong>
423
- </div>
424
- <div class="statTile">
425
- <span class="statLabel">Groups</span>
426
- <strong id="groupCount" class="statValue">0</strong>
427
- </div>
428
- </div>
429
- </div>
430
-
431
- <div class="panel actionCard">
432
- <p class="eyebrow">Actions</p>
433
- <h2 class="sectionTitle">Refresh the full workspace</h2>
434
- <p class="sectionNote">Use refresh after connector sync or after sending a message.</p>
435
- <div class="buttonRow">
436
- <button id="refreshButton" class="buttonPrimary" type="button">Refresh data</button>
437
- <button id="scrollComposeButton" class="buttonSecondary" type="button">Jump to compose</button>
438
- </div>
439
- </div>
440
- </section>
441
-
442
- <div id="statusMessage" class="statusBar info">Loading your dashboard…</div>
443
-
444
- <section class="grid">
445
- <div class="stack">
446
- <div class="panel section">
447
- <div class="sectionHeader">
448
- <div>
449
- <p class="eyebrow">Office 365 Users</p>
450
- <h2 class="sectionTitle">My profile</h2>
451
- </div>
452
- </div>
453
- <div id="profileCard" class="profileCard"></div>
454
- </div>
455
-
456
- <div id="composeSection" class="panel section">
457
- <div class="sectionHeader">
458
- <div>
459
- <p class="eyebrow">Office 365 Outlook</p>
460
- <h2 class="sectionTitle">Send an email</h2>
461
- </div>
462
- </div>
463
- <form id="composeForm" class="formGrid">
464
- <div class="field">
465
- <label for="composeTo">To</label>
466
- <input id="composeTo" name="composeTo" type="email" placeholder="person@contoso.com" required />
467
- </div>
468
- <div class="field">
469
- <label for="composeSubject">Subject</label>
470
- <input id="composeSubject" name="composeSubject" type="text" placeholder="Subject" required />
471
- </div>
472
- <div class="field">
473
- <label for="composeBody">Message</label>
474
- <textarea id="composeBody" name="composeBody" placeholder="Write your message..." required></textarea>
475
- </div>
476
- <div class="buttonRow">
477
- <button id="sendButton" class="buttonPrimary" type="submit">Send email</button>
478
- </div>
479
- </form>
480
- </div>
481
- </div>
482
-
483
- <div class="stack">
484
- <div class="panel section">
485
- <div class="sectionHeader">
486
- <div>
487
- <p class="eyebrow">Office 365 Outlook</p>
488
- <h2 class="sectionTitle">Inbox</h2>
489
- </div>
490
- <span class="sectionNote">Latest messages</span>
491
- </div>
492
- <div id="emailList" class="list"></div>
493
- </div>
494
-
495
- <div class="panel section">
496
- <div class="sectionHeader">
497
- <div>
498
- <p class="eyebrow">Office 365 Groups</p>
499
- <h2 class="sectionTitle">My groups</h2>
500
- </div>
501
- <span class="sectionNote">Membership view</span>
502
- </div>
503
- <div id="groupList" class="list"></div>
504
- </div>
505
- </div>
506
- </section>
507
- </div>
508
-
509
- <script type="module" src="./index.js"></script>
510
- </body>
511
- </html>
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <link rel="icon" type="image/png" href="./icon-512.png" />
7
+ <link rel="stylesheet" href="./styles.css" />
8
+ <title>test Outlook Skill</title>
9
+ <script type="importmap">
10
+ {
11
+ "imports": {
12
+ "@microsoft/power-apps/data": "./power-apps-data.js"
13
+ }
14
+ }
15
+ </script>
16
+ </head>
17
+ <body>
18
+ <div id="root">
19
+ <div class="app-shell loading-shell">
20
+ <div class="hero-card skeleton-block"></div>
21
+ <div class="content-grid">
22
+ <div class="panel skeleton-block"></div>
23
+ <div class="panel skeleton-block"></div>
24
+ </div>
25
+ </div>
26
+ </div>
27
+ <script type="module" src="index.js"></script>
28
+ </body>
29
+ </html>