@rededor/cura 1.0.0-alpha.1 → 1.0.0-alpha.3

package/dist/cjs/cura-toast.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"cura-toast.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/cura-toast/cura-toast.scss?tag=cura-toast&encapsulation=shadow","src/components/cura-toast/cura-toast.tsx"],"sourcesContent":["@import '../../../src/scss/mixins/responsive.scss';\n@import '../../../src/scss/mixins/shadows.scss';\n\n@mixin horizontalConfig($property) {\n  #{$property}: 24px;\n\n  &.center {\n    #{$property}: -100%;\n    left: 50%;\n    transform: translateX(-50%);\n    opacity: 0;\n    transition: opacity 0.5s ease-in-out, #{$property} 0.5s ease-in-out;\n\n    &.active {\n      #{$property}: 24px;\n      opacity: 1;\n    }\n  }\n}\n\n@mixin verticalConfig($property) {\n  #{$property}: -100%;\n  opacity: 0;\n  transition: opacity 0.5s ease-in-out, #{$property} 0.5s ease-in-out;\n  \n  @include mobile-only() {\n    right: unset;\n    left: 50%;\n    transform: translateX(-50%);\n  }\n\n  &.active {\n    #{$property}: 24px;\n    opacity: 1;\n  }\n}\n\n:host {\n  display: block;\n  box-sizing: border-box;\n\n  .container {\n    position: fixed;\n    display: flex;\n    box-sizing: border-box;\n    min-width: 328px;\n    height: fit-content;\n    padding: 16px;\n    border: 1px solid var(--color-base);\n    border-radius: 12px;\n    background-color: var(--neutral-purewhite);\n    overflow: hidden;\n    @include shadow-level4();\n\n    &.loader {\n      padding: 16px 16px 20px;\n    }\n\n    &.top {\n      @include horizontalConfig(top);\n    }\n\n    &.bottom {\n      @include horizontalConfig(bottom);\n    }\n\n    &.left {\n      @include verticalConfig(left);\n    }\n\n    &.right {\n      @include verticalConfig(right);\n    }\n\n    .content {\n      flex: 1 1 0;\n      display: flex;\n      flex-direction: column;\n      gap: 4px;\n    }\n\n    .default-icon {\n      margin-right: 12px;\n    }\n\n    .close-icon {\n      margin-left: 12px;\n      cursor: pointer;\n    }\n  }\n}","import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'cura-toast',\n  styleUrl: 'cura-toast.scss',\n  shadow: true,\n})\nexport class CuraToast {\n  @Element() host: HTMLElement;\n\n  @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n  @Prop() position: 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' = 'top-right';\n  @Prop({ reflect: true }) icon: string;\n  @Prop({ reflect: true }) label: string;\n  @Prop({ reflect: true }) closeButton = true;\n  @Prop({ reflect: true }) loader = true;\n  @Prop({ reflect: true }) autoCloseDelay = 10000;\n  \n  @State() styles = {};\n  @State() progress = 0;\n\n  @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n  @Watch('type')\n  @Watch('position')\n  handleChangeType() {\n    this.setStyle();\n  }\n\n  container: HTMLElement;\n\n  connectedCallback() {\n    this.setStyle();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getClasses()} style={this.styles}>\n          <cura-icon class=\"default-icon\" name={this.getNameIcon()} size={16} color={`${this.type}-dark`}></cura-icon>\n          <div class=\"content\">\n            <cura-heading level={4} size=\"xsmall\" color={`${this.type}-dark`} weight=\"bold\" margin-block=\"0\">\n              {this.label}\n            </cura-heading>\n            <cura-paragraph color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n              <slot></slot>\n            </cura-paragraph>\n            <slot name=\"actions\"></slot>\n          </div>\n          {this.closeButton && <cura-icon class=\"close-icon\" name=\"close\" size={16} color=\"error-dark\" onClick={this.handleClose}></cura-icon>}\n          {this.loader && !!this.autoCloseDelay && <cura-loader-bar color={`${this.type}-base`} progress={this.progress}></cura-loader-bar>}\n        </div>\n      </Host>\n    );\n  }\n\n  componentDidLoad() {\n    this.openContainer();\n    this.startAnimation();\n  }\n\n  setStyle() {\n    this.styles = {\n      ...this.styles,\n      '--neutral-purewhite': window.CuraAPI.theme.colors.getColor(`neutral-purewhite`),\n      '--neutral-base': window.CuraAPI.theme.colors.getColor(`neutral-base`, 0.2),\n      '--primary-base': window.CuraAPI.theme.colors.getColor(`primary-base`),\n      '--color-base': window.CuraAPI.theme.colors.getColor(`${this.type}-base`)\n    }\n  }\n\n  getClasses() {\n    const [firstPosition, secondPosition] = this.position.split('-');\n    const classes = {};\n\n    classes['container'] = true;\n    classes[firstPosition] = true;\n    classes[secondPosition] = true;\n\n    if (this.loader) {\n      classes['loader'] = true;\n    }\n\n    return classes;\n  }\n\n  getNameIcon() {\n    const iconMapping = {\n      info: 'infoCircle',\n      success: 'checkCircle',\n      warning: 'alertCircle',\n      error: 'alertTriangle',\n    };\n    return this.icon ? this.icon : iconMapping[this.type];\n  }\n\n  openContainer() {\n    this.container = this.host.shadowRoot.querySelector('.container') as HTMLElement;\n    this.container.classList.add('active');\n  }\n\n  closeContainer() {\n    this.container.classList.remove('active');\n    setTimeout(() => {\n      this.host.remove();\n    }, 500);\n  }\n\n  handleClose = () => {\n    this.close.emit();\n    this.closeContainer();\n  };\n\n  startAnimation() {\n    if (!!this.autoCloseDelay) {\n      if (this.loader) {\n        this.progress = 0;\n        let intervalId = setInterval(() => {\n          if (this.progress >= 100) {\n            clearInterval(intervalId);\n            this.closeContainer();\n          } else {\n            this.progress++;\n          }\n        }, this.autoCloseDelay/100);\n      } else {\n        let intervalId = setInterval(() => {\n          clearInterval(intervalId);\n          this.closeContainer();\n        }, this.autoCloseDelay);\n      }\n    }\n  }\n}\n"],"version":3}

package/dist/cjs/cura.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["cura-accordion_9.cjs",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"colorMode":[1,"color-mode"],"opened":[1540],"styles":[32]}],[1,"cura-accordion",{"color":[513],"activeColor":[513,"active-color"],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"behavior":[513],"styles":[32]},null,{"color":["handleChangeColor"],"activeColor":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-dropdown-search.cjs",[[1,"cura-dropdown-search",{"status":[513],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32]},null,{"value":["onValueChange"]}]]],["cura-calendar.cjs",[[1,"cura-calendar",{"period":[513],"width":[513],"mode":[513],"dateFormat":[513,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[16],"limitRange":[514,"limit-range"],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]}]]],["cura-icons-view.cjs",[[1,"cura-icons-view",{"selected":[32]}]]],["cura-alert.cjs",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["cura-button-outline.cjs",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["cura-checkbox.cjs",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["cura-button-select.cjs",[[1,"cura-button-select",{"size":[513],"disabled":[516],"selected":[516],"iconPosition":[513,"icon-position"],"color":[1],"background":[1],"fontcolor":[1],"hovered":[32],"styles":[32]},null,{"background":["setColors","assignColor"],"color":["setColors"],"fontcolor":["setColors","assignColor"]}]]],["cura-radio.cjs",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["cura-dropdown-search-option.cjs",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["cura-dropdown-search-option-title.cjs",[[1,"cura-dropdown-search-option-title"]]],["cura-switch.cjs",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["cura-avatar.cjs",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["cura-card.cjs",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["cura-display.cjs",[[1,"cura-display",{"level":[514],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-button-transparent_2.cjs",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}]]],["cura-select_2.cjs",[[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"status":[1537],"disabled":[516],"required":[516],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}]]]], options);
+  return index.bootstrapLazy([["cura-accordion_9.cjs",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"colorMode":[1,"color-mode"],"opened":[1540],"styles":[32]}],[1,"cura-accordion",{"color":[513],"activeColor":[513,"active-color"],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"behavior":[513],"styles":[32]},null,{"color":["handleChangeColor"],"activeColor":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-dropdown-search.cjs",[[1,"cura-dropdown-search",{"status":[513],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"dropdownMaxHeight":[513,"dropdown-max-height"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32]},null,{"value":["onValueChange"]}]]],["cura-calendar.cjs",[[1,"cura-calendar",{"period":[513],"width":[513],"mode":[513],"dateFormat":[513,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[16],"limitRange":[514,"limit-range"],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]}]]],["cura-icons-view.cjs",[[1,"cura-icons-view",{"selected":[32]}]]],["cura-toast.cjs",[[1,"cura-toast",{"type":[1],"position":[1],"icon":[513],"label":[513],"closeButton":[516,"close-button"],"loader":[516],"autoCloseDelay":[514,"auto-close-delay"],"styles":[32],"progress":[32]},null,{"type":["handleChangeType"],"position":["handleChangeType"]}]]],["cura-alert.cjs",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["cura-button-outline.cjs",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["cura-checkbox.cjs",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["cura-button-select.cjs",[[1,"cura-button-select",{"size":[513],"disabled":[516],"selected":[516],"iconPosition":[513,"icon-position"],"color":[1],"background":[1],"fontcolor":[1],"hovered":[32],"styles":[32]},null,{"background":["setColors","assignColor"],"color":["setColors"],"fontcolor":["setColors","assignColor"]}]]],["cura-radio.cjs",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["cura-dropdown-search-option.cjs",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"selectable":[516],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["cura-dropdown-search-option-title.cjs",[[1,"cura-dropdown-search-option-title"]]],["cura-switch.cjs",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["cura-avatar.cjs",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["cura-card.cjs",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["cura-display.cjs",[[1,"cura-display",{"level":[514],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-loader-bar.cjs",[[1,"cura-loader-bar",{"color":[1],"progress":[2],"styles":[32]},null,{"color":["handleChangeColor"],"progress":["handleProgress"]}]]],["cura-button-transparent_2.cjs",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}]]],["cura-select_2.cjs",[[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"status":[1537],"disabled":[516],"required":[516],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/loader.cjs.js

@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-bcffd819.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["cura-accordion_9.cjs",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"colorMode":[1,"color-mode"],"opened":[1540],"styles":[32]}],[1,"cura-accordion",{"color":[513],"activeColor":[513,"active-color"],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"behavior":[513],"styles":[32]},null,{"color":["handleChangeColor"],"activeColor":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-dropdown-search.cjs",[[1,"cura-dropdown-search",{"status":[513],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32]},null,{"value":["onValueChange"]}]]],["cura-calendar.cjs",[[1,"cura-calendar",{"period":[513],"width":[513],"mode":[513],"dateFormat":[513,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[16],"limitRange":[514,"limit-range"],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]}]]],["cura-icons-view.cjs",[[1,"cura-icons-view",{"selected":[32]}]]],["cura-alert.cjs",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["cura-button-outline.cjs",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["cura-checkbox.cjs",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["cura-button-select.cjs",[[1,"cura-button-select",{"size":[513],"disabled":[516],"selected":[516],"iconPosition":[513,"icon-position"],"color":[1],"background":[1],"fontcolor":[1],"hovered":[32],"styles":[32]},null,{"background":["setColors","assignColor"],"color":["setColors"],"fontcolor":["setColors","assignColor"]}]]],["cura-radio.cjs",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["cura-dropdown-search-option.cjs",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["cura-dropdown-search-option-title.cjs",[[1,"cura-dropdown-search-option-title"]]],["cura-switch.cjs",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["cura-avatar.cjs",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["cura-card.cjs",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["cura-display.cjs",[[1,"cura-display",{"level":[514],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-button-transparent_2.cjs",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}]]],["cura-select_2.cjs",[[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"status":[1537],"disabled":[516],"required":[516],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}]]]], options);
+  return index.bootstrapLazy([["cura-accordion_9.cjs",[[65,"cura-button",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[513],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors"]}],[1,"cura-accordion-item",{"label":[513],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"colorMode":[1,"color-mode"],"opened":[1540],"styles":[32]}],[1,"cura-accordion",{"color":[513],"activeColor":[513,"active-color"],"colorMode":[513,"color-mode"],"iconSize":[514,"icon-size"],"openIcon":[513,"open-icon"],"closeIcon":[513,"close-icon"],"iconColor":[513,"icon-color"],"iconActiveColor":[513,"icon-active-color"],"behavior":[513],"styles":[32]},null,{"color":["handleChangeColor"],"activeColor":["handleChangeColor"]}],[1,"cura-page-template",{"contentwidth":[513]}],[1,"cura-heading",{"level":[514],"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-loader-circle",{"size":[513],"color":[513]}],[1,"cura-paragraph",{"size":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}],[1,"cura-icon",{"name":[513],"color":[1],"size":[8],"iconset":[513],"disabled":[4]},null,{"size":["sizeHandler"],"color":["colorHandler"],"disabled":["colorHandler"]}],[1,"cura-label",{"size":[513],"weight":[513],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-dropdown-search.cjs",[[1,"cura-dropdown-search",{"status":[513],"name":[513],"required":[1540],"selected":[1540],"value":[1537],"placeholder":[1537],"label":[1537],"iconName":[513,"icon-name"],"dropdownMaxHeight":[513,"dropdown-max-height"],"overlayVisible":[32],"isDropdownOpen":[32],"styles":[32],"isMobile":[32],"mode":[32],"inputTextRef":[32],"isOnBlurInput":[32],"hoveredIndex":[32],"options":[32]},null,{"value":["onValueChange"]}]]],["cura-calendar.cjs",[[1,"cura-calendar",{"period":[513],"width":[513],"mode":[513],"dateFormat":[513,"date-format"],"locale":[513],"type":[513],"disable":[16],"enable":[16],"defaultDate":[16],"limitRange":[514,"limit-range"],"currentDate":[32],"selectedDates":[32],"rangeStart":[32],"defaultDates":[32],"selectMonth":[32],"selectYear":[32],"styles":[32]}]]],["cura-icons-view.cjs",[[1,"cura-icons-view",{"selected":[32]}]]],["cura-toast.cjs",[[1,"cura-toast",{"type":[1],"position":[1],"icon":[513],"label":[513],"closeButton":[516,"close-button"],"loader":[516],"autoCloseDelay":[514,"auto-close-delay"],"styles":[32],"progress":[32]},null,{"type":["handleChangeType"],"position":["handleChangeType"]}]]],["cura-alert.cjs",[[1,"cura-alert",{"type":[1],"floating":[516],"label":[513],"closeable":[516],"icon":[513],"styles":[32]},null,{"type":["setColors"]}]]],["cura-button-outline.cjs",[[65,"cura-button-outline",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"background":[1],"fontColor":[1,"font-color"],"textAlign":[513,"text-align"],"styles":[32],"hovered":[32]},null,{"background":["setColors"],"color":["setColors","getSymbolColor"],"fontColor":["getSymbolColor"]}]]],["cura-checkbox.cjs",[[65,"cura-checkbox",{"checked":[1540],"indeterminate":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"size":[513],"background":[1],"iconColor":[1,"icon-color"],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"],"iconColor":["assignColor"]}]]],["cura-button-select.cjs",[[1,"cura-button-select",{"size":[513],"disabled":[516],"selected":[516],"iconPosition":[513,"icon-position"],"color":[1],"background":[1],"fontcolor":[1],"hovered":[32],"styles":[32]},null,{"background":["setColors","assignColor"],"color":["setColors"],"fontcolor":["setColors","assignColor"]}]]],["cura-radio.cjs",[[65,"cura-radio",{"checked":[1540],"status":[1537],"disabled":[516],"required":[516],"label":[513],"ontabindex":[514],"position":[513],"value":[513],"name":[513],"background":[1],"size":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors","assignColor"]}]]],["cura-dropdown-search-option.cjs",[[1,"cura-dropdown-search-option",{"value":[513],"selected":[1540],"selectable":[516],"hovered":[1540],"styles":[32]},null,{"selected":["updateIconColor"]}]]],["cura-dropdown-search-option-title.cjs",[[1,"cura-dropdown-search-option-title"]]],["cura-switch.cjs",[[65,"cura-switch",{"checked":[1540],"disabled":[516],"label":[513],"ontabindex":[514],"position":[513],"size":[513],"background":[1],"color":[1],"styles":[32]},null,{"size":["sizeHandler"],"color":["setColors"],"background":["setColors"]}]]],["cura-avatar.cjs",[[1,"cura-avatar",{"size":[1],"backgroundColor":[513,"background-color"],"borderColor":[513,"border-color"],"borderRadius":[513,"border-radius"],"border":[516],"type":[513],"imageSrc":[1537,"image-src"],"imageSrcDefault":[513,"image-src-default"],"floating":[516],"styles":[32]},null,{"size":["sizeHandler"]}]]],["cura-card.cjs",[[1,"cura-card",{"hasPadding":[1028,"has-padding"],"hasShadow":[1028,"has-shadow"],"type":[1025],"colorMode":[1025,"color-mode"],"href":[1537],"target":[513],"styles":[32]}]]],["cura-display.cjs",[[1,"cura-display",{"level":[514],"spotColor":[513,"spot-color"],"color":[1],"marginBlock":[513,"margin-block"],"lineHeight":[513,"line-height"],"styles":[32]},null,{"color":["handleChangeColor"],"spotColor":["handleChangeColor"]}]]],["cura-loader-bar.cjs",[[1,"cura-loader-bar",{"color":[1],"progress":[2],"styles":[32]},null,{"color":["handleChangeColor"],"progress":["handleProgress"]}]]],["cura-button-transparent_2.cjs",[[65,"cura-button-transparent",{"type":[513],"size":[513],"disabled":[516],"isLoading":[516,"is-loading"],"iconName":[513,"icon-name"],"iconset":[513],"iconPosition":[513,"icon-position"],"iconOnly":[516,"icon-only"],"href":[513],"target":[513],"color":[1],"fontColor":[513,"font-color"],"textAlign":[513,"text-align"],"hovered":[32],"styles":[32]},null,{"fontColor":["getSymbolColor"],"color":["getSymbolColor"]}],[65,"cura-input-text",{"mode":[1537],"status":[1537],"size":[1537],"type":[513],"inputMode":[513,"input-mode"],"label":[513],"name":[513],"placeholder":[513],"value":[1032],"iconName":[1537,"icon-name"],"helperText":[1537,"helper-text"],"disabled":[516],"required":[516],"maskPreset":[8,"mask-preset"],"maskRegex":[1537,"mask-regex"],"maskAdvanced":[1544,"mask-advanced"],"maxlength":[1538],"readOnly":[516,"read-only"],"isLoading":[1540,"is-loading"],"clearIcon":[1540,"clear-icon"],"hideErrorIcon":[4,"hide-error-icon"],"isHovered":[32],"isFocused":[32],"styles":[32]},null,{"styles":["connectedCallback"],"size":["getClasses"],"status":["renderIcon"],"mode":["renderIcon"],"maskPreset":["initializeMask"],"maskRegex":["initializeMask"],"maskAdvanced":["initializeMask"]}]]],["cura-select_2.cjs",[[65,"cura-select",{"label":[513],"placeholder":[513],"value":[1537],"mode":[513],"size":[513],"status":[1537],"disabled":[516],"required":[516],"isHovered":[32],"isFocused":[32],"isOpen":[32],"options":[32],"activeIndex":[32]}],[1,"cura-select-option",{"value":[513],"selected":[516],"active":[516],"size":[1],"styles":[32]},null,{"size":["getSize"]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -14,6 +14,7 @@
     "components/cura-icon/cura-icon.js",
     "components/cura-icons-view/cura-icons-view.js",
     "components/cura-page-template/cura-page-template.js",
+    "components/cura-toast/cura-toast.js",
     "components/forms/cura-checkbox/cura-checkbox.js",
     "components/forms/cura-dropdown-search/cura-dropdown-search.js",
     "components/forms/cura-dropdown-search/cura-dropdown-search-option/cura-dropdown-search-option.js",
@@ -23,6 +24,7 @@
     "components/forms/cura-select/cura-select.js",
     "components/forms/cura-select-options/cura-select-option.js",
     "components/forms/cura-switch/cura-switch.js",
+    "components/loaders/cura-loader-bar/cura-loader-bar.js",
     "components/loaders/cura-loader-circle/cura-loader-circle.js",
     "components/text/cura-display/cura-display.js",
     "components/text/cura-heading/cura-heading.js",

package/dist/collection/components/cura-toast/cura-toast.css

@@ -0,0 +1,161 @@
+/* Breakpoints variables */
+/**
+ * Responsive media for mobile (small) only.
+ * Use: @include mobile-only() { ... }
+ */
+/**
+ * Responsive media for medium only.
+ * Use: @include medium-only() { ... }
+ */
+/**
+ * Responsive media for large only.
+ * Use: @include large-only() { ... }
+ */
+/**
+ * Responsive media for xlarge only.
+ * Use: @include xlarge-only() { ... }
+ */
+/**
+ * Responsive media for medium to large.
+ * Use: @include medium-large() { ... }
+ */
+/**
+ * Responsive media for large and up.
+ * Use: @include large-up() { ... }
+ */
+/**
+ * Global Shadow Level Definitions.
+ * Required CSS Properties with respective opacities:
+ * --neutral-black,
+ * --neutral-purewhite,
+ * --accent-base
+ * --primary-base
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-purewhite opacity: 0.2
+ * Use: @include shadow-level1(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.16
+ * Use: @include shadow-level2(--neutral-black-shadow){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.16
+ * Use: @include shadow-level3(--neutral-black-shadow){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.12
+ * Use: @include shadow-level4(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.8
+ * Use: @include shadow-level5(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --accent-base opacity: 0.2
+ * Use: @include shadow-level5-accent(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --primary-base opacity: 0.16
+ * Use: @include shadow-level3-primary(){ ... }
+ */
+:host {
+  display: block;
+  box-sizing: border-box;
+}
+:host .container {
+  position: fixed;
+  display: flex;
+  box-sizing: border-box;
+  min-width: 328px;
+  height: fit-content;
+  padding: 16px;
+  border: 1px solid var(--color-base);
+  border-radius: 12px;
+  background-color: var(--neutral-purewhite);
+  overflow: hidden;
+  box-shadow: 0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12));
+}
+:host .container.loader {
+  padding: 16px 16px 20px;
+}
+:host .container.top {
+  top: 24px;
+}
+:host .container.top.center {
+  top: -100%;
+  left: 50%;
+  transform: translateX(-50%);
+  opacity: 0;
+  transition: opacity 0.5s ease-in-out, top 0.5s ease-in-out;
+}
+:host .container.top.center.active {
+  top: 24px;
+  opacity: 1;
+}
+:host .container.bottom {
+  bottom: 24px;
+}
+:host .container.bottom.center {
+  bottom: -100%;
+  left: 50%;
+  transform: translateX(-50%);
+  opacity: 0;
+  transition: opacity 0.5s ease-in-out, bottom 0.5s ease-in-out;
+}
+:host .container.bottom.center.active {
+  bottom: 24px;
+  opacity: 1;
+}
+:host .container.left {
+  left: -100%;
+  opacity: 0;
+  transition: opacity 0.5s ease-in-out, left 0.5s ease-in-out;
+}
+@media (max-width: 768px) {
+  :host .container.left {
+    right: unset;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+:host .container.left.active {
+  left: 24px;
+  opacity: 1;
+}
+:host .container.right {
+  right: -100%;
+  opacity: 0;
+  transition: opacity 0.5s ease-in-out, right 0.5s ease-in-out;
+}
+@media (max-width: 768px) {
+  :host .container.right {
+    right: unset;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+:host .container.right.active {
+  right: 24px;
+  opacity: 1;
+}
+:host .container .content {
+  flex: 1 1 0;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+:host .container .default-icon {
+  margin-right: 12px;
+}
+:host .container .close-icon {
+  margin-left: 12px;
+  cursor: pointer;
+}

package/dist/collection/components/cura-toast/cura-toast.js

@@ -0,0 +1,261 @@
+import { Host, h } from "@stencil/core";
+export class CuraToast {
+    constructor() {
+        this.handleClose = () => {
+            this.close.emit();
+            this.closeContainer();
+        };
+        this.type = 'info';
+        this.position = 'top-right';
+        this.icon = undefined;
+        this.label = undefined;
+        this.closeButton = true;
+        this.loader = true;
+        this.autoCloseDelay = 10000;
+        this.styles = {};
+        this.progress = 0;
+    }
+    handleChangeType() {
+        this.setStyle();
+    }
+    connectedCallback() {
+        this.setStyle();
+    }
+    render() {
+        return (h(Host, { key: '8a49bdd99528c7b50b1b8a0de6ee0d985ffd5a11' }, h("div", { key: '6e560327e729ecb9fc9e6c081cc4d3b1131f892c', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '25efc30bc808e9f04be780ddf5bdc7edc3e56725', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), h("div", { key: 'b1cbab08ae6845f8f544d4497b786fdfae645b72', class: "content" }, h("cura-heading", { key: '6d64c4fc8c43862f8fc5dba886b34a904a81208d', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), h("cura-paragraph", { key: 'fa990a332ca8caf8b110b643b39c44a17bb8de67', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'ec9ab2abe06b0d67ea71725abe3a02aca1a736c6' })), h("slot", { key: 'dc08874d1145bb7e62cac9081014d17ad0095f53', name: "actions" })), this.closeButton && h("cura-icon", { key: '3f22011909ed7074962a2ccec8ffe05bb9b01feb', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && h("cura-loader-bar", { key: '2e4168859d19170702a690bed3a20d28029cf7dc', color: `${this.type}-base`, progress: this.progress }))));
+    }
+    componentDidLoad() {
+        this.openContainer();
+        this.startAnimation();
+    }
+    setStyle() {
+        this.styles = Object.assign(Object.assign({}, this.styles), { '--neutral-purewhite': window.CuraAPI.theme.colors.getColor(`neutral-purewhite`), '--neutral-base': window.CuraAPI.theme.colors.getColor(`neutral-base`, 0.2), '--primary-base': window.CuraAPI.theme.colors.getColor(`primary-base`), '--color-base': window.CuraAPI.theme.colors.getColor(`${this.type}-base`) });
+    }
+    getClasses() {
+        const [firstPosition, secondPosition] = this.position.split('-');
+        const classes = {};
+        classes['container'] = true;
+        classes[firstPosition] = true;
+        classes[secondPosition] = true;
+        if (this.loader) {
+            classes['loader'] = true;
+        }
+        return classes;
+    }
+    getNameIcon() {
+        const iconMapping = {
+            info: 'infoCircle',
+            success: 'checkCircle',
+            warning: 'alertCircle',
+            error: 'alertTriangle',
+        };
+        return this.icon ? this.icon : iconMapping[this.type];
+    }
+    openContainer() {
+        this.container = this.host.shadowRoot.querySelector('.container');
+        this.container.classList.add('active');
+    }
+    closeContainer() {
+        this.container.classList.remove('active');
+        setTimeout(() => {
+            this.host.remove();
+        }, 500);
+    }
+    startAnimation() {
+        if (!!this.autoCloseDelay) {
+            if (this.loader) {
+                this.progress = 0;
+                let intervalId = setInterval(() => {
+                    if (this.progress >= 100) {
+                        clearInterval(intervalId);
+                        this.closeContainer();
+                    }
+                    else {
+                        this.progress++;
+                    }
+                }, this.autoCloseDelay / 100);
+            }
+            else {
+                let intervalId = setInterval(() => {
+                    clearInterval(intervalId);
+                    this.closeContainer();
+                }, this.autoCloseDelay);
+            }
+        }
+    }
+    static get is() { return "cura-toast"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["cura-toast.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["cura-toast.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'info' | 'success' | 'warning' | 'error'",
+                    "resolved": "\"error\" | \"info\" | \"success\" | \"warning\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "type",
+                "reflect": false,
+                "defaultValue": "'info'"
+            },
+            "position": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right'",
+                    "resolved": "\"bottom-center\" | \"bottom-left\" | \"bottom-right\" | \"top-center\" | \"top-left\" | \"top-right\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "position",
+                "reflect": false,
+                "defaultValue": "'top-right'"
+            },
+            "icon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "icon",
+                "reflect": true
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "label",
+                "reflect": true
+            },
+            "closeButton": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "close-button",
+                "reflect": true,
+                "defaultValue": "true"
+            },
+            "loader": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "loader",
+                "reflect": true,
+                "defaultValue": "true"
+            },
+            "autoCloseDelay": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "auto-close-delay",
+                "reflect": true,
+                "defaultValue": "10000"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "styles": {},
+            "progress": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "close",
+                "name": "close",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "host"; }
+    static get watchers() {
+        return [{
+                "propName": "type",
+                "methodName": "handleChangeType"
+            }, {
+                "propName": "position",
+                "methodName": "handleChangeType"
+            }];
+    }
+}
+//# sourceMappingURL=cura-toast.js.map

package/dist/collection/components/cura-toast/cura-toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cura-toast.js","sourceRoot":"","sources":["../../../src/components/cura-toast/cura-toast.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'cura-toast',\n  styleUrl: 'cura-toast.scss',\n  shadow: true,\n})\nexport class CuraToast {\n  @Element() host: HTMLElement;\n\n  @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n  @Prop() position: 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right' = 'top-right';\n  @Prop({ reflect: true }) icon: string;\n  @Prop({ reflect: true }) label: string;\n  @Prop({ reflect: true }) closeButton = true;\n  @Prop({ reflect: true }) loader = true;\n  @Prop({ reflect: true }) autoCloseDelay = 10000;\n  \n  @State() styles = {};\n  @State() progress = 0;\n\n  @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n  @Watch('type')\n  @Watch('position')\n  handleChangeType() {\n    this.setStyle();\n  }\n\n  container: HTMLElement;\n\n  connectedCallback() {\n    this.setStyle();\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getClasses()} style={this.styles}>\n          <cura-icon class=\"default-icon\" name={this.getNameIcon()} size={16} color={`${this.type}-dark`}></cura-icon>\n          <div class=\"content\">\n            <cura-heading level={4} size=\"xsmall\" color={`${this.type}-dark`} weight=\"bold\" margin-block=\"0\">\n              {this.label}\n            </cura-heading>\n            <cura-paragraph color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n              <slot></slot>\n            </cura-paragraph>\n            <slot name=\"actions\"></slot>\n          </div>\n          {this.closeButton && <cura-icon class=\"close-icon\" name=\"close\" size={16} color=\"error-dark\" onClick={this.handleClose}></cura-icon>}\n          {this.loader && !!this.autoCloseDelay && <cura-loader-bar color={`${this.type}-base`} progress={this.progress}></cura-loader-bar>}\n        </div>\n      </Host>\n    );\n  }\n\n  componentDidLoad() {\n    this.openContainer();\n    this.startAnimation();\n  }\n\n  setStyle() {\n    this.styles = {\n      ...this.styles,\n      '--neutral-purewhite': window.CuraAPI.theme.colors.getColor(`neutral-purewhite`),\n      '--neutral-base': window.CuraAPI.theme.colors.getColor(`neutral-base`, 0.2),\n      '--primary-base': window.CuraAPI.theme.colors.getColor(`primary-base`),\n      '--color-base': window.CuraAPI.theme.colors.getColor(`${this.type}-base`)\n    }\n  }\n\n  getClasses() {\n    const [firstPosition, secondPosition] = this.position.split('-');\n    const classes = {};\n\n    classes['container'] = true;\n    classes[firstPosition] = true;\n    classes[secondPosition] = true;\n\n    if (this.loader) {\n      classes['loader'] = true;\n    }\n\n    return classes;\n  }\n\n  getNameIcon() {\n    const iconMapping = {\n      info: 'infoCircle',\n      success: 'checkCircle',\n      warning: 'alertCircle',\n      error: 'alertTriangle',\n    };\n    return this.icon ? this.icon : iconMapping[this.type];\n  }\n\n  openContainer() {\n    this.container = this.host.shadowRoot.querySelector('.container') as HTMLElement;\n    this.container.classList.add('active');\n  }\n\n  closeContainer() {\n    this.container.classList.remove('active');\n    setTimeout(() => {\n      this.host.remove();\n    }, 500);\n  }\n\n  handleClose = () => {\n    this.close.emit();\n    this.closeContainer();\n  };\n\n  startAnimation() {\n    if (!!this.autoCloseDelay) {\n      if (this.loader) {\n        this.progress = 0;\n        let intervalId = setInterval(() => {\n          if (this.progress >= 100) {\n            clearInterval(intervalId);\n            this.closeContainer();\n          } else {\n            this.progress++;\n          }\n        }, this.autoCloseDelay/100);\n      } else {\n        let intervalId = setInterval(() => {\n          clearInterval(intervalId);\n          this.closeContainer();\n        }, this.autoCloseDelay);\n      }\n    }\n  }\n}\n"]}