@sparkle-learning/core 0.0.53 → 0.0.55

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 (177) hide show
  1. package/dist/cjs/{PrivateRoute-074c584e.js → PrivateRoute-f97245ce.js} +18 -30
  2. package/dist/cjs/{feed.service-b4f09441.js → appdata.service-c8d71e05.js} +4 -56
  3. package/dist/cjs/{assets.service-0c759d51.js → assets.service-bfa75092.js} +1 -1
  4. package/dist/cjs/assignment.service-690fb59c.js +19 -0
  5. package/dist/cjs/{environment-config.service-0e02b049.js → environment-config.service-c8ff1f3d.js} +0 -1
  6. package/dist/cjs/{facilitator.service-9e990274.js → facilitator.service-ff0e1659.js} +1 -1
  7. package/dist/cjs/feed.service-8eca4de6.js +57 -0
  8. package/dist/cjs/header-mobile-collapse_61.cjs.entry.js +76 -87
  9. package/dist/cjs/{httpService-7211d93b.js → httpService-d2e7bf8f.js} +13 -11
  10. package/dist/cjs/index.cjs.js +5 -4
  11. package/dist/cjs/{ion-action-sheet_4.cjs.entry.js → ion-action-sheet_7.cjs.entry.js} +728 -0
  12. package/dist/cjs/loader.cjs.js +1 -1
  13. package/dist/cjs/media.service-8a1b9bc5.js +40 -0
  14. package/dist/cjs/{signalR.service-5672eebc.js → signalR.service-bd6b42f9.js} +18 -20
  15. package/dist/cjs/sparkle-animation-player.cjs.entry.js +1 -1
  16. package/dist/cjs/sparkle-assignment.cjs.entry.js +110 -0
  17. package/dist/cjs/sparkle-character-intro.cjs.entry.js +2 -2
  18. package/dist/cjs/sparkle-core.cjs.js +1 -1
  19. package/dist/cjs/sparkle-discussion-questions_2.cjs.entry.js +20 -11
  20. package/dist/cjs/sparkle-discussion.cjs.entry.js +6 -4
  21. package/dist/cjs/sparkle-facilitator-notes-form.cjs.entry.js +5 -3
  22. package/dist/cjs/sparkle-feed-post.cjs.entry.js +116 -0
  23. package/dist/cjs/sparkle-feedback.cjs.entry.js +5 -3
  24. package/dist/cjs/sparkle-file-upload.cjs.entry.js +53 -0
  25. package/dist/cjs/sparkle-goal-form.cjs.entry.js +11 -8
  26. package/dist/cjs/sparkle-input.cjs.entry.js +56 -0
  27. package/dist/cjs/sparkle-quiz-container.cjs.entry.js +1 -1
  28. package/dist/cjs/sparkle-quiz-old.cjs.entry.js +120 -0
  29. package/dist/cjs/sparkle-quiz.cjs.entry.js +31 -48
  30. package/dist/cjs/{student.service-2e58f237.js → student.service-7e5385be.js} +1 -1
  31. package/dist/cjs/token.service-7a41953d.js +97 -0
  32. package/dist/cjs/{util-d383acb8.js → util-47e320b2.js} +2 -2
  33. package/dist/collection/PrivateRoute.js +2 -2
  34. package/dist/collection/collection-manifest.json +5 -2
  35. package/dist/collection/components/layout/facilitator/facilitator-page.js +2 -3
  36. package/dist/collection/components/layout/page/page.css +4 -0
  37. package/dist/collection/components/layout/page/page.js +39 -26
  38. package/dist/collection/components/sparkle-assignment/sparkle-assignment.css +30 -0
  39. package/dist/collection/components/sparkle-assignment/sparkle-assignment.js +159 -0
  40. package/dist/collection/components/sparkle-character-intro/sparkle-character-intro.css +8 -1
  41. package/dist/collection/components/sparkle-character-intro/sparkle-character-intro.js +10 -6
  42. package/dist/collection/components/sparkle-course-root/sparkle-course-root.js +13 -2
  43. package/dist/collection/components/sparkle-discussion/sparkle-discussion-questions/sparkle-discussion-questions.js +4 -2
  44. package/dist/collection/components/sparkle-discussion/sparkle-discussion-results/sparkle-discussion-results.js +15 -9
  45. package/dist/collection/components/sparkle-discussion/sparkle-discussion.css +5 -0
  46. package/dist/collection/components/sparkle-discussion/sparkle-discussion.js +5 -3
  47. package/dist/collection/components/sparkle-feed-post/sparkle-feed-post.js +54 -75
  48. package/dist/collection/components/sparkle-file-upload/sparkle-file-upload.css +0 -0
  49. package/dist/collection/components/sparkle-file-upload/sparkle-file-upload.js +105 -0
  50. package/dist/collection/components/sparkle-input/sparkle-input.css +0 -0
  51. package/dist/collection/components/sparkle-input/sparkle-input.js +212 -0
  52. package/dist/collection/components/sparkle-login/sparkle-login.js +2 -1
  53. package/dist/collection/components/sparkle-quiz/{sparkle-quiz/sparkle-quiz.css → sparkle-quiz-old/sparkle-quiz-old.css} +1 -1
  54. package/dist/collection/components/sparkle-quiz/{sparkle-quiz/sparkle-quiz.js → sparkle-quiz-old/sparkle-quiz-old.js} +4 -4
  55. package/dist/collection/components/sparkle-quiz/{sparkle-quiz-v1.js → sparkle-quiz.js} +23 -25
  56. package/dist/collection/components/sparkle-quiz-container/sparkle-quiz-container.js +1 -1
  57. package/dist/collection/components/sparkle-root/sparkle-root.js +12 -10
  58. package/dist/collection/services/assignment.service.js +14 -0
  59. package/dist/collection/services/auth/auth.service.js +15 -14
  60. package/dist/collection/services/environment/environment-config.js +1 -1
  61. package/dist/collection/services/environment/environment-config.service.js +0 -1
  62. package/dist/collection/services/httpService.js +12 -10
  63. package/dist/collection/services/signalR.service.js +17 -19
  64. package/dist/collection/services/token.service.js +79 -0
  65. package/dist/collection/util.js +5 -2
  66. package/dist/esm/{PrivateRoute-c5441f35.js → PrivateRoute-90ac95b8.js} +17 -29
  67. package/dist/esm/{feed.service-8fbe4ce3.js → appdata.service-2e84e167.js} +5 -55
  68. package/dist/esm/{assets.service-66e848b8.js → assets.service-def1d63c.js} +1 -1
  69. package/dist/esm/assignment.service-8d31f141.js +17 -0
  70. package/dist/esm/{environment-config.service-2b5d692b.js → environment-config.service-b191f276.js} +0 -1
  71. package/dist/esm/{facilitator.service-b0292f7f.js → facilitator.service-18c47bdf.js} +1 -1
  72. package/dist/esm/feed.service-b4f3cae4.js +54 -0
  73. package/dist/esm/header-mobile-collapse_61.entry.js +71 -82
  74. package/dist/esm/{httpService-7b75b095.js → httpService-7986aeed.js} +14 -12
  75. package/dist/esm/index.js +6 -5
  76. package/dist/esm/{ion-action-sheet_4.entry.js → ion-action-sheet_7.entry.js} +729 -4
  77. package/dist/esm/ion-loading.entry.js +1 -1
  78. package/dist/esm/ion-menu.entry.js +1 -1
  79. package/dist/esm/ion-modal.entry.js +1 -1
  80. package/dist/esm/ion-picker.entry.js +1 -1
  81. package/dist/esm/ion-toast.entry.js +1 -1
  82. package/dist/esm/loader.js +1 -1
  83. package/dist/esm/media.service-6e90bc41.js +37 -0
  84. package/dist/esm/{overlays-3b4dca92.js → overlays-4233a39d.js} +1 -1
  85. package/dist/esm/{signalR.service-9d5b9f36.js → signalR.service-c33fba50.js} +18 -20
  86. package/dist/esm/sparkle-animation-player.entry.js +1 -1
  87. package/dist/esm/sparkle-assignment.entry.js +106 -0
  88. package/dist/esm/sparkle-character-intro.entry.js +3 -3
  89. package/dist/esm/sparkle-core.js +1 -1
  90. package/dist/esm/sparkle-discussion-questions_2.entry.js +20 -11
  91. package/dist/esm/sparkle-discussion.entry.js +6 -4
  92. package/dist/esm/sparkle-facilitator-notes-form.entry.js +6 -4
  93. package/dist/esm/sparkle-feed-post.entry.js +112 -0
  94. package/dist/esm/sparkle-feedback.entry.js +6 -4
  95. package/dist/esm/sparkle-file-upload.entry.js +49 -0
  96. package/dist/esm/sparkle-goal-form.entry.js +9 -6
  97. package/dist/esm/sparkle-input.entry.js +52 -0
  98. package/dist/esm/sparkle-quiz-container.entry.js +1 -1
  99. package/dist/esm/sparkle-quiz-old.entry.js +116 -0
  100. package/dist/esm/sparkle-quiz.entry.js +31 -48
  101. package/dist/esm/{student.service-0746418b.js → student.service-08af124f.js} +1 -1
  102. package/dist/esm/token.service-71a5d33f.js +94 -0
  103. package/dist/esm/{util-6ef753e9.js → util-57cc8006.js} +2 -2
  104. package/dist/sparkle-core/index.esm.js +1 -1
  105. package/dist/sparkle-core/p-08420531.entry.js +1 -0
  106. package/dist/sparkle-core/p-08cca80d.entry.js +1 -0
  107. package/dist/sparkle-core/p-0e8e539f.entry.js +1 -0
  108. package/dist/sparkle-core/p-13ec39db.entry.js +1 -0
  109. package/dist/sparkle-core/p-1adc98f6.js +1 -0
  110. package/dist/sparkle-core/p-38c842d5.entry.js +1 -0
  111. package/dist/sparkle-core/{p-fbccd30c.js → p-39a31e43.js} +1 -1
  112. package/dist/sparkle-core/{p-0a5d7c4f.entry.js → p-3daf2915.entry.js} +26 -26
  113. package/dist/sparkle-core/{p-9a443f51.js → p-408176ba.js} +1 -1
  114. package/dist/sparkle-core/p-42ed7d5f.entry.js +1 -0
  115. package/dist/sparkle-core/p-4b4a8703.js +1 -0
  116. package/dist/sparkle-core/p-4d1cfcbe.entry.js +1 -0
  117. package/dist/sparkle-core/p-4fba3e4c.js +1 -0
  118. package/dist/sparkle-core/{p-54dd894f.entry.js → p-6bde0192.entry.js} +1 -1
  119. package/dist/sparkle-core/{p-6faa194c.entry.js → p-6d2f4093.entry.js} +1 -1
  120. package/dist/sparkle-core/{p-162bff1a.entry.js → p-72053ae0.entry.js} +1 -1
  121. package/dist/sparkle-core/p-7dae0f0e.js +1 -0
  122. package/dist/sparkle-core/{p-18cdd458.entry.js → p-85d4cd5c.entry.js} +1 -1
  123. package/dist/sparkle-core/p-973fe404.entry.js +22 -0
  124. package/dist/sparkle-core/{p-ff0e0d4e.entry.js → p-98daeddb.entry.js} +1 -1
  125. package/dist/sparkle-core/p-b06e2bef.js +1 -0
  126. package/dist/sparkle-core/{p-e863bf1d.entry.js → p-b6fec622.entry.js} +1 -1
  127. package/dist/sparkle-core/p-b8d71ff4.js +1 -0
  128. package/dist/sparkle-core/p-bd90903e.js +1 -0
  129. package/dist/sparkle-core/{p-a49ab4e8.entry.js → p-c64a34cd.entry.js} +1 -1
  130. package/dist/sparkle-core/{p-5efc6566.js → p-c9f753a4.js} +1 -1
  131. package/dist/sparkle-core/p-da391f3f.js +1 -0
  132. package/dist/sparkle-core/p-e0cad1bb.js +1 -0
  133. package/dist/sparkle-core/{p-ce4b22f7.entry.js → p-f196c124.entry.js} +1 -1
  134. package/dist/sparkle-core/p-f47fe1fe.entry.js +1 -0
  135. package/dist/sparkle-core/p-f714f77a.entry.js +1 -0
  136. package/dist/sparkle-core/p-f891c79a.entry.js +1 -0
  137. package/dist/sparkle-core/{p-377b04c2.entry.js → p-ff080f82.entry.js} +1 -1
  138. package/dist/sparkle-core/{p-2ff67662.js → p-ff7a8a71.js} +1 -1
  139. package/dist/sparkle-core/sparkle-core.esm.js +1 -1
  140. package/dist/types/components/layout/page/page.d.ts +2 -0
  141. package/dist/types/components/sparkle-assignment/sparkle-assignment.d.ts +16 -0
  142. package/dist/types/components/sparkle-course-root/sparkle-course-root.d.ts +1 -0
  143. package/dist/types/components/sparkle-feed-post/sparkle-feed-post.d.ts +4 -3
  144. package/dist/types/components/sparkle-file-upload/sparkle-file-upload.d.ts +15 -0
  145. package/dist/types/components/sparkle-input/sparkle-input.d.ts +23 -0
  146. package/dist/types/components/sparkle-quiz/{sparkle-quiz/sparkle-quiz.d.ts → sparkle-quiz-old/sparkle-quiz-old.d.ts} +1 -1
  147. package/dist/types/components/sparkle-quiz/{sparkle-quiz-v1.d.ts → sparkle-quiz.d.ts} +1 -1
  148. package/dist/types/components.d.ts +111 -36
  149. package/dist/types/models/class.model.d.ts +4 -0
  150. package/dist/types/services/assignment.service.d.ts +8 -0
  151. package/dist/types/services/auth/auth.service.d.ts +1 -1
  152. package/dist/types/services/environment/environment-config.d.ts +3 -0
  153. package/dist/types/services/token.service.d.ts +13 -0
  154. package/dist/types/util.d.ts +1 -0
  155. package/package.json +1 -1
  156. package/dist/cjs/ion-select_3.cjs.entry.js +0 -618
  157. package/dist/cjs/ion-textarea.cjs.entry.js +0 -248
  158. package/dist/cjs/sparkle-quiz-v1.cjs.entry.js +0 -105
  159. package/dist/esm/ion-select_3.entry.js +0 -612
  160. package/dist/esm/ion-textarea.entry.js +0 -244
  161. package/dist/esm/sparkle-quiz-v1.entry.js +0 -101
  162. package/dist/sparkle-core/p-0f1c5899.entry.js +0 -18
  163. package/dist/sparkle-core/p-1d4c7c11.js +0 -1
  164. package/dist/sparkle-core/p-30767c1c.entry.js +0 -1
  165. package/dist/sparkle-core/p-3265ed87.entry.js +0 -1
  166. package/dist/sparkle-core/p-370609ba.entry.js +0 -1
  167. package/dist/sparkle-core/p-44334ef3.entry.js +0 -4
  168. package/dist/sparkle-core/p-462bffba.js +0 -1
  169. package/dist/sparkle-core/p-4c9f994f.js +0 -1
  170. package/dist/sparkle-core/p-58e4bbe5.entry.js +0 -1
  171. package/dist/sparkle-core/p-600cf6a3.js +0 -1
  172. package/dist/sparkle-core/p-641bfc92.entry.js +0 -1
  173. package/dist/sparkle-core/p-80d6b0e6.entry.js +0 -1
  174. package/dist/sparkle-core/p-af3cc111.entry.js +0 -1
  175. package/dist/sparkle-core/p-b226f54d.js +0 -1
  176. /package/dist/collection/components/sparkle-quiz/{sparkle-quiz-v1.css → sparkle-quiz.css} +0 -0
  177. /package/dist/sparkle-core/{p-935e7cfc.js → p-8b56f734.js} +0 -0
@@ -1,612 +0,0 @@
1
- import { r as registerInstance, i as createEvent, h, H as Host, e as getElement } from './index-c04b9ed5.js';
2
- import { g as getIonMode } from './ionic-global-4903e23e.js';
3
- import { f as focusElement, k as findItemLabel, b as getAriaLabel, d as renderHiddenInput } from './helpers-bf0e23d6.js';
4
- import { f as popoverController, h as actionSheetController, a as alertController } from './overlays-3b4dca92.js';
5
- import { h as hostContext } from './theme-7ef00c83.js';
6
- import { E as EnvironmentConfigService } from './environment-config.service-2b5d692b.js';
7
- import './auth.store-dba2c2da.js';
8
- import './hardware-back-button-fa04d6e9.js';
9
-
10
- /*!
11
- * (C) Ionic http://ionicframework.com - MIT License
12
- */
13
- const watchForOptions = (containerEl, tagName, onChange) => {
14
- if (typeof MutationObserver === 'undefined') {
15
- return;
16
- }
17
- const mutation = new MutationObserver((mutationList) => {
18
- onChange(getSelectedOption(mutationList, tagName));
19
- });
20
- mutation.observe(containerEl, {
21
- childList: true,
22
- subtree: true,
23
- });
24
- return mutation;
25
- };
26
- const getSelectedOption = (mutationList, tagName) => {
27
- let newOption;
28
- mutationList.forEach((mut) => {
29
- // eslint-disable-next-line @typescript-eslint/prefer-for-of
30
- for (let i = 0; i < mut.addedNodes.length; i++) {
31
- newOption = findCheckedOption(mut.addedNodes[i], tagName) || newOption;
32
- }
33
- });
34
- return newOption;
35
- };
36
- const findCheckedOption = (el, tagName) => {
37
- if (el.nodeType !== 1) {
38
- return undefined;
39
- }
40
- const options = el.tagName === tagName.toUpperCase() ? [el] : Array.from(el.querySelectorAll(tagName));
41
- return options.find((o) => o.value === el.value);
42
- };
43
-
44
- const selectIosCss = ":host{--placeholder-color:currentColor;--placeholder-opacity:0.33;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:flex;position:relative;align-items:center;font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:2}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}:host(.in-item){position:static;max-width:45%}:host(.select-disabled){opacity:0.4;pointer-events:none}:host(.ion-focused) button{border:2px solid #5e9ed6}.select-placeholder{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}label{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;appearance:none;outline:none;display:flex;align-items:center;opacity:0}[dir=rtl] label,:host-context([dir=rtl]) label{left:unset;right:unset;right:0}label::-moz-focus-inner{border:0}button{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}.select-icon{position:relative}.select-text{flex:1;min-width:16px;font-size:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.select-icon-inner{left:5px;top:50%;margin-top:-2px;position:absolute;width:0;height:0;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;color:currentColor;pointer-events:none}[dir=rtl] .select-icon-inner,:host-context([dir=rtl]) .select-icon-inner{left:unset;right:unset;right:5px}:host{--padding-top:10px;--padding-end:10px;--padding-bottom:10px;--padding-start:20px}.select-icon{width:12px;height:18px;opacity:0.33}";
45
-
46
- const selectMdCss = ":host{--placeholder-color:currentColor;--placeholder-opacity:0.33;padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:flex;position:relative;align-items:center;font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:2}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}:host(.in-item){position:static;max-width:45%}:host(.select-disabled){opacity:0.4;pointer-events:none}:host(.ion-focused) button{border:2px solid #5e9ed6}.select-placeholder{color:var(--placeholder-color);opacity:var(--placeholder-opacity)}label{left:0;top:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;position:absolute;width:100%;height:100%;border:0;background:transparent;cursor:pointer;appearance:none;outline:none;display:flex;align-items:center;opacity:0}[dir=rtl] label,:host-context([dir=rtl]) label{left:unset;right:unset;right:0}label::-moz-focus-inner{border:0}button{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}.select-icon{position:relative}.select-text{flex:1;min-width:16px;font-size:inherit;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.select-icon-inner{left:5px;top:50%;margin-top:-2px;position:absolute;width:0;height:0;border-top:5px solid;border-right:5px solid transparent;border-left:5px solid transparent;color:currentColor;pointer-events:none}[dir=rtl] .select-icon-inner,:host-context([dir=rtl]) .select-icon-inner{left:unset;right:unset;right:5px}:host{--padding-top:10px;--padding-end:0;--padding-bottom:10px;--padding-start:16px}.select-icon{width:19px;height:19px;transition:transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);opacity:0.55}:host-context(.item-label-stacked) .select-icon,:host-context(.item-label-floating:not(.item-fill-outline)) .select-icon,:host-context(.item-label-floating.item-fill-outline){transform:translate3d(0, -9px, 0)}:host-context(.item-has-focus) .select-icon{transform:rotate(180deg)}:host-context(.item-has-focus.item-label-stacked) .select-icon,:host-context(.item-has-focus.item-label-floating:not(.item-fill-outline)) .select-icon{transform:translate3d(0, -9px, 0) rotate(180deg)}:host-context(ion-item.ion-focused) .select-icon,:host-context(.item-has-focus) .select-icon{color:var(--highlight-color-focused);opacity:1}";
47
-
48
- const Select = class {
49
- constructor(hostRef) {
50
- registerInstance(this, hostRef);
51
- this.ionChange = createEvent(this, "ionChange", 7);
52
- this.ionCancel = createEvent(this, "ionCancel", 7);
53
- this.ionDismiss = createEvent(this, "ionDismiss", 7);
54
- this.ionFocus = createEvent(this, "ionFocus", 7);
55
- this.ionBlur = createEvent(this, "ionBlur", 7);
56
- this.ionStyle = createEvent(this, "ionStyle", 7);
57
- this.inputId = `ion-sel-${selectIds++}`;
58
- this.didInit = false;
59
- this.isExpanded = false;
60
- /**
61
- * If `true`, the user cannot interact with the select.
62
- */
63
- this.disabled = false;
64
- /**
65
- * The text to display on the cancel button.
66
- */
67
- this.cancelText = 'Cancel';
68
- /**
69
- * The text to display on the ok button.
70
- */
71
- this.okText = 'OK';
72
- /**
73
- * The name of the control, which is submitted with the form data.
74
- */
75
- this.name = this.inputId;
76
- /**
77
- * If `true`, the select can accept multiple values.
78
- */
79
- this.multiple = false;
80
- /**
81
- * The interface the select should use: `action-sheet`, `popover` or `alert`.
82
- */
83
- this.interface = 'alert';
84
- /**
85
- * Any additional options that the `alert`, `action-sheet` or `popover` interface
86
- * can take. See the [ion-alert docs](./alert), the
87
- * [ion-action-sheet docs](./action-sheet) and the
88
- * [ion-popover docs](./popover) for the
89
- * create options for each interface.
90
- *
91
- * Note: `interfaceOptions` will not override `inputs` or `buttons` with the `alert` interface.
92
- */
93
- this.interfaceOptions = {};
94
- this.onClick = (ev) => {
95
- this.setFocus();
96
- this.open(ev);
97
- };
98
- this.onFocus = () => {
99
- this.ionFocus.emit();
100
- };
101
- this.onBlur = () => {
102
- this.ionBlur.emit();
103
- };
104
- }
105
- styleChanged() {
106
- this.emitStyle();
107
- }
108
- valueChanged() {
109
- this.emitStyle();
110
- // TODO: FW-1160 - Remove the `didInit` property when ionChange behavior is changed in v7.
111
- if (this.didInit) {
112
- this.ionChange.emit({
113
- value: this.value,
114
- });
115
- }
116
- }
117
- async connectedCallback() {
118
- this.updateOverlayOptions();
119
- this.emitStyle();
120
- this.mutationO = watchForOptions(this.el, 'ion-select-option', async () => {
121
- this.updateOverlayOptions();
122
- });
123
- }
124
- disconnectedCallback() {
125
- if (this.mutationO) {
126
- this.mutationO.disconnect();
127
- this.mutationO = undefined;
128
- }
129
- }
130
- componentDidLoad() {
131
- this.didInit = true;
132
- }
133
- /**
134
- * Open the select overlay. The overlay is either an alert, action sheet, or popover,
135
- * depending on the `interface` property on the `ion-select`.
136
- *
137
- * @param event The user interface event that called the open.
138
- */
139
- async open(event) {
140
- if (this.disabled || this.isExpanded) {
141
- return undefined;
142
- }
143
- this.isExpanded = true;
144
- const overlay = (this.overlay = await this.createOverlay(event));
145
- overlay.onDidDismiss().then(() => {
146
- this.overlay = undefined;
147
- this.isExpanded = false;
148
- this.ionDismiss.emit();
149
- this.setFocus();
150
- });
151
- await overlay.present();
152
- // focus selected option for popovers
153
- if (this.interface === 'popover') {
154
- let indexOfSelected = this.childOpts.map((o) => o.value).indexOf(this.value);
155
- indexOfSelected = indexOfSelected > -1 ? indexOfSelected : 0; // default to first option if nothing selected
156
- const selectedEl = overlay.querySelector(`.select-interface-option:nth-child(${indexOfSelected + 1})`);
157
- if (selectedEl) {
158
- focusElement(selectedEl);
159
- }
160
- }
161
- return overlay;
162
- }
163
- createOverlay(ev) {
164
- let selectInterface = this.interface;
165
- if (selectInterface === 'action-sheet' && this.multiple) {
166
- console.warn(`Select interface cannot be "${selectInterface}" with a multi-value select. Using the "alert" interface instead.`);
167
- selectInterface = 'alert';
168
- }
169
- if (selectInterface === 'popover' && !ev) {
170
- console.warn(`Select interface cannot be a "${selectInterface}" without passing an event. Using the "alert" interface instead.`);
171
- selectInterface = 'alert';
172
- }
173
- if (selectInterface === 'action-sheet') {
174
- return this.openActionSheet();
175
- }
176
- if (selectInterface === 'popover') {
177
- return this.openPopover(ev);
178
- }
179
- return this.openAlert();
180
- }
181
- updateOverlayOptions() {
182
- const overlay = this.overlay;
183
- if (!overlay) {
184
- return;
185
- }
186
- const childOpts = this.childOpts;
187
- const value = this.value;
188
- switch (this.interface) {
189
- case 'action-sheet':
190
- overlay.buttons = this.createActionSheetButtons(childOpts, value);
191
- break;
192
- case 'popover':
193
- const popover = overlay.querySelector('ion-select-popover');
194
- if (popover) {
195
- popover.options = this.createPopoverOptions(childOpts, value);
196
- }
197
- break;
198
- case 'alert':
199
- const inputType = this.multiple ? 'checkbox' : 'radio';
200
- overlay.inputs = this.createAlertInputs(childOpts, inputType, value);
201
- break;
202
- }
203
- }
204
- createActionSheetButtons(data, selectValue) {
205
- const actionSheetButtons = data.map((option) => {
206
- const value = getOptionValue(option);
207
- // Remove hydrated before copying over classes
208
- const copyClasses = Array.from(option.classList)
209
- .filter((cls) => cls !== 'hydrated')
210
- .join(' ');
211
- const optClass = `${OPTION_CLASS} ${copyClasses}`;
212
- return {
213
- role: isOptionSelected(selectValue, value, this.compareWith) ? 'selected' : '',
214
- text: option.textContent,
215
- cssClass: optClass,
216
- handler: () => {
217
- this.value = value;
218
- },
219
- };
220
- });
221
- // Add "cancel" button
222
- actionSheetButtons.push({
223
- text: this.cancelText,
224
- role: 'cancel',
225
- handler: () => {
226
- this.ionCancel.emit();
227
- },
228
- });
229
- return actionSheetButtons;
230
- }
231
- createAlertInputs(data, inputType, selectValue) {
232
- const alertInputs = data.map((option) => {
233
- const value = getOptionValue(option);
234
- // Remove hydrated before copying over classes
235
- const copyClasses = Array.from(option.classList)
236
- .filter((cls) => cls !== 'hydrated')
237
- .join(' ');
238
- const optClass = `${OPTION_CLASS} ${copyClasses}`;
239
- return {
240
- type: inputType,
241
- cssClass: optClass,
242
- label: option.textContent || '',
243
- value,
244
- checked: isOptionSelected(selectValue, value, this.compareWith),
245
- disabled: option.disabled,
246
- };
247
- });
248
- return alertInputs;
249
- }
250
- createPopoverOptions(data, selectValue) {
251
- const popoverOptions = data.map((option) => {
252
- const value = getOptionValue(option);
253
- // Remove hydrated before copying over classes
254
- const copyClasses = Array.from(option.classList)
255
- .filter((cls) => cls !== 'hydrated')
256
- .join(' ');
257
- const optClass = `${OPTION_CLASS} ${copyClasses}`;
258
- return {
259
- text: option.textContent || '',
260
- cssClass: optClass,
261
- value,
262
- checked: isOptionSelected(selectValue, value, this.compareWith),
263
- disabled: option.disabled,
264
- handler: (selected) => {
265
- this.value = selected;
266
- if (!this.multiple) {
267
- this.close();
268
- }
269
- },
270
- };
271
- });
272
- return popoverOptions;
273
- }
274
- async openPopover(ev) {
275
- const interfaceOptions = this.interfaceOptions;
276
- const mode = getIonMode(this);
277
- const showBackdrop = mode === 'md' ? false : true;
278
- const multiple = this.multiple;
279
- const value = this.value;
280
- let event = ev;
281
- let size = 'auto';
282
- const item = this.el.closest('ion-item');
283
- // If the select is inside of an item containing a floating
284
- // or stacked label then the popover should take up the
285
- // full width of the item when it presents
286
- if (item && (item.classList.contains('item-label-floating') || item.classList.contains('item-label-stacked'))) {
287
- event = Object.assign(Object.assign({}, ev), { detail: {
288
- ionShadowTarget: item,
289
- } });
290
- size = 'cover';
291
- }
292
- const popoverOpts = Object.assign(Object.assign({ mode,
293
- event, alignment: 'center', size,
294
- showBackdrop }, interfaceOptions), { component: 'ion-select-popover', cssClass: ['select-popover', interfaceOptions.cssClass], componentProps: {
295
- header: interfaceOptions.header,
296
- subHeader: interfaceOptions.subHeader,
297
- message: interfaceOptions.message,
298
- multiple,
299
- value,
300
- options: this.createPopoverOptions(this.childOpts, value),
301
- } });
302
- return popoverController.create(popoverOpts);
303
- }
304
- async openActionSheet() {
305
- const mode = getIonMode(this);
306
- const interfaceOptions = this.interfaceOptions;
307
- const actionSheetOpts = Object.assign(Object.assign({ mode }, interfaceOptions), { buttons: this.createActionSheetButtons(this.childOpts, this.value), cssClass: ['select-action-sheet', interfaceOptions.cssClass] });
308
- return actionSheetController.create(actionSheetOpts);
309
- }
310
- async openAlert() {
311
- const label = this.getLabel();
312
- const labelText = label ? label.textContent : null;
313
- const interfaceOptions = this.interfaceOptions;
314
- const inputType = this.multiple ? 'checkbox' : 'radio';
315
- const mode = getIonMode(this);
316
- const alertOpts = Object.assign(Object.assign({ mode }, interfaceOptions), { header: interfaceOptions.header ? interfaceOptions.header : labelText, inputs: this.createAlertInputs(this.childOpts, inputType, this.value), buttons: [
317
- {
318
- text: this.cancelText,
319
- role: 'cancel',
320
- handler: () => {
321
- this.ionCancel.emit();
322
- },
323
- },
324
- {
325
- text: this.okText,
326
- handler: (selectedValues) => {
327
- this.value = selectedValues;
328
- },
329
- },
330
- ], cssClass: [
331
- 'select-alert',
332
- interfaceOptions.cssClass,
333
- this.multiple ? 'multiple-select-alert' : 'single-select-alert',
334
- ] });
335
- return alertController.create(alertOpts);
336
- }
337
- /**
338
- * Close the select interface.
339
- */
340
- close() {
341
- // TODO check !this.overlay || !this.isFocus()
342
- if (!this.overlay) {
343
- return Promise.resolve(false);
344
- }
345
- return this.overlay.dismiss();
346
- }
347
- getLabel() {
348
- return findItemLabel(this.el);
349
- }
350
- hasValue() {
351
- return this.getText() !== '';
352
- }
353
- get childOpts() {
354
- return Array.from(this.el.querySelectorAll('ion-select-option'));
355
- }
356
- getText() {
357
- const selectedText = this.selectedText;
358
- if (selectedText != null && selectedText !== '') {
359
- return selectedText;
360
- }
361
- return generateText(this.childOpts, this.value, this.compareWith);
362
- }
363
- setFocus() {
364
- if (this.focusEl) {
365
- this.focusEl.focus();
366
- }
367
- }
368
- emitStyle() {
369
- this.ionStyle.emit({
370
- interactive: true,
371
- 'interactive-disabled': this.disabled,
372
- select: true,
373
- 'select-disabled': this.disabled,
374
- 'has-placeholder': this.placeholder !== undefined,
375
- 'has-value': this.hasValue(),
376
- 'has-focus': this.isExpanded,
377
- });
378
- }
379
- render() {
380
- const { disabled, el, inputId, isExpanded, name, placeholder, value } = this;
381
- const mode = getIonMode(this);
382
- const { labelText, labelId } = getAriaLabel(el, inputId);
383
- renderHiddenInput(true, el, name, parseValue(value), disabled);
384
- const displayValue = this.getText();
385
- let addPlaceholderClass = false;
386
- let selectText = displayValue;
387
- if (selectText === '' && placeholder !== undefined) {
388
- selectText = placeholder;
389
- addPlaceholderClass = true;
390
- }
391
- const selectTextClasses = {
392
- 'select-text': true,
393
- 'select-placeholder': addPlaceholderClass,
394
- };
395
- const textPart = addPlaceholderClass ? 'placeholder' : 'text';
396
- // If there is a label then we need to concatenate it with the
397
- // current value (or placeholder) and a comma so it separates
398
- // nicely when the screen reader announces it, otherwise just
399
- // announce the value / placeholder
400
- const displayLabel = labelText !== undefined ? (selectText !== '' ? `${selectText}, ${labelText}` : labelText) : selectText;
401
- return (h(Host, { onClick: this.onClick, role: "button", "aria-haspopup": "listbox", "aria-disabled": disabled ? 'true' : null, "aria-label": displayLabel, class: {
402
- [mode]: true,
403
- 'in-item': hostContext('ion-item', el),
404
- 'select-disabled': disabled,
405
- 'select-expanded': isExpanded,
406
- } }, h("div", { "aria-hidden": "true", class: selectTextClasses, part: textPart }, selectText), h("div", { class: "select-icon", role: "presentation", part: "icon" }, h("div", { class: "select-icon-inner" })), h("label", { id: labelId }, displayLabel), h("button", { type: "button", disabled: disabled, id: inputId, "aria-labelledby": labelId, "aria-haspopup": "listbox", "aria-expanded": `${isExpanded}`, onFocus: this.onFocus, onBlur: this.onBlur, ref: (focusEl) => (this.focusEl = focusEl) })));
407
- }
408
- get el() { return getElement(this); }
409
- static get watchers() { return {
410
- "disabled": ["styleChanged"],
411
- "placeholder": ["styleChanged"],
412
- "isExpanded": ["styleChanged"],
413
- "value": ["valueChanged"]
414
- }; }
415
- };
416
- const isOptionSelected = (currentValue, compareValue, compareWith) => {
417
- if (currentValue === undefined) {
418
- return false;
419
- }
420
- if (Array.isArray(currentValue)) {
421
- return currentValue.some((val) => compareOptions(val, compareValue, compareWith));
422
- }
423
- else {
424
- return compareOptions(currentValue, compareValue, compareWith);
425
- }
426
- };
427
- const getOptionValue = (el) => {
428
- const value = el.value;
429
- return value === undefined ? el.textContent || '' : value;
430
- };
431
- const parseValue = (value) => {
432
- if (value == null) {
433
- return undefined;
434
- }
435
- if (Array.isArray(value)) {
436
- return value.join(',');
437
- }
438
- return value.toString();
439
- };
440
- const compareOptions = (currentValue, compareValue, compareWith) => {
441
- if (typeof compareWith === 'function') {
442
- return compareWith(currentValue, compareValue);
443
- }
444
- else if (typeof compareWith === 'string') {
445
- return currentValue[compareWith] === compareValue[compareWith];
446
- }
447
- else {
448
- return Array.isArray(compareValue) ? compareValue.includes(currentValue) : currentValue === compareValue;
449
- }
450
- };
451
- const generateText = (opts, value, compareWith) => {
452
- if (value === undefined) {
453
- return '';
454
- }
455
- if (Array.isArray(value)) {
456
- return value
457
- .map((v) => textForValue(opts, v, compareWith))
458
- .filter((opt) => opt !== null)
459
- .join(', ');
460
- }
461
- else {
462
- return textForValue(opts, value, compareWith) || '';
463
- }
464
- };
465
- const textForValue = (opts, value, compareWith) => {
466
- const selectOpt = opts.find((opt) => {
467
- return compareOptions(getOptionValue(opt), value, compareWith);
468
- });
469
- return selectOpt ? selectOpt.textContent : null;
470
- };
471
- let selectIds = 0;
472
- const OPTION_CLASS = 'select-interface-option';
473
- Select.style = {
474
- ios: selectIosCss,
475
- md: selectMdCss
476
- };
477
-
478
- const selectOptionCss = ":host{display:none}";
479
-
480
- const SelectOption = class {
481
- constructor(hostRef) {
482
- registerInstance(this, hostRef);
483
- this.inputId = `ion-selopt-${selectOptionIds++}`;
484
- /**
485
- * If `true`, the user cannot interact with the select option. This property does not apply when `interface="action-sheet"` as `ion-action-sheet` does not allow for disabled buttons.
486
- */
487
- this.disabled = false;
488
- }
489
- render() {
490
- return h(Host, { role: "option", id: this.inputId, class: getIonMode(this) });
491
- }
492
- get el() { return getElement(this); }
493
- };
494
- let selectOptionIds = 0;
495
- SelectOption.style = selectOptionCss;
496
-
497
- const sparkleFeedPostCss = ":host{display:block}.post-footer-container{display:flex;justify-content:flex-end}.post-footer{display:flex;justify-content:space-between;align-items:center}.error{color:red;margin-right:10px}.success{color:green;margin-right:10px}.uploaded-image{display:block;max-height:140px;width:auto !important}.public-post-toggle{display:flex;justify-content:flex-end;align-items:center}.assignment-name{display:none}";
498
-
499
- const SparkleFeedPost = class {
500
- constructor(hostRef) {
501
- registerInstance(this, hostRef);
502
- }
503
- // @Prop({ connect: 'ion-toast-controller' })
504
- // toastCtrl: HTMLIonToastControllerElement;
505
- componentDidLoad() {
506
- this.postText = this.textValue;
507
- if (this.ref && this.ref.innerText) {
508
- this.assignmentName = this.ref.innerText;
509
- console.log(this.assignmentName);
510
- }
511
- }
512
- setText(text) {
513
- this.postText = text;
514
- }
515
- // async postToFeed() {
516
- // const sparkleConfig: EnvironmentSparkleConfig = EnvironmentConfigService.getInstance().get('sparkle');
517
- // const tocData = await AssetsService.getInstance().loadJsonFile<ICourse>(sparkleConfig.tocPath);
518
- // var model = {
519
- // CourseId: tocData.id,
520
- // MiniAppId: SparkleGlobal.MY_GOALS_APP_ID,
521
- // PostText: MyGoalTemplate(this.name.value, this.goalUpdateText.value, this.progress),
522
- // PostTextJSON: MyGoalTemplateJSON(this.name.value, this.goalUpdateText.value, this.progress),
523
- // IsPublic: this.public,
524
- // ExternalResourceUrl: "",
525
- // }
526
- // const result = await FeedService.getInstance().createPost(model);
527
- // if (result.Succeeded) {
528
- // //show success toast
529
- // }
530
- // }
531
- isAuthenticated() {
532
- try {
533
- var sparkleConfig = EnvironmentConfigService.getInstance().get('sparkle');
534
- if (!!sparkleConfig && !!sparkleConfig.auth && !!sparkleConfig.auth.getToken()) {
535
- return true;
536
- }
537
- }
538
- catch (_a) {
539
- return false;
540
- }
541
- }
542
- submitPost() {
543
- this.errorMessage = '';
544
- this.successMessage = '';
545
- //let formData = new FormData(this.el.querySelector("form")) as any;
546
- //var postText = this.el.getElementsByClassName("PostText")[0] as HTMLInputElement;
547
- this.el.getElementsByClassName('PostExternalUrl')[0];
548
- this.el.getElementsByClassName('IsPublic')[0];
549
- // this.dataSvc.saveData(data, '/api/class/feed').subscribe(
550
- // x => {
551
- // this.successMessage = 'Posted Successfully.';
552
- // // this.presentToast('Success');
553
- // },
554
- // error => {
555
- // this.errorMessage = 'There is an error while posting.';
556
- // // this.presentToast('There is an error');
557
- // },
558
- // );
559
- //TODO can we return data from the dataSvc so we know if it's successful and can update the form? (Perhaps replace it with the post itself?)
560
- // if (this.assignmentName) {
561
- // data.AssignmentData = JSON.stringify({ text: data.PostText, url: data.ExternalResourceUrl });
562
- // this.dataSvc.saveData(data, '/api/student/assignment-response').subscribe(
563
- // x => {
564
- // this.successMessage = 'Posted Successfully.';
565
- // // this.presentToast('Success');
566
- // },
567
- // error => {
568
- // this.errorMessage = 'There is an error while posting.';
569
- // // this.presentToast('There is an error');
570
- // },
571
- // );
572
- // }
573
- }
574
- uploadImage(evt) {
575
- // this.uploadImageLoading = true;
576
- // var files = evt.target.files;
577
- // this.dataSvc.uploadImage(files, '/api/mediaitems/upload').subscribe(
578
- // x => {
579
- // this.uploadImageLoading = false;
580
- // this.uploadedImage = x.length > 0 ? x[0].FullImageUrl : '';
581
- // this.externalResourceUrl = x.length > 0 ? x[0].FullImageUrl : '';
582
- // //this.successMessage = 'Posted Successfully.'
583
- // // this.presentToast('Success');
584
- // },
585
- // error => {
586
- // this.uploadImageLoading = false;
587
- // this.errorMessage = 'There is an error while uploading an image.';
588
- // },
589
- // );
590
- }
591
- selectFile() {
592
- var fileInput = document.getElementById('fileInput');
593
- fileInput.click();
594
- }
595
- renderUserInfo() {
596
- var tokenInfo = { Token: null, ProfileImageUrl: null };
597
- if (tokenInfo != null && tokenInfo.Token) {
598
- return (h("ion-avatar", { class: "header-avatar", slot: "end" }, h("img", { src: "/assets/img/avatar.png" })));
599
- }
600
- else {
601
- return (h("ion-button", { slot: "end", href: "/login" }, "Login to Post"));
602
- }
603
- }
604
- render() {
605
- const userInfo = this.renderUserInfo();
606
- return (h(Host, null, h("div", { class: "assignment-name", ref: el => (this.ref = el) }, h("slot", null)), h("ion-card", null, h("ion-item", { class: "header", lines: "full" }, userInfo), h("ion-card-content", null, h("form", null, h("ion-list", null, h("ion-item", { class: "padding" }, h("ion-textarea", { class: "PostText", required: true, placeholder: "Post Text", name: "PostText", value: this.postText })), h("ion-item", { class: "padding" }, h("ion-input", { class: "PostExternalUrl", required: true, type: "text", placeholder: "URL", name: "ExternalResourceUrl", value: this.externalResourceUrl })), this.uploadedImage ? (h("ion-item", { class: "padding" }, h("img", { class: "uploaded-image", src: this.uploadedImage }))) : (''), h("ion-item", { lines: "none" }, h("input", { type: "file", id: "fileInput", onChange: evt => this.uploadImage(evt), style: { display: 'none' }, accept: "image/*" }), this.uploadImageLoading ? h("ion-spinner", { color: "primary" }) : '', h("ion-button", { slot: "start", onClick: evt => this.selectFile() }, h("ion-icon", { name: "add" }), "Upload Image")), h("div", { class: "public-post-toggle" }, h("ion-toggle", { class: "IsPublic", color: "primary", name: "IsPublic" }), h("div", null, "Public Post")), h("div", { class: "post-footer-container" }, h("div", { class: "post-footer" }, h("div", null, h("div", { class: "error" }, this.errorMessage), h("div", { class: "success" }, this.successMessage)), h("ion-button", { slot: "end", size: "default", onClick: evt => this.submitPost(), disabled: !this.isAuthenticated() }, "Post")))))))));
607
- }
608
- get el() { return getElement(this); }
609
- };
610
- SparkleFeedPost.style = sparkleFeedPostCss;
611
-
612
- export { Select as ion_select, SelectOption as ion_select_option, SparkleFeedPost as sparkle_feed_post };