@sparkle-learning/core 0.0.27 → 0.0.30

package/dist/loader/index.d.ts

@@ -1,4 +1,3 @@
-
 export * from '../types/components';
 export interface CustomElementsDefineOptions {
   exclude?: string[];

package/dist/node_modules/@ionic/core/dist/collection/components/accordion/accordion.ios.css

@@ -0,0 +1,75 @@
+:host {
+  display: block;
+  position: relative;
+  width: 100%;
+  background-color: var(--ion-background-color, #ffffff);
+  overflow: hidden;
+  /**
+   * This is required to force WebKit
+   * to create a new stacking context
+   * otherwise the border radius is
+   * temporarily lost when hovering over
+   * the ion-item or expanding/collapsing
+   * the accordion.
+   */
+  z-index: 0;
+}
+
+:host(.accordion-expanding) ::slotted(ion-item[slot=header]),
+:host(.accordion-expanded) ::slotted(ion-item[slot=header]) {
+  --border-width: 0px;
+}
+
+:host(.accordion-animated) {
+  transition: all 300ms cubic-bezier(0.25, 0.8, 0.5, 1);
+}
+
+:host(.accordion-animated) #content {
+  transition: max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1);
+}
+
+#content {
+  overflow: hidden;
+  will-change: max-height;
+}
+
+:host(.accordion-collapsing) #content {
+  /* stylelint-disable-next-line declaration-no-important */
+  max-height: 0 !important;
+}
+
+:host(.accordion-collapsed) #content {
+  display: none;
+}
+
+:host(.accordion-expanding) #content {
+  max-height: 0;
+}
+
+:host(.accordion-disabled) #header,
+:host(.accordion-readonly) #header,
+:host(.accordion-disabled) #content,
+:host(.accordion-readonly) #content {
+  pointer-events: none;
+}
+
+/**
+ * We do not set the opacity on the
+ * host otherwise you would see the
+ * box-shadow behind it.
+ */
+:host(.accordion-disabled) #header,
+:host(.accordion-disabled) #content {
+  opacity: 0.4;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  :host,
+#content {
+    /* stylelint-disable declaration-no-important */
+    transition: none !important;
+  }
+}
+:host(.accordion-next) ::slotted(ion-item[slot=header]) {
+  --border-width: 0.55px 0px 0.55px 0px;
+}

package/dist/node_modules/@ionic/core/dist/collection/components/accordion/accordion.md.css

@@ -0,0 +1,72 @@
+:host {
+  display: block;
+  position: relative;
+  width: 100%;
+  background-color: var(--ion-background-color, #ffffff);
+  overflow: hidden;
+  /**
+   * This is required to force WebKit
+   * to create a new stacking context
+   * otherwise the border radius is
+   * temporarily lost when hovering over
+   * the ion-item or expanding/collapsing
+   * the accordion.
+   */
+  z-index: 0;
+}
+
+:host(.accordion-expanding) ::slotted(ion-item[slot=header]),
+:host(.accordion-expanded) ::slotted(ion-item[slot=header]) {
+  --border-width: 0px;
+}
+
+:host(.accordion-animated) {
+  transition: all 300ms cubic-bezier(0.25, 0.8, 0.5, 1);
+}
+
+:host(.accordion-animated) #content {
+  transition: max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1);
+}
+
+#content {
+  overflow: hidden;
+  will-change: max-height;
+}
+
+:host(.accordion-collapsing) #content {
+  /* stylelint-disable-next-line declaration-no-important */
+  max-height: 0 !important;
+}
+
+:host(.accordion-collapsed) #content {
+  display: none;
+}
+
+:host(.accordion-expanding) #content {
+  max-height: 0;
+}
+
+:host(.accordion-disabled) #header,
+:host(.accordion-readonly) #header,
+:host(.accordion-disabled) #content,
+:host(.accordion-readonly) #content {
+  pointer-events: none;
+}
+
+/**
+ * We do not set the opacity on the
+ * host otherwise you would see the
+ * box-shadow behind it.
+ */
+:host(.accordion-disabled) #header,
+:host(.accordion-disabled) #content {
+  opacity: 0.4;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  :host,
+#content {
+    /* stylelint-disable declaration-no-important */
+    transition: none !important;
+  }
+}

package/dist/node_modules/@ionic/core/dist/collection/components/accordion-group/accordion-group.ios.css

@@ -0,0 +1,25 @@
+:host {
+  display: block;
+}
+
+:host(.accordion-group-expand-inset) {
+  margin-left: 16px;
+  margin-right: 16px;
+  margin-top: 16px;
+  margin-bottom: 16px;
+}
+@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
+  :host(.accordion-group-expand-inset) {
+    margin-left: unset;
+    margin-right: unset;
+    -webkit-margin-start: 16px;
+    margin-inline-start: 16px;
+    -webkit-margin-end: 16px;
+    margin-inline-end: 16px;
+  }
+}
+
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanding),
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanded) {
+  border-bottom: none;
+}

package/dist/node_modules/@ionic/core/dist/collection/components/accordion-group/accordion-group.md.css

@@ -0,0 +1,59 @@
+:host {
+  display: block;
+}
+
+:host(.accordion-group-expand-inset) {
+  margin-left: 16px;
+  margin-right: 16px;
+  margin-top: 16px;
+  margin-bottom: 16px;
+}
+@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
+  :host(.accordion-group-expand-inset) {
+    margin-left: unset;
+    margin-right: unset;
+    -webkit-margin-start: 16px;
+    margin-inline-start: 16px;
+    -webkit-margin-end: 16px;
+    margin-inline-end: 16px;
+  }
+}
+
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion) {
+  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+}
+
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanding),
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanded) {
+  margin-left: 0;
+  margin-right: 0;
+  margin-top: 16px;
+  margin-bottom: 16px;
+  border-radius: 6px;
+}
+
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-previous) {
+  border-bottom-right-radius: 6px;
+  border-bottom-left-radius: 6px;
+}
+:host-context([dir=rtl]):host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-previous), :host-context([dir=rtl]).accordion-group-expand-inset ::slotted(ion-accordion.accordion-previous) {
+  border-bottom-right-radius: 6px;
+  border-bottom-left-radius: 6px;
+}
+
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-next) {
+  border-top-left-radius: 6px;
+  border-top-right-radius: 6px;
+}
+:host-context([dir=rtl]):host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-next), :host-context([dir=rtl]).accordion-group-expand-inset ::slotted(ion-accordion.accordion-next) {
+  border-top-left-radius: 6px;
+  border-top-right-radius: 6px;
+}
+
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion):first-of-type,
+:host(.accordion-group-expand-inset) ::slotted(ion-accordion):first-of-type {
+  margin-left: 0;
+  margin-right: 0;
+  margin-top: 0;
+  margin-bottom: 0;
+}

package/dist/node_modules/@ionic/core/dist/collection/components/action-sheet/action-sheet.ios.css

@@ -63,10 +63,6 @@
   left: 0;
   right: 0;
   bottom: 0;
-  margin-left: auto;
-  margin-right: auto;
-  margin-top: auto;
-  margin-bottom: auto;
   transform: translate3d(0,  100%,  0);
   display: block;
   position: absolute;
@@ -79,16 +75,6 @@
   z-index: 10;
   pointer-events: none;
 }
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  .action-sheet-wrapper {
-    margin-left: unset;
-    margin-right: unset;
-    -webkit-margin-start: auto;
-    margin-inline-start: auto;
-    -webkit-margin-end: auto;
-    margin-inline-end: auto;
-  }
-}
 
 .action-sheet-button {
   display: block;
@@ -296,12 +282,17 @@
   }
 }
 
+.action-sheet-title.action-sheet-has-sub-title {
+  font-weight: 600;
+}
+
 .action-sheet-sub-title {
   padding-left: 0;
   padding-right: 0;
-  padding-top: 15px;
+  padding-top: 6px;
   padding-bottom: 0;
-  font-size: 12px;
+  font-size: 13px;
+  font-weight: 400;
 }
 
 .action-sheet-button {
@@ -325,15 +316,15 @@
 }
 
 .action-sheet-button .action-sheet-icon {
-  margin-right: 0.1em;
+  margin-right: 0.3em;
   font-size: 28px;
   pointer-events: none;
 }
 @supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
   .action-sheet-button .action-sheet-icon {
     margin-right: unset;
-    -webkit-margin-end: 0.1em;
-    margin-inline-end: 0.1em;
+    -webkit-margin-end: 0.3em;
+    margin-inline-end: 0.3em;
   }
 }
 

package/dist/node_modules/@ionic/core/dist/collection/components/action-sheet/action-sheet.md.css

@@ -63,10 +63,6 @@
   left: 0;
   right: 0;
   bottom: 0;
-  margin-left: auto;
-  margin-right: auto;
-  margin-top: auto;
-  margin-bottom: auto;
   transform: translate3d(0,  100%,  0);
   display: block;
   position: absolute;
@@ -79,16 +75,6 @@
   z-index: 10;
   pointer-events: none;
 }
-@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
-  .action-sheet-wrapper {
-    margin-left: unset;
-    margin-right: unset;
-    -webkit-margin-start: auto;
-    margin-inline-start: auto;
-    -webkit-margin-end: auto;
-    margin-inline-end: auto;
-  }
-}
 
 .action-sheet-button {
   display: block;
@@ -200,12 +186,29 @@
   --color: rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);
 }
 
+.action-sheet-wrapper {
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: var(--ion-safe-area-top, 0);
+  margin-bottom: 0;
+}
+@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
+  .action-sheet-wrapper {
+    margin-left: unset;
+    margin-right: unset;
+    -webkit-margin-start: auto;
+    margin-inline-start: auto;
+    -webkit-margin-end: auto;
+    margin-inline-end: auto;
+  }
+}
+
 .action-sheet-title {
   padding-left: 16px;
   padding-right: 16px;
   padding-top: 20px;
   padding-bottom: 17px;
-  height: 60px;
+  min-height: 60px;
   color: var(--color, rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54));
   font-size: 16px;
   text-align: start;
@@ -233,7 +236,7 @@
   padding-top: 0;
 }
 .action-sheet-group:last-child {
-  padding-bottom: 0;
+  padding-bottom: var(--ion-safe-area-bottom);
 }
 .action-sheet-button {
   padding-left: 16px;

package/dist/node_modules/@ionic/core/dist/collection/components/alert/alert.md.css

@@ -252,7 +252,7 @@ textarea.alert-input {
 }
 
 .alert-message {
-  max-height: 240px;
+  max-height: 266px;
   font-size: 16px;
 }
 
@@ -291,7 +291,7 @@ textarea.alert-input {
 .alert-radio-group,
 .alert-checkbox-group {
   position: relative;
-  max-height: 240px;
+  max-height: 266px;
   border-top: 1px solid var(--ion-color-step-150, #d9d9d9);
   border-bottom: 1px solid var(--ion-color-step-150, #d9d9d9);
   overflow: auto;

package/dist/node_modules/@ionic/core/dist/collection/components/back-button/back-button.ios.css

@@ -80,6 +80,10 @@
   font-kerning: none;
 }
 
+ion-ripple-effect {
+  color: var(--ripple-color);
+}
+
 :host(.ion-color) .button-native {
   color: var(--ion-color-base);
 }

package/dist/node_modules/@ionic/core/dist/collection/components/back-button/back-button.md.css

@@ -80,6 +80,10 @@
   font-kerning: none;
 }
 
+ion-ripple-effect {
+  color: var(--ripple-color);
+}
+
 :host(.ion-color) .button-native {
   color: var(--ion-color-base);
 }

package/dist/node_modules/@ionic/core/dist/collection/components/breadcrumb/breadcrumb.ios.css

@@ -0,0 +1,234 @@
+:host {
+  /**
+    * @prop --color: Text color of the breadcrumb
+    * @prop --color-active: Text color of the active breadcrumb
+    * @prop --color-hover: Text color of the breadcrumb on hover
+    * @prop --color-focused: Text color of the breadcrumb when focused
+    * @prop --background-focused: Background color of the breadcrumb when focused
+    */
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+  color: var(--color);
+  font-size: 16px;
+  font-weight: 400;
+  line-height: 1.5;
+}
+
+.breadcrumb-native {
+  font-family: inherit;
+  font-size: inherit;
+  font-style: inherit;
+  font-weight: inherit;
+  letter-spacing: inherit;
+  text-decoration: inherit;
+  text-indent: inherit;
+  text-overflow: inherit;
+  text-transform: inherit;
+  text-align: inherit;
+  white-space: inherit;
+  color: inherit;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 0;
+  padding-bottom: 0;
+  margin-left: 0;
+  margin-right: 0;
+  margin-top: 0;
+  margin-bottom: 0;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  outline: none;
+  background: inherit;
+}
+
+:host(.breadcrumb-disabled) {
+  cursor: default;
+  opacity: 0.5;
+  pointer-events: none;
+}
+
+:host(.breadcrumb-active) {
+  color: var(--color-active);
+}
+
+:host(.ion-focused) {
+  color: var(--color-focused);
+}
+
+:host(.ion-focused) .breadcrumb-native {
+  background: var(--background-focused);
+}
+
+@media (any-hover: hover) {
+  :host(.ion-activatable:hover) {
+    color: var(--color-hover);
+  }
+
+  :host(.ion-activatable.in-breadcrumbs-color:hover),
+:host(.ion-activatable.ion-color:hover) {
+    color: var(--ion-color-shade);
+  }
+}
+.breadcrumb-separator {
+  display: inline-flex;
+}
+
+:host(.breadcrumb-collapsed) .breadcrumb-native {
+  display: none;
+}
+
+:host(.in-breadcrumbs-color),
+:host(.in-breadcrumbs-color.breadcrumb-active) {
+  color: var(--ion-color-base);
+}
+
+:host(.in-breadcrumbs-color) .breadcrumb-separator {
+  color: var(--ion-color-base);
+}
+
+:host(.ion-color) {
+  color: var(--ion-color-base);
+}
+
+:host(.in-toolbar-color),
+:host(.in-toolbar-color) .breadcrumb-separator {
+  color: rgba(var(--ion-color-contrast-rgb), 0.8);
+}
+
+:host(.in-toolbar-color.breadcrumb-active) {
+  color: var(--ion-color-contrast);
+}
+
+.breadcrumbs-collapsed-indicator {
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 0;
+  padding-bottom: 0;
+  margin-left: 14px;
+  margin-right: 14px;
+  margin-top: 0;
+  margin-bottom: 0;
+  display: flex;
+  flex: 1 1 100%;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 18px;
+  border: 0;
+  outline: none;
+  cursor: pointer;
+  appearance: none;
+}
+@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
+  .breadcrumbs-collapsed-indicator {
+    margin-left: unset;
+    margin-right: unset;
+    -webkit-margin-start: 14px;
+    margin-inline-start: 14px;
+    -webkit-margin-end: 14px;
+    margin-inline-end: 14px;
+  }
+}
+
+.breadcrumbs-collapsed-indicator ion-icon {
+  margin-top: 1px;
+  font-size: 22px;
+}
+
+:host {
+  --color: var(--ion-color-step-850, #2d4665);
+  --color-active: var(--ion-text-color, #03060b);
+  --color-hover: var(--ion-text-color, #03060b);
+  --color-focused: var(--color-active);
+  --background-focused: var(--ion-color-step-50, rgba(233, 237, 243, 0.7));
+}
+
+:host(.breadcrumb-active) {
+  font-weight: 600;
+}
+
+.breadcrumb-native {
+  border-radius: 4px;
+  padding-left: 12px;
+  padding-right: 12px;
+  padding-top: 5px;
+  padding-bottom: 5px;
+  border: 1px solid transparent;
+}
+@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
+  .breadcrumb-native {
+    padding-left: unset;
+    padding-right: unset;
+    -webkit-padding-start: 12px;
+    padding-inline-start: 12px;
+    -webkit-padding-end: 12px;
+    padding-inline-end: 12px;
+  }
+}
+
+:host(.ion-focused) .breadcrumb-native {
+  border-radius: 8px;
+}
+
+:host(.in-breadcrumbs-color.ion-focused) .breadcrumb-native,
+:host(.ion-color.ion-focused) .breadcrumb-native {
+  background: rgba(var(--ion-color-base-rgb), 0.1);
+  color: var(--ion-color-base);
+}
+
+:host(.ion-focused) ::slotted(ion-icon),
+:host(.in-breadcrumbs-color.ion-focused) ::slotted(ion-icon),
+:host(.ion-color.ion-focused) ::slotted(ion-icon) {
+  color: var(--ion-color-step-750, #445b78);
+}
+
+.breadcrumb-separator {
+  color: var(--ion-color-step-550, #73849a);
+}
+
+::slotted(ion-icon) {
+  color: var(--ion-color-step-400, #92a0b3);
+  font-size: 18px;
+}
+
+::slotted(ion-icon[slot=start]) {
+  margin-right: 8px;
+}
+@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
+  ::slotted(ion-icon[slot=start]) {
+    margin-right: unset;
+    -webkit-margin-end: 8px;
+    margin-inline-end: 8px;
+  }
+}
+
+::slotted(ion-icon[slot=end]) {
+  margin-left: 8px;
+}
+@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
+  ::slotted(ion-icon[slot=end]) {
+    margin-left: unset;
+    -webkit-margin-start: 8px;
+    margin-inline-start: 8px;
+  }
+}
+
+:host(.breadcrumb-active) ::slotted(ion-icon) {
+  color: var(--ion-color-step-850, #242d39);
+}
+
+.breadcrumbs-collapsed-indicator {
+  border-radius: 4px;
+  background: var(--ion-color-step-100, #e9edf3);
+  color: var(--ion-color-step-550, #73849a);
+}
+
+.breadcrumbs-collapsed-indicator:hover {
+  opacity: 0.45;
+}
+
+.breadcrumbs-collapsed-indicator:focus {
+  background: var(--ion-color-step-150, #d9e0ea);
+}