scb-wc 0.1.7 → 0.1.9

package/mvc/components/scb-calendar/scb-calendar.js

@@ -1 +1,168 @@
-import"../Users/peter/Documents/SCB.Material-latest-dev/src/scb-components/scb-calendar/scb-calendar-event.js";import"../Users/peter/Documents/SCB.Material-latest-dev/src/scb-components/scb-dialog/scb-dialog.js";import"../Users/peter/Documents/SCB.Material-latest-dev/src/scb-components/scb-calendar/scb-calendar.js";(function(){try{var t=typeof globalThis<"u"?globalThis:window;if(!t.__scb_ce_guard_installed__){t.__scb_ce_guard_installed__=!0;var r=customElements.define.bind(customElements);customElements.define=function(e,o,d){try{customElements.get(e)||r(e,o,d)}catch(n){var i=String(n||"");if(i.indexOf("already been used")===-1&&i.indexOf("NotSupportedError")===-1)throw n}}}}catch{}})();
+import"../../vendor/vendor-material.js";import{_ as q,b as H,g as W,h as _,y as T}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as v}from"../../vendor/decorate.js";import{n as P,t as Y}from"../../vendor/assertClassBrand.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-list/scb-list.js";import"./scb-calendar-event.js";import"../scb-dialog/scb-dialog.js";(function(){try{var x=typeof globalThis<"u"?globalThis:window;if(!x.__scb_ce_guard_installed__){x.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(e,s,a){try{customElements.get(e)||t(e,s,a)}catch(n){var i=String(n||"");if(i.indexOf("already been used")===-1&&i.indexOf("NotSupportedError")===-1)throw n}}}}catch{}})();var F,J,m=(F=new WeakSet,J=class extends q{constructor(...t){super(...t),P(this,F),this._lastActiveDay=null,this.lang="sv",this.disableWeekend=!1,this.publicHolidays=!0,this.displayYear=new Date().getFullYear(),this.displayMonth=new Date().getMonth()+1,this.selectedDate="",this.eventsJson=void 0,this._eventsFromJson=null,this._eventsJsonLast=void 0,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this._mutationObserver=null,this._syncingDisplay=!1,this._onCalendarKeyDown=e=>{const s=Array.from(this.shadowRoot?.querySelectorAll(".calendar-day.has-event")??[]),a=this.shadowRoot?.activeElement,i=a&&s.includes(a)?a:document.activeElement,n=s.indexOf(i);if(n===-1)return;let d=n;const l=this.disableWeekend?5:7;switch(e.key){case"ArrowRight":d=n+1<s.length?n+1:n;break;case"ArrowLeft":d=n-1>=0?n-1:n;break;case"ArrowDown":d=n+l<s.length?n+l:n;break;case"ArrowUp":d=n-l>=0?n-l:n;break;default:return}d!==n&&(e.preventDefault(),s[d].focus())},this._onEventChanged=()=>{this.requestUpdate()},this._today=new Date,this._current=new Date,this._popupEvent=null,this._handleDialogClose=()=>{this._popupEvent=null,this.requestUpdate(),this._restoreDayFocus()},this._restoreDayFocus=()=>{this._lastActiveDay&&setTimeout(()=>{this._lastActiveDay?.focus(),this._lastActiveDay=null},0)},this._easterDateCalculated={}}get value(){return this.selectedDate}set value(t){const e=(t??"")+"";e!==this.selectedDate&&(this.selectedDate=e)}static get observedAttributes(){return[...super.observedAttributes??[],"value"]}attributeChangedCallback(t,e,s){super.attributeChangedCallback(t,e,s),t==="value"&&(this.value=s??"")}connectedCallback(){super.connectedCallback(),Y(F,this,I).call(this);const t=Number(this.displayYear),e=Number(this.displayMonth);!Number.isNaN(t)&&!Number.isNaN(e)&&e>=1&&e<=12&&(this._current=new Date(t,e-1,1)),this._syncDisplayFromCurrent(!1),this.addEventListener("change",this._onEventChanged),this._mutationObserver=new MutationObserver(()=>{this.requestUpdate()}),this._mutationObserver.observe(this,{childList:!0}),this.addEventListener("keydown",this._onCalendarKeyDown)}disconnectedCallback(){this.removeEventListener("change",this._onEventChanged),super.disconnectedCallback(),this._mutationObserver&&(this._mutationObserver.disconnect(),this._mutationObserver=null),this.removeEventListener("keydown",this._onCalendarKeyDown)}mapSpacingToken(t){if(!t)return;const e=String(t).trim();if(e)return/^\d+$/.test(e)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(e,10)))})`:e}updated(t){if(super.updated?.(t),t.has("eventsJson")&&(this._eventsJsonLast=void 0,this._eventsFromJson=null),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&Y(F,this,I).call(this),!this._syncingDisplay&&(t.has("displayYear")||t.has("displayMonth"))){const e=Number(this.displayYear),s=Number(this.displayMonth);if(!Number.isNaN(e)&&!Number.isNaN(s)&&s>=1&&s<=12){const a=this._current.getFullYear(),i=this._current.getMonth()+1;(a!==e||i!==s)&&(this._current=new Date(e,s-1,1),this._dispatchMonthChange(e,s),this.requestUpdate())}}}_ensureEventsFromJson(){const t=(this.eventsJson??"").trim();if(!t){this._eventsFromJson=null,this._eventsJsonLast=t;return}if(!(this._eventsJsonLast===t&&this._eventsFromJson!==null)){this._eventsJsonLast=t;try{const e=JSON.parse(t);Array.isArray(e)?this._eventsFromJson=e:this._eventsFromJson=[]}catch{this._eventsFromJson=[]}}}_getEventInputs(){return Array.isArray(this.events)?this.events:(this._ensureEventsFromJson(),this._eventsFromJson!==null?this._eventsFromJson:null)}_normalizeEventInput(t){const e=t.title??"",s=t.description??"",a=t.href??"",i=t.startDate??t["start-date"]??t.start??t.date??"",n=t.endDate??t["end-date"]??t.end??"";return{title:e+"",description:s?s+"":void 0,href:a?a+"":void 0,start:i?i+"":void 0,end:n?n+"":void 0}}_toLocalEventDate(t,e){const s=(t??"").trim();if(!s)return null;if(!s.includes("T")){const i=s.split("-").map(c=>Number(c));if(i.length!==3||i.some(c=>Number.isNaN(c)))return null;const[n,d,l]=i;return e?new Date(n,d-1,l,23,59,59,999):new Date(n,d-1,l,0,0,0,0)}const a=new Date(s);return Number.isNaN(a.getTime())?null:a}_toDateKey(t){return`${t.getFullYear()}-${String(t.getMonth()+1).padStart(2,"0")}-${String(t.getDate()).padStart(2,"0")}`}_buildEventMapFromInputs(t){const e=new Map;for(const s of t){const a=this._normalizeEventInput(s),i=a.start||"",n=a.end||"";if(!(!i||!a.title))if(i&&n){const d=this._toLocalEventDate(i,!1),l=this._toLocalEventDate(n,!0);if(!d||!l)continue;if(l<d){const c=i.split("T")[0],y=e.get(c)||[];y.push({title:a.title,description:a.description,href:a.href,start:i,end:n}),e.set(c,y);continue}for(let c=new Date(d);c<=l;c.setDate(c.getDate()+1)){const y=this._toDateKey(c),E=e.get(y)||[];E.push({title:a.title,description:a.description,href:a.href,start:i,end:n}),e.set(y,E)}}else{const d=i.split("T")[0],l=e.get(d)||[];l.push({title:a.title,description:a.description,href:a.href,start:i}),e.set(d,l)}}return e}_buildEventMapFromChildren(){const t=Array.from(this.querySelectorAll("scb-calendar-event")),e=new Map;for(const s of t){const a=s,i=(a.startDate??a.date??"")+""||s.getAttribute("start-date")||s.getAttribute("date")||"",n=(a.endDate??"")+""||s.getAttribute("end-date")||"";if(i&&n){const d=this._toLocalEventDate(i,!1),l=this._toLocalEventDate(n,!0);if(!d||!l)continue;if(l<d){const c=i.split("T")[0],y=e.get(c)||[];y.push({title:s.title??"",description:s.description,href:a.href||s.getAttribute("href")||void 0,start:i,end:n}),e.set(c,y);continue}for(let c=new Date(d);c<=l;c.setDate(c.getDate()+1)){const y=this._toDateKey(c),E=e.get(y)||[];E.push({title:s.title??"",description:s.description,href:a.href||s.getAttribute("href")||void 0,start:i,end:n}),e.set(y,E)}}else if(i&&s.title){const d=i.split("T")[0],l=e.get(d)||[];l.push({title:s.title,description:s.description,href:a.href||s.getAttribute("href")||void 0,start:i}),e.set(d,l)}}return e}_syncDisplayFromCurrent(t=!0){const e=this._current.getFullYear(),s=this._current.getMonth()+1;this._syncingDisplay=!0;try{this.displayYear=e,this.displayMonth=s}finally{this._syncingDisplay=!1}t&&this._dispatchMonthChange(e,s)}_dispatchMonthChange(t,e){const s={displayYear:t,displayMonth:e};this.dispatchEvent(new CustomEvent("scb-calendar-month-change",{bubbles:!0,composed:!0,detail:s})),this.dispatchEvent(new CustomEvent("scbcalendarmonthchange",{bubbles:!0,composed:!0,detail:s}))}_dispatchSelect(t){const e={selectedDate:t};this.dispatchEvent(new CustomEvent("scb-calendar-select",{bubbles:!0,composed:!0,detail:e})),this.dispatchEvent(new CustomEvent("scbcalendarselect",{bubbles:!0,composed:!0,detail:e}))}_daysInMonth(t,e){return new Date(t,e+1,0).getDate()}_firstDayOfWeek(t,e){const s=new Date(t,e,1).getDay();return s===0?6:s-1}_prevMonth(){this._current=new Date(this._current.getFullYear(),this._current.getMonth()-1,1),this.selectedDate="",this._popupEvent=null,this._syncDisplayFromCurrent(),this.requestUpdate()}_nextMonth(){this._current=new Date(this._current.getFullYear(),this._current.getMonth()+1,1),this.selectedDate="",this._popupEvent=null,this._syncDisplayFromCurrent(),this.requestUpdate()}_showEventPopup(t){this._popupEvent=t,this.selectedDate=t.date,this._dispatchSelect(t.date),this._lastActiveDay=this.shadowRoot?.activeElement||document.activeElement,this.requestUpdate(),this.updateComplete.then(()=>{const e=this.shadowRoot?.querySelector("scb-dialog");e&&(document.activeElement&&(e.__lastTriggerEl=document.activeElement),requestAnimationFrame(()=>{requestAnimationFrame(()=>{e.open=!0})}),e.addEventListener("close",this._handleDialogClose,{once:!0}))})}_addDays(t,e){const s=new Date(t.valueOf());return s.setDate(s.getDate()+e),s}_easterDay(t){if(typeof this._easterDateCalculated["Ar"+t]<"u")return new Date(this._easterDateCalculated["Ar"+t]);let e=t;e<100&&(e=e+1900),e<1950&&(e=e+100);const s=e%19,a=e%4,i=e%7,n=(19*s+24)%30,d=(2*a+4*i+6*n+5)%7;let l=22+n+d,c=0;l==57&&(l-=7),l==56&&n==28&&d==6&&s>10&&(l-=7),l>31?(l-=31,c=4):c=3;const y=new Date(e,c-1,l);return this._easterDateCalculated["Ar"+t]=y,new Date(this._easterDateCalculated["Ar"+t])}_swedishHolidayName(t){const e=t.getMonth();if(e===1||e===6||e===7||e===8)return null;const s=t.getMonth()+1,a=t.getDate(),i=t.getFullYear(),n=this._easterDay(i),d=this.lang==="en",l=[["Nyårsdagen","New Year's Day",s===1&&a===1],["Trettondedag jul","Epiphany",s===1&&a===6],["Långfredag","Good Friday",+t==+this._addDays(n,-2)],["Påskdagen","Easter Sunday",+t==+n],["Annandag påsk","Easter Monday",+t==+this._addDays(n,1)],["Kristi himmelsfärdsdag","Ascension Day",+t==+this._addDays(n,39)],["Pingstdagen","Pentecost",+t==+this._addDays(n,50)&&i<2005],["Första maj","May Day",s===5&&a===1],["Nationaldagen","National Day",s===6&&a===6&&i>=2005],["Midsommarafton","Midsummer's Eve",s===6&&a>=19&&a<=25&&t.getDay()===5],["Midsommardagen","Midsummer's Day",s===6&&a>=20&&a<=26&&t.getDay()===6],["Julafton","Christmas Eve",s===12&&a===24],["Juldagen","Christmas Day",s===12&&a===25],["Annandag jul","Boxing Day",s===12&&a===26],["Alla helgons dag","All Saints' Day",s===10&&a>=31&&t.getDay()===6||s===11&&a<=6&&t.getDay()===6]];for(const c of l){const[y,E,A]=c;if(A)return d?E:y}return null}render(){const t=this._current.getFullYear(),e=this._current.getMonth(),s=this._daysInMonth(t,e),a=this._firstDayOfWeek(t,e),i=this._today,n=this.lang==="en",d=n?["January","February","March","April","May","June","July","August","September","October","November","December"]:["Januari","Februari","Mars","April","Maj","Juni","Juli","Augusti","September","Oktober","November","December"];let l=n?["Mon","Tue","Wed","Thu","Fri","Sat","Sun"]:["Mån","Tis","Ons","Tor","Fre","Lör","Sön"];this.disableWeekend&&(l=l.slice(0,5));const c=this._getEventInputs(),y=c?this._buildEventMapFromInputs(c):this._buildEventMapFromChildren(),E=[];let A=1;for(let r=0;r<6;r++){const h=[],f=this.disableWeekend?[0,1,2,3,4]:[0,1,2,3,4,5,6];let p=A;for(let D=0;D<f.length;D++){const w=f[D];if(r===0&&w<a){if(!this.disableWeekend||w<5){const k=e===0?11:e-1,N=e===0?t-1:t,b=this._daysInMonth(N,k)-(a-w-1);h.push(T`
+              <div class="calendar-day calendar-day--other">
+                <span class="calendar-day-number">${b}</span>
+              </div>
+            `)}}else if(p>s)h.push(T`<div></div>`);else{let k=new Date(t,e,p);if(this.disableWeekend)for(;k.getDay()===0||k.getDay()===6;)p++,k=new Date(t,e,p);if(p>s){h.push(T`<div></div>`);continue}const N=i.getFullYear()===t&&i.getMonth()===e&&i.getDate()===p,b=`${t}-${String(e+1).padStart(2,"0")}-${String(p).padStart(2,"0")}`,K=new Date(t,e,p);let L=!1,M=null;this.publicHolidays&&(M=this._swedishHolidayName(K),L=!!M);let u=y.get(b)||[];u=[...u].sort((o,g)=>{const S=o.start&&b===o.start.split("T")[0]?o.start:o.end&&b===o.end.split("T")[0]?o.end:"",$=g.start&&b===g.start.split("T")[0]?g.start:g.end&&g.end.split("T")[0]?g.end:"",C=S&&S.includes("T"),O=$&&$.includes("T");return C&&O?S.localeCompare($):C?-1:O?1:o.title.localeCompare(g.title)});const j=[...u].map(o=>{let g="",S="";if(o.start&&o.end){const $=o.start.split("T")[0],C=o.end.split("T")[0];b===$&&b===C&&o.start.includes("T")&&o.end.includes("T")?g=o.start.split("T")[1].substring(0,5)+"–"+o.end.split("T")[1].substring(0,5):b===$&&o.start.includes("T")?g=o.start.split("T")[1].substring(0,5):b===C&&o.end.includes("T")&&$!==C?(g=o.end.split("T")[1].substring(0,5),S=n?"cont. ":"fort. "):b===C&&o.end.includes("T")?g=o.end.split("T")[1].substring(0,5):b!==$&&(g="",S=n?"cont. ":"fort. ")}else o.start&&o.start.includes("T")&&(g=o.start.split("T")[1].substring(0,5));return{...o,time:g,prefix:S}});h.push(T`
+            <div
+              class="calendar-day${N?" today":""}${u.length?" has-event":""}${L?" calendar-day--holiday":""}"
+              tabindex=${u.length?"0":void 0}
+              @click=${u.length?(()=>this._showEventPopup({date:b,events:u})):null}
+              @keydown=${u.length?(o=>{(o.key==="Enter"||o.key===" ")&&(o.preventDefault(),this._showEventPopup({date:b,events:u}))}):null}
+              title=${M||(u.length===1?u[0].title:u.length>1?u.map(o=>o.title).join(", "):"")}
+              role=${u.length?"button":void 0}
+              aria-label=${M||(u.length?u.length===1?u[0].title:u.map(o=>o.title).join(", "):void 0)}
+            >
+              <md-focus-ring inward></md-focus-ring>
+              <span class="calendar-day-number">${p} ${M?T`<span class="calendar-day-holiday-name">${M}</span>`:""}</span>
+              <div class="calendar-titles-wrapper">
+                ${j.map(o=>T`<span class="calendar-day-event-title">${o.prefix||""}${o.title}</span>`)}
+              </div>
+            </div>
+          `),p++}}if(A=p,E.push(T`<div class="calendar-grid">${h}</div>`),A>s)break}return T`
+      <div class="calendar-header">
+        <scb-icon-button @click=${this._prevMonth} icon="chevron_left" aria-label="${n?"Previous month":"Föregående månad"}"></scb-icon-button>
+        <span>${d[e]} ${t}</span>
+        <scb-icon-button @click=${this._nextMonth} icon="chevron_right" aria-label="${n?"Next month":"Nästa månad"}"></scb-icon-button>
+      </div>
+      <div class="calendar-grid calendar-grid-days">
+        ${l.map(r=>T`<div>${r}</div>`)}
+      </div>
+      <div class="calendar-weeks">
+      ${E}
+      </div>
+      ${this._popupEvent&&Array.isArray(this._popupEvent.events)?T`
+        <scb-dialog variant="floating" open label="${n?"Events":"Händelser"} ${this._popupEvent.date}">
+          <scb-list>
+            ${[...this._popupEvent.events].sort((r,h)=>{const f=r.start&&r.start.includes("T")?r.start:r.end&&r.end.includes("T")?r.end:"",p=h.start&&h.start.includes("T")?h.start:h.end&&h.end.includes("T")?h.end:"",D=f&&f.includes("T"),w=p&&p.includes("T");return D&&w?f.localeCompare(p):D?-1:w?1:r.title.localeCompare(h.title)}).map(r=>{const h=this._popupEvent?.date??"";let f="",p="",D="";if(r.start&&r.end){const w=r.start.split("T")[0],k=r.end.split("T")[0];w===k&&r.start.includes("T")&&r.end.includes("T")?f=r.start.split("T")[1].substring(0,5)+" – "+r.end.split("T")[1].substring(0,5):h===w&&r.start.includes("T")&&(f="Start: "+r.start.split("T")[1].substring(0,5)+(n?" (Extended event) ":" (Flerdagsevenemang) ")),h===k&&r.end.includes("T")&&w!==k&&(D=(n?"End: ":"Slut: ")+r.end.split("T")[1].substring(0,5)),h!==w&&(p=n?"cont. ":"fort. ")}else r.start&&r.start.includes("T")&&(f=r.start.split("T")[1].substring(0,5));return r.href?T`
+                  <scb-list-item
+                    type="link"
+                    item-href="${r.href}"
+                    label="${p}${r.title}"
+                    supporting-text="${r.description?r.description:""}"
+                    overline="${f||""}${D||""}"
+                  >
+                  </scb-list-item>`:T`
+                <scb-list-item
+                  label="${p}${r.title}"
+                  supporting-text="${r.description?r.description:""}"
+                  overline="${f||""}${D||""}"
+                >
+                </scb-list-item>`})}
+          </scb-list>
+        </scb-dialog>
+      `:""}
+    `}},J.styles=H`
+    :host {
+        display: block;
+        margin-block-start: var(--scb-calendar-spacing-block-start, 0);
+        margin-block-end: var(--scb-calendar-spacing-block-end, 0);
+        margin-inline-start: var(--scb-calendar-spacing-inline-start, 0);
+        margin-inline-end: var(--scb-calendar-spacing-inline-end, 0);
+        border: 1px solid var(--md-sys-color-outline-variant);
+        padding: var(--spacing-5);
+        border-radius: var(--md-sys-shape-corner-large);
+        background: var(--md-sys-color-surface);
+        font-family: var(--brand-font);
+    }
+    .calendar-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-bottom: var(--spacing-5);
+        border-bottom: 1px solid rgb(224, 224, 224);
+        padding-bottom: var(--spacing-3);
+    }
+    .calendar-grid {
+      display: grid;
+      gap: var(--spacing-2);
+      margin-bottom: var(--spacing-2);
+      grid-template-columns: repeat(7, 1fr);
+    }
+    :host([disable-weekend]) .calendar-grid {
+      grid-template-columns: repeat(5, 1fr);
+    }
+    .calendar-grid-days{
+        font-weight: 600;
+        margin-bottom: var(--spacing-5);
+    }
+    .calendar-weeks {
+        display: grid;
+        grid-auto-rows: 1fr;
+    }
+    .calendar-titles-wrapper{
+        display: grid;
+        gap: var(--spacing-2);
+    }
+    .calendar-day {
+        border-radius: 6px;
+        min-height: 50px;
+        display: flex;
+        padding: var(--spacing-3);
+        box-sizing: border-box;
+        overflow: hidden;
+        gap: var(--spacing-3);
+        border: 1px solid var(--md-sys-color-outline-variant, #e0e0e0);
+        flex-direction: column;
+    }
+    .calendar-day--holiday {
+      background: var(--md-sys-color-error-container);
+    }
+    .calendar-day.has-event:focus {
+        outline: none;
+    }
+    md-focus-ring {
+        border-radius: 6px;
+    }
+    .calendar-day--other {
+       color: light-dark(var(--n-40), var(--n-70));
+    }
+    .calendar-day--other .calendar-day-event-title {
+       color: inherit;
+    }
+    .calendar-day--other .calendar-day-number {
+       font-weight: var(--weight-regular);
+    }
+    .calendar-day-number {
+        font-size:  var(--md-sys-typescale-label-small-size);
+        line-height: var(--md-sys-typescale-label-small-line-height); /* vissa tabeller i Figma visar 21 */
+        font-weight: var(--md-sys-typescale-label-small-weight);
+        letter-spacing: var(--md-sys-typescale-label-small-tracking);
+        display: flex;
+        gap: 8px;
+    }
+    .calendar-day-event-title {
+        font-size: 12px;
+        color: var(--md-sys-color-primary);
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: block;
+        width: 100%;
+    }
+    .calendar-day-holiday-name{
+        color: var(--md-sys-color-on-error-container);
+        font-weight: var(--md-sys-typescale-body-medium-weight);
+        font-size: 12px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: block;
+        width: 100%;
+    }
+    .calendar-day.today {
+        background: var(--md-sys-color-secondary-container);
+      
+    }
+    .calendar-day.has-event {
+        cursor: pointer;
+        position: relative;
+        border: 1px solid var(--md-sys-color-primary);
+    }
+
+    .event-popup-list{
+        display: flex;
+        flex-direction: column;
+        gap: var(--spacing-4);
+    }
+    
+  `,J);function I(){const x=this.mapSpacingToken(this.spacing),t=this.mapSpacingToken(this.spacingTop)??x,e=this.mapSpacingToken(this.spacingBottom)??x,s=this.mapSpacingToken(this.spacingLeft),a=this.mapSpacingToken(this.spacingRight);t?this.style.setProperty("--scb-calendar-spacing-block-start",t):this.style.removeProperty("--scb-calendar-spacing-block-start"),e?this.style.setProperty("--scb-calendar-spacing-block-end",e):this.style.removeProperty("--scb-calendar-spacing-block-end"),s?this.style.setProperty("--scb-calendar-spacing-inline-start",s):this.style.removeProperty("--scb-calendar-spacing-inline-start"),a?this.style.setProperty("--scb-calendar-spacing-inline-end",a):this.style.removeProperty("--scb-calendar-spacing-inline-end")}v([_({type:String})],m.prototype,"lang",void 0);v([_({type:Boolean,attribute:"disable-weekend"})],m.prototype,"disableWeekend",void 0);v([_({type:Boolean,attribute:"public-holidays"})],m.prototype,"publicHolidays",void 0);v([_({type:Number,attribute:"display-year",reflect:!0})],m.prototype,"displayYear",void 0);v([_({type:Number,attribute:"display-month",reflect:!0})],m.prototype,"displayMonth",void 0);v([_({type:String,attribute:"selected-date",reflect:!0})],m.prototype,"selectedDate",void 0);v([_({attribute:!1})],m.prototype,"events",void 0);v([_({type:String,attribute:"events-json"})],m.prototype,"eventsJson",void 0);v([_({type:String,reflect:!0})],m.prototype,"spacing",void 0);v([_({type:String,attribute:"spacing-top",reflect:!0})],m.prototype,"spacingTop",void 0);v([_({type:String,attribute:"spacing-bottom",reflect:!0})],m.prototype,"spacingBottom",void 0);v([_({type:String,attribute:"spacing-left",reflect:!0})],m.prototype,"spacingLeft",void 0);v([_({type:String,attribute:"spacing-right",reflect:!0})],m.prototype,"spacingRight",void 0);m=v([W("scb-calendar")],m);

package/mvc/components/scb-calendar-card/scb-calendar-card.js

@@ -1 +1,346 @@
-import"../Users/peter/Documents/SCB.Material-latest-dev/src/scb-components/scb-calendar-card/scb-calendar-card.js";(function(){try{var t=typeof globalThis<"u"?globalThis:window;if(!t.__scb_ce_guard_installed__){t.__scb_ce_guard_installed__=!0;var i=customElements.define.bind(customElements);customElements.define=function(e,d,o){try{customElements.get(e)||i(e,d,o)}catch(r){var n=String(r||"");if(n.indexOf("already been used")===-1&&n.indexOf("NotSupportedError")===-1)throw r}}}}catch{}})();
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../../vendor/vendor-material.js","../../vendor/vendor.js","../../vendor/vendor-lit.js"])))=>i.map(i=>d[i]);
+import"../../vendor/vendor-material.js";import{_ as z,b as w,g as k,h as t,y as l}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as i}from"../../vendor/decorate.js";import{n as _,t as m}from"../../vendor/assertClassBrand.js";import{t as y}from"../../vendor/preload-helper.js";(function(){try{var n=typeof globalThis<"u"?globalThis:window;if(!n.__scb_ce_guard_installed__){n.__scb_ce_guard_installed__=!0;var e=customElements.define.bind(customElements);customElements.define=function(r,c,s){try{customElements.get(r)||e(r,c,s)}catch(g){var h=String(g||"");if(h.indexOf("already been used")===-1&&h.indexOf("NotSupportedError")===-1)throw g}}}}catch{}})();var d,o,p,a=(d=new WeakSet,o=class extends z{constructor(...e){super(...e),_(this,d),this.variant="default",this.size="medium",this.date=null,this.direction="horizontal",this.title="",this.calendarCardTitle="",this.subtitle="",this.supportingText="",this.cardHref="",this.cardHrefNav="",this.showMedia=null,this.mediaWidth="",this.mediaHeight="",this.mediaAspect="",this.width="",this.maxWidth="",this.minWidth="",this.height="",this.maxHeight="",this.minHeight="",this.sizing="stretch",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}async firstUpdated(){p.__iconLoaded||(await y(()=>import("../../vendor/vendor-material.js").then(e=>e.p),__vite__mapDeps([0,1,2]),import.meta.url),p.__iconLoaded=!0),p.__rippleLoaded||(await y(()=>import("../../vendor/vendor-material.js").then(e=>e.f),__vite__mapDeps([0,1,2]),import.meta.url),p.__rippleLoaded=!0),this.__applyInnerSizing(),m(d,this,u).call(this)}render(){const e=this.variant?`${this.variant.toLowerCase()}`:"",r=this.direction?`${this.direction.toLowerCase()}`:"",c=this.cardHref?"clickable":"",{day:s,month:h}=m(d,this,S).call(this),g=this.mediaWidth&&this.mediaWidth.trim()!==""?this.mediaWidth:"",b=this.mediaHeight&&this.mediaHeight.trim()!==""?this.mediaHeight:"",v=this.mediaAspect&&this.mediaAspect.trim()!==""?this.mediaAspect:"",x=`${g?`inline-size:${g};`:""}${b?`block-size:${b};`:""}${v?`aspect-ratio:${v};`:""}`;return l`
+      <div
+        class="calendar-card ${r} ${c} ${e}"
+        role="${this.cardHref?"link":"group"}"
+        aria-label="${f.call(m(d,this))||"Kalenderkort"}"
+        tabindex="${this.cardHref?"0":"-1"}"
+        @click=${this.cardHref?this._handleHrefNavigation:null}
+        @keydown=${this.cardHref?this._onKeyDown:null}
+        style="cursor: ${this.cardHref?"pointer":"default"};"
+      >
+        ${this.cardHref?l`<md-ripple></md-ripple>`:""}
+        ${this.showMedia?l`
+              <div class="media" style="${x}" aria-label="Datum: ${s} ${h}">
+                <div class="day">${s}</div>
+                <div class="month">${h}</div>
+              </div>
+            `:""}
+        <div class="container">
+        <div class="header-container">
+          <div class="title-container">
+            <div class="title">${f.call(m(d,this))}</div>
+            ${this.cardHref?l`<div class="icon-container"><md-icon>arrow_forward</md-icon></div>`:""}
+          </div>
+          ${this.subtitle?l`<div class="subtitle">${this.subtitle}</div>`:""}</div>
+          ${this.supportingText?l`<div class="supporting-text">${this.supportingText}</div>`:""}
+        </div>
+      </div>
+      ${this.cardHref?l`<md-focus-ring></md-focus-ring>`:""}
+    `}__applyInnerSizing(){const e=this.renderRoot.querySelector(".calendar-card");e&&(this.width&&this.width.trim()!==""?(e.style.inlineSize="100%",e.style.maxInlineSize="100%"):(e.style.removeProperty("inline-size"),e.style.removeProperty("max-inline-size")),this.height&&this.height.trim()!==""||this.sizing==="stretch"?e.style.blockSize="100%":e.style.removeProperty("block-size"),this.maxHeight&&this.maxHeight.trim()!==""?e.style.maxBlockSize="100%":e.style.removeProperty("max-block-size"))}_onKeyDown(e){(e.key==="Enter"||e.key===" ")&&this.cardHref&&(window.open(this.cardHref,"_self"),e.preventDefault())}_handleHrefNavigation(){this.cardHref&&(this.cardHrefNav==="tab"?window.open(this.cardHref,"_blank"):this.cardHrefNav==="window"?window.open(this.cardHref,"_blank","noopener,noreferrer,width=800,height=600"):window.open(this.cardHref,"_self"))}mapSpacingToken(e){if(!e)return;const r=String(e).trim();if(r)return/^\d+$/.test(r)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(r,10)))})`:r}updated(e){e.has("width")&&(this.width?this.style.inlineSize=this.width:this.style.removeProperty("inline-size")),e.has("maxWidth")&&(this.maxWidth?this.style.maxInlineSize=this.maxWidth:this.style.removeProperty("max-inline-size")),e.has("minWidth")&&(this.minWidth?this.style.minInlineSize=this.minWidth:this.style.removeProperty("min-inline-size")),e.has("height")&&(this.height?this.style.blockSize=this.height:this.style.removeProperty("block-size")),e.has("maxHeight")&&(this.maxHeight?this.style.maxBlockSize=this.maxHeight:this.style.removeProperty("max-block-size")),e.has("minHeight")&&(this.minHeight?this.style.minBlockSize=this.minHeight:this.style.removeProperty("min-block-size")),(e.has("width")||e.has("height")||e.has("maxHeight")||e.has("sizing"))&&this.__applyInnerSizing(),(e.has("spacing")||e.has("spacingTop")||e.has("spacingBottom")||e.has("spacingLeft")||e.has("spacingRight"))&&m(d,this,u).call(this)}},p=o,o.__iconLoaded=!1,o.__rippleLoaded=!1,o.styles=w`
+    :host {
+      display: block;
+      position: relative;
+      box-sizing: border-box;
+      inline-size: 100%;
+      min-inline-size: 0;
+      padding: var(--scb-calendar-card-focus-ring-gap, 4px);
+      margin-block-start: var(--scb-calendar-card-spacing-block-start, 0);
+      margin-block-end: var(--scb-calendar-card-spacing-block-end, 0);
+      margin-inline-start: var(--scb-calendar-card-spacing-inline-start, 0);
+      margin-inline-end: var(--scb-calendar-card-spacing-inline-end, 0);
+
+      --scb-calendar-card-padding: var(--spacing-spacing-7, 24px);
+      --scb-calendar-card-gap: var(--spacing-spacing-4, 12px);
+      --scb-calendar-card-horizontal-gap: var(--spacing-spacing-6, 20px);
+      --scb-calendar-card-horizontal-min-block-size: 112px;
+
+      --scb-calendar-card-media-size: var(--spacing-spacing-11, 64px);
+      --scb-calendar-card-media-gap: var(--spacing-spacing-2, 4px);
+      --scb-calendar-card-day-size: var(--scale-07, 28px);
+      --scb-calendar-card-day-letter-spacing: -0.6px;
+      --scb-calendar-card-month-size: var(--scale-02, 14px);
+
+      --scb-calendar-card-content-gap: var(--spacing-spacing-4, 12px);
+      --scb-calendar-card-header-gap: var(--spacing-spacing-2, 4px);
+      --scb-calendar-card-title-min-block-size: 32px;
+      --scb-calendar-card-icon-size: 20px;
+
+      --scb-calendar-card-title-font-size: var(--md-sys-typescale-headline-small-size, 24px);
+      --scb-calendar-card-title-line-height: var(--md-sys-typescale-headline-small-line-height2, 30px);
+      --scb-calendar-card-title-letter-spacing: var(--md-sys-typescale-headline-small-tracking, -0.6px);
+
+      --scb-calendar-card-subtitle-font-size: var(--md-sys-typescale-title-medium-size, 18px);
+      --scb-calendar-card-subtitle-line-height: var(--md-sys-typescale-title-medium-line-height, 26px);
+      --scb-calendar-card-subtitle-letter-spacing: var(--md-sys-typescale-title-medium-tracking, -0.3px);
+
+      --scb-calendar-card-supporting-font-size: var(--md-sys-typescale-body-medium-size, 16px);
+      --scb-calendar-card-supporting-line-height: var(--md-sys-typescale-body-medium-line-height, 24px);
+      --scb-calendar-card-supporting-letter-spacing: var(--md-sys-typescale-body-medium-tracking, -0.15px);
+    }
+
+    :host([size='medium']) {
+      --scb-calendar-card-padding: var(--spacing-spacing-6, 20px);
+      --scb-calendar-card-gap: var(--spacing-spacing-3, 8px);
+      --scb-calendar-card-horizontal-gap: var(--spacing-spacing-5, 16px);
+      --scb-calendar-card-horizontal-min-block-size: 96px;
+
+      --scb-calendar-card-media-size: var(--spacing-spacing-10, 56px);
+      --scb-calendar-card-day-size: var(--scale-06, 24px);
+      --scb-calendar-card-day-letter-spacing: -0.4px;
+      --scb-calendar-card-month-size: var(--scale-01, 12px);
+
+      --scb-calendar-card-content-gap: var(--spacing-spacing-3, 8px);
+      --scb-calendar-card-header-gap: var(--spacing-spacing-1, 2px);
+      --scb-calendar-card-title-min-block-size: 28px;
+
+      --scb-calendar-card-title-font-size: var(--md-sys-typescale-title-medium-size, 18px);
+      --scb-calendar-card-title-line-height: var(--md-sys-typescale-title-medium-line-height, 26px);
+      --scb-calendar-card-title-letter-spacing: var(--md-sys-typescale-title-medium-tracking, -0.3px);
+
+      --scb-calendar-card-subtitle-font-size: var(--md-sys-typescale-title-small-size, 16px);
+      --scb-calendar-card-subtitle-line-height: var(--md-sys-typescale-title-small-line-height, 24px);
+      --scb-calendar-card-subtitle-letter-spacing: var(--md-sys-typescale-title-small-tracking, -0.2px);
+
+      --scb-calendar-card-supporting-font-size: var(--md-sys-typescale-body-small-size, 14px);
+      --scb-calendar-card-supporting-line-height: var(--md-sys-typescale-body-small-line-height, 20px);
+      --scb-calendar-card-supporting-letter-spacing: var(--md-sys-typescale-body-small-tracking, -0.1px);
+    }
+
+    :host([size='small']) {
+      --scb-calendar-card-padding: var(--spacing-spacing-5, 16px);
+      --scb-calendar-card-gap: var(--spacing-spacing-3, 8px);
+      --scb-calendar-card-horizontal-gap: var(--spacing-spacing-4, 12px);
+      --scb-calendar-card-horizontal-min-block-size: 84px;
+
+      --scb-calendar-card-media-size: var(--spacing-spacing-9, 48px);
+      --scb-calendar-card-day-size: var(--scale-05, 20px);
+      --scb-calendar-card-day-letter-spacing: -0.3px;
+      --scb-calendar-card-month-size: var(--scale-01, 12px);
+
+      --scb-calendar-card-content-gap: var(--spacing-spacing-2, 4px);
+      --scb-calendar-card-header-gap: var(--spacing-spacing-1, 2px);
+      --scb-calendar-card-title-min-block-size: 24px;
+      --scb-calendar-card-icon-size: 18px;
+
+      --scb-calendar-card-title-font-size: var(--md-sys-typescale-title-small-size, 16px);
+      --scb-calendar-card-title-line-height: var(--md-sys-typescale-title-small-line-height, 24px);
+      --scb-calendar-card-title-letter-spacing: var(--md-sys-typescale-title-small-tracking, -0.2px);
+
+      --scb-calendar-card-subtitle-font-size: var(--md-sys-typescale-body-medium-size, 16px);
+      --scb-calendar-card-subtitle-line-height: var(--md-sys-typescale-body-medium-line-height, 24px);
+      --scb-calendar-card-subtitle-letter-spacing: var(--md-sys-typescale-body-medium-tracking, -0.15px);
+
+      --scb-calendar-card-supporting-font-size: var(--md-sys-typescale-body-small-size, 14px);
+      --scb-calendar-card-supporting-line-height: var(--md-sys-typescale-body-small-line-height, 20px);
+      --scb-calendar-card-supporting-letter-spacing: var(--md-sys-typescale-body-small-tracking, -0.1px);
+    }
+
+    :host([sizing='stretch']) {
+      inline-size: 100%;
+      block-size: 100%;
+      max-inline-size: none;
+    }
+
+    :host([sizing='content-width']) {
+      display: inline-block;
+      inline-size: auto;
+      block-size: auto;
+    }
+    :host([sizing='content-width']) .calendar-card {
+      inline-size: max-content;
+    }
+
+    :host([sizing='content-height']) {
+      inline-size: 100%;
+      block-size: auto;
+      max-inline-size: none;
+    }
+
+    md-focus-ring {
+      position: absolute;
+      inset: 0;
+      pointer-events: none;
+      display: none;
+      border-radius: var(--scb-calendar-card-focus-ring-radius, var(--radius-large, 16px));
+    }
+    .calendar-card:focus-visible + md-focus-ring {
+      display: block;
+    }
+
+    .calendar-card {
+      box-sizing: border-box;
+      overflow: hidden;
+
+      position: relative;
+      display: flex;
+      color: var(--md-sys-color-on-surface, #0f0865);
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
+      font-style: normal;
+      flex-direction: column;
+      align-items: flex-start;
+      gap: var(--scb-calendar-card-gap);
+      align-self: stretch;
+      cursor: pointer;
+      transition:
+        box-shadow 0.18s ease,
+        transform 0.18s ease,
+        background-color 0.18s ease,
+        border-color 0.18s ease;
+
+      inline-size: 100%;
+      max-inline-size: 100%;
+    }
+
+    /* Lås standard till proportionella siffror i kortet */
+    .calendar-card,
+    .calendar-card .title,
+    .calendar-card .subtitle,
+    .calendar-card .supporting-text {
+      font-variant-numeric: proportional-nums;
+      font-feature-settings: 'tnum' 0, 'pnum' 1;
+    }
+
+    .calendar-card:focus,
+    .calendar-card:focus-visible {
+      outline: none;
+    }
+
+    .calendar-card.horizontal {
+      flex-direction: row;
+      align-items: flex-start;
+      max-width: none;
+      width: 100%;
+      gap: var(--scb-calendar-card-horizontal-gap);
+      min-block-size: var(--scb-calendar-card-horizontal-min-block-size);
+    }
+
+    .calendar-card.outlined {
+      border-radius: var(--radius-large, 16px);
+      border: 1px solid var(--md-sys-color-outline-variant, #ccc);
+      background: var(--md-sys-color-surface, #fff);
+      padding: var(--scb-calendar-card-padding);
+    }
+
+    .calendar-card.filled {
+      border-radius: var(--radius-large, 16px);
+      background: var(--md-sys-color-surface-dim, #f9f8ef);
+      padding: var(--scb-calendar-card-padding);
+    }
+
+    .calendar-card.filled .media {
+      background: var(--md-sys-color-surface, #fff);
+    }
+
+    md-ripple {
+      border-radius: var(--radius-l, 16px);
+    }
+
+    .media {
+      display: flex;
+      width: var(--scb-calendar-card-media-size);
+      min-width: var(--scb-calendar-card-media-size);
+      max-width: var(--scb-calendar-card-media-size);
+      height: var(--scb-calendar-card-media-size);
+      padding: var(--spacing-spacing-0, 0) 0;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      gap: var(--scb-calendar-card-media-gap);
+      border-radius: var(--md-sys-shape-corner-small);
+      background: var(--md-sys-color-surface-dim, #f9f8ef);
+    }
+
+    .calendar-card.horizontal .media {
+      align-self: flex-start;
+    }
+
+    .media .day {
+      font-size: var(--scb-calendar-card-day-size);
+      font-weight: var(--weight-bold, 700);
+      line-height: 100%;
+      letter-spacing: var(--scb-calendar-card-day-letter-spacing);
+      font-variant-numeric: tabular-nums;
+    }
+
+    .media .month {
+      font-size: var(--scb-calendar-card-month-size);
+      font-weight: var(--weight-regular, 400);
+      line-height: 100%;
+    }
+
+    .container {
+      flex: 1 1 auto;
+      min-width: 0;
+      display: flex;
+      flex-direction: column;
+      gap: var(--scb-calendar-card-content-gap);
+      width: 100%;
+      align-self: flex-start;
+    }
+
+    .header-container {
+      display: flex;
+      flex-direction: column;
+      gap: var(--scb-calendar-card-header-gap);
+    }
+
+    .title-container {
+      width: 100%;
+      flex: 0 0 auto;
+      display: flex;
+      align-items: center;
+      gap: var(--spacing-spacing-3, 8px);
+      color: inherit;
+      text-decoration: none;
+      min-block-size: var(--scb-calendar-card-title-min-block-size);
+    }
+
+    .title {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
+      font-size: var(--scb-calendar-card-title-font-size);
+      font-weight: var(--weight-bold, 700);
+      line-height: var(--scb-calendar-card-title-line-height);
+      letter-spacing: var(--scb-calendar-card-title-letter-spacing);
+      flex: 1 1 auto;
+      min-inline-size: 0;
+      white-space: normal;
+      word-break: normal;
+      overflow-wrap: break-word;
+      hyphens: auto;
+      overflow: visible;
+      text-overflow: clip;
+    }
+
+    .title-container md-icon {
+      inline-size: var(--scb-calendar-card-icon-size);
+      block-size: var(--scb-calendar-card-icon-size);
+      flex: 0 0 auto;
+    }
+
+    .icon-container{
+      display: flex;
+      width: var(--spacing-spacing-7, 24px);
+      height: var(--spacing-spacing-7, 24px);
+      align-items: center;
+      justify-content: center;
+    }
+
+    .subtitle {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
+      font-size: var(--scb-calendar-card-subtitle-font-size);
+      font-weight: var(--weight-semibold, 600);
+      line-height: var(--scb-calendar-card-subtitle-line-height);
+      letter-spacing: var(--scb-calendar-card-subtitle-letter-spacing);
+      white-space: normal;
+      word-break: normal;
+      overflow-wrap: break-word;
+      hyphens: manual;
+      overflow: visible;
+      text-overflow: clip;
+    }
+
+    .supporting-text {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
+      font-size: var(--scb-calendar-card-supporting-font-size);
+      font-weight: var(--weight-regular, 400);
+      line-height: var(--scb-calendar-card-supporting-line-height);
+      letter-spacing: var(--scb-calendar-card-supporting-letter-spacing);
+      white-space: normal;
+      word-break: normal;
+      overflow-wrap: break-word;
+      hyphens: manual;
+      overflow: visible;
+      text-overflow: clip;
+    }
+  `,o);function f(){return this.calendarCardTitle||this.title}function S(){const n={day:1,month:"Jan"};if(!this.date)return n;const e=this.date instanceof Date?this.date:(()=>{const s=new Date(String(this.date));return Number.isNaN(s.getTime())?null:s})();if(!e)return n;const r=e.getDate(),c=new Intl.DateTimeFormat("sv-SE",{month:"short"}).format(e).replace(".","").trim();return{day:r,month:c.charAt(0).toUpperCase()+c.slice(1)}}function u(){const n=this.mapSpacingToken(this.spacing),e=this.mapSpacingToken(this.spacingTop)??n,r=this.mapSpacingToken(this.spacingBottom)??n,c=this.mapSpacingToken(this.spacingLeft),s=this.mapSpacingToken(this.spacingRight);e?this.style.setProperty("--scb-calendar-card-spacing-block-start",e):this.style.removeProperty("--scb-calendar-card-spacing-block-start"),r?this.style.setProperty("--scb-calendar-card-spacing-block-end",r):this.style.removeProperty("--scb-calendar-card-spacing-block-end"),c?this.style.setProperty("--scb-calendar-card-spacing-inline-start",c):this.style.removeProperty("--scb-calendar-card-spacing-inline-start"),s?this.style.setProperty("--scb-calendar-card-spacing-inline-end",s):this.style.removeProperty("--scb-calendar-card-spacing-inline-end")}i([t({type:String,reflect:!0})],a.prototype,"variant",void 0);i([t({type:String,reflect:!0})],a.prototype,"size",void 0);i([t({type:String,attribute:"date"})],a.prototype,"date",void 0);i([t({type:String,reflect:!0})],a.prototype,"direction",void 0);i([t({type:String,reflect:!0})],a.prototype,"title",void 0);i([t({type:String,attribute:"calendar-card-title",reflect:!0})],a.prototype,"calendarCardTitle",void 0);i([t({type:String,reflect:!0})],a.prototype,"subtitle",void 0);i([t({type:String,attribute:"supporting-text",reflect:!0})],a.prototype,"supportingText",void 0);i([t({type:String,attribute:"card-href"})],a.prototype,"cardHref",void 0);i([t({type:String,attribute:"card-href-nav"})],a.prototype,"cardHrefNav",void 0);i([t({type:Boolean,reflect:!0,attribute:"show-media"})],a.prototype,"showMedia",void 0);i([t({type:String,attribute:"media-width"})],a.prototype,"mediaWidth",void 0);i([t({type:String,attribute:"media-height"})],a.prototype,"mediaHeight",void 0);i([t({type:String,attribute:"media-aspect"})],a.prototype,"mediaAspect",void 0);i([t({type:String,reflect:!0})],a.prototype,"width",void 0);i([t({type:String,reflect:!0,attribute:"max-width"})],a.prototype,"maxWidth",void 0);i([t({type:String,attribute:"min-width"})],a.prototype,"minWidth",void 0);i([t({type:String,reflect:!0})],a.prototype,"height",void 0);i([t({type:String,reflect:!0,attribute:"max-height"})],a.prototype,"maxHeight",void 0);i([t({type:String,attribute:"min-height"})],a.prototype,"minHeight",void 0);i([t({type:String,reflect:!0})],a.prototype,"sizing",void 0);i([t({type:String,reflect:!0})],a.prototype,"spacing",void 0);i([t({type:String,attribute:"spacing-top",reflect:!0})],a.prototype,"spacingTop",void 0);i([t({type:String,attribute:"spacing-bottom",reflect:!0})],a.prototype,"spacingBottom",void 0);i([t({type:String,attribute:"spacing-left",reflect:!0})],a.prototype,"spacingLeft",void 0);i([t({type:String,attribute:"spacing-right",reflect:!0})],a.prototype,"spacingRight",void 0);a=p=i([k("scb-calendar-card")],a);