@sparkle-learning/core 0.0.43 → 0.0.46

package/dist/cjs/header-mobile-collapse_61.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-51e8292e.js');
-const icons = require('./icons-c61db785.js');
+const icons = require('./icons-fda820af.js');
 const ionicGlobal = require('./ionic-global-2cde9d3a.js');
 const helpers = require('./helpers-c2496722.js');
 const theme = require('./theme-b0b295c1.js');
@@ -16601,111 +16601,7 @@ const SparklePageFooter = class {
 };
 SparklePageFooter.style = pageFooterCss;
 
-/*!
- * (C) Ionic http://ionicframework.com - MIT License
- */
-/**
- * Waits for a component to be ready for
- * both custom element and non-custom element builds.
- * If non-custom element build, el.componentOnReady
- * will be used.
- * For custom element builds, we wait a frame
- * so that the inner contents of the component
- * have a chance to render.
- *
- * Use this utility rather than calling
- * el.componentOnReady yourself.
- */
-const componentOnReady = (el, callback) => {
-  if (el.componentOnReady) {
-    el.componentOnReady().then((resolvedEl) => callback(resolvedEl));
-  }
-  else {
-    raf(() => callback(el));
-  }
-};
-/**
- * Patched version of requestAnimationFrame that avoids ngzone
- * Use only when you know ngzone should not run
- */
-const raf = (h) => {
-  if (typeof __zone_symbol__requestAnimationFrame === 'function') {
-    return __zone_symbol__requestAnimationFrame(h);
-  }
-  if (typeof requestAnimationFrame === 'function') {
-    return requestAnimationFrame(h);
-  }
-  return setTimeout(h);
-};
-
-/*!
- * (C) Ionic http://ionicframework.com - MIT License
- */
-const createController = (tagName) => {
-  return {
-    create(options) {
-      return createOverlay(tagName, options);
-    },
-    dismiss(data, role, id) {
-      return dismissOverlay(document, data, role, tagName, id);
-    },
-    async getTop() {
-      return getOverlay(document, tagName);
-    }
-  };
-};
-const toastController = /*@__PURE__*/ createController('ion-toast');
-const createOverlay = (tagName, opts) => {
-  /* tslint:disable-next-line */
-  if (typeof window !== 'undefined' && typeof window.customElements !== 'undefined') {
-    return window.customElements.whenDefined(tagName).then(() => {
-      const element = document.createElement(tagName);
-      element.classList.add('overlay-hidden');
-      /**
-       * Convert the passed in overlay options into props
-       * that get passed down into the new overlay.
-       */
-      Object.assign(element, Object.assign(Object.assign({}, opts), { hasController: true }));
-      // append the overlay element to the document body
-      getAppRoot(document).appendChild(element);
-      return new Promise(resolve => componentOnReady(element, resolve));
-    });
-  }
-  return Promise.resolve();
-};
-const isOverlayHidden = (overlay) => overlay.classList.contains('overlay-hidden');
-const dismissOverlay = (doc, data, role, overlayTag, id) => {
-  const overlay = getOverlay(doc, overlayTag, id);
-  if (!overlay) {
-    return Promise.reject('overlay does not exist');
-  }
-  return overlay.dismiss(data, role);
-};
-const getOverlays = (doc, selector) => {
-  if (selector === undefined) {
-    selector = 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker,ion-popover,ion-toast';
-  }
-  return Array.from(doc.querySelectorAll(selector))
-    .filter(c => c.overlayIndex > 0);
-};
-/**
- * Returns an overlay element
- * @param doc The document to find the element within.
- * @param overlayTag The selector for the overlay, defaults to Ionic overlay components.
- * @param id The unique identifier for the overlay instance.
- * @returns The overlay element or `undefined` if no overlay element is found.
- */
-const getOverlay = (doc, overlayTag, id) => {
-  const overlays = getOverlays(doc, overlayTag).filter(o => !isOverlayHidden(o));
-  return (id === undefined)
-    ? overlays[overlays.length - 1]
-    : overlays.find(o => o.id === id);
-};
-const getAppRoot = (doc) => {
-  return doc.querySelector('ion-app') || doc.body;
-};
-
-const paginationCss = "sparkle-pagination{border-color:var(--line-rule-color);border-style:solid;border-width:0 0 1px;display:flex;flex-wrap:wrap-reverse;padding:var(--page-padding, 2rem 0rem) 0}sparkle-pagination .next,sparkle-pagination .previous{max-width:100%;overflow:hidden}sparkle-pagination .next{margin-left:auto}sparkle-pagination a{border-radius:4px;display:flex;align-items:flex-start;flex-direction:column;padding:1em 1.5em;color:rgb(var(--accent-color-rgb))}sparkle-pagination .previous a{padding-left:0}sparkle-pagination .next a{padding-right:0;align-items:flex-end}@media (max-width: 700px){sparkle-pagination .previous a{padding-right:.5rem}sparkle-pagination .next a{padding-left:.5rem}}@media (hover: hover){sparkle-pagination a:hover,sparkle-pagination a:active{filter:brightness(0.8)}}sparkle-pagination .pagination__title{color:var(--text-color--lighter);font-size:12px;display:block}sparkle-pagination .pagination__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;color:var(--ion-color-sparkle)}sparkle-pagination span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sparkle-pagination svg{fill:currentColor;flex:none;height:1em;margin-bottom:-0.125em;width:1em}sparkle-pagination .next svg{margin-left:0.5em}sparkle-pagination .previous svg{margin-right:0.5em}";
+const paginationCss = "sparkle-pagination{border-color:var(--line-rule-color);border-style:solid;border-width:0 0 1px;display:flex;flex-wrap:wrap-reverse;padding:var(--page-padding, 2rem 0rem) 0}sparkle-pagination .next,sparkle-pagination .previous{max-width:100%;overflow:hidden}sparkle-pagination .next{margin-left:auto}sparkle-pagination a{border-radius:4px;display:flex;align-items:flex-start;flex-direction:column;padding:1em 1.5em;color:rgb(var(--accent-color-rgb))}sparkle-pagination .previous a{padding-left:0}sparkle-pagination .next a{padding-right:0;align-items:flex-end}@media (max-width: 700px){sparkle-pagination .previous a{padding-right:0.5rem}sparkle-pagination .next a{padding-left:0.5rem}}@media (hover: hover){sparkle-pagination a:hover,sparkle-pagination a:active{filter:brightness(0.8)}}sparkle-pagination .pagination__title{color:var(--text-color--lighter);font-size:12px;display:block}sparkle-pagination .pagination__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;color:var(--ion-color-sparkle)}sparkle-pagination span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sparkle-pagination svg{fill:currentColor;flex:none;height:1em;margin-bottom:-0.125em;width:1em}sparkle-pagination .next svg{margin-left:0.5em}sparkle-pagination .previous svg{margin-right:0.5em}.completed-toast{z-index:999999999999999999999999999 !important}";
 
 const SparklePagination = class {
   constructor(hostRef) {
@@ -16713,16 +16609,20 @@ const SparklePagination = class {
     this.page = { title: null, path: null, body: null, pageInfo: null };
   }
   async presentToast() {
-    const toast = await toastController.create({
+    console.log('showToast');
+    const toast = await overlays.toastController.create({
       message: 'Lesson Completed.',
       duration: 3000,
+      cssClass: "completed-toast"
     });
     toast.present();
   }
   async presentToastLastSession() {
-    const toast = await toastController.create({
+    console.log('showToast');
+    const toast = await overlays.toastController.create({
       message: 'Session Completed',
       duration: 3000,
+      cssClass: "completed-toast"
     });
     toast.present();
   }
@@ -16742,7 +16642,7 @@ const SparklePagination = class {
         links.push(index.h("stencil-route-link", { onClick: () => this.presentToastLastSession(), url: nextUrl, key: "next", class: "next", anchorTitle: nextText }, index.h("div", { class: "pagination__title" }, "Next"), index.h("div", { class: "pagination__text" }, index.h("span", null, nextText), index.h(icons.ForwardArrow, null))));
       }
       else {
-        links.push(index.h("stencil-route-link", { url: nextUrl, key: "next", class: "next", anchorTitle: nextText }, index.h("div", { class: "pagination__title" }, "Next"), index.h("div", { class: "pagination__text" }, index.h("span", null, nextText), index.h(icons.ForwardArrow, null))));
+        links.push(index.h("stencil-route-link", { onClick: () => this.presentToastLastSession(), url: nextUrl, key: "next", class: "next", anchorTitle: nextText }, index.h("div", { class: "pagination__title" }, "Next"), index.h("div", { class: "pagination__text" }, index.h("span", null, nextText), index.h(icons.ForwardArrow, null))));
       }
     }
     return links;
@@ -16825,7 +16725,7 @@ const SparkleResetPassword = class {
 };
 SparkleResetPassword.style = sparkleResetPasswordCss;
 
-const sparkleRootCss = ":root{--page-padding:2rem 0}sparkle-root{overflow-y:auto}.Layout{display:flex;overflow-x:hidden}.Layout>stencil-route,.Layout>stencil-route-switch{width:100%}.Layout.is-menu-toggled{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-margin-left:0}@media (max-width: 768px){.Layout{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-padding:1.5rem;--page-margin-left:0}.Layout.is-menu-toggled{--menu-transform:none;--page-transform:translateX(var(--menu-width))}.Layout.is-menu-toggled sparkle-page>*{opacity:0.2;pointer-events:none}body.scroll-lock{overflow-y:hidden}}#messagesList{display:grid;font-size:12px;font-weight:bold;grid-template-columns:1fr minmax(0, var(--page-width, 720px)) 1fr;line-height:2;margin-left:var(--page-margin-left);margin-top:var(--header-height);overflow-x:hidden;transform:var(--page-transform, none);margin-top:56px;padding:4px;background:#e50739;color:#fff}";
+const sparkleRootCss = ":root{--page-padding:2rem 0}sparkle-root{overflow-y:auto}.Layout{display:flex;overflow-x:hidden}.Layout>stencil-route,.Layout>stencil-route-switch{width:100%}.Layout.is-menu-toggled{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-margin-left:0}@media (max-width: 768px){.Layout{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-padding:1.5rem;--page-margin-left:0}.Layout.is-menu-toggled{--menu-transform:none;--page-transform:translateX(var(--menu-width))}.Layout.is-menu-toggled sparkle-page>*{opacity:0.2;pointer-events:none}body.scroll-lock{overflow-y:hidden}}#messagesList{display:grid;font-size:12px;font-weight:bold;grid-template-columns:1fr minmax(0, var(--page-width, 720px)) 1fr;line-height:2;margin-left:var(--page-margin-left);margin-top:var(--header-height);overflow-x:hidden;transform:var(--page-transform, none);margin-top:56px;padding:4px;background:#e50739;color:#fff}ion-toast{z-index:600000001}";
 
 const SparkleRoot = class {
   constructor(hostRef) {

package/dist/cjs/sparkle-animation-player.cjs.entry.js

@@ -384,7 +384,6 @@ const SparkleAnimationPlayer = class {
         this.captionText = this.captionData[Math.floor(this.timeline.position / this.library.properties.fps)];
       }
       if (this.timeline.position % 10 == 0) {
-        console.log(this.timeline.duration - 10, this.timeline.position);
         if (this.timeline.position > (this.timeline.duration - 10)) {
           this.animationCompleted();
         }

package/dist/cjs/sparkle-code.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-51e8292e.js');
-const icons = require('./icons-c61db785.js');
+const icons = require('./icons-fda820af.js');
 
 const codeCss = "code[class*=\"language-\"],pre[class*=\"language-\"]{color:#4d4d4c;background:none;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=\"language-\"],:not(pre)>code[class*=\"language-\"]{background:hsl(30, 20%, 25%)}pre[class*=\"language-\"]{padding:1em;margin:.5em 0;overflow:auto;border:.3em solid hsl(30, 20%, 40%);border-radius:.5em;box-shadow:1px 1px .5em black inset}:not(pre)>code[class*=\"language-\"]{padding:.15em .2em .05em;border-radius:.3em;border:.13em solid hsl(30, 20%, 40%);box-shadow:1px 1px .3em -.1em black inset;white-space:normal}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:#8c9296}.token.punctuation{opacity:.7}.namespace{opacity:.7}.token.tag{color:#91c5ff}.token.tag .token.tag{color:#2b90ff}.token.property,.token.attr-name,.token.boolean,.token.number,.token.constant,.token.symbol{color:#8454ff}.token.selector,.token.char,.token.function,.token.builtin,.token.inserted{color:#ff6810}.token.operator,.token.string,.token.entity,.token.url,.token.attr-value,.language-css .token.string,.style .token.string,.token.variable{color:#42b983}.token.atrule{color:#ffbb01}.token.regex,.token.keyword,.token.important{color:#f55073}.token.important,.token.bold{font-weight:bold}.token.italic{font-style:italic}.token.entity{cursor:help}.token.deleted{color:red}sparkle-code[language=\"shell\"]>pre{background-color:var(--text-color--dark);border-radius:7px}sparkle-code[language=\"shell\"]:before{display:none}sparkle-code[language=\"shell\"] code{color:rgba(255, 255, 255, 0.7);font-size:13px}sparkle-code[language=\"shell\"] .token{color:inherit}sparkle-code[language=\"shell\"] .token.prompt{color:#fb96f9;user-select:none}sparkle-code[language=\"shell\"] .token.comment{color:rgba(255, 255, 255, 0.45)}sparkle-code{display:block;position:relative}sparkle-code:before{color:#bdc5d1;content:attr(language);font-family:var(--code-font-family);font-size:10px;letter-spacing:0.05em;line-height:1;padding:0.75em;position:absolute;right:0;text-transform:uppercase;top:0}sparkle-code[language=\"shell\"] pre{white-space:pre-wrap}.code-text__copy{position:absolute;right:0;top:-1.6rem;height:20px}.code-text__copy-link,.code-text__copy-confirmation{padding:4px 5px;font-size:12px;line-height:12px;font-weight:600;position:absolute;right:0;top:0}.code-text__copy-link{transition:0.2s transform ,\r\n    0.2s opacity,\r\n    0.2s color;color:#70A4FF;background-color:#E0EEFF;border-radius:4px;display:inline-block;cursor:pointer;opacity:1;transform:translate3d(0,0,0);z-index:5}.code-text__copy-link:hover{color:var(--blue)}.code-text__copy-confirmation{transition:0.2s transform ,\r\n    0.2s opacity;color:#0ec254;opacity:0;transform:translate3d(0,5px,0);z-index:1;display:flex;align-items:center;height:20px;padding:0}.code-text__copy-confirmation svg{fill:#0ec254;margin-right:-4px}.show-confirmation .code-text__copy-link{opacity:0;transform:translate3d(0,-5px,0);pointer-events:none}.show-confirmation .code-text__copy-confirmation{opacity:1;transform:translate3d(0,0,0)}";
 

package/dist/cjs/sparkle-menu-collapsible.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-51e8292e.js');
-const icons = require('./icons-c61db785.js');
+const icons = require('./icons-fda820af.js');
 
 const collapsibleCss = "collapsible{}";
 

package/dist/collection/components/sparkle-animation-player/sparkle-animation-player.js

@@ -282,7 +282,6 @@ export class SparkleAnimationPlayer {
         this.captionText = this.captionData[Math.floor(this.timeline.position / this.library.properties.fps)];
       }
       if (this.timeline.position % 10 == 0) {
-        console.log(this.timeline.duration - 10, this.timeline.position);
         if (this.timeline.position > (this.timeline.duration - 10)) {
           this.animationCompleted();
         }

package/dist/collection/components/sparkle-root/sparkle-root.css

@@ -56,3 +56,6 @@ sparkle-root{
   background: #e50739;
   color: #fff;
 }
+ion-toast{
+    z-index: 600000001;
+}

package/dist/esm/header-mobile-collapse_61.entry.js

@@ -1,7 +1,7 @@
 import { c as getAssetPath, r as registerInstance, h as h$1, e as getElement, H as Host, i as createEvent, f as forceUpdate, j as readTask, w as writeTask, F as Fragment, k as getContext } from './index-c04b9ed5.js';
-import { M as MoreDots, O as Outbound, D as DownArrow, a as Menu, B as BackArrow, F as ForwardArrow } from './icons-9b62a1ec.js';
+import { M as MoreDots, O as Outbound, D as DownArrow, a as Menu, B as BackArrow, F as ForwardArrow } from './icons-1c794c74.js';
 import { g as getIonMode$1, c as config } from './ionic-global-4903e23e.js';
-import { h as hasShadowDom, i as inheritAriaAttributes, b as getAriaLabel, d as renderHiddenInput, e as debounceEvent, j as inheritAttributes$1, k as findItemLabel, l as raf$1, a as addEventListener, r as removeEventListener, m as clamp } from './helpers-bf0e23d6.js';
+import { h as hasShadowDom, i as inheritAriaAttributes, b as getAriaLabel, d as renderHiddenInput, e as debounceEvent, j as inheritAttributes$1, k as findItemLabel, l as raf, a as addEventListener, r as removeEventListener, m as clamp } from './helpers-bf0e23d6.js';
 import { o as openURL, c as createColorClasses$1, h as hostContext } from './theme-7ef00c83.js';
 import { c as chevronForward } from './index-4044fde9.js';
 import { p as printIonError, a as printIonWarning } from './index-dad75b83.js';
@@ -17,7 +17,7 @@ import { E as EnvironmentConfigService } from './environment-config.service-2b5d
 import { s as sample, S as SparkleGlobal$1, d as date, M as MyHealthTemplate, a as MyHealthTemplateJSON, b as MyMoodTemplate, c as MyMoodTemplateJSON } from './util-6ef753e9.js';
 import { F as FacilitatorService, f as facilitatorStore } from './facilitator.service-b0292f7f.js';
 import { m as menuController } from './index-cded2d87.js';
-import { m as modalController, a as alertController } from './overlays-3b4dca92.js';
+import { m as modalController, a as alertController, t as toastController } from './overlays-3b4dca92.js';
 import { H as HttpService } from './httpService-7b75b095.js';
 import { A as AppDataService, g as goalStore, F as FeedService, f as feedStore } from './feed.service-8fbe4ce3.js';
 import './localstorage.service-4bf408c8.js';
@@ -1255,7 +1255,7 @@ const Item = class {
     }
   }
   componentDidLoad() {
-    raf$1(() => {
+    raf(() => {
       this.setMultipleInputs();
       this.focusable = this.isFocusable();
     });
@@ -1322,7 +1322,7 @@ const Item = class {
       input.fireFocusEvents = false;
       input.setBlur();
       input.setFocus();
-      raf$1(() => {
+      raf(() => {
         input.fireFocusEvents = true;
       });
     }
@@ -16597,111 +16597,7 @@ const SparklePageFooter = class {
 };
 SparklePageFooter.style = pageFooterCss;
 
-/*!
- * (C) Ionic http://ionicframework.com - MIT License
- */
-/**
- * Waits for a component to be ready for
- * both custom element and non-custom element builds.
- * If non-custom element build, el.componentOnReady
- * will be used.
- * For custom element builds, we wait a frame
- * so that the inner contents of the component
- * have a chance to render.
- *
- * Use this utility rather than calling
- * el.componentOnReady yourself.
- */
-const componentOnReady = (el, callback) => {
-  if (el.componentOnReady) {
-    el.componentOnReady().then((resolvedEl) => callback(resolvedEl));
-  }
-  else {
-    raf(() => callback(el));
-  }
-};
-/**
- * Patched version of requestAnimationFrame that avoids ngzone
- * Use only when you know ngzone should not run
- */
-const raf = (h) => {
-  if (typeof __zone_symbol__requestAnimationFrame === 'function') {
-    return __zone_symbol__requestAnimationFrame(h);
-  }
-  if (typeof requestAnimationFrame === 'function') {
-    return requestAnimationFrame(h);
-  }
-  return setTimeout(h);
-};
-
-/*!
- * (C) Ionic http://ionicframework.com - MIT License
- */
-const createController = (tagName) => {
-  return {
-    create(options) {
-      return createOverlay(tagName, options);
-    },
-    dismiss(data, role, id) {
-      return dismissOverlay(document, data, role, tagName, id);
-    },
-    async getTop() {
-      return getOverlay(document, tagName);
-    }
-  };
-};
-const toastController = /*@__PURE__*/ createController('ion-toast');
-const createOverlay = (tagName, opts) => {
-  /* tslint:disable-next-line */
-  if (typeof window !== 'undefined' && typeof window.customElements !== 'undefined') {
-    return window.customElements.whenDefined(tagName).then(() => {
-      const element = document.createElement(tagName);
-      element.classList.add('overlay-hidden');
-      /**
-       * Convert the passed in overlay options into props
-       * that get passed down into the new overlay.
-       */
-      Object.assign(element, Object.assign(Object.assign({}, opts), { hasController: true }));
-      // append the overlay element to the document body
-      getAppRoot(document).appendChild(element);
-      return new Promise(resolve => componentOnReady(element, resolve));
-    });
-  }
-  return Promise.resolve();
-};
-const isOverlayHidden = (overlay) => overlay.classList.contains('overlay-hidden');
-const dismissOverlay = (doc, data, role, overlayTag, id) => {
-  const overlay = getOverlay(doc, overlayTag, id);
-  if (!overlay) {
-    return Promise.reject('overlay does not exist');
-  }
-  return overlay.dismiss(data, role);
-};
-const getOverlays = (doc, selector) => {
-  if (selector === undefined) {
-    selector = 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker,ion-popover,ion-toast';
-  }
-  return Array.from(doc.querySelectorAll(selector))
-    .filter(c => c.overlayIndex > 0);
-};
-/**
- * Returns an overlay element
- * @param doc The document to find the element within.
- * @param overlayTag The selector for the overlay, defaults to Ionic overlay components.
- * @param id The unique identifier for the overlay instance.
- * @returns The overlay element or `undefined` if no overlay element is found.
- */
-const getOverlay = (doc, overlayTag, id) => {
-  const overlays = getOverlays(doc, overlayTag).filter(o => !isOverlayHidden(o));
-  return (id === undefined)
-    ? overlays[overlays.length - 1]
-    : overlays.find(o => o.id === id);
-};
-const getAppRoot = (doc) => {
-  return doc.querySelector('ion-app') || doc.body;
-};
-
-const paginationCss = "sparkle-pagination{border-color:var(--line-rule-color);border-style:solid;border-width:0 0 1px;display:flex;flex-wrap:wrap-reverse;padding:var(--page-padding, 2rem 0rem) 0}sparkle-pagination .next,sparkle-pagination .previous{max-width:100%;overflow:hidden}sparkle-pagination .next{margin-left:auto}sparkle-pagination a{border-radius:4px;display:flex;align-items:flex-start;flex-direction:column;padding:1em 1.5em;color:rgb(var(--accent-color-rgb))}sparkle-pagination .previous a{padding-left:0}sparkle-pagination .next a{padding-right:0;align-items:flex-end}@media (max-width: 700px){sparkle-pagination .previous a{padding-right:.5rem}sparkle-pagination .next a{padding-left:.5rem}}@media (hover: hover){sparkle-pagination a:hover,sparkle-pagination a:active{filter:brightness(0.8)}}sparkle-pagination .pagination__title{color:var(--text-color--lighter);font-size:12px;display:block}sparkle-pagination .pagination__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;color:var(--ion-color-sparkle)}sparkle-pagination span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sparkle-pagination svg{fill:currentColor;flex:none;height:1em;margin-bottom:-0.125em;width:1em}sparkle-pagination .next svg{margin-left:0.5em}sparkle-pagination .previous svg{margin-right:0.5em}";
+const paginationCss = "sparkle-pagination{border-color:var(--line-rule-color);border-style:solid;border-width:0 0 1px;display:flex;flex-wrap:wrap-reverse;padding:var(--page-padding, 2rem 0rem) 0}sparkle-pagination .next,sparkle-pagination .previous{max-width:100%;overflow:hidden}sparkle-pagination .next{margin-left:auto}sparkle-pagination a{border-radius:4px;display:flex;align-items:flex-start;flex-direction:column;padding:1em 1.5em;color:rgb(var(--accent-color-rgb))}sparkle-pagination .previous a{padding-left:0}sparkle-pagination .next a{padding-right:0;align-items:flex-end}@media (max-width: 700px){sparkle-pagination .previous a{padding-right:0.5rem}sparkle-pagination .next a{padding-left:0.5rem}}@media (hover: hover){sparkle-pagination a:hover,sparkle-pagination a:active{filter:brightness(0.8)}}sparkle-pagination .pagination__title{color:var(--text-color--lighter);font-size:12px;display:block}sparkle-pagination .pagination__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;color:var(--ion-color-sparkle)}sparkle-pagination span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sparkle-pagination svg{fill:currentColor;flex:none;height:1em;margin-bottom:-0.125em;width:1em}sparkle-pagination .next svg{margin-left:0.5em}sparkle-pagination .previous svg{margin-right:0.5em}.completed-toast{z-index:999999999999999999999999999 !important}";
 
 const SparklePagination = class {
   constructor(hostRef) {
@@ -16709,16 +16605,20 @@ const SparklePagination = class {
     this.page = { title: null, path: null, body: null, pageInfo: null };
   }
   async presentToast() {
+    console.log('showToast');
     const toast = await toastController.create({
       message: 'Lesson Completed.',
       duration: 3000,
+      cssClass: "completed-toast"
     });
     toast.present();
   }
   async presentToastLastSession() {
+    console.log('showToast');
     const toast = await toastController.create({
       message: 'Session Completed',
       duration: 3000,
+      cssClass: "completed-toast"
     });
     toast.present();
   }
@@ -16738,7 +16638,7 @@ const SparklePagination = class {
         links.push(h$1("stencil-route-link", { onClick: () => this.presentToastLastSession(), url: nextUrl, key: "next", class: "next", anchorTitle: nextText }, h$1("div", { class: "pagination__title" }, "Next"), h$1("div", { class: "pagination__text" }, h$1("span", null, nextText), h$1(ForwardArrow, null))));
       }
       else {
-        links.push(h$1("stencil-route-link", { url: nextUrl, key: "next", class: "next", anchorTitle: nextText }, h$1("div", { class: "pagination__title" }, "Next"), h$1("div", { class: "pagination__text" }, h$1("span", null, nextText), h$1(ForwardArrow, null))));
+        links.push(h$1("stencil-route-link", { onClick: () => this.presentToastLastSession(), url: nextUrl, key: "next", class: "next", anchorTitle: nextText }, h$1("div", { class: "pagination__title" }, "Next"), h$1("div", { class: "pagination__text" }, h$1("span", null, nextText), h$1(ForwardArrow, null))));
       }
     }
     return links;
@@ -16821,7 +16721,7 @@ const SparkleResetPassword = class {
 };
 SparkleResetPassword.style = sparkleResetPasswordCss;
 
-const sparkleRootCss = ":root{--page-padding:2rem 0}sparkle-root{overflow-y:auto}.Layout{display:flex;overflow-x:hidden}.Layout>stencil-route,.Layout>stencil-route-switch{width:100%}.Layout.is-menu-toggled{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-margin-left:0}@media (max-width: 768px){.Layout{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-padding:1.5rem;--page-margin-left:0}.Layout.is-menu-toggled{--menu-transform:none;--page-transform:translateX(var(--menu-width))}.Layout.is-menu-toggled sparkle-page>*{opacity:0.2;pointer-events:none}body.scroll-lock{overflow-y:hidden}}#messagesList{display:grid;font-size:12px;font-weight:bold;grid-template-columns:1fr minmax(0, var(--page-width, 720px)) 1fr;line-height:2;margin-left:var(--page-margin-left);margin-top:var(--header-height);overflow-x:hidden;transform:var(--page-transform, none);margin-top:56px;padding:4px;background:#e50739;color:#fff}";
+const sparkleRootCss = ":root{--page-padding:2rem 0}sparkle-root{overflow-y:auto}.Layout{display:flex;overflow-x:hidden}.Layout>stencil-route,.Layout>stencil-route-switch{width:100%}.Layout.is-menu-toggled{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-margin-left:0}@media (max-width: 768px){.Layout{--menu-transform:translateX(calc(-1 * var(--menu-width)));--page-padding:1.5rem;--page-margin-left:0}.Layout.is-menu-toggled{--menu-transform:none;--page-transform:translateX(var(--menu-width))}.Layout.is-menu-toggled sparkle-page>*{opacity:0.2;pointer-events:none}body.scroll-lock{overflow-y:hidden}}#messagesList{display:grid;font-size:12px;font-weight:bold;grid-template-columns:1fr minmax(0, var(--page-width, 720px)) 1fr;line-height:2;margin-left:var(--page-margin-left);margin-top:var(--header-height);overflow-x:hidden;transform:var(--page-transform, none);margin-top:56px;padding:4px;background:#e50739;color:#fff}ion-toast{z-index:600000001}";
 
 const SparkleRoot = class {
   constructor(hostRef) {

package/dist/esm/sparkle-animation-player.entry.js

@@ -380,7 +380,6 @@ const SparkleAnimationPlayer = class {
         this.captionText = this.captionData[Math.floor(this.timeline.position / this.library.properties.fps)];
       }
       if (this.timeline.position % 10 == 0) {
-        console.log(this.timeline.duration - 10, this.timeline.position);
         if (this.timeline.position > (this.timeline.duration - 10)) {
           this.animationCompleted();
         }

package/dist/esm/sparkle-code.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, e as getElement } from './index-c04b9ed5.js';
-import { C as CheckmarkSoft } from './icons-9b62a1ec.js';
+import { C as CheckmarkSoft } from './icons-1c794c74.js';
 
 const codeCss = "code[class*=\"language-\"],pre[class*=\"language-\"]{color:#4d4d4c;background:none;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=\"language-\"],:not(pre)>code[class*=\"language-\"]{background:hsl(30, 20%, 25%)}pre[class*=\"language-\"]{padding:1em;margin:.5em 0;overflow:auto;border:.3em solid hsl(30, 20%, 40%);border-radius:.5em;box-shadow:1px 1px .5em black inset}:not(pre)>code[class*=\"language-\"]{padding:.15em .2em .05em;border-radius:.3em;border:.13em solid hsl(30, 20%, 40%);box-shadow:1px 1px .3em -.1em black inset;white-space:normal}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:#8c9296}.token.punctuation{opacity:.7}.namespace{opacity:.7}.token.tag{color:#91c5ff}.token.tag .token.tag{color:#2b90ff}.token.property,.token.attr-name,.token.boolean,.token.number,.token.constant,.token.symbol{color:#8454ff}.token.selector,.token.char,.token.function,.token.builtin,.token.inserted{color:#ff6810}.token.operator,.token.string,.token.entity,.token.url,.token.attr-value,.language-css .token.string,.style .token.string,.token.variable{color:#42b983}.token.atrule{color:#ffbb01}.token.regex,.token.keyword,.token.important{color:#f55073}.token.important,.token.bold{font-weight:bold}.token.italic{font-style:italic}.token.entity{cursor:help}.token.deleted{color:red}sparkle-code[language=\"shell\"]>pre{background-color:var(--text-color--dark);border-radius:7px}sparkle-code[language=\"shell\"]:before{display:none}sparkle-code[language=\"shell\"] code{color:rgba(255, 255, 255, 0.7);font-size:13px}sparkle-code[language=\"shell\"] .token{color:inherit}sparkle-code[language=\"shell\"] .token.prompt{color:#fb96f9;user-select:none}sparkle-code[language=\"shell\"] .token.comment{color:rgba(255, 255, 255, 0.45)}sparkle-code{display:block;position:relative}sparkle-code:before{color:#bdc5d1;content:attr(language);font-family:var(--code-font-family);font-size:10px;letter-spacing:0.05em;line-height:1;padding:0.75em;position:absolute;right:0;text-transform:uppercase;top:0}sparkle-code[language=\"shell\"] pre{white-space:pre-wrap}.code-text__copy{position:absolute;right:0;top:-1.6rem;height:20px}.code-text__copy-link,.code-text__copy-confirmation{padding:4px 5px;font-size:12px;line-height:12px;font-weight:600;position:absolute;right:0;top:0}.code-text__copy-link{transition:0.2s transform ,\r\n    0.2s opacity,\r\n    0.2s color;color:#70A4FF;background-color:#E0EEFF;border-radius:4px;display:inline-block;cursor:pointer;opacity:1;transform:translate3d(0,0,0);z-index:5}.code-text__copy-link:hover{color:var(--blue)}.code-text__copy-confirmation{transition:0.2s transform ,\r\n    0.2s opacity;color:#0ec254;opacity:0;transform:translate3d(0,5px,0);z-index:1;display:flex;align-items:center;height:20px;padding:0}.code-text__copy-confirmation svg{fill:#0ec254;margin-right:-4px}.show-confirmation .code-text__copy-link{opacity:0;transform:translate3d(0,-5px,0);pointer-events:none}.show-confirmation .code-text__copy-confirmation{opacity:1;transform:translate3d(0,0,0)}";
 

package/dist/esm/sparkle-menu-collapsible.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, e as getElement, H as Host } from './index-c04b9ed5.js';
-import { D as DownArrow } from './icons-9b62a1ec.js';
+import { D as DownArrow } from './icons-1c794c74.js';
 
 const collapsibleCss = "collapsible{}";
 

package/dist/node_modules/@sparkle-learning/components/dist/collection/components/button/button.css

@@ -0,0 +1,49 @@
+sparkle-button {
+  background-color: rgba(var(--ion-color-sparkle-rgb), var(--bg-alpha, 0.06));
+  border-radius: 6px;
+  color: var(--accent-color);
+  display: inline-block;
+  font-weight: 600;
+  white-space: nowrap;box-shadow: 0 1px 3px rgba(0,0,0,.1);
+}
+
+sparkle-button a,
+sparkle-button button {
+  color: inherit;
+  display: inline-block;
+  font-size: inherit;
+  font-weight: inherit;
+  padding: 0.75em 1.5em;
+}
+
+sparkle-button button {
+  appearance: none;
+  background: none;
+  border: none;
+  line-height: inherit;
+}
+
+sparkle-button svg {
+  fill: currentColor;
+  height: 1em;
+  margin-bottom: -0.125em;
+  width: 1em;
+}
+
+sparkle-button[round] {
+  border-radius: 2em;
+}
+sparkle-button[primary] {
+    background-color: rgba(var(--ion-color-sparkle-rgb));
+    color:var(--ion-color-sparkle-contrast);
+}
+
+@media (hover: hover) {
+  sparkle-button:hover {
+    --bg-alpha: 0.08;
+  }
+
+  sparkle-button:active {
+    --bg-alpha: 0.1;
+  }
+}