@lekoala/date-picker 0.5.0 → 0.5.1
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/README.md +15 -2
- package/custom-elements.json +42 -2
- package/dist/date-picker.js +187 -54
- package/dist/date-picker.min.js +13 -13
- package/dist/date-picker.standalone.min.js +13 -13
- package/dist/types/control-classes.d.ts +11 -1
- package/dist/types/control-classes.d.ts.map +1 -1
- package/dist/types/date-calendar.d.ts +26 -49
- package/dist/types/date-calendar.d.ts.map +1 -1
- package/dist/types/date-picker.d.ts +35 -59
- package/dist/types/date-picker.d.ts.map +1 -1
- package/dist/types/messages.d.ts +2 -0
- package/dist/types/messages.d.ts.map +1 -1
- package/dist/types/upgrade-properties.d.ts +8 -0
- package/dist/types/upgrade-properties.d.ts.map +1 -0
- package/docs/API.md +15 -3
- package/docs/DECISIONS.md +6 -0
- package/package.json +2 -2
- package/src/control-classes.js +36 -6
- package/src/date-calendar.js +89 -23
- package/src/date-picker.js +93 -35
- package/src/messages.js +12 -0
- package/src/upgrade-properties.js +14 -0
|
@@ -60,7 +60,35 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
60
60
|
_stopTracking: (() => void) | null;
|
|
61
61
|
_open: boolean;
|
|
62
62
|
_suppressFocusOpen: boolean;
|
|
63
|
-
|
|
63
|
+
/** @type {typeof import("./messages.js").DEFAULT_MESSAGES | null} */
|
|
64
|
+
_messages: typeof import("./messages.js").DEFAULT_MESSAGES | null;
|
|
65
|
+
/** @type {Partial<import("./control-classes.js").ControlClasses> | null} */
|
|
66
|
+
_controlClasses: Partial<import("./control-classes.js").ControlClasses> | null;
|
|
67
|
+
/** @type {(() => void) | null} */
|
|
68
|
+
_stopDefaultMessages: (() => void) | null;
|
|
69
|
+
/** @type {any} */
|
|
70
|
+
_source: any;
|
|
71
|
+
/** @type {any} */
|
|
72
|
+
_dateState: any;
|
|
73
|
+
/** @type {any} */
|
|
74
|
+
_renderDay: any;
|
|
75
|
+
/** @type {any} */
|
|
76
|
+
_isDateDisabled: any;
|
|
77
|
+
/** Public picker coordinate-space request. @type {"viewport" | "document"} */
|
|
78
|
+
_coordinateSpace: "viewport" | "document";
|
|
79
|
+
static observedAttributes: string[];
|
|
80
|
+
/** @public @param {Partial<import("./control-classes.js").ControlClasses>} classes */
|
|
81
|
+
static setDefaultControlClasses(classes: Partial<import("./control-classes.js").ControlClasses>): void;
|
|
82
|
+
/** @public */
|
|
83
|
+
static getDefaultControlClasses(): {
|
|
84
|
+
month: string;
|
|
85
|
+
year: string;
|
|
86
|
+
nav: string;
|
|
87
|
+
};
|
|
88
|
+
/** @public @param {Partial<typeof import("./messages.js").DEFAULT_MESSAGES>} messages */
|
|
89
|
+
static setDefaultMessages(messages: Partial<typeof import("./messages.js").DEFAULT_MESSAGES>): void;
|
|
90
|
+
/** @public */
|
|
91
|
+
static getDefaultMessages(): {
|
|
64
92
|
chooseDate: string;
|
|
65
93
|
changeDate: string;
|
|
66
94
|
previousMonth: string;
|
|
@@ -80,22 +108,6 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
80
108
|
rangeOrderStart: string;
|
|
81
109
|
rangeOrderEnd: string;
|
|
82
110
|
};
|
|
83
|
-
_controlClasses: {
|
|
84
|
-
month: string;
|
|
85
|
-
year: string;
|
|
86
|
-
nav: string;
|
|
87
|
-
};
|
|
88
|
-
/** @type {any} */
|
|
89
|
-
_source: any;
|
|
90
|
-
/** @type {any} */
|
|
91
|
-
_dateState: any;
|
|
92
|
-
/** @type {any} */
|
|
93
|
-
_renderDay: any;
|
|
94
|
-
/** @type {any} */
|
|
95
|
-
_isDateDisabled: any;
|
|
96
|
-
/** Public picker coordinate-space request. @type {"viewport" | "document"} */
|
|
97
|
-
_coordinateSpace: "viewport" | "document";
|
|
98
|
-
static observedAttributes: string[];
|
|
99
111
|
constructor();
|
|
100
112
|
_rangeMode(): boolean;
|
|
101
113
|
connectedCallback(): void;
|
|
@@ -146,54 +158,18 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
146
158
|
/** @public */
|
|
147
159
|
get open(): boolean;
|
|
148
160
|
/**
|
|
149
|
-
* Author classes for header controls;
|
|
161
|
+
* Author classes for header controls; omitted roles follow current global defaults.
|
|
150
162
|
* @public
|
|
151
163
|
* @returns {import("./control-classes.js").ControlClasses}
|
|
152
164
|
*/
|
|
153
165
|
get controlClasses(): import("./control-classes.js").ControlClasses;
|
|
154
166
|
/** @param {Partial<import("./control-classes.js").ControlClasses> | null} value */
|
|
155
167
|
set controlClasses(value: Partial<import("./control-classes.js").ControlClasses> | null);
|
|
156
|
-
/** @public */
|
|
157
|
-
get messages():
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
nextMonth: string;
|
|
162
|
-
month: string;
|
|
163
|
-
year: string;
|
|
164
|
-
calendar: string;
|
|
165
|
-
unavailable: string;
|
|
166
|
-
invalidDate: string;
|
|
167
|
-
unavailableDate: string;
|
|
168
|
-
formatHint: string;
|
|
169
|
-
week: string;
|
|
170
|
-
rangeStart: string;
|
|
171
|
-
rangeInRange: string;
|
|
172
|
-
rangeEnd: string;
|
|
173
|
-
rangeSingle: string;
|
|
174
|
-
rangeOrderStart: string;
|
|
175
|
-
rangeOrderEnd: string;
|
|
176
|
-
};
|
|
177
|
-
set messages(value: {
|
|
178
|
-
chooseDate: string;
|
|
179
|
-
changeDate: string;
|
|
180
|
-
previousMonth: string;
|
|
181
|
-
nextMonth: string;
|
|
182
|
-
month: string;
|
|
183
|
-
year: string;
|
|
184
|
-
calendar: string;
|
|
185
|
-
unavailable: string;
|
|
186
|
-
invalidDate: string;
|
|
187
|
-
unavailableDate: string;
|
|
188
|
-
formatHint: string;
|
|
189
|
-
week: string;
|
|
190
|
-
rangeStart: string;
|
|
191
|
-
rangeInRange: string;
|
|
192
|
-
rangeEnd: string;
|
|
193
|
-
rangeSingle: string;
|
|
194
|
-
rangeOrderStart: string;
|
|
195
|
-
rangeOrderEnd: string;
|
|
196
|
-
});
|
|
168
|
+
/** @public @returns {typeof import("./messages.js").DEFAULT_MESSAGES} */
|
|
169
|
+
get messages(): typeof import("./messages.js").DEFAULT_MESSAGES;
|
|
170
|
+
/** @param {Partial<typeof import("./messages.js").DEFAULT_MESSAGES> | null} value */
|
|
171
|
+
set messages(value: Partial<typeof import("./messages.js").DEFAULT_MESSAGES> | null);
|
|
172
|
+
_refreshMessages(): void;
|
|
197
173
|
/** @public @returns {any} */
|
|
198
174
|
get source(): any;
|
|
199
175
|
set source(value: any);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../src/date-picker.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../src/date-picker.js"],"names":[],"mappings":"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"}
|
package/dist/types/messages.d.ts
CHANGED
|
@@ -40,4 +40,6 @@ export declare function getDefaultMessages(): {
|
|
|
40
40
|
};
|
|
41
41
|
/** @param {Partial<typeof DEFAULT_MESSAGES>} messages */
|
|
42
42
|
export declare function setDefaultMessages(messages: Partial<typeof DEFAULT_MESSAGES>): void;
|
|
43
|
+
/** @param {() => void} listener */
|
|
44
|
+
export declare function subscribeDefaultMessages(listener: () => void): () => void;
|
|
43
45
|
//# sourceMappingURL=messages.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"messages.d.ts","sourceRoot":"","sources":["../../src/messages.js"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB;IAC3B,UAAU;IACV,UAAU;IACV,aAAa;IACb,SAAS;IACT,KAAK;IACL,IAAI;IACJ,QAAQ;IACR,WAAW;IACX,WAAW;IACX,eAAe;IACf,UAAU;IACV,IAAI;IACJ,UAAU;IACV,YAAY;IACZ,QAAQ;IACR,WAAW;IACX,eAAe;IACf,aAAa;CACd,CAAC;AAIF,wBAAgB,kBAAkB;;;;;;;;;;;;;;;;;;;EAEjC;AAED,yDAAyD;AACzD,wBAAgB,kBAAkB,CAAC,QAAQ,EAD/B,OAAO,CAAC,OAAO,gBAAgB,CACA,
|
|
1
|
+
{"version":3,"file":"messages.d.ts","sourceRoot":"","sources":["../../src/messages.js"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB;IAC3B,UAAU;IACV,UAAU;IACV,aAAa;IACb,SAAS;IACT,KAAK;IACL,IAAI;IACJ,QAAQ;IACR,WAAW;IACX,WAAW;IACX,eAAe;IACf,UAAU;IACV,IAAI;IACJ,UAAU;IACV,YAAY;IACZ,QAAQ;IACR,WAAW;IACX,eAAe;IACf,aAAa;CACd,CAAC;AAIF,wBAAgB,kBAAkB;;;;;;;;;;;;;;;;;;;EAEjC;AAED,yDAAyD;AACzD,wBAAgB,kBAAkB,CAAC,QAAQ,EAD/B,OAAO,CAAC,OAAO,gBAAgB,CACA,QAG1C;AAKD,mCAAmC;AACnC,wBAAgB,wBAAwB,CAAC,QAAQ,EADrC,MAAM,IAC+B,cAKhD"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Replay properties assigned before custom-element definition through their setters.
|
|
3
|
+
* Call only once the element is ready to accept the listed properties.
|
|
4
|
+
* @param {HTMLElement} element
|
|
5
|
+
* @param {string[]} properties
|
|
6
|
+
*/
|
|
7
|
+
export declare function upgradeProperties(element: HTMLElement, properties: string[]): void;
|
|
8
|
+
//# sourceMappingURL=upgrade-properties.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"upgrade-properties.d.ts","sourceRoot":"","sources":["../../src/upgrade-properties.js"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAH9B,WAG8B,EAAE,UAAU,EAF1C,MAAM,EAEoC,QAOpD"}
|
package/docs/API.md
CHANGED
|
@@ -366,7 +366,7 @@ ISO input is accepted as a fallback even when the locale display is different.
|
|
|
366
366
|
|
|
367
367
|
## Locales
|
|
368
368
|
|
|
369
|
-
`setDefaultMessages(partial)` merges global defaults
|
|
369
|
+
`setDefaultMessages(partial)` merges global defaults and refreshes connected elements without a messages override, including picker field validation, triggers and popup labels. `getDefaultMessages()` returns a copy. Assigning `element.messages` merges that assignment with the current global defaults, not with the previous assignment. Assigning `null` resumes following global defaults.
|
|
370
370
|
|
|
371
371
|
Control-message dictionaries ship per locale and can be attached through the `messages` property:
|
|
372
372
|
|
|
@@ -415,9 +415,21 @@ Public helpers:
|
|
|
415
415
|
|
|
416
416
|
## Header control styling
|
|
417
417
|
|
|
418
|
-
`setDefaultControlClasses(partial)` and `getDefaultControlClasses()` are named package exports, alongside `setDefaultMessages()` / `getDefaultMessages()`.
|
|
418
|
+
`setDefaultControlClasses(partial)` and `getDefaultControlClasses()` are named package exports, alongside `setDefaultMessages()` / `getDefaultMessages()`. Class defaults are resolved per role when used and refresh connected elements with inherited roles. The getter returns a copy.
|
|
419
419
|
|
|
420
|
-
|
|
420
|
+
The same four functions are available as static methods on both `DateCalendarElement` and `DatePickerElement`. For the classic build, call them through the registry after the script has loaded:
|
|
421
|
+
|
|
422
|
+
```js
|
|
423
|
+
const Picker = customElements.get("date-picker");
|
|
424
|
+
Picker.setDefaultControlClasses({ month: "select sm", year: "input sm", nav: "btn outline sm icon-only" });
|
|
425
|
+
Picker.setDefaultMessages({ chooseDate: "Choose a date" });
|
|
426
|
+
const classes = Picker.getDefaultControlClasses();
|
|
427
|
+
const messages = customElements.get("date-calendar").getDefaultMessages();
|
|
428
|
+
```
|
|
429
|
+
|
|
430
|
+
Both constructors delegate to the same defaults as the named ESM exports within that build. Class defaults update inherited roles on connected elements; explicitly assigned roles stay unchanged. Message defaults update elements without a messages override. All writable public properties assigned before definition are replayed through their setters on connection. Picker `value` and `range` are replayed after its fields and controllers are initialized; `range` still requires the `range` attribute. Read-only properties remain read-only.
|
|
431
|
+
|
|
432
|
+
Both elements expose `controlClasses`. Assignment stores only the normalized roles provided, replacing the previous partial map. Each omitted role follows its current global default when read or rendered, regardless of assignment order. An empty string explicitly restores the default skin for a role; `null` resumes following global defaults. The picker forwards only its own partial map to its shared calendar, including in range mode. There is no HTML attribute.
|
|
421
433
|
|
|
422
434
|
Each non-empty role uses only the author's skin (including caret, hover, disabled and focus). Grid layout, year track width and month truncation stay component-owned. Day cells and the picker trigger are excluded. Class lists are whitespace-normalized and deduplicated; tokens containing control characters or using the reserved `dp-*` namespace are ignored. Arbitrary utility classes such as `[&>svg]:size-4`, `data-[state=open]:bg-muted` and `aria-[disabled=true]:opacity-50` are preserved. Values are HTML-escaped on rendering, including quotes and HTML delimiters. Reassigning equivalent normalized classes leaves the rendered controls and grid intact.
|
|
423
435
|
|
package/docs/DECISIONS.md
CHANGED
|
@@ -66,3 +66,9 @@ Pointing and typing are different contracts, deliberately.
|
|
|
66
66
|
`controlClasses` and `setDefaultControlClasses()` are the public hooks for styling the month, year and navigation roles with a host design system. A role with non-empty author classes receives no library skin, including in forced colors. Layout remains component-owned. Roles without author classes retain the default skin.
|
|
67
67
|
|
|
68
68
|
The `.dp-*` namespace stays internal (D3); it is reserved and ignored in author class lists. Day grid cells and the picker trigger are outside this API. There is no HTML attribute.
|
|
69
|
+
|
|
70
|
+
## D8 — Defaults are accessible through registered constructors
|
|
71
|
+
|
|
72
|
+
Both element classes expose static `setDefaultControlClasses`, `getDefaultControlClasses`, `setDefaultMessages` and `getDefaultMessages` methods delegating to the existing module functions. This additive API makes defaults available in classic builds through `customElements.get()` without introducing a global. The constructors share one defaults state within a build. Instances without overrides resolve current defaults when used, and connected instances refresh when defaults change. Disconnected instances unsubscribe and read current defaults on reconnection. For `controlClasses`, an assignment stores only the normalized roles provided: omitted roles follow current global defaults at read/render time, an explicit empty string restores the library skin for that role, and `null` follows all defaults. Global class changes also refresh instances with partial overrides. Message assignments merge with current defaults and pin that instance setting; `null` resumes following global message defaults. Pickers forward only their own overrides to their calendar, preserving global inheritance.
|
|
73
|
+
|
|
74
|
+
Writable public properties assigned before element definition are replayed through their setters on connection. Options are applied before building controls; picker `value` and `range` wait for the fields and range controller. The display, focus, activation and selection contracts remain distinct.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lekoala/date-picker",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.1",
|
|
4
4
|
"description": "Native-first date picker and inline calendar primitives",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": [
|
|
@@ -143,7 +143,7 @@
|
|
|
143
143
|
"typecheck": "tsc -p jsconfig.json",
|
|
144
144
|
"types": "tsc -p tsconfig.types.json",
|
|
145
145
|
"test": "bun test test/unit",
|
|
146
|
-
"test:syntax": "node --check src/date.js && node --check src/intl.js && node --check src/calendar-model.js && node --check src/source.js && node --check src/messages.js && node --check src/control-classes.js && node --check src/date-calendar.js && node --check src/date-field.js && node --check src/date-picker.js && node --check src/date-range.js && node --check src/time.js && node --check src/index.js && node --check src/define.js",
|
|
146
|
+
"test:syntax": "node --check src/date.js && node --check src/intl.js && node --check src/calendar-model.js && node --check src/source.js && node --check src/messages.js && node --check src/control-classes.js && node --check src/upgrade-properties.js && node --check src/date-calendar.js && node --check src/date-field.js && node --check src/date-picker.js && node --check src/date-range.js && node --check src/time.js && node --check src/index.js && node --check src/define.js",
|
|
147
147
|
"test:types": "tsc -p test/types/tsconfig.json",
|
|
148
148
|
"test:browser": "playwright test browser --project chromium",
|
|
149
149
|
"test:browser:accessibility": "playwright test test/browser/picker.spec.js test/browser/focus.spec.js test/browser/calendar.spec.js test/browser/form-state.spec.js test/browser/surfaces.spec.js",
|
package/src/control-classes.js
CHANGED
|
@@ -32,19 +32,49 @@ export function getDefaultControlClasses() {
|
|
|
32
32
|
return { ...defaults };
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
-
/**
|
|
36
|
-
|
|
37
|
-
|
|
35
|
+
/**
|
|
36
|
+
* Preserve omitted roles so they can inherit defaults when rendered.
|
|
37
|
+
* @param {Partial<ControlClasses> | null} classes
|
|
38
|
+
* @returns {Partial<ControlClasses> | null}
|
|
39
|
+
*/
|
|
40
|
+
export function normalizeControlClasses(classes) {
|
|
41
|
+
if (classes == null) return null;
|
|
42
|
+
/** @type {Partial<ControlClasses>} */
|
|
43
|
+
const result = {};
|
|
38
44
|
for (const role of /** @type {const} */ (["month", "year", "nav"])) {
|
|
39
|
-
if (
|
|
45
|
+
if (Object.hasOwn(classes, role)) result[role] = normalizeControlClass(classes[role]);
|
|
40
46
|
}
|
|
41
47
|
return result;
|
|
42
48
|
}
|
|
43
49
|
|
|
50
|
+
/** @param {Partial<ControlClasses> | null} classes */
|
|
51
|
+
export function usesDefaultControlClasses(classes) {
|
|
52
|
+
return classes == null || ["month", "year", "nav"].some((role) => !Object.hasOwn(classes, role));
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
/** @param {Partial<ControlClasses> | null} classes */
|
|
56
|
+
export function resolveControlClasses(classes) {
|
|
57
|
+
return { ...getDefaultControlClasses(), ...normalizeControlClasses(classes) };
|
|
58
|
+
}
|
|
59
|
+
|
|
44
60
|
/**
|
|
45
|
-
* Set defaults
|
|
61
|
+
* Set defaults and refresh connected elements with inherited control roles.
|
|
46
62
|
* @param {Partial<ControlClasses>} classes
|
|
47
63
|
*/
|
|
48
64
|
export function setDefaultControlClasses(classes) {
|
|
49
|
-
|
|
65
|
+
const next = resolveControlClasses(classes);
|
|
66
|
+
if (sameControlClasses(defaults, next)) return;
|
|
67
|
+
defaults = next;
|
|
68
|
+
for (const listener of listeners) listener();
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
/** @type {Set<() => void>} */
|
|
72
|
+
const listeners = new Set();
|
|
73
|
+
|
|
74
|
+
/** @param {() => void} listener */
|
|
75
|
+
export function subscribeDefaultControlClasses(listener) {
|
|
76
|
+
listeners.add(listener);
|
|
77
|
+
return () => {
|
|
78
|
+
listeners.delete(listener);
|
|
79
|
+
};
|
|
50
80
|
}
|
package/src/date-calendar.js
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
import { CalendarModel } from "./calendar-model.js";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
getDefaultControlClasses,
|
|
4
|
+
normalizeControlClasses,
|
|
5
|
+
resolveControlClasses,
|
|
6
|
+
sameControlClasses,
|
|
7
|
+
setDefaultControlClasses,
|
|
8
|
+
subscribeDefaultControlClasses,
|
|
9
|
+
usesDefaultControlClasses,
|
|
10
|
+
} from "./control-classes.js";
|
|
3
11
|
import {
|
|
4
12
|
addDays,
|
|
5
13
|
clampDate,
|
|
@@ -21,8 +29,9 @@ import {
|
|
|
21
29
|
resolveLocale,
|
|
22
30
|
weekdayNames,
|
|
23
31
|
} from "./intl.js";
|
|
24
|
-
import { getDefaultMessages } from "./messages.js";
|
|
32
|
+
import { getDefaultMessages, setDefaultMessages, subscribeDefaultMessages } from "./messages.js";
|
|
25
33
|
import { normalizeDateStates } from "./source.js";
|
|
34
|
+
import { upgradeProperties } from "./upgrade-properties.js";
|
|
26
35
|
|
|
27
36
|
let uid = 0;
|
|
28
37
|
|
|
@@ -128,6 +137,26 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
128
137
|
"month-format",
|
|
129
138
|
];
|
|
130
139
|
|
|
140
|
+
/** @public @param {Partial<import("./control-classes.js").ControlClasses>} classes */
|
|
141
|
+
static setDefaultControlClasses(classes) {
|
|
142
|
+
setDefaultControlClasses(classes);
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
/** @public */
|
|
146
|
+
static getDefaultControlClasses() {
|
|
147
|
+
return getDefaultControlClasses();
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
/** @public @param {Partial<typeof import("./messages.js").DEFAULT_MESSAGES>} messages */
|
|
151
|
+
static setDefaultMessages(messages) {
|
|
152
|
+
setDefaultMessages(messages);
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
/** @public */
|
|
156
|
+
static getDefaultMessages() {
|
|
157
|
+
return getDefaultMessages();
|
|
158
|
+
}
|
|
159
|
+
|
|
131
160
|
constructor() {
|
|
132
161
|
super();
|
|
133
162
|
this._id = `date-calendar-${++uid}`;
|
|
@@ -158,8 +187,14 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
158
187
|
this._paintedPreview = false;
|
|
159
188
|
/** @type {Map<string, DateState>} States of the current rendered grid. */
|
|
160
189
|
this._renderedStates = new Map();
|
|
161
|
-
|
|
162
|
-
this.
|
|
190
|
+
/** @type {typeof import("./messages.js").DEFAULT_MESSAGES | null} */
|
|
191
|
+
this._messages = null;
|
|
192
|
+
/** @type {Partial<import("./control-classes.js").ControlClasses> | null} */
|
|
193
|
+
this._controlClasses = null;
|
|
194
|
+
/** @type {(() => void) | null} */
|
|
195
|
+
this._stopDefaultMessages = null;
|
|
196
|
+
/** @type {(() => void) | null} */
|
|
197
|
+
this._stopDefaultControlClasses = null;
|
|
163
198
|
this._onClick = this._onClick.bind(this);
|
|
164
199
|
this._onChange = this._onChange.bind(this);
|
|
165
200
|
this._onKeyDown = this._onKeyDown.bind(this);
|
|
@@ -168,16 +203,46 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
168
203
|
|
|
169
204
|
connectedCallback() {
|
|
170
205
|
if (this._connected) return;
|
|
206
|
+
upgradeProperties(this, [
|
|
207
|
+
"locale",
|
|
208
|
+
"min",
|
|
209
|
+
"max",
|
|
210
|
+
"firstDay",
|
|
211
|
+
"selection",
|
|
212
|
+
"monthFormat",
|
|
213
|
+
"fixedWeeks",
|
|
214
|
+
"showWeekNumbers",
|
|
215
|
+
"controlClasses",
|
|
216
|
+
"messages",
|
|
217
|
+
"source",
|
|
218
|
+
"dateState",
|
|
219
|
+
"renderDay",
|
|
220
|
+
"isDateDisabled",
|
|
221
|
+
"highlightedRange",
|
|
222
|
+
"value",
|
|
223
|
+
"display",
|
|
224
|
+
]);
|
|
225
|
+
this._syncModel();
|
|
226
|
+
upgradeProperties(this, ["focusedDate"]);
|
|
227
|
+
this._stopDefaultControlClasses = subscribeDefaultControlClasses(() => {
|
|
228
|
+
if (usesDefaultControlClasses(this._controlClasses)) this.render();
|
|
229
|
+
});
|
|
230
|
+
this._stopDefaultMessages = subscribeDefaultMessages(() => {
|
|
231
|
+
if (this._messages === null) this.render();
|
|
232
|
+
});
|
|
171
233
|
this._connected = true;
|
|
172
234
|
this.addEventListener("click", this._onClick);
|
|
173
235
|
this.addEventListener("change", this._onChange);
|
|
174
236
|
this.addEventListener("keydown", this._onKeyDown);
|
|
175
237
|
this.addEventListener("focusin", this._onFocusIn);
|
|
176
|
-
this._syncModel();
|
|
177
238
|
this.render();
|
|
178
239
|
}
|
|
179
240
|
|
|
180
241
|
disconnectedCallback() {
|
|
242
|
+
this._stopDefaultControlClasses?.();
|
|
243
|
+
this._stopDefaultControlClasses = null;
|
|
244
|
+
this._stopDefaultMessages?.();
|
|
245
|
+
this._stopDefaultMessages = null;
|
|
181
246
|
this._connected = false;
|
|
182
247
|
this._loadController?.abort();
|
|
183
248
|
this._loadController = null;
|
|
@@ -328,29 +393,30 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
328
393
|
}
|
|
329
394
|
|
|
330
395
|
/**
|
|
331
|
-
* Author classes for header controls;
|
|
396
|
+
* Author classes for header controls; omitted roles follow current global defaults.
|
|
332
397
|
* @public
|
|
333
398
|
* @returns {import("./control-classes.js").ControlClasses}
|
|
334
399
|
*/
|
|
335
400
|
get controlClasses() {
|
|
336
|
-
return
|
|
401
|
+
return resolveControlClasses(this._controlClasses);
|
|
337
402
|
}
|
|
338
403
|
|
|
339
404
|
/** @param {Partial<import("./control-classes.js").ControlClasses> | null} value */
|
|
340
405
|
set controlClasses(value) {
|
|
341
|
-
const
|
|
342
|
-
|
|
343
|
-
this.
|
|
406
|
+
const previous = this.controlClasses;
|
|
407
|
+
this._controlClasses = normalizeControlClasses(value);
|
|
408
|
+
if (sameControlClasses(previous, this.controlClasses)) return;
|
|
344
409
|
if (this._connected) this.render();
|
|
345
410
|
}
|
|
346
411
|
|
|
347
|
-
/** @public */
|
|
412
|
+
/** @public @returns {typeof import("./messages.js").DEFAULT_MESSAGES} */
|
|
348
413
|
get messages() {
|
|
349
|
-
return this._messages;
|
|
414
|
+
return this._messages ?? getDefaultMessages();
|
|
350
415
|
}
|
|
351
416
|
|
|
417
|
+
/** @param {Partial<typeof import("./messages.js").DEFAULT_MESSAGES> | null} value */
|
|
352
418
|
set messages(value) {
|
|
353
|
-
this._messages = { ...getDefaultMessages(), ...
|
|
419
|
+
this._messages = value == null ? null : { ...getDefaultMessages(), ...value };
|
|
354
420
|
if (this._connected) this.render();
|
|
355
421
|
}
|
|
356
422
|
|
|
@@ -648,8 +714,8 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
648
714
|
return [
|
|
649
715
|
formatLongDate(date, this.locale),
|
|
650
716
|
description,
|
|
651
|
-
rangeLabel ? this.
|
|
652
|
-
state.disabled ? this.
|
|
717
|
+
rangeLabel ? this.messages[rangeLabel] : "",
|
|
718
|
+
state.disabled ? this.messages.unavailable : "",
|
|
653
719
|
]
|
|
654
720
|
.filter(Boolean)
|
|
655
721
|
.join(". ");
|
|
@@ -853,7 +919,7 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
853
919
|
const maxYearAttr = this.max ? ` max="${Number(this.max.slice(0, 4))}"` : "";
|
|
854
920
|
const showWeeks = this.showWeekNumbers && this.firstDay === 1;
|
|
855
921
|
const weekHeader = showWeeks
|
|
856
|
-
? `<th scope="col" class="dp-week-heading" abbr="${escapeHtml(this.
|
|
922
|
+
? `<th scope="col" class="dp-week-heading" abbr="${escapeHtml(this.messages.week)}">#</th>`
|
|
857
923
|
: "";
|
|
858
924
|
|
|
859
925
|
const monthOptions = names
|
|
@@ -906,14 +972,14 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
906
972
|
// select via `data-year-first`.
|
|
907
973
|
const yearFirst = monthYearOrder(locale)[0] === "year";
|
|
908
974
|
this.toggleAttribute("data-year-first", yearFirst);
|
|
909
|
-
const classes = this.
|
|
975
|
+
const classes = this.controlClasses;
|
|
910
976
|
const monthClass = escapeHtml(classes.month || "dp-skin");
|
|
911
977
|
const yearClass = escapeHtml(classes.year || "dp-skin");
|
|
912
978
|
const navClass = escapeHtml(classes.nav || "dp-skin");
|
|
913
|
-
const monthControl = `<label class="dp-visually-hidden" for="${this._id}-month">${escapeHtml(this.
|
|
914
|
-
<select id="${this._id}-month" class="dp-month-select ${monthClass}" aria-label="${escapeHtml(this.
|
|
915
|
-
const yearControl = `<label class="dp-visually-hidden" for="${this._id}-year">${escapeHtml(this.
|
|
916
|
-
<input id="${this._id}-year" class="dp-year-input ${yearClass}" type="number" inputmode="numeric" value="${displayYear}"${minYearAttr}${maxYearAttr} aria-label="${escapeHtml(this.
|
|
979
|
+
const monthControl = `<label class="dp-visually-hidden" for="${this._id}-month">${escapeHtml(this.messages.month)}</label>
|
|
980
|
+
<select id="${this._id}-month" class="dp-month-select ${monthClass}" aria-label="${escapeHtml(this.messages.month)}">${monthOptions}</select>`;
|
|
981
|
+
const yearControl = `<label class="dp-visually-hidden" for="${this._id}-year">${escapeHtml(this.messages.year)}</label>
|
|
982
|
+
<input id="${this._id}-year" class="dp-year-input ${yearClass}" type="number" inputmode="numeric" value="${displayYear}"${minYearAttr}${maxYearAttr} aria-label="${escapeHtml(this.messages.year)}">`;
|
|
917
983
|
|
|
918
984
|
this._rendering = true;
|
|
919
985
|
this.innerHTML = `
|
|
@@ -921,8 +987,8 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
921
987
|
<div class="dp-calendar-header">
|
|
922
988
|
${yearFirst ? yearControl : monthControl}
|
|
923
989
|
${yearFirst ? monthControl : yearControl}
|
|
924
|
-
<button type="button" class="dp-nav dp-prev ${navClass}" data-calendar-action="previous" aria-label="${escapeHtml(this.
|
|
925
|
-
<button type="button" class="dp-nav dp-next ${navClass}" data-calendar-action="next" aria-label="${escapeHtml(this.
|
|
990
|
+
<button type="button" class="dp-nav dp-prev ${navClass}" data-calendar-action="previous" aria-label="${escapeHtml(this.messages.previousMonth)}"${prevDisabled ? " disabled" : ""}><svg aria-hidden="true" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="m4 10 4-4 4 4"/></svg></button>
|
|
991
|
+
<button type="button" class="dp-nav dp-next ${navClass}" data-calendar-action="next" aria-label="${escapeHtml(this.messages.nextMonth)}"${nextDisabled ? " disabled" : ""}><svg aria-hidden="true" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="m4 6 4 4 4-4"/></svg></button>
|
|
926
992
|
</div>
|
|
927
993
|
<h2 id="${headingId}" class="dp-calendar-heading dp-visually-hidden" aria-live="polite">${escapeHtml(formatMonthYear(`${display}-15`, locale))}</h2>
|
|
928
994
|
<table id="${gridId}" class="dp-grid" role="grid" aria-labelledby="${headingId}">
|