@progressive-development/pd-calendar 0.9.2 → 1.0.0

package/dist/pd-calendar/pd-calendar-list-view/PdCalendarListView.js

@@ -0,0 +1,165 @@
+import { css, html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { localized, msg } from '@lit/localize';
+import { format } from 'fecha';
+import { PdBaseView } from '../../shared/PdBaseView.js';
+import '../pd-calendar-list-cell/pd-calendar-list-cell.js';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+let PdCalendarListView = class extends PdBaseView {
+  constructor() {
+    super(...arguments);
+    this.currentDate = /* @__PURE__ */ new Date();
+  }
+  render() {
+    const listEntries = this._getListEntries();
+    const emptyMessage = msg("Keine Einträge vorhanden", {
+      id: "pd.calendar.list.empty"
+    });
+    this.currentDate.getFullYear();
+    this.currentDate.getMonth();
+    return html`
+      <div class="list-view" role="list" tabindex="0">
+        ${listEntries.length > 0 ? listEntries.map(
+      (entry) => html`
+                <pd-calendar-list-cell
+                  role="listitem"
+                  key="${entry.key}"
+                  .dayNumber="${entry.day}"
+                  .monthNumber="${entry.month}"
+                  .yearNumber="${entry.year}"
+                  .weekDayNumber="${entry.weekDay}"
+                  .title="${entry.title}"
+                  .desc="${entry.desc}"
+                  .category="${entry.category}"
+                  .categoryColor="${entry.categoryColor}"
+                  .categoryTextColor="${entry.categoryTextColor}"
+                  .startTime="${entry.startTime}"
+                  .endTime="${entry.endTime}"
+                  ?fullDay="${entry.fullDay}"
+                  ?disabled="${entry.disabled}"
+                  ?selected="${this.showSelection && entry.key === format(this.refDate ?? /* @__PURE__ */ new Date(), "YYYY-MM-DD")}"
+                  .entry="${entry.entry}"
+                  .entryIndex="${entry.entryIndex}"
+                ></pd-calendar-list-cell>
+              `
+    ) : html`<div class="list-empty">${emptyMessage}</div>`}
+      </div>
+    `;
+  }
+  /**
+   * Parses a date from Date object or string (YYYY-MM-DD format).
+   */
+  _parseDate(value) {
+    if (value instanceof Date) return value;
+    const [year, month, day] = value.split("-").map(Number);
+    return new Date(year, month - 1, day);
+  }
+  /**
+   * Gets list entries from calendar data for the current month or custom range.
+   */
+  _getListEntries() {
+    const entries = [];
+    if (!this.data) return entries;
+    const year = this.currentDate.getFullYear();
+    const month = this.currentDate.getMonth();
+    const numberOfDays = new Date(year, month + 1, 0).getDate();
+    let startDate;
+    let endDate;
+    if (this.listRange) {
+      startDate = this._parseDate(this.listRange.start);
+      endDate = this._parseDate(this.listRange.end);
+    } else {
+      startDate = new Date(year, month, 1);
+      endDate = new Date(year, month, numberOfDays);
+    }
+    const currentDate = new Date(startDate);
+    while (currentDate <= endDate) {
+      const key = format(currentDate, "YYYY-MM-DD");
+      const cellDataArray = this.data[key];
+      if (cellDataArray && cellDataArray.length > 0) {
+        cellDataArray.forEach((cellData, idx) => {
+          if (cellData.info || cellData.desc) {
+            const category = cellData.category || "";
+            const categoryConfig = this._resolveCategoryConfig(category);
+            entries.push({
+              key,
+              day: currentDate.getDate(),
+              month: currentDate.getMonth() + 1,
+              year: currentDate.getFullYear(),
+              weekDay: currentDate.getDay(),
+              title: cellData.info || "",
+              desc: cellData.desc || "",
+              category,
+              categoryColor: categoryConfig?.color || "",
+              categoryTextColor: categoryConfig?.textColor || "",
+              disabled: cellData.disabled ?? false,
+              startTime: cellData.startTime || "",
+              endTime: cellData.endTime || "",
+              fullDay: cellData.fullDay ?? false,
+              entry: cellData,
+              entryIndex: idx
+            });
+          }
+        });
+      }
+      currentDate.setDate(currentDate.getDate() + 1);
+    }
+    return entries;
+  }
+};
+PdCalendarListView.styles = [
+  PdBaseView.baseStyles,
+  css`
+      .list-view {
+        display: flex;
+        flex-direction: column;
+        gap: var(--pd-spacing-sm, 0.5rem);
+        padding: var(--pd-spacing-sm, 0.5rem) 0;
+        background-color: var(
+          --pd-calendar-list-bg-col,
+          var(--pd-default-bg-col)
+        );
+        border-radius: var(--pd-radius-md);
+        max-height: var(--pd-calendar-list-max-height, 400px);
+        overflow-y: auto;
+      }
+
+      .list-view:focus {
+        outline: none;
+      }
+
+      .list-view:focus-visible {
+        outline: 2px solid var(--pd-focus-ring-col);
+        outline-offset: 2px;
+        border-radius: var(--pd-radius-md, 4px);
+      }
+
+      .list-empty {
+        padding: var(--pd-spacing-lg, 1.5rem);
+        text-align: center;
+        color: var(--pd-default-font-light-col, #6b7280);
+        font-style: italic;
+      }
+    `
+];
+__decorateClass([
+  property({ type: Object })
+], PdCalendarListView.prototype, "currentDate", 2);
+__decorateClass([
+  property({ type: Object })
+], PdCalendarListView.prototype, "listRange", 2);
+PdCalendarListView = __decorateClass([
+  localized()
+], PdCalendarListView);
+
+export { PdCalendarListView };

package/dist/pd-calendar/pd-calendar-list-view/pd-calendar-list-view.d.ts

@@ -0,0 +1,3 @@
+import { PdCalendarListView } from './PdCalendarListView.js';
+export { PdCalendarListView };
+//# sourceMappingURL=pd-calendar-list-view.d.ts.map

package/dist/pd-calendar/pd-calendar-list-view/pd-calendar-list-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-calendar-list-view.d.ts","sourceRoot":"","sources":["../../../src/pd-calendar/pd-calendar-list-view/pd-calendar-list-view.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAO7D,OAAO,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/pd-calendar/pd-calendar-list-view/pd-calendar-list-view.js

@@ -0,0 +1,8 @@
+import { PdCalendarListView } from './PdCalendarListView.js';
+
+const tag = "pd-calendar-list-view";
+if (!customElements.get(tag)) {
+  customElements.define(tag, PdCalendarListView);
+}
+
+export { PdCalendarListView };

package/dist/pd-calendar/pd-calendar-month-view/PdCalendarMonthView.d.ts

@@ -0,0 +1,55 @@
+import { CSSResultGroup, PropertyValues } from 'lit';
+import { PdBaseView } from '../../shared/PdBaseView.js';
+/**
+ * Month grid view component for the calendar.
+ * Displays a month with week rows, weekday headers, and day cells.
+ * Supports keyboard, wheel, and touch navigation.
+ *
+ * @event pd-navigate - Fired when the user navigates via wheel/touch/keyboard. Detail: `{ direction: "next" | "prev" }`.
+ *
+ * @internal - Not exported from package, used only by PdCalendar.
+ */
+export declare class PdCalendarMonthView extends PdBaseView {
+    /** Current date determining the displayed month. */
+    currentDate: Date;
+    /** Hide Saturday and Sunday columns. */
+    hideWeekend: boolean;
+    /** Whether dates are selectable. */
+    selectableDates: boolean;
+    /** CSS class for day number positioning ('top-left' or 'center'). */
+    numberClass: string;
+    /** Enable mouse wheel navigation between months. */
+    withWheelNavigation: boolean;
+    /** Enable touch swipe navigation between months. */
+    withTouchNavigation: boolean;
+    /** Cell rendering mode: "simple" uses PdCalendarCell, "events" uses PdCalendarEventCell. */
+    cellType: "simple" | "events";
+    /** @ignore */
+    private _wheelDelta;
+    /** @ignore - Currently focused day (1-31) for keyboard navigation, -1 if none */
+    private _focusedDay;
+    /** @ignore - Whether the calendar grid has focus */
+    private _gridHasFocus;
+    private _numberOfDays;
+    private _firstDayOfMonth;
+    private _year;
+    private _month;
+    private _prevCurrentDate?;
+    static styles: CSSResultGroup;
+    willUpdate(changedProperties: PropertyValues<this>): void;
+    render(): import('lit').TemplateResult<1>;
+    private _renderDay;
+    private _renderEventDay;
+    private _getWeekDays;
+    private _dispatchNavigate;
+    private _onGridFocusIn;
+    private _onGridFocusOut;
+    private _wheelEvent;
+    private _touchStartEvent;
+    private _touchEndEvent;
+    private _onGridKeyDown;
+    private _getNextSelectableDay;
+    private _selectFocusedDay;
+    private _scrollFocusedDayIntoView;
+}
+//# sourceMappingURL=PdCalendarMonthView.d.ts.map

package/dist/pd-calendar/pd-calendar-month-view/PdCalendarMonthView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdCalendarMonthView.d.ts","sourceRoot":"","sources":["../../../src/pd-calendar/pd-calendar-month-view/PdCalendarMonthView.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAKzE,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AASxD,OAAO,yCAAyC,CAAC;AACjD,OAAO,qDAAqD,CAAC;AAI7D;;;;;;;;GAQG;AACH,qBACa,mBAAoB,SAAQ,UAAU;IACjD,oDAAoD;IAEpD,WAAW,OAAc;IAEzB,wCAAwC;IAExC,WAAW,UAAS;IAEpB,oCAAoC;IAEpC,eAAe,UAAS;IAExB,qEAAqE;IAErE,WAAW,SAAc;IAEzB,oDAAoD;IAEpD,mBAAmB,UAAS;IAE5B,oDAAoD;IAEpD,mBAAmB,UAAS;IAE5B,4FAA4F;IAE5F,QAAQ,EAAE,QAAQ,GAAG,QAAQ,CAAY;IAEzC,cAAc;IAEd,OAAO,CAAC,WAAW,CAAK;IAExB,iFAAiF;IAEjF,OAAO,CAAC,WAAW,CAAM;IAEzB,oDAAoD;IAEpD,OAAO,CAAC,aAAa,CAAS;IAG9B,OAAO,CAAC,aAAa,CAAK;IAC1B,OAAO,CAAC,gBAAgB,CAAK;IAC7B,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,MAAM,CAAK;IACnB,OAAO,CAAC,gBAAgB,CAAC,CAAO;IAEhC,OAAgB,MAAM,EAAE,cAAc,CA8HpC;IAEO,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAwBzD,MAAM;IA2Cf,OAAO,CAAC,UAAU;IAwClB,OAAO,CAAC,eAAe;IAmBvB,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,iBAAiB;IAczB,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,WAAW;IAoBnB,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,cAAc;IAgBtB,OAAO,CAAC,cAAc;IA4DtB,OAAO,CAAC,qBAAqB;IAuB7B,OAAO,CAAC,iBAAiB;IAazB,OAAO,CAAC,yBAAyB;CAQlC"}