@tylertech/forge 3.9.1 → 3.9.2
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.
- package/custom-elements.json +14 -14
- package/dist/badge/forge-badge.css +1 -1
- package/dist/forge.css +0 -1
- package/dist/lib.js +6 -6
- package/dist/lib.js.map +3 -3
- package/dist/table/forge-table.css +0 -1
- package/esm/autocomplete/autocomplete-core.js +9 -12
- package/esm/autocomplete/autocomplete-utils.js +3 -2
- package/esm/badge/badge.js +1 -1
- package/esm/button/base/base-button-adapter.js +6 -5
- package/esm/button/base/base-button-constants.d.ts +2 -2
- package/esm/button-area/button-area-adapter.d.ts +0 -2
- package/esm/button-area/button-area-adapter.js +5 -3
- package/esm/button-area/button-area-core.js +0 -1
- package/esm/button-area/button-area.js +1 -1
- package/esm/button-toggle/button-toggle-group/button-toggle-group-core.js +0 -1
- package/esm/calendar/calendar-core.js +6 -4
- package/esm/calendar/calendar-dropdown/calendar-dropdown.js +1 -1
- package/esm/calendar/calendar-utils.js +1 -3
- package/esm/calendar/calendar.js +1 -1
- package/esm/color-picker/color-picker-core.js +2 -2
- package/esm/core/configuration/global-configuration.js +0 -1
- package/esm/core/mixins/form/with-form-associated.js +6 -2
- package/esm/core/utils/a11y-utils.d.ts +2 -2
- package/esm/core/utils/date-utils.js +1 -1
- package/esm/core/utils/dismissible-stack.js +0 -1
- package/esm/core/utils/feature-detection.js +2 -2
- package/esm/date-picker/base/base-date-picker-adapter.d.ts +2 -1
- package/esm/date-picker/base/base-date-picker-adapter.js +4 -0
- package/esm/date-picker/base/base-date-picker-core.js +2 -4
- package/esm/date-picker/base/base-date-picker-utils.d.ts +2 -1
- package/esm/date-picker/date-picker-adapter.js +1 -1
- package/esm/date-picker/date-picker-core.js +2 -1
- package/esm/date-range-picker/date-range-picker-adapter.d.ts +2 -1
- package/esm/date-range-picker/date-range-picker-adapter.js +1 -1
- package/esm/date-range-picker/date-range-picker-core.js +4 -5
- package/esm/deprecated/icon-button/deprecated-icon-button-component-delegate.js +2 -1
- package/esm/dialog/dialog.js +1 -1
- package/esm/expansion-panel/expansion-panel-core.d.ts +4 -0
- package/esm/expansion-panel/expansion-panel-core.js +19 -11
- package/esm/field/field-core.js +2 -1
- package/esm/field/field.js +1 -1
- package/esm/file-picker/file-picker-core.js +1 -3
- package/esm/floating-action-button/floating-action-button-component-delegate.js +2 -1
- package/esm/icon/icon-core.js +1 -1
- package/esm/icon/icon-registry.js +1 -1
- package/esm/icon-button/icon-button-component-delegate.js +2 -1
- package/esm/label/label-aware.js +1 -3
- package/esm/list-dropdown/list-dropdown-core.js +4 -2
- package/esm/list-dropdown/list-dropdown-utils.js +5 -2
- package/esm/menu/menu-core.js +5 -6
- package/esm/overlay/overlay-constants.d.ts +1 -1
- package/esm/overlay/overlay-constants.js +1 -1
- package/esm/overlay/overlay.d.ts +2 -2
- package/esm/overlay/overlay.js +2 -2
- package/esm/select/core/base-select-adapter.js +0 -1
- package/esm/select/core/base-select-core.js +70 -74
- package/esm/select/core/select-utils.d.ts +1 -1
- package/esm/select/core/select-utils.js +2 -2
- package/esm/select/select-dropdown/select-dropdown-adapter.js +1 -3
- package/esm/split-view/split-view-panel/split-view-panel.js +1 -1
- package/esm/table/table-utils.js +10 -12
- package/esm/tabs/tab-bar/tab-bar-core.js +2 -1
- package/esm/text-field/text-field-adapter.js +1 -3
- package/esm/time-picker/time-picker-core.js +5 -5
- package/esm/toast/toast-adapter.js +1 -1
- package/esm/toast/toast-core.js +1 -1
- package/esm/toast/toast.js +2 -1
- package/esm/tooltip/tooltip.js +1 -1
- package/esm/view-switcher/view-switcher-core.js +2 -1
- package/package.json +1 -1
- package/sass/core/styles/tokens/badge/_tokens.scss +1 -1
- package/sass/table/forge-table.scss +0 -1
- package/sass/utils/_mixins.scss +7 -8
|
@@ -276,7 +276,7 @@ export class AutocompleteCore extends ListDropdownAwareCore {
|
|
|
276
276
|
}
|
|
277
277
|
break;
|
|
278
278
|
case 'Backspace':
|
|
279
|
-
case 'Delete':
|
|
279
|
+
case 'Delete': {
|
|
280
280
|
const input = evt.target;
|
|
281
281
|
const value = this._adapter.getInputValue();
|
|
282
282
|
const isRemovingAllChars = input.value.substring(input.selectionStart, input.selectionEnd) === input.value;
|
|
@@ -288,6 +288,7 @@ export class AutocompleteCore extends ListDropdownAwareCore {
|
|
|
288
288
|
this._clearValue();
|
|
289
289
|
}
|
|
290
290
|
break;
|
|
291
|
+
}
|
|
291
292
|
}
|
|
292
293
|
}
|
|
293
294
|
_executeFilter(sendFilterText = true, sendValue = false) {
|
|
@@ -297,14 +298,12 @@ export class AutocompleteCore extends ListDropdownAwareCore {
|
|
|
297
298
|
const filter = this._filter;
|
|
298
299
|
const filterText = sendFilterText ? this._filterText : '';
|
|
299
300
|
const value = sendValue ? this._getValue() : null;
|
|
300
|
-
return new Promise((resolve, reject) =>
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
})
|
|
306
|
-
.catch(e => reject(`An unexpected error occurred while filtering: ${e}`));
|
|
307
|
-
});
|
|
301
|
+
return new Promise((resolve, reject) => Promise.resolve(filter(filterText, value))
|
|
302
|
+
.then(options => {
|
|
303
|
+
this._options = options;
|
|
304
|
+
resolve(this._options);
|
|
305
|
+
})
|
|
306
|
+
.catch(e => reject(`An unexpected error occurred while filtering: ${e}`)));
|
|
308
307
|
}
|
|
309
308
|
_onFilterComplete() {
|
|
310
309
|
if (!this._adapter.hasFocus()) {
|
|
@@ -342,9 +341,7 @@ export class AutocompleteCore extends ListDropdownAwareCore {
|
|
|
342
341
|
let listOptionBuilder;
|
|
343
342
|
if (this._optionBuilder) {
|
|
344
343
|
const optionBuilder = this._optionBuilder;
|
|
345
|
-
listOptionBuilder = (option, parentElement) =>
|
|
346
|
-
return optionBuilder(option, this._filterText, parentElement);
|
|
347
|
-
};
|
|
344
|
+
listOptionBuilder = (option, parentElement) => optionBuilder(option, this._filterText, parentElement);
|
|
348
345
|
}
|
|
349
346
|
const config = {
|
|
350
347
|
options: this._options,
|
|
@@ -16,8 +16,9 @@ export var OptionType;
|
|
|
16
16
|
* @param type The type of option to detect.
|
|
17
17
|
*/
|
|
18
18
|
export function isOptionType(options, type) {
|
|
19
|
-
const
|
|
20
|
-
const
|
|
19
|
+
const optionHasProperty = (o, prop) => Object.prototype.hasOwnProperty.call(o, prop);
|
|
20
|
+
const isOptionGroups = options.some((o) => isDefined(o) && isObject(o) && optionHasProperty(o, 'options') && (optionHasProperty(o, 'text') || optionHasProperty(o, 'builder')));
|
|
21
|
+
const isOptionTypes = options.some((o) => isDefined(o) && isObject(o) && optionHasProperty(o, 'label') && optionHasProperty(o, 'value'));
|
|
21
22
|
return (isOptionGroups && type === OptionType.Group) || (isOptionTypes && type === OptionType.Option);
|
|
22
23
|
}
|
|
23
24
|
/** A utility function to find the matching option in the provided options by the value provided. */
|
package/esm/badge/badge.js
CHANGED
|
@@ -10,7 +10,7 @@ import { customElement, property } from 'lit/decorators.js';
|
|
|
10
10
|
import { toggleState } from '../core/utils/utils';
|
|
11
11
|
import { CUSTOM_ELEMENT_NAME_PROPERTY } from '@tylertech/forge-core';
|
|
12
12
|
import { BaseLitElement } from '../core/base/base-lit-element';
|
|
13
|
-
const styles = ':host{display:flex;box-sizing:border-box}:host([hidden]){display:none}.forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-secondary, #ffc107));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-secondary, #000000));--_badge-shape:var(--forge-badge-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));--_badge-height:var(--forge-badge-height, 20px);--_badge-min-width:var(--forge-badge-min-width, 0);--_badge-max-width:var(--forge-badge-max-width, auto);--_badge-padding-inline:var(--forge-badge-padding-inline, var(--forge-spacing-xsmall, 8px));--_badge-padding-block:var(--forge-badge-padding-block, 0);--_badge-border-width:var(--forge-badge-border-width, var(--forge-border-thin, 1px));--_badge-border-style:var(--forge-badge-border-style, none);--_badge-border-color:var(--forge-badge-border-color, var(--_badge-color));--_badge-gap:var(--forge-badge-gap, var(--forge-spacing-
|
|
13
|
+
const styles = ':host{display:flex;box-sizing:border-box}:host([hidden]){display:none}.forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-secondary, #ffc107));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-secondary, #000000));--_badge-shape:var(--forge-badge-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));--_badge-height:var(--forge-badge-height, 20px);--_badge-min-width:var(--forge-badge-min-width, 0);--_badge-max-width:var(--forge-badge-max-width, auto);--_badge-padding-inline:var(--forge-badge-padding-inline, var(--forge-spacing-xsmall, 8px));--_badge-padding-block:var(--forge-badge-padding-block, 0);--_badge-border-width:var(--forge-badge-border-width, var(--forge-border-thin, 1px));--_badge-border-style:var(--forge-badge-border-style, none);--_badge-border-color:var(--forge-badge-border-color, var(--_badge-color));--_badge-gap:var(--forge-badge-gap, var(--forge-spacing-xxsmall, 4px));--_badge-font-weight:var(--forge-badge-font-weight, bold);--_badge-dot-size:var(--forge-badge-dot-size, 8px);--_badge-dot-height:var(--forge-badge-dot-height, var(--_badge-dot-size));--_badge-dot-width:var(--forge-badge-dot-width, var(--_badge-dot-size));--_badge-dot-padding:var(--forge-badge-dot-padding, 0);--_badge-transition-duration:var(--forge-badge-transition-duration, var(--forge-animation-duration-short4, 200ms));--_badge-transition-easing:var(--forge-badge-transition-easing, var(--forge-animation-easing-decelerate, cubic-bezier(0, 0, 0, 1)))}.forge-badge{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-label1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-label1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, .75)));font-weight:var(--forge-typography-label1-font-weight,400);line-height:var(--forge-typography-label1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));letter-spacing:var(--forge-typography-label1-letter-spacing, .0357142857em);text-transform:var(--forge-typography-label1-text-transform,inherit);text-decoration:var(--forge-typography-label1-text-decoration,inherit);background:var(--_badge-background);color:var(--_badge-color);height:var(--_badge-height);min-width:var(--_badge-min-width);max-width:var(--_badge-max-width);border-width:var(--_badge-border-width);border-style:var(--_badge-border-style);border-color:var(--_badge-border-color);display:inline-flex;align-items:center;gap:var(--_badge-gap);border-radius:var(--_badge-shape);padding-inline:var(--_badge-padding-inline);padding-block:var(--_badge-padding-block);overflow:hidden;box-sizing:border-box;pointer-events:none;transition:transform var(--_badge-transition-duration) var(--_badge-transition-easing);font-weight:var(--_badge-font-weight);text-overflow:ellipsis;white-space:nowrap}.forge-badge .content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}::slotted(:is([slot=start],[slot=end])){font-size:inherit}:host(:where([hide],:state(hidden))) .forge-badge{transform:scale(0)}:host(:where([dot],:state(dot))) .forge-badge{--_badge-height:var(--_badge-dot-height);--_badge-min-width:var(--forge-badge-min-width, auto);padding:var(--_badge-dot-padding);width:var(--_badge-dot-width)}:host(:where([dot],:state(dot))) .content>slot{display:none}:host([theme=primary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-primary-container, #d1d5ed));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-primary-container, #222c62))}:host(:where([strong],:state(strong))[theme=primary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-primary, #3f51b5));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-primary, #ffffff))}:host([theme=secondary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-secondary-container, #fff0c3));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-secondary-container, #8a6804))}:host(:where([strong],:state(strong))[theme=secondary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-secondary, #ffc107));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-secondary, #000000))}:host([theme=tertiary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-tertiary-container, #d0d7ff));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-tertiary-container, #213189))}:host(:where([strong],:state(strong))[theme=tertiary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-tertiary, #3d5afe));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-tertiary, #ffffff))}:host([theme=success]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-success-container, #cde0ce));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-success-container, #19441b))}:host(:where([strong],:state(strong))[theme=success]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-success, #2e7d32));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-success, #ffffff))}:host([theme=warning]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-warning-container, #f4d3c2));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-warning-container, #712700))}:host(:where([strong],:state(strong))[theme=warning]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-warning, #d14900));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-warning, #ffffff))}:host(:not(:where([strong],:state(strong))):is([theme=error],[theme=danger])) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-error-container-low, #f6e0e4));--_badge-color:var(--forge-badge-color, var(--forge-theme-error, #b00020))}:host(:where([strong],:state(strong)):is([theme=error],[theme=danger])) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-error, #b00020));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-error, #ffffff))}:host(:not(:where([strong],:state(strong))):is([theme=info],[theme=info-primary])) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-info-container, #c7daf0));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-info-container, #0b3768))}:host(:where([strong],:state(strong)):is([theme=info],[theme=info-primary])) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-info, #1565c0));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-info, #ffffff))}:host(:not(:where([strong],:state(strong)))[theme=info-secondary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-surface-container-low, #ebebeb));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-surface-container-low, #000000))}:host(:where([strong],:state(strong))[theme=info-secondary]) .forge-badge{--_badge-background:var(--forge-badge-background, var(--forge-theme-surface-inverse, #333333));--_badge-color:var(--forge-badge-color, var(--forge-theme-on-surface-inverse, #ffffff))}';
|
|
14
14
|
export const BADGE_TAG_NAME = 'forge-badge';
|
|
15
15
|
/**
|
|
16
16
|
* @tag forge-badge
|
|
@@ -30,19 +30,19 @@ export class BaseButtonAdapter extends BaseAdapter {
|
|
|
30
30
|
initialize() {
|
|
31
31
|
const slottedAnchor = this.getSlottedAnchor;
|
|
32
32
|
this._component[setDefaultAria]({
|
|
33
|
-
role:
|
|
33
|
+
role: slottedAnchor ? null : 'button'
|
|
34
34
|
}, {
|
|
35
35
|
setAttribute: !this._component.hasAttribute('role') || !!slottedAnchor
|
|
36
36
|
});
|
|
37
37
|
this._rootElement.classList.toggle(BASE_BUTTON_CONSTANTS.classes.WITH_ANCHOR, !!slottedAnchor);
|
|
38
|
-
if (
|
|
38
|
+
if (slottedAnchor) {
|
|
39
39
|
this._component.removeAttribute('tabindex');
|
|
40
40
|
}
|
|
41
41
|
else if (!this._component.disabled && !this._component.hasAttribute('tabindex')) {
|
|
42
42
|
this._component.setAttribute('tabindex', '0');
|
|
43
43
|
}
|
|
44
|
-
this._focusIndicatorElement.targetElement =
|
|
45
|
-
this._stateLayerElement.targetElement =
|
|
44
|
+
this._focusIndicatorElement.targetElement = slottedAnchor ? slottedAnchor : this._component;
|
|
45
|
+
this._stateLayerElement.targetElement = slottedAnchor ? slottedAnchor : this._component;
|
|
46
46
|
}
|
|
47
47
|
setDisabled(value) {
|
|
48
48
|
if (value) {
|
|
@@ -136,7 +136,7 @@ export class BaseButtonAdapter extends BaseAdapter {
|
|
|
136
136
|
}
|
|
137
137
|
return false;
|
|
138
138
|
case 'toggle':
|
|
139
|
-
default:
|
|
139
|
+
default: {
|
|
140
140
|
const result = popoverElement.togglePopover();
|
|
141
141
|
// When the popover is open and is using an "auto" popover mode, we need to handle
|
|
142
142
|
// clicking ourselves again to close without re-opening the popover. We do this by
|
|
@@ -158,6 +158,7 @@ export class BaseButtonAdapter extends BaseAdapter {
|
|
|
158
158
|
}, { once: true });
|
|
159
159
|
}
|
|
160
160
|
return result;
|
|
161
|
+
}
|
|
161
162
|
}
|
|
162
163
|
}
|
|
163
164
|
toggleDefaultPopoverIcon(value) {
|
|
@@ -31,6 +31,6 @@ export declare const BASE_BUTTON_CONSTANTS: {
|
|
|
31
31
|
};
|
|
32
32
|
export type ButtonType = 'button' | 'submit' | 'reset';
|
|
33
33
|
export type ButtonTarget = '_blank' | '_self' | '_parent' | '_top';
|
|
34
|
-
export
|
|
34
|
+
export interface ButtonClickOptions {
|
|
35
35
|
animateStateLayer?: boolean;
|
|
36
|
-
}
|
|
36
|
+
}
|
|
@@ -6,7 +6,6 @@
|
|
|
6
6
|
import { BaseAdapter, IBaseAdapter } from '../core';
|
|
7
7
|
import { IButtonAreaComponent } from './button-area';
|
|
8
8
|
export interface IButtonAreaAdapter extends IBaseAdapter {
|
|
9
|
-
destroy(): void;
|
|
10
9
|
setDisabled(value: boolean): void;
|
|
11
10
|
addListener(type: string, listener: EventListener, capture?: boolean): void;
|
|
12
11
|
removeListener(type: string, listener: EventListener, capture?: boolean): void;
|
|
@@ -30,7 +29,6 @@ export declare class ButtonAreaAdapter extends BaseAdapter<IButtonAreaComponent>
|
|
|
30
29
|
private _focusIndicatorElement;
|
|
31
30
|
private _stateLayerElement;
|
|
32
31
|
constructor(component: IButtonAreaComponent);
|
|
33
|
-
destroy(): void;
|
|
34
32
|
setDisabled(value: boolean): void;
|
|
35
33
|
addListener(type: string, listener: EventListener, capture?: boolean): void;
|
|
36
34
|
removeListener(type: string, listener: EventListener, capture?: boolean): void;
|
|
@@ -17,7 +17,6 @@ export class ButtonAreaAdapter extends BaseAdapter {
|
|
|
17
17
|
this._focusIndicatorElement = getShadowElement(component, FOCUS_INDICATOR_CONSTANTS.elementName);
|
|
18
18
|
this._stateLayerElement = getShadowElement(component, STATE_LAYER_CONSTANTS.elementName);
|
|
19
19
|
}
|
|
20
|
-
destroy() { }
|
|
21
20
|
setDisabled(value) {
|
|
22
21
|
this._buttonElement?.toggleAttribute(BUTTON_AREA_CONSTANTS.attributes.DISABLED, value);
|
|
23
22
|
if (value) {
|
|
@@ -72,8 +71,11 @@ export class ButtonAreaAdapter extends BaseAdapter {
|
|
|
72
71
|
requestDisabledButtonFrame() {
|
|
73
72
|
if (this._buttonElement) {
|
|
74
73
|
this._buttonElement.disabled = true;
|
|
75
|
-
|
|
76
|
-
|
|
74
|
+
requestAnimationFrame(() => {
|
|
75
|
+
if (this._buttonElement) {
|
|
76
|
+
this._buttonElement.disabled = false;
|
|
77
|
+
}
|
|
78
|
+
});
|
|
77
79
|
}
|
|
78
80
|
}
|
|
79
81
|
}
|
|
@@ -32,7 +32,6 @@ export class ButtonAreaCore {
|
|
|
32
32
|
this._adapter.removeContentSlotListener('pointerdown', this._ignoreStateLayerListener.bind(this));
|
|
33
33
|
this._adapter.removeContentSlotListener('pointerup', this._ignoreStateLayerListener.bind(this));
|
|
34
34
|
this._adapter.removeButtonSlotListener('slotchange', this._slotListener);
|
|
35
|
-
this._adapter.destroy();
|
|
36
35
|
this._adapter.stopButtonObserver();
|
|
37
36
|
}
|
|
38
37
|
_handleClick(event) {
|
|
@@ -12,7 +12,7 @@ import { FocusIndicatorComponent } from '../focus-indicator';
|
|
|
12
12
|
import { StateLayerComponent } from '../state-layer';
|
|
13
13
|
import { BaseComponent } from '../core/base/base-component';
|
|
14
14
|
const template = '<template><div class=\"forge-button-area\" id=\"root\" part=\"root\"><div class=\"button\" id=\"button\" part=\"button\"><slot name=\"button\"></slot></div><slot id=\"content\"></slot><forge-state-layer target=\"root\" exportparts=\"surface:state-layer\"></forge-state-layer><forge-focus-indicator target=\"button\" part=\"focus-indicator\" inward></forge-focus-indicator></div></template>';
|
|
15
|
-
const styles = ':host{display:block;position:relative}:host .forge-button-area{cursor:var(--_button-area-cursor)}:host([hidden]){display:none}:host([disabled]) .forge-button-area{cursor:var(--_button-area-disabled-cursor)}.forge-button-area{--_button-area-primary-color:var(--forge-button-area-primary-color, var(--forge-theme-primary, #3f51b5));--_button-area-cursor:var(--forge-button-area-cursor, pointer);--_button-area-disabled-cursor:var(--forge-button-area-disabled-cursor, not-allowed);--_button-area-focus-indicator-color:var(--forge-button-area-focus-indicator-color, var(--forge-theme-primary, #3f51b5));--_button-area-focus-indicator-offset:var(--forge-button-area-focus-indicator-offset, 4px)}.forge-button-area{position:relative;overflow:hidden;block-size:100%;inline-size:100%}.forge-button-area .button{
|
|
15
|
+
const styles = ':host{display:block;position:relative}:host .forge-button-area{cursor:var(--_button-area-cursor)}:host([hidden]){display:none}:host([disabled]) .forge-button-area{cursor:var(--_button-area-disabled-cursor)}.forge-button-area{--_button-area-primary-color:var(--forge-button-area-primary-color, var(--forge-theme-primary, #3f51b5));--_button-area-cursor:var(--forge-button-area-cursor, pointer);--_button-area-disabled-cursor:var(--forge-button-area-disabled-cursor, not-allowed);--_button-area-focus-indicator-color:var(--forge-button-area-focus-indicator-color, var(--forge-theme-primary, #3f51b5));--_button-area-focus-indicator-offset:var(--forge-button-area-focus-indicator-offset, 4px)}.forge-button-area{position:relative;overflow:hidden;block-size:100%;inline-size:100%}.forge-button-area .button{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}forge-focus-indicator{z-index:1;--forge-focus-indicator-color:var(--_button-area-focus-indicator-color);--forge-focus-indicator-outward-offset:var(--_button-area-focus-indicator-offset)}forge-state-layer{--forge-state-layer-color:var(--_button-area-primary-color);border-radius:inherit}';
|
|
16
16
|
/**
|
|
17
17
|
* @tag forge-button-area
|
|
18
18
|
*
|
|
@@ -96,7 +96,6 @@ export class ButtonToggleGroupCore {
|
|
|
96
96
|
// Combine the selected toggle values with our current state to ensure we always return the latest value
|
|
97
97
|
// even if our state doesn't match a selected toggle.
|
|
98
98
|
const values = Array.from(new Set(this._adapter.getSelectedValues().concat(this._values)));
|
|
99
|
-
// eslint-disable-next-line prettier/prettier
|
|
100
99
|
return this._multiple ? Array.from(values) : (values[0] ?? null);
|
|
101
100
|
}
|
|
102
101
|
set value(value) {
|
|
@@ -1265,9 +1265,10 @@ export class CalendarCore {
|
|
|
1265
1265
|
switch (this._view) {
|
|
1266
1266
|
case 'date':
|
|
1267
1267
|
return !this._min || this._min < new Date(this._year, this._month, 1);
|
|
1268
|
-
case 'month':
|
|
1268
|
+
case 'month': {
|
|
1269
1269
|
const minDateYear = this._min?.getFullYear();
|
|
1270
1270
|
return this._menuYear != null && (minDateYear == null || minDateYear < this._menuYear);
|
|
1271
|
+
}
|
|
1271
1272
|
case 'year':
|
|
1272
1273
|
return !!this._menuYearsInView && this._minYear < this._menuYearsInView.min;
|
|
1273
1274
|
default:
|
|
@@ -1286,9 +1287,10 @@ export class CalendarCore {
|
|
|
1286
1287
|
switch (this._view) {
|
|
1287
1288
|
case 'date':
|
|
1288
1289
|
return !this._max || this._max > getLastDateOfMonth(this._month, this._year);
|
|
1289
|
-
case 'month':
|
|
1290
|
+
case 'month': {
|
|
1290
1291
|
const maxDateYear = this._max?.getFullYear();
|
|
1291
1292
|
return this._menuYear != null && (maxDateYear == null || maxDateYear > this._menuYear);
|
|
1293
|
+
}
|
|
1292
1294
|
case 'year':
|
|
1293
1295
|
return !!this._menuYearsInView && this._maxYear > this._menuYearsInView.max;
|
|
1294
1296
|
default:
|
|
@@ -1528,7 +1530,6 @@ export class CalendarCore {
|
|
|
1528
1530
|
this._adapter.setHostAttribute(CALENDAR_CONSTANTS.attributes.MODE, 'single');
|
|
1529
1531
|
this._adapter.setMultiple(false);
|
|
1530
1532
|
if (this._value.length > 1) {
|
|
1531
|
-
// eslint-disable-next-line @typescript-eslint/prefer-for-of
|
|
1532
1533
|
for (let i = this._value.length - 2; i >= 0; i -= 1) {
|
|
1533
1534
|
this._deselectDate(this._value[i]);
|
|
1534
1535
|
}
|
|
@@ -2097,13 +2098,14 @@ export class CalendarCore {
|
|
|
2097
2098
|
case 'multiple':
|
|
2098
2099
|
dates = value;
|
|
2099
2100
|
break;
|
|
2100
|
-
case 'range':
|
|
2101
|
+
case 'range': {
|
|
2101
2102
|
const minAndMax = getMinAndMaxDates(value);
|
|
2102
2103
|
dates.push(minAndMax[0]);
|
|
2103
2104
|
if (minAndMax.length > 1) {
|
|
2104
2105
|
dates.push(minAndMax[1]);
|
|
2105
2106
|
}
|
|
2106
2107
|
break;
|
|
2108
|
+
}
|
|
2107
2109
|
}
|
|
2108
2110
|
}
|
|
2109
2111
|
else if (isValidDate(new Date(value))) {
|
|
@@ -16,7 +16,7 @@ export class CalendarDropdown {
|
|
|
16
16
|
return this._popupClasses;
|
|
17
17
|
}
|
|
18
18
|
set popupClasses(value) {
|
|
19
|
-
this._popupClasses =
|
|
19
|
+
this._popupClasses = value ? (isArray(value) ? [...value] : [value]) : [];
|
|
20
20
|
}
|
|
21
21
|
get locale() {
|
|
22
22
|
return this.calendar?.locale;
|
|
@@ -125,9 +125,7 @@ export function getDatesInRange(dates, start, end) {
|
|
|
125
125
|
if (!start || !end) {
|
|
126
126
|
return [];
|
|
127
127
|
}
|
|
128
|
-
return dates.filter(d =>
|
|
129
|
-
return isInRange(d, start, end);
|
|
130
|
-
});
|
|
128
|
+
return dates.filter(d => isInRange(d, start, end));
|
|
131
129
|
}
|
|
132
130
|
/** Gets an accessible description of events. */
|
|
133
131
|
export function getEventDescriptions(events) {
|
package/esm/calendar/calendar.js
CHANGED
|
@@ -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{
|
|
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{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}#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
|
*
|
|
@@ -176,7 +176,7 @@ export class ColorPickerCore {
|
|
|
176
176
|
}
|
|
177
177
|
}
|
|
178
178
|
get rgba() {
|
|
179
|
-
return
|
|
179
|
+
return this._rgba ? { ...this._rgba } : null;
|
|
180
180
|
}
|
|
181
181
|
set rgba(value) {
|
|
182
182
|
if (value) {
|
|
@@ -189,7 +189,7 @@ export class ColorPickerCore {
|
|
|
189
189
|
}
|
|
190
190
|
}
|
|
191
191
|
get hsva() {
|
|
192
|
-
return
|
|
192
|
+
return this._hsva ? { ...this._hsva } : null;
|
|
193
193
|
}
|
|
194
194
|
set hsva(value) {
|
|
195
195
|
if (value) {
|
|
@@ -62,8 +62,12 @@ export function WithFormAssociation(base) {
|
|
|
62
62
|
}
|
|
63
63
|
// Apply validation-affecting props to the input element to get the correct validation
|
|
64
64
|
// message
|
|
65
|
-
|
|
66
|
-
|
|
65
|
+
if (this._inputElement) {
|
|
66
|
+
const entries = Object.entries(props);
|
|
67
|
+
for (const [key, value] of entries) {
|
|
68
|
+
this._inputElement[key] = value;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
67
71
|
return this._inputElement.validationMessage;
|
|
68
72
|
}
|
|
69
73
|
}
|
|
@@ -99,9 +99,9 @@ export declare function ariaPropertyToAttribute<K extends ARIAProperty | 'role'>
|
|
|
99
99
|
* @returns An ARIA mixin property.
|
|
100
100
|
*/
|
|
101
101
|
export declare function ariaAttributeToProperty<K extends ARIAAttribute | 'role'>(attribute: K): ARIAProperty;
|
|
102
|
-
export
|
|
102
|
+
export interface DefaultAriaOptions {
|
|
103
103
|
setAttribute?: boolean;
|
|
104
|
-
}
|
|
104
|
+
}
|
|
105
105
|
/**
|
|
106
106
|
* Applies default ARIA to an element through ElementInternals if supported. Otherwise, ARIA
|
|
107
107
|
* attributes are set directly on the element and stored in additional `data-default-*` attributes
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* License: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { isValidDate } from '@tylertech/forge-core';
|
|
7
|
-
export const ISO_8601_REGEX = /^([
|
|
7
|
+
export const ISO_8601_REGEX = /^([+-]?\d{4}(?!\d{2}\b))((-?)((0[1-9]|1[0-2])(\3([12]\d|0[1-9]|3[01]))?|W([0-4]\d|5[0-2])(-?[1-7])?|(00[1-9]|0[1-9]\d|[12]\d{2}|3([0-5]\d|6[1-6])))([T\s]((([01]\d|2[0-3])((:?)[0-5]\d)?|24:?00)([.,]\d+(?!:))?)?(\17[0-5]\d([.,]\d+)?)?([zZ]|([+-])([01]\d|2[0-3]):?([0-5]\d)?)?)?)?$/;
|
|
8
8
|
export const ISO_TIMEZONE_REGEX = /a-z/i;
|
|
9
9
|
const FUTURE_YEAR_COERCION = 10; // The number of years in the future to coerce two-digit years into current century
|
|
10
10
|
/**
|
|
@@ -18,7 +18,6 @@ export class DismissibleStack {
|
|
|
18
18
|
get dismissing() {
|
|
19
19
|
return this._deferredDismiss?.promise ?? Promise.resolve();
|
|
20
20
|
}
|
|
21
|
-
// eslint-disable-next-line @tylertech-eslint/require-private-modifier
|
|
22
21
|
constructor() {
|
|
23
22
|
/**
|
|
24
23
|
* A set of all elements that are currently eligible for dismissal.
|
|
@@ -9,7 +9,7 @@ import { Platform } from '@tylertech/forge-core';
|
|
|
9
9
|
* @returns {boolean}
|
|
10
10
|
*/
|
|
11
11
|
export function supportsPopover() {
|
|
12
|
-
return
|
|
12
|
+
return Object.prototype.hasOwnProperty.call(HTMLElement.prototype, 'popover');
|
|
13
13
|
}
|
|
14
14
|
/**
|
|
15
15
|
* Detects if the browser supports ARIA properties in Element Internals.
|
|
@@ -19,7 +19,7 @@ export function supportsPopover() {
|
|
|
19
19
|
* @returns {boolean}
|
|
20
20
|
*/
|
|
21
21
|
export function supportsElementInternalsAria() {
|
|
22
|
-
return
|
|
22
|
+
return Object.prototype.hasOwnProperty.call(ElementInternals.prototype, 'role');
|
|
23
23
|
}
|
|
24
24
|
/**
|
|
25
25
|
* Detects if the browser supports the hovering elements as the users primary input mechanism.
|
|
@@ -7,6 +7,7 @@ import { DateRange, DayOfWeek, ICalendarComponent } from '../../calendar';
|
|
|
7
7
|
import { ICalendarDropdown, ICalendarDropdownPopupConfig } from '../../calendar/calendar-dropdown';
|
|
8
8
|
import { BaseAdapter, IBaseAdapter, IDateInputMaskOptions } from '../../core';
|
|
9
9
|
import { BaseComponent } from '../../core/base/base-component';
|
|
10
|
+
import { IIconButtonComponent } from '../../icon-button';
|
|
10
11
|
import { IDatePickerCalendarDropdownText } from './base-date-picker-constants';
|
|
11
12
|
export interface IBaseDatePickerAdapter extends IBaseAdapter {
|
|
12
13
|
initialize(): void;
|
|
@@ -98,6 +99,6 @@ export declare abstract class BaseDatePickerAdapter<T extends BaseComponent> ext
|
|
|
98
99
|
setCalendarText(text: IDatePickerCalendarDropdownText): void;
|
|
99
100
|
propagateCalendarKey(evt: KeyboardEvent): void;
|
|
100
101
|
tryCreateToggle(): void;
|
|
101
|
-
protected _createToggleElement():
|
|
102
|
+
protected _createToggleElement(): IIconButtonComponent;
|
|
102
103
|
protected _getDefaultTargetElement(): HTMLElement;
|
|
103
104
|
}
|
|
@@ -173,6 +173,10 @@ export class BaseDatePickerAdapter extends BaseAdapter {
|
|
|
173
173
|
return;
|
|
174
174
|
}
|
|
175
175
|
const iconButtonElement = this._createToggleElement();
|
|
176
|
+
// Inherit the density from the text field in certain cases
|
|
177
|
+
if (textField.density === 'extra-small') {
|
|
178
|
+
iconButtonElement.density = 'small';
|
|
179
|
+
}
|
|
176
180
|
textField.appendChild(iconButtonElement);
|
|
177
181
|
this._toggleElement = iconButtonElement;
|
|
178
182
|
}
|
|
@@ -365,9 +365,7 @@ export class BaseDatePickerCore {
|
|
|
365
365
|
onChange: (value) => this._handleInput(value)
|
|
366
366
|
};
|
|
367
367
|
if (this._prepareMaskCallback) {
|
|
368
|
-
options.prepareCallback = (value, masked, flags, maskInstance) =>
|
|
369
|
-
return this._prepareMaskCallback.call(null, value, masked, flags, maskInstance);
|
|
370
|
-
};
|
|
368
|
+
options.prepareCallback = (value, masked, flags, maskInstance) => this._prepareMaskCallback.call(null, value, masked, flags, maskInstance);
|
|
371
369
|
}
|
|
372
370
|
this._adapter.initializeMask(options);
|
|
373
371
|
}
|
|
@@ -416,7 +414,7 @@ export class BaseDatePickerCore {
|
|
|
416
414
|
set min(value) {
|
|
417
415
|
if (this._min !== value) {
|
|
418
416
|
const date = this._coerceDateValue(value);
|
|
419
|
-
this._min =
|
|
417
|
+
this._min = date ? new Date(date.getTime()) : null;
|
|
420
418
|
this._applyMin();
|
|
421
419
|
if (this._isInitialized && this._open) {
|
|
422
420
|
this._adapter.setCalendarMinDate(this._min);
|
|
@@ -3,4 +3,5 @@
|
|
|
3
3
|
* Copyright Tyler Technologies, Inc.
|
|
4
4
|
* License: Apache-2.0
|
|
5
5
|
*/
|
|
6
|
-
|
|
6
|
+
import { type IIconButtonComponent } from '../../icon-button/icon-button';
|
|
7
|
+
export declare function createToggleElement(iconName: string): IIconButtonComponent;
|
|
@@ -98,7 +98,7 @@ export class DatePickerAdapter extends BaseDatePickerAdapter {
|
|
|
98
98
|
this._inputElement.setAttribute('aria-disabled', value.toString());
|
|
99
99
|
if (this._toggleElement) {
|
|
100
100
|
this._toggleElement.setAttribute('aria-disabled', value.toString());
|
|
101
|
-
if (
|
|
101
|
+
if (Object.prototype.hasOwnProperty.call(this._toggleElement, 'disabled')) {
|
|
102
102
|
this._toggleElement.disabled = value;
|
|
103
103
|
// The toggle element should never be in the tab order
|
|
104
104
|
this._toggleElement.tabIndex = -1;
|
|
@@ -34,6 +34,7 @@ export class DatePickerCore extends BaseDatePickerCore {
|
|
|
34
34
|
}
|
|
35
35
|
_onToday() {
|
|
36
36
|
const today = new Date();
|
|
37
|
+
today.setHours(0, 0, 0, 0);
|
|
37
38
|
this._tryMergeCurrentTime(today);
|
|
38
39
|
this._onDateSelected({ date: today, selected: true, type: 'date' });
|
|
39
40
|
}
|
|
@@ -78,7 +79,7 @@ export class DatePickerCore extends BaseDatePickerCore {
|
|
|
78
79
|
_openCalendar(emitOpenEvent) {
|
|
79
80
|
super._openCalendar(emitOpenEvent);
|
|
80
81
|
const currentValue = this._getCurrentValue();
|
|
81
|
-
if (
|
|
82
|
+
if (currentValue) {
|
|
82
83
|
this._adapter.goToCalendarDate(new Date(currentValue));
|
|
83
84
|
}
|
|
84
85
|
}
|
|
@@ -8,6 +8,7 @@ import { IDateInputMaskOptions } from '../core/mask/date-input-mask';
|
|
|
8
8
|
import { BaseDatePickerAdapter, IBaseDatePickerAdapter } from '../date-picker/base/base-date-picker-adapter';
|
|
9
9
|
import { IDatePickerCalendarDropdownConfig } from '../date-picker/base/base-date-picker-constants';
|
|
10
10
|
import { DateRangePickerComponent, IDateRangePickerComponent } from './date-range-picker';
|
|
11
|
+
import { IIconButtonComponent } from '../icon-button/icon-button';
|
|
11
12
|
export interface IDateRangePickerAdapter extends IBaseDatePickerAdapter {
|
|
12
13
|
initializeToMask(toOptions: IDateInputMaskOptions): void;
|
|
13
14
|
addToInputListener(type: string, listener: (event: Event) => void): void;
|
|
@@ -58,7 +59,7 @@ export declare class DateRangePickerAdapter extends BaseDatePickerAdapter<IDateR
|
|
|
58
59
|
setDisabled(isDisabled: boolean): void;
|
|
59
60
|
emitInputEvent(type: string, data?: any): void;
|
|
60
61
|
emitToInputEvent(type: string, data?: any): void;
|
|
61
|
-
protected _createToggleElement():
|
|
62
|
+
protected _createToggleElement(): IIconButtonComponent;
|
|
62
63
|
tryFocusInput(): void;
|
|
63
64
|
tryBlurInput(): void;
|
|
64
65
|
selectInputText(): void;
|
|
@@ -162,7 +162,7 @@ export class DateRangePickerAdapter extends BaseDatePickerAdapter {
|
|
|
162
162
|
this._fromInputElement.setAttribute('aria-disabled', isDisabled.toString());
|
|
163
163
|
if (this._toggleElement) {
|
|
164
164
|
this._toggleElement.setAttribute('aria-disabled', isDisabled.toString());
|
|
165
|
-
if (
|
|
165
|
+
if (Object.prototype.hasOwnProperty.call(this._toggleElement, 'disabled')) {
|
|
166
166
|
this._toggleElement.disabled = isDisabled;
|
|
167
167
|
// The toggle element should never be in the tab order
|
|
168
168
|
this._toggleElement.tabIndex = -1;
|
|
@@ -55,10 +55,10 @@ export class DateRangePickerCore extends BaseDatePickerCore {
|
|
|
55
55
|
this._formatToInputValue();
|
|
56
56
|
super._openCalendar(emitOpenEvent);
|
|
57
57
|
const currentValue = this._getCurrentValue();
|
|
58
|
-
if (
|
|
58
|
+
if (currentValue?.to) {
|
|
59
59
|
this._adapter.goToCalendarDate(new Date(currentValue.to));
|
|
60
60
|
}
|
|
61
|
-
else if (
|
|
61
|
+
else if (currentValue?.from) {
|
|
62
62
|
this._adapter.goToCalendarDate(new Date(currentValue.from));
|
|
63
63
|
}
|
|
64
64
|
}
|
|
@@ -82,6 +82,7 @@ export class DateRangePickerCore extends BaseDatePickerCore {
|
|
|
82
82
|
}
|
|
83
83
|
_onToday() {
|
|
84
84
|
const today = new Date();
|
|
85
|
+
today.setHours(0, 0, 0, 0);
|
|
85
86
|
this._tryMergeCurrentTime({ from: today });
|
|
86
87
|
const range = this._open ? new DateRange({ from: this._from || today, to: this._to || undefined }) : new DateRange({ from: today });
|
|
87
88
|
if (!this._isDateRangeAcceptable(range)) {
|
|
@@ -227,9 +228,7 @@ export class DateRangePickerCore extends BaseDatePickerCore {
|
|
|
227
228
|
onChange: (value) => this._handleToInput(value)
|
|
228
229
|
};
|
|
229
230
|
if (this._prepareMaskCallback) {
|
|
230
|
-
options.prepareCallback = (value, masked, flags, maskInstance) =>
|
|
231
|
-
return this._prepareMaskCallback.call(null, value, masked, flags, maskInstance);
|
|
232
|
-
};
|
|
231
|
+
options.prepareCallback = (value, masked, flags, maskInstance) => this._prepareMaskCallback.call(null, value, masked, flags, maskInstance);
|
|
233
232
|
}
|
|
234
233
|
this._adapter.initializeToMask(options);
|
|
235
234
|
}
|
|
@@ -61,13 +61,14 @@ export class DeprecatedIconButtonComponentDelegate extends BaseComponentDelegate
|
|
|
61
61
|
}
|
|
62
62
|
const type = this._config.options?.iconType || 'component';
|
|
63
63
|
switch (type) {
|
|
64
|
-
case 'font':
|
|
64
|
+
case 'font': {
|
|
65
65
|
const classes = Array.isArray(this._config.options.iconClass) ? this._config.options.iconClass : [ICON_CLASS_NAME];
|
|
66
66
|
this._buttonElement?.classList.add(...classes);
|
|
67
67
|
if (this._buttonElement) {
|
|
68
68
|
this._buttonElement.textContent = this._config.options.iconName;
|
|
69
69
|
}
|
|
70
70
|
break;
|
|
71
|
+
}
|
|
71
72
|
case 'component':
|
|
72
73
|
this._iconElement = document.createElement(ICON_CONSTANTS.elementName);
|
|
73
74
|
this._iconElement.name = this._config.options.iconName;
|