ids-enterprise-wc 1.0.0-beta.16 → 1.0.0-beta.18

package/chunks/ids-chunk-D2CIBFNK.js

@@ -0,0 +1,100 @@
+import{a as O}from"./ids-chunk-PRFN5Z6E.js";import{a as B}from"./ids-chunk-2LX24WJH.js";import{a as D}from"./ids-chunk-FYNCTTLY.js";import{b as G}from"./ids-chunk-7AX677DF.js";import{a as w}from"./ids-chunk-HXA5LW64.js";import{a as R}from"./ids-chunk-OPOTJ7IF.js";import{a as F}from"./ids-chunk-T6ZV4PDM.js";import{a as C}from"./ids-chunk-DK5QOJMP.js";import{a as T,b as S}from"./ids-chunk-XE4WFW5M.js";import{a as x}from"./ids-chunk-RCDMHHTV.js";import{e as n}from"./ids-chunk-5Q3WPKMB.js";import{a as e}from"./ids-chunk-4NXTNKXV.js";import{a as L,b as d,c as y,d as o,e as I,g as l}from"./ids-chunk-Y32WUP63.js";var V=`/* Ids Lookup Component */
+.data-grid-container {
+  overflow: hidden;
+  position: relative;
+  max-height: 400px;
+}
+
+.data-grid-parent-container {
+  overflow: auto;
+}
+
+ids-trigger-field::part(clearable-button) {
+  margin-inline-end: -3px;
+}
+
+:host-context(ids-data-grid-cell) {
+  border: 0;
+  outline: none;
+  width: 100%;
+}
+:host-context(ids-data-grid-cell) ids-trigger-field::part(container),
+:host-context(ids-data-grid-cell) ids-trigger-field::part(field-container) {
+  background-color: transparent;
+  border: 0;
+  border-radius: 0;
+  box-shadow: none;
+  outline: none;
+  height: 100%;
+  width: 100%;
+}
+
+:host-context([data-row-height=xxs]) ids-trigger-field::part(input) {
+  padding-inline: var(--ids-data-grid-padding-xxs);
+}
+
+:host-context([data-row-height=xs]) ids-trigger-field::part(input) {
+  padding-inline: var(--ids-data-grid-padding-xs);
+}
+
+:host-context([data-row-height=sm]) ids-trigger-field::part(input) {
+  padding-inline: var(--ids-data-grid-padding-sm);
+}
+
+:host-context([data-row-height=md]) ids-trigger-field::part(input) {
+  padding-inline: var(--ids-data-grid-padding-md);
+}
+
+:host-context([data-row-height=lg]) ids-trigger-field::part(input) {
+  padding-inline: var(--ids-data-grid-padding-lg);
+}
+
+.result-count {
+  font-size: var(--ids-lookup-result-count-font-size);
+  margin: var(--ids-lookup-result-count-margin);
+  vertical-align: middle;
+}`;var P=D(B(R(F(O(G(w(C(x)))))))),h,f,g,$,k,b,v,p,H,E,N,A,M,c=class extends P{constructor(){super();o(this,h);o(this,g);o(this,b);o(this,p);o(this,E);o(this,A);d(this,"triggerField");d(this,"searchField");d(this,"triggerButton");d(this,"dataGrid");d(this,"modal");d(this,"listBox");d(this,"state",{clearable:!0,dataGridSettings:{rowSelection:"multiple"},value:"",title:""});d(this,"isFormComponent",!0);Object.defineProperty(this,"title",{get:()=>y(this,g,k),set:t=>{I(this,g,t,$)},enumerable:!0,configurable:!0})}connectedCallback(){var t;super.connectedCallback(),this.triggerField=this.shadowRoot?.querySelector("ids-trigger-field"),this.triggerButton=this.shadowRoot?.querySelector('ids-trigger-button[part="trigger-lookup"]'),this.searchField=this.shadowRoot?.querySelector("ids-search-field"),this.dataGrid=this.shadowRoot?.querySelector("ids-data-grid"),this.dataGrid?.setAttribute(e.LIST_STYLE,"true"),this.modal=this.querySelector('[slot="lookup-modal"]')||this.shadowRoot?.querySelector("ids-modal"),this.modal&&(this.modal.target=this.triggerButton,this.modal.triggerType="click"),l(t=l(this,E,N).call(this),A,M).call(t)}disconnectedCallback(){super.disconnectedCallback?.(),this.dataGrid=void 0,this.modal=void 0,this.triggerField=void 0,this.triggerButton=void 0}static get attributes(){return[...super.attributes,e.AUTOCOMPLETE,e.CLEARABLE,e.DISABLED,e.FIELD,e.READONLY,e.SEARCHABLE,e.SEARCHFIELD_PLACEHOLDER,e.RECORD_COUNT,e.SIZE,e.TABBABLE,e.TITLE,e.VALUE]}template(){return`
+    <ids-trigger-field
+      label="${this.label}"
+      part="trigger-field"
+      value="${this.value===void 0?"":this.value}"
+      ${this.autocomplete?` autocomplete search-field="${this.field}"`:""}
+      ${this.clearable?' clearable="true"':""}
+      ${this.disabled?' disabled="true"':""}
+      ${this.readonly?' readonly="true"':""}
+      ${this.dirtyTracker?' dirty-tracker="true"':""}
+      ${this.compact?" compact":""}
+      ${this.size?` size="${this.size}"`:""}
+      ${this.fieldHeight?` field-height="${this.fieldHeight}"`:""}
+      ${this.validate?` validate="${this.validate}"`:""}
+      ${this.validate&&this.validationEvents?` validation-events="${this.validationEvents}"`:""}>
+      <ids-trigger-button
+        slot="trigger-end"
+        part="trigger-lookup"
+        tabbable="${this.tabbable}"
+        disabled="${this.disabled}"
+        readonly="${this.readonly}">
+        <ids-text audible="true">LookupTriggerButton</ids-text>
+        <ids-icon icon="search-list" part="icon"></ids-icon>
+      </ids-trigger-button>
+    </ids-trigger-field>
+    <slot name="lookup-modal">
+      <ids-modal id="lookup-modal" aria-labelledby="lookup-modal-title" part="modal">
+        <ids-text slot="title" font-size="24" type="h2" id="lookup-modal-title">${this.title}</ids-text>
+        ${this.searchable?`<ids-search-field clearable label="Search Field with Hidden Label" label-state="collapsed" size="full" placeholder="${this.searchfieldPlaceholder}"></ids-search-field>`:""}
+        <ids-layout-grid class="data-grid-parent-container" auto-fit="true" gap="md" no-margins="true" min-col-width="400px">
+          <ids-layout-grid-cell class="data-grid-container">
+              <ids-data-grid id="lookup-data-grid" label="${this.label}" part="data-grid" auto-fit="true">
+              </ids-data-grid>
+          </ids-layout-grid-cell>
+        </ids-layout-grid>
+
+        <ids-modal-button slot="buttons" id="modal-cancel-btn" appearance="secondary">
+          <span>Cancel</span>
+        </ids-modal-button>
+        <ids-modal-button slot="buttons" id="modal-apply-btn" appearance="primary">
+          <span>Apply</span>
+        </ids-modal-button>
+      </ids-modal>
+    </slot>
+    `}set autocomplete(t){n(t)?this.setAttribute(e.AUTOCOMPLETE,""):this.removeAttribute(e.AUTOCOMPLETE)}get autocomplete(){return this.hasAttribute(e.AUTOCOMPLETE)}onDirtyTrackerChange(t){t?this.container?.setAttribute(e.DIRTY_TRACKER,t.toString()):this.container?.removeAttribute(e.DIRTY_TRACKER)}set value(t){t!==this.state.value&&(this.state.value=(t??"").toString(),this.setAttribute(e.VALUE,this.state.value),this.triggerField&&this.triggerField.value!==this.state.value&&(this.triggerField.value=this.state.value,this.triggerField?.input?.dispatchEvent(new Event("change"))),this.triggerEvent("change",this,{detail:{elem:this,value:this.state.value}}))}get value(){return this.state.value}onLabelChange(){this.input&&(this.input.label=this.label)}onLabelStateChange(){this.input&&(this.input.labelState=this.labelState)}onLabelRequiredChange(){this.input&&(this.input.labelRequired=this.labelRequired)}set readonly(t){let i=n(t);if(this.triggerField){if(i){this.removeAttribute("disabled"),this.triggerField.readonly=!0,this.setAttribute("readonly","true");return}this.triggerField.readonly=!1,this.removeAttribute("readonly")}}get readonly(){return n(this.getAttribute("readonly"))||!1}set disabled(t){let i=n(t);if(this.triggerField){if(i){this.removeAttribute("readonly"),this.triggerField.disabled=!0,this.setAttribute("disabled","true");return}this.triggerField.disabled=!1,this.removeAttribute("disabled")}}get disabled(){return n(this.getAttribute("disabled"))||!1}set tabbable(t){let i=n(t);this.triggerField&&(this.setAttribute(e.TABBABLE,String(i)),this.triggerField.setAttribute(e.TABBABLE,String(i)))}get tabbable(){let t=this.getAttribute(e.TABBABLE);return this.readonly||this.disabled?!1:t===null?!0:n(this.getAttribute(e.TABBABLE))}set columns(t){this.dataGrid&&(this.dataGrid.columns=t)}get columns(){return this.dataGrid?.columns}set data(t){this.dataGrid&&(this.dataGrid.data=t),l(this,h,f).call(this)}get data(){return this.dataGrid?this.dataGrid.data:[]}set dataGridSettings(t){this.state.dataGridSettings=t;for(let[i,s]of Object.entries(t))this.dataGrid[i]=s;this.dataGrid&&(this.dataGrid.listStyle=!0)}get dataGridSettings(){return this.state.dataGridSettings}set validate(t){t?(this.setAttribute(e.VALIDATE,t.toString()),this.triggerField?.setAttribute(e.VALIDATE,t.toString()),this.triggerField?.setAttribute(e.VALIDATION_EVENTS,this.validationEvents),this.triggerField?.handleValidation()):(this.removeAttribute(e.VALIDATE),this.triggerField?.removeAttribute(e.VALIDATE),this.triggerField?.removeAttribute(e.VALIDATION_EVENTS),this.triggerField?.handleValidation())}get validate(){return this.getAttribute(e.VALIDATE)}set validationEvents(t){t?(this.setAttribute(e.VALIDATION_EVENTS,t.toString()),this.triggerField?.setAttribute(e.VALIDATION_EVENTS,t.toString())):(this.removeAttribute(e.VALIDATION_EVENTS),this.triggerField?.removeAttribute(e.VALIDATION_EVENTS))}get validationEvents(){return this.getAttribute(e.VALIDATION_EVENTS)||"change blur"}set field(t){t&&this.setAttribute(e.FIELD,t)}get field(){return this.getAttribute(e.FIELD)||"id"}set searchable(t){t?this.setAttribute(e.SEARCHABLE,""):this.removeAttribute(e.SEARCHABLE)}get searchable(){return this.hasAttribute(e.SEARCHABLE)||!1}set searchfieldPlaceholder(t){t?this.setAttribute(e.SEARCHFIELD_PLACEHOLDER,t):this.removeAttribute(e.SEARCHFIELD_PLACEHOLDER)}get searchfieldPlaceholder(){return this.getAttribute(e.SEARCHFIELD_PLACEHOLDER)||""}set recordCount(t){t?(this.setAttribute(e.RECORD_COUNT,t),l(this,b,v).call(this)):this.removeAttribute(e.RECORD_COUNT)}get recordCount(){return this.getAttribute(e.RECORD_COUNT)||""}set size(t){t?this.setAttribute(e.SIZE,t):this.removeAttribute(e.SIZE),this.triggerField&&this.triggerField.setAttribute(e.SIZE,this.size)}get size(){return this.getAttribute(e.SIZE)??"md"}set delimiter(t){t&&this.setAttribute(e.DELIMITER,t)}get delimiter(){return this.getAttribute(e.DELIMITER)||","}get input(){return this.container}set clearable(t){let i=n(t);i!==this.state.clearable&&(this.state.clearable=i,this.setAttribute(e.CLEARABLE,String(i)),this.triggerField?.setAttribute(e.CLEARABLE,String(i)))}get clearable(){return this.state.clearable||!0}onFieldHeightChange(t){if(t){let i=t==="compact"?{name:"compact",val:""}:{name:"field-height",val:t};this.triggerField?.setAttribute(i.name,i.val)}else this.triggerField?.removeAttribute("compact"),this.triggerField?.removeAttribute("field-height"),this.listBox?.removeAttribute("compact")}};h=new WeakSet,f=function(t=this.value){if(t===""){this.dataGrid?.selectedRows.length&&this.dataGrid.deSelectAllRows(),this.value!==t&&(this.value=t);return}let i=(r,u)=>r?.findIndex(m=>m[this.field]==u),s=t?.split(this.delimiter)||[],a=[];s.forEach((r,u)=>{let m=i(this.dataGrid?.data,r);m>-1?i(this.dataGrid?.selectedRows.map(_=>_.data),r)===-1&&this.dataGrid?.selectRow(m):a.push(u)}),a.forEach(r=>s.splice(r,1)),a=[],this.dataGrid?.selectedRows&&this.dataGrid?.selectedRows.length>s.length&&this.dataGrid?.selectedRows.forEach(r=>{s.includes(r.data[this.field])||a.push(r.index)}),a.forEach(r=>this.dataGrid?.deSelectRow(r)),this.value!==t&&(this.value=t)},g=new WeakSet,$=function(t){t&&(this.setAttribute(e.TITLE,""),this.state.title=t,l(this,b,v).call(this))},k=function(){return this.state.title||`${this.label}`},b=new WeakSet,v=function(){let t=this.modal?.querySelector('[slot="title"]');t&&(t.innerHTML=`${this.title}${this.recordCount?`<span class="result-count">${this.localeAPI.translate("Results").replace("{0}",this.recordCount)}</span>`:""}`)},p=new WeakSet,H=function(){this.value=this.dataGrid?.selectedRows.map(t=>t.data[this.field]).join(this.delimiter)||""},E=new WeakSet,N=function(){return this.onEvent("click.lookup",this.modal,t=>{let i=t.target?.getAttribute("id");i==="modal-cancel-btn"&&(this.modal?.hide(),l(this,h,f).call(this)),i==="modal-apply-btn"&&(this.modal?.hide(),l(this,p,H).call(this))}),this.onEvent("change.lookup",this.triggerField,()=>{let t=this.triggerField?.value,i=t!==this.value;if(!i){let s=this.dataGrid?.selectedRows?.map(r=>r?.data?.[this.field])||[],a=this.value?.split(this.delimiter)||[];if(s.length!==a.length&&(i=!0),!i){for(let r=0,u=a.length;r<u;r++)if(!s.includes(a[r])){i=!0;break}}}i&&l(this,h,f).call(this,t)}),this.onEvent("keydown.searchfield",this.searchField,t=>{t.key==="Enter"&&this.triggerEvent("search",this,{detail:{searchTerm:t.target.value,method:"enter"}})}),this.onEvent("cleared.searchfield",this.searchField,()=>{this.triggerEvent("cleared",this,{detail:{searchTerm:"",method:"clear"}})}),this.modal?.addEventListener("beforeshow",t=>{(this.readonly||this.disabled)&&t.detail.response(!1),this.querySelectorAll('[slot="lookup-modal"]').length!==1&&this.data?.length===0&&this.columns?.length===1&&this.columns[0].id===""&&t.detail.response(!1)}),this.dataGrid?.addEventListener("beforerowselected",t=>{this.triggerEvent("beforerowselected",this,{detail:t.detail})}),this.dataGrid?.addEventListener("rowselected",t=>{this.triggerEvent("rowselected",this,{detail:t.detail})}),this.dataGrid?.addEventListener("beforerowdeselected",t=>{this.triggerEvent("beforerowdeselected",this,{detail:t.detail})}),this.dataGrid?.addEventListener("rowdeselected",t=>{this.triggerEvent("rowdeselected",this,{detail:t.detail})}),this.dataGrid?.addEventListener("selectionchanged",t=>{this.triggerEvent("selectionchanged",this,{detail:t.detail})}),this},A=new WeakSet,M=function(){return this.listen(["ArrowDown"],this,()=>{this.modal?.show()}),this},c=L([T("ids-lookup"),S(V)],c);export{c as a};

package/chunks/ids-chunk-D3A2IZVM.js

@@ -0,0 +1,20 @@
+import{c as o}from"./ids-chunk-T35PTRDE.js";import{a as c}from"./ids-chunk-4KH6KPFZ.js";import{a as l}from"./ids-chunk-PGBU3C4E.js";import{a as m}from"./ids-chunk-WBDXDLKP.js";import{b as d}from"./ids-chunk-U34YTPJC.js";import{a as p}from"./ids-chunk-DK5QOJMP.js";import{a as n,b as r}from"./ids-chunk-XE4WFW5M.js";import{a as h}from"./ids-chunk-RCDMHHTV.js";import{d as a}from"./ids-chunk-U4XVR5SW.js";import{a as i}from"./ids-chunk-4NXTNKXV.js";import{a as s}from"./ids-chunk-Y32WUP63.js";var f=`/* Sass scss styles. Keep Base very small */
+/* Global variables */
+:host {
+  display: contents;
+}
+
+.ids-module-nav {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: row;
+  height: 100%;
+  overflow: hidden;
+  align-items: stretch;
+}
+
+ids-menu-item::part(menu-item) {
+  color: var(--ids-module-nav-settings-menu-item-text-color);
+}`;var v=c(l(p(h))),t=class extends v{constructor(){super()}connectedCallback(){super.connectedCallback(),this.configureResponsiveBehavior()}disconnectedCallback(){super.disconnectedCallback?.()}static get attributes(){return[...super.attributes,i.RESPONSIVE]}template(){return`<div class="ids-module-nav">
+      <slot></slot>
+    </div>`}get bar(){let e=this.querySelector("ids-module-nav-bar");if(e?.tagName==="IDS-MODULE-NAV-BAR")return e}get content(){let e=this.querySelector("ids-module-nav-content");if(e?.tagName==="IDS-MODULE-NAV-CONTENT")return e}get parent(){let e=a(this,"ids-container");if(e)return e}set responsive(e){m(i.RESPONSIVE,this,e),this.configureResponsiveBehavior()}get responsive(){return this.hasAttribute(i.RESPONSIVE)}onDisplayModeChange(){this.bar&&(this.bar.displayMode=this.displayMode),this.content&&(this.content.displayMode=this.displayMode),this.displayMode!=="expanded"?this.hideContentOverlay():this.isWithinMobileBreakpoint()&&this.content?.showOverlay(),this.triggerEvent("displaymodechange",this,{detail:{displayMode:this.displayMode,elem:this}})}handleOutsideClick(){this.displayMode==="expanded"&&this.isWithinMobileBreakpoint()&&(this.displayMode=!1)}configureResponsiveBehavior(){this.responsive?(this.onBreakpointDownResponse=(e,u)=>{u?this.handleBelowBreakpoint():this.handleAboveBreakpoint()},this.respondDown||(this.respondDown=o)):(this.onBreakpointDownResponse=()=>{},this.respondDown=null)}handleAboveBreakpoint(){console.info("Mobile module nav deactivated"),this.hideContentOverlay(),this.displayMode!=="expanded"&&(this.displayMode="collapsed"),this.content.offsetContent=!0}handleBelowBreakpoint(){this.displayMode==="expanded"?this.content?.showOverlay():this.displayMode=!1,this.content.offsetContent=!1}hideContentOverlay(){this.content&&this.content.overlay.visible&&this.content.hideOverlay()}isWithinMobileBreakpoint(){return d(o).matches}};t=s([n("ids-module-nav"),r(f)],t);export{t as a};

package/chunks/ids-chunk-D65OWDIK.js

@@ -0,0 +1,479 @@
+import{a as q}from"./ids-chunk-O2TH3XYL.js";import{a as me}from"./ids-chunk-TVIZTYHR.js";import{a as be}from"./ids-chunk-RKEXCJKA.js";import{a as ge}from"./ids-chunk-AWYR6KFP.js";import{a as ue}from"./ids-chunk-U34YTPJC.js";import{a as he}from"./ids-chunk-OPOTJ7IF.js";import{a as pe}from"./ids-chunk-DK5QOJMP.js";import{a as ie,b as oe}from"./ids-chunk-XE4WFW5M.js";import{a as ve}from"./ids-chunk-RCDMHHTV.js";import{b as se,c as re,d as de,h as le,j as M}from"./ids-chunk-X4NATGYL.js";import{d as ce}from"./ids-chunk-U4XVR5SW.js";import{e as b}from"./ids-chunk-5Q3WPKMB.js";import{a as l}from"./ids-chunk-4NXTNKXV.js";import{a as ae,b as ne,c as g,d as r,e as y,g as o}from"./ids-chunk-Y32WUP63.js";var fe=`.ids-calendar {
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+}
+
+.calendar-legend-pane,
+.calendar-details-pane {
+  display: none;
+  width: 220px;
+  height: auto;
+}
+
+.ids-calendar.show-legend .calendar-legend-pane,
+.ids-calendar.show-details .calendar-details-pane {
+  display: block;
+}
+
+.calendar-contents {
+  flex-grow: 1;
+}
+
+.calendar-toolbar-pane {
+  display: block;
+  border-width: 1px 1px 0;
+  border-style: solid;
+  background-color: var(--ids-calendar-toolbar-color-background);
+  border-color: var(--ids-calendar-toolbar-color-border);
+  left: 0;
+  top: 0;
+  z-index: 4;
+  flex-shrink: 0;
+}
+
+ids-toolbar-section::part(container),
+.ids-toolbar-section {
+  align-items: center;
+}
+
+.calendar-details-pane ids-accordion-header[color=azure]::part(header) {
+  background-color: var(--ids-color-azure-60);
+}
+.calendar-details-pane ids-accordion-header[color=amber]::part(header) {
+  background-color: var(--ids-color-amber-60);
+}
+.calendar-details-pane ids-accordion-header[color=amethyst]::part(header) {
+  background-color: var(--ids-color-amethyst-60);
+}
+.calendar-details-pane ids-accordion-header[color=emerald]::part(header) {
+  background-color: var(--ids-color-emerald-60);
+}
+.calendar-details-pane ids-accordion-header[color=ruby]::part(header) {
+  background-color: var(--ids-color-ruby-60);
+}
+.calendar-details-pane ids-accordion-header[color=turquoise]::part(header) {
+  background-color: var(--ids-color-turquoise-60);
+}
+.calendar-details-pane ids-accordion-header[color=slate]::part(header) {
+  background-color: var(--ids-color-neutral-60);
+}
+.calendar-details-pane ids-accordion-header::part(header) {
+  color: var(--ids-color-neutral-00);
+}
+.calendar-details-pane ids-accordion-header ids-text::part(text) {
+  overflow: hidden;
+  width: 150px;
+  white-space: nowrap;
+}
+.calendar-details-pane .panel-content {
+  padding-top: 15px;
+  padding-bottom: 15px;
+}
+.calendar-details-pane .panel-content hr {
+  border-bottom: none;
+  margin: 20px 0;
+}
+
+ids-accordion-panel::part(content) {
+  padding: 4px 0;
+}
+
+.btn-previous,
+.btn-next {
+  height: 36px;
+}
+
+.btn-today-text {
+  color: var(--ids-color-azure-60);
+}
+
+.calendar-events-list {
+  margin-top: 20px;
+  padding: 0;
+}
+.calendar-events-list .detail-item[color=azure] {
+  border-inline-start-color: var(--ids-color-azure-60);
+}
+.calendar-events-list .detail-item[color=amber] {
+  border-inline-start-color: var(--ids-color-amber-60);
+}
+.calendar-events-list .detail-item[color=amethyst] {
+  border-inline-start-color: var(--ids-color-amethyst-60);
+}
+.calendar-events-list .detail-item[color=emerald] {
+  border-inline-start-color: var(--ids-color-emerald-60);
+}
+.calendar-events-list .detail-item[color=ruby] {
+  border-inline-start-color: var(--ids-color-ruby-60);
+}
+.calendar-events-list .detail-item[color=turquoise] {
+  border-inline-start-color: var(--ids-color-turquoise-60);
+}
+.calendar-events-list .detail-item[color=slate] {
+  border-inline-start-color: var(--ids-color-neutral-60);
+}
+.calendar-events-list .detail-item {
+  background-color: var(--ids-calendar-toolbar-color-background);
+  border-style: solid;
+  border-color: var(--ids-calendar-toolbar-color-border);
+  border-width: 1px;
+  border-inline-start-width: 4px;
+  cursor: pointer;
+  display: flex;
+  flex-direction: row;
+  list-style: none;
+  align-items: center;
+  padding: 15px;
+}
+.calendar-events-list .detail-item:focus {
+  border-color: var(--ids-color-primary);
+  outline: none;
+}
+.calendar-events-list .calendar-detail-content {
+  flex-grow: 1;
+}
+.calendar-events-list .detail-item-duration {
+  padding: 0 8px;
+}
+
+.event-type-label,
+.event-types-legend {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+}
+
+.event-types-legend {
+  display: none;
+  padding: 10px;
+}
+.event-types-legend .event-type-color[color=azure] {
+  background-color: var(--ids-color-azure-60);
+}
+.event-types-legend .event-type-color[color=amber] {
+  background-color: var(--ids-color-amber-60);
+}
+.event-types-legend .event-type-color[color=amethyst] {
+  background-color: var(--ids-color-amethyst-60);
+}
+.event-types-legend .event-type-color[color=emerald] {
+  background-color: var(--ids-color-emerald-60);
+}
+.event-types-legend .event-type-color[color=ruby] {
+  background-color: var(--ids-color-ruby-60);
+}
+.event-types-legend .event-type-color[color=turquoise] {
+  background-color: var(--ids-color-turquoise-60);
+}
+.event-types-legend .event-type-color[color=slate] {
+  background-color: var(--ids-color-neutral-60);
+}
+
+.event-type-label {
+  margin: 0 8px;
+}
+
+.event-type-color {
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+  border-radius: 10px;
+  margin: 0 3px;
+}
+
+.inline-container {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+#event-form-popup {
+  width: 320px;
+}
+#event-form-popup::part(popup) {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+#event-form-header {
+  align-items: center;
+  color: var(--ids-color-neutral-10);
+  height: 40px;
+  padding-inline-start: 16px;
+  padding-inline-end: 8px;
+}
+#event-form-header ids-icon[data-action=close] {
+  color: var(--ids-color-neutral-10);
+  padding: 5px;
+  border-radius: 50%;
+  cursor: pointer;
+}
+#event-form-header ids-icon[data-action=close]:hover {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+
+#event-form {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+}
+#event-form #event-form-header[color=azure] {
+  background-color: var(--ids-color-azure-60);
+}
+#event-form #event-form-header[color=amber] {
+  background-color: var(--ids-color-amber-60);
+}
+#event-form #event-form-header[color=amethyst] {
+  background-color: var(--ids-color-amethyst-60);
+}
+#event-form #event-form-header[color=emerald] {
+  background-color: var(--ids-color-emerald-60);
+}
+#event-form #event-form-header[color=ruby] {
+  background-color: var(--ids-color-ruby-60);
+}
+#event-form #event-form-header[color=turquoise] {
+  background-color: var(--ids-color-turquoise-60);
+}
+#event-form #event-form-header[color=slate] {
+  background-color: var(--ids-color-neutral-60);
+}
+#event-form ids-list-box-option {
+  text-align: left;
+}
+#event-form ids-date-picker,
+#event-form ids-time-picker {
+  max-width: 128px;
+}
+
+#event-form-content {
+  flex-grow: 1;
+  box-sizing: border-box;
+  padding: 12px 20px;
+  position: relative;
+}
+
+#event-form-actions ids-button {
+  flex-grow: 1;
+  border: 1px solid var(--ids-color-neutral-40);
+  border-bottom-width: 0;
+}
+#event-form-actions ids-button::part(button) {
+  border-radius: 0;
+  padding-top: 13px;
+  padding-bottom: 13px;
+}
+#event-form-actions ids-button[data-action=close] {
+  border-inline-start-width: 0;
+}
+#event-form-actions ids-button[data-action=submit] {
+  border-inline-end-width: 0;
+  margin-inline-start: -1px;
+}
+#event-form-actions ids-button[data-action=submit]::part(button) {
+  color: var(--ids-color-azure-70);
+}
+#event-form-actions ids-button[data-action=submit]::part(button):hover {
+  color: var(--ids-color-azure-80);
+}
+
+@media (max-width: 840px) {
+  .ids-calendar {
+    display: block;
+  }
+  .ids-calendar.show-legend .calendar-legend-pane {
+    display: none;
+  }
+  .calendar-view-pane,
+  .calendar-details-pane {
+    width: 100%;
+  }
+  #event-form-popup {
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+  }
+  #event-form-popup::part(popup) {
+    height: 100%;
+    width: 100%;
+  }
+  #event-form-content {
+    height: 100%;
+    overflow-y: auto;
+    padding-bottom: 50px;
+  }
+  #event-form-content ids-date-picker,
+  #event-form-content ids-time-picker {
+    max-width: unset;
+  }
+  #event-form-content .inline-container {
+    position: relative;
+    display: block;
+  }
+  #event-form-actions {
+    background-color: var(--ids-popup-menu-color-background-default);
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+  }
+}`;var Oe=be(ge(me(he(pe(ve))))),H,v,E,z,ye,R,De,A,Z,F,Ee,u,p,N,we,j,ke,w,V,_,xe,m,D,Y,Se,B,Te,k,L,x,O,S,W,K,Ae,G,Ie,U,$e,I,ee,J,Pe,$,P,te,Q,Ce,T=class extends Oe{constructor(){super();r(this,z);r(this,R);r(this,A);r(this,F);r(this,u);r(this,N);r(this,j);r(this,w);r(this,_);r(this,m);r(this,Y);r(this,B);r(this,k);r(this,x);r(this,S);r(this,K);r(this,G);r(this,U);r(this,I);r(this,J);r(this,P);r(this,Q);r(this,H,parseInt(ue.md));r(this,v,void 0);r(this,E,"");ne(this,"onLocaleChange",e=>{this.updateEventDetails(this.state.selected),this.renderLegend(this.eventTypesData),o(this,S,W).call(this,e);let t=this.container?.querySelector("ids-month-view");t&&(t.locale=this.locale,t.language=this.language.name);let a=this.container?.querySelector("ids-week-view");a&&(a.locale=this.locale,a.language=this.language.name),this.container?.querySelectorAll("[translate-text]").forEach(n=>{n.language=this.language.name}),requestAnimationFrame(()=>{this.querySelectorAll("ids-checkbox[data-id]").forEach(n=>{n.setAttribute("language",this.language.name)})})});r(this,$,null)}static get attributes(){return[...super.attributes,l.DATE,l.FIRST_DAY_OF_WEEK,l.SHOW_DETAILS,l.SHOW_LEGEND,l.SUPPRESS_FORM]}set suppressForm(e){this.toggleAttribute(l.SUPPRESS_FORM,b(e))}get suppressForm(){return this.hasAttribute(l.SUPPRESS_FORM)}set showDetails(e){if(b(e))this.setAttribute(l.SHOW_DETAILS,""),this.updateEventDetails(this.state.selected),this.container?.classList.add("show-details");else{let t=this.container?.querySelector(".calendar-details-pane");t&&(t.innerHTML=""),this.removeAttribute(l.SHOW_DETAILS),this.container?.classList.remove("show-details")}}get showDetails(){return this.hasAttribute(l.SHOW_DETAILS)}set showLegend(e){b(e)?(this.setAttribute(l.SHOW_LEGEND,""),this.renderLegend(this.eventTypesData),this.container?.classList.add("show-legend")):(this.removeAttribute(l.SHOW_LEGEND),this.querySelector("#event-types-legend")?.remove(),this.container?.classList.remove("show-legend"))}get showLegend(){return this.hasAttribute(l.SHOW_LEGEND)}get showToday(){let e=this.getAttribute(l.SHOW_TODAY);return b(e)}set showToday(e){let t=b(e);t?this.setAttribute(l.SHOW_TODAY,"true"):this.removeAttribute(l.SHOW_TODAY),o(this,z,ye).call(this,t)}set date(e){let t=new Date(e);M(t)?(this.setAttribute(l.DATE,e.toString()),this.state.skipRender||(this.changeDate(t,this.state.view==="day"),this.updateEventDetails())):this.setAttribute(l.DATE,new Date().toString())}get date(){let e=new Date(this.getAttribute(l.DATE)||Date.now());return M(e)?e:new Date}connectedCallback(){super.connectedCallback(),o(this,F,Ee).call(this),this.changeView("month"),o(this,R,De).call(this),this.viewPickerConnected(),this.onLocaleChange(this.localeAPI)}disconnectedCallback(){super.disconnectedCallback?.(),g(this,v)&&(g(this,v).disconnect(),y(this,v,null))}onEventTypesChange(e){this.renderLegend(e),o(this,P,te).call(this,e,this.state.isMobile)}template(){return`
+      <div class="ids-calendar">
+        <div class="calendar-legend-pane"><slot name="legend"></slot></div>
+        <div class="calendar-contents">
+          <div class="calendar-toolbar-pane">${this.toolbarTemplate()}</div>
+          <div class="calendar-view-pane"></div>
+        </div>
+        <div class="calendar-details-pane"></div>
+      </div>
+    `}detailAccordionTemplate(e){return`<ids-accordion allow-one-pane="true">${e.map((a,n)=>`
+      <ids-accordion-panel expanded="${n===0}">
+        <ids-accordion-header color="${a.color}" slot="header">
+          <ids-text font-weight="semi-bold" overflow="ellipsis">${a.shortSubject||a.subject}</ids-text>
+        </ids-accordion-header>
+        <div slot="content" class="panel-content">
+          ${a.status?`<ids-data-label label="${this.localeAPI.translate("Status")}">${a.status}</ids-data-label><hr>`:""}
+          <ids-data-label label="${this.localeAPI.translate("Date")}">${a.dateRange}</ids-data-label><hr>
+          <ids-data-label label="Event Type">${a.eventType}</ids-data-label><hr>
+          <ids-data-label label="${this.localeAPI.translate("Duration")}">${a.duration}</ids-data-label>
+          ${a.comments?`<hr><ids-data-label label="${this.localeAPI.translate("Comments")}">${a.comments}</ids-data-label>`:""}
+        </div>
+      </ids-accordion-panel>
+    `).join("")}</ids-accordion>`}detailListTemplate(e){return`<ul class="calendar-events-list">${e.map(a=>`
+      <li color="${a.color}" class="detail-item" tabindex="0" data-id="${a.id}">
+        <div class="calendar-detail-content">
+          <ids-text font-size="18" font-weight="semi-bold">${a.subject}</ids-text>
+          <ids-text font-size="14">${a.dateRange}</ids-text>
+          <ids-text font-size="14">${a.comments||""}${a.status?` | ${a.status}`:""}</ids-text>
+        </div>
+        <ids-text font-size="12" class="detail-item-duration">${a.duration}</ids-text>
+        <ids-icon icon="caret-right"></ids-icon>
+      </li>
+    `).join("")}</ul>`}todayBtnTemplate(){return this.showToday?`<ids-button css-class="no-padding" class="btn-today">
+      <ids-text class="btn-today-text" font-size="16" translate-text="true" font-weight="semi-bold">Today</ids-text>
+    </ids-button>`:""}toolbarTemplate(){let e=`<ids-button class="btn-previous">
+      <ids-text audible="true" translate-text="true">PreviousMonth</ids-text>
+      <ids-icon icon="chevron-left"></ids-icon>
+    </ids-button>
+    <ids-button class="btn-next">
+      <ids-text audible="true" translate-text="true">NextMonth</ids-text>
+      <ids-icon icon="chevron-right"></ids-icon>
+    </ids-button>`,t=`<ids-button class="btn-picker" id="btn-picker" css-class="no-padding">
+      <ids-text font-size="20"></ids-text>
+      <ids-icon icon="calendar"></ids-icon>
+    </ids-button>
+    <ids-date-picker-popup
+      show-today="true"
+      target="#btn-picker"
+      trigger-elem="#btn-picker"
+      trigger-type="click"
+      first-day-of-week="${this.firstDayOfWeek||0}">
+    </ids-date-picker-popup>`,a=this.todayBtnTemplate();return`
+      <ids-toolbar slot="toolbar" id="calendar-toolbar" class="calendar-toolbar" tabbable="true">
+        <ids-toolbar-section type="buttonset" class="toolbar-buttonset">
+          ${e}
+          ${t}
+          ${a}
+        </ids-toolbar-section>
+        <ids-toolbar-section type="buttonset" align="end">
+          ${this.viewPicker?this.createViewPickerTemplate("month"):""}
+        </ids-toolbar-section>
+      </ids-toolbar>
+    `}createNewEvent(e,t=!1){let a=new Date(this.date),n=a.getFullYear(),i=a.getMonth(),d=a.getDate(),s={id:e,subject:"New Event",isAllDay:"true",starts:new Date(n,i,d,0,0,0).toISOString(),ends:new Date(n,i,d,23,59,59,999).toISOString(),type:"dto",comments:"New Event Comments"};if(t){let c=this.getView(),h=c instanceof q?c.getSelectedDay():this.container;h&&o(this,w,V).call(this,h,s)}else this.addEvent(s)}positionFormPopup(e){let t=o(this,u,p).call(this);t&&e&&(t.alignTarget=null,t.alignTarget=e,t.place(),t.visible=!0),t?.querySelectorAll("ids-time-picker").forEach(a=>{a.picker.hidden=!0}),t?.querySelectorAll("ids-date-picker").forEach(a=>{a.popup.hidden=!0})}changeView(e="month"){if(this.state.view===e)return;let t=e==="month"?o(this,G,Ie).call(this):o(this,U,$e).call(this,e==="day");this.insertViewTemplate(t),this.relayCalendarData(),this.state.view=e,e==="month"&&this.disableSettings?.dates?.length&&(this.getView().disableSettings=this.disableSettings)}changeDate(e,t){let a=this.getView();if(!(!a||!M(e))){if(a.tagName==="IDS-MONTH-VIEW")a.setAttribute(l.YEAR,String(e.getFullYear())),a.setAttribute(l.MONTH,String(e.getMonth())),a.setAttribute(l.DAY,String(e.getDate()));else if(a.tagName==="IDS-WEEK-VIEW"){let{start:n,end:i}=o(this,k,L).call(this,e,t);a.setAttribute(l.START_DATE,String(n)),a.setAttribute(l.END_DATE,String(i))}}}insertViewTemplate(e){let t=this.container?.querySelector(".calendar-view-pane");t&&(t.innerHTML=e)}relayCalendarData(){let e=this.getView(),t=o(this,I,ee).call(this,this.eventsData);e?.offEvent("beforeeventrendered"),e?.onEvent("beforeeventrendered",e,a=>{this.triggerEvent("beforeeventrendered",this,{detail:a.detail})}),e?.offEvent("aftereventrendered"),e?.onEvent("aftereventrendered",e,a=>{this.triggerEvent("aftereventrendered",this,{detail:a.detail})}),e&&(e.eventsData=t,e.eventTypesData=this.eventTypesData)}formatDateRange(e,t){let a={dateStyle:"long",timeStyle:"short"},n=this.localeAPI.formatDate(e,a),i=this.localeAPI.formatDate(t,a);return`${n} - ${i}`.replace(/ /g," ")}formatDuration(e,t){let a=de(e,t,!0);if(a>=24){let i=Math.round(a/24),d=this.localeAPI.translate(i===1?"Day":"Days");return`${this.localeAPI.parseNumber(i.toString())} ${d}`}if(a<1){let i=e.getMinutes(),s=t.getMinutes()-i,c=this.localeAPI.translate(s===1?"Minute":"Minutes");return`${this.localeAPI.parseNumber(s.toString())} ${c}`}let n=this.localeAPI.translate(a===1?"Hour":"Hours");return`${this.localeAPI.parseNumber(a.toString())} ${n}`}updateEventDetails(e){let t=this.container?.querySelector(".calendar-details-pane");if(!this.showDetails||!t)return;if(this.getView()?.tagName!=="IDS-MONTH-VIEW"){t.innerHTML="";return}e=e||o(this,K,Ae).call(this)||[],e=o(this,I,ee).call(this,e);let n=e.map(i=>o(this,J,Pe).call(this,i));t.innerHTML=this.state.isMobile?this.detailListTemplate(n):this.detailAccordionTemplate(n)}addEvent(e){this.eventsData=this.eventsData.concat(e),this.triggerEvent("eventadded",this,{detail:{elem:this,value:e},bubbles:!0,cancelable:!0,composed:!0})}updateEvent(e){let t=this.eventsData.slice(0),a=t.find(n=>n.id===e.id);if(a){let n=Object.assign(a,e);this.eventsData=t,this.triggerEvent("eventupdated",this,{detail:{elem:this,value:n},bubbles:!0,cancelable:!0,composed:!0})}else this.addEvent(e)}clearEvents(){this.eventsData=[],this.beforeEventsRender=void 0}renderLegend(e=[]){if(this.querySelector("#event-types-legend")?.remove(),!this.showLegend||!e.length||this.querySelector('[slot="legend"]'))return;let a=`
+      <ids-accordion id="event-types-legend" slot="legend">
+        <ids-accordion-panel expanded="true">
+          <ids-accordion-header slot="header" expander-type="caret">
+            <ids-text translate-text="true">Legend</ids-text>
+          </ids-accordion-header>
+          <div slot="content"><p>${e.map(n=>`
+      <ids-checkbox
+        class="event-type-checkbox"
+        checked="${n.checked}"
+        data-id="${n.id}"
+        label="${n.translationKey?this.localeAPI.translate(n.translationKey):n.label}"
+        color="${n.color}"
+        disabled="${n.disabled||"false"}">
+      </ids-checkbox>
+    `).join("")}</p></div>
+        </ids-accordion-panel>
+      </ids-accordion>
+    `;this.insertAdjacentHTML("afterbegin",a)}getView(){return this.container?.querySelector("ids-month-view")||this.container?.querySelector("ids-week-view")}get startDate(){let e=this.getView()?.startDate;if(!e){let t=this.date;return t.setDate(1),t}return e}get endDate(){let e=this.getView()?.endDate;if(!e){let t=this.date;return t.setMonth(t.getMonth()+1,0),t}return e}async renderEventsData(e=!1){if(!e&&typeof this.state.beforeEventsRender=="function"){this.eventsData=await this.state.beforeEventsRender(this.startDate,this.endDate);return}Array.isArray(this.eventsData)&&(this.relayCalendarData(),this.updateEventDetails())}formatMonthRange(e){let t=e||this.localeAPI;if(!t)return"";let a=this.startDate,n=le(this.endDate,1,"days"),i=t.formatDate(a,{month:"long"}),d=t.formatDate(n,{month:"long"}),s=t.formatDate(a,{year:"numeric"});return t.formatDate(n,{year:"numeric"})!==s?`${t.formatDate(a,{month:"short",year:"numeric"})} - ${t.formatDate(n,{month:"short",year:"numeric"})}`:d!==i?`${t.formatDate(a,{month:"short"})} - ${d} ${s}`:t.formatDate(a,{month:"long",year:"numeric"})}onFirstDayOfWeekChange(e){let t=this.getView();if(this.container?.querySelector("ids-date-picker-popup")?.setAttribute(l.FIRST_DAY_OF_WEEK,String(e||0)),t?.tagName==="IDS-MONTH-VIEW"&&(t.firstDayOfWeek=e),t?.tagName==="IDS-WEEK-VIEW"){let n=this.date,i=this.state.view==="day",{start:d,end:s}=o(this,k,L).call(this,n,i);t.startDate=d,t.endDate=s}}onDisableSettingsChange(e){let t=this.getView();t?.tagName==="IDS-MONTH-VIEW"&&(t.disableSettings=e)}};H=new WeakMap,v=new WeakMap,E=new WeakMap,z=new WeakSet,ye=function(e){let t=this.container?.querySelector("ids-toolbar-section");e?t?.insertAdjacentHTML("beforeend",this.todayBtnTemplate()):this.container?.querySelector(".btn-today")?.remove()},R=new WeakSet,De=function(){let e=ce(this,"ids-container")||this.container,t;y(this,v,new ResizeObserver(a=>{cancelAnimationFrame(t),t=requestAnimationFrame(()=>o(this,Q,Ce).call(this,a))})),g(this,v).observe(e)},A=new WeakSet,Z=function(e){let t=new Date(e.starts),a=new Date(e.ends),n=this.getEventTypeById(e.type),i=this.eventTypesData.map(c=>`
+      <ids-list-box-option value="${c.id}">
+        <ids-text>${c.label}</ids-text>
+      </ids-list-box-option>
+    `).join(""),d=(c,h,f)=>`
+      <ids-date-picker
+        id="${c}"
+        label="${this.localeAPI.translate(h)}"
+        size="full"
+        value="${this.localeAPI.formatDate(f)}"
+        mask>
+      </ids-date-picker>
+    `,s=(c,h)=>`
+      <ids-time-picker
+        id="${c}"
+        label="&nbsp"
+        size="full"
+        disabled="${b(e.isAllDay)}"
+        value="${this.localeAPI.formatDate(h,{hour:"numeric",minute:"numeric"})}">
+      </ids-time-picker>
+    `;return`
+      <form id="event-form" data-id="${e.id}" slot="content">
+        <div id="event-form-header" class="inline-container" color="${n?.color||"azure"}">
+          <ids-text font-size="16" font-weight="semi-bold">${n?.label||""}</ids-text>
+          <ids-icon icon="close" data-action="close" aria-label="Close" role="button"></ids-icon>
+        </div>
+        <div id="event-form-content">
+          <ids-input size="full" id="event-subject" type="text" label="${this.localeAPI.translate("Subject")}" value="${e.subject}"></ids-input>
+          <ids-dropdown size="full" id="event-type" label="${this.localeAPI.translate("EventType")}" value="${e.type}">
+            <ids-list-box>${i}</ids-list-box>
+          </ids-dropdown>
+          <ids-checkbox id="event-is-all-day" label="${this.localeAPI.translate("AllDay")}" checked="${e.isAllDay}"></ids-checkbox>
+          <div class="inline-container">
+            ${d("event-from-date","From",t)}
+            ${s("event-from-hour",t)}
+          </div>
+          <div class="inline-container">
+            ${d("event-to-date","To",a)}
+            ${s("event-to-hour",a)}
+          </div>
+          <ids-textarea size="full" id="event-comments" label="${this.localeAPI.translate("Comments")}" autoselect="true">${e.comments||""}</ids-textarea>
+        </div>
+        <div id="event-form-actions" class="inline-container">
+          <ids-button data-action="close" no-padding no-margins>
+            <ids-text font-weight="semi-bold" translate-text="true">Cancel</ids-text>
+          </ids-button>
+          <ids-button data-action="submit" no-padding no-margins>
+            <ids-text font-weight="semi-bold" translate-text="true">Submit</ids-text>
+          </ids-button>
+        </div>
+      </form>
+    `},F=new WeakSet,Ee=function(){let e,t=0,a;this.offEvent("dayselected.calendar-container"),this.onEvent("dayselected.calendar-container",this.container,n=>{clearTimeout(e),t++;let i=()=>{o(this,x,O).call(this,n.detail.date),this.state.selected=n.detail?.events||[],this.updateEventDetails(n.detail?.events)},d=()=>{if(this.suppressForm)return;let c=Date.now().toString()+Math.floor(Math.random()*100);this.createNewEvent(c,!0)},s=()=>{this.triggerEvent("daydblclick.calendar",this,{detail:{...n.detail}})};e=setTimeout(()=>{i(),t=0},250),t===2&&n.detail.date.getTime()===a?.getTime()&&(clearTimeout(e),i(),d(),t=0,s()),a=n.detail.date}),this.offEvent("viewchange.calendar"),this.onEvent("viewchange.calendar",this,n=>{n.stopPropagation(),o(this,x,O).call(this,n.detail.date),this.changeView(n.detail.view),this.renderEventsData()}),this.offEvent("datechange.calendar-container"),this.onEvent("datechange.calendar-container",this.container,n=>{n.stopPropagation(),o(this,x,O).call(this,n.detail.date),this.renderEventsData()}),this.offEvent("change.calendar-legend"),this.onEvent("change.calendar-legend",this.container?.querySelector(".calendar-legend-pane"),n=>{n.stopPropagation(),o(this,m,D).call(this),o(this,B,Te).call(this,n.detail.elem,n.detail.checked),this.relayCalendarData(),this.updateEventDetails(this.state.selected)}),this.offEvent("overflow-click.calendar-container"),this.onEvent("overflow-click.calendar-container",this.container,n=>{n.stopPropagation(),n.detail.date&&(this.setViewPickerValue("day"),this.updateEventDetails(this.state.selected))}),this.onEvent("click.details-item",this.container?.querySelector(".calendar-details-pane"),n=>{let i=n.target.closest(".detail-item");if(i){n.stopPropagation(),n.stopImmediatePropagation();let d=i.getAttribute("data-id"),s=this.getEventById(d);s&&(y(this,E,d),o(this,m,D).call(this),this.container&&o(this,w,V).call(this,this.container,s))}}),this.offEvent("clickcalendarevent",this),this.onEvent("clickcalendarevent",this,n=>{let i=n.detail.elem;y(this,E,i.eventData.id),o(this,m,D).call(this),o(this,w,V).call(this,i.container,i.eventData)}),this.offEvent("beforerendermonth"),this.onEvent("beforerendermonth",this.container,n=>{n.stopPropagation(),n.stopImmediatePropagation(),n.detail.elem.parentElement?.classList?.contains("calendar-view-pane")&&this.triggerEvent("beforerendermonth",this,{bubbles:!0,detail:{...n.detail}})}),this.offEvent("afterrendermonth"),this.onEvent("afterrendermonth",this.container,n=>{n.stopPropagation(),n.stopImmediatePropagation(),n.detail.elem.parentElement?.classList?.contains("calendar-view-pane")&&this.triggerEvent("afterrendermonth",this,{bubbles:!0,detail:{...n.detail}})}),this.viewPicker&&this.attachViewPickerEvents("month"),o(this,N,we).call(this)},u=new WeakSet,p=function(){return this.container?.querySelector("#event-form-popup")},N=new WeakSet,we=function(){let e=this.container?.querySelector("ids-toolbar-section.toolbar-buttonset"),t=this.container?.querySelector("ids-date-picker-popup");this.offEvent("show.popup"),this.onEvent("show.popup",t,()=>{o(this,S,W).call(this,this.localeAPI)}),this.offEvent("hide.popup"),this.onEvent("hide.popup",t,a=>{a.stopPropagation(),a.detail.doFocus&&t&&t.target?.focus()}),this.offEvent("click.month-view-buttons"),this.onEvent("click.month-view-buttons",e,a=>{a.stopPropagation();let n=a.target,i=this.container?.querySelector("ids-month-view"),d=this.container?.querySelector("ids-week-view");if(n.classList.contains("btn-previous")&&(i?.changeDate("previous-month"),d?.changeDate("previous")),n.classList.contains("btn-next")&&(i?.changeDate("next-month"),d?.changeDate("next")),n.classList.contains("btn-today")){let s=i||d;s?.changeDate("today"),s?.focus()}if(n.classList.contains("btn-apply")){let s=t?.year??null,c=t?.month??null;i&&(i.year=s,i.month=c),t&&(t.expanded=!1)}}),this.offEvent("dayselected.month-view-datepicker"),this.onEvent("dayselected.month-view-datepicker",t,a=>{a.stopPropagation();let n=a.detail.date;this.changeDate(n,this.state.view==="day")}),this.offEvent("expanded.month-view-picklist"),this.onEvent("expanded.month-view-picklist",t,a=>{let n=a.detail.expanded;this.container?.querySelector(".btn-today")?.setAttribute("hidden",n.toString()),this.container?.querySelector(".btn-apply")?.setAttribute("hidden",(!n).toString()),this.container?.querySelector(".btn-previous")?.setAttribute("hidden",n.toString()),this.container?.querySelector(".btn-next")?.setAttribute("hidden",n.toString()),n?this.container?.querySelector("td.is-selected")?.removeAttribute("tabindex"):this.container?.querySelector("td.is-selected")?.setAttribute("tabindex","0")}),this.showToday?(this.offEvent("click.week-view-today"),this.onEvent("click.week-view-today",this.container?.querySelector(".btn-today"),()=>{this.getView()?.changeDate("today")})):this.offEvent("click.week-view-today")},j=new WeakSet,ke=function(){let e=o(this,u,p).call(this);this.offEvent("dayselected.calendar-event-form"),this.onEvent("dayselected.calendar-event-form",e,t=>{t.stopPropagation()}),this.offEvent("click.calendar-event-form",e),this.onEvent("click.calendar-event-form",e,t=>{if(t.target&&t.target.hasAttribute("data-action")){t.stopPropagation();let a=t.target.getAttribute("data-action");if(a==="close"){o(this,m,D).call(this);return}if(a==="submit"){let n=o(this,u,p).call(this)?.querySelector("#event-form");o(this,Y,Se).call(this,n),o(this,m,D).call(this)}}}),this.offEvent("change.calendar-event-form",e),this.onEvent("change.calendar-event-form",e,t=>{t.stopPropagation();let a=t.detail.checked;o(this,_,xe).call(this,a)})},w=new WeakSet,V=function(e,t){if(this.suppressForm)return;let a=o(this,u,p).call(this);a?a.innerHTML=`${o(this,A,Z).call(this,t)}`:this.container?.insertAdjacentHTML("beforeend",`
+        <ids-popup
+          id="event-form-popup"
+          arrow="right"
+          x="160"
+          align="center"
+          animated="false"
+          visible="false"
+          type="menu"
+          position-style="absolute">
+          ${o(this,A,Z).call(this,t)}
+        </ids-popup>
+      `),this.positionFormPopup(e),o(this,j,ke).call(this),o(this,u,p).call(this)?.querySelector("#event-subject")?.focus()},_=new WeakSet,xe=function(e){let t=o(this,u,p).call(this);t&&t.querySelectorAll("ids-time-picker").forEach(a=>{a.disabled=e})},m=new WeakSet,D=function(){let e=o(this,u,p).call(this);e&&(this.offEvent("click.calendar-event-form",e),e.remove())},Y=new WeakSet,Se=function(e){let t=e.getAttribute("data-id"),a=e.querySelector("#event-subject")?.value,n=e.querySelector("#event-type")?.value,i=e.querySelector("#event-is-all-day")?.checked,d=i==="true"?"true":"false",s=e.querySelector("#event-comments")?.value,c=e.querySelector("#event-from-date"),h=e.querySelector("#event-from-hour"),f=c.dateValue;f.setHours(i?0:h.hours24),f.setMinutes(i?0:h.minutes),f.setSeconds(i?0:h.seconds);let Me=f.toISOString(),qe=e.querySelector("#event-to-date"),X=e.querySelector("#event-to-hour"),C=qe.dateValue;C.setHours(i?23:X.hours24),C.setMinutes(i?59:X.minutes),C.setSeconds(i?59:X.seconds);let Ve=C.toISOString(),Le={id:t,subject:a,type:n,isAllDay:d,starts:Me,ends:Ve,comments:s};this.updateEvent(Le)},B=new WeakSet,Te=function(e,t){let a=e.getAttribute("data-id"),n=this.getEventTypeById(a);n&&(n.checked=t)},k=new WeakSet,L=function(e,t){let a=t?e:se(e,this.firstDayOfWeek),n=t?e:re(e,this.firstDayOfWeek);return a.setHours(0,0,0,0),n.setHours(0,0,0,0),{start:a,end:n}},x=new WeakSet,O=function(e){this.state.skipRender=!0,e=e||this.date;let t=`${e.getMonth()+1}/${e.getDate()}/${e.getFullYear()}`;this.setAttribute("date",t),o(this,S,W).call(this,void 0,e),this.state.skipRender=!1},S=new WeakSet,W=function(e,t){let n=this.container?.querySelector(".btn-picker")?.querySelector("ids-text"),i=t||this.date,d=this.formatMonthRange(e)||null;n&&(n.textContent=d);let s=this.container?.querySelector("ids-date-picker-popup");s&&s?.updateMonthYearPickerTriggerDisplay&&(s.day=i.getDate(),s.month=i.getMonth(),s.year=i.getFullYear(),s?.updateMonthYearPickerTriggerDisplay(e,i))},K=new WeakSet,Ae=function(){let e=this.getView();return e&&e instanceof q?(this.state.selected=e.getActiveDayEvents(),this.state.selected):[]},G=new WeakSet,Ie=function(){let e=this.date,t=this.firstDayOfWeek?`first-day-of-week="${this.firstDayOfWeek}"`:"";return`
+      <ids-month-view
+        month="${e.getMonth()}"
+        day="${e.getDate()}"
+        year="${e.getFullYear()}"
+        ${t}>
+        <slot name="MonthViewCalendarEventTemplate" slot="customCalendarEvent"></slot>
+      </ids-month-view>
+    `},U=new WeakSet,$e=function(e=!1){let t=this.date,{start:a,end:n}=o(this,k,L).call(this,t,e);return`
+      <ids-week-view
+        start-date="${a}"
+        end-date="${n}"
+      ></ids-week-view>
+    `},I=new WeakSet,ee=function(e){if(!this.eventTypesData?.length)return e;let t=this.eventTypesData.filter(a=>a.checked).map(a=>a.id);return e.filter(a=>t.includes(a.type))},J=new WeakSet,Pe=function(e){let t=new Date(e.starts),a=new Date(e.ends),n=this.getEventTypeById(e.type);return{...e,dateRange:this.formatDateRange(t,a),duration:this.formatDuration(t,a),eventType:e.type,color:n?.color||"azure"}},$=new WeakMap,P=new WeakSet,te=function(e,t){let a=this.getView();if(!(a instanceof q))return;let n=null;t&&this.showLegend&&Array.isArray(e)&&e.length&&(n=e.map(i=>({name:i.label,color:`${i.color}-60`,dayOfWeek:[],cssClass:"event-type",fontSize:14}))),g(this,$)!==n&&(y(this,$,n),a.legend=n)},Q=new WeakSet,Ce=function(e){let a=e[0].contentRect.width<=g(this,H);this.state.isMobile!==a&&(this.state.isMobile=a,this.updateEventDetails(this.state.selected),o(this,P,te).call(this,this.eventTypesData,a),this.positionFormPopup(this.getView()?.getEventElemById(g(this,E))?.container))},T=ae([ie("ids-calendar"),oe(fe)],T);export{T as a};