@rededor/cura 1.0.0 → 1.2.0-alpha.0

package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.js.map

@@ -1 +1 @@
-{"version":3,"file":"cura-button-transparent.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"names":[],"mappings":"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","sourcesContent":["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='118%' 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='118%' 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.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"names":[],"mappings":"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","sourcesContent":["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"]}

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

@@ -43,7 +43,7 @@ export class CuraAlert {
         return this.icon ? this.icon : iconMapping[this.type];
     }
     render() {
-        return (h(Host, { key: 'b7b63129f2d0c1d2f8b451a7f795befc9e085238' }, h("div", { key: 'b8450a11d65f0bbb3c9f688fccbb38efc7bf223c', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '9a5dc4295f7c40362a86f77fe805127590812f15', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: '6bbe4799d3f73df0cda2e94da2d71cdc1bfc855a', class: "content" }, h("cura-label", { key: '8b761ec2804bb5633893af8ed91f5de268bbf029', class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label), h("cura-paragraph", { key: '4e7e7726758c26f1f397e8efc84d5eba1c88b428', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'f589c6fb9016b43b3557492a3ef1b4ede4a807a6' })), h("div", { key: 'b212e9255855b96d5c069dd7544675386f00b372', class: "actions" }, h("slot", { key: '174dfcc7dfc4ff3e29185843e010dddae75463f5', name: "actions" }))), this.closeable ?
+        return (h(Host, { key: 'c5398d59da323dee68eed1cb7c27841df0e12d14' }, h("div", { key: 'd9bb0ab7a2106e710a113513e6eeb1297b9bd205', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '54665c81a59cbca3686abc6f5e388da32e2211ed', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: '466f9f4aed5096658de1e19521cefe2915b095af', class: "content" }, h("cura-label", { key: '6b3d9cd0352b5d5254305baa5a71a1b1782f637f', class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label), h("cura-paragraph", { key: '5dbad5e65d88b59a81b7df97154071a607d73900', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'cb75d38c35d34a7bee4e187c640a1269bad192b0' })), h("div", { key: 'a6930bb463601a2ba429b23fad61847e8dee01f3', class: "actions" }, h("slot", { key: '7f4fc8b08a870f578d0b241df00650ebf3db83e0', name: "actions" }))), this.closeable ?
             (h("cura-icon", { name: "close", size: 16, color: "error-dark", class: "icon-right", onClick: this.handleClose }))
             : '')));
     }

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

@@ -39,7 +39,7 @@ export class CuraAvatar {
         this.imageSrc = this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`;
     }
     render() {
-        return (h(Host, { key: 'fc8fbe9cdcab86398c83a55d006badb870ee959a', style: this.hostCSSProperties(), role: "img" }, h("div", { key: '6a107805cd770b98e74f7b0475c9896f59e51832', class: this.getClasses(), style: this.styles }, h("img", { key: '4bd7991bd32b0aa6f87d0725303960b0b4c3b0b9', src: this.imageSrc || this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`, onError: () => this.onSrcError() }))));
+        return (h(Host, { key: '2760534555a0483e7e30c5f3009ec0cf68d0973b', style: this.hostCSSProperties(), role: "img" }, h("div", { key: '3daf6dd066983dc63525c38b7da498147c0bf387', class: this.getClasses(), style: this.styles }, h("img", { key: 'a5f4de7983722fc3f750404fa985c312590b5e98', src: this.imageSrc || this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`, onError: () => this.onSrcError() }))));
     }
     static get is() { return "cura-avatar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,21 +1,27 @@
 :host {
   display: block;
   width: var(--width);
+  max-width: 400px;
+  margin: 0 auto;
 }
 :host .calendar {
   display: flex;
   flex-direction: column;
   gap: 5px;
   width: var(--width);
-  padding: 0 12px 12px 12px;
-  min-width: 280px;
-  border: 1px solid var(--neutral-light);
+  min-width: 268px;
   border-radius: 4px;
   overflow: hidden;
   background: #fff;
-  box-shadow: 0 4px 8px var(--neutral-light);
   font-family: var(--font-family);
 }
+:host .calendar.embedded {
+  border: 2px solid var(--neutral-light);
+  padding: 0px 12px 12px 12px;
+}
+:host .calendar.floating {
+  box-shadow: 0 4px 8px var(--neutral-light);
+}
 :host .header {
   position: relative;
   padding: 12px 0;
@@ -39,7 +45,7 @@
 }
 :host .select {
   display: flex;
-  padding: 0px 12px;
+  padding: 7px 10px 0px;
   justify-content: center;
   align-items: center;
   gap: 6px;
@@ -195,4 +201,8 @@
   border-radius: 4px;
   border: 1px solid #ccc;
   background: #f7f7f7;
+}
+
+.teste {
+  width: 100%;
 }

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

@@ -1,5 +1,5 @@
 import { h, Host } from "@stencil/core";
-import { getMonth, getYear, startOfMonth, endOfMonth, eachDayOfInterval, format, getDay, isBefore, isAfter, isSameDay, isToday, parseISO, addDays, addMonths, subDays, startOfYear, eachMonthOfInterval, startOfWeek, endOfWeek, subMonths, isValid, subWeeks, addWeeks } from "date-fns";
+import { getMonth, getYear, startOfMonth, endOfMonth, eachDayOfInterval, format, getDay, isBefore, isAfter, isSameDay, isToday, parseISO, addDays, addMonths, subDays, startOfYear, eachMonthOfInterval, startOfWeek, endOfWeek, subMonths, isValid, subWeeks, addWeeks, } from "date-fns";
 import enAU from "date-fns/locale/en-AU";
 import ptBR from "date-fns/locale/pt-BR";
 export class CuraCalendar {
@@ -8,7 +8,7 @@ export class CuraCalendar {
         this.weights = this.theme.fonts.getWeights();
         this.optionsLocale = { 'pt-BR': ptBR, 'en-US': enAU };
         this.period = null;
-        this.width = '280px';
+        this.width = '268px';
         this.mode = 'single';
         this.dateFormat = 'yyyy-MM-dd';
         this.locale = 'pt-BR';
@@ -16,9 +16,13 @@ export class CuraCalendar {
         this.disable = [];
         this.enable = [];
         this.defaultDate = [];
+        this.customDates = [];
         this.limitRange = null;
-        this.disablePassDates = false;
+        this.disablePassDates = undefined;
+        this.disableFutureDates = undefined;
         this.collapsed = null;
+        this.floating = undefined;
+        this.embedded = undefined;
         this.currentDate = new Date();
         this.selectedDates = [];
         this.rangeStart = null;
@@ -28,7 +32,6 @@ export class CuraCalendar {
         this.styles = {};
     }
     connectedCallback() {
-        this.initializeDefaultDates();
         this.setFontProperties();
         const colors = [
             { name: '--accent-base', theme: 'accent-base' },
@@ -38,7 +41,7 @@ export class CuraCalendar {
             { name: '--neutral-dark', theme: 'neutral-dark' },
             { name: '--neutral-light', theme: 'neutral-light' },
         ];
-        colors.forEach(color => this.styles = Object.assign(Object.assign({}, this.styles), { [color.name]: this.theme.colors.getColor(color.theme) }));
+        colors.forEach(color => (this.styles = Object.assign(Object.assign({}, this.styles), { [color.name]: this.theme.colors.getColor(color.theme) })));
     }
     setFontProperties() {
         this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();
@@ -55,19 +58,19 @@ export class CuraCalendar {
         this.defaultDates = this.expandDateRanges(this.defaultDate);
     }
     /**
-   * Get the locale for the calendar.
-   *
-   * @returns {Locale} The locale object.
-   */
+     * Get the locale for the calendar.
+     *
+     * @returns {Locale} The locale object.
+     */
     determineLocale() {
         return this.optionsLocale[this.locale] || this.locale;
     }
     /**
-   * Check if a date is within the valid period.
-   *
-   * @param {Date} date - The date to check.
-   * @returns {boolean} Whether the date is valid.
-   */
+     * Check if a date is within the valid period.
+     *
+     * @param {Date} date - The date to check.
+     * @returns {boolean} Whether the date is valid.
+     */
     isDateInValidPeriod(date) {
         if (this.period === null) {
             return true;
@@ -103,6 +106,8 @@ export class CuraCalendar {
         today.setHours(0, 0, 0, 0);
         if (this.disablePassDates)
             return isBefore(date, today);
+        if (this.disableFutureDates)
+            return isAfter(date, today);
         if (this.disable === null)
             return false;
         return this.isDateInList(this.expandDateRanges(this.disable), date);
@@ -119,12 +124,12 @@ export class CuraCalendar {
         return this.isDateInList(this.expandDateRanges(this.enable), date);
     }
     /**
-   * Checks if a date is in the provided list of dates.
-   *
-   * @param {Date[]} dates - The list of dates to check against.
-   * @param {Date} date - The date to check.
-   * @returns {boolean} Whether the date is in the list.
-   */
+     * Checks if a date is in the provided list of dates.
+     *
+     * @param {Date[]} dates - The list of dates to check against.
+     * @param {Date} date - The date to check.
+     * @returns {boolean} Whether the date is in the list.
+     */
     isDateInList(dates, date) {
         return dates.some(d => isSameDay(d, date));
     }
@@ -205,7 +210,7 @@ export class CuraCalendar {
      */
     selectMultiplesDate(date) {
         if (!this.isDateSelected(date) || !this.isDateInDefaultSelection(date))
-            return this.selectedDates = [...this.selectedDates, date];
+            return (this.selectedDates = [...this.selectedDates, date]);
         this.selectedDates = this.removeDateFromSelection(this.selectedDates, date);
         this.defaultDates = this.removeDateFromSelection(this.defaultDates, date);
     }
@@ -240,16 +245,16 @@ export class CuraCalendar {
         const selectionHandlers = {
             single: this.selectSingleDate.bind(this),
             multiple: this.selectMultiplesDate.bind(this),
-            range: this.selectDateRange.bind(this)
+            range: this.selectDateRange.bind(this),
         };
         selectionHandlers[this.mode](date);
         this.onchangeday.emit({ days: [...this.defaultDates, ...this.selectedDates].filter(d => this.isDateInValidPeriod(d)) });
     }
     /**
-    * Get the days of the week.
-    *
-    * @returns {string[]} An array of abbreviated day names.
-    */
+     * Get the days of the week.
+     *
+     * @returns {string[]} An array of abbreviated day names.
+     */
     fetchWeekDays() {
         const start = startOfWeek(new Date(2021, 0, 3), { locale: this.determineLocale() });
         const end = endOfWeek(new Date(2021, 0, 3), { locale: this.determineLocale() });
@@ -265,7 +270,7 @@ export class CuraCalendar {
             this.fetchDaysOfWeek();
         }
         else
-            (this.fetchDaysOfMonth());
+            this.fetchDaysOfMonth();
         this.collapsed = false;
     }
     showColapsedCalendar() {
@@ -297,20 +302,16 @@ export class CuraCalendar {
         const prevMonthEnd = endOfMonth(prevMonthStart);
         const daysInPrevMonth = eachDayOfInterval({
             start: subDays(prevMonthEnd, getDay(start)),
-            end: prevMonthEnd
+            end: prevMonthEnd,
         });
         const nextMonthStart = startOfMonth(addMonths(end, 1));
         const nextMonthEnd = endOfMonth(nextMonthStart);
         const remainingDays = WEEKS_IN_CALENDAR_VIEW - getDay(end);
         const daysInNextMonth = eachDayOfInterval({
             start: nextMonthStart,
-            end: addDays(nextMonthEnd, remainingDays)
+            end: addDays(nextMonthEnd, remainingDays),
         });
-        const totalDays = [
-            ...daysInPrevMonth.slice(-getDay(start)),
-            ...daysIncurrentDate,
-            ...daysInNextMonth
-        ];
+        const totalDays = [...daysInPrevMonth.slice(-getDay(start)), ...daysIncurrentDate, ...daysInNextMonth];
         return totalDays.slice(0, DAYS_IN_CALENDAR_VIEW);
     }
     /**
@@ -323,7 +324,7 @@ export class CuraCalendar {
         const locale = this.determineLocale();
         const months = eachMonthOfInterval({
             start: startOfYear(new Date(currentYear, 0, 1)),
-            end: new Date(currentYear, 11, 31)
+            end: new Date(currentYear, 11, 31),
         }).map(month => format(month, 'MMMM', { locale }));
         const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
         return {
@@ -340,20 +341,20 @@ export class CuraCalendar {
         return Array.from({ length: 100 }, (_, i) => currentYear - i);
     }
     /**
-    * Get the color for the previous button.
-    *
-    * @returns {string} The color name for the previous button.
-    */
+     * Get the color for the previous button.
+     *
+     * @returns {string} The color name for the previous button.
+     */
     determinePrevButtonColor() {
         const isPrevDisabled = isBefore(new Date(getYear(this.currentDate), getMonth(this.currentDate) - 1, 1), startOfMonth(new Date()));
         return isPrevDisabled && 'primary-base';
     }
     /**
-    * Get the status of a given date, determining its position and interval status.
-    *
-    * @param {Date | null} date - The date to evaluate.
-    * @returns {Object} An object containing the status flags for the date.
-    */
+     * Get the status of a given date, determining its position and interval status.
+     *
+     * @param {Date | null} date - The date to evaluate.
+     * @returns {Object} An object containing the status flags for the date.
+     */
     getDateStatus(date) {
         const [startSelected, endSelected] = [this.selectedDates[0], this.selectedDates[this.selectedDates.length - 1]];
         const [startDefault, endDefault] = [this.defaultDates[0], this.defaultDates[this.defaultDates.length - 1]];
@@ -383,7 +384,7 @@ export class CuraCalendar {
             isSelected,
             isRange,
             isDefault,
-            isInterval
+            isInterval,
         };
     }
     /**
@@ -393,7 +394,7 @@ export class CuraCalendar {
      * @returns {Object} An object containing the CSS classes for the date.
      */
     getClasses(date) {
-        const classes = { 'date': true };
+        const classes = { date: true };
         if (date === null)
             return classes;
         const dateStatus = this.getDateStatus(date);
@@ -418,11 +419,14 @@ export class CuraCalendar {
             '--width': this.width,
         };
     }
+    watchDefaultDatesArray() {
+        this.selectedDates = this.customDates;
+    }
     render() {
         const { months } = this.fetchMonthNames();
-        return (h(Host, { key: '49e48240bb1da756c8d4ee8dff554a24b1da8038', style: this.getHostCSSProperties() }, h("div", { key: 'bfa7c4b9362c6a9b3c35639ebb720a3fd2601fa4', class: "calendar", style: this.styles }, h("header", { key: 'aa6803cb2bf8b6f7b58cdd9796921aadfc40abca', class: "header" }, h("div", { key: 'efa9f7c0598677defca5f31220e3b1f0dbc16037', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '759a409d176a47c44be9615bf342d8a6d296ded6', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (h("div", { class: "select" }, h("cura-select", { class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: (e) => this.onMonthDropdownChange(e) }, months.map((month, index) => (h("cura-select-option", { key: index, value: month }, month)))), h("cura-select", { class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: (e) => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), h("cura-icon", { key: '650919445aa94fd26b9605da79dbaa1950652c0d', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: '3934dec68753250503976b462b6589327b7be613', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: 'bold', key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), h("div", { key: '47e46d363c972877b97889c3c5756c14d42046de', class: "dates" }, !this.collapsed ?
-            this.fetchDaysOfMonth().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : ''))) :
-            this.fetchDaysOfWeek().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (h("div", { class: 'collapsed-container' }, h("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: 'small', color: 'primary', fontColor: 'dark', iconName: 'plusCircle' }, "Veja mais datas"))) : (h("div", { class: 'collapsed-container' }, h("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: 'small', color: 'primary', fontColor: 'dark', iconName: 'minusCircle' }, "Veja menos datas")))) : null)));
+        return (h(Host, { key: '3c3a06e4eee0a100a0a9e1eab8d42d839a1cb945', style: this.getHostCSSProperties() }, h("div", { key: 'b82154d8bb381b3452c90e26e2cbae69db670add', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, h("header", { key: '0c9a5ce68444d2ae931aff60efeb20c52172b2cf', class: "header" }, h("div", { key: '68e6c5e716ea1919f423950a22341721d0094d8c', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '54f6799b4d54bed92a671dc75045c52076d3adab', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (h("div", { class: "select" }, h("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (h("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), h("cura-select", { size: "small", class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: e => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), h("cura-icon", { key: '66f0f20be96bc0517fb88c284435eda3f85e5227', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: '5df4ad92b85833a2284830cd69418e9c740fd0f6', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), h("div", { key: 'c94c9a2eae554149126f729953245b27a6f82a86', class: "dates" }, !this.collapsed
+            ? this.fetchDaysOfMonth().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))
+            : this.fetchDaysOfWeek().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (h("div", { class: "collapsed-container" }, h("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "plusCircle" }, "Veja mais datas"))) : (h("div", { class: "collapsed-container" }, h("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "minusCircle" }, "Veja menos datas")))) : null)));
     }
     static get is() { return "cura-calendar"; }
     static get encapsulation() { return "shadow"; }
@@ -487,7 +491,7 @@ export class CuraCalendar {
                 },
                 "attribute": "width",
                 "reflect": true,
-                "defaultValue": "'280px'"
+                "defaultValue": "'268px'"
             },
             "mode": {
                 "type": "string",
@@ -651,6 +655,33 @@ export class CuraCalendar {
                 },
                 "defaultValue": "[]"
             },
+            "customDates": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Date[]",
+                    "resolved": "Date[]",
+                    "references": {
+                        "Date": {
+                            "location": "global",
+                            "id": "global::Date"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "type",
+                            "text": "{Date[]}"
+                        }, {
+                            "name": "default",
+                            "text": "[]"
+                        }],
+                    "text": "Array of dates chosen by the user, can be updated dynamically."
+                },
+                "defaultValue": "[]"
+            },
             "limitRange": {
                 "type": "number",
                 "mutable": false,
@@ -690,8 +721,24 @@ export class CuraCalendar {
                     "text": ""
                 },
                 "attribute": "disable-pass-dates",
-                "reflect": true,
-                "defaultValue": "false"
+                "reflect": true
+            },
+            "disableFutureDates": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "disable-future-dates",
+                "reflect": true
             },
             "collapsed": {
                 "type": "boolean",
@@ -710,6 +757,40 @@ export class CuraCalendar {
                 "attribute": "collapsed",
                 "reflect": true,
                 "defaultValue": "null"
+            },
+            "floating": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "floating",
+                "reflect": true
+            },
+            "embedded": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "embedded",
+                "reflect": true
             }
         };
     }
@@ -753,5 +834,11 @@ export class CuraCalendar {
                 }
             }];
     }
+    static get watchers() {
+        return [{
+                "propName": "customDates",
+                "methodName": "watchDefaultDatesArray"
+            }];
+    }
 }
 //# sourceMappingURL=cura-calendar.js.map