@tylertech/forge 3.8.1 → 3.9.0-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/README.md +23 -0
  2. package/custom-elements.json +1263 -876
  3. package/dist/lib.js +18 -18
  4. package/dist/lib.js.map +3 -3
  5. package/dist/toolbar/forge-toolbar.css +1 -0
  6. package/dist/vscode.css-custom-data.json +37 -37
  7. package/dist/vscode.html-custom-data.json +138 -78
  8. package/esm/calendar/calendar-adapter.d.ts +24 -0
  9. package/esm/calendar/calendar-adapter.js +67 -1
  10. package/esm/calendar/calendar-constants.d.ts +34 -0
  11. package/esm/calendar/calendar-constants.js +33 -0
  12. package/esm/calendar/calendar-core.d.ts +60 -0
  13. package/esm/calendar/calendar-core.js +220 -2
  14. package/esm/calendar/calendar-dom-utils.d.ts +6 -0
  15. package/esm/calendar/calendar-dom-utils.js +36 -0
  16. package/esm/calendar/calendar.d.ts +40 -1
  17. package/esm/calendar/calendar.js +80 -2
  18. package/esm/calendar/core/calendar-base.d.ts +3 -0
  19. package/esm/calendar/core/date-range.d.ts +2 -0
  20. package/esm/calendar/core/date-range.js +1 -0
  21. package/esm/date-picker/base/base-date-picker-constants.d.ts +3 -0
  22. package/esm/date-picker/base/base-date-picker-constants.js +3 -0
  23. package/esm/date-picker/base/base-date-picker-core.d.ts +15 -0
  24. package/esm/date-picker/base/base-date-picker-core.js +30 -0
  25. package/esm/date-picker/base/base-date-picker.d.ts +12 -0
  26. package/esm/date-picker/base/base-date-picker.js +24 -0
  27. package/esm/date-picker/date-picker-core.d.ts +3 -0
  28. package/esm/date-picker/date-picker-core.js +20 -0
  29. package/esm/date-range-picker/date-range-picker-constants.d.ts +3 -0
  30. package/esm/date-range-picker/date-range-picker-constants.js +1 -0
  31. package/esm/date-range-picker/date-range-picker-core.d.ts +3 -0
  32. package/esm/date-range-picker/date-range-picker-core.js +62 -2
  33. package/esm/date-range-picker/date-range-picker.d.ts +3 -0
  34. package/esm/date-range-picker/date-range-picker.js +3 -0
  35. package/esm/split-view/split-view-panel/split-view-panel.js +1 -1
  36. package/esm/toolbar/toolbar.js +1 -1
  37. package/package.json +2 -2
  38. package/sass/calendar/_mixins.scss +3 -2
  39. package/sass/toolbar/_core.scss +5 -0
  40. package/sass/toolbar/toolbar.scss +4 -0
@@ -17,11 +17,20 @@ export interface ICalendarComponent extends ICalendarBase, IBaseComponent {
17
17
  menuAnimation: CalendarMenuAnimationType;
18
18
  clearButton: boolean;
19
19
  todayButton: boolean;
20
+ yesterdayButton: boolean;
21
+ lastSevenDaysButton: boolean;
22
+ lastThirtyDaysButton: boolean;
20
23
  clearCallback: (() => void) | undefined;
21
24
  todayCallback: (() => void) | undefined;
25
+ yesterdayCallback: (() => void) | undefined;
26
+ lastSevenDaysCallback: (() => void) | undefined;
27
+ lastThirtyDaysCallback: (() => void) | undefined;
22
28
  tooltipBuilder: CalendarTooltipBuilder | undefined;
23
29
  clear(): void;
24
30
  today(): void;
31
+ yesterday(): void;
32
+ lastSevenDays(): void;
33
+ lastThirtyDays(): void;
25
34
  selectDate(date: Date, setFocus?: boolean): void;
26
35
  deselectDate(date: Date): void;
27
36
  toggleDate(date: Date, force?: boolean): void;
@@ -74,6 +83,15 @@ declare global {
74
83
  * @property {boolean} [showToday=true] - Whether to show the today button.
75
84
  * @property {boolean} [todayButton=false] - Whether to show a button to select today.
76
85
  * @property {() => void | undefined} todayCallback - Callback function to call when the today button is clicked.
86
+ * @property {boolean} [showYesterday=true] - Whether to show the yesterday button.
87
+ * @property {boolean} [yesterdayButton=false] - Whether to show a button to select yesterday.
88
+ * @property {() => void | undefined} yesterdayCallback - Callback function to call when the yesterday button is clicked.
89
+ * @property {boolean} [showLastSevenDays=true] - Whether to show the last seven days button.
90
+ * @property {boolean} [lastSevenDaysButton=false] - Whether to show a button to select last seven days.
91
+ * @property {() => void | undefined} lastSevenDaysCallback - Callback function to call when the last seven days button is clicked.
92
+ * @property {boolean} [showLastThirtyDays=true] - Whether to show the last thirty days button.
93
+ * @property {boolean} [lastThirtyDaysButton=false] - Whether to show a button to select last thirty days.
94
+ * @property {() => void | undefined} lastThirtyDaysCallback - Callback function to call when the last thirty days button is clicked.
77
95
  * @property {CalendarTooltipBuilder | undefined} tooltipBuilder - Function to build the tooltip content.
78
96
  * @property {Date | Date[] | DateRange | null | undefined} [value=[]] - The selected date(s).
79
97
  * @property {CalendarView} [view="date"] - The view of the calendar.
@@ -99,7 +117,13 @@ declare global {
99
117
  * @attribute {boolean} [show-header=true] - Whether to show the header.
100
118
  * @attribute {boolean} [show-other-months=false] - Whether to show days from other months.
101
119
  * @attribute {boolean} [show-today=true] - Whether to show the today button.
102
- * @attribute {boolean} [today-button=fakse] - Whether to show a button to select today.
120
+ * @attribute {boolean} [today-button=false] - Whether to show a button to select today.
121
+ * @attribute {boolean} [show-yesterday=true] - Whether to show the yesterday button.
122
+ * @attribute {boolean} [yesterday-button=false] - Whether to show a button to select yesterday.
123
+ * @attribute {boolean} [show-last-seven-days=true] - Whether to show the last seven days button.
124
+ * @attribute {boolean} [last-seven-days-button=false] - Whether to show a button to select last seven days.
125
+ * @attribute {boolean} [show-last-thirty-days=true] - Whether to show the last thirty days button.
126
+ * @attribute {boolean} [last-thirty-days-button=false] - Whether to show a button to select last thirty days.
103
127
  * @attribute {CalendarView} [view="date"] - The view of the calendar.
104
128
  * @attribute {number} [year=<current year>] - The year to display.
105
129
  * @attribute {string} [year-range="-50:+50"] - The range of years to display.
@@ -110,6 +134,9 @@ declare global {
110
134
  * @fires {CustomEvent<CalendarView>} forge-calendar-view-change - Event fired when the view changes.
111
135
  *
112
136
  * @slot today-button-text - Text to display in the today button.
137
+ * @slot yesterday-button-text - Text to display in the yesterday button.
138
+ * @slot last-seven-days-button-text - Text to display in the last seven days button.
139
+ * @slot last-thirty-days-button-text - Text to display in the last thirty days button.
113
140
  * @slot clear-button-text - Text to display in the clear button.
114
141
  * @slot next-month-button-text - Text to display in the next month button's tooltip.
115
142
  * @slot previous-month-button-text - Text to display in the previous month button's tooltip.
@@ -156,6 +183,15 @@ export declare class CalendarComponent extends BaseComponent implements ICalenda
156
183
  showToday: boolean;
157
184
  todayButton: boolean;
158
185
  todayCallback: (() => void) | undefined;
186
+ showYesterday: boolean;
187
+ yesterdayButton: boolean;
188
+ yesterdayCallback: (() => void) | undefined;
189
+ showLastSevenDays: boolean;
190
+ lastSevenDaysButton: boolean;
191
+ lastSevenDaysCallback: (() => void) | undefined;
192
+ showLastThirtyDays: boolean;
193
+ lastThirtyDaysButton: boolean;
194
+ lastThirtyDaysCallback: (() => void) | undefined;
159
195
  tooltipBuilder: CalendarTooltipBuilder | undefined;
160
196
  value: Date | Date[] | DateRange | null | undefined;
161
197
  view: CalendarView;
@@ -194,6 +230,9 @@ export declare class CalendarComponent extends BaseComponent implements ICalenda
194
230
  * Sets the calendar to today.
195
231
  */
196
232
  today(): void;
233
+ yesterday(): void;
234
+ lastSevenDays(): void;
235
+ lastThirtyDays(): void;
197
236
  /**
198
237
  * Toggles a date selection.
199
238
  */
@@ -18,7 +18,7 @@ import { StateLayerComponent } from '../state-layer';
18
18
  import { FocusIndicatorComponent } from '../focus-indicator';
19
19
  import { BaseComponent } from '../core/base/base-component';
20
20
  const template = '<template><div class=\"forge-calendar\" part=\"root\"><div id=\"view\" class=\"forge-calendar__view\" part=\"view\"><div id=\"date-view\" class=\"forge-calendar__date-view\" role=\"grid\" part=\"date-view\"><div role=\"rowgroup\" part=\"date-view-container\"><div id=\"day-row\" class=\"forge-calendar__date-view__row\" role=\"row\" part=\"date-view-row\"></div></div><div id=\"date-grid\" class=\"forge-calendar__date-grid\" role=\"rowgroup\" part=\"date-grid-container\"></div></div><forge-calendar-menu id=\"menu\" part=\"calendar-menu\"></forge-calendar-menu></div></div></template>';
21
- const styles = '.forge-calendar{width:var(--forge-calendar-width,100%);height:fit-content;position:relative}.forge-calendar__header{padding:var(--forge-calendar-controls-padding,0);display:flex;align-items:center;justify-content:space-between}.forge-calendar__footer{padding:var(--forge-calendar-controls-padding,0);display:flex;align-items:center;justify-content:space-between}.forge-calendar__view{position:relative}.forge-calendar__date-view{display:block}.forge-calendar__date-view__row{display:grid;grid-template-columns:repeat(7,1fr)}.forge-calendar__date-grid{display:grid}.forge-calendar__day{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label2-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .8125)));font-weight:var(--forge-typography-label2-font-weight,400);line-height:var(--forge-typography-label2-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label2-letter-spacing, .0096153846em);text-transform:var(--forge-typography-label2-text-transform,inherit);text-decoration:var(--forge-typography-label2-text-decoration,inherit);display:flex;justify-content:center;align-items:center;min-width:0;padding:0;font-weight:700;user-select:none}.forge-calendar__day::after{float:left;padding-top:100%;content:\"\"}.forge-calendar__date{margin-top:var(--forge-calendar-row-gap,2px);min-width:0;padding:0;border-radius:50%;position:relative;outline:0;cursor:default;user-select:none}.forge-calendar__date::after{float:left;padding-top:100%;content:\"\"}.forge-calendar__date forge-focus-indicator{--forge-focus-indicator-shape:50%}.forge-calendar__date__inner{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, .875)));font-weight:var(--forge-typography-body1-font-weight,400);line-height:var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));letter-spacing:var(--forge-typography-body1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-body1-text-transform,inherit);text-decoration:var(--forge-typography-body1-text-decoration,inherit);position:absolute;width:calc(100% - 2px);height:calc(100% - 2px);top:calc(2px / 2);left:calc(2px / 2);display:flex;justify-content:center;align-items:center;border-radius:inherit;box-sizing:border-box}.forge-calendar--show-today .forge-calendar__date--today:not([disabled]){color:var(--forge-theme-primary,#3f51b5);border-color:var(--forge-theme-primary,#3f51b5)}.forge-calendar--show-today .forge-calendar__date--today .forge-calendar__date__inner{border-color:inherit;border-width:1px;border-style:solid;font-weight:700}.forge-calendar--show-today .forge-calendar__date--today.forge-calendar__date--selected{color:var(--forge-theme-on-primary,#fff)}.forge-calendar:not(.forge-calendar--readonly) .forge-calendar__date:not([disabled]){cursor:pointer}.forge-calendar__date--selected:not([disabled]) .forge-calendar__date__inner{background-color:var(--forge-theme-primary,#3f51b5);color:var(--forge-theme-on-primary,#fff)}.forge-calendar__date--selected[disabled] .forge-calendar__date__inner{background-color:var(--forge-theme-primary-container-minimum,#f7f8fc);color:var(--forge-theme-text-low,rgba(0,0,0,.38))}.forge-calendar__date--selected forge-focus-indicator{--forge-focus-indicator-color:var(--forge-theme-primary-container)}.forge-calendar__date[disabled]{color:var(--forge-theme-text-low,rgba(0,0,0,.38))}.forge-calendar__date-spacer{pointer-events:none}.forge-calendar--fixed-height .forge-calendar__date-spacer{margin-top:var(--forge-calendar-row-gap,2px)}.forge-calendar--fixed-height .forge-calendar__date-spacer::after{float:left;padding-top:100%;content:\"\"}.forge-calendar__range:not(.forge-calendar__date-spacer) .forge-calendar__range__target{background-color:var(--forge-theme-primary,#3f51b5);position:absolute;width:100%;height:100%;opacity:.14;border-radius:0}.forge-calendar__range:not(.forge-calendar__date-spacer).forge-calendar__range--start .forge-calendar__range__target{border-top-left-radius:50%;border-bottom-left-radius:50%}.forge-calendar__range:not(.forge-calendar__date-spacer).forge-calendar__range--end .forge-calendar__range__target{border-top-right-radius:50%;border-bottom-right-radius:50%}.forge-calendar__range:not(.forge-calendar__range--start):first-of-type .forge-calendar__range__target{border-top-left-radius:4px;border-bottom-left-radius:4px}.forge-calendar__range:not(.forge-calendar__range--end):last-of-type .forge-calendar__range__target{border-top-right-radius:4px;border-bottom-right-radius:4px}.forge-calendar--allow-single-date-range .forge-calendar__range--start.forge-calendar__range--end .forge-calendar__range__target{transition:transform .2s;transform:scale(1.15);transform-origin:center}.forge-calendar__event{font-size:var(--forge-calendar-event-dot-size, 12px)}.forge-calendar__event[data-event-theme=primary]{color:var(--forge-calendar-theme-event-primary-accent,#3f51b5)}.forge-calendar__event[data-event-theme=secondary]{color:var(--forge-calendar-theme-event-secondary-accent,#ffc107)}.forge-calendar__event[data-event-theme=blue]{color:var(--forge-calendar-theme-event-blue-accent,#2196f3)}.forge-calendar__event[data-event-theme=light-green]{color:var(--forge-calendar-theme-event-light-green-accent,#8bc34a)}.forge-calendar__event[data-event-theme=cyan]{color:var(--forge-calendar-theme-event-cyan-accent,#00bcd4)}.forge-calendar__event[data-event-theme=teal]{color:var(--forge-calendar-theme-event-teal-accent,#009688)}.forge-calendar__event[data-event-theme=orange]{color:var(--forge-calendar-theme-event-orange-accent,#ff9800)}.forge-calendar__event[data-event-theme=blue-grey]{color:var(--forge-calendar-theme-event-blue-grey-accent,#607d8b)}.forge-calendar__event[data-event-theme=grey]{color:var(--forge-calendar-theme-event-grey-accent,#9e9e9e)}.forge-calendar__event[data-event-theme=red]{color:var(--forge-calendar-theme-event-red-accent,#f44336)}.forge-calendar__event[data-event-theme=pink]{color:var(--forge-calendar-theme-event-pink-accent,#e91e63)}.forge-calendar__event[data-event-theme=purple]{color:var(--forge-calendar-theme-event-purple-accent,#9c27b0)}.forge-calendar__event[data-event-theme=light-blue]{color:var(--forge-calendar-theme-event-light-blue-accent,#03a9f4)}.forge-calendar__event[data-event-theme=deep-purple]{color:var(--forge-calendar-theme-event-deep-purple-accent,#673ab7)}.forge-calendar__event[data-event-theme=green]{color:var(--forge-calendar-theme-event-green-accent,#4caf50)}.forge-calendar__event[data-event-theme=lime]{color:var(--forge-calendar-theme-event-lime-accent,#cddc39)}.forge-calendar__event[data-event-theme=yellow]{color:var(--forge-calendar-theme-event-yellow-accent,#ffeb3b)}.forge-calendar__event[data-event-theme=brown]{color:var(--forge-calendar-theme-event-brown-accent,#795548)}.forge-calendar__event[data-event-theme=deep-orange]{color:var(--forge-calendar-theme-event-deep-orange-accent,#ff5722)}.forge-calendar__date[disabled] .forge-calendar__event{opacity:.14}.forge-calendar__event--overflow{background-color:var(--forge-theme-surface,#fff);color:var(--forge-theme-on-surface,#000);border-radius:50%}.forge-calendar__event__wrapper{display:flex;justify-content:center;gap:2px;position:absolute;bottom:0;left:0;width:100%;padding-bottom:2px;pointer-events:none}.forge-calendar__date-spacer .forge-calendar__event__wrapper{display:none}.forge-calendar--rtl .forge-calendar__header forge-icon-button forge-icon{transform:rotate(180deg)}#accessible-header{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:fixed;width:1px;outline:0;-webkit-appearance:none;-moz-appearance:none}#month-button forge-icon{transition:transform .2s}.forge-calendar--month-menu-open #month-button forge-icon{transform:rotate(180deg)}#year-button forge-icon{transition:transform .2s}.forge-calendar--year-menu-open #year-button forge-icon{transform:rotate(180deg)}:host{--forge-calendar-event-stroke-color:var(--forge-theme-surface, #ffffff);display:inline-block}:host([hidden]){display:none}:host([forge-popover-context=true]){--forge-calendar-event-stroke-color:var(--forge-theme-surface-bright, #ffffff)}';
21
+ const styles = '.forge-calendar{width:var(--forge-calendar-width,100%);height:fit-content;position:relative}.forge-calendar__header{padding:var(--forge-calendar-controls-padding,0);display:flex;align-items:center;justify-content:space-between}.forge-calendar__footer{padding:var(--forge-calendar-controls-padding,0);display:grid;grid-template-columns:33% 33% 33%;grid-auto-flow:row;justify-content:space-between}.forge-calendar__view{position:relative}.forge-calendar__date-view{display:block}.forge-calendar__date-view__row{display:grid;grid-template-columns:repeat(7,1fr)}.forge-calendar__date-grid{display:grid}.forge-calendar__day{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label2-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .8125)));font-weight:var(--forge-typography-label2-font-weight,400);line-height:var(--forge-typography-label2-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label2-letter-spacing, .0096153846em);text-transform:var(--forge-typography-label2-text-transform,inherit);text-decoration:var(--forge-typography-label2-text-decoration,inherit);display:flex;justify-content:center;align-items:center;min-width:0;padding:0;font-weight:700;user-select:none}.forge-calendar__day::after{float:left;padding-top:100%;content:\"\"}.forge-calendar__date{margin-top:var(--forge-calendar-row-gap,2px);min-width:0;padding:0;border-radius:50%;position:relative;outline:0;cursor:default;user-select:none}.forge-calendar__date::after{float:left;padding-top:100%;content:\"\"}.forge-calendar__date forge-focus-indicator{--forge-focus-indicator-shape:50%}.forge-calendar__date__inner{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, .875)));font-weight:var(--forge-typography-body1-font-weight,400);line-height:var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));letter-spacing:var(--forge-typography-body1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-body1-text-transform,inherit);text-decoration:var(--forge-typography-body1-text-decoration,inherit);position:absolute;width:calc(100% - 2px);height:calc(100% - 2px);top:calc(2px / 2);left:calc(2px / 2);display:flex;justify-content:center;align-items:center;border-radius:inherit;box-sizing:border-box}.forge-calendar--show-today .forge-calendar__date--today:not([disabled]){color:var(--forge-theme-primary,#3f51b5);border-color:var(--forge-theme-primary,#3f51b5)}.forge-calendar--show-today .forge-calendar__date--today .forge-calendar__date__inner{border-color:inherit;border-width:1px;border-style:solid;font-weight:700}.forge-calendar--show-today .forge-calendar__date--today.forge-calendar__date--selected{color:var(--forge-theme-on-primary,#fff)}.forge-calendar:not(.forge-calendar--readonly) .forge-calendar__date:not([disabled]){cursor:pointer}.forge-calendar__date--selected:not([disabled]) .forge-calendar__date__inner{background-color:var(--forge-theme-primary,#3f51b5);color:var(--forge-theme-on-primary,#fff)}.forge-calendar__date--selected[disabled] .forge-calendar__date__inner{background-color:var(--forge-theme-primary-container-minimum,#f7f8fc);color:var(--forge-theme-text-low,rgba(0,0,0,.38))}.forge-calendar__date--selected forge-focus-indicator{--forge-focus-indicator-color:var(--forge-theme-primary-container)}.forge-calendar__date[disabled]{color:var(--forge-theme-text-low,rgba(0,0,0,.38))}.forge-calendar__date-spacer{pointer-events:none}.forge-calendar--fixed-height .forge-calendar__date-spacer{margin-top:var(--forge-calendar-row-gap,2px)}.forge-calendar--fixed-height .forge-calendar__date-spacer::after{float:left;padding-top:100%;content:\"\"}.forge-calendar__range:not(.forge-calendar__date-spacer) .forge-calendar__range__target{background-color:var(--forge-theme-primary,#3f51b5);position:absolute;width:100%;height:100%;opacity:.14;border-radius:0}.forge-calendar__range:not(.forge-calendar__date-spacer).forge-calendar__range--start .forge-calendar__range__target{border-top-left-radius:50%;border-bottom-left-radius:50%}.forge-calendar__range:not(.forge-calendar__date-spacer).forge-calendar__range--end .forge-calendar__range__target{border-top-right-radius:50%;border-bottom-right-radius:50%}.forge-calendar__range:not(.forge-calendar__range--start):first-of-type .forge-calendar__range__target{border-top-left-radius:4px;border-bottom-left-radius:4px}.forge-calendar__range:not(.forge-calendar__range--end):last-of-type .forge-calendar__range__target{border-top-right-radius:4px;border-bottom-right-radius:4px}.forge-calendar--allow-single-date-range .forge-calendar__range--start.forge-calendar__range--end .forge-calendar__range__target{transition:transform .2s;transform:scale(1.15);transform-origin:center}.forge-calendar__event{font-size:var(--forge-calendar-event-dot-size, 12px)}.forge-calendar__event[data-event-theme=primary]{color:var(--forge-calendar-theme-event-primary-accent,#3f51b5)}.forge-calendar__event[data-event-theme=secondary]{color:var(--forge-calendar-theme-event-secondary-accent,#ffc107)}.forge-calendar__event[data-event-theme=blue]{color:var(--forge-calendar-theme-event-blue-accent,#2196f3)}.forge-calendar__event[data-event-theme=light-green]{color:var(--forge-calendar-theme-event-light-green-accent,#8bc34a)}.forge-calendar__event[data-event-theme=cyan]{color:var(--forge-calendar-theme-event-cyan-accent,#00bcd4)}.forge-calendar__event[data-event-theme=teal]{color:var(--forge-calendar-theme-event-teal-accent,#009688)}.forge-calendar__event[data-event-theme=orange]{color:var(--forge-calendar-theme-event-orange-accent,#ff9800)}.forge-calendar__event[data-event-theme=blue-grey]{color:var(--forge-calendar-theme-event-blue-grey-accent,#607d8b)}.forge-calendar__event[data-event-theme=grey]{color:var(--forge-calendar-theme-event-grey-accent,#9e9e9e)}.forge-calendar__event[data-event-theme=red]{color:var(--forge-calendar-theme-event-red-accent,#f44336)}.forge-calendar__event[data-event-theme=pink]{color:var(--forge-calendar-theme-event-pink-accent,#e91e63)}.forge-calendar__event[data-event-theme=purple]{color:var(--forge-calendar-theme-event-purple-accent,#9c27b0)}.forge-calendar__event[data-event-theme=light-blue]{color:var(--forge-calendar-theme-event-light-blue-accent,#03a9f4)}.forge-calendar__event[data-event-theme=deep-purple]{color:var(--forge-calendar-theme-event-deep-purple-accent,#673ab7)}.forge-calendar__event[data-event-theme=green]{color:var(--forge-calendar-theme-event-green-accent,#4caf50)}.forge-calendar__event[data-event-theme=lime]{color:var(--forge-calendar-theme-event-lime-accent,#cddc39)}.forge-calendar__event[data-event-theme=yellow]{color:var(--forge-calendar-theme-event-yellow-accent,#ffeb3b)}.forge-calendar__event[data-event-theme=brown]{color:var(--forge-calendar-theme-event-brown-accent,#795548)}.forge-calendar__event[data-event-theme=deep-orange]{color:var(--forge-calendar-theme-event-deep-orange-accent,#ff5722)}.forge-calendar__date[disabled] .forge-calendar__event{opacity:.14}.forge-calendar__event--overflow{background-color:var(--forge-theme-surface,#fff);color:var(--forge-theme-on-surface,#000);border-radius:50%}.forge-calendar__event__wrapper{display:flex;justify-content:center;gap:2px;position:absolute;bottom:0;left:0;width:100%;padding-bottom:2px;pointer-events:none}.forge-calendar__date-spacer .forge-calendar__event__wrapper{display:none}.forge-calendar--rtl .forge-calendar__header forge-icon-button forge-icon{transform:rotate(180deg)}#accessible-header{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:fixed;width:1px;outline:0;-webkit-appearance:none;-moz-appearance:none}#month-button forge-icon{transition:transform .2s}.forge-calendar--month-menu-open #month-button forge-icon{transform:rotate(180deg)}#year-button forge-icon{transition:transform .2s}.forge-calendar--year-menu-open #year-button forge-icon{transform:rotate(180deg)}:host{--forge-calendar-event-stroke-color:var(--forge-theme-surface, #ffffff);display:inline-block}:host([hidden]){display:none}:host([forge-popover-context=true]){--forge-calendar-event-stroke-color:var(--forge-theme-surface-bright, #ffffff)}';
22
22
  /**
23
23
  * @tag forge-calendar
24
24
  *
@@ -52,6 +52,15 @@ const styles = '.forge-calendar{width:var(--forge-calendar-width,100%);height:fi
52
52
  * @property {boolean} [showToday=true] - Whether to show the today button.
53
53
  * @property {boolean} [todayButton=false] - Whether to show a button to select today.
54
54
  * @property {() => void | undefined} todayCallback - Callback function to call when the today button is clicked.
55
+ * @property {boolean} [showYesterday=true] - Whether to show the yesterday button.
56
+ * @property {boolean} [yesterdayButton=false] - Whether to show a button to select yesterday.
57
+ * @property {() => void | undefined} yesterdayCallback - Callback function to call when the yesterday button is clicked.
58
+ * @property {boolean} [showLastSevenDays=true] - Whether to show the last seven days button.
59
+ * @property {boolean} [lastSevenDaysButton=false] - Whether to show a button to select last seven days.
60
+ * @property {() => void | undefined} lastSevenDaysCallback - Callback function to call when the last seven days button is clicked.
61
+ * @property {boolean} [showLastThirtyDays=true] - Whether to show the last thirty days button.
62
+ * @property {boolean} [lastThirtyDaysButton=false] - Whether to show a button to select last thirty days.
63
+ * @property {() => void | undefined} lastThirtyDaysCallback - Callback function to call when the last thirty days button is clicked.
55
64
  * @property {CalendarTooltipBuilder | undefined} tooltipBuilder - Function to build the tooltip content.
56
65
  * @property {Date | Date[] | DateRange | null | undefined} [value=[]] - The selected date(s).
57
66
  * @property {CalendarView} [view="date"] - The view of the calendar.
@@ -77,7 +86,13 @@ const styles = '.forge-calendar{width:var(--forge-calendar-width,100%);height:fi
77
86
  * @attribute {boolean} [show-header=true] - Whether to show the header.
78
87
  * @attribute {boolean} [show-other-months=false] - Whether to show days from other months.
79
88
  * @attribute {boolean} [show-today=true] - Whether to show the today button.
80
- * @attribute {boolean} [today-button=fakse] - Whether to show a button to select today.
89
+ * @attribute {boolean} [today-button=false] - Whether to show a button to select today.
90
+ * @attribute {boolean} [show-yesterday=true] - Whether to show the yesterday button.
91
+ * @attribute {boolean} [yesterday-button=false] - Whether to show a button to select yesterday.
92
+ * @attribute {boolean} [show-last-seven-days=true] - Whether to show the last seven days button.
93
+ * @attribute {boolean} [last-seven-days-button=false] - Whether to show a button to select last seven days.
94
+ * @attribute {boolean} [show-last-thirty-days=true] - Whether to show the last thirty days button.
95
+ * @attribute {boolean} [last-thirty-days-button=false] - Whether to show a button to select last thirty days.
81
96
  * @attribute {CalendarView} [view="date"] - The view of the calendar.
82
97
  * @attribute {number} [year=<current year>] - The year to display.
83
98
  * @attribute {string} [year-range="-50:+50"] - The range of years to display.
@@ -88,6 +103,9 @@ const styles = '.forge-calendar{width:var(--forge-calendar-width,100%);height:fi
88
103
  * @fires {CustomEvent<CalendarView>} forge-calendar-view-change - Event fired when the view changes.
89
104
  *
90
105
  * @slot today-button-text - Text to display in the today button.
106
+ * @slot yesterday-button-text - Text to display in the yesterday button.
107
+ * @slot last-seven-days-button-text - Text to display in the last seven days button.
108
+ * @slot last-thirty-days-button-text - Text to display in the last thirty days button.
91
109
  * @slot clear-button-text - Text to display in the clear button.
92
110
  * @slot next-month-button-text - Text to display in the next month button's tooltip.
93
111
  * @slot previous-month-button-text - Text to display in the previous month button's tooltip.
@@ -118,6 +136,12 @@ let CalendarComponent = class CalendarComponent extends BaseComponent {
118
136
  CALENDAR_CONSTANTS.attributes.SHOW_OTHER_MONTHS,
119
137
  CALENDAR_CONSTANTS.attributes.SHOW_TODAY,
120
138
  CALENDAR_CONSTANTS.attributes.TODAY_BUTTON,
139
+ CALENDAR_CONSTANTS.attributes.SHOW_YESTERDAY,
140
+ CALENDAR_CONSTANTS.attributes.YESTERDAY_BUTTON,
141
+ CALENDAR_CONSTANTS.attributes.SHOW_LAST_SEVEN_DAYS,
142
+ CALENDAR_CONSTANTS.attributes.LAST_SEVEN_DAYS_BUTTON,
143
+ CALENDAR_CONSTANTS.attributes.SHOW_LAST_THIRTY_DAYS,
144
+ CALENDAR_CONSTANTS.attributes.LAST_THIRTY_DAYS_BUTTON,
121
145
  CALENDAR_CONSTANTS.attributes.VIEW,
122
146
  CALENDAR_CONSTANTS.attributes.YEAR,
123
147
  CALENDAR_CONSTANTS.attributes.YEAR_RANGE
@@ -200,6 +224,24 @@ let CalendarComponent = class CalendarComponent extends BaseComponent {
200
224
  case CALENDAR_CONSTANTS.attributes.TODAY_BUTTON:
201
225
  this.todayButton = coerceBoolean(newValue);
202
226
  break;
227
+ case CALENDAR_CONSTANTS.attributes.SHOW_YESTERDAY:
228
+ this.showYesterday = coerceBoolean(newValue);
229
+ break;
230
+ case CALENDAR_CONSTANTS.attributes.YESTERDAY_BUTTON:
231
+ this.yesterdayButton = coerceBoolean(newValue);
232
+ break;
233
+ case CALENDAR_CONSTANTS.attributes.SHOW_LAST_SEVEN_DAYS:
234
+ this.showLastSevenDays = coerceBoolean(newValue);
235
+ break;
236
+ case CALENDAR_CONSTANTS.attributes.LAST_SEVEN_DAYS_BUTTON:
237
+ this.lastSevenDaysButton = coerceBoolean(newValue);
238
+ break;
239
+ case CALENDAR_CONSTANTS.attributes.SHOW_LAST_THIRTY_DAYS:
240
+ this.showLastThirtyDays = coerceBoolean(newValue);
241
+ break;
242
+ case CALENDAR_CONSTANTS.attributes.LAST_THIRTY_DAYS_BUTTON:
243
+ this.lastThirtyDaysButton = coerceBoolean(newValue);
244
+ break;
203
245
  case CALENDAR_CONSTANTS.attributes.VIEW:
204
246
  this.view = newValue;
205
247
  break;
@@ -259,6 +301,15 @@ let CalendarComponent = class CalendarComponent extends BaseComponent {
259
301
  today() {
260
302
  this._core.today();
261
303
  }
304
+ yesterday() {
305
+ this._core.yesterday();
306
+ }
307
+ lastSevenDays() {
308
+ this._core.lastSevenDays();
309
+ }
310
+ lastThirtyDays() {
311
+ this._core.lastThirtyDays();
312
+ }
262
313
  /**
263
314
  * Toggles a date selection.
264
315
  */
@@ -356,6 +407,33 @@ __decorate([
356
407
  __decorate([
357
408
  coreProperty()
358
409
  ], CalendarComponent.prototype, "todayCallback", void 0);
410
+ __decorate([
411
+ coreProperty()
412
+ ], CalendarComponent.prototype, "showYesterday", void 0);
413
+ __decorate([
414
+ coreProperty()
415
+ ], CalendarComponent.prototype, "yesterdayButton", void 0);
416
+ __decorate([
417
+ coreProperty()
418
+ ], CalendarComponent.prototype, "yesterdayCallback", void 0);
419
+ __decorate([
420
+ coreProperty()
421
+ ], CalendarComponent.prototype, "showLastSevenDays", void 0);
422
+ __decorate([
423
+ coreProperty()
424
+ ], CalendarComponent.prototype, "lastSevenDaysButton", void 0);
425
+ __decorate([
426
+ coreProperty()
427
+ ], CalendarComponent.prototype, "lastSevenDaysCallback", void 0);
428
+ __decorate([
429
+ coreProperty()
430
+ ], CalendarComponent.prototype, "showLastThirtyDays", void 0);
431
+ __decorate([
432
+ coreProperty()
433
+ ], CalendarComponent.prototype, "lastThirtyDaysButton", void 0);
434
+ __decorate([
435
+ coreProperty()
436
+ ], CalendarComponent.prototype, "lastThirtyDaysCallback", void 0);
359
437
  __decorate([
360
438
  coreProperty()
361
439
  ], CalendarComponent.prototype, "tooltipBuilder", void 0);
@@ -22,6 +22,9 @@ export interface ICalendarBase {
22
22
  readonly: boolean;
23
23
  showOtherMonths: boolean;
24
24
  showToday: boolean;
25
+ showYesterday: boolean;
26
+ showLastSevenDays: boolean;
27
+ showLastThirtyDays: boolean;
25
28
  value: Date | Date[] | DateRange | null | undefined;
26
29
  weekendDays: DayOfWeek[] | null | undefined;
27
30
  year: number;
@@ -6,10 +6,12 @@
6
6
  export interface IDateRange {
7
7
  from?: Date;
8
8
  to?: Date;
9
+ rangeName?: string;
9
10
  }
10
11
  export declare class DateRange implements IDateRange {
11
12
  from?: Date;
12
13
  to?: Date;
14
+ rangeName?: string;
13
15
  constructor(range?: IDateRange | null);
14
16
  copy(): DateRange;
15
17
  }
@@ -8,6 +8,7 @@ export class DateRange {
8
8
  if (range) {
9
9
  this.from = range.from ? new Date(range.from) : undefined;
10
10
  this.to = range.to ? new Date(range.to) : undefined;
11
+ this.rangeName = range.rangeName ? range.rangeName : undefined;
11
12
  }
12
13
  }
13
14
  copy() {
@@ -48,6 +48,9 @@ export declare const BASE_DATE_PICKER_CONSTANTS: {
48
48
  VALUE_MODE: string;
49
49
  ALLOW_INVALID_DATE: string;
50
50
  SHOW_TODAY: string;
51
+ SHOW_YESTERDAY: string;
52
+ SHOW_LAST_SEVEN_DAYS: string;
53
+ SHOW_LAST_THIRTY_DAYS: string;
51
54
  SHOW_CLEAR: string;
52
55
  DISABLED_DAYS_OF_WEEK: string;
53
56
  YEAR_RANGE: string;
@@ -15,6 +15,9 @@ const observedAttributes = {
15
15
  VALUE_MODE: 'value-mode',
16
16
  ALLOW_INVALID_DATE: 'allow-invalid-date',
17
17
  SHOW_TODAY: 'show-today',
18
+ SHOW_YESTERDAY: 'show-yesterday',
19
+ SHOW_LAST_SEVEN_DAYS: 'show-last-seven-days',
20
+ SHOW_LAST_THIRTY_DAYS: 'show-last-thirty-days',
18
21
  SHOW_CLEAR: 'show-clear',
19
22
  DISABLED_DAYS_OF_WEEK: 'disabled-days-of-week',
20
23
  YEAR_RANGE: 'year-range',
@@ -49,6 +49,9 @@ export declare abstract class BaseDatePickerCore<TAdapter extends IBaseDatePicke
49
49
  protected _notifyInputValueChanges: boolean;
50
50
  protected _allowInvalidDate: boolean;
51
51
  protected _showToday: boolean;
52
+ protected _showYesterday: boolean;
53
+ protected _showLastSevenDays: boolean;
54
+ protected _showLastThirtyDays: boolean;
52
55
  protected _showClear: boolean;
53
56
  protected _disabledDaysOfWeek: DayOfWeek[];
54
57
  protected _yearRange: string;
@@ -64,6 +67,9 @@ export declare abstract class BaseDatePickerCore<TAdapter extends IBaseDatePicke
64
67
  private _dropdownCloseListener;
65
68
  private _activeChangeListener;
66
69
  private _todayListener;
70
+ private _yesterdayListener;
71
+ private _lastSevenDaysListener;
72
+ private _lastThirtyDaysListener;
67
73
  private _clearListener;
68
74
  private _dateSelectListener;
69
75
  private _monthChangeListener;
@@ -74,6 +80,9 @@ export declare abstract class BaseDatePickerCore<TAdapter extends IBaseDatePicke
74
80
  protected abstract _emitOpenEvent(): void;
75
81
  protected abstract _emitCloseEvent(): void;
76
82
  protected abstract _onToday(): void;
83
+ protected abstract _onYesterday(): void;
84
+ protected abstract _onLastSevenDays(): void;
85
+ protected abstract _onLastThirtyDays(): void;
77
86
  protected abstract _onClear(): void;
78
87
  protected abstract _getCurrentValue(): TPrivateValue | null | undefined;
79
88
  protected abstract _setFormattedInputValue(suppressValueChanges?: boolean): void;
@@ -149,6 +158,12 @@ export declare abstract class BaseDatePickerCore<TAdapter extends IBaseDatePicke
149
158
  set prepareMaskCallback(cb: DatePickerPrepareMaskCallback);
150
159
  get showToday(): boolean;
151
160
  set showToday(value: boolean);
161
+ get showYesterday(): boolean;
162
+ set showYesterday(value: boolean);
163
+ get showLastSevenDays(): boolean;
164
+ set showLastSevenDays(value: boolean);
165
+ get showLastThirtyDays(): boolean;
166
+ set showLastThirtyDays(value: boolean);
152
167
  get showClear(): boolean;
153
168
  set showClear(value: boolean);
154
169
  get yearRange(): string;
@@ -24,6 +24,9 @@ export class BaseDatePickerCore {
24
24
  this._notifyInputValueChanges = true;
25
25
  this._allowInvalidDate = false;
26
26
  this._showToday = false;
27
+ this._showYesterday = false;
28
+ this._showLastSevenDays = false;
29
+ this._showLastThirtyDays = false;
27
30
  this._showClear = false;
28
31
  this._yearRange = '-50:+50';
29
32
  this._calendarText = {};
@@ -39,6 +42,9 @@ export class BaseDatePickerCore {
39
42
  this._monthChangeListener = evt => this._onMonthChanged(evt);
40
43
  this._activeChangeListener = id => this._onActiveDescendantChanged(id);
41
44
  this._todayListener = () => this._onToday();
45
+ this._yesterdayListener = () => this._onYesterday();
46
+ this._lastSevenDaysListener = () => this._onLastSevenDays();
47
+ this._lastThirtyDaysListener = () => this._onLastThirtyDays();
42
48
  this._clearListener = () => this._onClear();
43
49
  }
44
50
  initialize() {
@@ -118,8 +124,14 @@ export class BaseDatePickerCore {
118
124
  disabledDates: this._disabledDates,
119
125
  yearRange: this._yearRange,
120
126
  todayButton: this._showToday,
127
+ yesterdayButton: this._showYesterday,
128
+ lastSevenDaysButton: this._showLastSevenDays,
129
+ lastThirtyDaysButton: this._showLastThirtyDays,
121
130
  clearButton: this._showClear,
122
131
  todayCallback: this._todayListener,
132
+ yesterdayCallback: this._yesterdayListener,
133
+ lastSevenDaysCallback: this._lastSevenDaysListener,
134
+ lastThirtyDaysCallback: this._lastThirtyDaysListener,
123
135
  clearCallback: this._clearListener,
124
136
  disabledDateBuilder: this._disableDayCallback,
125
137
  disabledDaysOfWeek: this._disabledDaysOfWeek,
@@ -607,6 +619,24 @@ export class BaseDatePickerCore {
607
619
  set showToday(value) {
608
620
  this._showToday = value;
609
621
  }
622
+ get showYesterday() {
623
+ return this._showYesterday;
624
+ }
625
+ set showYesterday(value) {
626
+ this._showYesterday = value;
627
+ }
628
+ get showLastSevenDays() {
629
+ return this._showLastSevenDays;
630
+ }
631
+ set showLastSevenDays(value) {
632
+ this._showLastSevenDays = value;
633
+ }
634
+ get showLastThirtyDays() {
635
+ return this._showLastThirtyDays;
636
+ }
637
+ set showLastThirtyDays(value) {
638
+ this._showLastThirtyDays = value;
639
+ }
610
640
  get showClear() {
611
641
  return this._showClear;
612
642
  }
@@ -27,6 +27,9 @@ export interface IBaseDatePickerComponent<TValue> extends IBaseComponent {
27
27
  notifyInputValueChanges: boolean;
28
28
  allowInvalidDate: boolean;
29
29
  showToday: boolean;
30
+ showYesterday: boolean;
31
+ showLastSevenDays: boolean;
32
+ showLastThirtyDays: boolean;
30
33
  showClear: boolean;
31
34
  disabledDaysOfWeek: DayOfWeek[];
32
35
  yearRange: string;
@@ -54,6 +57,9 @@ export interface IBaseDatePickerComponent<TValue> extends IBaseComponent {
54
57
  * @property {boolean} [showClear=false] - Whether the clear button is visible in the popup.
55
58
  * @property {boolean} [showMaskFormat=false] - Whether the mask format is displayed in the input or not. Only applies if `masked` is `true`.
56
59
  * @property {boolean} [showToday=false] - Whether the today button is visible in the popup.
60
+ * @property {boolean} [showYesterday=false] - Whether the yesterday button is visible in the popup.
61
+ * @property {boolean} [showLastSevenDays=false] - Whether the last seven days button is visible in the popup.
62
+ * @property {boolean} [showLastThirtyDays=false] - Whether the last thirty days button is visible in the popup.
57
63
  * @property {TValue} value - The value of the date picker.
58
64
  * @property {DatePickerValueMode} valueMode - The type for the `value` property and `forge-date-picker-change` event.
59
65
  * @property {string} yearRange - The year range.
@@ -72,6 +78,9 @@ export interface IBaseDatePickerComponent<TValue> extends IBaseComponent {
72
78
  * @attribute {boolean} [show-clear=false] - Whether the clear button is visible in the popup.
73
79
  * @attribute {boolean} [show-mask-format=false] - Whether the mask format is displayed in the input or not. Only applies if `masked` is `true`.
74
80
  * @attribute {boolean} [show-today=false] - Whether the today button is visible in the popup.
81
+ * @attribute {boolean} [show-yesterday=false] - Whether the yesterday button is visible in the popup.
82
+ * @attribute {boolean} [show-last-seven-days=false] - Whether the last seven days button is visible in the popup.
83
+ * @attribute {boolean} [show-last-thirty-days=false] - Whether the last thirty days button is visible in the popup.
75
84
  * @attribute {DatePickerValueMode} [value-mode=string] - The type for the `value` property and `forge-date-picker-change` event.
76
85
  * @attribute {string} [year-range] - The year range.
77
86
  */
@@ -95,6 +104,9 @@ export declare abstract class BaseDatePickerComponent<TPublicValue, TPrivateValu
95
104
  notifyInputValueChanges: boolean;
96
105
  allowInvalidDate: boolean;
97
106
  showToday: boolean;
107
+ showYesterday: boolean;
108
+ showLastSevenDays: boolean;
109
+ showLastThirtyDays: boolean;
98
110
  showClear: boolean;
99
111
  parseCallback: DatePickerParseCallback;
100
112
  formatCallback: DatePickerFormatCallback;
@@ -28,6 +28,9 @@ import { BASE_DATE_PICKER_CONSTANTS } from './base-date-picker-constants';
28
28
  * @property {boolean} [showClear=false] - Whether the clear button is visible in the popup.
29
29
  * @property {boolean} [showMaskFormat=false] - Whether the mask format is displayed in the input or not. Only applies if `masked` is `true`.
30
30
  * @property {boolean} [showToday=false] - Whether the today button is visible in the popup.
31
+ * @property {boolean} [showYesterday=false] - Whether the yesterday button is visible in the popup.
32
+ * @property {boolean} [showLastSevenDays=false] - Whether the last seven days button is visible in the popup.
33
+ * @property {boolean} [showLastThirtyDays=false] - Whether the last thirty days button is visible in the popup.
31
34
  * @property {TValue} value - The value of the date picker.
32
35
  * @property {DatePickerValueMode} valueMode - The type for the `value` property and `forge-date-picker-change` event.
33
36
  * @property {string} yearRange - The year range.
@@ -46,6 +49,9 @@ import { BASE_DATE_PICKER_CONSTANTS } from './base-date-picker-constants';
46
49
  * @attribute {boolean} [show-clear=false] - Whether the clear button is visible in the popup.
47
50
  * @attribute {boolean} [show-mask-format=false] - Whether the mask format is displayed in the input or not. Only applies if `masked` is `true`.
48
51
  * @attribute {boolean} [show-today=false] - Whether the today button is visible in the popup.
52
+ * @attribute {boolean} [show-yesterday=false] - Whether the yesterday button is visible in the popup.
53
+ * @attribute {boolean} [show-last-seven-days=false] - Whether the last seven days button is visible in the popup.
54
+ * @attribute {boolean} [show-last-thirty-days=false] - Whether the last thirty days button is visible in the popup.
49
55
  * @attribute {DatePickerValueMode} [value-mode=string] - The type for the `value` property and `forge-date-picker-change` event.
50
56
  * @attribute {string} [year-range] - The year range.
51
57
  */
@@ -101,6 +107,15 @@ export class BaseDatePickerComponent extends BaseComponent {
101
107
  case BASE_DATE_PICKER_CONSTANTS.observedAttributes.SHOW_TODAY:
102
108
  this.showToday = coerceBoolean(newValue);
103
109
  break;
110
+ case BASE_DATE_PICKER_CONSTANTS.observedAttributes.SHOW_YESTERDAY:
111
+ this.showYesterday = coerceBoolean(newValue);
112
+ break;
113
+ case BASE_DATE_PICKER_CONSTANTS.observedAttributes.SHOW_LAST_SEVEN_DAYS:
114
+ this.showLastSevenDays = coerceBoolean(newValue);
115
+ break;
116
+ case BASE_DATE_PICKER_CONSTANTS.observedAttributes.SHOW_LAST_THIRTY_DAYS:
117
+ this.showLastThirtyDays = coerceBoolean(newValue);
118
+ break;
104
119
  case BASE_DATE_PICKER_CONSTANTS.observedAttributes.SHOW_CLEAR:
105
120
  this.showClear = coerceBoolean(newValue);
106
121
  break;
@@ -161,6 +176,15 @@ __decorate([
161
176
  __decorate([
162
177
  coreProperty()
163
178
  ], BaseDatePickerComponent.prototype, "showToday", void 0);
179
+ __decorate([
180
+ coreProperty()
181
+ ], BaseDatePickerComponent.prototype, "showYesterday", void 0);
182
+ __decorate([
183
+ coreProperty()
184
+ ], BaseDatePickerComponent.prototype, "showLastSevenDays", void 0);
185
+ __decorate([
186
+ coreProperty()
187
+ ], BaseDatePickerComponent.prototype, "showLastThirtyDays", void 0);
164
188
  __decorate([
165
189
  coreProperty()
166
190
  ], BaseDatePickerComponent.prototype, "showClear", void 0);
@@ -16,6 +16,9 @@ export declare class DatePickerCore extends BaseDatePickerCore<IDatePickerAdapte
16
16
  protected _emitOpenEvent(): void;
17
17
  protected _emitCloseEvent(): void;
18
18
  protected _onToday(): void;
19
+ protected _onYesterday(): void;
20
+ protected _onLastSevenDays(): void;
21
+ protected _onLastThirtyDays(): void;
19
22
  protected _onClear(): void;
20
23
  protected _getCurrentValue(): Date | null | undefined;
21
24
  protected _setFormattedInputValue(suppressValueChanges?: boolean): void;
@@ -37,6 +37,26 @@ export class DatePickerCore extends BaseDatePickerCore {
37
37
  this._tryMergeCurrentTime(today);
38
38
  this._onDateSelected({ date: today, selected: true, type: 'date' });
39
39
  }
40
+ _onYesterday() {
41
+ const today = new Date();
42
+ const yesterday = new Date(today.setDate(today.getDate() - 1));
43
+ this._tryMergeCurrentTime(yesterday);
44
+ this._onDateSelected({ date: yesterday, selected: true, type: 'date' });
45
+ }
46
+ _onLastSevenDays() {
47
+ // not a range, so setting the day to 7 days ago
48
+ const today = new Date();
49
+ const sevenDaysAgo = new Date(today.setDate(today.getDate() - 7));
50
+ this._tryMergeCurrentTime(sevenDaysAgo);
51
+ this._onDateSelected({ date: sevenDaysAgo, selected: true, type: 'date' });
52
+ }
53
+ _onLastThirtyDays() {
54
+ // not a range, so setting the day to 30 days ago
55
+ const today = new Date();
56
+ const thirtyDaysAgo = new Date(today.setDate(today.getDate() - 7));
57
+ this._tryMergeCurrentTime(thirtyDaysAgo);
58
+ this._onDateSelected({ date: thirtyDaysAgo, selected: true, type: 'date' });
59
+ }
40
60
  _onClear() {
41
61
  this._onDateSelected({ date: null, selected: false, type: 'date' });
42
62
  }
@@ -6,12 +6,14 @@
6
6
  export declare class DatePickerRange implements IDatePickerRange {
7
7
  from?: Date | string | null;
8
8
  to?: Date | string | null;
9
+ rangeName?: string | null | undefined;
9
10
  constructor(range?: IDatePickerRange);
10
11
  copy(): DatePickerRange;
11
12
  }
12
13
  export interface IDatePickerRange {
13
14
  from?: Date | string | null;
14
15
  to?: Date | string | null;
16
+ rangeName?: string | null | undefined;
15
17
  }
16
18
  export declare const DATE_RANGE_PICKER_CONSTANTS: {
17
19
  elementName: "forge-date-range-picker";
@@ -31,4 +33,5 @@ export declare const DATE_RANGE_PICKER_CONSTANTS: {
31
33
  };
32
34
  };
33
35
  export interface IDateRangePickerChangeEventData extends DatePickerRange {
36
+ rangeName?: string | null | undefined;
34
37
  }
@@ -10,6 +10,7 @@ export class DatePickerRange {
10
10
  if (range) {
11
11
  this.from = range.from;
12
12
  this.to = range.to;
13
+ this.rangeName = range.rangeName;
13
14
  }
14
15
  }
15
16
  copy() {
@@ -32,6 +32,9 @@ export declare class DateRangePickerCore extends BaseDatePickerCore<IDateRangePi
32
32
  protected _emitOpenEvent(): void;
33
33
  protected _emitCloseEvent(): void;
34
34
  protected _onToday(): void;
35
+ protected _onYesterday(): void;
36
+ protected _onLastSevenDays(): void;
37
+ protected _onLastThirtyDays(): void;
35
38
  protected _onClear(): void;
36
39
  protected _getCurrentValue(): IDatePickerRange | null | undefined;
37
40
  private _applyToMask;