<button
  {{! template-lint-disable no-inline-styles }}
  style={{this.style}}
  class="weekly-calendar-event day-{{@day}} {{if this.isIlm "ilm"}} {{if this.clickable "clickable"}}"
  type="button"
  {{on "click" (if this.clickable @selectEvent (noop))}}
  {{did-insert (set this.theElement)}}
  {{mouse-hover-toggle (set this.showTooltip)}}
  data-test-calendar-event
  data-test-weekly-calendar-event
>
  {{#if (and this.theElement this.showTooltip)}}
    <IliosTooltip @target={{this.theElement}} data-test-ilios-calendar-event-tooltip>
      {{this.tooltipContent}}
    </IliosTooltip>
  {{/if}}
  <span class="ilios-calendar-event-icons">
    {{#if this.recentlyUpdated}}
      <FaIcon
        @icon="circle-exclamation"
        class="recently-updated-icon"
        @title={{t "general.newUpdates"}}
        data-test-recently-updated-icon
      />
    {{/if}}
    {{#if (not @event.isPublished)}}
      <FaIcon @icon="file-signature" data-test-draft-icon />
    {{else if @event.isScheduled}}
      <FaIcon @icon="clock" data-test-scheduled-icon />
    {{/if}}
  </span>
  <span class="ilios-calendar-event-time" data-test-time>
    {{#if this.isIlm}}
      <span class="ilios-calendar-event-start">
        {{t "general.ilmDue"}}:
        {{format-date this.startDate  hour12=true hour="numeric" minute="numeric"}}
      </span>
    {{else}}
      <span class="ilios-calendar-event-start">
        {{format-date this.startDate  hour12=true hour="numeric" minute="numeric"}}
      </span>
    {{/if}}
  </span>
  {{#unless @event.isMulti}}
    <span class="ilios-calendar-event-location">
      {{#if @event.location.length}}
        {{@event.location}}:
      {{/if}}
    </span>
  {{/unless}}
  <span class="ilios-calendar-event-name" data-test-name>
    {{#if @event.isMulti}}
      {{@event.name}},
      <em>
        {{t "general.multiple"}}
      </em>
    {{else}}
      {{@event.name}}
    {{/if}}
  </span>
</button>
