@rededor/cura 1.5.0-alpha.2 → 1.5.0

package/dist/cjs/cura-button-outline.cjs.entry.js

@@ -103,7 +103,7 @@ const CuraButtonOutline = class {
     render() {
         const symbolColor = this.getSymbolColor();
         const labelSize = curaButton_definitions.labelSizes[this.size] || curaButton_definitions.labelSizes["default"];
-        return (index.h(index.Host, { key: '0a0c25f94d0c18dbb90e4836ca3e7bcbbe10d032' }, this.href ? (index.h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (index.h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor })))));
+        return (index.h(index.Host, { key: '0a0c25f94d0c18dbb90e4836ca3e7bcbbe10d032' }, this.href ? (index.h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (index.h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor })))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/cjs/cura-button-outline.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-button-outline.entry.cjs.js","mappings":"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","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-outline/cura-button-outline.scss?tag=cura-button-outline&encapsulation=shadow","src/components/buttons/cura-button-outline/cura-button-outline.tsx"],"sourcesContent":["@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      box-sizing: border-box;\n      border: none;\n\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 2px solid var(--color-dark-neutral-purewhite);\n        border-radius: var(--border-radius);\n      }\n\n      &:not(.disabled):not(.isLoading):hover {\n       background-color: var(--color-lighter-color-darker);\n      }\n\n      &:not(.disabled):not(.inverted):not(.isLoading):active {\n       background-color: var(--color-light-color-darker);\n      }\n\n    };\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label();\n\n\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled() {\n     &::before {\n      border-color: var(--neutral-dark);\n     }\n    };\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Loading State\n    @include button-loading();\n\n  }\n\n}\n","import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-outline',\n  styleUrl: 'cura-button-outline.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class CuraButtonOutline {\n\n  @AttachInternals() internals: ElementInternals;\n\n  /**\n   * Button type: button (default) | submit | reset\n   */\n  @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n  * Button size: small | medium | large (default)\n  */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n  * Disabled state. Boolean.\n  */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n  * Loading state. Boolean.\n  */\n  @Prop({ reflect: true }) isLoading = false;\n\n  /**\n  * Name of the icon to be used from iconset.\n  */\n  @Prop({ reflect: true }) iconName: string;\n  /**\n  * Custom iconset if needed.\n  */\n  @Prop({ reflect: true }) iconset = 'default';\n  /**\n  * Icon position: left (default) | right.\n  */\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n  /**\n  * Set button to FAB/icon only.\n  */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n  * Property href switch button to link.\n  */\n  @Prop({ reflect: true }) href: string;\n  /**\n  * Set target if link.\n  */\n  @Prop({ reflect: true }) target = \"_self\";\n  /**\n  * Color base from color scheme. Default: primary.\n  */\n  @Prop() color = 'primary';\n  /**\n  * Set the font background to dark or light.\n  */\n  @Prop() background: 'dark' | 'light' = 'light';\n\n  /**\n  * Set the font color to dark or light.\n  */\n  @Prop() fontColor: 'dark' | 'light' = 'dark';\n  /**\n  * Set text aligment for the button label.\n  * Vales: left (default) | center | right.\n  */\n  @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n  /**\n   * Justify icons and label inside the button.\n   * Vales: false (default) | true.\n   */\n  @Prop({ reflect: true }) justify = false;\n\n  @State() styles = {};\n\n  @State() hovered = false;\n\n  weights;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n    this.setColors();\n  }\n\n\n  getClasses() {\n    const classes = {};\n    classes[`${this.size?.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes['isLoading'] = this.isLoading;\n    classes['justify'] = this.justify;\n    return classes;\n  }\n\n  @Watch('background')\n  @Watch('color')\n  setColors() {\n    const colors = [\n      { name: '--color-dark-neutral-purewhite', thema: `${this.background === 'light' ? `${this.color}-dark` : 'neutral-purewhite'}` },\n      { name: '--color-lighter-color-darker', thema: `${this.background === 'light' ? `${this.color}-lighter` : `${this.color}-darker`}` },\n      { name: '--color-light-color-darker', thema: `${this.background === 'light' ? `${this.color}-light` : `${this.color}-lighter`}` },\n      { name: '--neutral-dark', thema: 'neutral-dark' },\n    ]\n\n    colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.thema));\n    this.styles = { ...this.styles };\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    const iconSize = this.size === 'large' ? 20 : 16;\n\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n  }\n\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  @Watch('fontColor')\n  @Watch('color')\n  getSymbolColor() {\n    if (this.disabled) return 'neutral-dark';\n    return this.fontColor === 'light' ? 'neutral-purewhite' : `${this.color}-darker`;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled || this.isLoading) {\n      e.preventDefault();\n      return;\n    }\n    if (!this.href) {\n      if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n      if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n    }\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n    return (\n      <Host>\n        {this.href ? (\n          <a href={this.disabled ? '' : this.href}\n            target={this.target}\n            class={this.getClasses()}\n            style={this.styles}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </a>\n        ) : (\n          <button class={this.getClasses()}\n            style={this.styles}\n            disabled={this.disabled || null}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}\n            type={this.type}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n}\n"],"version":3}
+{"file":"cura-button-outline.entry.cjs.js","mappings":"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","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-outline/cura-button-outline.scss?tag=cura-button-outline&encapsulation=shadow","src/components/buttons/cura-button-outline/cura-button-outline.tsx"],"sourcesContent":["@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      box-sizing: border-box;\n      border: none;\n\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 2px solid var(--color-dark-neutral-purewhite);\n        border-radius: var(--border-radius);\n      }\n\n      &:not(.disabled):not(.isLoading):hover {\n       background-color: var(--color-lighter-color-darker);\n      }\n\n      &:not(.disabled):not(.inverted):not(.isLoading):active {\n       background-color: var(--color-light-color-darker);\n      }\n\n    };\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label();\n\n\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled() {\n     &::before {\n      border-color: var(--neutral-dark);\n     }\n    };\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Loading State\n    @include button-loading();\n\n  }\n\n}\n","import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-outline',\n  styleUrl: 'cura-button-outline.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class CuraButtonOutline {\n\n  @AttachInternals() internals: ElementInternals;\n\n  /**\n   * Button type: button (default) | submit | reset\n   */\n  @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n  * Button size: small | medium | large (default)\n  */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n  * Disabled state. Boolean.\n  */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n  * Loading state. Boolean.\n  */\n  @Prop({ reflect: true }) isLoading = false;\n\n  /**\n  * Name of the icon to be used from iconset.\n  */\n  @Prop({ reflect: true }) iconName: string;\n  /**\n  * Custom iconset if needed.\n  */\n  @Prop({ reflect: true }) iconset = 'default';\n  /**\n  * Icon position: left (default) | right.\n  */\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n  /**\n  * Set button to FAB/icon only.\n  */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n  * Property href switch button to link.\n  */\n  @Prop({ reflect: true }) href: string;\n  /**\n  * Set target if link.\n  */\n  @Prop({ reflect: true }) target = \"_self\";\n  /**\n  * Color base from color scheme. Default: primary.\n  */\n  @Prop() color = 'primary';\n  /**\n  * Set the font background to dark or light.\n  */\n  @Prop() background: 'dark' | 'light' = 'light';\n\n  /**\n  * Set the font color to dark or light.\n  */\n  @Prop() fontColor: 'dark' | 'light' = 'dark';\n  /**\n  * Set text aligment for the button label.\n  * Vales: left (default) | center | right.\n  */\n  @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n  /**\n   * Justify icons and label inside the button.\n   * Vales: false (default) | true.\n   */\n  @Prop({ reflect: true }) justify = false;\n\n  @State() styles = {};\n\n  @State() hovered = false;\n\n  weights;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n    this.setColors();\n  }\n\n\n  getClasses() {\n    const classes = {};\n    classes[`${this.size?.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes['isLoading'] = this.isLoading;\n    classes['justify'] = this.justify;\n    return classes;\n  }\n\n  @Watch('background')\n  @Watch('color')\n  setColors() {\n    const colors = [\n      { name: '--color-dark-neutral-purewhite', thema: `${this.background === 'light' ? `${this.color}-dark` : 'neutral-purewhite'}` },\n      { name: '--color-lighter-color-darker', thema: `${this.background === 'light' ? `${this.color}-lighter` : `${this.color}-darker`}` },\n      { name: '--color-light-color-darker', thema: `${this.background === 'light' ? `${this.color}-light` : `${this.color}-lighter`}` },\n      { name: '--neutral-dark', thema: 'neutral-dark' },\n    ]\n\n    colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.thema));\n    this.styles = { ...this.styles };\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    const iconSize = this.size === 'large' ? 20 : 16;\n\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n  }\n\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  @Watch('fontColor')\n  @Watch('color')\n  getSymbolColor() {\n    if (this.disabled) return 'neutral-dark';\n    return this.fontColor === 'light' ? 'neutral-purewhite' : `${this.color}-darker`;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled || this.isLoading) {\n      e.preventDefault();\n      return;\n    }\n    if (!this.href) {\n      if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n      if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n    }\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n    return (\n      <Host>\n        {this.href ? (\n          <a href={this.disabled ? '' : this.href}\n            target={this.target}\n            class={this.getClasses()}\n            style={this.styles}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </a>\n        ) : (\n          <button class={this.getClasses()}\n            style={this.styles}\n            disabled={this.disabled || null}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}\n            type={this.type}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n}\n"],"version":3}

package/dist/cjs/cura-button-transparent.cjs.entry.js

@@ -92,7 +92,7 @@ const CuraButtonTransparent = class {
     render() {
         const symbolColor = this.getSymbolColor();
         const labelSize = curaButton_definitions.labelSizes[this.size] || curaButton_definitions.labelSizes["default"];
-        return (index.h(index.Host, { key: 'f93f2f1b495403127238468c57edfcb5e9f69d43' }, this.href ? (index.h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (index.h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor })))));
+        return (index.h(index.Host, { key: 'f93f2f1b495403127238468c57edfcb5e9f69d43' }, this.href ? (index.h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (index.h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, index.h("span", { class: "button-container" }, this.getIcon(), index.h("cura-label", { size: labelSize, lineHeight: 'normal', color: symbolColor }, index.h("slot", null))), index.h("cura-loader-circle", { size: this.size, color: symbolColor })))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/cjs/cura-button-transparent.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-button-transparent.entry.cjs.js","mappings":"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","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-transparent/cura-button-transparent.scss?tag=cura-button-transparent&encapsulation=shadow","src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"sourcesContent":["@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      border: none;\n    }\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label();\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled();\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Loading State\n    @include button-loading();\n\n  }\n}\n","import { Component, Host, h, Prop, State, Watch, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-transparent',\n  styleUrl: 'cura-button-transparent.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class CuraButtonTransparent {\n\n  @AttachInternals() internals: ElementInternals;\n\n  /**\n   * Button type: button (default) | submit | reset\n   */\n  @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n   * Button size: small | medium | large (default)\n   */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n   * Disabled state. Boolean.\n   */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n   * Loading state. Boolean.\n   */\n  @Prop({ reflect: true }) isLoading = false;\n\n  /**\n   * Name of the icon to be used from iconset.\n   */\n  @Prop({ reflect: true }) iconName: string;\n  /**\n   * Custom iconset if needed.\n   */\n  @Prop({ reflect: true }) iconset = 'default';\n  /**\n   * Icon position: left (default) | right.\n   */\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n  /**\n   * Set button to FAB/icon only.\n   */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n   * Property href switch button to link.\n   */\n  @Prop({ reflect: true }) href: string;\n  /**\n   * Set target if link.\n   */\n  @Prop({ reflect: true }) target = \"_self\";\n\n  /**\n   * Color base from color scheme. Default: accent.\n   */\n  @Prop({ reflect: true }) color = 'primary';\n\n  /**\n   * Set the font color to dark or light.\n   * Default: dark.\n   */\n  @Prop({ reflect: true }) fontColor: 'dark' | 'light' = 'dark';\n  /**\n   * Set text aligment for the button label.\n   * Vales: left (default) | center | right.\n   */\n  @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n  /**\n   * Justify icons and label inside the button.\n   * Vales: false (default) | true.\n   */\n  @Prop({ reflect: true }) justify = false;\n\n  @State() hovered = false;\n\n  @State() styles = {};\n\n  weights;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n  }\n\n  getClasses() {\n    const classes = {};\n    classes[`${this.size.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes['isLoading'] = this.isLoading;\n    classes['justify'] = this.justify;\n    return classes;\n  }\n\n\n  getIcon() {\n    if (!this.iconName) return null;\n    const iconSize = this.size === 'large' ? 20 : 16;\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n  }\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  @Watch('fontColor')\n  @Watch('color')\n  getSymbolColor() {\n    if (this.disabled) return 'neutral-dark';\n    if (this.hovered && !this.isLoading) return this.fontColor === 'light' ? `${this.color}-light` : `${this.color}-darker`;\n    return this.fontColor === 'light' ? 'neutral-white' : `${this.color}-dark`;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled || this.isLoading) {\n      e.preventDefault();\n      return;\n    }\n    if (!this.href) {\n      if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n      if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n    }\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n    return (\n      <Host>\n        {this.href ? (\n          <a href={this.disabled ? '' : this.href}\n            target={this.target}\n            class={this.getClasses()}\n            style={this.styles}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </a>\n        ) : (\n          <button class={this.getClasses()}\n            style={this.styles}\n            disabled={this.disabled || null}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}\n            type={this.type}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='105%' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n}\n"],"version":3}
+{"file":"cura-button-transparent.entry.cjs.js","mappings":"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","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-transparent/cura-button-transparent.scss?tag=cura-button-transparent&encapsulation=shadow","src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"sourcesContent":["@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      border: none;\n    }\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label();\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled();\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Loading State\n    @include button-loading();\n\n  }\n}\n","import { Component, Host, h, Prop, State, Watch, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-transparent',\n  styleUrl: 'cura-button-transparent.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class CuraButtonTransparent {\n\n  @AttachInternals() internals: ElementInternals;\n\n  /**\n   * Button type: button (default) | submit | reset\n   */\n  @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n   * Button size: small | medium | large (default)\n   */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n   * Disabled state. Boolean.\n   */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n   * Loading state. Boolean.\n   */\n  @Prop({ reflect: true }) isLoading = false;\n\n  /**\n   * Name of the icon to be used from iconset.\n   */\n  @Prop({ reflect: true }) iconName: string;\n  /**\n   * Custom iconset if needed.\n   */\n  @Prop({ reflect: true }) iconset = 'default';\n  /**\n   * Icon position: left (default) | right.\n   */\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n  /**\n   * Set button to FAB/icon only.\n   */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n   * Property href switch button to link.\n   */\n  @Prop({ reflect: true }) href: string;\n  /**\n   * Set target if link.\n   */\n  @Prop({ reflect: true }) target = \"_self\";\n\n  /**\n   * Color base from color scheme. Default: accent.\n   */\n  @Prop({ reflect: true }) color = 'primary';\n\n  /**\n   * Set the font color to dark or light.\n   * Default: dark.\n   */\n  @Prop({ reflect: true }) fontColor: 'dark' | 'light' = 'dark';\n  /**\n   * Set text aligment for the button label.\n   * Vales: left (default) | center | right.\n   */\n  @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n  /**\n   * Justify icons and label inside the button.\n   * Vales: false (default) | true.\n   */\n  @Prop({ reflect: true }) justify = false;\n\n  @State() hovered = false;\n\n  @State() styles = {};\n\n  weights;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n  }\n\n  getClasses() {\n    const classes = {};\n    classes[`${this.size.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes['isLoading'] = this.isLoading;\n    classes['justify'] = this.justify;\n    return classes;\n  }\n\n\n  getIcon() {\n    if (!this.iconName) return null;\n    const iconSize = this.size === 'large' ? 20 : 16;\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n  }\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  @Watch('fontColor')\n  @Watch('color')\n  getSymbolColor() {\n    if (this.disabled) return 'neutral-dark';\n    if (this.hovered && !this.isLoading) return this.fontColor === 'light' ? `${this.color}-light` : `${this.color}-darker`;\n    return this.fontColor === 'light' ? 'neutral-white' : `${this.color}-dark`;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled || this.isLoading) {\n      e.preventDefault();\n      return;\n    }\n    if (!this.href) {\n      if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n      if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n    }\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n    return (\n      <Host>\n        {this.href ? (\n          <a href={this.disabled ? '' : this.href}\n            target={this.target}\n            class={this.getClasses()}\n            style={this.styles}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </a>\n        ) : (\n          <button class={this.getClasses()}\n            style={this.styles}\n            disabled={this.disabled || null}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}\n            type={this.type}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n}\n"],"version":3}

package/dist/cjs/cura-dropdown-search.cjs.entry.js

@@ -13,16 +13,17 @@ const CuraDropdownSearch = class {
         this.valueChanged = index.createEvent(this, "valueChanged", 7);
         this.onselect = index.createEvent(this, "onselect", 7);
         this.overlayElement = null;
-        this.adjustInputPosition = async () => {
-            var _a, _b;
-            // const tick = await Promise.resolve().then();
-            const isKeyboardOpen = (window === null || window === void 0 ? void 0 : window.innerHeight) < this.screenDefaultHeight;
-            const dropdown = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-mobile');
-            if (dropdown) {
-                // dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';
-                dropdown.style.bottom = isKeyboardOpen ? `${((_b = window === null || window === void 0 ? void 0 : window.screen) === null || _b === void 0 ? void 0 : _b.height) - (window === null || window === void 0 ? void 0 : window.innerHeight)}px` : '0';
-                window.scroll({ top: 0, left: 0, behavior: 'smooth' });
-            }
+        this.adjustInputPosition = () => {
+            setTimeout(() => {
+                var _a, _b;
+                const isKeyboardOpen = (window === null || window === void 0 ? void 0 : window.innerHeight) < this.screenDefaultHeight;
+                const dropdown = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-mobile');
+                if (dropdown) {
+                    dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';
+                    dropdown.style.bottom = isKeyboardOpen ? `${((_b = window === null || window === void 0 ? void 0 : window.screen) === null || _b === void 0 ? void 0 : _b.height) - (window === null || window === void 0 ? void 0 : window.innerHeight)}px` : '0';
+                    window.scroll({ top: 0, left: 0 });
+                }
+            }, 300);
         };
         this.handleSlotChange = () => {
             this.options = Array.from(this.host.querySelectorAll('cura-dropdown-search-option'));
@@ -33,7 +34,6 @@ const CuraDropdownSearch = class {
             const input = event.target;
             this.value = input.value;
             this.onValueChange(this.value);
-            // this.valueChanged.emit(this.value);
         };
         this.handleKeyDown = (event) => {
             if (event.key === 'ArrowDown') {
@@ -106,6 +106,7 @@ const CuraDropdownSearch = class {
         this.styles['--font-weight-medium'] = this.weights.medium;
     }
     onValueChange(newValue) {
+        this.value = newValue;
         this.updateSelectedOption(newValue);
         this.valueChanged.emit(newValue);
     }
@@ -169,16 +170,18 @@ const CuraDropdownSearch = class {
         this.adjustInputPosition();
     }
     onSelectedOption(index) {
-        const selectedOption = this.options[index];
-        if (selectedOption.selectable) {
-            const selectedValue = selectedOption.getAttribute('value') || selectedOption.textContent;
-            this.value = selectedValue || '';
-            this.updateSelectedOption(this.value);
-            this.isDropdownOpen = false;
-            this.isOnBlurInput = true;
-            this.resetDropdownStyles();
-            this.removeOverlay();
-        }
+        setTimeout(() => {
+            const selectedOption = this.options[index];
+            if (selectedOption.selectable) {
+                const selectedValue = selectedOption.getAttribute('value') || selectedOption.textContent;
+                this.value = selectedValue || '';
+                this.updateSelectedOption(this.value);
+                this.isDropdownOpen = false;
+                this.isOnBlurInput = true;
+                this.resetDropdownStyles();
+                this.removeOverlay();
+            }
+        }, 200);
     }
     moveHighlight(direction) {
         const visibleOptions = this.options;
@@ -244,11 +247,13 @@ const CuraDropdownSearch = class {
         this.isDropdownOpen = true;
     }
     getDropdownSearchListHeight() {
-        var _a;
-        const dropdownInputSearchElement = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-input-search');
-        if (dropdownInputSearchElement) {
-            this.host.style.setProperty('--dynamic-input-search-height', `${dropdownInputSearchElement.offsetHeight}px`);
-        }
+        setTimeout(() => {
+            var _a;
+            const dropdownInputSearchElement = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-input-search');
+            if (dropdownInputSearchElement) {
+                this.host.style.setProperty('--dynamic-input-search-height', `${dropdownInputSearchElement.offsetHeight}px`);
+            }
+        }, 310);
     }
     handleGoBack() {
         this.resetDropdownStyles();
@@ -264,9 +269,9 @@ const CuraDropdownSearch = class {
     }
     render() {
         const isMobileDropdown = this.isMobile && this.isDropdownOpen;
-        return (index.h(index.Host, { key: '85b79d1f41c8f03ed8aa8f915743c6a35d529b20', style: this.hostCSSProperties(), class: "dropdown-overlay" }, index.h("div", { key: 'c5255bc1445309a8da2e28e76d31c151170fb1bf', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, index.h("div", { key: 'a0e9db281870954a6f3155cd482c741e3d44db24', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (index.h("cura-button-transparent", { key: '67e58b57752cbe8a8fbbaee555e9c905c710782c', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), index.h("cura-input-text", { key: '87edd1a5b058a9c7ae966999269f1546d7132a53', disabled: this.disabled, label: this.label, part: "cura-input-field", mode: isMobileDropdown ? 'transparent' : 'default', required: this.required, hideErrorIcon: this.status === 'error', iconName: this.iconName || 'search', value: this.value, status: this.status, onValueChange: e => this.onValueChange(e.target.value), onInput: e => this.handleInputChange(e), onFocus: () => this.handleOnFocus(), onClick: () => (window.innerWidth < 768 ? (this.isMobile = true) : null), onBlur: () => {
+        return (index.h(index.Host, { key: '29caf35386c324e85a5b68caa280193e8f1a3aae', style: this.hostCSSProperties(), class: "dropdown-overlay" }, index.h("div", { key: '879dc628c89920323a97f5b29aeadf6e774615ef', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, index.h("div", { key: '31c2df66c5311abedfd1661fb9d8b135dde4ea8a', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (index.h("cura-button-transparent", { key: '418fa19788b7dd8374d4c9c78837ad89c9f11f9e', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), index.h("cura-input-text", { key: '78dfa84f63f4a5a3b72f94e589b9c362d8e78e19', disabled: this.disabled, label: this.label, part: "cura-input-field", mode: isMobileDropdown ? 'transparent' : 'default', required: this.required, hideErrorIcon: this.status === 'error', iconName: this.iconName || 'search', value: this.value, status: this.status, onValueChange: e => this.onValueChange(e.target.value), onInput: e => this.handleInputChange(e), onFocus: () => this.handleOnFocus(), onClick: () => (window.innerWidth < 768 ? (this.isMobile = true) : null), onBlur: () => {
                 this.handleOnBlur();
-            }, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, index.h("slot", { key: '47f7e07fbcce084cef173c23583ad43e580ae02d', name: "helperText" }))), index.h("div", { key: '4748cdb4cd039f29f50cfdf1f9ff110bafbeb064', id: "dropdown-search-list", class: this.getDropdownClasses() }, index.h("slot", { key: '21a66543f65ff198f0b9f60758f1f0930342dc4c', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
+            }, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, index.h("slot", { key: 'e7f13fc467083f08b4666f4323b8734fb734fe1c', name: "helperText" }))), index.h("div", { key: '9a39a16c1dfefd6481593ce062036e19cd1b65fa', id: "dropdown-search-list", class: this.getDropdownClasses() }, index.h("slot", { key: '36af7eb7212ea066af0edb68b5e12bf9f931fae1', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cura-dropdown-search.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-dropdown-search.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/forms/cura-dropdown-search/cura-dropdown-search.scss?tag=cura-dropdown-search&encapsulation=shadow","src/components/forms/cura-dropdown-search/cura-dropdown-search.tsx"],"sourcesContent":["@import '../../../scss/mixins/shadows.scss';\n\n:host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.dropdown {\n  display: flex;\n  position: relative;\n\n  flex-direction: column;\n  width: inherit;\n\n  .dropdown-search-list {\n    z-index: 1000;\n  }\n\n  &-input-search {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background: transparent;\n\n\n    &.dropdown-open {\n      ::part(cura-input-field) {\n        border-radius: 4px 4px 0px 0px;\n      }\n      ::slotted([slot='helperText']) {\n        display: none;\n      }\n\n      cura-input-text {\n        ::slotted([slot='helperText']) {\n          display: none;\n        }\n      }\n    }\n  }\n\n  &-search-list {\n    position: absolute;\n    top:  calc(100% - 8px);\n    width: 100%;\n    max-height: var(--dropdown-max-height);\n    padding: 12px 12px;\n    margin: 0;\n    box-sizing: border-box;\n    @include shadow-level3(--neutral-black-shadow);\n    border-radius: 0px 0px 4px 4px;\n    border-top: 0 var(--neutral-light);\n    border-right: 2px solid var(--neutral-light);\n    border-bottom: 2px solid var(--neutral-light);\n    border-left: 2px solid var(--neutral-light);\n    background-color: var(--neutral-purewhite);\n    list-style: none;\n    overflow-y: auto;\n    display: none;\n\n    &.visible {\n      display: block;\n    }\n\n    &-input-search {\n      width: inherit;\n\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      padding: 16px 8px;\n      border-bottom: 2px solid var(--info-base);\n      background-color: var(--neutral-purewhite);\n\n      cura-input-text {\n        width: inherit;\n      }\n\n      &.error {\n        background-color: var(--error-lighter);\n        border-bottom: 2px solid var(--error-dark);\n      }\n    }\n  }\n\n  &-mobile {\n    position: fixed;\n    top: 1%;\n    left: 0;\n    right: 0;\n    width: 100%;\n    z-index: 10000;\n    \n    .dropdown-input-search {\n      display: flex;\n      background-color: var(--neutral-purewhite);\n      border-bottom: 2px solid var(--info-base);\n      z-index: 10000;\n      cura-button-transparent {\n        display: flex;\n        margin-right: 4px;\n      }\n      cura-input-text {\n        padding: 12px 8px 12px 0px;\n      }\n      &.error {\n        background-color: var(--error-lighter);\n        border-bottom: 2px solid var(--error-dark);\n      }\n      &.dropdown-open {\n        display: flex;\n\n        ::slotted([slot='helperText']) {\n          display: block;\n        }\n      }\n    }\n\n    .dropdown-search-list {\n      position: static;\n      width: 100%;\n      height: calc(100vh - var(--dynamic-input-search-height, 0));\n      max-height: none;\n      padding: 12px 12px;\n      margin: 0;\n      box-sizing: border-box;\n      box-shadow: none;\n      border: none;\n      background-color: var(--neutral-purewhite);\n      list-style: none;\n      overflow-y: auto;\n      z-index: 10000;\n    }\n  }\n}\n","import { Component, Host, Prop, State, Event, EventEmitter, Element, Watch, h } from '@stencil/core';\n\n@Component({\n  tag: 'cura-dropdown-search',\n  styleUrl: 'cura-dropdown-search.scss',\n  shadow: true,\n})\nexport class CuraDropdownSearch {\n  /**\n   * Size of the dropdown search mode default: 'small', 'medium', or 'large' (default: 'large')\n   */\n  @Prop({ reflect: true, mutable: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n   * Define the status of the dropdown search.\n   */\n  @Prop({ reflect: true }) status: 'error' | 'default' = 'default';\n\n  /**\n   * Whether the select component is disabled.\n   * Reflects as an attribute in the DOM.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * The name of the dropdown search component.\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /**\n   * Indicates if the dropdown search is required.\n   */\n  @Prop({ reflect: true, mutable: true }) required: boolean = false;\n\n  /**\n   * Indicates if the dropdown search is selected.\n   */\n  @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n\n  /**\n   * The value of the dropdown search.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  /**\n   * The placeholder text for the dropdown search.\n   */\n  @Prop({ reflect: true, mutable: true }) placeholder: string = '';\n\n  /**\n   * The label for the dropdown search.\n   */\n  @Prop({ reflect: true, mutable: true }) label: string = '';\n\n  /**\n   * Custom icon name. Default: search.\n   */\n  @Prop({ reflect: true }) iconName = 'search';\n\n  /**\n   * CSS max-height property for dropdown item.\n   * Default to 630px\n   */\n  @Prop({ reflect: true }) dropdownMaxHeight = '630px';\n\n  /**\n   * Reference to the host element.\n   */\n  @Element() host: HTMLElement;\n\n  /**\n   * Indicates if the overlay is visible.\n   */\n  @State() overlayVisible: boolean = false;\n\n  /**\n   * Event emitted when the value changes.\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  /**\n   * Indicates if the dropdown is open.\n   */\n  @State() isDropdownOpen: boolean = false;\n\n  /**\n * Styles for the component.\n\n */\n  @State() styles = {};\n\n  /**\n   * Indicates if the component is being viewed on a mobile device.\n   */\n  @State() isMobile: boolean = window.innerWidth < 768;\n\n  /**\n   * The mode of the dropdown search.\n   */\n  @State() mode: 'default' | 'transparent' = 'default';\n\n  @Event() onselect: EventEmitter;\n\n  @State() inputTextRef!: HTMLCuraInputTextElement;\n\n  /**\n   * Indicates if the input is on blur.\n   */\n  @State() isOnBlurInput: boolean = true;\n\n  /**\n   * The index of the currently hovered option.\n   */\n  @State() hoveredIndex: number = -1;\n\n  /**\n   * The options for the dropdown search.\n   * @type {HTMLCuraDropdownSearchOptionElement[]}\n   */\n\n  weights;\n\n  private overlayElement: HTMLDivElement | null = null;\n\n  @State() options: HTMLCuraDropdownSearchOptionElement[] = [];\n\n  /**\n   *\n   * Stores the original value of the 'overflow' style of the body\n   * before blocking the scroll.\n   */\n  @State() originalOverflow: string = '';\n  @State() screenDefaultHeight = 0;\n\n  private adjustInputPosition = async () => {\n    // const tick = await Promise.resolve().then();\n    const isKeyboardOpen = window?.innerHeight < this.screenDefaultHeight;\n      const dropdown = this.host.shadowRoot?.querySelector('.dropdown-mobile') as HTMLElement;\n      if (dropdown) {\n        // dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';\n        dropdown.style.bottom = isKeyboardOpen ? `${window?.screen?.height - window?.innerHeight}px` : '0';\n        window.scroll({ top: 0, left: 0, behavior: 'smooth' });\n      }\n  };\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--info-base'] = window.CuraAPI.theme.colors.getColor('info-base');\n    this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor('neutral-purewhite');\n    this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor('neutral-light');\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor('neutral-dark');\n    this.styles['--neutral-black-shadow'] = window.CuraAPI.theme.colors.getColor(`neutral-black`, 0.16);\n    this.styles['--error-dark'] = window.CuraAPI.theme.colors.getColor('error-dark');\n    this.styles['--error-lighter'] = window.CuraAPI.theme.colors.getColor('error-lighter');\n    this.styles['--breakpoints'] = window.CuraAPI.theme.breakpoints.get();\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n  }\n\n  @Watch('value')\n  onValueChange(newValue: string) {\n    this.updateSelectedOption(newValue);\n    this.valueChanged.emit(newValue);\n  }\n\n  componentWillLoad() {\n    this.updateSelectedOption(this.value);\n  }\n\n  componentDidRender() {\n    if (this.isDropdownOpen && this.isMobile) {\n      this.showOverlay();\n      this.getDropdownSearchListHeight();\n    } else {\n      this.removeOverlay();\n    }\n  }\n  componentDidLoad() {\n    this.screenDefaultHeight = window?.innerHeight;\n    window?.addEventListener('resize', this.setUp);\n    window?.visualViewport?.addEventListener('resize', this.adjustInputPosition);\n  }\n\n  disconnectedCallback() {\n    window?.removeEventListener('resize', this.setUp);\n    window?.visualViewport?.removeEventListener('resize', this.adjustInputPosition);\n  }\n\n  private showOverlay() {\n    if (!this.overlayElement) {\n      this.overlayElement = document.createElement('div');\n      this.overlayElement.className = 'dropdown-overlay';\n      this.overlayElement.style.position = 'fixed';\n      this.overlayElement.style.top = '0';\n      this.overlayElement.style.left = '0';\n      this.overlayElement.style.width = '100%';\n      this.overlayElement.style.height = '100%';\n      this.overlayElement.style.zIndex = '9999';\n      this.overlayElement.style.backgroundColor = 'white';\n      document.body.appendChild(this.overlayElement);\n\n      this.originalOverflow = document.body.style.overflow;\n      document.body.style.overflow = 'hidden';\n    }\n  }\n\n  private removeOverlay() {\n    if (this.overlayElement && this.overlayElement.parentNode === document.body) {\n      document.body.removeChild(this.overlayElement);\n      this.overlayElement = null;\n      document.body.style.overflow = this.originalOverflow;\n    }\n  }\n\n  private handleSlotChange = () => {\n    this.options = Array.from(this.host.querySelectorAll('cura-dropdown-search-option'));\n    this.addClickListenersToOptions();\n    this.updateHoveredIndex();\n  };\n\n  private addClickListenersToOptions() {\n    this.options.forEach((option, index) => {\n      option?.addEventListener('optionSelected', () => this.onSelectedOption(index));\n    });\n  }\n\n  private updateSelectedOption(value: string) {\n    const selectedOptionIndex = this.options.findIndex(option => option.getAttribute('value') === value);\n    this.hoveredIndex = selectedOptionIndex;\n    this.updateOptionAttribute('hovered', this.hoveredIndex);\n    this.updateOptionAttribute('selected', this.hoveredIndex);\n\n    this.scrollHoveredOptionIntoView();\n    this.adjustInputPosition();\n  }\n\n  private handleInputChange = (event: Event) => {\n    const input = event.target as HTMLInputElement;\n    this.value = input.value;\n    this.onValueChange(this.value);\n    // this.valueChanged.emit(this.value);\n  };\n\n  private onSelectedOption(index: number) {\n    const selectedOption = this.options[index];\n    if (selectedOption.selectable) {\n      const selectedValue = selectedOption.getAttribute('value') || selectedOption.textContent;\n\n      this.value = selectedValue || '';\n      this.updateSelectedOption(this.value);\n\n      this.isDropdownOpen = false;\n      this.isOnBlurInput = true;\n      this.resetDropdownStyles();\n      this.removeOverlay();\n    }\n  }\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      this.moveHighlight(1);\n    } else if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      this.moveHighlight(-1);\n    } else if (event.key === 'Enter') {\n      event.preventDefault();\n      if (this.hoveredIndex > -1) {\n        this.handleOnBlur();\n        this.onSelectedOption(this.hoveredIndex);\n      }\n    }\n  };\n\n  private moveHighlight(direction: number) {\n    const visibleOptions = this.options;\n    const newIndex = (this.hoveredIndex + direction + visibleOptions.length) % visibleOptions.length;\n    this.hoveredIndex = newIndex;\n    this.updateOptionAttribute('hovered', this.hoveredIndex);\n    this.scrollHoveredOptionIntoView();\n  }\n\n  private updateOptionAttribute(attribute: string, indexToUpdate: number) {\n    this.options.forEach((option, index) => {\n      (option as any)[attribute] = index === indexToUpdate;\n    });\n  }\n\n  private updateHoveredIndex() {\n    const visibleOptions = this.options;\n    const currentValue = this.value;\n    this.hoveredIndex = visibleOptions.findIndex(option => option.getAttribute('value') === currentValue);\n  }\n\n  private scrollHoveredOptionIntoView() {\n    const container = this.host.shadowRoot?.querySelector('.dropdown-search-list');\n    const hoveredOption = this.options[this.hoveredIndex];\n\n    if (container && hoveredOption) {\n      const optionRect = hoveredOption.getBoundingClientRect();\n      const containerRect = container.getBoundingClientRect();\n\n      if (optionRect.bottom > containerRect.bottom) {\n        container.scrollTop += optionRect.bottom - containerRect.bottom;\n      }\n\n      if (optionRect.top < containerRect.top) {\n        container.scrollTop -= containerRect.top - optionRect.top;\n      }\n    }\n  }\n\n  private handleResize = () => {\n    this.isMobile = window.innerWidth < 768;\n    if (this.isDropdownOpen) {\n      if (this.isMobile) {\n        this.showOverlay();\n      } else {\n        this.resetDropdownStyles();\n        this.removeOverlay();\n      }\n    }\n  };\n\n  handleOnBlur() {\n    if (this.isOnBlurInput === true) {\n      setTimeout(() => {\n        this.isDropdownOpen = false;\n        this.resetDropdownStyles();\n        this.removeOverlay();\n      }, 200);\n    }\n  }\n  getClasses() {\n    return {\n      'dropdown-input-search': true,\n      'dropdown-open': this.isDropdownOpen,\n      'disabled': this.disabled,\n      [this.status]: true,\n    };\n  }\n\n  getDropdownClasses() {\n    return {\n      'dropdown-search-list': true,\n      'visible': this.options.length && this.isDropdownOpen ? true : false,\n    };\n  }\n\n  hostCSSProperties() {\n    return {\n      '--dropdown-max-height': this.dropdownMaxHeight,\n    };\n  }\n\n  handleOnFocus() {\n    this.isDropdownOpen = true;\n  }\n\n  getDropdownSearchListHeight() {\n    const dropdownInputSearchElement = this.host.shadowRoot?.querySelector('.dropdown-input-search') as HTMLInputElement;\n    if (dropdownInputSearchElement) {\n      this.host.style.setProperty('--dynamic-input-search-height', `${dropdownInputSearchElement.offsetHeight}px`);\n    }\n  }\n\n  handleGoBack() {\n    this.resetDropdownStyles();\n    this.isMobile = false;\n  }\n\n  resetDropdownStyles() {\n    const dropdown = this.host.shadowRoot?.querySelector('.dropdown-mobile') as HTMLInputElement;\n    if (dropdown && dropdown.style.position === 'fixed') {\n      dropdown.style.position = 'relative';\n      dropdown.style.removeProperty('bottom');\n    }\n  }\n\n  setUp = () => {\n    this.handleResize()\n    this.adjustInputPosition();\n  }\n\n  render() {\n    const isMobileDropdown = this.isMobile && this.isDropdownOpen;\n    return (\n      <Host style={this.hostCSSProperties()} class=\"dropdown-overlay\">\n        <div class={`dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`} style={this.styles}>\n          <div class={this.getClasses()}>\n          {this.isMobile && this.isDropdownOpen && (\n              <cura-button-transparent fontColor=\"dark\" onClick={() => this.handleGoBack()} iconName=\"arrowLeft\" size=\"medium\" iconOnly color=\"primary\"></cura-button-transparent>\n            )}\n            <cura-input-text\n              disabled={this.disabled}\n              label={this.label}\n              part=\"cura-input-field\"\n              mode={isMobileDropdown ? 'transparent' : 'default'}\n              required={this.required}\n              hideErrorIcon={this.status === 'error'}\n              iconName={this.iconName || 'search'}\n              value={this.value}\n              status={this.status}\n              onValueChange={e => this.onValueChange(e.target.value as string)}\n              onInput={e => this.handleInputChange(e)}\n              onFocus={() => this.handleOnFocus()}\n              onClick={() => (window.innerWidth < 768 ? (this.isMobile = true) : null)}\n              onBlur={() => {\n                this.handleOnBlur();\n              }}\n              placeholder={this.placeholder}\n              size={this.size}\n              onKeyDown={this.handleKeyDown}\n            >\n              <slot name=\"helperText\"></slot>\n            </cura-input-text>\n          </div>\n          <div id=\"dropdown-search-list\" class={this.getDropdownClasses()}>\n            <slot name=\"dropdown-search-option\" onSlotchange={this.handleSlotChange}></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"cura-dropdown-search.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/forms/cura-dropdown-search/cura-dropdown-search.scss?tag=cura-dropdown-search&encapsulation=shadow","src/components/forms/cura-dropdown-search/cura-dropdown-search.tsx"],"sourcesContent":["@import '../../../scss/mixins/shadows.scss';\n\n:host {\n  display: block;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.dropdown {\n  display: flex;\n  position: relative;\n\n  flex-direction: column;\n  width: inherit;\n\n  .dropdown-search-list {\n    z-index: 1000;\n  }\n\n  &-input-search {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background: transparent;\n\n\n    &.dropdown-open {\n      ::part(cura-input-field) {\n        border-radius: 4px 4px 0px 0px;\n      }\n      ::slotted([slot='helperText']) {\n        display: none;\n      }\n\n      cura-input-text {\n        ::slotted([slot='helperText']) {\n          display: none;\n        }\n      }\n    }\n  }\n\n  &-search-list {\n    position: absolute;\n    top:  calc(100% - 8px);\n    width: 100%;\n    max-height: var(--dropdown-max-height);\n    padding: 12px 12px;\n    margin: 0;\n    box-sizing: border-box;\n    @include shadow-level3(--neutral-black-shadow);\n    border-radius: 0px 0px 4px 4px;\n    border-top: 0 var(--neutral-light);\n    border-right: 2px solid var(--neutral-light);\n    border-bottom: 2px solid var(--neutral-light);\n    border-left: 2px solid var(--neutral-light);\n    background-color: var(--neutral-purewhite);\n    list-style: none;\n    overflow-y: auto;\n    display: none;\n\n    &.visible {\n      display: block;\n    }\n\n    &-input-search {\n      width: inherit;\n\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      padding: 16px 8px;\n      border-bottom: 2px solid var(--info-base);\n      background-color: var(--neutral-purewhite);\n\n      cura-input-text {\n        width: inherit;\n      }\n\n      &.error {\n        background-color: var(--error-lighter);\n        border-bottom: 2px solid var(--error-dark);\n      }\n    }\n  }\n\n  &-mobile {\n    position: fixed;\n    top: 1%;\n    left: 0;\n    right: 0;\n    width: 100%;\n    z-index: 10000;\n    \n    .dropdown-input-search {\n      display: flex;\n      background-color: var(--neutral-purewhite);\n      border-bottom: 2px solid var(--info-base);\n      z-index: 10000;\n      cura-button-transparent {\n        display: flex;\n        margin-right: 4px;\n      }\n      cura-input-text {\n        padding: 12px 8px 12px 0px;\n      }\n      &.error {\n        background-color: var(--error-lighter);\n        border-bottom: 2px solid var(--error-dark);\n      }\n      &.dropdown-open {\n        display: flex;\n\n        ::slotted([slot='helperText']) {\n          display: block;\n        }\n      }\n    }\n\n    .dropdown-search-list {\n      position: static;\n      width: 100%;\n      height: calc(100vh - var(--dynamic-input-search-height, 0));\n      max-height: none;\n      padding: 12px 12px;\n      margin: 0;\n      box-sizing: border-box;\n      box-shadow: none;\n      border: none;\n      background-color: var(--neutral-purewhite);\n      list-style: none;\n      overflow-y: auto;\n      z-index: 10000;\n    }\n  }\n}\n","import { Component, Host, Prop, State, Event, EventEmitter, Element, Watch, h } from '@stencil/core';\n\n@Component({\n  tag: 'cura-dropdown-search',\n  styleUrl: 'cura-dropdown-search.scss',\n  shadow: true,\n})\nexport class CuraDropdownSearch {\n  /**\n   * Size of the dropdown search mode default: 'small', 'medium', or 'large' (default: 'large')\n   */\n  @Prop({ reflect: true, mutable: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n   * Define the status of the dropdown search.\n   */\n  @Prop({ reflect: true }) status: 'error' | 'default' = 'default';\n\n  /**\n   * Whether the select component is disabled.\n   * Reflects as an attribute in the DOM.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * The name of the dropdown search component.\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /**\n   * Indicates if the dropdown search is required.\n   */\n  @Prop({ reflect: true, mutable: true }) required: boolean = false;\n\n  /**\n   * Indicates if the dropdown search is selected.\n   */\n  @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n\n  /**\n   * The value of the dropdown search.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = '';\n\n  /**\n   * The placeholder text for the dropdown search.\n   */\n  @Prop({ reflect: true, mutable: true }) placeholder: string = '';\n\n  /**\n   * The label for the dropdown search.\n   */\n  @Prop({ reflect: true, mutable: true }) label: string = '';\n\n  /**\n   * Custom icon name. Default: search.\n   */\n  @Prop({ reflect: true }) iconName = 'search';\n\n  /**\n   * CSS max-height property for dropdown item.\n   * Default to 630px\n   */\n  @Prop({ reflect: true }) dropdownMaxHeight = '630px';\n\n  /**\n   * Reference to the host element.\n   */\n  @Element() host: HTMLElement;\n\n  /**\n   * Indicates if the overlay is visible.\n   */\n  @State() overlayVisible: boolean = false;\n\n  /**\n   * Event emitted when the value changes.\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  /**\n   * Indicates if the dropdown is open.\n   */\n  @State() isDropdownOpen: boolean = false;\n\n  /**\n * Styles for the component.\n\n */\n  @State() styles = {};\n\n  /**\n   * Indicates if the component is being viewed on a mobile device.\n   */\n  @State() isMobile: boolean = window.innerWidth < 768;\n\n  /**\n   * The mode of the dropdown search.\n   */\n  @State() mode: 'default' | 'transparent' = 'default';\n\n  @Event() onselect: EventEmitter;\n\n  @State() inputTextRef!: HTMLCuraInputTextElement;\n\n  /**\n   * Indicates if the input is on blur.\n   */\n  @State() isOnBlurInput: boolean = true;\n\n  /**\n   * The index of the currently hovered option.\n   */\n  @State() hoveredIndex: number = -1;\n\n  /**\n   * The options for the dropdown search.\n   * @type {HTMLCuraDropdownSearchOptionElement[]}\n   */\n\n  weights;\n\n  private overlayElement: HTMLDivElement | null = null;\n\n  @State() options: HTMLCuraDropdownSearchOptionElement[] = [];\n\n  /**\n   *\n   * Stores the original value of the 'overflow' style of the body\n   * before blocking the scroll.\n   */\n  @State() originalOverflow: string = '';\n  @State() screenDefaultHeight = 0;\n\n  private adjustInputPosition = () => {\n    setTimeout(() => {\n      const isKeyboardOpen = window?.innerHeight < this.screenDefaultHeight;\n      const dropdown = this.host.shadowRoot?.querySelector('.dropdown-mobile') as HTMLElement;\n      if (dropdown) {\n        dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';\n        dropdown.style.bottom = isKeyboardOpen ? `${window?.screen?.height - window?.innerHeight}px` : '0';\n        window.scroll({ top: 0, left: 0 });\n      }\n    }, 300);\n  };\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--info-base'] = window.CuraAPI.theme.colors.getColor('info-base');\n    this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor('neutral-purewhite');\n    this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor('neutral-light');\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor('neutral-dark');\n    this.styles['--neutral-black-shadow'] = window.CuraAPI.theme.colors.getColor(`neutral-black`, 0.16);\n    this.styles['--error-dark'] = window.CuraAPI.theme.colors.getColor('error-dark');\n    this.styles['--error-lighter'] = window.CuraAPI.theme.colors.getColor('error-lighter');\n    this.styles['--breakpoints'] = window.CuraAPI.theme.breakpoints.get();\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n  }\n\n  @Watch('value')\n  onValueChange(newValue: string) {\n    this.value = newValue;\n    this.updateSelectedOption(newValue);\n    this.valueChanged.emit(newValue);\n  }\n\n  componentWillLoad() {\n    this.updateSelectedOption(this.value);\n  }\n\n  componentDidRender() {\n    if (this.isDropdownOpen && this.isMobile) {\n      this.showOverlay();\n      this.getDropdownSearchListHeight();\n    } else {\n      this.removeOverlay();\n    }\n  }\n  componentDidLoad() {\n    this.screenDefaultHeight = window?.innerHeight;\n    window?.addEventListener('resize', this.setUp);\n    window?.visualViewport?.addEventListener('resize', this.adjustInputPosition);\n  }\n\n  disconnectedCallback() {\n    window?.removeEventListener('resize', this.setUp);\n    window?.visualViewport?.removeEventListener('resize', this.adjustInputPosition);\n  }\n\n  private showOverlay() {\n    if (!this.overlayElement) {\n      this.overlayElement = document.createElement('div');\n      this.overlayElement.className = 'dropdown-overlay';\n      this.overlayElement.style.position = 'fixed';\n      this.overlayElement.style.top = '0';\n      this.overlayElement.style.left = '0';\n      this.overlayElement.style.width = '100%';\n      this.overlayElement.style.height = '100%';\n      this.overlayElement.style.zIndex = '9999';\n      this.overlayElement.style.backgroundColor = 'white';\n      document.body.appendChild(this.overlayElement);\n\n      this.originalOverflow = document.body.style.overflow;\n      document.body.style.overflow = 'hidden';\n    }\n  }\n\n  private removeOverlay() {\n    if (this.overlayElement && this.overlayElement.parentNode === document.body) {\n      document.body.removeChild(this.overlayElement);\n      this.overlayElement = null;\n      document.body.style.overflow = this.originalOverflow;\n    }\n  }\n\n  private handleSlotChange = () => {\n    this.options = Array.from(this.host.querySelectorAll('cura-dropdown-search-option'));\n    this.addClickListenersToOptions();\n    this.updateHoveredIndex();\n  };\n\n  private addClickListenersToOptions() {\n    this.options.forEach((option, index) => {\n      option?.addEventListener('optionSelected', () => this.onSelectedOption(index));\n    });\n  }\n\n  private updateSelectedOption(value: string) {\n    const selectedOptionIndex = this.options.findIndex(option => option.getAttribute('value') === value);\n    this.hoveredIndex = selectedOptionIndex;\n    this.updateOptionAttribute('hovered', this.hoveredIndex);\n    this.updateOptionAttribute('selected', this.hoveredIndex);\n\n    this.scrollHoveredOptionIntoView();\n    this.adjustInputPosition();\n  }\n\n  private handleInputChange = (event: Event) => {\n    const input = event.target as HTMLInputElement;\n    this.value = input.value;\n    this.onValueChange(this.value);\n  };\n\n  private onSelectedOption(index: number) {\n    setTimeout(() => {\n      const selectedOption = this.options[index];\n      if (selectedOption.selectable) {\n      const selectedValue = selectedOption.getAttribute('value') || selectedOption.textContent;\n      this.value = selectedValue || '';\n      this.updateSelectedOption(this.value);\n\n      this.isDropdownOpen = false;\n      this.isOnBlurInput = true;\n      this.resetDropdownStyles();\n      this.removeOverlay();\n    }\n    }, 200);\n  }\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'ArrowDown') {\n      event.preventDefault();\n      this.moveHighlight(1);\n    } else if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      this.moveHighlight(-1);\n    } else if (event.key === 'Enter') {\n      event.preventDefault();\n      if (this.hoveredIndex > -1) {\n        this.handleOnBlur();\n        this.onSelectedOption(this.hoveredIndex);\n      }\n    }\n  };\n\n  private moveHighlight(direction: number) {\n    const visibleOptions = this.options;\n    const newIndex = (this.hoveredIndex + direction + visibleOptions.length) % visibleOptions.length;\n    this.hoveredIndex = newIndex;\n    this.updateOptionAttribute('hovered', this.hoveredIndex);\n    this.scrollHoveredOptionIntoView();\n  }\n\n  private updateOptionAttribute(attribute: string, indexToUpdate: number) {\n    this.options.forEach((option, index) => {\n      (option as any)[attribute] = index === indexToUpdate;\n    });\n  }\n\n  private updateHoveredIndex() {\n    const visibleOptions = this.options;\n    const currentValue = this.value;\n    this.hoveredIndex = visibleOptions.findIndex(option => option.getAttribute('value') === currentValue);\n  }\n\n  private scrollHoveredOptionIntoView() {\n    const container = this.host.shadowRoot?.querySelector('.dropdown-search-list');\n    const hoveredOption = this.options[this.hoveredIndex];\n\n    if (container && hoveredOption) {\n      const optionRect = hoveredOption.getBoundingClientRect();\n      const containerRect = container.getBoundingClientRect();\n\n      if (optionRect.bottom > containerRect.bottom) {\n        container.scrollTop += optionRect.bottom - containerRect.bottom;\n      }\n\n      if (optionRect.top < containerRect.top) {\n        container.scrollTop -= containerRect.top - optionRect.top;\n      }\n    }\n  }\n\n  private handleResize = () => {\n    this.isMobile = window.innerWidth < 768;\n    if (this.isDropdownOpen) {\n      if (this.isMobile) {\n        this.showOverlay();\n      } else {\n        this.resetDropdownStyles();\n        this.removeOverlay();\n      }\n    }\n  };\n\n  handleOnBlur() {\n    if (this.isOnBlurInput === true) {\n      setTimeout(() => {\n        this.isDropdownOpen = false;\n        this.resetDropdownStyles();\n        this.removeOverlay();\n      }, 200);\n    }\n  }\n  getClasses() {\n    return {\n      'dropdown-input-search': true,\n      'dropdown-open': this.isDropdownOpen,\n      'disabled': this.disabled,\n      [this.status]: true,\n    };\n  }\n\n  getDropdownClasses() {\n    return {\n      'dropdown-search-list': true,\n      'visible': this.options.length && this.isDropdownOpen ? true : false,\n    };\n  }\n\n  hostCSSProperties() {\n    return {\n      '--dropdown-max-height': this.dropdownMaxHeight,\n    };\n  }\n\n  handleOnFocus() {\n    this.isDropdownOpen = true;\n  }\n\n  getDropdownSearchListHeight() {\n    setTimeout(() => {\n      const dropdownInputSearchElement = this.host.shadowRoot?.querySelector('.dropdown-input-search') as HTMLInputElement;\n      if (dropdownInputSearchElement) {\n        this.host.style.setProperty('--dynamic-input-search-height', `${dropdownInputSearchElement.offsetHeight}px`);\n      }\n    }, 310)\n  }\n\n  handleGoBack() {\n    this.resetDropdownStyles();\n    this.isMobile = false;\n  }\n\n  resetDropdownStyles() {\n    const dropdown = this.host.shadowRoot?.querySelector('.dropdown-mobile') as HTMLInputElement;\n    if (dropdown && dropdown.style.position === 'fixed') {\n      dropdown.style.position = 'relative';\n      dropdown.style.removeProperty('bottom');\n    }\n  }\n\n  setUp = () => {\n    this.handleResize()\n    this.adjustInputPosition();\n  }\n\n  render() {\n    const isMobileDropdown = this.isMobile && this.isDropdownOpen;\n    return (\n      <Host style={this.hostCSSProperties()} class=\"dropdown-overlay\">\n        <div class={`dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`} style={this.styles}>\n          <div class={this.getClasses()}>\n          {this.isMobile && this.isDropdownOpen && (\n              <cura-button-transparent fontColor=\"dark\" onClick={() => this.handleGoBack()} iconName=\"arrowLeft\" size=\"medium\" iconOnly color=\"primary\"></cura-button-transparent>\n            )}\n            <cura-input-text\n              disabled={this.disabled}\n              label={this.label}\n              part=\"cura-input-field\"\n              mode={isMobileDropdown ? 'transparent' : 'default'}\n              required={this.required}\n              hideErrorIcon={this.status === 'error'}\n              iconName={this.iconName || 'search'}\n              value={this.value}\n              status={this.status}\n              onValueChange={e => this.onValueChange(e.target.value as string)}\n              onInput={e => this.handleInputChange(e)}\n              onFocus={() => this.handleOnFocus()}\n              onClick={() => (window.innerWidth < 768 ? (this.isMobile = true) : null)}\n              onBlur={() => {\n                this.handleOnBlur();\n              }}\n              placeholder={this.placeholder}\n              size={this.size}\n              onKeyDown={this.handleKeyDown}\n            >\n              <slot name=\"helperText\"></slot>\n            </cura-input-text>\n          </div>\n          <div id=\"dropdown-search-list\" class={this.getDropdownClasses()}>\n            <slot name=\"dropdown-search-option\" onSlotchange={this.handleSlotChange}></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/{esm/app-globals-e54ee4c3.js → cjs/cura-theme-module-14544f5f.js}

@@ -1,3 +1,5 @@
+'use strict';
+
 /**
  * Cura Default Theme
  */
@@ -436,11 +438,13 @@ class CuraThemeBreakpointsModule {
 
 class CuraThemeModule {
     constructor() {
+        var _a;
         this.prefix = '--cura';
         this.colors = new CuraThemeColorsModule();
         this.spacing = new CuraThemeSpacingModule();
         this.fonts = new CuraThemeFontsModule();
         this.breakpoints = new CuraThemeBreakpointsModule();
+        this.groupObject = {};
         /* Private */
         /** Set css var based on object structure */
         this.setCssVar = (prop, path) => {
@@ -448,7 +452,7 @@ class CuraThemeModule {
             this.rootElement.style.setProperty(varName, prop[1]);
         };
         this.groupPath = (a, b) => `${a}-${b}`;
-        this.isObject = (val) => {
+        this.isObject = val => {
             return val && typeof val === 'object' && !Array.isArray(val);
         };
         /** Deep merge objects */
@@ -464,18 +468,26 @@ class CuraThemeModule {
             }
         };
         /** Set css vars from preset object */
-        this.buildCssVars = (path, obj) => {
+        this.buildCssVars = (path, obj, isGroup = false) => {
             const entries = Object.entries(obj);
             for (let e of entries) {
                 if (this.isObject(e[1])) {
-                    this.buildCssVars(this.groupPath(path, e[0]), e[1]);
+                    this.buildCssVars(this.groupPath(path, e[0]), e[1], isGroup);
                 }
                 else {
-                    this.setCssVar(e, path);
+                    if (isGroup) {
+                        const varName = this.groupPath(path, e[0]);
+                        this.groupObject[varName] = e[1];
+                    }
+                    else {
+                        this.setCssVar(e, path);
+                    }
                 }
             }
         };
-        this.rootElement = window.document.documentElement;
+        if (typeof window === 'undefined')
+            return;
+        this.rootElement = (_a = window === null || window === void 0 ? void 0 : window.document) === null || _a === void 0 ? void 0 : _a.documentElement;
     }
     /**
      * Load a theme.
@@ -485,6 +497,11 @@ class CuraThemeModule {
         const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;
         this.buildCssVars(this.prefix, preset);
     }
+    loadVarsSSR(theme = 'default') {
+        const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;
+        this.buildCssVars(this.prefix, preset, true);
+        return this.groupObject;
+    }
     /**
      * Define a custom theme
      * @param customTheme Custom theme object definition
@@ -496,9 +513,7 @@ class CuraThemeModule {
             this.load('default');
         }
         else {
-            const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets
-                ? ThemePresets[customTheme.fromPreset]
-                : ThemePresets.default;
+            const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets ? ThemePresets[customTheme.fromPreset] : ThemePresets.default;
             const newTheme = Object.assign({}, JSON.parse(JSON.stringify(preset)));
             this.mergeObject(customTheme.definitions, newTheme);
             ThemePresets[customTag] = newTheme;
@@ -507,50 +522,6 @@ class CuraThemeModule {
     }
 }
 
-class CuraAPI {
-    constructor(config) {
-        this.localAssetsPath = config && config.localAssetsPath ? config.localAssetsPath : `/assets`;
-        const themeModule = new CuraThemeModule();
-        this.theme = {
-            load: function (themeTag) { themeModule.load(themeTag); },
-            setCustom: function (customThemeDefinitions) { themeModule.setCustom(customThemeDefinitions); },
-            colors: {
-                getColor: function (colorWithDepth, opacity) { return themeModule.colors.getColor(colorWithDepth, opacity); },
-            },
-            fonts: {
-                getFamily: function (type) { return themeModule.fonts.getFamily(type); },
-                getWeights: function () { return themeModule.fonts.getWeights(); },
-                getSize: function () { return themeModule.fonts.getSize(); },
-                getColor: function () { return themeModule.fonts.getColor(); }
-            },
-            spacing: {
-                getSpacing: function () { return themeModule.spacing.getSpacing(); },
-            },
-            breakpoints: {
-                get: function (size, position) { return themeModule.breakpoints.get(size, position); }
-            }
-        };
-        if (config && config.customTheme) {
-            this.theme.setCustom(config.customTheme);
-        }
-        else {
-            const theme = config && config.theme ? config.theme : 'default';
-            this.theme.load(theme);
-        }
-    }
-}
-
-function appGlobalScript () {
-    const config = window.CuraInit;
-    window.CuraAPI = config ? new CuraAPI(config) : new CuraAPI();
-    const api = window.CuraAPI;
-    window.dispatchEvent(new CustomEvent("CuraAPIReady", { detail: { api } }));
-    if (config && typeof config.onReady === 'function')
-        config.onReady(api);
-}
-
-const globalScripts = appGlobalScript;
-
-export { globalScripts as g };
+exports.CuraThemeModule = CuraThemeModule;
 
-//# sourceMappingURL=app-globals-e54ee4c3.js.map
+//# sourceMappingURL=cura-theme-module-14544f5f.js.map

package/dist/cjs/cura-theme-module-14544f5f.js.map

@@ -0,0 +1 @@
+{"file":"cura-theme-module-14544f5f.js","mappings":";;AAAA;;;AAGO,MAAM,YAAY,GAAG;;IAE1B,KAAK,EAAE;QACL,OAAO,EAAE;YACP,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,SAAS;SACjB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;SAClB;QACD,MAAM,EAAE;YACN,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,WAAW;SACnB;KACF;;IAED,OAAO,EAAE;QACP,IAAI,EAAE,CAAC;KACR;;IAED,IAAI,EAAE;QACJ,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,wCAAwC;QAC9C,OAAO,EAAE,wCAAwC;QACjD,OAAO,EAAE,wCAAwC;QACjD,OAAO,EAAE;YACP,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;YACV,OAAO,EAAE,GAAG;YACZ,MAAM,EAAE,GAAG;YACX,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;SACX;KACF;CACF;;AChDD;;;AAKO,MAAM,cAAc,mCAEtB,YAAY;;;IAIf,KAAK,EAAE;QACL,OAAO,EAAE;YACP,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,UAAU;SAClB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;SACrB;QACD,MAAM,EAAE;YACN,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,QAAQ;SAChB;KACF,EACD,IAAI,EAAE;QACJ,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,wCAAwC;QAC9C,OAAO,EAAE,wCAAwC;QACjD,OAAO,EAAE,wCAAwC;QACjD,OAAO,EAAE;YACP,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;YACV,OAAO,EAAE,GAAG;YACZ,MAAM,EAAE,GAAG;YACX,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;SACX;KACF,GACF;;ACjDD;;;AAKO,MAAM,aAAa,mCAErB,YAAY;;;IAIf,KAAK,EAAE;QACL,OAAO,EAAE;YACP,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,SAAS;SACjB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,UAAU;SAClB;QACD,MAAM,EAAE;YACN,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,UAAU;SAClB;QACD,GAAG,EAAE;YACH,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,UAAU;SAClB;KACF,EACD,IAAI,EAAE;QACJ,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,gDAAgD;QACtD,OAAO,EAAE,gDAAgD;QACzD,OAAO,EAAE,gDAAgD;QACzD,OAAO,EAAE;YACP,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;YACV,OAAO,EAAE,GAAG;YACZ,MAAM,EAAE,GAAG;YACX,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;SACX;KACF,GACF;;ACxDD;;;AAKO,MAAM,WAAW,mCAEnB,YAAY;;;IAIf,KAAK,EAAE;QACL,OAAO,EAAE;YACP,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,SAAS;SACjB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,YAAY;SACpB;QACD,MAAM,EAAE;YACN,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,WAAW;SACnB;KACF,GACF;;AClCD;;;AAKO,MAAM,kBAAkB,mCAE1B,YAAY;;;IAIf,KAAK,EAAE;QACL,OAAO,EAAE;YACP,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,SAAS;SACjB;QACD,SAAS,EAAE;YACT,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,SAAS;SACjB;QACD,MAAM,EAAE;YACN,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,SAAS;SACjB;KACF;;IAED,IAAI,EAAE;QACJ,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,wCAAwC;QAC9C,OAAO,EAAE,wCAAwC;QACjD,OAAO,EAAE,wCAAwC;QACjD,OAAO,EAAE;YACP,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;YACV,OAAO,EAAE,GAAG;YACZ,MAAM,EAAE,GAAG;YACX,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;SACX;KACF,GACF;;AC5CM,MAAM,YAAY,GAAG;IAC1B,SAAS,EAAE,YAAY;IACvB,aAAa,EAAE,cAAc;IAC7B,WAAW,EAAE,aAAa;IAC1B,QAAQ,EAAE,WAAW;IACrB,eAAe,EAAE,kBAAkB;CACpC;;ACZD;;;AAGO,MAAM,MAAM,GAAG;;IAEpB,KAAK,EAAE;QACL,OAAO,EAAE;YACP,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,UAAU;SAClB;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;SAClB;QACD,KAAK,EAAE;YACL,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,WAAW;YAClB,KAAK,EAAE,UAAU;SAClB;QACD,OAAO,EAAE;YACP,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,YAAY;YACnB,KAAK,EAAE,UAAU;SAClB;QACD,OAAO,EAAE;YACP,GAAG,EAAE,aAAa;YAClB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,aAAa;YACpB,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,UAAU;SAClB;KACF;IACD,WAAW,EAAE;QACX,MAAM,EAAE;YACN,GAAG,EAAE,CAAC;YACN,GAAG,EAAE,GAAG;SACT;QACD,KAAK,EAAE;YACL,GAAG,EAAE,GAAG;YACR,GAAG,EAAE,GAAG;SACT;QACD,MAAM,EAAE;YACN,GAAG,EAAE,GAAG;YACR,GAAG,EAAE,GAAG;SACT;QACD,KAAK,EAAE;YACL,GAAG,EAAE,GAAG;YACR,GAAG,EAAE,IAAI;SACV;QACD,MAAM,EAAE;YACN,GAAG,EAAE,IAAI;YACT,GAAG,EAAE,IAAI;SACV;KACF;CACF;;MCnEoB,qBAAqB;IAuBxC;QArBA,sBAAiB,GAAG;YAClB,WAAW,EAAE,GAAG;YAChB,OAAO,EAAE,KAAK;YACd,MAAM,EAAE,KAAK;YACb,SAAS,EAAE,KAAK;YAChB,OAAO,EAAE,KAAK;YACd,MAAM,EAAE,KAAK;YACb,QAAQ,EAAE,KAAK;YACf,MAAM,EAAE,KAAK;YACb,QAAQ,EAAE,KAAK;YACf,OAAO,EAAE,KAAK;SACf,CAAC;QAEF,oBAAe,GAAG;YAChB,SAAS,EAAE,KAAK;YAChB,OAAO,EAAE,KAAK;YACd,MAAM,EAAE,KAAK;YACb,MAAM,EAAE,KAAK;YACb,QAAQ,EAAE,KAAK;SAChB,CAAA;KAEe;;;;;;IAOhB,QAAQ,CAAC,iBAAyB,cAAc,EAAE,OAAO,GAAG,CAAC;QAC3D,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;QAC9D,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;QAC1D,IAAI,WAAW;YAAE,OAAO,WAAW,CAAC;QACpC,OAAO,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;KAC/C;;;;;;;IAQD,SAAS,CAAC,KAAa,EAAE,KAAa,EAAE,OAAO,GAAG,CAAC;;QACjD,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QACrC,IAAI,CAAC,QAAQ;YAAE,OAAO,IAAI,CAAC;QAC3B,MAAM,KAAK,GAAG,KAAK,KAAK,SAAS,GAAG,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;QAChG,OAAO,CAAA,MAAA,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,0CAAG,KAAK,CAAC;cAC/B,QAAQ,MAAA,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,0CAAG,KAAK,CAAC,KAAK,OAAO,GAAG;cACnD,QAAQ,MAAA,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,0CAAG,KAAK,CAAC,KAAK,OAAO,GAAG,CAAC;KACzD;;;;;;;IAQD,UAAU,CAAC,KAAa,EAAE,KAAa,EAAE,OAAe;QACtD,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;cACxC,gBAAgB,KAAK,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE;cACtD,gBAAgB,KAAK,IAAI,KAAK,EAAE,CAAC;QACrC,OAAO,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,QAAQ,CAAC;cACxE,YAAY,QAAQ,MAAM,OAAO,GAAG;cACpC,uCAAuC,OAAO,GAAG,CAAC;KACvD;;;;;;IAOO,eAAe,CAAC,cAAsB;QAC5C,MAAM,CAAE,KAAK,EAAE,KAAK,CAAE,GAAG,cAAc,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QACrE,OAAO,EAAE,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,SAAS,EAAE,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,MAAM,EAAE,CAAC;KAC9D;;;MC7EkB,sBAAsB;IAIzC;QAFQ,gBAAW,GAAG,qBAAqB,CAAC;KAE5B;;IAGhB,UAAU;QACR,IAAI,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE;YACtE,OAAO,OAAO,IAAI,CAAC,WAAW,GAAG,CAAC;SACnC;QACD,OAAO,GAAG,CAAC;KACZ;;;MCVkB,oBAAoB;IAEvC;;;;;QA4BA,YAAO,GAAG,MAAM,uBAAuB,CAAC;;;;;QAMxC,aAAQ,GAAG,MAAM,wBAAwB,CAAC;KAlC1B;;;;;;IAOhB,SAAS,CAAC,OAAe,MAAM;QAC7B,MAAM,oBAAoB,GAAG,eAAe,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC;QACjE,OAAO,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,gBAAgB,CAAC,oBAAoB,CAAC;cACzE,OAAO,oBAAoB,GAAG;cAC9B,uBAAuB,CAAC;KAC7B;;;;;IAMD,UAAU;QACR,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,2BAA2B,GAAG,GAAG,CAAC,CAAC;QAC1G,OAAO,OAAO,CAAC;KAChB;;;MCxBkB,0BAA0B;IAE7C,iBAAgB;;IAGhB,GAAG,CAAC,OAA2D,IAAI,EAAE,WAA0B,IAAI;QACjG,IAAI,IAAI,EAAE;YACR,MAAM,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,GAAG,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;YAC5F,IAAI,UAAU,IAAI,UAAU,KAAK,CAAC;gBAAE,OAAO,UAAU,CAAC;SACvD;QACD,OAAO,MAAM,CAAC,WAAW,CAAC;KAC3B;;;MCNkB,eAAe;IASlC;;QAPA,WAAM,GAAG,QAAQ,CAAC;QAClB,WAAM,GAAG,IAAI,qBAAqB,EAAE,CAAC;QACrC,YAAO,GAAG,IAAI,sBAAsB,EAAE,CAAC;QACvC,UAAK,GAAG,IAAI,oBAAoB,EAAE,CAAC;QACnC,gBAAW,GAAG,IAAI,0BAA0B,EAAE,CAAC;QAC/C,gBAAW,GAAG,EAAE,CAAC;;;QA6CjB,cAAS,GAAG,CAAC,IAAI,EAAE,IAAI;YACrB,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;YAC9C,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,WAAW,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;SACtD,CAAC;QAEF,cAAS,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;QAElC,aAAQ,GAAG,GAAG;YACZ,OAAO,GAAG,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;SAC9D,CAAC;;QAGF,gBAAW,GAAG,CAAC,IAAI,EAAE,EAAE;YACrB,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YACrC,KAAK,IAAI,CAAC,IAAI,OAAO,EAAE;gBACrB,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;oBACvB,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBAClC;qBAAM;oBACL,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;iBACjB;aACF;SACF,CAAC;;QAGF,iBAAY,GAAG,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,GAAG,KAAK;YACxC,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;YACpC,KAAK,IAAI,CAAC,IAAI,OAAO,EAAE;gBACrB,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;oBACvB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;iBAC9D;qBAAM;oBACL,IAAI,OAAO,EAAE;wBACX,MAAM,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;wBAE3C,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;qBAClC;yBAAM;wBACL,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;qBACzB;iBACF;aACF;SACF,CAAC;QAjFA,IAAI,OAAO,MAAM,KAAK,WAAW;YAAE,OAAO;QAE1C,IAAI,CAAC,WAAW,GAAG,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,0CAAE,eAAe,CAAC;KACtD;;;;;IAMD,IAAI,CAAC,KAAK,GAAG,SAAS;QACpB,MAAM,MAAM,GAAG,YAAY,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,CAAC;QAChF,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;KACxC;IAED,WAAW,CAAC,KAAK,GAAG,SAAS;QAC3B,MAAM,MAAM,GAAG,YAAY,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,CAAC;QAChF,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC;QAE7C,OAAO,IAAI,CAAC,WAAW,CAAC;KACzB;;;;;IAMD,SAAS,CAAC,WAA4B;QACpC,MAAM,SAAS,GAAG,WAAW,CAAC,IAAI,CAAC;QACnC,IAAI,SAAS,IAAI,YAAY,EAAE;YAC7B,OAAO,CAAC,GAAG,CAAC,8EAA8E,EAAE,SAAS,CAAC,CAAC;YACvG,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SACtB;aAAM;YACL,MAAM,MAAM,GAAG,WAAW,CAAC,UAAU,IAAI,WAAW,CAAC,UAAU,IAAI,YAAY,GAAG,YAAY,CAAC,WAAW,CAAC,UAAU,CAAC,GAAG,YAAY,CAAC,OAAO,CAAC;YAC9I,MAAM,QAAQ,qBAAQ,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAE,CAAC;YAC3D,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;YACpD,YAAY,CAAC,SAAS,CAAC,GAAG,QAAQ,CAAC;YACnC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;SACtB;KACF;;;;;","names":[],"sources":["src/api/theme-presets/theme-default.ts","src/api/theme-presets/theme-maternity.ts","src/api/theme-presets/theme-oncology.ts","src/api/theme-presets/theme-richet.ts","src/api/theme-presets/theme-legacy-default.ts","src/api/theme-presets/theme-presets.ts","src/api/theme-presets/static.ts","src/api/modules/cura-theme-colors-module.ts","src/api/modules/cura-theme-spacing-module.ts","src/api/modules/cura-theme-fonts-module.ts","src/api/modules/cura-theme-breakpoints-module.ts","src/api/modules/cura-theme-module.ts"],"sourcesContent":["/**\n * Cura Default Theme\n */\nexport const ThemeDefault = {\n  /* Colors */\n  color: {\n    primary: {\n      '100': '113,197,232',\n      '300': '68,142,205',\n      '500': '0,61,165',\n      '700': '0,48,117',\n      '900': '0,40,85'\n    },\n    secondary: {\n      '100': '245,236,227',\n      '300': '221,192,162',\n      '500': '204,160,116',\n      '700': '136,107,77',\n      '900': '41,32,23'\n    },\n    accent: {\n      '100': '255,194,123',\n      '300': '255,168,74',\n      '500': '255,130,0',\n      '700': '215,114,10',\n      '900': '155,90,26'\n    }\n  },\n  /* Spacing */\n  spacing: {\n    base: 4,\n  },\n  /* Fonts */\n  font: {\n    size: '14px',\n    color: '#4A4A4A',\n    body: \"'Gotham', Arial, Helvetica, sans-serif\",\n    heading: \"'Gotham', Arial, Helvetica, sans-serif\",\n    display: \"'Gotham', Arial, Helvetica, sans-serif\",\n    weights: {\n      thin: 100,\n      light: 300,\n      regular: 400,\n      medium: 500,\n      bold: 700,\n      black: 900\n    },\n  }\n};\n","/**\n * Maternity Theme\n */\nimport { ThemeDefault } from \"./theme-default\";\n\nexport const ThemeMaternity = {\n  /* Get default theme */\n  ...ThemeDefault,\n\n  /* Custom */\n  /* Colors */\n  color: {\n    primary: {\n      '100': '248,227,226',\n      '300': '255,179,171',\n      '500': '218,113,111',\n      '700': '145,75,74',\n      '900': '73,38,37'\n    },\n    secondary: {\n      '100': '253,251,249',\n      '300': '247,244,238',\n      '500': '245,236,227',\n      '700': '204,197,189',\n      '900': '163,157,151'\n    },\n    accent: {\n      '100': '236,239,249',\n      '300': '133,153,203',\n      '500': '11,20,151',\n      '700': '7,13,101',\n      '900': '4,7,50'\n    }\n  },\n  font: {\n    size: '14px',\n    color: '#4A4A4A',\n    body: \"'Gotham', Arial, Helvetica, sans-serif\",\n    heading: \"'Gotham', Arial, Helvetica, sans-serif\",\n    display: \"'Gotham', Arial, Helvetica, sans-serif\",\n    weights: {\n      thin: 100,\n      light: 300,\n      regular: 400,\n      medium: 500,\n      bold: 700,\n      black: 900\n    },\n  }\n};\n","/**\n * Oncology Theme\n */\nimport { ThemeDefault } from \"./theme-default\";\n\nexport const ThemeOncology = {\n  /* Get default theme */\n  ...ThemeDefault,\n\n  /* Custom */\n  /* Colors */\n  color: {\n    primary: {\n      '100': '170,190,225',\n      '300': '85,126,196',\n      '500': '0,61,166',\n      '700': '0,41,111',\n      '900': '0,12,33'\n    },\n    secondary: {\n      '100': '205,215,227',\n      '300': '155,175,199',\n      '500': '104,134,171',\n      '700': '54,95,143',\n      '900': '4,54,115',\n    },\n    accent: {\n      '100': '153,207,255',\n      '300': '71,169,255',\n      '500': '0,131,245',\n      '700': '0,109,204',\n      '900': '0,88,164',\n    },\n    aux: {\n      '100': '218,242,239',\n      '300': '132,212,202',\n      '500': '71,191,176',\n      '700': '33,100,92',\n      '900': '14,38,35',\n    },\n  },\n  font: {\n    size: '14px',\n    color: '#4A4A4A',\n    body: \"'Hanken Grotesk', Arial, Helvetica, sans-serif\",\n    heading: \"'Hanken Grotesk', Arial, Helvetica, sans-serif\",\n    display: \"'Hanken Grotesk', Arial, Helvetica, sans-serif\",\n    weights: {\n      thin: 100,\n      light: 300,\n      regular: 400,\n      medium: 500,\n      bold: 700,\n      black: 900\n    },\n  }\n};\n","/**\n * Richet Theme\n */\nimport { ThemeDefault } from \"./theme-default\";\n\nexport const ThemeRichet = {\n  /* Get default theme */\n  ...ThemeDefault,\n\n  /* Custom */\n  /* Colors */\n  color: {\n    primary: {\n      '100': '153,197,255',\n      '300': '67,142,241',\n      '500': '0,47,108',\n      '700': '1,39,91',\n      '900': '0,33,77'\n    },\n    secondary: {\n      '100': '243,237,227',\n      '300': '216,194,163',\n      '500': '208,173,103',\n      '700': '201,155,64',\n      '900': '149,104,15'\n    },\n    accent: {\n      '100': '167,230,215',\n      '300': '130,225,209',\n      '500': '44,213,196',\n      '700': '26,188,169',\n      '900': '0,150,129'\n    }\n  },\n};\n","/**\n * Legacy Default Theme\n */\nimport { ThemeDefault } from \"./theme-default\";\n\nexport const ThemeLegacyDefault = {\n  /* Get default theme */\n  ...ThemeDefault,\n\n  /* Custom */\n  /* Colors */\n  color: {\n    primary: {\n      '100': '204,217,231',\n      '300': '85,128,174',\n      '500': '0,65,134',\n      '700': '0,43,89',\n      '900': '0,13,27'\n    },\n    secondary: {\n      '100': '238,232,206',\n      '300': '198,180,92',\n      '500': '170,142,11',\n      '700': '113,95,7',\n      '900': '34,28,2'\n    },\n    accent: {\n      '100': '249,232,213',\n      '300': '228,160,79',\n      '500': '223,141,44',\n      '700': '149,94,29',\n      '900': '45,28,9'\n    }\n  },\n  /* Fonts */\n  font: {\n    size: '14px',\n    color: '#4A4A4A',\n    body: \"'Roboto', Arial, Helvetica, sans-serif\",\n    heading: \"'Roboto', Arial, Helvetica, sans-serif\",\n    display: \"'Roboto', Arial, Helvetica, sans-serif\",\n    weights: {\n      thin: 100,\n      light: 300,\n      regular: 400,\n      medium: 500,\n      bold: 700,\n      black: 900\n    },\n  }\n};\n","import { ThemeDefault } from './theme-default';\nimport { ThemeMaternity } from './theme-maternity';\nimport { ThemeOncology } from './theme-oncology';\nimport { ThemeRichet } from './theme-richet';\nimport { ThemeLegacyDefault } from './theme-legacy-default';\n\nexport const ThemePresets = {\n  'default': ThemeDefault,\n  'maternidade': ThemeMaternity,\n  'oncologia': ThemeOncology,\n  'richet': ThemeRichet,\n  'legacyDefault': ThemeLegacyDefault\n};\n","/**\n * Static\n */\nexport const Static = {\n  /* Colors */\n  color: {\n    success: {\n      '100': '223,246,233',\n      '300': '148,225,181',\n      '500': '95,210,144',\n      '700': '49,115,77',\n      '900': '19,42,29',\n    },\n    info: {\n      '100': '207,226,255',\n      '300': '149,191,255',\n      '500': '110,168,255',\n      '700': '66,100,153',\n      '900': '37,56,85',\n    },\n    error: {\n      '100': '251,221,221',\n      '300': '242,143,143',\n      '500': '235,87,87',\n      '700': '157,58,58',\n      '900': '47,17,17',\n    },\n    warning: {\n      '100': '252,250,196',\n      '300': '248,244,137',\n      '500': '245,239,78',\n      '700': '108,106,32',\n      '900': '49,48,16',\n    },\n    neutral: {\n      '0': '255,255,255',\n      '100': '246,246,246',\n      '200': '233,233,233',\n      '300': '226,226,226',\n      '400': '212,212,212',\n      '500': '183,183,183',\n      '600': '146,146,146',\n      '700': '110,110,110',\n      '800': '74,74,74',\n      '900': '38,38,38',\n    },\n  },\n  breakpoints: {\n    xsmall: {\n      min: 0,\n      max: 480\n    },\n    small: {\n      min: 481,\n      max: 768\n    },\n    medium: {\n      min: 769,\n      max: 992\n    },\n    large: {\n      min: 993,\n      max: 1920\n    },\n    xlarge: {\n      min: 1921,\n      max: 4096\n    }\n  }\n};\n","import { Static } from \"../theme-presets/static\";\n\nexport default class CuraThemeColorsModule {\n\n  NeutralDepthAlias = {\n    'purewhite': '0',\n    'white': '100',\n    'pale': '200',\n    'lighter': '300',\n    'light': '400',\n    'base': '500',\n    'medium': '600',\n    'dark': '700',\n    'darker': '800',\n    'black': '900',\n  };\n\n  ColorDepthAlias = {\n    'lighter': '100',\n    'light': '300',\n    'base': '500',\n    'dark': '700',\n    'darker': '900'\n  }\n\n  constructor() {}\n\n  /**\n   * Get theme color.\n   * @param colorWithDepth string Ex.: primary-light\n   * @returns RGBA value.\n   */\n  getColor(colorWithDepth: string = \"primary-base\", opacity = 1): string {\n    const { color, depth } = this.splitColorDepth(colorWithDepth);\n    const staticColor = this.getStatic(color, depth, opacity);\n    if (staticColor) return staticColor;\n    return this.getDynamic(color, depth, opacity);\n  }\n\n  /**\n   * Internal: Look for static color by name and depth.\n   * @param color Color name.\n   * @param depth Depth number or alias.\n   * @returns RGBA value.\n   */\n  getStatic(color: string, depth: string, opacity = 1) {\n    const colorObj = Static.color[color];\n    if (!colorObj) return null;\n    const alias = color === 'neutral' ? this.NeutralDepthAlias[depth] : this.ColorDepthAlias[depth];\n    return Static.color[color]?.[alias]\n      ? `rgba(${Static.color[color]?.[alias]}, ${opacity})`\n      : `rgba(${Static.color[color]?.[depth]}, ${opacity})`;\n  }\n\n  /**\n   * Internal: Look for theme dynamic colors.\n   * @param color Color name.\n   * @param depth Color depth.\n   * @returns RGBA value.\n   */\n  getDynamic(color: string, depth: string, opacity: number) {\n    const themeVar = this.ColorDepthAlias[depth]\n      ? `--cura-color-${color}-${this.ColorDepthAlias[depth]}`\n      : `--cura-color-${color}-${depth}`;\n    return getComputedStyle(document.documentElement).getPropertyValue(themeVar)\n      ? `rgba(var(${themeVar}), ${opacity})`\n      : `rgba(var(--cura-color-primary-500), ${opacity})`;\n  }\n\n  /**\n   * Internal: Split color strings\n   * @param colorWithDepth Color string [color]-[depth]. Ex.: primary-dark.\n   * @returns Object { color: string, depth: string }.\n   */\n  private splitColorDepth(colorWithDepth: string): { color: string, depth: string } {\n    const [ color, depth ] = colorWithDepth.toLowerCase().split(/-(.*)/);\n    return { color: color ?? \"primary\", depth: depth ?? \"base\" };\n  }\n\n}\n","export default class CuraThemeSpacingModule {\n\n  private curaSpacing = '--cura-spacing-base';\n\n  constructor() {}\n\n  /** Returns the base spacing var defined in the theme */\n  getSpacing(): string {\n    if (getComputedStyle(document.body).getPropertyValue(this.curaSpacing)) {\n      return `var(${this.curaSpacing})`;\n    }\n    return '4';\n  }\n}\n","import { ThemeDefault } from \"../theme-presets/theme-default\";\n\nexport default class CuraThemeFontsModule {\n\n  constructor() {}\n\n  /**\n   * Get the CSS variable related to the font family defined by the theme.\n   * @param type 'body' | 'heading' | 'display'\n   * @returns Related css variable as a string.\n   */\n  getFamily(type: string = \"body\"): string {\n    const curaFontFamilyCSSVar = `--cura-font-${type.toLowerCase()}`;\n    return getComputedStyle(document.body).getPropertyValue(curaFontFamilyCSSVar)\n      ? `var(${curaFontFamilyCSSVar})`\n      : 'var(--cura-font-body)';\n  }\n\n  /**\n   * Get the CSS variables related to font weights defined by the theme.\n   * @returns Object with CSS vars weights definitions for thin, light, regular, medium, bold and black fonts.\n   */\n  getWeights(): any {\n    const weights = {};\n    Object.keys(ThemeDefault.font.weights).forEach((key) => weights[key] = `var(--cura-font-weights-${key})`);\n    return weights;\n  }\n\n  /**\n   * Get the CSS variable related to the font size base defined by the theme.\n   * @returns Related CSS variable as a string.\n   */\n  getSize = () => `var(--cura-font-size)`;\n\n  /**\n   * Get CSS variable related to the font color defined by the theme.\n   * @returns Related CSS variable as a string.\n   */\n  getColor = () => `var(--cura-font-color)`;\n\n}\n","import { Static } from '../theme-presets/static';\n\nexport default class CuraThemeBreakpointsModule {\n\n  constructor() {}\n\n  /** Returns the base spacing var defined in the theme */\n  get(size: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' = null, position: 'min' | 'max' = null): any {\n    if (size) {\n      const breakpoint = position ? Static.breakpoints[size][position] : Static.breakpoints[size];\n      if (breakpoint || breakpoint === 0) return breakpoint;\n    }\n    return Static.breakpoints;\n  }\n}\n","import { ThemePresets } from '../theme-presets/theme-presets';\nimport { CuraCustomTheme } from '../cura-api.type';\nimport CuraThemeColorsModule from './cura-theme-colors-module';\nimport CuraThemeSpacingModule from './cura-theme-spacing-module';\nimport CuraThemeFontsModule from './cura-theme-fonts-module';\nimport CuraThemeBreakpointsModule from './cura-theme-breakpoints-module';\n\nexport default class CuraThemeModule {\n  rootElement: HTMLElement;\n  prefix = '--cura';\n  colors = new CuraThemeColorsModule();\n  spacing = new CuraThemeSpacingModule();\n  fonts = new CuraThemeFontsModule();\n  breakpoints = new CuraThemeBreakpointsModule();\n  groupObject = {};\n\n  constructor() {\n    if (typeof window === 'undefined') return;\n\n    this.rootElement = window?.document?.documentElement;\n  }\n\n  /**\n   * Load a theme.\n   * @param theme Theme tag.\n   */\n  load(theme = 'default') {\n    const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;\n    this.buildCssVars(this.prefix, preset);\n  }\n\n  loadVarsSSR(theme = 'default') {\n    const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;\n    this.buildCssVars(this.prefix, preset, true);\n\n    return this.groupObject;\n  }\n\n  /**\n   * Define a custom theme\n   * @param customTheme Custom theme object definition\n   */\n  setCustom(customTheme: CuraCustomTheme) {\n    const customTag = customTheme.name;\n    if (customTag in ThemePresets) {\n      console.log('Error building custom theme. Theme %s already exists. Loading default theme.', customTag);\n      this.load('default');\n    } else {\n      const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets ? ThemePresets[customTheme.fromPreset] : ThemePresets.default;\n      const newTheme = { ...JSON.parse(JSON.stringify(preset)) };\n      this.mergeObject(customTheme.definitions, newTheme);\n      ThemePresets[customTag] = newTheme;\n      this.load(customTag);\n    }\n  }\n\n  /* Private */\n\n  /** Set css var based on object structure */\n  setCssVar = (prop, path) => {\n    const varName = this.groupPath(path, prop[0]);\n    this.rootElement.style.setProperty(varName, prop[1]);\n  };\n\n  groupPath = (a, b) => `${a}-${b}`;\n\n  isObject = val => {\n    return val && typeof val === 'object' && !Array.isArray(val);\n  };\n\n  /** Deep merge objects */\n  mergeObject = (from, to) => {\n    const entries = Object.entries(from);\n    for (let e of entries) {\n      if (this.isObject(e[1])) {\n        this.mergeObject(e[1], to[e[0]]);\n      } else {\n        to[e[0]] = e[1];\n      }\n    }\n  };\n\n  /** Set css vars from preset object */\n  buildCssVars = (path, obj, isGroup = false) => {\n    const entries = Object.entries(obj);\n    for (let e of entries) {\n      if (this.isObject(e[1])) {\n        this.buildCssVars(this.groupPath(path, e[0]), e[1], isGroup);\n      } else {\n        if (isGroup) {\n          const varName = this.groupPath(path, e[0]);\n\n          this.groupObject[varName] = e[1];\n        } else {\n          this.setCssVar(e, path);\n        }\n      }\n    }\n  };\n}\n"],"version":3}

package/dist/cjs/cura.cjs.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e6d728ec.js');
-const appGlobals = require('./app-globals-f33ceef8.js');
+const appGlobals = require('./app-globals-57c5b283.js');
+require('./cura-theme-module-14544f5f.js');
 
 /*
  Stencil Client Patch Browser v4.22.0 | MIT Licensed | https://stenciljs.com