@lekoala/date-picker 0.2.0 → 0.3.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.
- package/README.md +6 -4
- package/custom-elements.json +12 -2
- package/dist/date-picker.css +153 -105
- package/dist/date-picker.js +166 -78
- package/dist/date-picker.min.css +1 -1
- package/dist/date-picker.min.js +13 -13
- package/dist/date-picker.standalone.min.js +167 -119
- package/dist/types/date-calendar.d.ts.map +1 -1
- package/dist/types/date-field.d.ts +3 -1
- package/dist/types/date-field.d.ts.map +1 -1
- package/dist/types/date-picker.d.ts +62 -5
- package/dist/types/date-picker.d.ts.map +1 -1
- package/docs/ACCESSIBILITY.md +17 -9
- package/docs/API.md +21 -2
- package/docs/ARCHITECTURE.md +16 -2
- package/docs/AT-CHECKLIST.md +1 -1
- package/docs/DECISIONS.md +2 -0
- package/docs/MIGRATION-FLATPICKR.md +1 -1
- package/package.json +4 -4
- package/src/date-calendar.js +3 -6
- package/src/date-field.js +12 -4
- package/src/date-picker.css +153 -105
- package/src/date-picker.js +206 -75
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-calendar.d.ts","sourceRoot":"","sources":["../../src/date-calendar.js"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"date-calendar.d.ts","sourceRoot":"","sources":["../../src/date-calendar.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAmFhD,YAAqC,SAAS,GAApC;IAAC,KAAK,EAAC,MAAM,CAAC;IAAA,GAAG,EAAC,MAAM,CAAA;CAAC,CAAW;AAC9C,YAA8E,SAAS,GAA7E,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG;IAAC,QAAQ,CAAC,EAAC,OAAO,CAAC;IAAC,WAAW,CAAC,EAAC,MAAM,CAAA;CAAC,CAAW;AACvF,YAAyF,UAAU,GAAzF,CAAC,KAAK,EAAC,SAAS,EAAE,OAAO,EAAC;IAAC,MAAM,EAAC,WAAW,CAAA;CAAC,KAAK,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,CAAY;AACnG,YAA0C,UAAU,GAA1C,UAAU,GAAG;IAAC,IAAI,EAAC,UAAU,CAAA;CAAC,CAAY;AACpD,YAAgF,iBAAiB,GAAvF,CAAC,IAAI,EAAC,MAAM,EAAE,WAAW,EAAC,SAAS,KAAK,SAAS,GAAG,IAAI,GAAG,SAAS,CAAmB;AACjG,YAA8E,WAAW,GAA/E,CAAC,IAAI,EAAC,MAAM,EAAE,KAAK,EAAC,SAAS,KAAK,IAAI,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,CAAa;AACzF,YAAoC,qBAAqB,GAA/C,CAAC,IAAI,EAAC,MAAM,KAAK,OAAO,CAAuB;AAhB7D;;;;;;;;;GASG;AACH,qDAAqD;AACrD,8FAA8F;AAC9F,0GAA0G;AAC1G,2DAA2D;AAC3D,wGAAwG;AACxG,gGAAgG;AAChG,gEAAgE;AAEhE,qBAAa,mBAAoB,SAAQ,WAAW;IAgB3C,GAAG;IACH,MAAM;IACN,UAAU;IACV,UAAU;IACf,gCAAgC;IAC3B,OAAO,EADD,UAAU,GAAG,IAAI;IAEvB,aAAa;IACb,aAAa;IACb,eAAe;IACf,WAAW;IAChB,gEAAgE;IAC3D,eAAe,EADT,OAAO,CAAC,QAAQ,GAAG,WAAW,GAAG,QAAQ,CAAC,GAAG,IAAI;IAE5D,uCAAuC;IAClC,UAAU,EADJ,iBAAiB,GAAG,IAAI;IAEnC,iCAAiC;IAC5B,UAAU,EADJ,WAAW,GAAG,IAAI;IAE7B,2CAA2C;IACtC,eAAe,EADT,qBAAqB,GAAG,IAAI;IAEvC,wBAAwB;IACnB,iBAAiB,EADX,SAAS;IAEf,SAAS;;;;;;;;;;;;;;;;;;;;IAnChB,MAAM,CAAC,kBAAkB,WAWvB;IAEF,cA2BC;IAED,iBAAiB,SAShB;IAED,oBAAoB,SAUnB;IAED,wBAAwB,SAIvB;IAED,cAAc;IACd,IAAI,MAAM,WAET;IAED,IAAI,MAAM,CAAC,KAAK,QAAA,EAGf;IAED,cAAc;IACd,IAAI,KAAK,WAER;IAED,IAAI,KAAK,CAAC,KAAK,QAAA,EAOd;IAED,cAAc;IACd,IAAI,OAAO,WAEV;IAED,IAAI,OAAO,CAAC,KAAK,QAAA,EAEhB;IAED,cAAc;IACd,IAAI,WAAW,WAEd;IAED,IAAI,WAAW,CAAC,KAAK,QAAA,EAIpB;IAED,cAAc;IACd,IAAI,GAAG,WAGN;IAED,IAAI,GAAG,CAAC,KAAK,QAAA,EAGZ;IAED,cAAc;IACd,IAAI,GAAG,WAGN;IAED,IAAI,GAAG,CAAC,KAAK,QAAA,EAGZ;IAED,cAAc;IACd,IAAI,QAAQ,WAEX;IAED,IAAI,QAAQ,CAAC,KAAK,QAAA,EAEjB;IAED,cAAc;IACd,IAAI,SAAS,sBAEZ;IAED,IAAI,SAAS,CAAC,KAAK,QAAA,EAElB;IAED,sLAAsL;IACtL,IAAI,WAAW,qBAEd;IAED,IAAI,WAAW,CAAC,KAAK,QAAA,EAGpB;IAED,cAAc;IACd,IAAI,gBAAgB;eA/KD,MAAM;aAAK,MAAM;MAiLnC;IAED,IAAI,gBAAgB,CAAC,KAAK;eAnLP,MAAM;aAAK,MAAM;KAmLV,EAKzB;IAED,cAAc;IACd,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,CAAC,KAAK,SAAA,EAEnB;IAED,cAAc;IACd,IAAI,eAAe,YAElB;IAED,IAAI,eAAe,CAAC,KAAK,SAAA,EAExB;IAED,cAAc;IACd,IAAI,QAAQ;;;;;;;;;;;;;;;;;;;MAEX;IAED,IAAI,QAAQ,CAAC,KAAK;;;;;;;;;;;;;;;;;;;KAAA,EAGjB;IAED,2CAA2C;IAC3C,IAAI,MAAM,IADY,UAAU,GAAG,IAAI,CAGtC;IAED,IAAI,MAAM,CAAC,KAAK,EALM,UAAU,GAAG,IAKnB,EAGf;IAED,kDAAkD;IAClD,IAAI,SAAS,IADS,iBAAiB,GAAG,IAAI,CAG7C;IAED,IAAI,SAAS,CAAC,KAAK,EALG,iBAAiB,GAAG,IAKvB,EAGlB;IAED,4CAA4C;IAC5C,IAAI,SAAS,IADS,WAAW,GAAG,IAAI,CAGvC;IAED,IAAI,SAAS,CAAC,KAAK,EALG,WAAW,GAAG,IAKjB,EAGlB;IAED,sDAAsD;IACtD,IAAI,cAAc,IADI,qBAAqB,GAAG,IAAI,CAGjD;IAED,IAAI,cAAc,CAAC,KAAK,EALF,qBAAqB,GAAG,IAKtB,EAGvB;IAED,UAAU,SAkBT;IAED,iDAAiD;IACjD,QAAQ,CAAC,IAAI,EADD,MACC,EAAE,KAAK,EADa,MACb,QAQnB;IAED,4BAA4B;IAC5B,MAAM,CAAC,KAAK,EADA,MACA,UAEX;IAED,MAAM,CAAC,OAAO,SAAe,cAW5B;IAED,qDAAqD;IACrD,eAAe,CAAC,OAAO,EADX,WACW,GADoB,MAAM,CAahD;IAED,gCAAgC;IAChC,MAAM,CAAC,OAAO,AADV,CAAyB,EAAjB,MACiB;QAKlB,KAAK;QAAY,GAAG;MAC9B;IAED,mCAAmC;IACnC,YAAY,CAAC,IAAI,EADG,MACH,OAYhB;IAED,cAAc;IACR,aAAa,kBAWlB;IAED;0DACsD;IAChD,UAAU,CAAC,IAAI,EADV,MACU,GADa,OAAO,CAAC,OAAO,CAAC,CAIjD;IAED,gHAAgH;IAC1G,YAAY,CAAC,OAAO,EADd,MACc,EAAE,QAAQ,AADR,CAA4B,EAApB,OACO,GADuB,OAAO,CAAC,QAAQ,GAAG,WAAW,GAAG,QAAQ,CAAC,CA0C3G;IAED,iEAAiE;IACjE,WAAW,CAAC,OAAO,EADP,MACO,EAAE,OAAO,AADA,CAAkC,EAA1B;QAAC,IAAI,CAAC,EAAC,OAAO,CAAA;KACjB,UAShC;IAED,kBAAkB,SAQjB;IAED,cAAc;IACd,aAAa,WAEZ;IAED,cAAc;IACd,SAAS,WAER;IAED,2EAA2E;IAC3E,SAAS,CAAC,IAAI,EADM,MACN,EAAE,OAAO,AADU,CAAuC,EAA/B;QAAC,SAAS,CAAC,EAAC,OAAO,CAAA;KAChC,QAgB3B;IAED,iFAAiF;IACjF,aAAa,CAAC,QAAQ,EADV,MACU,EAAE,IAAI,EADS,MACT,EAAE,SAAS,AADW,CAA4B,EAApB,OACZ,QAU7C;IAED,8DAA8D;IAC9D,iBAAiB,CAAC,aAAa,EADnB,MACmB,EAAE,SAAS,EADA,MACA,WAiBzC;IAED,cAAc;IACd,SAAS,SAGR;IAED,uDAAuD;IACjD,SAAS,CAAC,IAAI,EADR,MACQ,GADe,OAAO,CAAC,OAAO,CAAC,CAkClD;IAED,gCAAgC;IAChC,QAAQ,CAAC,KAAK,EADF,UACE,QAmBb;IAED,2BAA2B;IAC3B,SAAS,CAAC,KAAK,EADH,KACG,QAcd;IAED,gCAAgC;IAChC,UAAU,CAAC,KAAK,EADJ,UACI,QAKf;IAED,mCAAmC;IACnC,UAAU,CAAC,KAAK,EADJ,aACI,QAgCf;IAED,sCAAsC;IACtC,MAAM,CAAC,IAAI,AADC,CAAuB,EAAf,OACF,QAoIjB;CACF"}
|
|
@@ -66,7 +66,9 @@ export declare class DateFieldController {
|
|
|
66
66
|
/** Whether the user edited the visible text since the last application. */
|
|
67
67
|
get isDirty(): boolean;
|
|
68
68
|
/** Live text input: the raw text no longer matches the canonical value, so
|
|
69
|
-
* the hidden ISO must not submit it.
|
|
69
|
+
* the hidden ISO must not submit it. A text that formats back to the current
|
|
70
|
+
* canonical value (e.g. re-applied by a calendar pick) keeps the ISO value
|
|
71
|
+
* valid; invalidating in-flight commits first still drops stale async work. */
|
|
70
72
|
handleInput(): void;
|
|
71
73
|
/**
|
|
72
74
|
* Commit the visible text. Returns the parsed canonical date on success, the
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-field.d.ts","sourceRoot":"","sources":["../../src/date-field.js"],"names":[],"mappings":"AAGA;;;;;;;;;GASG;AACH,qBAAa,mBAAmB;IAMvB,KAAK;IACL,QAAQ;IACR,OAAO;;;;;;IACZ,sCAAsC;IACjC,MAAM,EADA,gBAAgB,GAAG,IAAI;IAElC,kDAAkD;IAC7C,SAAS;IACT,MAAM;IACN,SAAS;IACT,aAAa;IAClB,sCAAsC;IACjC,kBAAkB,EADZ,gBAAgB,GAAG,IAAI;IAElC,kCAAkC;IAC7B,mBAAmB,EADb,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI;IAE9B;;;;OAIG;IACE,OAAO,EAFF,CAAC,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC;QAAC,EAAE,EAAE,OAAO,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC,CAAC,GAAG,IAAI;IAtB/E;;;OAGG;IACH,YAAY,KAAK,EAHN,gBAGM,EAAE,OAAO,AAFvB,CAAuE,EAA/D;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAA;KAE/B,EAqB9B;IAED,6BAA6B;IAC7B,SAAS,CAAC,MAAM,EADJ,MACI,QAEf;IAED,+CAA+C;IAC/C,WAAW,CAAC,QAAQ,EADR,MAAM,CAAC,MAAM,EAAE,MAAM,CACb,QAEnB;IAED,4BAA4B;IAC5B,MAAM,CAAC,KAAK,EADA,MACA,UAEX;IAED,2BAA2B;IAC3B,KAAK,CAAC,IAAI,EADE,MACF,UAET;IAED,IAAI,WAAW,WAEd;IAED,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,YAEb;IAED;uDACmD;IACnD,cAAc,SASb;IAED,iEAAiE;IACjE,cAAc,SAmBb;IAED,0DAA0D;IAC1D,KAAK,SAEJ;IAED,2EAA2E;IAC3E,IAAI,OAAO,YAEV;IAED;
|
|
1
|
+
{"version":3,"file":"date-field.d.ts","sourceRoot":"","sources":["../../src/date-field.js"],"names":[],"mappings":"AAGA;;;;;;;;;GASG;AACH,qBAAa,mBAAmB;IAMvB,KAAK;IACL,QAAQ;IACR,OAAO;;;;;;IACZ,sCAAsC;IACjC,MAAM,EADA,gBAAgB,GAAG,IAAI;IAElC,kDAAkD;IAC7C,SAAS;IACT,MAAM;IACN,SAAS;IACT,aAAa;IAClB,sCAAsC;IACjC,kBAAkB,EADZ,gBAAgB,GAAG,IAAI;IAElC,kCAAkC;IAC7B,mBAAmB,EADb,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI;IAE9B;;;;OAIG;IACE,OAAO,EAFF,CAAC,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC;QAAC,EAAE,EAAE,OAAO,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC,CAAC,GAAG,IAAI;IAtB/E;;;OAGG;IACH,YAAY,KAAK,EAHN,gBAGM,EAAE,OAAO,AAFvB,CAAuE,EAA/D;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAA;KAE/B,EAqB9B;IAED,6BAA6B;IAC7B,SAAS,CAAC,MAAM,EADJ,MACI,QAEf;IAED,+CAA+C;IAC/C,WAAW,CAAC,QAAQ,EADR,MAAM,CAAC,MAAM,EAAE,MAAM,CACb,QAEnB;IAED,4BAA4B;IAC5B,MAAM,CAAC,KAAK,EADA,MACA,UAEX;IAED,2BAA2B;IAC3B,KAAK,CAAC,IAAI,EADE,MACF,UAET;IAED,IAAI,WAAW,WAEd;IAED,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,YAEb;IAED;uDACmD;IACnD,cAAc,SASb;IAED,iEAAiE;IACjE,cAAc,SAmBb;IAED,0DAA0D;IAC1D,KAAK,SAEJ;IAED,2EAA2E;IAC3E,IAAI,OAAO,YAEV;IAED;;;mFAG+E;IAC/E,WAAW,SAkBV;IAED;;;;;OAKG;IACG,MAAM,IAFC,OAAO,CAAC;QAAC,MAAM,EAAE,IAAI,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC,CA4BnF;IAED;;;OAGG;IACH,YAAY,CAAC,KAAK,EAHP,MAGO,EAAE,OAAO,AAFxB,CAAqC,EAA7B;QAAC,MAAM,CAAC,EAAE,OAAO,CAAA;KAEI,QAW/B;IAED,mEAAmE;IACnE,cAAc,WAIb;IAED;+CAC2C;IAC3C,QAAQ,SAOP;CACF"}
|
|
@@ -24,7 +24,14 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
24
24
|
/** Map of clicked/keyboard-activated grid dates to the generation at click
|
|
25
25
|
* time (range mode supersession/stale protection). @type {Map<string, number>} */
|
|
26
26
|
_pendingIntents: Map<string, number>;
|
|
27
|
-
|
|
27
|
+
/** Overlaid calendar triggers, one per field (single) or per bound (range). @type {{button: HTMLButtonElement, endpoint: "" | "start" | "end"}[]} */
|
|
28
|
+
_buttons: {
|
|
29
|
+
button: HTMLButtonElement;
|
|
30
|
+
endpoint: "" | "start" | "end";
|
|
31
|
+
}[];
|
|
32
|
+
/** Control that opened the popover, so single mode can restore focus to it.
|
|
33
|
+
* @type {HTMLElement | null} */
|
|
34
|
+
_returnFocus: HTMLElement | null;
|
|
28
35
|
_panel: HTMLDivElement | null;
|
|
29
36
|
_calendar: DateCalendarElement | null;
|
|
30
37
|
_originalDescribedBy: string;
|
|
@@ -63,6 +70,8 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
63
70
|
_renderDay: any;
|
|
64
71
|
/** @type {any} */
|
|
65
72
|
_isDateDisabled: any;
|
|
73
|
+
/** Public picker coordinate-space request. @type {"viewport" | "document"} */
|
|
74
|
+
_coordinateSpace: "viewport" | "document";
|
|
66
75
|
static observedAttributes: string[];
|
|
67
76
|
constructor();
|
|
68
77
|
_rangeMode(): boolean;
|
|
@@ -166,6 +175,9 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
166
175
|
/** @public @returns {any} */
|
|
167
176
|
get isDateDisabled(): any;
|
|
168
177
|
set isDateDisabled(value: any);
|
|
178
|
+
/** @public JS-only coordinate-space policy: "viewport" by default, "document" as an explicit opt-in; a change made while open applies to the next opening only. @returns {"viewport" | "document"} */
|
|
179
|
+
get coordinateSpace(): "viewport" | "document";
|
|
180
|
+
set coordinateSpace(value: "viewport" | "document");
|
|
169
181
|
_adapter(): {
|
|
170
182
|
locale: string;
|
|
171
183
|
placeholder: string;
|
|
@@ -176,10 +188,45 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
176
188
|
_syncInputState(): void;
|
|
177
189
|
_syncRangeFields(): void;
|
|
178
190
|
_setRangeAria(): void;
|
|
179
|
-
/**
|
|
180
|
-
|
|
191
|
+
/**
|
|
192
|
+
* Create one calendar trigger. It is a real button overlaid inside the
|
|
193
|
+
* field's own box (see the CSS): the field reserves the room, the trigger
|
|
194
|
+
* stays transparent, and the field's focus ring wraps both.
|
|
195
|
+
* @param {"" | "start" | "end"} endpoint
|
|
196
|
+
* @returns {HTMLButtonElement}
|
|
197
|
+
*/
|
|
198
|
+
_createTrigger(endpoint: "" | "start" | "end"): HTMLButtonElement;
|
|
199
|
+
/**
|
|
200
|
+
* Build the popup once and one trigger per field. Each trigger is inserted
|
|
201
|
+
* immediately after its own field so DOM order follows visual/tab order
|
|
202
|
+
* (`date -> its trigger -> next control`). The hidden ISO field may sit
|
|
203
|
+
* between the two; it is not focusable.
|
|
204
|
+
*/
|
|
205
|
+
_build(): void;
|
|
181
206
|
_bind(): void;
|
|
182
207
|
_bindRange(): void;
|
|
208
|
+
/**
|
|
209
|
+
* Point the shared calendar at one range bound and invalidate any pending
|
|
210
|
+
* activation, so a late response can never commit on the wrong bound.
|
|
211
|
+
* @param {"start" | "end"} endpoint
|
|
212
|
+
*/
|
|
213
|
+
_activateRangeEndpoint(endpoint: "start" | "end"): void;
|
|
214
|
+
/**
|
|
215
|
+
* Range has one trigger per bound. A press on the other bound's trigger is a
|
|
216
|
+
* local switch, not a toggle: it repoints the single open popup instead of
|
|
217
|
+
* closing it. Only a press on the already-active bound toggles shut.
|
|
218
|
+
* @param {"start" | "end"} endpoint
|
|
219
|
+
* @param {MouseEvent} event
|
|
220
|
+
*/
|
|
221
|
+
_onRangeTriggerClick(endpoint: "start" | "end", event: MouseEvent): void;
|
|
222
|
+
/**
|
|
223
|
+
* ArrowDown on a trigger opens the popup and drops into the grid, like the
|
|
224
|
+
* field itself (Enter/Space go through the click path). Needed because focus
|
|
225
|
+
* now returns to the trigger that opened the popover.
|
|
226
|
+
* @param {"" | "start" | "end"} endpoint
|
|
227
|
+
* @param {KeyboardEvent} event
|
|
228
|
+
*/
|
|
229
|
+
_onTriggerKeyDown(endpoint: "" | "start" | "end", event: KeyboardEvent): void;
|
|
183
230
|
/** @param {"" | "start" | "end"} endpoint @param {KeyboardEvent} event */
|
|
184
231
|
_onFieldKeyDown(endpoint: "" | "start" | "end", event: KeyboardEvent): void;
|
|
185
232
|
/** @param {"" | "start" | "end"} endpoint @param {FocusEvent} event */
|
|
@@ -194,6 +241,8 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
194
241
|
_syncCalendarOptions(): void;
|
|
195
242
|
_refreshLocale(): void;
|
|
196
243
|
_refreshButtonLabel(): void;
|
|
244
|
+
/** Each bound has its own trigger, so each needs its own accessible name: the
|
|
245
|
+
* bound label is what tells two otherwise identical triggers apart. */
|
|
197
246
|
_refreshRangeButtonLabel(): void;
|
|
198
247
|
/** @param {string} value */
|
|
199
248
|
_reflectValue(value: string): void;
|
|
@@ -260,14 +309,22 @@ export declare class DatePickerElement extends HTMLElement {
|
|
|
260
309
|
_restoreRangeDefault(): void;
|
|
261
310
|
/** @param {"start" | "end"} which */
|
|
262
311
|
_focusField(which: "start" | "end"): void;
|
|
263
|
-
|
|
312
|
+
/**
|
|
313
|
+
* Restore focus to the control that opened the popover (single mode). focus()
|
|
314
|
+
* must not run synchronously from a keydown handler (Chromium drops focus
|
|
315
|
+
* changes there) and must not re-open the popover under the default
|
|
316
|
+
* open-on-focus. Deferring keeps _suppressFocusOpen active for the call.
|
|
317
|
+
*/
|
|
318
|
+
_restoreFocus(): void;
|
|
264
319
|
/** @returns {"" | "start" | "end"} */
|
|
265
320
|
_resolveRangeEndpoint(): "" | "start" | "end";
|
|
266
321
|
/** @public */
|
|
267
322
|
validate(): Promise<boolean>;
|
|
268
|
-
/** @public @param {{moveFocus?:boolean}} [options] */
|
|
323
|
+
/** @public @param {{moveFocus?:boolean, endpoint?:"start"|"end", returnFocus?:HTMLElement}} [options] */
|
|
269
324
|
show(options?: {
|
|
270
325
|
moveFocus?: boolean;
|
|
326
|
+
endpoint?: "start" | "end";
|
|
327
|
+
returnFocus?: HTMLElement;
|
|
271
328
|
}): void;
|
|
272
329
|
/** @param {boolean} expanded */
|
|
273
330
|
_setExpanded(expanded: boolean): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../src/date-picker.js"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAkB,MAAM,iBAAiB,CAAC;AAOtE,qBAAa,iBAAkB,SAAQ,WAAW;IAKzC,GAAG;IACH,UAAU;IACV,WAAW;IACX,MAAM;IACN,MAAM;IACX,yCAAyC;IACpC,MAAM,EADA,mBAAmB,GAAG,IAAI;IAErC,2CAA2C;IACtC,OAAO,EADD,mBAAmB,EAAE,GAAG,IAAI;IAEvC,yCAAyC;IACpC,MAAM,EADA,mBAAmB,GAAG,IAAI;IAEhC,UAAU;IACf,uGAAuG;IAClG,WAAW,EADiC,CAAC,gBAAgB,GAAG,IAAI,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAEnG,mFAAmF;IAC9E,eAAe,EADsC,GAAG,CAAC,gBAAgB,CAAC;IAE/E,mCAAmC;IAC9B,kBAAkB,EADZ,EAAE,GAAG,OAAO,GAAG,KAAK;IAE1B,cAAc;IACnB;sFACkF;IAC7E,eAAe,EADuC,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../src/date-picker.js"],"names":[],"mappings":"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"}
|
package/docs/ACCESSIBILITY.md
CHANGED
|
@@ -42,9 +42,7 @@ Moving focus never changes selection.
|
|
|
42
42
|
|
|
43
43
|
## Month/year controls
|
|
44
44
|
|
|
45
|
-
The
|
|
46
|
-
|
|
47
|
-
The year select is a moving window around the displayed year when no hard min/max exists. Navigating past the current window causes a normal re-render centered on the new year.
|
|
45
|
+
The month control is a native select and the year control is a native number input. They are easy to discover, keyboard-operable, and do not require nested custom popovers.
|
|
48
46
|
|
|
49
47
|
## Date picker input
|
|
50
48
|
|
|
@@ -99,19 +97,29 @@ The same resolved date state used by the grid is used for manual-entry validatio
|
|
|
99
97
|
|
|
100
98
|
Forced colors should not rely on the normal selected-day fill tokens.
|
|
101
99
|
|
|
102
|
-
When `forced-colors: active`, the selected day
|
|
100
|
+
When `forced-colors: active`, the selected day and range endpoints switch to a border-based treatment:
|
|
103
101
|
|
|
104
102
|
- `Canvas` background;
|
|
105
103
|
- `CanvasText` foreground;
|
|
106
|
-
- `Highlight` outer border;
|
|
107
|
-
-
|
|
108
|
-
|
|
109
|
-
Today keeps the base 1px outline — `border-color: var(--dp-accent)` force-adjusts to `CanvasText` here, so it stays a thin `CanvasText` border. Selected and today therefore remain distinct through border color, width, the inner ring and weight (selected is `700`), not through a shared system key.
|
|
104
|
+
- `2px Highlight` outer border;
|
|
105
|
+
- in-range days keep a `1px Highlight` underline (the range fill is lost and the browser does not know the semantics).
|
|
110
106
|
|
|
111
|
-
|
|
107
|
+
Today keeps a thin `1px Highlight` border while selected carries the wider border, so the two stay distinct through border width. The disabled state relies on the native dimming, verified by capture. The month select hands its caret back to the browser (`appearance: auto`), since the author-drawn gradient is a non-system color.
|
|
112
108
|
|
|
113
109
|
Guard: re-run the `color-contrast` review and the forced-colors screenshot bundle whenever `--dp-*` styling or day-cell rendering changes.
|
|
114
110
|
|
|
111
|
+
## Visible focus
|
|
112
|
+
|
|
113
|
+
The default focus language uses `--dp-accent`, so the picker holds together without a consumer stylesheet (`outline: none` plus an accent border and a light halo). Only the focus state is normalized: the resting input appearance stays consumer-owned.
|
|
114
|
+
|
|
115
|
+
Focus is only ever drawn on a real box. The calendar trigger is a real button painted inside the date field's own box, so the field's focus ring naturally wraps the affordance too — no host-level ring, no pseudo-element. When the trigger itself is focused it shows a small inner ring, like the native `input[type=time]` indicator, instead of pretending the whole field is focused.
|
|
116
|
+
|
|
117
|
+
Day cells use an **inner** ring too: keyboard focus stays inside the 44px cell instead of reading as a second selected state, and it never bleeds onto a neighbouring range band. The ring is an `outline` with `outline-offset: -2px`, not an inset `box-shadow`, because forced colors computes `box-shadow` to `none` — an inset shadow would erase the keyboard indicator (including on disabled days, which must stay discoverable). `outline-color` is force-adjusted to a system color there, so the ring survives high contrast. On a cell already filled with the accent (selected, range endpoints) the ring inverts to `--dp-accent-fg` so it stays readable.
|
|
118
|
+
|
|
119
|
+
Each native time companion is an independent control and keeps its own ring; they are not joined, so rings never merge and no neighbour swallows another's focus. In `[range]`, each bound owns its trigger and its own ring, and focus follows the active bound rather than the original trigger.
|
|
120
|
+
|
|
121
|
+
Closing returns focus to the control that opened the popover (field or trigger) in single mode.
|
|
122
|
+
|
|
115
123
|
## Recommended manual test matrix
|
|
116
124
|
|
|
117
125
|
Beyond what the automated suite covers, the following pairings should be exercised before a broad adoption of 0.1. Results are recorded in [AT-CHECKLIST.md](AT-CHECKLIST.md); the human rows there are still open:
|
package/docs/API.md
CHANGED
|
@@ -31,7 +31,7 @@ Presentation-only range band. It never changes `value`, `selection` or `focusedD
|
|
|
31
31
|
calendar.isDateDisabled = (date) => boolean;
|
|
32
32
|
calendar.dateState = (date, sourceState) => ({
|
|
33
33
|
disabled,
|
|
34
|
-
enabled, // true =
|
|
34
|
+
enabled, // true = lifts isDateDisabled() only; never min/max or resolved disabled
|
|
35
35
|
description,
|
|
36
36
|
...applicationMetadata
|
|
37
37
|
});
|
|
@@ -152,6 +152,23 @@ The direct child text input is required. On enhancement its original `name` move
|
|
|
152
152
|
- `isDateDisabled`;
|
|
153
153
|
- `messages`.
|
|
154
154
|
|
|
155
|
+
### Popup positioning
|
|
156
|
+
|
|
157
|
+
- `coordinateSpace` — JS-only, `"viewport"` by default.
|
|
158
|
+
|
|
159
|
+
```text
|
|
160
|
+
"viewport"
|
|
161
|
+
panel uses position: fixed
|
|
162
|
+
general/default integration
|
|
163
|
+
|
|
164
|
+
"document"
|
|
165
|
+
panel uses position: absolute
|
|
166
|
+
explicit optimization when the application knows the picker
|
|
167
|
+
reference moves with root-page scrolling
|
|
168
|
+
```
|
|
169
|
+
|
|
170
|
+
`document` follows the `@lekoala/floating` consumer contract: the picker panel is a top-layer popover, so its absolute positioning resolves against the initial containing block; the application remains responsible for knowing that the `<date-picker>` reference itself moves with the root document. Changing `coordinateSpace` while open configures the next opening, never the current one. See the `@lekoala/floating` documentation for the coordinate-space doctrine.
|
|
171
|
+
|
|
155
172
|
### Read-only properties
|
|
156
173
|
|
|
157
174
|
```js
|
|
@@ -231,6 +248,8 @@ Optional native time companions (one or both). They are direct children, fixed a
|
|
|
231
248
|
|
|
232
249
|
Two editable fields share one calendar popup. The mode is fixed at connect time (`range` attribute + both marked direct child inputs); switching single/range at runtime is not supported in V1.
|
|
233
250
|
|
|
251
|
+
Each field gets its own calendar trigger, inserted right after it (`start`, then its trigger, `end`, then its trigger), so DOM order matches visual/tab order. Both triggers point at the same popup; activating the other bound's trigger while it is open switches the active bound and keeps it open.
|
|
252
|
+
|
|
234
253
|
### Strict API
|
|
235
254
|
|
|
236
255
|
- `range` — atomic get/set of `{ start, end }` (canonical `YYYY-MM-DD`). The setter validates through `normalizeRange` (ISO-only, ordered; inverted throws) and applies both bounds, the visible fields and both hidden fields **before** one `rangechange` event — no intermediate new-start/old-end state is observable.
|
|
@@ -254,7 +273,7 @@ The business range may be temporarily incomplete or inverted; `calendar.highligh
|
|
|
254
273
|
|
|
255
274
|
- When an ordered range is complete, picking before its start updates only the start; picking after its end updates only the end, regardless of the opening field. The popup closes after this update. An uneditable target bound refuses the activation.
|
|
256
275
|
- Otherwise, opening through a field targets that bound (`activeEndpoint`). Picking from `start` commits it, moves the endpoint to `end` without closing, and a second pick commits and closes. Opening from `end` refuses a date before `start` (`dateinvalid`, nothing changes).
|
|
257
|
-
-
|
|
276
|
+
- Each bound owns its trigger (`input[data-range-start]` then its trigger, `input[data-range-end]` then its trigger); the two triggers share **one** popup, calendar, source and state. Pressing the other bound's trigger while the popup is open switches the active bound and keeps it open instead of toggling it shut. A trigger never opens a `readonly`/`disabled` bound.
|
|
258
277
|
- Typing stays independent per field. Moving `start` past `end` keeps both values and flags the *modified* bound with `rangeOrderStart`; fixing either side revalidates both. Parse/source errors are never cleared by cross-bound revalidation.
|
|
259
278
|
- A stale availability response resolving after the active endpoint changed (or after a newer selection) never commits; a field focus that switches the endpoint invalidates in-flight activations.
|
|
260
279
|
|
package/docs/ARCHITECTURE.md
CHANGED
|
@@ -93,7 +93,10 @@ This prevents rich decorations from breaking grid semantics or keyboard behavior
|
|
|
93
93
|
3. `min` / `max`;
|
|
94
94
|
4. `isDateDisabled()`.
|
|
95
95
|
|
|
96
|
-
`enabled: true` is the explicit exception seam:
|
|
96
|
+
`enabled: true` is the explicit exception seam: when the resolved state carries
|
|
97
|
+
`enabled === true`, it lifts `isDateDisabled()` only. It never bypasses
|
|
98
|
+
`min`/`max` or the resolved `state.disabled` (source state merged with
|
|
99
|
+
`dateState()` output, so `dateState()` can already replace a source `disabled`).
|
|
97
100
|
|
|
98
101
|
Both click activation and typed picker validation use this resolved state.
|
|
99
102
|
|
|
@@ -144,6 +147,17 @@ The picker creates a `<date-calendar selection="none">` in a native manual popov
|
|
|
144
147
|
|
|
145
148
|
Native Popover owns the top layer. `@lekoala/floating` owns coordinates and geometry updates.
|
|
146
149
|
|
|
150
|
+
### Coordinate space
|
|
151
|
+
|
|
152
|
+
`picker.coordinateSpace` (`"viewport"` default, `"document"` explicit opt-in, JS-only, no attribute) is frozen once per opening in `show()`; `panel.style.position` is coupled:
|
|
153
|
+
|
|
154
|
+
```text
|
|
155
|
+
viewport (default) → fixed
|
|
156
|
+
document → absolute
|
|
157
|
+
```
|
|
158
|
+
|
|
159
|
+
No layout inference is performed. Coordinate-space choice is consumer policy; `@lekoala/floating` owns only coordinate math and update tracking.
|
|
160
|
+
|
|
147
161
|
The picker does not implement:
|
|
148
162
|
|
|
149
163
|
- custom portals;
|
|
@@ -157,7 +171,7 @@ The popup remains in authored DOM, preserving inherited locale/theme/density con
|
|
|
157
171
|
|
|
158
172
|
Two product shapes cover the range cases, and both keep range rules outside the classes:
|
|
159
173
|
|
|
160
|
-
`<date-picker range>` shares **one** calendar surface between two editable fields. Each input is owned by a `DateFieldController` (parsing, hidden ISO, commit/stale protection); the pair is driven by `DateRangeController` in `date-range.js`, which owns the active-endpoint transitions and the start/end state. `DatePickerElement` remains a shell: it coordinates DOM/popup/focus only. `value` is unavailable in range mode and `range` is the atomic pair API; inverted or incomplete business ranges are never forwarded to `highlightedRange`, which stays presentation-only.
|
|
174
|
+
`<date-picker range>` shares **one** calendar surface between two editable fields. Each input is owned by a `DateFieldController` (parsing, hidden ISO, commit/stale protection); the pair is driven by `DateRangeController` in `date-range.js`, which owns the active-endpoint transitions and the start/end state. The shell owns one calendar trigger per bound (each inserted after its own field, both pointing at the same popup) and switches the active endpoint without closing it. `DatePickerElement` remains a shell: it coordinates DOM/popup/focus only. `value` is unavailable in range mode and `range` is the atomic pair API; inverted or incomplete business ranges are never forwarded to `highlightedRange`, which stays presentation-only.
|
|
161
175
|
|
|
162
176
|
`linkDateRange(start, end)` keeps the external relationship for two visually separate pickers:
|
|
163
177
|
|
package/docs/AT-CHECKLIST.md
CHANGED
|
@@ -44,7 +44,7 @@ Release decision (0.1.0): the human reader/OS pairings below are **deferred past
|
|
|
44
44
|
|
|
45
45
|
- [x] [auto] Typing a valid localized date updates the field validation state (no stale invalid message).
|
|
46
46
|
- [x] [split] Typing an impossible date produces an announced invalid message (native invalid state/message covered automatically; announcement still manual).
|
|
47
|
-
- [
|
|
47
|
+
- [ ] [manual] Forced-colors mode keeps selected/today/disabled distinguishable with the simplified border-based treatment (re-check after the neutral-palette + rhythm pass; spot-check with the forced-colors screenshot bundle).
|
|
48
48
|
|
|
49
49
|
## Automated pass
|
|
50
50
|
|
package/docs/DECISIONS.md
CHANGED
|
@@ -35,6 +35,8 @@ Context: DOM-backed styling hooks become API the moment they are documented —
|
|
|
35
35
|
|
|
36
36
|
- The picker opens its popover when the input receives focus (`open-on-focus`, default `true`; set `open-on-focus="false"` to opt out).
|
|
37
37
|
- Opening on focus **never steals keyboard focus**: the user can start typing immediately. The grid takes focus only on ArrowDown, on the calendar trigger, or after the user moves the pointer into the popup.
|
|
38
|
+
- Closing returns focus to the control that opened the popover (field or trigger) — the usual popover convention. Range mode is the exception: focus follows the active bound, because a first pick moves the workflow to the other bound.
|
|
39
|
+
- The calendar trigger is overlaid inside the field's own box, like the native `input[type=time]` indicator. The field reserves its place (`padding-inline-end`), keeps its border/background, and owns the focus ring for the pair; the trigger is a real button with an inner ring of its own. A range bound owns its own trigger; the two share one popup, calendar, source and state.
|
|
38
40
|
- `show()` / `hide()` are the control surface. `open` is a **read-only getter** reflecting the popover. There is no `open` attribute: the popover element is the single machine of truth and a second state machine would only drift.
|
|
39
41
|
- `readonly` mirrors native semantics: the field is non-editable, the value is still submitted, and the picker cannot change it — the calendar trigger is disabled. `disabled` additionally unsubmits the field. `readonly` is never used to mean "no typing, but calendar selection allowed".
|
|
40
42
|
- Clearing the editable input clears the canonical value (the component renders no internal clear button). Form resets follow the native `defaultValue` contract. This matches the Open UI datepicker `clear` concept: clearing is a text-editing action, not a component-owned affordance.
|
|
@@ -78,7 +78,7 @@ calendar.isDateDisabled = (date) => isWeekend(date);
|
|
|
78
78
|
// weekend rule. Hard min/max bounds still win.
|
|
79
79
|
```
|
|
80
80
|
|
|
81
|
-
The prototype promotes this legacy behavior into a documented generic field: `enabled: true` reopens a date disabled by `isDateDisabled()
|
|
81
|
+
The prototype promotes this legacy behavior into a documented generic field: `enabled: true` reopens a date disabled by `isDateDisabled()`, but never bypasses hard `min`/`max` bounds or a resolved `state.disabled`.
|
|
82
82
|
|
|
83
83
|
## Not migrated into this component
|
|
84
84
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lekoala/date-picker",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "Native-first date picker and inline calendar primitives",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": [
|
|
@@ -162,13 +162,13 @@
|
|
|
162
162
|
"prepublishOnly": "bun run verify"
|
|
163
163
|
},
|
|
164
164
|
"devDependencies": {
|
|
165
|
-
"@biomejs/biome": "2.5.
|
|
165
|
+
"@biomejs/biome": "2.5.13",
|
|
166
166
|
"@lekoala/calendar": "0.1.0",
|
|
167
|
-
"@playwright/test": "1.
|
|
167
|
+
"@playwright/test": "1.63.0",
|
|
168
168
|
"temporal-polyfill": "^1.0.4",
|
|
169
169
|
"typescript": "7.0.2"
|
|
170
170
|
},
|
|
171
171
|
"dependencies": {
|
|
172
|
-
"@lekoala/floating": "^0.
|
|
172
|
+
"@lekoala/floating": "^0.2.0"
|
|
173
173
|
}
|
|
174
174
|
}
|
package/src/date-calendar.js
CHANGED
|
@@ -386,7 +386,7 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
386
386
|
|
|
387
387
|
/** @param {HTMLElement} element @returns {string} */
|
|
388
388
|
_focusTargetKey(element) {
|
|
389
|
-
if (element.matches(".dp-month-select, .dp-year-
|
|
389
|
+
if (element.matches(".dp-month-select, .dp-year-input") && element.id) {
|
|
390
390
|
return `#${CSS.escape(element.id)}`;
|
|
391
391
|
}
|
|
392
392
|
if (element.matches(".dp-nav[data-calendar-action]")) {
|
|
@@ -416,7 +416,8 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
416
416
|
const outsideBounds =
|
|
417
417
|
(this.min && compareDates(date, this.min) < 0) || (this.max && compareDates(date, this.max) > 0);
|
|
418
418
|
const explicitlyEnabled = state.enabled === true;
|
|
419
|
-
// min/max > state.disabled >
|
|
419
|
+
// min/max > resolved state.disabled > isDateDisabled(), unless resolved
|
|
420
|
+
// state.enabled === true lifts only isDateDisabled().
|
|
420
421
|
const disabledByRule = explicitlyEnabled ? false : Boolean(this._isDateDisabled?.(date));
|
|
421
422
|
const disabled = Boolean(outsideBounds) || Boolean(state.disabled) || disabledByRule;
|
|
422
423
|
return { ...state, disabled };
|
|
@@ -642,10 +643,6 @@ export class DateCalendarElement extends HTMLElement {
|
|
|
642
643
|
this._setDisplay(`${this.display.slice(0, 4)}-${target.value}`);
|
|
643
644
|
return;
|
|
644
645
|
}
|
|
645
|
-
if (target instanceof HTMLSelectElement && target.matches(".dp-year-select")) {
|
|
646
|
-
this._setDisplay(`${target.value}-${this.display.slice(5, 7)}`);
|
|
647
|
-
return;
|
|
648
|
-
}
|
|
649
646
|
if (target instanceof HTMLInputElement && target.matches(".dp-year-input")) {
|
|
650
647
|
const year = Number(target.value);
|
|
651
648
|
if (!Number.isInteger(year) || year < 1 || year > 9999) {
|
package/src/date-field.js
CHANGED
|
@@ -117,18 +117,26 @@ export class DateFieldController {
|
|
|
117
117
|
}
|
|
118
118
|
|
|
119
119
|
/** Live text input: the raw text no longer matches the canonical value, so
|
|
120
|
-
* the hidden ISO must not submit it.
|
|
120
|
+
* the hidden ISO must not submit it. A text that formats back to the current
|
|
121
|
+
* canonical value (e.g. re-applied by a calendar pick) keeps the ISO value
|
|
122
|
+
* valid; invalidating in-flight commits first still drops stale async work. */
|
|
121
123
|
handleInput() {
|
|
122
124
|
const input = this.input;
|
|
123
|
-
|
|
125
|
+
const text = input.value.trim();
|
|
126
|
+
const canonical = this.canonical ? this.adapter.format(this.canonical) : "";
|
|
124
127
|
this.dirty();
|
|
128
|
+
if (text === canonical) {
|
|
129
|
+
this._dirty = false;
|
|
130
|
+
if (this.hidden) this.hidden.value = this.canonical;
|
|
131
|
+
input.setCustomValidity("");
|
|
132
|
+
return;
|
|
133
|
+
}
|
|
134
|
+
this._dirty = true;
|
|
125
135
|
if (this.hidden) this.hidden.value = "";
|
|
126
|
-
const text = input.value.trim();
|
|
127
136
|
if (!text) {
|
|
128
137
|
input.setCustomValidity("");
|
|
129
138
|
return;
|
|
130
139
|
}
|
|
131
|
-
const canonical = this.canonical ? this.adapter.format(this.canonical) : "";
|
|
132
140
|
input.setCustomValidity(text === canonical ? "" : this.messages.invalidDate);
|
|
133
141
|
}
|
|
134
142
|
|