scb-wc-test 0.1.247 → 0.1.248
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-button/scb-button.js";import"../../vendor/vendor-material.js";import"../scb-divider/scb-divider.js";import"../../vendor/preload-helper.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(
|
|
1
|
+
import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-button/scb-button.js";import"../../vendor/vendor-material.js";import"../scb-divider/scb-divider.js";import"../../vendor/preload-helper.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(o,a,n){try{customElements.get(o)||t(o,a,n)}catch(s){var r=String(s||"");if(r.indexOf("already been used")===-1&&r.indexOf("NotSupportedError")===-1)throw s}}}}catch{}})();var v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,h=(e,t,o,a)=>{for(var n=a>1?void 0:a?b(t,o):t,r=e.length-1,s;r>=0;r--)(s=e[r])&&(n=(a?s(t,o,n):s(n))||n);return a&&n&&v(t,o,n),n};let c=class extends w{constructor(){super(...arguments),this._currentDate=new Date,this._selectedDate=null,this._showMonthDropdown=!1,this._showYearDropdown=!1,this.variant="date",this.lang="sv",this.selectedValue="",this.open=!0,this._selectedHour=0,this._selectedMinute=0,this._monthNames=[this.lang=="sv"?"Januari":"January",this.lang=="sv"?"Februari":"February",this.lang=="sv"?"Mars":"March",(this.lang=="sv","April"),this.lang=="sv"?"Maj":"May",this.lang=="sv"?"Juni":"June",this.lang=="sv"?"Juli":"July",this.lang=="sv"?"Augusti":"August",(this.lang=="sv","September"),this.lang=="sv"?"Oktober":"October",(this.lang=="sv","November"),(this.lang=="sv","December")],this._outsideClickHandler=e=>{this.open&&(e.composedPath().includes(this)||this._close())},this._prevMonth=()=>{const e=this._currentDate.getFullYear(),t=this._currentDate.getMonth();t===0?this._currentDate=new Date(e-1,11,1):this._currentDate=new Date(e,t-1,1)},this._prevYear=()=>{const e=this._currentDate.getFullYear(),t=this._currentDate.getMonth();this._currentDate=new Date(e-1,t,1)},this._nextMonth=()=>{const e=this._currentDate.getFullYear(),t=this._currentDate.getMonth();t===11?this._currentDate=new Date(e+1,0,1):this._currentDate=new Date(e,t+1,1)},this._nextYear=()=>{const e=this._currentDate.getFullYear(),t=this._currentDate.getMonth();this._currentDate=new Date(e+1,t,1)},this._onTimeChange=e=>{const t=e.target.value,[o,a]=t.split(":"),n=parseInt(o,10),r=parseInt(a,10);this._selectedHour=isNaN(n)?0:Math.max(0,Math.min(23,n)),this._selectedMinute=isNaN(r)?0:Math.max(0,Math.min(59,r)),this._fireDateTimeChange()},this._close=()=>{this.open=!1,this.dispatchEvent(new CustomEvent("datepicker-closed",{bubbles:!0,composed:!0}))}}updated(e){if(super.updated(e),this.open?window.addEventListener("mousedown",this._outsideClickHandler):window.removeEventListener("mousedown",this._outsideClickHandler),e.has("selectedValue")&&this.selectedValue){const t=new Date(this.selectedValue);isNaN(t.getTime())||(this._selectedDate=t,this._currentDate=new Date(t.getFullYear(),t.getMonth(),1),this.variant==="datetime-local"&&(this._selectedHour=t.getHours(),this._selectedMinute=t.getMinutes()))}}render(){if(!this.open)return d``;const e=this._currentDate.getFullYear(),t=this._currentDate.getMonth(),o=new Date,a=this._getMonthDays(e,t),n=Array.from({length:101},(s,i)=>o.getFullYear()-50+i),r=this.variant==="datetime-local"&&!this._showMonthDropdown&&!this._showYearDropdown;return d`
|
|
2
2
|
<div class="datepicker-popup popup">
|
|
3
3
|
<div class="header">
|
|
4
4
|
<div class="month-selector ${this._showMonthDropdown?"open":""} ${this._showYearDropdown?"disable":""}">
|
|
@@ -8,7 +8,7 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
8
8
|
tabindex=${this._showYearDropdown?-1:0}
|
|
9
9
|
class="dropdown-selected"
|
|
10
10
|
@click=${()=>this._toggleMonthDropdown()}
|
|
11
|
-
@keydown=${
|
|
11
|
+
@keydown=${s=>{(s.key==="Enter"||s.key===" ")&&(s.preventDefault(),this._toggleMonthDropdown())}}
|
|
12
12
|
>
|
|
13
13
|
${this._monthNames[t].slice(0,3)}
|
|
14
14
|
<md-icon>arrow_drop_down</md-icon>
|
|
@@ -25,7 +25,7 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
25
25
|
tabindex=${this._showMonthDropdown?-1:0}
|
|
26
26
|
class="dropdown-selected"
|
|
27
27
|
@click=${()=>this._toggleYearDropdown()}
|
|
28
|
-
@keydown=${
|
|
28
|
+
@keydown=${s=>{(s.key==="Enter"||s.key===" ")&&(s.preventDefault(),this._toggleYearDropdown())}}
|
|
29
29
|
>
|
|
30
30
|
${e}
|
|
31
31
|
<md-icon>arrow_drop_down</md-icon>
|
|
@@ -40,7 +40,7 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
40
40
|
<div class="datepicker-content" style="position:relative;">
|
|
41
41
|
${this._showMonthDropdown?d`
|
|
42
42
|
<div class="dropdown-list">
|
|
43
|
-
${this._monthNames.map((
|
|
43
|
+
${this._monthNames.map((s,i)=>d`
|
|
44
44
|
<div
|
|
45
45
|
@keydown=${l=>{(l.key==="Enter"||l.key===" ")&&(l.preventDefault(),this._onMonthChangeCustom(i))}}
|
|
46
46
|
tabindex="0"
|
|
@@ -49,7 +49,7 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
49
49
|
id=${i===t?"selected-month":""}
|
|
50
50
|
>
|
|
51
51
|
${i===t?d`<md-icon>check</md-icon>`:""}
|
|
52
|
-
${
|
|
52
|
+
${s}
|
|
53
53
|
<md-ripple></md-ripple><md-focus-ring inward></md-focus-ring>
|
|
54
54
|
</div>
|
|
55
55
|
`)}
|
|
@@ -57,16 +57,16 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
57
57
|
`:""}
|
|
58
58
|
${this._showYearDropdown?d`
|
|
59
59
|
<div class="dropdown-list">
|
|
60
|
-
${n.map(
|
|
60
|
+
${n.map(s=>d`
|
|
61
61
|
<div
|
|
62
|
-
@keydown=${i=>{(i.key==="Enter"||i.key===" ")&&(i.preventDefault(),this._onYearChangeCustom(
|
|
62
|
+
@keydown=${i=>{(i.key==="Enter"||i.key===" ")&&(i.preventDefault(),this._onYearChangeCustom(s))}}
|
|
63
63
|
tabindex="0"
|
|
64
|
-
class="dropdown-item${
|
|
65
|
-
@click=${()=>this._onYearChangeCustom(
|
|
66
|
-
id=${
|
|
64
|
+
class="dropdown-item${s===e?" selected":""}"
|
|
65
|
+
@click=${()=>this._onYearChangeCustom(s)}
|
|
66
|
+
id=${s===e?"selected-year":""}
|
|
67
67
|
>
|
|
68
|
-
${
|
|
69
|
-
${
|
|
68
|
+
${s===e?d`<md-icon>check</md-icon>`:""}
|
|
69
|
+
${s}
|
|
70
70
|
<md-ripple></md-ripple><md-focus-ring inward></md-focus-ring>
|
|
71
71
|
</div>
|
|
72
72
|
`)}
|
|
@@ -81,15 +81,15 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
81
81
|
</tr>
|
|
82
82
|
</thead>
|
|
83
83
|
<tbody>
|
|
84
|
-
${a.map(
|
|
84
|
+
${a.map(s=>d`
|
|
85
85
|
<tr>
|
|
86
|
-
${
|
|
86
|
+
${s.map(i=>i?d`
|
|
87
87
|
<td>
|
|
88
88
|
<div
|
|
89
89
|
@keydown=${l=>{(l.key==="Enter"||l.key===" ")&&(l.preventDefault(),this._selectDate(i))}}
|
|
90
90
|
role="button"
|
|
91
91
|
tabindex="0"
|
|
92
|
-
class="day${this._isToday(i,
|
|
92
|
+
class="day${this._isToday(i,o)?" today":""}${this._isSelected(i)?" selected":""}"
|
|
93
93
|
@click=${()=>this._selectDate(i)}
|
|
94
94
|
>${i.getDate()}<md-ripple></md-ripple><md-focus-ring></md-focus-ring></div>
|
|
95
95
|
</td>
|
|
@@ -115,13 +115,20 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
115
115
|
`:""}
|
|
116
116
|
</div>
|
|
117
117
|
</div>
|
|
118
|
-
`}_getMonthDays(e,t){const
|
|
118
|
+
`}_getMonthDays(e,t){const o=new Date(Date.UTC(e,t,1)),a=new Date(Date.UTC(e,t+1,0)),n=[];let r=[],s=o.getUTCDay(),i=s===0?6:s-1;for(let l=0;l<i;l++)r.push(null);for(let l=1;l<=a.getUTCDate();l++){const g=new Date(Date.UTC(e,t,l));r.push(g),r.length===7&&(n.push(r),r=[])}if(r.length){for(;r.length<7;)r.push(null);n.push(r)}return n}_toggleMonthDropdown(){this._showMonthDropdown=!this._showMonthDropdown,this._showMonthDropdown&&(this._showYearDropdown=!1,setTimeout(()=>{const e=this.renderRoot.querySelector("#selected-month");e&&e.scrollIntoView({block:"center"})},0))}_toggleYearDropdown(){this._showYearDropdown=!this._showYearDropdown,this._showYearDropdown&&(this._showMonthDropdown=!1,setTimeout(()=>{const e=this.renderRoot.querySelector("#selected-year");e&&e.scrollIntoView({block:"center"})},0))}_onMonthChangeCustom(e){const t=this._currentDate.getFullYear();this._currentDate=new Date(t,e,1),this._showMonthDropdown=!1}_onYearChangeCustom(e){const t=this._currentDate.getMonth();this._currentDate=new Date(e,t,1),this._showYearDropdown=!1}_isToday(e,t){return e.getDate()===t.getDate()&&e.getMonth()===t.getMonth()&&e.getFullYear()===t.getFullYear()}_isSelected(e){return this._selectedDate&&e.getDate()===this._selectedDate.getDate()&&e.getMonth()===this._selectedDate.getMonth()&&e.getFullYear()===this._selectedDate.getFullYear()}_selectDate(e){if(this._selectedDate=e,this.variant==="datetime-local"){const t=new Date(e);t.setHours(this._selectedHour??0,this._selectedMinute??0,0,0),this._selectedHour=t.getHours(),this._selectedMinute=t.getMinutes();const o=n=>n.toString().padStart(2,"0"),a=`${t.getFullYear()}-${o(t.getMonth()+1)}-${o(t.getDate())} ${o(t.getHours())}:${o(t.getMinutes())}`;this.dispatchEvent(new CustomEvent("date-selected",{detail:{value:a},bubbles:!0,composed:!0}))}else{const t=e.toISOString().slice(0,10);this.dispatchEvent(new CustomEvent("date-selected",{detail:{value:t},bubbles:!0,composed:!0}))}}_fireDateTimeChange(){if(this.variant==="datetime-local"&&this._selectedDate){const e=new Date(this._selectedDate);e.setHours(this._selectedHour??0,this._selectedMinute??0,0,0);const t=a=>a.toString().padStart(2,"0"),o=`${e.getFullYear()}-${t(e.getMonth()+1)}-${t(e.getDate())} ${t(e.getHours())}:${t(e.getMinutes())}`;this.dispatchEvent(new CustomEvent("date-selected",{detail:{value:o},bubbles:!0,composed:!0}))}}};c.styles=[m`
|
|
119
119
|
:host {
|
|
120
120
|
--scb-datepicker-width: 380px;
|
|
121
|
+
--scb-datepicker-z-index: 1100;
|
|
122
|
+
--scb-datepicker-offset: var(--spacing-2, 4px);
|
|
121
123
|
max-width: var(--scb-datepicker-width);
|
|
122
124
|
font-family: var(--brand-font);
|
|
123
125
|
color: var(--md-sys-color-on-surface);
|
|
124
|
-
|
|
126
|
+
display: block;
|
|
127
|
+
position: absolute;
|
|
128
|
+
top: calc(100% + var(--scb-datepicker-offset));
|
|
129
|
+
left: 0;
|
|
130
|
+
width: 100%;
|
|
131
|
+
z-index: var(--scb-datepicker-z-index);
|
|
125
132
|
}
|
|
126
133
|
.month-selector, .year-selector {
|
|
127
134
|
display: flex;
|
|
@@ -213,9 +220,9 @@ import{a as m,r as p,n as u,i as w,x as d,t as _}from"../../vendor/vendor.js";im
|
|
|
213
220
|
}
|
|
214
221
|
.popup {
|
|
215
222
|
position:absolute;
|
|
216
|
-
top:
|
|
223
|
+
top:0;
|
|
217
224
|
left:0;
|
|
218
|
-
z-index:
|
|
225
|
+
z-index:1;
|
|
219
226
|
}
|
|
220
227
|
.header {
|
|
221
228
|
display: flex;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as u,n as
|
|
1
|
+
import{a as u,n as s,i as h,E as p,x as r,t as m}from"../../vendor/vendor.js";import"../scb-button/scb-button.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-textfield/scb-textfield.js";import"../scb-checkbox/scb-checkbox.js";import"../scb-radio-button/scb-radio-button.js";import"../scb-switch/scb-switch.js";import"../scb-chip/scb-chip.js";import"../../vendor/vendor-material.js";import"../../vendor/preload-helper.js";import"../scb-datepicker/scb-datepicker.js";import"../scb-divider/scb-divider.js";import"../scb-checkbox/scb-checkbox-group.js";import"../scb-radio-button/scb-radio-group.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,a,c){try{customElements.get(e)||i(e,a,c)}catch(d){var l=String(d||"");if(l.indexOf("already been used")===-1&&l.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var g=Object.defineProperty,f=Object.getOwnPropertyDescriptor,o=(t,i,e,a)=>{for(var c=a>1?void 0:a?f(i,e):i,l=t.length-1,d;l>=0;l--)(d=t[l])&&(c=(a?d(i,e,c):d(c))||c);return a&&c&&g(i,e,c),c};let n=class extends h{constructor(){super(...arguments),this.open=!1,this.inSb=!1,this.scrimClose=!0,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this.variant="basic",this.label="",this.icon="",this.supportingText="",this.okButton="OK",this.cancelButton="Avbryt",this.deleteButton="Delete",this.confirmButton="Ta bort",this.denyButton="Avbryt",this.resetButton="Återställ",this.submitButton="Spara",this.formId="",this.formAction="",this.formMethod="",this.__lastTriggerEl=null,this.__onDocumentClick=t=>{this.__getActionFromEvent(t)==="toggle"&&(this.__setOpen(!this.open),t.stopPropagation())},this.__onDocumentKeydown=t=>{this.open&&t.key==="Escape"&&(this.__fire("esc"),this.__setOpen(!1))},this.__onScrimClick=()=>{this.scrimClose&&(this.__fire("scrim"),this.__setOpen(!1))},this.__onOk=()=>{this.__fire("ok"),this.__setOpen(!1)},this.__onCancel=()=>{this.__fire("cancel"),this.__setOpen(!1)},this.__onConfirm=()=>{this.__fire("confirm"),this.__setOpen(!1)},this.__onDeny=()=>{this.__fire("deny"),this.__setOpen(!1)},this.__onReset=()=>{const t=this.shadowRoot?.querySelector("form");t instanceof HTMLFormElement&&(this.__clearGeneratedFormValues(t),t.reset()),(this.shadowRoot?.querySelector("slot")?.assignedElements({flatten:!0})??[]).forEach(e=>{const a=e.tagName;a==="SCB-TEXTFIELD"&&(e.value=""),a==="SCB-CHECKBOX"&&(e.checked=!1),a==="SCB-RADIO-BUTTON"&&(e.checked=!1),a==="SCB-SWITCH"&&(e.selected=!1),a==="SCB-CHIP"&&(e.selected=!1)}),this.__fire("reset")},this.__onSubmit=()=>{const t=this.shadowRoot?.querySelector("form");t instanceof HTMLFormElement&&(this.__syncSlottedFormValues(t),t.requestSubmit()),this.__fire("submit"),this.__setOpen(!1)},this.__onKeydownTrap=t=>{if(!this.open||t.key!=="Tab")return;const i=Array.from(this.shadowRoot.querySelectorAll('button,[href],input,select,textarea,[tabindex]:not([tabindex="-1"])')).filter(c=>!c.hasAttribute("disabled"));if(!i.length)return;const e=i[0],a=i[i.length-1];t.shiftKey&&document.activeElement===e?(a.focus(),t.preventDefault()):!t.shiftKey&&document.activeElement===a&&(e.focus(),t.preventDefault())}}__getActionFromEvent(t){if(!this.id)return null;for(const i of t.composedPath())if(i instanceof Element){if(i.getAttribute("data-dialog-toggle")===this.id)return this.__lastTriggerEl=i,"toggle";if(i.getAttribute("aria-controls")===this.id)return this.__lastTriggerEl=i,"toggle"}return null}connectedCallback(){super.connectedCallback(),this.__applyZIndex(),this.__applyMaxSize(),document.addEventListener("click",this.__onDocumentClick,!1),document.addEventListener("keydown",this.__onDocumentKeydown,!0),this.addEventListener("keydown",this.__onKeydownTrap)}disconnectedCallback(){document.removeEventListener("click",this.__onDocumentClick,!1),document.removeEventListener("keydown",this.__onDocumentKeydown,!0),this.removeEventListener("keydown",this.__onKeydownTrap),super.disconnectedCallback()}__applyZIndex(){const t=typeof this.zIndex=="number"&&Number.isFinite(this.zIndex)?this.zIndex:void 0;if(t===void 0){this.style.removeProperty("--z-dialog-scrim"),this.style.removeProperty("--z-dialog");return}this.style.setProperty("--z-dialog-scrim",String(t)),this.style.setProperty("--z-dialog",String(t+1))}__applyMaxSize(){const t=(this.maxW??"").trim(),i=(this.maxH??"").trim();t?(this.style.setProperty("--scb-dialog-max-w",t),this.style.setProperty("--scb-dialog-width",`min(${t}, 90vw)`)):(this.style.removeProperty("--scb-dialog-max-w"),this.style.removeProperty("--scb-dialog-width")),i?this.style.setProperty("--scb-dialog-max-h",i):this.style.removeProperty("--scb-dialog-max-h")}updated(t){if(t.has("zIndex")&&this.__applyZIndex(),(t.has("maxW")||t.has("maxH"))&&this.__applyMaxSize(),t.has("open")){const i=t.get("open");this.__updateTriggersExpanded(),this.open&&!i?this.updateComplete.then(()=>{const e=this.shadowRoot?.querySelector('button,[href],input,select,textarea,[tabindex]:not([tabindex="-1"])');e?e.focus():this.shadowRoot?.querySelector(".container")?.focus()}):!this.open&&i&&this.__lastTriggerEl?.focus?.(),this.__toggleScrollLock(this.open)}(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.__applySpacing()}__updateTriggersExpanded(){this.id&&document.querySelectorAll(`[aria-controls="${this.id}"], [data-dialog-toggle="${this.id}"]`).forEach(t=>{t.hasAttribute("aria-controls")&&t.setAttribute("aria-expanded",String(this.open))})}__toggleScrollLock(t){if(this.inSb)return;const i=document.documentElement;i.style.overflow=t?"hidden":""}mapSpacingToken(t){if(!t)return;const i=String(t).trim();if(i)return/^\d+$/.test(i)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(i,10)))})`:i}__applySpacing(){const t=this.mapSpacingToken(this.spacing),i=this.mapSpacingToken(this.spacingTop)??t,e=this.mapSpacingToken(this.spacingBottom)??t,a=this.mapSpacingToken(this.spacingLeft),c=this.mapSpacingToken(this.spacingRight);i?this.style.setProperty("--scb-dialog-spacing-block-start",i):this.style.removeProperty("--scb-dialog-spacing-block-start"),e?this.style.setProperty("--scb-dialog-spacing-block-end",e):this.style.removeProperty("--scb-dialog-spacing-block-end"),a?this.style.setProperty("--scb-dialog-spacing-inline-start",a):this.style.removeProperty("--scb-dialog-spacing-inline-start"),c?this.style.setProperty("--scb-dialog-spacing-inline-end",c):this.style.removeProperty("--scb-dialog-spacing-inline-end")}__setOpen(t){this.open=t,this.__fire(t?"open":"close")}__fire(t,i){this.dispatchEvent(new CustomEvent(t,{detail:i,bubbles:!0,composed:!0}))}__getSlottedElements(){const t=this.shadowRoot?.querySelector("slot");if(!(t instanceof HTMLSlotElement))return[];const i=t.assignedElements({flatten:!0}),e=[];for(const a of i)e.push(a,...Array.from(a.querySelectorAll("*")));return e}__appendHiddenFormValue(t,i,e){const a=document.createElement("input");a.type="hidden",a.name=i,a.value=e,a.setAttribute("data-scb-dialog-generated","true"),t.append(a)}__clearGeneratedFormValues(t){t.querySelectorAll('input[data-scb-dialog-generated="true"]').forEach(i=>i.remove())}__syncSlottedFormValues(t){this.__clearGeneratedFormValues(t),this.__getSlottedElements().forEach(e=>{if(!(e instanceof HTMLElement))return;const a=(e.getAttribute("name")??"").trim();if(!(!a||e.disabled===!0||e.hasAttribute("disabled"))){if(e instanceof HTMLInputElement){if(e.form===t)return;const l=(e.type||"").toLowerCase();if(l==="checkbox"||l==="radio"){e.checked&&this.__appendHiddenFormValue(t,a,e.value||"on");return}this.__appendHiddenFormValue(t,a,e.value??"");return}if(e instanceof HTMLTextAreaElement){if(e.form===t)return;this.__appendHiddenFormValue(t,a,e.value??"");return}if(e instanceof HTMLSelectElement){if(e.form===t)return;if(e.multiple){Array.from(e.selectedOptions).forEach(l=>{this.__appendHiddenFormValue(t,a,l.value)});return}this.__appendHiddenFormValue(t,a,e.value??"");return}switch(e.tagName){case"SCB-TEXTFIELD":this.__appendHiddenFormValue(t,a,String(e.value??""));return;case"SCB-CHECKBOX":e.checked&&this.__appendHiddenFormValue(t,a,String(e.value??e.getAttribute("value")??"on"));return;case"SCB-RADIO-BUTTON":e.checked&&this.__appendHiddenFormValue(t,a,String(e.value??e.getAttribute("value")??"on"));return;case"SCB-SWITCH":(e.selected||e.checked)&&this.__appendHiddenFormValue(t,a,String(e.value??e.getAttribute("value")??"on"));return;case"SCB-CHIP":e.selected&&this.__appendHiddenFormValue(t,a,String(e.value??e.getAttribute("value")??"on"));return;default:"value"in e&&this.__appendHiddenFormValue(t,a,String(e.value??""))}}})}__slotIsEmpty(){const t=this.shadowRoot?.querySelector("slot");return t?t.assignedElements({flatten:!0}).length===0:!0}renderHeader(t){const i=this.variant==="form"||this.variant==="floating"||this.variant==="iframe";return r`
|
|
2
2
|
<div class="header">
|
|
3
3
|
<div class="title">
|
|
4
4
|
${this.icon?r`<md-icon class="dialog-icon">${this.icon}</md-icon>`:p}
|
|
@@ -240,6 +240,10 @@ import{a as u,n as o,i as h,E as p,x as r,t as m}from"../../vendor/vendor.js";im
|
|
|
240
240
|
gap: var(--scb-form-gap, var(--spacing-6, 20px)); /* <— token + fallback */
|
|
241
241
|
}
|
|
242
242
|
|
|
243
|
+
:host([variant="form"]) .content {
|
|
244
|
+
overflow: visible;
|
|
245
|
+
}
|
|
246
|
+
|
|
243
247
|
:host([variant="floating"]) .container { --scb-dialog-min-w: var(--scb-dialog-min-w-floating, 360px); }
|
|
244
248
|
|
|
245
249
|
/* Choose: gör slottade radios vertikala med spacing */
|
|
@@ -258,4 +262,4 @@ import{a as u,n as o,i as h,E as p,x as r,t as m}from"../../vendor/vendor.js";im
|
|
|
258
262
|
to { opacity: 0; }
|
|
259
263
|
}
|
|
260
264
|
|
|
261
|
-
`;
|
|
265
|
+
`;o([s({type:Boolean,reflect:!0})],n.prototype,"open",2);o([s({type:String,attribute:"max-w",reflect:!0})],n.prototype,"maxW",2);o([s({type:String,attribute:"max-h",reflect:!0})],n.prototype,"maxH",2);o([s({type:Number,attribute:"z-index",reflect:!0})],n.prototype,"zIndex",2);o([s({type:Boolean,attribute:!1})],n.prototype,"inSb",2);o([s({type:Boolean,attribute:"scrim-close"})],n.prototype,"scrimClose",2);o([s({type:String,reflect:!0})],n.prototype,"spacing",2);o([s({type:String,attribute:"spacing-top",reflect:!0})],n.prototype,"spacingTop",2);o([s({type:String,attribute:"spacing-bottom",reflect:!0})],n.prototype,"spacingBottom",2);o([s({type:String,attribute:"spacing-left",reflect:!0})],n.prototype,"spacingLeft",2);o([s({type:String,attribute:"spacing-right",reflect:!0})],n.prototype,"spacingRight",2);o([s({type:String})],n.prototype,"variant",2);o([s({type:String})],n.prototype,"label",2);o([s({type:String})],n.prototype,"icon",2);o([s({type:String,attribute:"supporting-text"})],n.prototype,"supportingText",2);o([s({type:String,attribute:"ok-button"})],n.prototype,"okButton",2);o([s({type:String,attribute:"cancel-button"})],n.prototype,"cancelButton",2);o([s({type:String,attribute:"delete-button"})],n.prototype,"deleteButton",2);o([s({type:String,attribute:"confirm-button"})],n.prototype,"confirmButton",2);o([s({type:String,attribute:"deny-button"})],n.prototype,"denyButton",2);o([s({type:String,attribute:"reset-button"})],n.prototype,"resetButton",2);o([s({type:String,attribute:"submit-button"})],n.prototype,"submitButton",2);o([s({type:String,attribute:"form-id"})],n.prototype,"formId",2);o([s({type:String,attribute:"form-action"})],n.prototype,"formAction",2);o([s({type:String,attribute:"form-method"})],n.prototype,"formMethod",2);n=o([m("scb-dialog")],n);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc-test",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.248",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -382,5 +382,5 @@
|
|
|
382
382
|
},
|
|
383
383
|
"./mvc/*": "./mvc/*"
|
|
384
384
|
},
|
|
385
|
-
"buildHash": "
|
|
385
|
+
"buildHash": "578133B3F8D383E9136778DCC4498B707DC3A1A2A46834B8544BF92C3BFC2723"
|
|
386
386
|
}
|
|
@@ -264,10 +264,17 @@ c.styles = [
|
|
|
264
264
|
m`
|
|
265
265
|
:host {
|
|
266
266
|
--scb-datepicker-width: 380px;
|
|
267
|
+
--scb-datepicker-z-index: 1100;
|
|
268
|
+
--scb-datepicker-offset: var(--spacing-2, 4px);
|
|
267
269
|
max-width: var(--scb-datepicker-width);
|
|
268
270
|
font-family: var(--brand-font);
|
|
269
271
|
color: var(--md-sys-color-on-surface);
|
|
270
|
-
|
|
272
|
+
display: block;
|
|
273
|
+
position: absolute;
|
|
274
|
+
top: calc(100% + var(--scb-datepicker-offset));
|
|
275
|
+
left: 0;
|
|
276
|
+
width: 100%;
|
|
277
|
+
z-index: var(--scb-datepicker-z-index);
|
|
271
278
|
}
|
|
272
279
|
.month-selector, .year-selector {
|
|
273
280
|
display: flex;
|
|
@@ -359,9 +366,9 @@ c.styles = [
|
|
|
359
366
|
}
|
|
360
367
|
.popup {
|
|
361
368
|
position:absolute;
|
|
362
|
-
top:
|
|
369
|
+
top:0;
|
|
363
370
|
left:0;
|
|
364
|
-
z-index:
|
|
371
|
+
z-index:1;
|
|
365
372
|
}
|
|
366
373
|
.header {
|
|
367
374
|
display: flex;
|
package/scb-dialog/scb-dialog.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { css as
|
|
2
|
-
import { property as
|
|
1
|
+
import { css as u, LitElement as m, nothing as p, html as l } from "lit";
|
|
2
|
+
import { property as s, customElement as g } from "lit/decorators.js";
|
|
3
3
|
import "../scb-button/scb-button.js";
|
|
4
4
|
import "../scb-icon-button/scb-icon-button.js";
|
|
5
5
|
import "../scb-textfield/scb-textfield.js";
|
|
@@ -8,7 +8,7 @@ import "../scb-radio-button/scb-radio-button.js";
|
|
|
8
8
|
import "../scb-switch/scb-switch.js";
|
|
9
9
|
import "../scb-chip/scb-chip.js";
|
|
10
10
|
import "@material/web/icon/icon.js";
|
|
11
|
-
var f = Object.defineProperty, b = Object.getOwnPropertyDescriptor,
|
|
11
|
+
var f = Object.defineProperty, b = Object.getOwnPropertyDescriptor, o = (t, e, i, a) => {
|
|
12
12
|
for (var r = a > 1 ? void 0 : a ? b(e, i) : e, c = t.length - 1, d; c >= 0; c--)
|
|
13
13
|
(d = t[c]) && (r = (a ? d(e, i, r) : d(r)) || r);
|
|
14
14
|
return a && r && f(e, i, r), r;
|
|
@@ -98,11 +98,11 @@ let n = class extends m {
|
|
|
98
98
|
if (t.has("zIndex") && this.__applyZIndex(), (t.has("maxW") || t.has("maxH")) && this.__applyMaxSize(), t.has("open")) {
|
|
99
99
|
const a = t.get("open");
|
|
100
100
|
this.__updateTriggersExpanded(), this.open && !a ? this.updateComplete.then(() => {
|
|
101
|
-
var c, d,
|
|
101
|
+
var c, d, h;
|
|
102
102
|
const r = (c = this.shadowRoot) == null ? void 0 : c.querySelector(
|
|
103
103
|
'button,[href],input,select,textarea,[tabindex]:not([tabindex="-1"])'
|
|
104
104
|
);
|
|
105
|
-
r ? r.focus() : (
|
|
105
|
+
r ? r.focus() : (h = (d = this.shadowRoot) == null ? void 0 : d.querySelector(".container")) == null || h.focus();
|
|
106
106
|
}) : !this.open && a && ((i = (e = this.__lastTriggerEl) == null ? void 0 : e.focus) == null || i.call(e)), this.__toggleScrollLock(this.open);
|
|
107
107
|
}
|
|
108
108
|
(t.has("spacing") || t.has("spacingTop") || t.has("spacingBottom") || t.has("spacingLeft") || t.has("spacingRight")) && this.__applySpacing();
|
|
@@ -308,7 +308,7 @@ let n = class extends m {
|
|
|
308
308
|
`;
|
|
309
309
|
}
|
|
310
310
|
};
|
|
311
|
-
n.styles =
|
|
311
|
+
n.styles = u`
|
|
312
312
|
:host {
|
|
313
313
|
display:block;
|
|
314
314
|
position:relative;
|
|
@@ -497,6 +497,10 @@ n.styles = h`
|
|
|
497
497
|
gap: var(--scb-form-gap, var(--spacing-6, 20px)); /* <— token + fallback */
|
|
498
498
|
}
|
|
499
499
|
|
|
500
|
+
:host([variant="form"]) .content {
|
|
501
|
+
overflow: visible;
|
|
502
|
+
}
|
|
503
|
+
|
|
500
504
|
:host([variant="floating"]) .container { --scb-dialog-min-w: var(--scb-dialog-min-w-floating, 360px); }
|
|
501
505
|
|
|
502
506
|
/* Choose: gör slottade radios vertikala med spacing */
|
|
@@ -516,82 +520,82 @@ n.styles = h`
|
|
|
516
520
|
}
|
|
517
521
|
|
|
518
522
|
`;
|
|
519
|
-
|
|
520
|
-
|
|
523
|
+
o([
|
|
524
|
+
s({ type: Boolean, reflect: !0 })
|
|
521
525
|
], n.prototype, "open", 2);
|
|
522
|
-
|
|
523
|
-
|
|
526
|
+
o([
|
|
527
|
+
s({ type: String, attribute: "max-w", reflect: !0 })
|
|
524
528
|
], n.prototype, "maxW", 2);
|
|
525
|
-
|
|
526
|
-
|
|
529
|
+
o([
|
|
530
|
+
s({ type: String, attribute: "max-h", reflect: !0 })
|
|
527
531
|
], n.prototype, "maxH", 2);
|
|
528
|
-
|
|
529
|
-
|
|
532
|
+
o([
|
|
533
|
+
s({ type: Number, attribute: "z-index", reflect: !0 })
|
|
530
534
|
], n.prototype, "zIndex", 2);
|
|
531
|
-
|
|
532
|
-
|
|
535
|
+
o([
|
|
536
|
+
s({ type: Boolean, attribute: !1 })
|
|
533
537
|
], n.prototype, "inSb", 2);
|
|
534
|
-
|
|
535
|
-
|
|
538
|
+
o([
|
|
539
|
+
s({ type: Boolean, attribute: "scrim-close" })
|
|
536
540
|
], n.prototype, "scrimClose", 2);
|
|
537
|
-
|
|
538
|
-
|
|
541
|
+
o([
|
|
542
|
+
s({ type: String, reflect: !0 })
|
|
539
543
|
], n.prototype, "spacing", 2);
|
|
540
|
-
|
|
541
|
-
|
|
544
|
+
o([
|
|
545
|
+
s({ type: String, attribute: "spacing-top", reflect: !0 })
|
|
542
546
|
], n.prototype, "spacingTop", 2);
|
|
543
|
-
|
|
544
|
-
|
|
547
|
+
o([
|
|
548
|
+
s({ type: String, attribute: "spacing-bottom", reflect: !0 })
|
|
545
549
|
], n.prototype, "spacingBottom", 2);
|
|
546
|
-
|
|
547
|
-
|
|
550
|
+
o([
|
|
551
|
+
s({ type: String, attribute: "spacing-left", reflect: !0 })
|
|
548
552
|
], n.prototype, "spacingLeft", 2);
|
|
549
|
-
|
|
550
|
-
|
|
553
|
+
o([
|
|
554
|
+
s({ type: String, attribute: "spacing-right", reflect: !0 })
|
|
551
555
|
], n.prototype, "spacingRight", 2);
|
|
552
|
-
|
|
553
|
-
|
|
556
|
+
o([
|
|
557
|
+
s({ type: String })
|
|
554
558
|
], n.prototype, "variant", 2);
|
|
555
|
-
|
|
556
|
-
|
|
559
|
+
o([
|
|
560
|
+
s({ type: String })
|
|
557
561
|
], n.prototype, "label", 2);
|
|
558
|
-
|
|
559
|
-
|
|
562
|
+
o([
|
|
563
|
+
s({ type: String })
|
|
560
564
|
], n.prototype, "icon", 2);
|
|
561
|
-
|
|
562
|
-
|
|
565
|
+
o([
|
|
566
|
+
s({ type: String, attribute: "supporting-text" })
|
|
563
567
|
], n.prototype, "supportingText", 2);
|
|
564
|
-
|
|
565
|
-
|
|
568
|
+
o([
|
|
569
|
+
s({ type: String, attribute: "ok-button" })
|
|
566
570
|
], n.prototype, "okButton", 2);
|
|
567
|
-
|
|
568
|
-
|
|
571
|
+
o([
|
|
572
|
+
s({ type: String, attribute: "cancel-button" })
|
|
569
573
|
], n.prototype, "cancelButton", 2);
|
|
570
|
-
|
|
571
|
-
|
|
574
|
+
o([
|
|
575
|
+
s({ type: String, attribute: "delete-button" })
|
|
572
576
|
], n.prototype, "deleteButton", 2);
|
|
573
|
-
|
|
574
|
-
|
|
577
|
+
o([
|
|
578
|
+
s({ type: String, attribute: "confirm-button" })
|
|
575
579
|
], n.prototype, "confirmButton", 2);
|
|
576
|
-
|
|
577
|
-
|
|
580
|
+
o([
|
|
581
|
+
s({ type: String, attribute: "deny-button" })
|
|
578
582
|
], n.prototype, "denyButton", 2);
|
|
579
|
-
|
|
580
|
-
|
|
583
|
+
o([
|
|
584
|
+
s({ type: String, attribute: "reset-button" })
|
|
581
585
|
], n.prototype, "resetButton", 2);
|
|
582
|
-
|
|
583
|
-
|
|
586
|
+
o([
|
|
587
|
+
s({ type: String, attribute: "submit-button" })
|
|
584
588
|
], n.prototype, "submitButton", 2);
|
|
585
|
-
|
|
586
|
-
|
|
589
|
+
o([
|
|
590
|
+
s({ type: String, attribute: "form-id" })
|
|
587
591
|
], n.prototype, "formId", 2);
|
|
588
|
-
|
|
589
|
-
|
|
592
|
+
o([
|
|
593
|
+
s({ type: String, attribute: "form-action" })
|
|
590
594
|
], n.prototype, "formAction", 2);
|
|
591
|
-
|
|
592
|
-
|
|
595
|
+
o([
|
|
596
|
+
s({ type: String, attribute: "form-method" })
|
|
593
597
|
], n.prototype, "formMethod", 2);
|
|
594
|
-
n =
|
|
598
|
+
n = o([
|
|
595
599
|
g("scb-dialog")
|
|
596
600
|
], n);
|
|
597
601
|
export {
|
package/scb-wc-test.bundle.js
CHANGED
|
@@ -3574,10 +3574,17 @@
|
|
|
3574
3574
|
`}_getMonthDays(t,e){const i=new Date(Date.UTC(t,e,1)),r=new Date(Date.UTC(t,e+1,0)),s=[];let a=[],n=i.getUTCDay(),l=n===0?6:n-1;for(let d=0;d<l;d++)a.push(null);for(let d=1;d<=r.getUTCDate();d++){const h=new Date(Date.UTC(t,e,d));a.push(h),a.length===7&&(s.push(a),a=[])}if(a.length){for(;a.length<7;)a.push(null);s.push(a)}return s}_toggleMonthDropdown(){this._showMonthDropdown=!this._showMonthDropdown,this._showMonthDropdown&&(this._showYearDropdown=!1,setTimeout(()=>{const t=this.renderRoot.querySelector("#selected-month");t&&t.scrollIntoView({block:"center"})},0))}_toggleYearDropdown(){this._showYearDropdown=!this._showYearDropdown,this._showYearDropdown&&(this._showMonthDropdown=!1,setTimeout(()=>{const t=this.renderRoot.querySelector("#selected-year");t&&t.scrollIntoView({block:"center"})},0))}_onMonthChangeCustom(t){const e=this._currentDate.getFullYear();this._currentDate=new Date(e,t,1),this._showMonthDropdown=!1}_onYearChangeCustom(t){const e=this._currentDate.getMonth();this._currentDate=new Date(t,e,1),this._showYearDropdown=!1}_isToday(t,e){return t.getDate()===e.getDate()&&t.getMonth()===e.getMonth()&&t.getFullYear()===e.getFullYear()}_isSelected(t){return this._selectedDate&&t.getDate()===this._selectedDate.getDate()&&t.getMonth()===this._selectedDate.getMonth()&&t.getFullYear()===this._selectedDate.getFullYear()}_selectDate(t){if(this._selectedDate=t,this.variant==="datetime-local"){const e=new Date(t);e.setHours(this._selectedHour??0,this._selectedMinute??0,0,0),this._selectedHour=e.getHours(),this._selectedMinute=e.getMinutes();const i=s=>s.toString().padStart(2,"0"),r=`${e.getFullYear()}-${i(e.getMonth()+1)}-${i(e.getDate())} ${i(e.getHours())}:${i(e.getMinutes())}`;this.dispatchEvent(new CustomEvent("date-selected",{detail:{value:r},bubbles:!0,composed:!0}))}else{const e=t.toISOString().slice(0,10);this.dispatchEvent(new CustomEvent("date-selected",{detail:{value:e},bubbles:!0,composed:!0}))}}_fireDateTimeChange(){if(this.variant==="datetime-local"&&this._selectedDate){const t=new Date(this._selectedDate);t.setHours(this._selectedHour??0,this._selectedMinute??0,0,0);const e=r=>r.toString().padStart(2,"0"),i=`${t.getFullYear()}-${e(t.getMonth()+1)}-${e(t.getDate())} ${e(t.getHours())}:${e(t.getMinutes())}`;this.dispatchEvent(new CustomEvent("date-selected",{detail:{value:i},bubbles:!0,composed:!0}))}}};gt.styles=[f`
|
|
3575
3575
|
:host {
|
|
3576
3576
|
--scb-datepicker-width: 380px;
|
|
3577
|
+
--scb-datepicker-z-index: 1100;
|
|
3578
|
+
--scb-datepicker-offset: var(--spacing-2, 4px);
|
|
3577
3579
|
max-width: var(--scb-datepicker-width);
|
|
3578
3580
|
font-family: var(--brand-font);
|
|
3579
3581
|
color: var(--md-sys-color-on-surface);
|
|
3580
|
-
|
|
3582
|
+
display: block;
|
|
3583
|
+
position: absolute;
|
|
3584
|
+
top: calc(100% + var(--scb-datepicker-offset));
|
|
3585
|
+
left: 0;
|
|
3586
|
+
width: 100%;
|
|
3587
|
+
z-index: var(--scb-datepicker-z-index);
|
|
3581
3588
|
}
|
|
3582
3589
|
.month-selector, .year-selector {
|
|
3583
3590
|
display: flex;
|
|
@@ -3669,9 +3676,9 @@
|
|
|
3669
3676
|
}
|
|
3670
3677
|
.popup {
|
|
3671
3678
|
position:absolute;
|
|
3672
|
-
top:
|
|
3679
|
+
top:0;
|
|
3673
3680
|
left:0;
|
|
3674
|
-
z-index:
|
|
3681
|
+
z-index:1;
|
|
3675
3682
|
}
|
|
3676
3683
|
.header {
|
|
3677
3684
|
display: flex;
|
|
@@ -4977,6 +4984,10 @@ ${this.value}</textarea
|
|
|
4977
4984
|
gap: var(--scb-form-gap, var(--spacing-6, 20px)); /* <— token + fallback */
|
|
4978
4985
|
}
|
|
4979
4986
|
|
|
4987
|
+
:host([variant="form"]) .content {
|
|
4988
|
+
overflow: visible;
|
|
4989
|
+
}
|
|
4990
|
+
|
|
4980
4991
|
:host([variant="floating"]) .container { --scb-dialog-min-w: var(--scb-dialog-min-w-floating, 360px); }
|
|
4981
4992
|
|
|
4982
4993
|
/* Choose: gör slottade radios vertikala med spacing */
|