@progressive-development/pd-calendar 0.5.4 → 0.6.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.
@@ -1,4 +1,453 @@
1
- import { PdCalendar } from "./src/PdCalendar.js";
2
- if (!customElements.get("pd-calendar")) {
3
- window.customElements.define("pd-calendar", PdCalendar);
1
+ import { css, LitElement, html } from "lit";
2
+ import { property, state, customElement } from "lit/decorators.js";
3
+ import { msg, localized } from "@lit/localize";
4
+ import { format } from "fecha";
5
+ import "@progressive-development/pd-icon/pd-icon";
6
+ import { PdColorStyles, PdFontStyles } from "@progressive-development/pd-shared-styles";
7
+ import { PdYearPopup } from "./pd-year-popup.js";
8
+ import "./pd-calendar-cell.js";
9
+ var __defProp = Object.defineProperty;
10
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
11
+ var __decorateClass = (decorators, target, key, kind) => {
12
+ var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
13
+ for (var i = decorators.length - 1, decorator; i >= 0; i--)
14
+ if (decorator = decorators[i])
15
+ result = (kind ? decorator(target, key, result) : decorator(result)) || result;
16
+ if (kind && result) __defProp(target, key, result);
17
+ return result;
18
+ };
19
+ const TOUCH_MIN_MOVE = 70;
20
+ const loadLocales = () => ({
21
+ monthNames: [
22
+ msg("Januar", { id: "pd.datepicker.month.jan" }),
23
+ msg("Februar", { id: "pd.datepicker.month.feb" }),
24
+ msg("März", { id: "pd.datepicker.month.mar" }),
25
+ msg("April", { id: "pd.datepicker.month.apr" }),
26
+ msg("Mai", { id: "pd.datepicker.month.may" }),
27
+ msg("Juni", { id: "pd.datepicker.month.jun" }),
28
+ msg("Juli", { id: "pd.datepicker.month.jul" }),
29
+ msg("August", { id: "pd.datepicker.month.aug" }),
30
+ msg("September", { id: "pd.datepicker.month.sep" }),
31
+ msg("Oktober", { id: "pd.datepicker.month.oct" }),
32
+ msg("November", { id: "pd.datepicker.month.nov" }),
33
+ msg("Dezember", { id: "pd.datepicker.month.dec" })
34
+ ],
35
+ weekdaysShort: [
36
+ msg("Mo", { id: "pd.datepicker.shortday.mon" }),
37
+ msg("Di", { id: "pd.datepicker.shortday.tue" }),
38
+ msg("Mi", { id: "pd.datepicker.shortday.wed" }),
39
+ msg("Do", { id: "pd.datepicker.shortday.thi" }),
40
+ msg("Fr", { id: "pd.datepicker.shortday.fri" }),
41
+ msg("Sa", { id: "pd.datepicker.shortday.sat" }),
42
+ msg("So", { id: "pd.datepicker.shortday.sun" })
43
+ ]
44
+ });
45
+ const LOCALES = loadLocales();
46
+ const VIEW_MONTH = 2;
47
+ function isToday(date) {
48
+ const today = /* @__PURE__ */ new Date();
49
+ return !!date && date.getDate() === today.getDate() && date.getMonth() === today.getMonth() && date.getFullYear() === today.getFullYear();
4
50
  }
51
+ function isSelected(date1, date2) {
52
+ return !!date1 && !!date2 && date1.getDate() === date2.getDate() && date1.getMonth() === date2.getMonth() && date1.getFullYear() === date2.getFullYear();
53
+ }
54
+ let PdCalendar = class extends LitElement {
55
+ constructor() {
56
+ super(...arguments);
57
+ this.selectableDates = false;
58
+ this.withYearPopup = [];
59
+ this.withWheelNavigation = false;
60
+ this.withTouchNavigation = false;
61
+ this.showSelection = false;
62
+ this.hideWeekend = false;
63
+ this.prevMonthConstraint = -1;
64
+ this.nextMonthConstraint = -1;
65
+ this.data = {};
66
+ this.numberClass = "top-left";
67
+ this._viewType = VIEW_MONTH;
68
+ this._currentDate = /* @__PURE__ */ new Date();
69
+ this._wheelDelta = 0;
70
+ this._monthName = "";
71
+ this._year = 0;
72
+ this._numberOfDays = 0;
73
+ this._daysFromPreviousMonth = [];
74
+ this._currentMonthNavNr = 0;
75
+ }
76
+ connectedCallback() {
77
+ super.connectedCallback();
78
+ this._initFromDate(this.refDate ?? /* @__PURE__ */ new Date());
79
+ }
80
+ update(changedProperties) {
81
+ if (changedProperties.has("refDate") && this.refDate) {
82
+ this._initFromDate(this.refDate);
83
+ }
84
+ super.update(changedProperties);
85
+ }
86
+ render() {
87
+ return html`
88
+ ${this.renderMonthCalendar()}
89
+ <slot name="calFooter"></slot>
90
+ `;
91
+ }
92
+ renderMonthCalendar() {
93
+ const sizeClass = this._numberOfDays >= 31 && this._daysFromPreviousMonth.length >= 5 ? "max" : "normal";
94
+ const days = Array.from({ length: this._numberOfDays }, (_, i) => {
95
+ var _a;
96
+ const day = i + 1;
97
+ const date = new Date(this._year, this._currentDate.getMonth(), day);
98
+ if (this.hideWeekend && [0, 6].includes(date.getDay())) return null;
99
+ const key = format(date, "YYYY-MM-DD");
100
+ const cellData = (_a = this.data[key]) == null ? void 0 : _a[0];
101
+ return html`
102
+ <pd-calendar-cell
103
+ key=${key}
104
+ .dayNumber=${day}
105
+ .weekDayNumber=${date.getDay()}
106
+ .infoTxt=${(cellData == null ? void 0 : cellData.info) || ""}
107
+ ?selectEnabled=${this.selectableDates || !!(cellData == null ? void 0 : cellData.info)}
108
+ ?special=${(cellData == null ? void 0 : cellData.special) ?? false}
109
+ .numberClass=${this.numberClass}
110
+ ?today=${this.selectableDates && isToday(date)}
111
+ ?selected=${this.showSelection && isSelected(this.refDate, date)}
112
+ @select-date=${this._forwardEvent}
113
+ @mouse-enter-date=${this._forwardEnterEvent}
114
+ @mouse-leave-date=${this._forwardLeaveEvent}
115
+ ></pd-calendar-cell>
116
+ `;
117
+ });
118
+ return html`
119
+ <div class="layout-container">
120
+ <div class="header">
121
+ <div class="header-main">
122
+ <div class="icon-container">
123
+ <pd-icon
124
+ class="arrow"
125
+ icon="previousArrow"
126
+ activeIcon
127
+ @click=${this._previousMonth}
128
+ ></pd-icon>
129
+ <pd-icon
130
+ class="arrow"
131
+ icon="nextArrow"
132
+ activeIcon
133
+ @click=${this._nextMonth}
134
+ ></pd-icon>
135
+ </div>
136
+ <div id="titleContentId" class="content-title">
137
+ ${this._monthName}
138
+ ${this.withYearPopup.length > 0 ? html`<span
139
+ class="year-popup-link"
140
+ @click=${this._openYearPopup}
141
+ >${this._year}</span
142
+ >` : this._year}
143
+ </div>
144
+ </div>
145
+ </div>
146
+
147
+ <div
148
+ class="content grid-container ${sizeClass}"
149
+ @wheel=${this._wheelEvent}
150
+ @touchstart=${this._touchStartEvent}
151
+ @touchend=${this._touchEndEvent}
152
+ >
153
+ ${this._getWeekDays().map(
154
+ (day) => html`<div class="title-week-day">${day}</div>`
155
+ )}
156
+ ${this._daysFromPreviousMonth.map(
157
+ () => html`<div class="cell cell-empty"></div>`
158
+ )}
159
+ ${days}
160
+ </div>
161
+ </div>
162
+ `;
163
+ }
164
+ _openYearPopup() {
165
+ var _a, _b;
166
+ const popup = new PdYearPopup();
167
+ popup.yearSelection = this.withYearPopup;
168
+ (_b = (_a = this.shadowRoot) == null ? void 0 : _a.getElementById("titleContentId")) == null ? void 0 : _b.appendChild(popup);
169
+ popup.addEventListener("abort-year-selection", () => {
170
+ var _a2, _b2;
171
+ (_b2 = (_a2 = this.shadowRoot) == null ? void 0 : _a2.getElementById("titleContentId")) == null ? void 0 : _b2.removeChild(popup);
172
+ });
173
+ popup.addEventListener("change-year-selection", (e) => {
174
+ var _a2, _b2;
175
+ const year = e.detail.year;
176
+ const newDate = new Date(this._currentDate);
177
+ newDate.setFullYear(year);
178
+ this.dispatchEvent(
179
+ new CustomEvent("change-month", { detail: { newDate } })
180
+ );
181
+ this._initFromDate(newDate);
182
+ (_b2 = (_a2 = this.shadowRoot) == null ? void 0 : _a2.getElementById("titleContentId")) == null ? void 0 : _b2.removeChild(popup);
183
+ });
184
+ }
185
+ _getWeekDays() {
186
+ return this.hideWeekend ? LOCALES.weekdaysShort.slice(0, 5) : LOCALES.weekdaysShort;
187
+ }
188
+ _nextMonth() {
189
+ if (this._checkNextMonthConstraint()) {
190
+ const next = new Date(
191
+ this._currentDate.getFullYear(),
192
+ this._currentDate.getMonth() + 1,
193
+ 1
194
+ );
195
+ this.dispatchEvent(
196
+ new CustomEvent("change-month", {
197
+ detail: { newDate: next, next: true }
198
+ })
199
+ );
200
+ this._currentMonthNavNr += 1;
201
+ this._initFromDate(next);
202
+ }
203
+ }
204
+ _previousMonth() {
205
+ if (this._checkPrevMonthConstraint()) {
206
+ const prev = new Date(
207
+ this._currentDate.getFullYear(),
208
+ this._currentDate.getMonth() - 1,
209
+ 1
210
+ );
211
+ this.dispatchEvent(
212
+ new CustomEvent("change-month", {
213
+ detail: { newDate: prev, prev: true }
214
+ })
215
+ );
216
+ this._currentMonthNavNr -= 1;
217
+ this._initFromDate(prev);
218
+ }
219
+ }
220
+ _wheelEvent(e) {
221
+ if (this.withWheelNavigation) {
222
+ this._wheelDelta += e.deltaY;
223
+ if (this._wheelDelta > 360) {
224
+ this._wheelDelta = 0;
225
+ this._nextMonth();
226
+ } else if (this._wheelDelta < -360) {
227
+ this._wheelDelta = 0;
228
+ this._previousMonth();
229
+ }
230
+ }
231
+ e.preventDefault();
232
+ e.stopPropagation();
233
+ }
234
+ _touchStartEvent(e) {
235
+ if (this.withTouchNavigation) {
236
+ this._wheelDelta = e.changedTouches[0].screenX;
237
+ }
238
+ e.stopPropagation();
239
+ }
240
+ _touchEndEvent(e) {
241
+ if (this.withTouchNavigation) {
242
+ const diff = this._wheelDelta - e.changedTouches[0].screenX;
243
+ if (diff < -70) {
244
+ this._nextMonth();
245
+ } else if (diff > TOUCH_MIN_MOVE) {
246
+ this._previousMonth();
247
+ }
248
+ }
249
+ e.stopPropagation();
250
+ }
251
+ _initFromDate(date) {
252
+ this._monthName = date.toLocaleString("default", { month: "long" });
253
+ this._year = date.getFullYear();
254
+ this._currentDate = date;
255
+ this._daysFromPreviousMonth = PdCalendar._getPreviousMonthDays(date);
256
+ const lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
257
+ this._numberOfDays = lastDay.getDate();
258
+ }
259
+ static _getPreviousMonthDays(date) {
260
+ const start = new Date(date.getFullYear(), date.getMonth(), 1);
261
+ const missing = start.getDay() > 0 ? Math.abs(1 - start.getDay()) : 6;
262
+ return Array.from({ length: missing }, (_, i) => {
263
+ const d = new Date(start);
264
+ d.setDate(start.getDate() - (missing - i));
265
+ return d;
266
+ });
267
+ }
268
+ _checkNextMonthConstraint() {
269
+ return this.nextMonthConstraint === -1 || this.nextMonthConstraint > this._currentMonthNavNr;
270
+ }
271
+ _checkPrevMonthConstraint() {
272
+ return this.prevMonthConstraint === -1 || this._currentMonthNavNr > 0 || this.prevMonthConstraint > this._currentMonthNavNr * -1;
273
+ }
274
+ _forwardEvent(e) {
275
+ this.dispatchEvent(new CustomEvent("select-date", { detail: e.detail }));
276
+ }
277
+ _forwardEnterEvent(e) {
278
+ this.dispatchEvent(
279
+ new CustomEvent("mouse-enter-date", { detail: e.detail })
280
+ );
281
+ }
282
+ _forwardLeaveEvent() {
283
+ this.dispatchEvent(new CustomEvent("mouse-leave-date"));
284
+ }
285
+ };
286
+ PdCalendar.styles = [
287
+ PdColorStyles,
288
+ PdFontStyles,
289
+ css`
290
+ :host {
291
+ --my-cell-height: var(--pd-calendar-cell-height, 70px);
292
+
293
+ display: block;
294
+ /*padding: 8px;
295
+ width: 100vw;
296
+ height: 100vh;*/
297
+ }
298
+
299
+ :host([hideWeekend]) .grid-container {
300
+ grid-template-columns: repeat(5, minmax(0, 1fr));
301
+ }
302
+
303
+ /* Layout Grid for the Calendar Component => Not really needed at the moment, more a test */
304
+ .layout-container {
305
+ width: var(--pd-calendar-width, 100%);
306
+ min-width: 220px;
307
+ height: 100%;
308
+ display: grid;
309
+ grid-template-columns: 1fr 1fr 1fr;
310
+ grid-template-rows: 40px auto;
311
+ gap: 1px;
312
+ grid-template-areas:
313
+ "header header header"
314
+ "content content content";
315
+ }
316
+
317
+ /* Grid Area positions for layout container above */
318
+ .header {
319
+ grid-area: header;
320
+ position: relative;
321
+ font-family: var(--pd-default-font-title-family);
322
+ color: var(--pd-default-font-title-col);
323
+ display: flex;
324
+ justify-content: left;
325
+ }
326
+
327
+ .header-main {
328
+ display: flex;
329
+ align-items: center;
330
+ justify-content: space-between;
331
+ width: 100%;
332
+ }
333
+
334
+ .content {
335
+ grid-area: content;
336
+ }
337
+ .footer {
338
+ grid-area: footer;
339
+ }
340
+
341
+ /* Grid definition for calendar day items */
342
+ .grid-container {
343
+ position: relative;
344
+ display: grid;
345
+ grid-template-columns: repeat(7, minmax(0, 1fr));
346
+ gap: 3px;
347
+ }
348
+
349
+ .grid-container.max {
350
+ grid-template-rows: minmax(10px, 30px) repeat(
351
+ 6,
352
+ minmax(var(--my-cell-height), 1fr)
353
+ );
354
+ }
355
+
356
+ .grid-container.normal {
357
+ grid-template-rows: minmax(10px, 30px) repeat(
358
+ 5,
359
+ minmax(var(--my-cell-height), 1fr)
360
+ );
361
+ }
362
+
363
+ .title-week-day {
364
+ display: flex;
365
+ align-items: center;
366
+ justify-content: center;
367
+ background-color: var(
368
+ --pd-calendar-week-title-bg-col,
369
+ var(--pd-default-dark-col)
370
+ );
371
+ font-size: var(--pd-calendar-weekday-title-font-size, 1em);
372
+ font-weight: bold;
373
+ color: var(--pd-calendar-week-title-font-col, var(--pd-default-bg-col));
374
+ font-family: var(--pd-default-font-title-family);
375
+ }
376
+
377
+ .content-title {
378
+ position: relative;
379
+ font-size: var(--pd-calendar-title-font-size, 1.2em);
380
+ font-weight: bold;
381
+ }
382
+
383
+ .icon-container {
384
+ display: flex;
385
+ align-items: center;
386
+ justify-content: center;
387
+ gap: 5px;
388
+ }
389
+
390
+ .arrow {
391
+ cursor: pointer;
392
+ --pd-icon-size: var(--pd-calendar-title-icon-size, 1.2em);
393
+ --pd-icon-bg-col-hover: lightgrey;
394
+ }
395
+
396
+ .year-popup-link {
397
+ }
398
+
399
+ .year-popup-link:hover {
400
+ cursor: pointer;
401
+ color: var(--pd-default-hover-col);
402
+ }
403
+ `
404
+ ];
405
+ __decorateClass([
406
+ property({ type: Object })
407
+ ], PdCalendar.prototype, "refDate", 2);
408
+ __decorateClass([
409
+ property({ type: Boolean })
410
+ ], PdCalendar.prototype, "selectableDates", 2);
411
+ __decorateClass([
412
+ property({ type: Array })
413
+ ], PdCalendar.prototype, "withYearPopup", 2);
414
+ __decorateClass([
415
+ property({ type: Boolean })
416
+ ], PdCalendar.prototype, "withWheelNavigation", 2);
417
+ __decorateClass([
418
+ property({ type: Boolean })
419
+ ], PdCalendar.prototype, "withTouchNavigation", 2);
420
+ __decorateClass([
421
+ property({ type: Boolean })
422
+ ], PdCalendar.prototype, "showSelection", 2);
423
+ __decorateClass([
424
+ property({ type: Boolean, reflect: true })
425
+ ], PdCalendar.prototype, "hideWeekend", 2);
426
+ __decorateClass([
427
+ property({ type: Number })
428
+ ], PdCalendar.prototype, "prevMonthConstraint", 2);
429
+ __decorateClass([
430
+ property({ type: Number })
431
+ ], PdCalendar.prototype, "nextMonthConstraint", 2);
432
+ __decorateClass([
433
+ property({ type: Object })
434
+ ], PdCalendar.prototype, "data", 2);
435
+ __decorateClass([
436
+ property({ type: String })
437
+ ], PdCalendar.prototype, "numberClass", 2);
438
+ __decorateClass([
439
+ state()
440
+ ], PdCalendar.prototype, "_viewType", 2);
441
+ __decorateClass([
442
+ state()
443
+ ], PdCalendar.prototype, "_currentDate", 2);
444
+ __decorateClass([
445
+ state()
446
+ ], PdCalendar.prototype, "_wheelDelta", 2);
447
+ PdCalendar = __decorateClass([
448
+ customElement("pd-calendar"),
449
+ localized()
450
+ ], PdCalendar);
451
+ export {
452
+ PdCalendar
453
+ };
@@ -0,0 +1,25 @@
1
+ import { LitElement, CSSResultGroup } from 'lit';
2
+ /**
3
+ * Web Component zur Anzeige eines Jahresauswahl-Popups.
4
+ *
5
+ * Wird typischerweise als Dropdown unterhalb eines Buttons eingeblendet und
6
+ * zeigt eine Liste von auswählbaren Jahren an.
7
+ *
8
+ * @fires change-year-selection – wenn ein Jahr ausgewählt wurde
9
+ * @fires abort-year-selection – wenn außerhalb geklickt wird / keine Auswahl
10
+ */
11
+ export declare class PdYearPopup extends LitElement {
12
+ /**
13
+ * Liste der auswählbaren Jahre.
14
+ */
15
+ yearSelection: string[];
16
+ /**
17
+ * Aktuell ausgewähltes Jahr.
18
+ */
19
+ currentYear: string;
20
+ static styles: CSSResultGroup;
21
+ render(): import('lit-html').TemplateResult<1>;
22
+ private _yearSelection;
23
+ private _closeSelection;
24
+ }
25
+ //# sourceMappingURL=pd-year-popup.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"pd-year-popup.d.ts","sourceRoot":"","sources":["../src/pd-year-popup.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAQ5D;;;;;;;;GAQG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC;;OAEG;IAEH,aAAa,EAAE,MAAM,EAAE,CAAM;IAE7B;;OAEG;IAEH,WAAW,SAAM;IAEjB,OAAgB,MAAM,EAAE,cAAc,CA+DpC;IAEO,MAAM;IAkBf,OAAO,CAAC,cAAc;IAgBtB,OAAO,CAAC,eAAe;CAQxB"}
@@ -0,0 +1,136 @@
1
+ import { css, LitElement, html } from "lit";
2
+ import { property, customElement } from "lit/decorators.js";
3
+ import { PdColorStyles, PdFontStyles } from "@progressive-development/pd-shared-styles";
4
+ var __defProp = Object.defineProperty;
5
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __decorateClass = (decorators, target, key, kind) => {
7
+ var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
8
+ for (var i = decorators.length - 1, decorator; i >= 0; i--)
9
+ if (decorator = decorators[i])
10
+ result = (kind ? decorator(target, key, result) : decorator(result)) || result;
11
+ if (kind && result) __defProp(target, key, result);
12
+ return result;
13
+ };
14
+ let PdYearPopup = class extends LitElement {
15
+ constructor() {
16
+ super(...arguments);
17
+ this.yearSelection = [];
18
+ this.currentYear = "";
19
+ }
20
+ render() {
21
+ return html`
22
+ <ul>
23
+ ${this.yearSelection.map(
24
+ (year) => html`
25
+ <li
26
+ class="${this.currentYear === year ? "current" : "selectable"}"
27
+ data-year="${year}"
28
+ @click=${this._yearSelection}
29
+ >
30
+ ${year}
31
+ </li>
32
+ `
33
+ )}
34
+ </ul>
35
+ `;
36
+ }
37
+ _yearSelection(event) {
38
+ const target = event.currentTarget;
39
+ const year = target.dataset.year;
40
+ if (year) {
41
+ this.dispatchEvent(
42
+ new CustomEvent("change-year-selection", {
43
+ detail: { year },
44
+ bubbles: true,
45
+ composed: true
46
+ })
47
+ );
48
+ } else {
49
+ this._closeSelection();
50
+ }
51
+ }
52
+ _closeSelection() {
53
+ this.dispatchEvent(
54
+ new CustomEvent("abort-year-selection", {
55
+ bubbles: true,
56
+ composed: true
57
+ })
58
+ );
59
+ }
60
+ };
61
+ PdYearPopup.styles = [
62
+ PdColorStyles,
63
+ PdFontStyles,
64
+ css`
65
+ :host {
66
+ position: absolute;
67
+ z-index: 10;
68
+ top: 25px;
69
+ right: 0;
70
+ }
71
+
72
+ ul {
73
+ list-style: none;
74
+ max-height: 250px;
75
+ overflow-y: auto;
76
+
77
+ margin: 0;
78
+ padding: 4px 0;
79
+ width: 90px;
80
+ background: var(--pd-default-light-col, #ffffff);
81
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
82
+ border-radius: 8px;
83
+ border: 1px solid var(--pd-default-border-col, #ddd);
84
+
85
+ display: flex;
86
+ flex-direction: column;
87
+
88
+ scrollbar-width: thin;
89
+ }
90
+
91
+ ul::-webkit-scrollbar {
92
+ width: 6px;
93
+ }
94
+
95
+ ul::-webkit-scrollbar-thumb {
96
+ background-color: rgba(0, 0, 0, 0.2);
97
+ border-radius: 3px;
98
+ }
99
+
100
+ li {
101
+ text-align: center;
102
+ padding: 8px 0;
103
+ margin: 0 4px;
104
+ font-size: 14px;
105
+ border-radius: 4px;
106
+ color: var(--pd-default-dark-col, #333);
107
+ transition:
108
+ background-color 0.2s ease,
109
+ color 0.2s ease;
110
+ }
111
+
112
+ li.selectable:hover {
113
+ background-color: var(--pd-default-hover-bg, #f0f0f0);
114
+ color: var(--pd-default-hover-col, #000);
115
+ cursor: pointer;
116
+ }
117
+
118
+ li.current {
119
+ background-color: var(--pd-default-primary-col, #007acc);
120
+ color: white;
121
+ font-weight: bold;
122
+ }
123
+ `
124
+ ];
125
+ __decorateClass([
126
+ property({ type: Array })
127
+ ], PdYearPopup.prototype, "yearSelection", 2);
128
+ __decorateClass([
129
+ property({ type: String })
130
+ ], PdYearPopup.prototype, "currentYear", 2);
131
+ PdYearPopup = __decorateClass([
132
+ customElement("pd-year-popup")
133
+ ], PdYearPopup);
134
+ export {
135
+ PdYearPopup
136
+ };
@@ -0,0 +1,15 @@
1
+ import { StoryObj } from '@storybook/web-components';
2
+ declare const meta: {
3
+ title: string;
4
+ render: ({ infoTxt }: import('@storybook/web-components').Args) => import('lit-html').TemplateResult<1>;
5
+ argTypes: {};
6
+ parameters: {
7
+ actions: {
8
+ argTypesRegex: string;
9
+ };
10
+ };
11
+ };
12
+ export default meta;
13
+ type Story = StoryObj;
14
+ export declare const BasicCell: Story;
15
+ //# sourceMappingURL=cell.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cell.stories.d.ts","sourceRoot":"","sources":["../../src/stories/cell.stories.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAE3D,OAAO,wBAAwB,CAAC;AAGhC,QAAA,MAAM,IAAI;;;;;;;;;CAuCM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAC"}
@@ -0,0 +1,23 @@
1
+ import { StoryObj } from '@storybook/web-components';
2
+ declare const meta: {
3
+ title: string;
4
+ render: ({ hideWeekend, refDate, data, prevMonthConstraint, nextMonthConstraint, addSlot, }: import('@storybook/web-components').Args) => import('lit-html').TemplateResult<1>;
5
+ argTypes: {};
6
+ parameters: {
7
+ actions: {
8
+ argTypesRegex: string;
9
+ };
10
+ };
11
+ };
12
+ export default meta;
13
+ type Story = StoryObj;
14
+ export declare const Basic: Story;
15
+ export declare const WithInfoAndConstraints: Story;
16
+ export declare const WithSpecialDays: Story;
17
+ export declare const WithSpecialDaysHideWeekend: Story;
18
+ export declare const WithSpecificDateAndConstraints: Story;
19
+ export declare const BasicSmall: Story;
20
+ export declare const BasicSmallHugeYearSelection: Story;
21
+ export declare const BasicSmallWithRefDate: Story;
22
+ export declare const BasicSmallWithoutWeekend: Story;
23
+ //# sourceMappingURL=index.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.stories.d.ts","sourceRoot":"","sources":["../../src/stories/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAIhE,OAAO,mBAAmB,CAAC;AAG3B,QAAA,MAAM,IAAI;;;;;;;;;CAwBM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AActB,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAUF,eAAO,MAAM,sBAAsB,EAAE,KAOpC,CAAC;AAiBF,eAAO,MAAM,eAAe,EAAE,KAO7B,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,KAQxC,CAAC;AAIF,eAAO,MAAM,8BAA8B,EAAE,KAM5C,CAAC;AA2CF,eAAO,MAAM,UAAU,EAAE,KA0BxB,CAAC;AAOF,eAAO,MAAM,2BAA2B,EAAE,KA2BzC,CAAC;AAIF,eAAO,MAAM,qBAAqB,EAAE,KA+BnC,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KA0BtC,CAAC"}
@@ -0,0 +1,6 @@
1
+ export interface CalendarCellInfo {
2
+ info?: string;
3
+ special?: boolean;
4
+ }
5
+ export type CalendarData = Record<string, CalendarCellInfo[]>;
6
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,gBAAgB,EAAE,CAAC,CAAC"}