@sparkle-learning/core 0.0.57 → 0.0.59

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

@@ -0,0 +1,97 @@
+import { r as registerInstance, h, H as Host, e as getElement } from './index-c04b9ed5.js';
+import { S as StudentService } from './student.service-08af124f.js';
+import { t as toastController } from './overlays-4233a39d.js';
+import './httpService-7986aeed.js';
+import './auth.store-dba2c2da.js';
+import './environment-config.service-b191f276.js';
+import './token.service-71a5d33f.js';
+import './localstorage.service-4bf408c8.js';
+import './ionic-global-4903e23e.js';
+import './hardware-back-button-fa04d6e9.js';
+import './helpers-bf0e23d6.js';
+
+const sparkleFeedbackCss = ":host{display:block}";
+
+const SparkleFeedback = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.formControls = {
+      type: {
+        isValid: true,
+        value: 1,
+        validate: value => {
+          if (value) {
+            return true;
+          }
+          else {
+            return false;
+          }
+        },
+      },
+      note: {
+        isValid: false,
+        value: '',
+        validate: value => {
+          if (value) {
+            return true;
+          }
+          else {
+            return false;
+          }
+        },
+      }
+    };
+    this.submitted = true;
+  }
+  async onSubmit(e) {
+    e.preventDefault();
+    this.submitted = true;
+    let isFormValid = true;
+    //Run all validation functions
+    for (let controlName in this.formControls) {
+      let control = this.formControls[controlName];
+      control.validate(control.value);
+      if (!control.isValid) {
+        isFormValid = false;
+      }
+    }
+    if (isFormValid) {
+      let result = await StudentService.getInstance().submitFeedback({
+        Note: this.formControls.note.value,
+        Type: this.formControls.type.value
+      });
+      console.log(result);
+      if (result.Succeeded) {
+        const toast = await toastController.create({
+          message: "Feedback submitted successfully",
+          duration: 3000
+        });
+        toast.present();
+        this.dismiss();
+      }
+      else {
+        const toast = await toastController.create({
+          message: result.Message,
+          duration: 3000
+        });
+        toast.present();
+      }
+    }
+  }
+  dismiss(data) {
+    // dismiss the closest modal and optionally pass back data
+    this.el.closest('ion-modal').dismiss({
+      'dismissed': true
+    });
+  }
+  changeFormValue(controlName, value) {
+    this.formControls = Object.assign(Object.assign({}, this.formControls), { [controlName]: Object.assign(Object.assign({}, this.formControls[controlName]), { value: value, isValid: this.formControls[controlName].validate(value) }) });
+  }
+  render() {
+    return (h(Host, null, h("ion-header", { translucent: true }, h("ion-toolbar", null, h("ion-title", null, "Feedback"), h("ion-buttons", { slot: "end" }, h("ion-button", { onClick: () => this.dismiss() }, "Close")))), h("ion-content", { class: "ion-padding" }, h("form", { onSubmit: (e) => this.onSubmit(e), novalidate: true }, h("ion-list", null, h("ion-radio-group", { value: this.formControls.type.value, onChange: (e) => this.changeFormValue("type", +e.target.value) }, h("ion-list-header", null, h("ion-label", null, "Feedback Type")), h("ion-item", null, h("ion-label", null, "Comments"), h("ion-radio", { value: 1 })), h("ion-item", null, h("ion-label", null, "Suggestions"), h("ion-radio", { value: 2 })), h("ion-item", null, h("ion-label", null, "Questions"), h("ion-radio", { value: 3 }))), h("ion-item", null, h("ion-label", { position: "floating" }, "Notes"), h("ion-textarea", { value: this.formControls.note.value, onChange: (e) => this.changeFormValue("note", e.target.value) })), h("br", null), h("ion-button", { color: "primary", type: "submit" }, "Submit"))))));
+  }
+  get el() { return getElement(this); }
+};
+SparkleFeedback.style = sparkleFeedbackCss;
+
+export { SparkleFeedback as sparkle_feedback };

package/dist/esm/sparkle-file-upload.entry.js

@@ -0,0 +1,49 @@
+import { r as registerInstance, i as createEvent, h, H as Host, e as getElement } from './index-c04b9ed5.js';
+import { M as MediaService } from './media.service-6e90bc41.js';
+import './httpService-7986aeed.js';
+import './auth.store-dba2c2da.js';
+import './overlays-4233a39d.js';
+import './ionic-global-4903e23e.js';
+import './hardware-back-button-fa04d6e9.js';
+import './helpers-bf0e23d6.js';
+import './environment-config.service-b191f276.js';
+import './token.service-71a5d33f.js';
+import './localstorage.service-4bf408c8.js';
+
+const sparkleFileUploadCss = "";
+
+const SparkleFileUpload = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.fileUploaded = createEvent(this, "fileUploaded", 7);
+    this.uploadImageLoading = false;
+  }
+  componentDidLoad() { }
+  async uploadImage(evt) {
+    this.uploadImageLoading = true;
+    var files = evt.target.files;
+    let result = await MediaService.getInstance().uploadImage(files);
+    if (result.Succeeded) {
+      console.log(result);
+      this.uploadImageLoading = false;
+      this.uploadedImage = result.Data.length > 0 ? result.Data[0].FullImageUrl : '';
+      this.value = this.uploadedImage;
+      this.fileUploaded.emit(this.uploadedImage);
+    }
+    else {
+      this.uploadImageLoading = false;
+      this.errorMessage = 'There is an error while uploading an image.';
+    }
+  }
+  selectFile() {
+    var fileInput = this.el.shadowRoot.querySelector('#fileInput');
+    fileInput.click();
+  }
+  render() {
+    return (h(Host, null, this.uploadedImage ? (h("ion-item", { class: "ion-padding", lines: "none" }, 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/*,application/pdf,application/msword,application/vnd.ms-excel,application/vnd.ms-powerpoint,text/plain" }), this.uploadImageLoading ? h("ion-spinner", { color: "primary" }) : '', h("ion-button", { slot: "start", onClick: evt => this.selectFile() }, h("ion-icon", { name: "add" }), "Upload Image"))));
+  }
+  get el() { return getElement(this); }
+};
+SparkleFileUpload.style = sparkleFileUploadCss;
+
+export { SparkleFileUpload as sparkle_file_upload };

package/dist/esm/sparkle-goal-form.entry.js

@@ -0,0 +1,175 @@
+import { r as registerInstance, h, e as getElement } from './index-c04b9ed5.js';
+import { S as SparkleGlobal, G as GetGoalAppData, e as MyGoalTemplate, f as MyGoalTemplateJSON } from './util-57cc8006.js';
+import { E as EnvironmentConfigService } from './environment-config.service-b191f276.js';
+import { A as AssetsService } from './assets.service-def1d63c.js';
+import { A as AppDataService, g as goalStore } from './appdata.service-2e84e167.js';
+import { F as FeedService, f as feedStore } from './feed.service-b4f3cae4.js';
+import './httpService-7986aeed.js';
+import './auth.store-dba2c2da.js';
+import './overlays-4233a39d.js';
+import './ionic-global-4903e23e.js';
+import './hardware-back-button-fa04d6e9.js';
+import './helpers-bf0e23d6.js';
+import './token.service-71a5d33f.js';
+import './localstorage.service-4bf408c8.js';
+
+const sparkleGoalFormCss = ":host{display:block}";
+
+const SparkleGoalForm = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.name = {
+      valid: false,
+      value: ''
+    };
+    this.description = {
+      valid: false,
+      value: ''
+    };
+    this.category = {
+      valid: false,
+      value: ''
+    };
+    this.progress = 0;
+    this.public = true;
+    this.goalUpdateText = {
+      valid: true,
+      value: ''
+    };
+    this.submitted = false;
+  }
+  goalHanlder(data) {
+    this.updateGoal(data.AppData);
+  }
+  ;
+  componentWillLoad() {
+    if (this.appData) {
+      this.updateGoal(this.appData.AppData);
+    }
+  }
+  updateGoal(data) {
+    if (data) {
+      this.name = Object.assign(Object.assign({}, this.name), { value: data.Name });
+      this.description = Object.assign(Object.assign({}, this.description), { value: data.Description });
+      this.category = Object.assign(Object.assign({}, this.category), { value: data.Category });
+      this.goalUpdateText = Object.assign(Object.assign({}, this.goalUpdateText), { value: data.GoalText });
+      this.progress = data.Percentage;
+    }
+  }
+  handleTitle(ev) {
+    this.validateTitle();
+    this.name = Object.assign(Object.assign({}, this.name), { value: ev.target.value });
+  }
+  handleDescription(ev) {
+    this.validateDescription();
+    this.description = Object.assign(Object.assign({}, this.description), { value: ev.target.value });
+  }
+  handleCategory(ev) {
+    this.validateCategoy();
+    this.category = Object.assign(Object.assign({}, this.category), { value: ev.target.value });
+  }
+  handleGoalProgressInfo(ev) {
+    this.goalUpdateText = Object.assign(Object.assign({}, this.goalUpdateText), { value: ev.target.value });
+  }
+  validateTitle() {
+    if (this.name.value && this.name.value.length > 0) {
+      this.name = Object.assign(Object.assign({}, this.name), { valid: true });
+      return;
+    }
+    this.name = Object.assign(Object.assign({}, this.name), { valid: false });
+  }
+  validateDescription() {
+    if (this.description.value && this.description.value.length > 0) {
+      this.description = Object.assign(Object.assign({}, this.description), { valid: true });
+      return;
+    }
+    this.description = Object.assign(Object.assign({}, this.description), { valid: false });
+  }
+  validateCategoy() {
+    if (this.category.value && this.category.value.length > 0) {
+      this.category = Object.assign(Object.assign({}, this.category), { valid: true });
+      return;
+    }
+    this.category = Object.assign(Object.assign({}, this.category), { valid: false });
+  }
+  validateGoalUpdateText() {
+    if (this.goalUpdateText.value && this.goalUpdateText.value.length > 0) {
+      this.goalUpdateText = Object.assign(Object.assign({}, this.goalUpdateText), { valid: true });
+      return;
+    }
+    this.goalUpdateText = Object.assign(Object.assign({}, this.goalUpdateText), { valid: false });
+  }
+  async onSubmit(e) {
+    e.preventDefault();
+    console.log('clicked signup');
+    this.validateTitle();
+    this.validateDescription();
+    this.validateCategoy();
+    this.submitted = true;
+    if (this.appData && this.appData.Id > 0) {
+      this.validateGoalUpdateText();
+      if (this.name.valid && this.description.valid && this.category.valid && this.goalUpdateText.valid) {
+        //update
+        var appData = GetGoalAppData(this.name.value, this.description.value, this.category.value, this.progress, this.goalUpdateText.value);
+        const result = await AppDataService.getInstance().updateGoal({ Id: this.appData.Id, MiniAppId: SparkleGlobal.MY_GOALS_APP_ID, AppJsonData: JSON.stringify(appData) });
+        if (result.Succeeded) {
+          if (this.public) {
+            await this.postToFeed();
+          }
+          else {
+            this.dismiss();
+          }
+        }
+      }
+    }
+    else {
+      if (this.name.valid && this.description.valid && this.category.valid) {
+        //add
+        var appData = GetGoalAppData(this.name.value, this.description.value, this.category.value, this.progress, this.goalUpdateText.value);
+        const result = await AppDataService.getInstance().createGoal({ MiniAppId: SparkleGlobal.MY_GOALS_APP_ID, AppJsonData: JSON.stringify(appData) });
+        if (result.Succeeded) {
+          this.dismiss();
+        }
+      }
+    }
+  }
+  async postToFeed() {
+    const sparkleConfig = EnvironmentConfigService.getInstance().get('sparkle');
+    const tocData = await AssetsService.getInstance().loadJsonFile(sparkleConfig.tocPath);
+    var model = {
+      CourseId: tocData.id,
+      MiniAppId: SparkleGlobal.MY_GOALS_APP_ID,
+      PostText: MyGoalTemplate(this.name.value, this.goalUpdateText.value, this.progress),
+      PostTextJSON: MyGoalTemplateJSON(this.name.value, this.goalUpdateText.value, this.progress),
+      IsPublic: this.public,
+      ExternalResourceUrl: "",
+    };
+    const result = await FeedService.getInstance().createPost(model);
+    if (result.Succeeded) {
+      this.dismiss();
+    }
+  }
+  dismiss(data) {
+    // dismiss the closest modal and optionally pass back data
+    this.el.closest('ion-modal').dismiss({
+      'dismissed': true
+    });
+  }
+  renderEditBookingFields() {
+    if (this.appData) {
+      return (h("div", null, h("ion-item", null, h("ion-label", { position: "stacked", color: "primary" }, "Goal Progress Info"), h("ion-input", { name: "title", type: "text", value: this.goalUpdateText.value, onInput: (ev) => this.handleGoalProgressInfo(ev) })), h("ion-text", { color: "danger" }, h("p", { hidden: this.goalUpdateText.valid || this.submitted === false, class: "ion-padding-start" }, "Goal Progress text is required")), h("ion-item", null, h("ion-label", { position: "stacked" }, "Progress"), h("ion-range", { value: this.progress, min: 1, max: 100, step: 1, snaps: true, pin: true, onIonChange: (e) => this.progress = +e.detail.value }, h("ion-icon", { size: "small", slot: "start", name: "pulse" }), h("ion-icon", { name: "pulse", size: "small" }), h("strong", { slot: "end" }, this.progress))), h("ion-text", { color: "danger" }, h("p", { hidden: this.progress > 0 || this.submitted === false, class: "ion-padding-start" }, "Min Progress value should be 1")), h("ion-item", { lines: "none" }, h("ion-label", null, "Share to Community Wall"), h("ion-checkbox", { slot: "start", onChange: (ev) => this.public = ev.detail.checked, checked: true }))));
+    }
+  }
+  render() {
+    return [
+      h("div", null, h("ion-toolbar", { color: "primary" }, h("ion-buttons", { slot: "start" }, h("ion-back-button", { defaultHref: "home", onClick: () => this.dismiss() })), h("ion-title", null, "Add New Goal")), h("div", { class: "inner-content" }, h("form", { class: "ion-padding", novalidate: true, onSubmit: (e) => this.onSubmit(e) }, h("ion-list", { "no-lines": true }, h("ion-item", null, h("ion-label", { position: "stacked", color: "primary" }, "Title"), h("ion-input", { name: "title", type: "text", value: this.name.value, onInput: (ev) => this.handleTitle(ev), required: true })), h("ion-text", { color: "danger" }, h("p", { hidden: this.name.valid || this.submitted === false, class: "ion-padding-start" }, "Title is required")), h("ion-item", null, h("ion-label", { position: "stacked", color: "primary" }, "Description"), h("ion-textarea", { name: "desciption", value: this.description.value, onInput: (ev) => this.handleDescription(ev), required: true })), h("ion-text", { color: "danger" }, h("p", { hidden: this.description.valid || this.submitted === false, class: "ion-padding-start" }, "Description is required")), h("ion-item", null, h("ion-label", null, "Category"), h("ion-select", { value: this.category.value, onIonChange: (e) => this.handleCategory(e) }, h("ion-select-option", { value: "Emotional" }, "Emotional"), h("ion-select-option", { value: "Interpersonal" }, "Interpersonal"), h("ion-select-option", { value: "Learning" }, "Learning"), h("ion-select-option", { value: "Financial" }, "Financial"), h("ion-select-option", { value: "Physical" }, "Physical"))), h("ion-text", { color: "danger" }, h("p", { hidden: this.category.valid || this.submitted === false, class: "ion-padding-start" }, "Category is required")), this.renderEditBookingFields()), h("div", { class: "ion-padding" }, this.appData && h("ion-button", { type: "submit", expand: "block", disabled: goalStore.state.goalLoading || feedStore.state.postIdLoading > 0 }, goalStore.state.goalLoading && h("ion-spinner", { name: "dots" }), "  Update"), !this.appData && h("ion-button", { type: "submit", expand: "block", disabled: goalStore.state.goalLoading }, goalStore.state.goalLoading && h("ion-spinner", { name: "dots" }), "  Add")))))
+    ];
+  }
+  get el() { return getElement(this); }
+  static get watchers() { return {
+    "appData": ["goalHanlder"]
+  }; }
+};
+SparkleGoalForm.style = sparkleGoalFormCss;
+
+export { SparkleGoalForm as sparkle_goal_form };

package/dist/esm/sparkle-gww-comment-list.entry.js

@@ -0,0 +1,22 @@
+import { r as registerInstance, h, c as getAssetPath, H as Host, e as getElement } from './index-c04b9ed5.js';
+
+const sparkleGwwCommentListCss = ":host{display:block}.avatar{width:30px;height:30px}";
+
+const SparkleGwwCommentList = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  dismiss(data) {
+    // dismiss the closest modal and optionally pass back data
+    this.el.closest('ion-modal').dismiss({
+      'dismissed': true
+    });
+  }
+  render() {
+    return (h(Host, null, h("ion-toolbar", { color: "primary" }, h("ion-buttons", { slot: "start" }, h("ion-back-button", { defaultHref: "great-white-wall", onClick: () => this.dismiss() })), h("ion-title", null, "Comments")), h("ion-content", null, this.comments.map((comment) => h("ion-item", null, h("ion-avatar", { class: "avatar", slot: "start" }, h("img", { src: getAssetPath("/assets/img/user.png") })), h("ion-label", null, h("h2", null, comment.Name), h("p", null, comment.Comment)))))));
+  }
+  get el() { return getElement(this); }
+};
+SparkleGwwCommentList.style = sparkleGwwCommentListCss;
+
+export { SparkleGwwCommentList as sparkle_gww_comment_list };

package/dist/esm/sparkle-gww-graph.entry.js

@@ -0,0 +1,15 @@
+import { r as registerInstance, h, H as Host } from './index-c04b9ed5.js';
+
+const sparkleGwwGraphCss = ":host{display:block}";
+
+const SparkleGwwGraph = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  render() {
+    return (h(Host, null, h("slot", null)));
+  }
+};
+SparkleGwwGraph.style = sparkleGwwGraphCss;
+
+export { SparkleGwwGraph as sparkle_gww_graph };

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

@@ -0,0 +1,52 @@
+import { r as registerInstance, i as createEvent, h } from './index-c04b9ed5.js';
+
+const sparkleInputCss = "";
+
+const SparkleInput = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.valueChanged = createEvent(this, "valueChanged", 7);
+    this.checkedChanged = createEvent(this, "checkedChanged", 7);
+  }
+  arrayDataWatcher(newValue) {
+    if (typeof newValue === 'string') {
+      this._options = JSON.parse(newValue);
+    }
+    else {
+      this._options = newValue;
+    }
+  }
+  componentWillLoad() {
+    if (this.type == 'select') {
+      this.arrayDataWatcher(this.options);
+    }
+  }
+  handleChange(event) {
+    const value = this.type === 'checkbox' ? event.target.checked : event.target.value;
+    this.value = value;
+    this.valueChanged.emit(value);
+    if (this.type === 'checkbox') {
+      this.checkedChanged.emit(value);
+    }
+  }
+  render() {
+    switch (this.type) {
+      case 'text'    :
+        return (h("div", null, h("ion-item", null, h("ion-label", null, this.label), h("ion-input", { type: this.type, value: this.value, placeholder: this.placeholder, onInput: (event) => this.handleChange(event), required: true }))));
+      case 'textarea':
+        return (h("div", null, h("ion-item", null, h("ion-label", null, this.label), h("ion-textarea", { value: this.value, placeholder: this.placeholder, onInput: (event) => this.handleChange(event), required: true }))));
+      case 'checkbox':
+        return (h("div", null, h("ion-item", null, h("ion-checkbox", { slot: "start", checked: this.checked, onChange: (event) => this.handleChange(event) }), h("ion-label", null, this.label))));
+      case 'select':
+        return (h("div", null, h("ion-item", null, h("ion-select", { value: this.value, placeholder: this.label, onIonChange: event => this.handleChange(event) }, this._options.map(option => (h("ion-select-option", { key: option.value, value: option.value }, option.label)))))));
+      default:
+        return null;
+    }
+  }
+  static get watchers() { return {
+    "options": ["arrayDataWatcher"]
+  }; }
+};
+SparkleInput.style = sparkleInputCss;
+
+export { SparkleInput as sparkle_input };

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

@@ -0,0 +1,22 @@
+import { r as registerInstance, h, e as getElement } from './index-c04b9ed5.js';
+
+const sparkleIntroCss = ".people{display:flex}.character-intro{width:100%;padding:15px;border:1px red solid;border-radius:5px}.character-image{opacity:0.5}.character-image:hover{opacity:1}";
+
+const SparkleIntro = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  componentDidLoad() { }
+  introOnMouseOver(description, event) {
+    this.description = description;
+    console.log(event);
+    event.target.style.opacity = 1;
+  }
+  render() {
+    return (h("div", null, h("div", { class: "people" }, h("div", { class: "character-image zynab", onMouseOver: evt => this.introOnMouseOver('<strong>I’m Zinab or Z.</strong> My family’s from Nigeria, and we live in the Melrose section of the South Bronx. I’m all about racial justice, and watch… I’m going to be the first Muslim mayor of New York City. Believe that!', evt) }, h("img", { src: "/assets/img/characters/zynab.png" })), h("div", { class: "character-image kimberley", onMouseOver: evt => this.introOnMouseOver('<strong>Hey, everyone, this is Kimberly </strong>and I’m from Brooklyn. My dream is to become a venture capitalist, so I can fund businesses and causes led by other Black Women. I love watching reality TV shows that are related to business like Shark Tank and Undercover Boss.', evt) }, h("img", { src: "/assets/img/characters/kimberly.png" })), h("div", { class: "character-image jen", onMouseOver: evt => this.introOnMouseOver('<strong>Hi, my name’s Jen</strong> and I’m from Murray Hill Queens. Second-generation Korean American. I love softball and statistics, so right now my dream job would be in sabermetrics. You know, basically a data analyst in baseball.', evt) }, h("img", { src: "/assets/img/characters/jen.png" })), h("div", { class: "character-image yuna", onMouseOver: evt => this.introOnMouseOver('<strong>Hi, my name’s Yuna</strong> and I’m from Murray Hill Queens. Second-generation Korean American. I love softball and statistics, so right now my dream job would be in sabermetrics. You know, basically a data analyst in baseball.', evt) }, h("img", { src: "/assets/img/characters/yuna.png" })), h("div", { class: "character-image valeria", onMouseOver: evt => this.introOnMouseOver('<strong>I’m VALERIA but most of my friends call me Val.</strong> First-generation Dominican from Washington Heights. I could watch MSNBC and CNN all day. In fact, one day I’m going to have my own political talk show like my crushes Rachel Maddow and Robin Roberts.', evt) }, h("img", { src: "/assets/img/characters/valeria.png" }))), h("div", { class: "people-description" }, this.description ? h("div", { class: "character-intro", innerHTML: this.description }) : '')));
+  }
+  get el() { return getElement(this); }
+};
+SparkleIntro.style = sparkleIntroCss;
+
+export { SparkleIntro as sparkle_intro };

package/dist/esm/sparkle-lower-content-nav.entry.js

@@ -0,0 +1,18 @@
+import { r as registerInstance, h } from './index-c04b9ed5.js';
+
+const sparkleLowerContentNavCss = "lower-content-nav{display:flex;justify-content:space-between}lower-content-nav>stencil-route-link{display:inline-block}";
+
+const SparkleLowerContentNav = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  render() {
+    return [
+      this.prev != null ? (h("stencil-route-link", { url: this.prev.url, anchorClass: "pull-left btn btn--secondary" }, "Back")) : null,
+      this.next != null ? (h("stencil-route-link", { url: this.next.url, anchorClass: "pull-right btn btn--primary" }, "Next")) : null,
+    ];
+  }
+};
+SparkleLowerContentNav.style = sparkleLowerContentNavCss;
+
+export { SparkleLowerContentNav as sparkle_lower_content_nav };

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

@@ -0,0 +1,42 @@
+import { r as registerInstance, h, e as getElement, H as Host } from './index-c04b9ed5.js';
+import { D as DownArrow } from './icons-1c794c74.js';
+
+const collapsibleCss = "collapsible{}";
+
+const SparkleMenuCollapsible = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.isOpen = true; // default open
+  }
+  hostData() {
+    return {
+      class: 'sparkle-menu-collapsible--status-open',
+      role: 'button',
+      tabindex: '0',
+      'aria-label': 'Collapsible Menu'
+    };
+  }
+  toggle() {
+    this.isOpen = !this.isOpen;
+    removeClassThatStartWith(this.el, 'sparkle-menu-collapsible--status-');
+    this.el.classList.add(`sparkle-menu-collapsible--status-${this.isOpen ? 'open' : 'closed'}`);
+  }
+  __stencil_render() {
+    return [
+      h("a", { onClick: () => this.toggle(), class: `sparkle-menu-collapsible__title` }, this.heading, h(DownArrow, null)),
+      h("div", { class: "sparkle-menu-collapsible__contents" }, h("slot", null))
+    ];
+  }
+  get el() { return getElement(this); }
+  render() { return h(Host, this.hostData(), this.__stencil_render()); }
+};
+const removeClassThatStartWith = (el, classStart) => {
+  el.classList.forEach(className => {
+    if (className.startsWith(classStart)) {
+      el.classList.remove(className);
+    }
+  });
+};
+SparkleMenuCollapsible.style = collapsibleCss;
+
+export { SparkleMenuCollapsible as sparkle_menu_collapsible };

package/dist/esm/sparkle-modal-image.entry.js

@@ -0,0 +1,30 @@
+import { r as registerInstance, h, H as Host } from './index-c04b9ed5.js';
+
+const modalImageCss = ":host{display:block}.overlay{opacity:0;visibility:hidden;position:fixed;width:100%;height:100%;top:0;left:0;background:rgba(0, 0, 0, 0.7);-webkit-transition:opacity 0.5s, visibility 0s 0.5s;transition:opacity 0.5s, visibility 0s 0.5s;display:flex;align-items:center;justify-content:center;z-index:100}.is-visible{opacity:1;visibility:visible;-webkit-transition:opacity 0.5s;transition:opacity 0.5s}.is-transparent{opacity:0}.modal-window{border-radius:25px;width:75%;height:75%;padding:50px;display:flex;align-items:center;justify-content:center}.modal-window__content{width:100%;height:100%;display:flex;justify-content:center;align-items:center;animation-name:zoom;animation-duration:0.6s}@keyframes zoom{from{transform:scale(0)}to{transform:scale(1)}}";
+
+const SparkleModalImage = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.openDialog = false;
+    this.transparent = false;
+  }
+  handleKeyDown(ev) {
+    if (ev.key === 'Escape') {
+      this.openDialog = false;
+    }
+  }
+  handleScroll() {
+    if (this.openDialog) {
+      this.openDialog = false;
+    }
+  }
+  openImage() {
+    this.openDialog = true;
+  }
+  render() {
+    return (h(Host, null, h("a", { href: "javascript:void()", onClick: () => this.openImage() }, h("img", { src: this.src, alt: this.alt, width: this.width, height: this.height })), this.openDialog && h("div", { class: 'overlay ' + (this.openDialog ? 'is-visible' : '') + ' ' + (this.transparent ? 'is-transparent' : '') }, h("div", { class: "modal-window" }, h("div", { class: "modal-window__content" }, h("img", { src: this.src, alt: this.alt, width: this.width, height: this.height }))))));
+  }
+};
+SparkleModalImage.style = modalImageCss;
+
+export { SparkleModalImage as sparkle_modal_image };

package/dist/esm/sparkle-notfound-page.entry.js

@@ -0,0 +1,21 @@
+import { r as registerInstance, h } from './index-c04b9ed5.js';
+
+const notfoundPageCss = "notfound-page{text-align:center}";
+
+const SparkleNotFoundPage = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.fileNotFound = () => {
+      const metaTag = document.createElement('meta');
+      metaTag.setAttribute('http-equiv', 'status');
+      metaTag.setAttribute('content', '404');
+      document.head.appendChild(metaTag);
+    };
+  }
+  render() {
+    return (h("div", null, h("h1", null, "Uh oh! We can't find the page you're looking for."), h("p", null, h("stencil-route-link", { url: '/', class: 'block' }, "Back to the home page"))));
+  }
+};
+SparkleNotFoundPage.style = notfoundPageCss;
+
+export { SparkleNotFoundPage as sparkle_notfound_page };

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

@@ -0,0 +1,88 @@
+import { r as registerInstance, i as createEvent, h, H as Host, e as getElement } from './index-c04b9ed5.js';
+
+const overlayCss = "sparkle-overlay{--sparkle-z-index-xl:500;--sparkle-transition-fast:0.3s;--sparkle-color-light-base:197, 209, 218;--sparkle-shadow-xl:0 20px 40px rgba(0, 0, 0, 0.2)}.sparkle-overlay{-ms-flex-align:center;align-items:center;display:flex;visibility:hidden;-ms-flex-pack:center;justify-content:center;position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:auto;-ms-touch-action:none;touch-action:none;opacity:0;z-index:var(--sparkle-z-index-xl)}.sparkle-overlay,.sparkle-overlay.opened{-webkit-transition:all var(--sparkle-transition-fast) ease-in-out;transition:all var(--sparkle-transition-fast) ease-in-out}.sparkle-overlay.opened{visibility:visible;opacity:1}.sparkle-overlay.opened .content{-webkit-transition:all var(--sparkle-transition-fast) ease-in-out;transition:all var(--sparkle-transition-fast) ease-in-out}.sparkle-overlay.light{background-color:rgba(var(--sparkle-color-light-base), 0.6)}.sparkle-overlay.dark{background-color:rgba(var(--sparkle-color-dark-base), 0.6)}.sparkle-overlay.absolute{position:absolute}.sparkle-overlay .scrim{border-radius:inherit;height:100%;position:absolute;top:0;bottom:0;left:0;right:0;-webkit-transition:inherit;transition:inherit;width:100%;will-change:opacity}.sparkle-overlay .content{position:relative;outline:none;-webkit-box-shadow:var(--sparkle-shadow-xl);box-shadow:var(--sparkle-shadow-xl);-webkit-transition:all var(--sparkle-transition-fast) ease-in-out;transition:all var(--sparkle-transition-fast) ease-in-out}";
+
+const FOCUSABLE_ELEMENTS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), [tabindex="0"]';
+const SparkleOverlay = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.shown = createEvent(this, "shown", 7);
+    this.hidden = createEvent(this, "hidden", 7);
+    this.theme = 'dark';
+    this.preventClose = false;
+    this.focusIndex = 0;
+    this.isShowing = false;
+  }
+  async show() {
+    this.$focusedElBeforeOpen = document.activeElement;
+    this.$focusedElBeforeOpen && this.$focusedElBeforeOpen.setAttribute("aria-expanded", "true");
+    this.isShowing = true;
+    if (this.$focusableEls.length > 0)
+      setTimeout(() => this.$focusableEls[0].focus(), 100);
+    else
+      setTimeout(() => this.$content.focus(), 100);
+    this.shown.emit();
+  }
+  async hide() {
+    this.isShowing = false;
+    this.focusIndex = 0;
+    if (this.$focusedElBeforeOpen) {
+      this.$focusedElBeforeOpen.setAttribute("aria-expanded", "false");
+      this.$focusedElBeforeOpen.focus();
+    }
+    this.hidden.emit();
+  }
+  handleKeyDown(e) {
+    const KEY_TAB = 9;
+    const KEY_ESC = 27;
+    switch (e.keyCode) {
+      case KEY_TAB:
+        this.handleTab(e);
+        break;
+      case KEY_ESC:
+        this.handleEsc();
+        break;
+    }
+  }
+  handleEsc() {
+    if (!this.preventClose)
+      this.hide();
+  }
+  handleTab(e) {
+    e.preventDefault();
+    if (e.shiftKey) {
+      this.handleBackwardTab();
+    }
+    else {
+      this.handleForwardTab();
+    }
+  }
+  handleBackwardTab() {
+    this.focusIndex = this.focusIndex === 0 ? this.$focusableEls.length - 1 : --this.focusIndex;
+    this.$focusableEls[this.focusIndex].focus();
+  }
+  handleForwardTab() {
+    this.focusIndex = this.$focusableEls.length - 1 === this.focusIndex ? 0 : ++this.focusIndex;
+    this.$focusableEls[this.focusIndex].focus();
+  }
+  handleScrimClick() {
+    if (!this.preventClose)
+      this.hide();
+  }
+  componentDidLoad() {
+    this.$focusableEls = Array.from(this.$el.querySelectorAll(FOCUSABLE_ELEMENTS));
+  }
+  render() {
+    let classes = {
+      'sparkle-overlay': true,
+      [this.theme]: true,
+      'absolute': this.absolute,
+      'opened': this.isShowing
+    };
+    return (h(Host, { class: classes }, h("div", { class: "scrim", onClick: () => this.handleScrimClick() }), h("div", { class: "content", role: "dialog", "aria-labelledby": this.titleId, tabindex: "-1", ref: el => this.$content = el }, h("slot", null))));
+  }
+  get $el() { return getElement(this); }
+};
+SparkleOverlay.style = overlayCss;
+
+export { SparkleOverlay as sparkle_overlay };