@redvars/peacock 3.5.1 → 3.6.0

package/dist/calendar-column-view.js

@@ -0,0 +1,634 @@
+import { a as i, _ as __decorate, I as IndividualComponent, i as i$1, b, A } from './IndividualComponent-DUINtMGK.js';
+import { n } from './property-1psGvXOq.js';
+import { r } from './state-DwbEjqVk.js';
+import { g as getTimePercent, c as calculateDateRange, B as BaseEvent, s as startOfDay, e as endOfDay, d as differenceInDays, a as addDays, f as formatDate, h as addHours, L as LONG_EVENT_PADDING } from './calendar-event-BrQ_SEKD.js';
+import { E as EventManager } from './event-manager-D-QCmUgR.js';
+
+var css_248z = i`@charset "UTF-8";
+* {
+  box-sizing: border-box;
+}
+
+.screen-reader-only {
+  display: none !important;
+}
+
+:host {
+  display: block;
+  height: 100%;
+  --calendar-border-color: var(--color-outline-variant);
+  --calendar-scale-color: var(--color-outline-variant);
+  --scale-size: 4rem;
+}
+
+.scale {
+  width: var(--scale-size);
+  flex-shrink: 0;
+}
+
+.calendar-column-view {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+/* ── Header ── */
+.view-header {
+  display: flex;
+  background: var(--color-surface-container);
+  border-bottom: 1px solid var(--calendar-border-color);
+}
+.view-header .columns {
+  display: flex;
+  flex: 1;
+}
+.view-header .columns .column {
+  flex: 1;
+  border-inline-start: 1px solid var(--calendar-border-color);
+}
+.view-header .columns .column:first-child {
+  border-inline-start: 0;
+}
+.view-header .columns .column .column-content {
+  display: flex;
+  align-items: center;
+  padding: 0.5rem;
+  gap: 0.5rem;
+  border-top: 3px solid transparent;
+}
+.view-header .columns .column.today .column-content {
+  border-top-color: var(--color-primary);
+}
+.view-header .columns .column.today .column-content .date {
+  color: var(--color-on-primary);
+  background: var(--color-primary);
+}
+.view-header .columns .column .date {
+  font-size: 1.5rem;
+  font-weight: 500;
+  cursor: pointer;
+  border-radius: 50%;
+  width: 2.5rem;
+  height: 2.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--color-on-surface);
+  transition: background 200ms ease;
+}
+.view-header .columns .column .date:hover {
+  background: var(--color-primary-90);
+}
+.view-header .columns .column .day {
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--color-on-surface-variant);
+}
+.view-header .scrollbar-placeholder {
+  width: var(--scrollbar-width, 0px);
+}
+
+/* ── Multi-day section ── */
+.multi-day-section-wrapper {
+  background: var(--color-surface-container);
+  border-bottom: 1px solid var(--calendar-border-color);
+}
+.multi-day-section-wrapper .multi-day-section-scroll {
+  overflow-y: auto;
+  max-height: 6rem;
+}
+.multi-day-section-wrapper .multi-day-section {
+  position: relative;
+}
+.multi-day-section-wrapper .multi-day-background {
+  display: flex;
+  height: 100%;
+  position: absolute;
+  width: 100%;
+}
+.multi-day-section-wrapper .multi-day-background .columns {
+  display: flex;
+  flex: 1;
+}
+.multi-day-section-wrapper .multi-day-background .columns .column {
+  flex: 1;
+  border-inline-start: 1px solid var(--calendar-border-color);
+}
+.multi-day-section-wrapper .multi-day-background .columns .column:first-child {
+  border-inline-start: 0;
+}
+.multi-day-section-wrapper .multi-events {
+  padding: 0 0 0 var(--scale-size);
+}
+.multi-day-section-wrapper .multi-events .row {
+  height: 1.8rem;
+  box-sizing: content-box;
+  position: relative;
+  padding-bottom: 0.25rem;
+}
+.multi-day-section-wrapper .multi-events .row:last-child {
+  padding-bottom: 0;
+}
+.multi-day-section-wrapper .multi-events .row-spacer {
+  height: 0.75rem;
+}
+.multi-day-section-wrapper .multi-events .event {
+  position: absolute;
+  height: 1.8rem;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+/* ── View body ── */
+.view-body {
+  height: 100%;
+  border-bottom: 1px solid var(--calendar-border-color);
+  overflow-y: auto;
+}
+.view-body .view-body-scroll {
+  display: flex;
+  position: relative;
+}
+.view-body .view-body-scroll .scale {
+  border-right: 1px solid var(--calendar-scale-color);
+}
+.view-body .view-body-scroll .scale .background {
+  border-inline-start: 1rem;
+}
+.view-body .view-body-scroll .scale .row {
+  width: 0;
+  position: relative;
+  height: 2rem;
+  border-bottom: 1px dashed var(--calendar-scale-color);
+}
+.view-body .view-body-scroll .scale .row.hour {
+  border-bottom: 1px solid var(--calendar-scale-color);
+  width: 50%;
+  margin-inline-start: 50%;
+}
+.view-body .view-body-scroll .scale .row:last-child {
+  border-bottom: 0;
+}
+.view-body .view-body-scroll .scale .row .time {
+  position: absolute;
+  top: -0.5rem;
+  font-size: 0.75rem;
+  color: var(--color-on-surface-variant);
+}
+.view-body .view-body-scroll .drawing-area {
+  flex: 1;
+  position: relative;
+}
+.view-body .view-body-scroll .drawing-area .background {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+.view-body .view-body-scroll .drawing-area .background .row {
+  height: 2rem;
+  border-bottom: 1px dashed var(--calendar-scale-color);
+  display: flex;
+}
+.view-body .view-body-scroll .drawing-area .background .row.hour {
+  border-bottom: 1px solid var(--calendar-scale-color);
+}
+.view-body .view-body-scroll .drawing-area .background .row:last-child {
+  border-bottom: 0;
+}
+.view-body .view-body-scroll .drawing-area .background .row .column {
+  flex: 1;
+  border-inline-start: 1px solid var(--calendar-border-color);
+}
+.view-body .view-body-scroll .drawing-area .background .row .column:first-child {
+  border-inline-start: 0;
+}
+.view-body .view-body-scroll .drawing-area .background .row .column.today {
+  background: color-mix(in srgb, var(--color-primary) 4%, transparent);
+}
+.view-body .view-body-scroll .drawing-area .events-container {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  display: flex;
+}
+.view-body .view-body-scroll .drawing-area .events-container .column {
+  flex: 1;
+  padding: 0 0.5rem 0 1px;
+}
+.view-body .view-body-scroll .drawing-area .events-container .column .column-content {
+  position: relative;
+  height: 100%;
+}
+.view-body .view-body-scroll .drawing-area .events-container .column .event {
+  position: absolute;
+}
+.view-body .view-body-scroll {
+  /* ── Current time line ── */
+}
+.view-body .view-body-scroll .current-time-line {
+  position: absolute;
+  z-index: 100;
+  pointer-events: none;
+  width: calc(100% - var(--scale-size));
+  margin-inline-start: var(--scale-size);
+}
+.view-body .view-body-scroll .current-time-line .time {
+  position: absolute;
+  font-family: var(--typography-label-small-font-family) !important;
+  font-size: var(--typography-label-small-font-size) !important;
+  font-weight: var(--typography-label-small-font-weight) !important;
+  line-height: var(--typography-label-small-line-height) !important;
+  letter-spacing: var(--typography-label-small-letter-spacing) !important;
+  color: var(--color-on-primary-container);
+  transform: translate(calc(-100% - 2px), -50%);
+  background: var(--color-primary-container);
+  padding: 2px 4px;
+  border-radius: var(--shape-corner-extra-small);
+}
+.view-body .view-body-scroll .current-time-line .dash-line {
+  position: absolute;
+  left: 0;
+  border-bottom: 1px dashed var(--color-primary);
+}
+.view-body .view-body-scroll .current-time-line .dot {
+  border-radius: 50%;
+  width: 0.5rem;
+  height: 0.5rem;
+  background: var(--color-primary);
+  display: block;
+  position: absolute;
+  top: -0.25rem;
+}
+.view-body .view-body-scroll .current-time-line .line {
+  border-bottom: 2px solid var(--color-primary);
+  position: absolute;
+  top: -1px;
+}
+
+/* ── Event styles ── */
+.event {
+  background: var(--calendar-event-bg-color);
+  border-inline-start: 0.25rem solid var(--calendar-event-border-color);
+  border-radius: var(--shape-corner-extra-small);
+  transition: background 150ms ease;
+}
+.event .event-title {
+  padding: 0.25rem 0.375rem;
+  font-size: 0.75rem;
+  font-weight: 500;
+  color: var(--calendar-event-text-color);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.event.clickable {
+  cursor: pointer;
+}
+.event.clickable:hover {
+  background: var(--calendar-event-bg-color--hover);
+}
+.event.clickable:hover .event-title {
+  color: var(--calendar-event-text-color--hover);
+}`;
+
+/**
+ * @label Calendar Column View
+ * @tag wc-calendar-column-view
+ * @rawTag calendar-column-view
+ * @parentRawTag calendar
+ * @summary Internal column view component for the calendar (day/week views).
+ */
+let CalendarColumnView = class CalendarColumnView extends i$1 {
+    constructor() {
+        super(...arguments);
+        this.events = [];
+        this.view = 'week';
+        this.days = 7;
+        this.eventClickable = true;
+        this.currentTime = new Date();
+        this.contextDate = new Date();
+        this.dateRange = {};
+        this.singleDayEvents = {};
+        this.multiDayEvents = [];
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this._processEvents();
+    }
+    willUpdate(changedProperties) {
+        if (changedProperties.has('events') ||
+            changedProperties.has('contextDate') ||
+            changedProperties.has('view') ||
+            changedProperties.has('days')) {
+            this._processEvents();
+        }
+    }
+    firstUpdated() {
+        const viewBody = this.renderRoot.querySelector('.view-body');
+        if (viewBody) {
+            const viewBodyHeight = viewBody.scrollHeight;
+            viewBody.scrollTo({
+                top: (getTimePercent(this.currentTime) / 100) * viewBodyHeight - 150,
+            });
+        }
+    }
+    _processEvents() {
+        this.dateRange = calculateDateRange(this.view, this.contextDate, this.days);
+        this.singleDayEvents = {};
+        this._forEachDayInRange(i => {
+            const manager = new EventManager();
+            manager.addEvents(this.events.filter(event => event.isOverlapping(new BaseEvent(startOfDay(i), endOfDay(i))) &&
+                event.length() < 86400000));
+            manager.process();
+            this.singleDayEvents[this._getDateOnly(i)] = manager.columns;
+        });
+        const multiManager = new EventManager();
+        multiManager.addEvents(this.events.filter(event => event.isOverlapping(new BaseEvent(this.dateRange.startDate, this.dateRange.endDate)) && event.length() >= 86400000));
+        multiManager.process();
+        this.multiDayEvents = multiManager.columns;
+    }
+    _forEachDayInRange(callback) {
+        for (let i = new Date(this.dateRange.startDate); differenceInDays(startOfDay(this.dateRange.endDate), i) >= 0; i = addDays(i, 1)) {
+            callback(i);
+        }
+    }
+    _getDateOnly(date) {
+        return formatDate(date, 'dd-MM-yyyy');
+    }
+    _getDatePercent(date) {
+        const currentDay = differenceInDays(startOfDay(date), this.dateRange.startDate);
+        const percent = (currentDay / this.dateRange.totalDays) * 100;
+        if (percent < 0)
+            return 0;
+        if (percent > 100)
+            return 100;
+        return percent;
+    }
+    _getDayClass(date) {
+        const diff = differenceInDays(startOfDay(date), startOfDay(this.currentTime));
+        if (diff === 0)
+            return 'column today';
+        if (diff < 0)
+            return 'column past';
+        return 'column future';
+    }
+    _populateColorVars(styles, color) {
+        styles['--calendar-event-bg-color'] = `var(--color-${color}-container)`;
+        styles['--calendar-event-bg-color--hover'] = `var(--color-inverse-${color})`;
+        styles['--calendar-event-border-color'] = `var(--color-${color})`;
+        styles['--calendar-event-text-color'] = `var(--color-on-${color}-container)`;
+        styles['--calendar-event-text-color--hover'] = `var(--color-on-${color})`;
+    }
+    _emitDateClick(date) {
+        this.dispatchEvent(new CustomEvent('column-view-date-click', {
+            detail: { date },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    _emitEventClick(event) {
+        this.dispatchEvent(new CustomEvent('column-view-event-click', {
+            detail: { event },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    _renderHeader() {
+        const columns = [];
+        this._forEachDayInRange(i => {
+            columns.push(b `
+        <div class=${this._getDayClass(i)}>
+          <div class="column-content">
+            <div
+              class="date"
+              @click=${() => this._emitDateClick(i)}
+            >
+              ${formatDate(i, 'dd')}
+            </div>
+            <div class="day">${formatDate(i, 'E')}</div>
+          </div>
+        </div>
+      `);
+        });
+        return columns;
+    }
+    _renderMultiDayBackground() {
+        const columns = [];
+        this._forEachDayInRange(i => {
+            columns.push(b `<div class=${this._getDayClass(i)}></div>`);
+        });
+        return columns;
+    }
+    _renderScale() {
+        const rows = [];
+        for (let i = 0; i < 48; i++) {
+            const cls = i % 2 ? 'row hour' : 'row';
+            const sd = startOfDay(new Date());
+            rows.push(b `
+        <div class=${cls}>
+          ${i % 2 === 0 && i
+                ? b `<div class="time">${formatDate(addHours(sd, i / 2), 'hh a')}</div>`
+                : A}
+        </div>
+      `);
+        }
+        return b `<div class="background">${rows}</div>`;
+    }
+    _renderBackgroundGrid() {
+        const rows = [];
+        for (let i = 0; i < 48; i++) {
+            const cls = i % 2 ? 'row hour' : 'row';
+            const columns = [];
+            this._forEachDayInRange(d => {
+                columns.push(b `<div class=${this._getDayClass(d)}></div>`);
+            });
+            rows.push(b `<div class=${cls}>${columns}</div>`);
+        }
+        return b `<div class="background">${rows}</div>`;
+    }
+    _renderEvents() {
+        const columns = [];
+        this._forEachDayInRange(i => {
+            const cls = this._getDayClass(i);
+            const eventDay = this.singleDayEvents[this._getDateOnly(i)];
+            columns.push(b `
+        <div class=${cls}>
+          <div class="column-content">
+            ${eventDay
+                ? eventDay.map((nodes, columnIndex) => nodes.map(node => {
+                    const evtCls = this.eventClickable
+                        ? 'event clickable'
+                        : 'event';
+                    const evtStyles = {
+                        top: `${getTimePercent(node.start, startOfDay(i))}%`,
+                        height: `${getTimePercent(node.end, startOfDay(i)) - getTimePercent(node.start, startOfDay(i))}%`,
+                        left: `${(columnIndex / eventDay.length) * 100}%`,
+                        width: `calc(${((1 * node.width) / eventDay.length) * 100}% - 1px)`,
+                    };
+                    if (node.color) {
+                        this._populateColorVars(evtStyles, node.color);
+                    }
+                    return b `
+                      <div
+                        class=${evtCls}
+                        style=${this._styleMap(evtStyles)}
+                        @click=${() => {
+                        if (this.eventClickable)
+                            this._emitEventClick(node.data);
+                    }}
+                      >
+                        <div class="event-title">
+                          ${node.title || '(no title)'}
+                        </div>
+                      </div>
+                    `;
+                }))
+                : A}
+          </div>
+        </div>
+      `);
+        });
+        return b `<div class="events-container">${columns}</div>`;
+    }
+    _renderMultiDayEvents() {
+        if (!this.multiDayEvents || !this.multiDayEvents.length)
+            return A;
+        return b `
+      <div class="row-content">
+        ${this.multiDayEvents.map(nodes => b `
+            <div class="row">
+              ${nodes.map(node => {
+            const evtCls = this.eventClickable
+                ? 'event clickable'
+                : 'event';
+            const evtStyles = {
+                left: `${this._getDatePercent(node.start) + LONG_EVENT_PADDING}%`,
+                width: `${this._getDatePercent(addDays(node.end, 1)) - this._getDatePercent(node.start) - 2 * LONG_EVENT_PADDING}%`,
+            };
+            if (node.color) {
+                this._populateColorVars(evtStyles, node.color);
+            }
+            return b `
+                  <div
+                    class=${evtCls}
+                    style=${this._styleMap(evtStyles)}
+                    @click=${() => {
+                if (this.eventClickable)
+                    this._emitEventClick(node.data);
+            }}
+                  >
+                    <div class="event-title">
+                      ${node.title || '(no title)'}
+                    </div>
+                  </div>
+                `;
+        })}
+            </div>
+          `)}
+        <div class="row-spacer"></div>
+      </div>
+    `;
+    }
+    _renderCurrentTime() {
+        if (this.currentTime.valueOf() < this.dateRange.startDate?.valueOf() - 1 ||
+            this.currentTime.valueOf() > this.dateRange.endDate?.valueOf() + 1) {
+            return A;
+        }
+        return b `
+      <div
+        class="current-time-line"
+        style="top: calc(${getTimePercent(this.currentTime)}% - 1px)"
+      >
+        <div class="time">${formatDate(this.currentTime, 'hh:mm a')}</div>
+        <div
+          class="dash-line"
+          style="width: ${this._getDatePercent(this.currentTime)}%"
+        ></div>
+        <div
+          class="dot"
+          style="left: calc(${this._getDatePercent(this.currentTime)}% - 0.25rem)"
+        ></div>
+        <div
+          class="line"
+          style="left: ${this._getDatePercent(this.currentTime)}%; width: ${(1 / this.dateRange.totalDays) * 100}%"
+        ></div>
+      </div>
+    `;
+    }
+    _styleMap(styles) {
+        return Object.entries(styles)
+            .map(([k, v]) => `${k}:${v}`)
+            .join(';');
+    }
+    render() {
+        return b `
+      <div class="calendar-column-view">
+        <div class="view-header">
+          <div class="scale"></div>
+          <div class="columns">${this._renderHeader()}</div>
+          <div class="scrollbar-placeholder"></div>
+        </div>
+        <div class="multi-day-section-wrapper">
+          <div class="multi-day-section-scroll">
+            <div class="multi-day-section">
+              <div class="multi-day-background">
+                <div class="scale"></div>
+                <div class="columns">
+                  ${this._renderMultiDayBackground()}
+                </div>
+              </div>
+              <div class="multi-events">
+                ${this._renderMultiDayEvents()}
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="view-body">
+          <div class="view-body-scroll">
+            <div class="scale">${this._renderScale()}</div>
+            <div class="drawing-area">
+              ${this._renderBackgroundGrid()} ${this._renderEvents()}
+            </div>
+            ${this._renderCurrentTime()}
+          </div>
+        </div>
+      </div>
+    `;
+    }
+};
+CalendarColumnView.styles = [css_248z];
+__decorate([
+    n({ type: Array })
+], CalendarColumnView.prototype, "events", void 0);
+__decorate([
+    n({ type: String })
+], CalendarColumnView.prototype, "view", void 0);
+__decorate([
+    n({ type: Number })
+], CalendarColumnView.prototype, "days", void 0);
+__decorate([
+    n({ type: Boolean, attribute: 'event-clickable' })
+], CalendarColumnView.prototype, "eventClickable", void 0);
+__decorate([
+    n({ type: Object, attribute: false })
+], CalendarColumnView.prototype, "currentTime", void 0);
+__decorate([
+    n({ type: Object, attribute: false })
+], CalendarColumnView.prototype, "contextDate", void 0);
+__decorate([
+    r()
+], CalendarColumnView.prototype, "dateRange", void 0);
+__decorate([
+    r()
+], CalendarColumnView.prototype, "singleDayEvents", void 0);
+__decorate([
+    r()
+], CalendarColumnView.prototype, "multiDayEvents", void 0);
+CalendarColumnView = __decorate([
+    IndividualComponent
+], CalendarColumnView);
+
+export { CalendarColumnView };
+//# sourceMappingURL=calendar-column-view.js.map

package/dist/calendar-column-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-column-view.js","sources":["../../src/calendar/calendar-column-view.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport {\n  addDays,\n  addHours,\n  differenceInDays,\n  startOfDay,\n  endOfDay,\n  calculateDateRange,\n  formatDate,\n  getTimePercent,\n  LONG_EVENT_PADDING,\n} from './utils.js';\nimport { BaseEvent } from './base-event.js';\nimport { CalendarEvent } from './calendar-event.js';\nimport { EventManager } from './event-manager.js';\nimport type { ColumnEvent } from './event-manager.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './calendar-column-view.scss';\n\n/**\n * @label Calendar Column View\n * @tag wc-calendar-column-view\n * @rawTag calendar-column-view\n * @parentRawTag calendar\n * @summary Internal column view component for the calendar (day/week views).\n */\n@IndividualComponent\nexport class CalendarColumnView extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Array })\n  events: CalendarEvent[] = [];\n\n  @property({ type: String })\n  view: string = 'week';\n\n  @property({ type: Number })\n  days: number = 7;\n\n  @property({ type: Boolean, attribute: 'event-clickable' })\n  eventClickable: boolean = true;\n\n  @property({ type: Object, attribute: false })\n  currentTime: Date = new Date();\n\n  @property({ type: Object, attribute: false })\n  contextDate: Date = new Date();\n\n  @state()\n  private dateRange: any = {};\n\n  @state()\n  private singleDayEvents: Record<string, ColumnEvent[][]> = {};\n\n  @state()\n  private multiDayEvents: ColumnEvent[][] = [];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this._processEvents();\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    if (\n      changedProperties.has('events') ||\n      changedProperties.has('contextDate') ||\n      changedProperties.has('view') ||\n      changedProperties.has('days')\n    ) {\n      this._processEvents();\n    }\n  }\n\n  override firstUpdated() {\n    const viewBody = this.renderRoot.querySelector('.view-body');\n    if (viewBody) {\n      const viewBodyHeight = viewBody.scrollHeight;\n      viewBody.scrollTo({\n        top:\n          (getTimePercent(this.currentTime) / 100) * viewBodyHeight - 150,\n      });\n    }\n  }\n\n  private _processEvents() {\n    this.dateRange = calculateDateRange(this.view, this.contextDate, this.days);\n    this.singleDayEvents = {};\n\n    this._forEachDayInRange(i => {\n      const manager = new EventManager();\n      manager.addEvents(\n        this.events.filter(\n          event =>\n            event.isOverlapping(new BaseEvent(startOfDay(i), endOfDay(i))) &&\n            event.length() < 86400000,\n        ),\n      );\n      manager.process();\n      this.singleDayEvents[this._getDateOnly(i)] = manager.columns;\n    });\n\n    const multiManager = new EventManager();\n    multiManager.addEvents(\n      this.events.filter(\n        event =>\n          event.isOverlapping(\n            new BaseEvent(this.dateRange.startDate, this.dateRange.endDate),\n          ) && event.length() >= 86400000,\n      ),\n    );\n    multiManager.process();\n    this.multiDayEvents = multiManager.columns;\n  }\n\n  private _forEachDayInRange(callback: (d: Date) => void) {\n    for (\n      let i = new Date(this.dateRange.startDate);\n      differenceInDays(startOfDay(this.dateRange.endDate), i) >= 0;\n      i = addDays(i, 1)\n    ) {\n      callback(i);\n    }\n  }\n\n  private _getDateOnly(date: Date): string {\n    return formatDate(date, 'dd-MM-yyyy');\n  }\n\n  private _getDatePercent(date: Date): number {\n    const currentDay = differenceInDays(\n      startOfDay(date),\n      this.dateRange.startDate,\n    );\n    const percent = (currentDay / this.dateRange.totalDays) * 100;\n    if (percent < 0) return 0;\n    if (percent > 100) return 100;\n    return percent;\n  }\n\n  private _getDayClass(date: Date): string {\n    const diff = differenceInDays(startOfDay(date), startOfDay(this.currentTime));\n    if (diff === 0) return 'column today';\n    if (diff < 0) return 'column past';\n    return 'column future';\n  }\n\n  private _populateColorVars(\n    styles: Record<string, string>,\n    color: string,\n  ) {\n    styles['--calendar-event-bg-color'] = `var(--color-${color}-container)`;\n    styles['--calendar-event-bg-color--hover'] = `var(--color-inverse-${color})`;\n    styles['--calendar-event-border-color'] = `var(--color-${color})`;\n    styles['--calendar-event-text-color'] = `var(--color-on-${color}-container)`;\n    styles['--calendar-event-text-color--hover'] = `var(--color-on-${color})`;\n  }\n\n  private _emitDateClick(date: Date) {\n    this.dispatchEvent(\n      new CustomEvent('column-view-date-click', {\n        detail: { date },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _emitEventClick(event: any) {\n    this.dispatchEvent(\n      new CustomEvent('column-view-event-click', {\n        detail: { event },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _renderHeader() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      columns.push(html`\n        <div class=${this._getDayClass(i)}>\n          <div class=\"column-content\">\n            <div\n              class=\"date\"\n              @click=${() => this._emitDateClick(i)}\n            >\n              ${formatDate(i, 'dd')}\n            </div>\n            <div class=\"day\">${formatDate(i, 'E')}</div>\n          </div>\n        </div>\n      `);\n    });\n    return columns;\n  }\n\n  private _renderMultiDayBackground() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      columns.push(html`<div class=${this._getDayClass(i)}></div>`);\n    });\n    return columns;\n  }\n\n  private _renderScale() {\n    const rows: any[] = [];\n    for (let i = 0; i < 48; i++) {\n      const cls = i % 2 ? 'row hour' : 'row';\n      const sd = startOfDay(new Date());\n      rows.push(html`\n        <div class=${cls}>\n          ${i % 2 === 0 && i\n            ? html`<div class=\"time\">${formatDate(addHours(sd, i / 2), 'hh a')}</div>`\n            : nothing}\n        </div>\n      `);\n    }\n    return html`<div class=\"background\">${rows}</div>`;\n  }\n\n  private _renderBackgroundGrid() {\n    const rows: any[] = [];\n    for (let i = 0; i < 48; i++) {\n      const cls = i % 2 ? 'row hour' : 'row';\n      const columns: any[] = [];\n      this._forEachDayInRange(d => {\n        columns.push(html`<div class=${this._getDayClass(d)}></div>`);\n      });\n      rows.push(html`<div class=${cls}>${columns}</div>`);\n    }\n    return html`<div class=\"background\">${rows}</div>`;\n  }\n\n  private _renderEvents() {\n    const columns: any[] = [];\n    this._forEachDayInRange(i => {\n      const cls = this._getDayClass(i);\n      const eventDay = this.singleDayEvents[this._getDateOnly(i)];\n      columns.push(html`\n        <div class=${cls}>\n          <div class=\"column-content\">\n            ${eventDay\n              ? eventDay.map((nodes, columnIndex) =>\n                  nodes.map(node => {\n                    const evtCls = this.eventClickable\n                      ? 'event clickable'\n                      : 'event';\n                    const evtStyles: Record<string, string> = {\n                      top: `${getTimePercent(node.start, startOfDay(i))}%`,\n                      height: `${getTimePercent(node.end, startOfDay(i)) - getTimePercent(node.start, startOfDay(i))}%`,\n                      left: `${(columnIndex / eventDay.length) * 100}%`,\n                      width: `calc(${((1 * node.width) / eventDay.length) * 100}% - 1px)`,\n                    };\n                    if (node.color) {\n                      this._populateColorVars(evtStyles, node.color);\n                    }\n                    return html`\n                      <div\n                        class=${evtCls}\n                        style=${this._styleMap(evtStyles)}\n                        @click=${() => {\n                          if (this.eventClickable) this._emitEventClick(node.data);\n                        }}\n                      >\n                        <div class=\"event-title\">\n                          ${node.title || '(no title)'}\n                        </div>\n                      </div>\n                    `;\n                  }),\n                )\n              : nothing}\n          </div>\n        </div>\n      `);\n    });\n    return html`<div class=\"events-container\">${columns}</div>`;\n  }\n\n  private _renderMultiDayEvents() {\n    if (!this.multiDayEvents || !this.multiDayEvents.length) return nothing;\n    return html`\n      <div class=\"row-content\">\n        ${this.multiDayEvents.map(\n          nodes => html`\n            <div class=\"row\">\n              ${nodes.map(node => {\n                const evtCls = this.eventClickable\n                  ? 'event clickable'\n                  : 'event';\n                const evtStyles: Record<string, string> = {\n                  left: `${this._getDatePercent(node.start) + LONG_EVENT_PADDING}%`,\n                  width: `${this._getDatePercent(addDays(node.end, 1)) - this._getDatePercent(node.start) - 2 * LONG_EVENT_PADDING}%`,\n                };\n                if (node.color) {\n                  this._populateColorVars(evtStyles, node.color);\n                }\n                return html`\n                  <div\n                    class=${evtCls}\n                    style=${this._styleMap(evtStyles)}\n                    @click=${() => {\n                      if (this.eventClickable) this._emitEventClick(node.data);\n                    }}\n                  >\n                    <div class=\"event-title\">\n                      ${node.title || '(no title)'}\n                    </div>\n                  </div>\n                `;\n              })}\n            </div>\n          `,\n        )}\n        <div class=\"row-spacer\"></div>\n      </div>\n    `;\n  }\n\n  private _renderCurrentTime() {\n    if (\n      this.currentTime.valueOf() < this.dateRange.startDate?.valueOf() - 1 ||\n      this.currentTime.valueOf() > this.dateRange.endDate?.valueOf() + 1\n    ) {\n      return nothing;\n    }\n    return html`\n      <div\n        class=\"current-time-line\"\n        style=\"top: calc(${getTimePercent(this.currentTime)}% - 1px)\"\n      >\n        <div class=\"time\">${formatDate(this.currentTime, 'hh:mm a')}</div>\n        <div\n          class=\"dash-line\"\n          style=\"width: ${this._getDatePercent(this.currentTime)}%\"\n        ></div>\n        <div\n          class=\"dot\"\n          style=\"left: calc(${this._getDatePercent(this.currentTime)}% - 0.25rem)\"\n        ></div>\n        <div\n          class=\"line\"\n          style=\"left: ${this._getDatePercent(this.currentTime)}%; width: ${(1 / this.dateRange.totalDays) * 100}%\"\n        ></div>\n      </div>\n    `;\n  }\n\n  private _styleMap(styles: Record<string, string>): string {\n    return Object.entries(styles)\n      .map(([k, v]) => `${k}:${v}`)\n      .join(';');\n  }\n\n  render() {\n    return html`\n      <div class=\"calendar-column-view\">\n        <div class=\"view-header\">\n          <div class=\"scale\"></div>\n          <div class=\"columns\">${this._renderHeader()}</div>\n          <div class=\"scrollbar-placeholder\"></div>\n        </div>\n        <div class=\"multi-day-section-wrapper\">\n          <div class=\"multi-day-section-scroll\">\n            <div class=\"multi-day-section\">\n              <div class=\"multi-day-background\">\n                <div class=\"scale\"></div>\n                <div class=\"columns\">\n                  ${this._renderMultiDayBackground()}\n                </div>\n              </div>\n              <div class=\"multi-events\">\n                ${this._renderMultiDayEvents()}\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"view-body\">\n          <div class=\"view-body-scroll\">\n            <div class=\"scale\">${this._renderScale()}</div>\n            <div class=\"drawing-area\">\n              ${this._renderBackgroundGrid()} ${this._renderEvents()}\n            </div>\n            ${this._renderCurrentTime()}\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","nothing","styles","property","state"],"mappings":"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"}