@mmlogic/components 0.1.0

package/dist/components/mrd-currency-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as d,h as c,Host as i,transformTag as o}from"@stencil/core/internal/client";import{t as a}from"./i18n.js";import{v as t}from"./validation.js";import{p as n}from"./format.js";const s=["EUR","USD","GBP","CHF","JPY","CNY","AUD","CAD","SEK","NOK","DKK","NZD","SGD","HKD","PLN","CZK","HUF","MXN","BRL","INR","TRY","ZAR","AED","SAR"],l=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=d(this,"mrdChange",7),this.mrdBlur=d(this,"mrdBlur",7),this.name="",this.label="",this.value={amount:null,currency:"EUR"},this.required=!1,this.disabled=!1,this.locale=navigator.language,this.amountDisplay="",this.currency="EUR",this.error="",this.handleAmountInput=r=>{this.amountDisplay=r.target.value},this.handleAmountBlur=r=>{const e=r.target.value,d=n(e,this.locale);this.error=this.required&&!t(e)?a("required",this.locale):"";const c={amount:d,currency:this.currency};this.mrdChange.emit({name:this.name,value:c}),this.mrdBlur.emit({name:this.name,value:c})},this.handleCurrencyChange=r=>{this.currency=r.target.value;const e=n(this.amountDisplay,this.locale);this.mrdChange.emit({name:this.name,value:{amount:e,currency:this.currency}})}}componentWillLoad(){this.value&&(this.currency=this.value.currency||"EUR",this.amountDisplay=null!==this.value.amount?String(this.value.amount):"")}render(){const r=!!this.error;return c(i,{key:"d3450e9c26b1a755d3e6a5a3561d93b2ac566a28"},c("div",{key:"b66942cc1953daff728504deef8a9cc1330ef549",class:"mrd-currency-field"},this.label&&c("label",{key:"3d3f2f06e9ffea944552f0f7cf3150d0246c54f0",class:"mrd-currency-field__label"+(this.required?" mrd-currency-field__label--required":"")},this.label),c("div",{key:"d30a2adfceefdbefef2d4fe6633a163a753b15d0",class:"mrd-currency-field__row"},c("input",{key:"9af09b19b6cbe24498d6ca8edf7b28f675afdec5",class:"mrd-currency-field__amount"+(r?" mrd-currency-field__amount--error":""),type:"text",inputMode:"decimal",name:`${this.name}_amount`,value:this.amountDisplay,placeholder:"0.00",required:this.required,disabled:this.disabled,onInput:this.handleAmountInput,onBlur:this.handleAmountBlur}),c("select",{key:"21e55b04b7bf16586b5cfaa82d77db45c6dedf21",class:"mrd-currency-field__currency",disabled:this.disabled,onChange:this.handleCurrencyChange},s.map((r=>c("option",{key:r,value:r,selected:r===this.currency},r))))),r&&c("span",{key:"7a0006d4230557cf9c58f82f21de73b5d12f7e17",class:"mrd-currency-field__error"},this.error)))}static get style(){return".sc-mrd-currency-field-h{display:block}.mrd-currency-field.sc-mrd-currency-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-currency-field__label.sc-mrd-currency-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-currency-field__label--required.sc-mrd-currency-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-currency-field__row.sc-mrd-currency-field{display:flex;gap:var(--mrd-space-2);align-items:stretch}.mrd-currency-field__amount.sc-mrd-currency-field{flex:1;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;text-align:right;box-sizing:border-box}.mrd-currency-field__amount.sc-mrd-currency-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-currency-field__amount.sc-mrd-currency-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-currency-field__amount--error.sc-mrd-currency-field{border-color:var(--mrd-border-color-error)}.mrd-currency-field__amount--error.sc-mrd-currency-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-currency-field__currency.sc-mrd-currency-field{width:90px;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-space-2);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-input-color);background-color:var(--mrd-color-neutral-50);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;cursor:pointer;box-sizing:border-box;appearance:none;text-align:center}.mrd-currency-field__currency.sc-mrd-currency-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-currency-field__currency.sc-mrd-currency-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-currency-field__error.sc-mrd-currency-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-currency-field",{name:[1],label:[1],value:[16],required:[4],disabled:[4],locale:[1],amountDisplay:[32],currency:[32],error:[32]}]);function m(){"undefined"!=typeof customElements&&["mrd-currency-field"].forEach((r=>{"mrd-currency-field"===r&&(customElements.get(o(r))||customElements.define(o(r),l))}))}export{l as M,m as d}

package/dist/components/mrd-date-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdDateField extends Components.MrdDateField, HTMLElement {}
+export const MrdDateField: {
+    prototype: MrdDateField;
+    new (): MrdDateField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-date-field.js

@@ -0,0 +1 @@
+import{M as d,d as o}from"./mrd-date-field2.js";const r=d,s=o;export{r as MrdDateField,s as defineCustomElement}

package/dist/components/mrd-date-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as d,h as a,Host as t,transformTag as i}from"@stencil/core/internal/client";import{t as o}from"./i18n.js";import{v as s}from"./validation.js";const l=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=d(this,"mrdChange",7),this.mrdBlur=d(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.handleChange=r=>{const e=r.target.value;this.error=this.required&&!s(e)?o("required",this.locale):"",this.mrdChange.emit({name:this.name,value:e})},this.handleBlur=r=>{this.mrdBlur.emit({name:this.name,value:r.target.value})}}render(){const r=!!this.error;return a(t,{key:"84c777fc68a95e0b1ceb08d61e3af7afa199ce94"},a("div",{key:"6653d94ab79c74342ce792792547018e4464a814",class:"mrd-date-field"},this.label&&a("label",{key:"2fa7b7ec50c784f9410ca48b93d50e39dc6e0bee",class:"mrd-date-field__label"+(this.required?" mrd-date-field__label--required":"")},this.label),a("input",{key:"f79ebbaf0e28ad7668a5400d1df514b66457b72d",class:"mrd-date-field__input"+(r?" mrd-date-field__input--error":""),type:"date",name:this.name,value:this.value,required:this.required,disabled:this.disabled,onChange:this.handleChange,onBlur:this.handleBlur}),r&&a("span",{key:"e52f0b720d76e8ba0586fb40395b6875860762db",class:"mrd-date-field__error"},this.error)))}static get style(){return".sc-mrd-date-field-h{display:block}.mrd-date-field.sc-mrd-date-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-date-field__label.sc-mrd-date-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-date-field__label--required.sc-mrd-date-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-date-field__input.sc-mrd-date-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box;cursor:pointer}.mrd-date-field__input.sc-mrd-date-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-date-field__input.sc-mrd-date-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-date-field__input--error.sc-mrd-date-field{border-color:var(--mrd-border-color-error)}.mrd-date-field__input--error.sc-mrd-date-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-date-field__error.sc-mrd-date-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-date-field",{name:[1],label:[1],value:[1],required:[4],disabled:[4],locale:[1],error:[32]}]);function n(){"undefined"!=typeof customElements&&["mrd-date-field"].forEach((r=>{"mrd-date-field"===r&&(customElements.get(i(r))||customElements.define(i(r),l))}))}export{l as M,n as d}

package/dist/components/mrd-datetime-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdDatetimeField extends Components.MrdDatetimeField, HTMLElement {}
+export const MrdDatetimeField: {
+    prototype: MrdDatetimeField;
+    new (): MrdDatetimeField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-datetime-field.js

@@ -0,0 +1 @@
+import{M as t,d}from"./mrd-datetime-field2.js";const e=t,m=d;export{e as MrdDatetimeField,m as defineCustomElement}

package/dist/components/mrd-datetime-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as r,createEvent as d,h as t,Host as i,transformTag as a}from"@stencil/core/internal/client";import{t as o}from"./i18n.js";import{v as l}from"./validation.js";const m=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.mrdChange=d(this,"mrdChange",7),this.mrdBlur=d(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.handleChange=e=>{const r=e.target.value;this.error=this.required&&!l(r)?o("required",this.locale):"",this.mrdChange.emit({name:this.name,value:r})},this.handleBlur=e=>{this.mrdBlur.emit({name:this.name,value:e.target.value})}}render(){const e=!!this.error;return t(i,{key:"79331514eedaf208598a440423da6c154d0d516c"},t("div",{key:"a02a65bdef03a4243b700a68e32722a30781fa45",class:"mrd-datetime-field"},this.label&&t("label",{key:"adcf653253f64e8686b33211da4a5e8597b0786a",class:"mrd-datetime-field__label"+(this.required?" mrd-datetime-field__label--required":"")},this.label),t("input",{key:"49a9fba058d2857c476d8ff038766f8b19b21a41",class:"mrd-datetime-field__input"+(e?" mrd-datetime-field__input--error":""),type:"datetime-local",name:this.name,value:this.value,required:this.required,disabled:this.disabled,onChange:this.handleChange,onBlur:this.handleBlur}),e&&t("span",{key:"6d0d822b7cce825121b4abc77425442eb2556d76",class:"mrd-datetime-field__error"},this.error)))}static get style(){return".sc-mrd-datetime-field-h{display:block}.mrd-datetime-field.sc-mrd-datetime-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-datetime-field__label.sc-mrd-datetime-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-datetime-field__label--required.sc-mrd-datetime-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-datetime-field__input.sc-mrd-datetime-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box;cursor:pointer}.mrd-datetime-field__input.sc-mrd-datetime-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-datetime-field__input.sc-mrd-datetime-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-datetime-field__input--error.sc-mrd-datetime-field{border-color:var(--mrd-border-color-error)}.mrd-datetime-field__input--error.sc-mrd-datetime-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-datetime-field__error.sc-mrd-datetime-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-datetime-field",{name:[1],label:[1],value:[1],required:[4],disabled:[4],locale:[1],error:[32]}]);function s(){"undefined"!=typeof customElements&&["mrd-datetime-field"].forEach((e=>{"mrd-datetime-field"===e&&(customElements.get(a(e))||customElements.define(a(e),m))}))}export{m as M,s as d}

package/dist/components/mrd-email-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdEmailField extends Components.MrdEmailField, HTMLElement {}
+export const MrdEmailField: {
+    prototype: MrdEmailField;
+    new (): MrdEmailField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-email-field.js

@@ -0,0 +1 @@
+import{M as m,d as o}from"./mrd-email-field2.js";const r=m,s=o;export{r as MrdEmailField,s as defineCustomElement}

package/dist/components/mrd-email-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as i,h as d,Host as a,transformTag as l}from"@stencil/core/internal/client";import{t as o}from"./i18n.js";import{v as m,a as t}from"./validation.js";const s=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.handleInput=r=>{this.mrdChange.emit({name:this.name,value:r.target.value})},this.handleBlur=r=>{const e=r.target.value;this.error=this.required&&!m(e)?o("required",this.locale):e&&!t(e)?o("invalid_email",this.locale):"",this.mrdBlur.emit({name:this.name,value:e})}}render(){const r=!!this.error;return d(a,{key:"851ec092957ab86e811b292eaabe29d04a600fe0"},d("div",{key:"2d8969d60378f3161656369494549d682de8ec0e",class:"mrd-email-field"},this.label&&d("label",{key:"7a35cc60d4804097e1a54f984c7da1829f6bbd11",class:"mrd-email-field__label"+(this.required?" mrd-email-field__label--required":"")},this.label),d("input",{key:"1fc20e860aa021886f7ed522c3a0c8dd2cb1e093",class:"mrd-email-field__input"+(r?" mrd-email-field__input--error":""),type:"email",name:this.name,value:this.value,placeholder:this.placeholder||"name@example.com",required:this.required,disabled:this.disabled,onInput:this.handleInput,onBlur:this.handleBlur}),r&&d("span",{key:"a44b3b41b7cd6b8c643cc64e6aadd884a2ba4961",class:"mrd-email-field__error"},this.error)))}static get style(){return".sc-mrd-email-field-h{display:block}.mrd-email-field.sc-mrd-email-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-email-field__label.sc-mrd-email-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-email-field__label--required.sc-mrd-email-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-email-field__input.sc-mrd-email-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box}.mrd-email-field__input.sc-mrd-email-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-email-field__input.sc-mrd-email-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-email-field__input.sc-mrd-email-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-email-field__input--error.sc-mrd-email-field{border-color:var(--mrd-border-color-error)}.mrd-email-field__input--error.sc-mrd-email-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-email-field__error.sc-mrd-email-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-email-field",{name:[1],label:[1],value:[1],placeholder:[1],required:[4],disabled:[4],locale:[1],error:[32]}]);function n(){"undefined"!=typeof customElements&&["mrd-email-field"].forEach((r=>{"mrd-email-field"===r&&(customElements.get(l(r))||customElements.define(l(r),s))}))}export{s as M,n as d}

package/dist/components/mrd-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdField extends Components.MrdField, HTMLElement {}
+export const MrdField: {
+    prototype: MrdField;
+    new (): MrdField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-field.js

@@ -0,0 +1 @@
+import{M as o,d as r}from"./mrd-field2.js";const s=o,d=r;export{s as MrdField,d as defineCustomElement}

package/dist/components/mrd-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as l,createEvent as d,h as r,Host as i,transformTag as t}from"@stencil/core/internal/client";import{C as m,b as a,a as s}from"./client-layout.js";import{d as n}from"./mrd-boolean-field2.js";import{d as o}from"./mrd-currency-field2.js";import{d as u}from"./mrd-date-field2.js";import{d as c}from"./mrd-datetime-field2.js";import{d as f}from"./mrd-email-field2.js";import{d as v}from"./mrd-file-field2.js";import{d as b}from"./mrd-hyperlink-field2.js";import{d as h}from"./mrd-image-field2.js";import{d as p}from"./mrd-list-field2.js";import{d as j}from"./mrd-number-field2.js";import{d as k}from"./mrd-relation-field2.js";import{d as E}from"./mrd-text-field2.js";import{d as y}from"./mrd-textarea-field2.js";import{d as O}from"./mrd-time-field2.js";const x=e(class extends l{constructor(e){super(),!1!==e&&this.__registerHost(),this.mrdChange=d(this,"mrdChange",7),this.mrdBlur=d(this,"mrdBlur",7),this.mrdSearch=d(this,"mrdSearch",7),this.locale=navigator.language,this.handleChange=e=>{e.stopPropagation(),this.mrdChange.emit(e.detail)},this.handleBlur=e=>{e.stopPropagation(),this.mrdBlur.emit(e.detail)},this.handleSearch=e=>{e.stopPropagation(),this.mrdSearch.emit(e.detail)}}render(){var e,l,d,t,n,o,u,c,f,v,b,h,p,j,k,E,y,O,x,g,M,C,S,w,B,q,z,T,V;const{item:P,locale:R,value:U}=this;if(P.type===m.RELATION&&P.relation){const m=P.relation;return r(i,null,r("mrd-relation-field",{name:m.name,label:m.label,required:m.required,disabled:null!==(e=m.disabled)&&void 0!==e&&e,locale:R,relatedClass:m.relatedClass,displayType:null!==(l=m.displayType)&&void 0!==l?l:a.SEARCH,multiple:null!==(d=m.multiple)&&void 0!==d&&d,dropdownValues:null!==(t=m.dropdownValues)&&void 0!==t?t:[],value:U,onMrdChange:this.handleChange,onMrdBlur:this.handleBlur,onMrdSearch:this.handleSearch}))}if(P.type!==m.FIELD||!P.field)return r(i,null);const A=P.field,D={name:A.name,label:A.label,required:A.required,disabled:null!==(n=A.disabled)&&void 0!==n&&n,locale:R,onMrdChange:this.handleChange,onMrdBlur:this.handleBlur};switch(A.dataType){case s.TEXT:return r(i,null,r("mrd-text-field",Object.assign({},D,{value:null!==(o=U)&&void 0!==o?o:"",placeholder:null!==(u=A.placeholder)&&void 0!==u?u:""})));case s.TEXTBLOCK:return r(i,null,r("mrd-textarea-field",Object.assign({},D,{value:null!==(c=U)&&void 0!==c?c:"",placeholder:null!==(f=A.placeholder)&&void 0!==f?f:""})));case s.INTEGER:case s.DECIMAL:case s.PERCENTAGE:return r(i,null,r("mrd-number-field",Object.assign({},D,{value:null!==(v=U)&&void 0!==v?v:null,dataType:A.dataType,decimalPrecision:null!==(b=A.decimalPrecision)&&void 0!==b?b:2,placeholder:null!==(h=A.placeholder)&&void 0!==h?h:""})));case s.CURRENCY:return r(i,null,r("mrd-currency-field",Object.assign({},D,{value:null!==(p=U)&&void 0!==p?p:{amount:null,currency:null!==(j=A.currencyCode)&&void 0!==j?j:"EUR"}})));case s.BOOLEAN:return r(i,null,r("mrd-boolean-field",Object.assign({},D,{value:null!==(k=U)&&void 0!==k&&k})));case s.DATE:return r(i,null,r("mrd-date-field",Object.assign({},D,{value:null!==(E=U)&&void 0!==E?E:""})));case s.DATETIME:return r(i,null,r("mrd-datetime-field",Object.assign({},D,{value:null!==(y=U)&&void 0!==y?y:""})));case s.TIME:return r(i,null,r("mrd-time-field",Object.assign({},D,{value:null!==(O=U)&&void 0!==O?O:""})));case s.EMAIL:return r(i,null,r("mrd-email-field",Object.assign({},D,{value:null!==(x=U)&&void 0!==x?x:"",placeholder:null!==(g=A.placeholder)&&void 0!==g?g:""})));case s.HYPERLINK:return r(i,null,r("mrd-hyperlink-field",Object.assign({},D,{value:null!==(M=U)&&void 0!==M?M:"",placeholder:null!==(C=A.placeholder)&&void 0!==C?C:""})));case s.LIST:return r(i,null,r("mrd-list-field",Object.assign({},D,{value:null!==(S=U)&&void 0!==S?S:"",multiple:null!==(w=A.multiple)&&void 0!==w&&w,listValues:null!==(B=A.listValues)&&void 0!==B?B:[]})));case s.FILE:return r(i,null,r("mrd-file-field",Object.assign({},D,{accept:null!==(q=A.accept)&&void 0!==q?q:"",maxSize:null!==(z=A.maxSize)&&void 0!==z?z:0})));case s.IMAGE:return r(i,null,r("mrd-image-field",Object.assign({},D,{accept:null!==(T=A.accept)&&void 0!==T?T:"image/*",maxSize:null!==(V=A.maxSize)&&void 0!==V?V:0})));default:return r(i,null)}}},[2,"mrd-field",{item:[16],locale:[1],value:[16]}]);function g(){"undefined"!=typeof customElements&&["mrd-field","mrd-boolean-field","mrd-currency-field","mrd-date-field","mrd-datetime-field","mrd-email-field","mrd-file-field","mrd-hyperlink-field","mrd-image-field","mrd-list-field","mrd-number-field","mrd-relation-field","mrd-text-field","mrd-textarea-field","mrd-time-field"].forEach((e=>{switch(e){case"mrd-field":customElements.get(t(e))||customElements.define(t(e),x);break;case"mrd-boolean-field":customElements.get(t(e))||n();break;case"mrd-currency-field":customElements.get(t(e))||o();break;case"mrd-date-field":customElements.get(t(e))||u();break;case"mrd-datetime-field":customElements.get(t(e))||c();break;case"mrd-email-field":customElements.get(t(e))||f();break;case"mrd-file-field":customElements.get(t(e))||v();break;case"mrd-hyperlink-field":customElements.get(t(e))||b();break;case"mrd-image-field":customElements.get(t(e))||h();break;case"mrd-list-field":customElements.get(t(e))||p();break;case"mrd-number-field":customElements.get(t(e))||j();break;case"mrd-relation-field":customElements.get(t(e))||k();break;case"mrd-text-field":customElements.get(t(e))||E();break;case"mrd-textarea-field":customElements.get(t(e))||y();break;case"mrd-time-field":customElements.get(t(e))||O()}}))}export{x as M,g as d}

package/dist/components/mrd-file-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdFileField extends Components.MrdFileField, HTMLElement {}
+export const MrdFileField: {
+    prototype: MrdFileField;
+    new (): MrdFileField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-file-field.js

@@ -0,0 +1 @@
+import{M as o,d as r}from"./mrd-file-field2.js";const s=o,d=r;export{s as MrdFileField,d as defineCustomElement}

package/dist/components/mrd-file-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as r,createEvent as i,h as l,Host as d,transformTag as o}from"@stencil/core/internal/client";import{t}from"./i18n.js";const a=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.name="",this.label="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.accept="",this.maxSize=0,this.fileName="",this.isDragging=!1,this.error="",this.handleInputChange=e=>{var r;const i=e.target.files;this.handleFile(null!==(r=null==i?void 0:i[0])&&void 0!==r?r:null)},this.handleDragOver=e=>{e.preventDefault(),this.isDragging=!0},this.handleDragLeave=()=>{this.isDragging=!1},this.handleDrop=e=>{var r,i,l;e.preventDefault(),this.isDragging=!1;const d=null!==(l=null===(i=null===(r=e.dataTransfer)||void 0===r?void 0:r.files)||void 0===i?void 0:i[0])&&void 0!==l?l:null;this.handleFile(d)},this.handleZoneClick=()=>{var e;this.disabled||null===(e=this.fileInputRef)||void 0===e||e.click()},this.handleClear=e=>{e.stopPropagation(),this.fileName="",this.error="",this.fileInputRef&&(this.fileInputRef.value=""),this.mrdChange.emit({name:this.name,value:null})}}handleFile(e){if(!e)return this.fileName="",void this.mrdChange.emit({name:this.name,value:null});this.maxSize>0&&e.size>this.maxSize?this.error=t("file_too_large",this.locale):(this.error="",this.fileName=e.name,this.mrdChange.emit({name:this.name,value:e}))}render(){const e=!!this.error;return l(d,{key:"6617c70edaf193c204a951ff8116d54742592f84"},l("div",{key:"69a45446da411c1cfdadd9ee7051e3ceea95a2d2",class:"mrd-file-field"},this.label&&l("label",{key:"ca415565514c5a3829b1e4a446493916bd1b5b17",class:"mrd-file-field__label"+(this.required?" mrd-file-field__label--required":"")},this.label),l("div",{key:"abee0fc6a53c9f1266e6ed2d0ec8ab85a20a81ca",class:`mrd-file-field__zone${this.isDragging?" mrd-file-field__zone--dragging":""}${e?" mrd-file-field__zone--error":""}${this.disabled?" mrd-file-field__zone--disabled":""}`,onClick:this.handleZoneClick,onDragOver:this.handleDragOver,onDragLeave:this.handleDragLeave,onDrop:this.handleDrop},l("input",{key:"c1dbca750d4115b7d8ea3dcd9ed3405ed11c93a2",ref:e=>this.fileInputRef=e,class:"mrd-file-field__input",type:"file",name:this.name,accept:this.accept,disabled:this.disabled,required:this.required&&!this.fileName,onChange:this.handleInputChange}),this.fileName?l("div",{class:"mrd-file-field__selected"},l("svg",{class:"mrd-file-field__icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},l("path",{d:"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"}),l("polyline",{points:"14 2 14 8 20 8"})),l("span",{class:"mrd-file-field__filename"},this.fileName),l("button",{class:"mrd-file-field__clear",type:"button",onClick:this.handleClear,"aria-label":t("clear",this.locale)},"✕")):l("div",{class:"mrd-file-field__prompt"},l("svg",{class:"mrd-file-field__upload-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},l("polyline",{points:"16 16 12 12 8 16"}),l("line",{x1:"12",y1:"12",x2:"12",y2:"21"}),l("path",{d:"M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3"})),l("span",null,t("drop_file_here",this.locale)," ",l("span",{class:"mrd-file-field__browse"},t("browse",this.locale))))),e&&l("span",{key:"91ef6a6240f139e161288cb812d17e13a619ec89",class:"mrd-file-field__error"},this.error)))}static get style(){return".sc-mrd-file-field-h{display:block}.mrd-file-field.sc-mrd-file-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-file-field__label.sc-mrd-file-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-file-field__label--required.sc-mrd-file-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-file-field__zone.sc-mrd-file-field{display:flex;align-items:center;justify-content:center;padding:var(--mrd-space-6);border:2px dashed var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);background-color:var(--mrd-color-neutral-50);cursor:pointer;transition:border-color var(--mrd-transition), background-color var(--mrd-transition);min-height:100px;position:relative}.mrd-file-field__zone.sc-mrd-file-field:hover{border-color:var(--mrd-color-primary);background-color:var(--mrd-color-primary-light)}.mrd-file-field__zone--dragging.sc-mrd-file-field{border-color:var(--mrd-color-primary);background-color:var(--mrd-color-primary-light)}.mrd-file-field__zone--error.sc-mrd-file-field{border-color:var(--mrd-border-color-error)}.mrd-file-field__zone--disabled.sc-mrd-file-field{opacity:0.6;cursor:not-allowed}.mrd-file-field__zone--disabled.sc-mrd-file-field:hover{border-color:var(--mrd-border-color);background-color:var(--mrd-color-neutral-50)}.mrd-file-field__input.sc-mrd-file-field{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer;pointer-events:none}.mrd-file-field__prompt.sc-mrd-file-field{display:flex;flex-direction:column;align-items:center;gap:var(--mrd-space-2);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-500);text-align:center}.mrd-file-field__upload-icon.sc-mrd-file-field{width:32px;height:32px;color:var(--mrd-color-neutral-400)}.mrd-file-field__browse.sc-mrd-file-field{color:var(--mrd-color-primary);font-weight:var(--mrd-font-weight-medium);text-decoration:underline}.mrd-file-field__selected.sc-mrd-file-field{display:flex;align-items:center;gap:var(--mrd-space-2);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-700)}.mrd-file-field__icon.sc-mrd-file-field{width:20px;height:20px;color:var(--mrd-color-primary);flex-shrink:0}.mrd-file-field__filename.sc-mrd-file-field{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}.mrd-file-field__clear.sc-mrd-file-field{background:none;border:none;cursor:pointer;color:var(--mrd-color-neutral-400);font-size:var(--mrd-font-size-sm);padding:var(--mrd-space-1);border-radius:var(--mrd-border-radius-sm);line-height:1}.mrd-file-field__clear.sc-mrd-file-field:hover{color:var(--mrd-color-danger);background-color:var(--mrd-color-danger-light)}.mrd-file-field__error.sc-mrd-file-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-file-field",{name:[1],label:[1],required:[4],disabled:[4],locale:[1],accept:[1],maxSize:[2,"max-size"],fileName:[32],isDragging:[32],error:[32]}]);function s(){"undefined"!=typeof customElements&&["mrd-file-field"].forEach((e=>{"mrd-file-field"===e&&(customElements.get(o(e))||customElements.define(o(e),a))}))}export{a as M,s as d}

package/dist/components/mrd-form.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdForm extends Components.MrdForm, HTMLElement {}
+export const MrdForm: {
+    prototype: MrdForm;
+    new (): MrdForm;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-form.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as m,h as d,Host as o,transformTag as t}from"@stencil/core/internal/client";import{C as i}from"./client-layout.js";import{t as s}from"./i18n.js";import{v as a}from"./validation.js";import{d as l}from"./mrd-boolean-field2.js";import{d as f}from"./mrd-currency-field2.js";import{d as n}from"./mrd-date-field2.js";import{d as c}from"./mrd-datetime-field2.js";import{d as u}from"./mrd-email-field2.js";import{d as h}from"./mrd-field2.js";import{d as p}from"./mrd-file-field2.js";import{d as v}from"./mrd-hyperlink-field2.js";import{d as b}from"./mrd-image-field2.js";import{d as _}from"./mrd-list-field2.js";import{d as g}from"./mrd-number-field2.js";import{d as y}from"./mrd-relation-field2.js";import{d as j}from"./mrd-text-field2.js";import{d as x}from"./mrd-textarea-field2.js";import{d as k}from"./mrd-time-field2.js";const E=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdSubmit=m(this,"mrdSubmit",7),this.mrdSearch=m(this,"mrdSearch",7),this.locale=navigator.language,this.values={},this.formValues={},this.errors={},this.submitted=!1,this.handleFieldChange=r=>{const{name:e,value:m}=r.detail;this.formValues=Object.assign(Object.assign({},this.formValues),{[e]:m}),this.errors[e]&&(this.errors=Object.assign(Object.assign({},this.errors),{[e]:""}))},this.handleSearch=r=>{this.mrdSearch.emit(r.detail)},this.handleSubmit=r=>{r.preventDefault(),this.submitted=!0,this.validate()&&this.mrdSubmit.emit(Object.assign({},this.formValues))}}componentWillLoad(){var r;this.formValues=Object.assign({},null!==(r=this.values)&&void 0!==r?r:{})}async setFieldValue(r,e){this.formValues=Object.assign(Object.assign({},this.formValues),{[r]:e}),this.errors[r]&&(this.errors=Object.assign(Object.assign({},this.errors),{[r]:""}))}collectFields(r){const e=[];for(const m of r)m.type!==i.FIELD&&m.type!==i.RELATION||e.push(m),m.items&&e.push(...this.collectFields(m.items));return e}validate(){var r,e,m;const d={},o=this.collectFields(null!==(e=null===(r=this.layout)||void 0===r?void 0:r.items)&&void 0!==e?e:[]);for(const r of o){const e=null!==(m=r.field)&&void 0!==m?m:r.relation;e&&e.required&&!a(this.formValues[e.name])&&(d[e.name]=s("required",this.locale))}return this.errors=d,0===Object.keys(d).length}renderItems(r){return r.map((r=>{var e,m,o,t;if(r.type===i.SECTION)return d("fieldset",{class:"mrd-form__section"},r.label&&d("legend",{class:"mrd-form__section-legend"},r.label),d("div",{class:"mrd-form__section-body"},r.items&&this.renderItems(r.items)));if(r.type===i.GROUP)return d("div",{class:"mrd-form__group"},r.label&&d("div",{class:"mrd-form__group-label"},r.label),d("div",{class:"mrd-form__group-body"},r.items&&this.renderItems(r.items)));const s=null!==(t=null!==(m=null===(e=r.field)||void 0===e?void 0:e.name)&&void 0!==m?m:null===(o=r.relation)||void 0===o?void 0:o.name)&&void 0!==t?t:"";return d("div",{class:"mrd-form__field"},d("mrd-field",{item:r,locale:this.locale,value:this.formValues[s],onMrdChange:this.handleFieldChange,onMrdBlur:this.handleFieldChange,onMrdSearch:this.handleSearch}),this.errors[s]&&d("span",{class:"mrd-form__field-error"},this.errors[s]))}))}render(){if(!this.layout)return d(o,null);const r=this.locale.startsWith("ar")?"rtl":"ltr";return d(o,null,d("form",{class:"mrd-form",dir:r,onSubmit:this.handleSubmit,noValidate:!0},this.layout.title&&d("h2",{class:"mrd-form__title"},this.layout.title),d("div",{class:"mrd-form__body"},this.renderItems(this.layout.items)),d("div",{class:"mrd-form__footer"},d("button",{type:"submit",class:"mrd-form__submit"},s("submit",this.locale)))))}static get style(){return".sc-mrd-form-h{display:block}.mrd-form.sc-mrd-form{font-family:var(--mrd-font-family);width:100%}.mrd-form__title.sc-mrd-form{font-size:var(--mrd-font-size-2xl);font-weight:var(--mrd-font-weight-bold);color:var(--mrd-color-neutral-900);margin:0 0 var(--mrd-space-6) 0}.mrd-form__body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-5)}.mrd-form__field.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-1)}.mrd-form__field-error.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}.mrd-form__section.sc-mrd-form{border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);padding:var(--mrd-space-4) var(--mrd-space-5);margin:0}.mrd-form__section-legend.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-700);padding:0 var(--mrd-space-2)}.mrd-form__section-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);margin-top:var(--mrd-space-2)}.mrd-form__group.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-2)}.mrd-form__group-label.sc-mrd-form{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-semibold);color:var(--mrd-color-neutral-500);text-transform:uppercase;letter-spacing:0.05em}.mrd-form__group-body.sc-mrd-form{display:flex;flex-direction:column;gap:var(--mrd-space-4);padding-left:var(--mrd-space-4);border-left:3px solid var(--mrd-color-neutral-200)}.mrd-form__footer.sc-mrd-form{margin-top:var(--mrd-space-8);padding-top:var(--mrd-space-5);border-top:var(--mrd-border-width) solid var(--mrd-border-color);display:flex;justify-content:flex-end}.mrd-form__submit.sc-mrd-form{display:inline-flex;align-items:center;justify-content:center;height:var(--mrd-input-height);padding:0 var(--mrd-space-6);background-color:var(--mrd-color-primary);color:var(--mrd-color-white);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);border:none;border-radius:var(--mrd-border-radius);cursor:pointer;transition:background-color var(--mrd-transition)}.mrd-form__submit.sc-mrd-form:hover{background-color:var(--mrd-color-primary-hover)}.mrd-form__submit.sc-mrd-form:focus{outline:none;box-shadow:var(--mrd-shadow-focus)}.mrd-form__submit.sc-mrd-form:active{background-color:var(--mrd-color-primary-dark)}"}},[2,"mrd-form",{layout:[16],locale:[1],values:[16],formValues:[32],errors:[32],submitted:[32],setFieldValue:[64]}]),w=E,O=function(){"undefined"!=typeof customElements&&["mrd-form","mrd-boolean-field","mrd-currency-field","mrd-date-field","mrd-datetime-field","mrd-email-field","mrd-field","mrd-file-field","mrd-hyperlink-field","mrd-image-field","mrd-list-field","mrd-number-field","mrd-relation-field","mrd-text-field","mrd-textarea-field","mrd-time-field"].forEach((r=>{switch(r){case"mrd-form":customElements.get(t(r))||customElements.define(t(r),E);break;case"mrd-boolean-field":customElements.get(t(r))||l();break;case"mrd-currency-field":customElements.get(t(r))||f();break;case"mrd-date-field":customElements.get(t(r))||n();break;case"mrd-datetime-field":customElements.get(t(r))||c();break;case"mrd-email-field":customElements.get(t(r))||u();break;case"mrd-field":customElements.get(t(r))||h();break;case"mrd-file-field":customElements.get(t(r))||p();break;case"mrd-hyperlink-field":customElements.get(t(r))||v();break;case"mrd-image-field":customElements.get(t(r))||b();break;case"mrd-list-field":customElements.get(t(r))||_();break;case"mrd-number-field":customElements.get(t(r))||g();break;case"mrd-relation-field":customElements.get(t(r))||y();break;case"mrd-text-field":customElements.get(t(r))||j();break;case"mrd-textarea-field":customElements.get(t(r))||x();break;case"mrd-time-field":customElements.get(t(r))||k()}}))};export{w as MrdForm,O as defineCustomElement}

package/dist/components/mrd-hyperlink-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdHyperlinkField extends Components.MrdHyperlinkField, HTMLElement {}
+export const MrdHyperlinkField: {
+    prototype: MrdHyperlinkField;
+    new (): MrdHyperlinkField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-hyperlink-field.js

@@ -0,0 +1 @@
+import{M as r,d as o}from"./mrd-hyperlink-field2.js";const s=r,d=o;export{s as MrdHyperlinkField,d as defineCustomElement}

package/dist/components/mrd-hyperlink-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as i,h as d,Host as l,transformTag as o}from"@stencil/core/internal/client";import{t}from"./i18n.js";import{v as a,b as n}from"./validation.js";const s=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.handleInput=r=>{this.mrdChange.emit({name:this.name,value:r.target.value})},this.handleBlur=r=>{const e=r.target.value;this.error=this.required&&!a(e)?t("required",this.locale):e&&!n(e)?t("invalid_url",this.locale):"",this.mrdBlur.emit({name:this.name,value:e})}}render(){const r=!!this.error;return d(l,{key:"4f642cb037c6e25786593dbf0cbead71ce34580c"},d("div",{key:"c679d95924bc2d22089c435ec15a35132a4a062d",class:"mrd-hyperlink-field"},this.label&&d("label",{key:"b391dd2d152c68fe75517926c40779313a23b9d9",class:"mrd-hyperlink-field__label"+(this.required?" mrd-hyperlink-field__label--required":"")},this.label),d("input",{key:"ea0d2aba8520ecbde4df8e4507e0f16bd497baa9",class:"mrd-hyperlink-field__input"+(r?" mrd-hyperlink-field__input--error":""),type:"url",name:this.name,value:this.value,placeholder:this.placeholder||"https://",required:this.required,disabled:this.disabled,onInput:this.handleInput,onBlur:this.handleBlur}),r&&d("span",{key:"fab1d90c726b69c6c43c7997fd1b7480678c2c78",class:"mrd-hyperlink-field__error"},this.error)))}static get style(){return".sc-mrd-hyperlink-field-h{display:block}.mrd-hyperlink-field.sc-mrd-hyperlink-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-hyperlink-field__label.sc-mrd-hyperlink-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-hyperlink-field__label--required.sc-mrd-hyperlink-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-hyperlink-field__input.sc-mrd-hyperlink-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-hyperlink-field__input--error.sc-mrd-hyperlink-field{border-color:var(--mrd-border-color-error)}.mrd-hyperlink-field__input--error.sc-mrd-hyperlink-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-hyperlink-field__error.sc-mrd-hyperlink-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-hyperlink-field",{name:[1],label:[1],value:[1],placeholder:[1],required:[4],disabled:[4],locale:[1],error:[32]}]);function c(){"undefined"!=typeof customElements&&["mrd-hyperlink-field"].forEach((r=>{"mrd-hyperlink-field"===r&&(customElements.get(o(r))||customElements.define(o(r),s))}))}export{s as M,c as d}

package/dist/components/mrd-image-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdImageField extends Components.MrdImageField, HTMLElement {}
+export const MrdImageField: {
+    prototype: MrdImageField;
+    new (): MrdImageField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-image-field.js

@@ -0,0 +1 @@
+import{M as m,d as o}from"./mrd-image-field2.js";const r=m,s=o;export{r as MrdImageField,s as defineCustomElement}

package/dist/components/mrd-image-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as i,h as d,Host as a,transformTag as o}from"@stencil/core/internal/client";import{t as l}from"./i18n.js";const m=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.name="",this.label="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.accept="image/*",this.maxSize=0,this.previewUrl="",this.fileName="",this.isDragging=!1,this.error="",this.handleInputChange=r=>{var e;const i=r.target.files;this.handleFile(null!==(e=null==i?void 0:i[0])&&void 0!==e?e:null)},this.handleDragOver=r=>{r.preventDefault(),this.isDragging=!0},this.handleDragLeave=()=>{this.isDragging=!1},this.handleDrop=r=>{var e,i,d;r.preventDefault(),this.isDragging=!1;const a=null!==(d=null===(i=null===(e=r.dataTransfer)||void 0===e?void 0:e.files)||void 0===i?void 0:i[0])&&void 0!==d?d:null;this.handleFile(a)},this.handleZoneClick=()=>{var r;this.disabled||null===(r=this.fileInputRef)||void 0===r||r.click()},this.handleClear=r=>{r.stopPropagation(),this.previewUrl="",this.fileName="",this.error="",this.fileInputRef&&(this.fileInputRef.value=""),this.mrdChange.emit({name:this.name,value:null})}}handleFile(r){if(!r)return this.previewUrl="",this.fileName="",void this.mrdChange.emit({name:this.name,value:null});if(this.maxSize>0&&r.size>this.maxSize)return void(this.error=l("file_too_large",this.locale));if(!r.type.startsWith("image/"))return void(this.error="Please select an image file");this.error="",this.fileName=r.name;const e=new FileReader;e.onload=r=>{var e;this.previewUrl=null===(e=r.target)||void 0===e?void 0:e.result},e.readAsDataURL(r),this.mrdChange.emit({name:this.name,value:r})}render(){const r=!!this.error;return d(a,{key:"c188d49744b7044d46b6c6f42126032f1ecc8a8f"},d("div",{key:"53990650a5109172addca5ae274b180569b08860",class:"mrd-image-field"},this.label&&d("label",{key:"3dc78faca422fcafed31833a11307cace9f2ff13",class:"mrd-image-field__label"+(this.required?" mrd-image-field__label--required":"")},this.label),d("div",{key:"4ca9eb1362c999721742ac3d727326078fe844c7",class:`mrd-image-field__zone${this.isDragging?" mrd-image-field__zone--dragging":""}${r?" mrd-image-field__zone--error":""}${this.disabled?" mrd-image-field__zone--disabled":""}`,onClick:this.handleZoneClick,onDragOver:this.handleDragOver,onDragLeave:this.handleDragLeave,onDrop:this.handleDrop},d("input",{key:"9e3a237ffb69ce9f6fb20e6b3e603e4db453e7e9",ref:r=>this.fileInputRef=r,class:"mrd-image-field__input",type:"file",name:this.name,accept:this.accept,disabled:this.disabled,required:this.required&&!this.previewUrl,onChange:this.handleInputChange}),this.previewUrl?d("div",{class:"mrd-image-field__preview-container"},d("div",{class:"mrd-image-field__preview-thumb"},d("img",{class:"mrd-image-field__preview",src:this.previewUrl,alt:this.fileName})),d("div",{class:"mrd-image-field__preview-info"},d("span",{class:"mrd-image-field__preview-name"},this.fileName)),d("button",{class:"mrd-image-field__clear",type:"button",onClick:this.handleClear,"aria-label":l("clear",this.locale)},l("remove",this.locale))):d("div",{class:"mrd-image-field__prompt"},d("svg",{class:"mrd-image-field__upload-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},d("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2",ry:"2"}),d("circle",{cx:"8.5",cy:"8.5",r:"1.5"}),d("polyline",{points:"21 15 16 10 5 21"})),d("span",null,l("drop_file_here",this.locale)," ",d("span",{class:"mrd-image-field__browse"},l("browse",this.locale))))),r&&d("span",{key:"85cf998e1ab26cce7fbf87836df25672971a4eb1",class:"mrd-image-field__error"},this.error)))}static get style(){return".sc-mrd-image-field-h{display:block}.mrd-image-field.sc-mrd-image-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-image-field__label.sc-mrd-image-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-image-field__label--required.sc-mrd-image-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-image-field__zone.sc-mrd-image-field{display:flex;align-items:center;justify-content:center;border:2px dashed var(--mrd-border-color);border-radius:var(--mrd-border-radius-md);background-color:var(--mrd-color-neutral-50);cursor:pointer;transition:border-color var(--mrd-transition), background-color var(--mrd-transition);min-height:100px;position:relative}.mrd-image-field__zone.sc-mrd-image-field:hover{border-color:var(--mrd-color-primary);background-color:var(--mrd-color-primary-light)}.mrd-image-field__zone--dragging.sc-mrd-image-field{border-color:var(--mrd-color-primary);background-color:var(--mrd-color-primary-light)}.mrd-image-field__zone--error.sc-mrd-image-field{border-color:var(--mrd-border-color-error)}.mrd-image-field__zone--disabled.sc-mrd-image-field{opacity:0.6;cursor:not-allowed}.mrd-image-field__zone--disabled.sc-mrd-image-field:hover{border-color:var(--mrd-border-color);background-color:var(--mrd-color-neutral-50)}.mrd-image-field__input.sc-mrd-image-field{position:absolute;inset:0;opacity:0;width:100%;height:100%;pointer-events:none}.mrd-image-field__prompt.sc-mrd-image-field{display:flex;flex-direction:column;align-items:center;gap:var(--mrd-space-2);padding:var(--mrd-space-6);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-500);text-align:center}.mrd-image-field__upload-icon.sc-mrd-image-field{width:40px;height:40px;color:var(--mrd-color-neutral-400)}.mrd-image-field__browse.sc-mrd-image-field{color:var(--mrd-color-primary);font-weight:var(--mrd-font-weight-medium);text-decoration:underline}.mrd-image-field__preview-container.sc-mrd-image-field{display:flex;align-items:center;gap:var(--mrd-space-4);padding:var(--mrd-space-4);width:100%}.mrd-image-field__preview-thumb.sc-mrd-image-field{flex-shrink:0;width:80px;height:80px;border-radius:var(--mrd-border-radius);overflow:hidden;border:var(--mrd-border-width) solid var(--mrd-border-color);background-color:var(--mrd-color-neutral-100)}.mrd-image-field__preview.sc-mrd-image-field{width:100%;height:100%;object-fit:cover;display:block}.mrd-image-field__preview-info.sc-mrd-image-field{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--mrd-space-1)}.mrd-image-field__preview-name.sc-mrd-image-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-neutral-800);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mrd-image-field__overlay.sc-mrd-image-field{display:none}.mrd-image-field__clear.sc-mrd-image-field{flex-shrink:0;background-color:var(--mrd-color-white);color:var(--mrd-color-danger);border:var(--mrd-border-width) solid var(--mrd-color-danger);border-radius:var(--mrd-border-radius);padding:var(--mrd-space-1) var(--mrd-space-3);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium);cursor:pointer;transition:background-color var(--mrd-transition), color var(--mrd-transition)}.mrd-image-field__clear.sc-mrd-image-field:hover{background-color:var(--mrd-color-danger);color:var(--mrd-color-white)}.mrd-image-field__error.sc-mrd-image-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-image-field",{name:[1],label:[1],required:[4],disabled:[4],locale:[1],accept:[1],maxSize:[2,"max-size"],previewUrl:[32],fileName:[32],isDragging:[32],error:[32]}]);function t(){"undefined"!=typeof customElements&&["mrd-image-field"].forEach((r=>{"mrd-image-field"===r&&(customElements.get(o(r))||customElements.define(o(r),m))}))}export{m as M,t as d}

package/dist/components/mrd-list-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdListField extends Components.MrdListField, HTMLElement {}
+export const MrdListField: {
+    prototype: MrdListField;
+    new (): MrdListField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-list-field.js

@@ -0,0 +1 @@
+import{M as s,d as o}from"./mrd-list-field2.js";const r=s,t=o;export{r as MrdListField,t as defineCustomElement}

package/dist/components/mrd-list-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as i,createEvent as e,h as t,Host as s,transformTag as l}from"@stencil/core/internal/client";import{t as d}from"./i18n.js";import{v as o}from"./validation.js";const a=r(class extends i{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=e(this,"mrdChange",7),this.mrdBlur=e(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.required=!1,this.disabled=!1,this.multiple=!1,this.locale=navigator.language,this.listValues=[],this.error="",this.selected=[],this.handleSelectChange=r=>{const i=r.target;if(this.multiple){const r=Array.from(i.selectedOptions).map((r=>r.value));this.selected=r,this.error=this.required&&!o(r)?d("required",this.locale):"",this.mrdChange.emit({name:this.name,value:r})}else{const r=i.value;this.error=this.required&&!o(r)?d("required",this.locale):"",this.mrdChange.emit({name:this.name,value:r})}},this.handleBlur=()=>{this.mrdBlur.emit({name:this.name,value:this.multiple?this.selected:this.value})},this.toggleCheckbox=r=>{this.selected=this.selected.includes(r)?this.selected.filter((i=>i!==r)):[...this.selected,r],this.error=this.required&&!o(this.selected)?d("required",this.locale):"",this.mrdChange.emit({name:this.name,value:this.selected})}}componentWillLoad(){this.multiple&&(this.selected=Array.isArray(this.value)?this.value:this.value?[this.value]:[])}getContrastColor(r){if(!r)return"#000000";const i=r.replace("#","");return(.299*parseInt(i.substr(0,2),16)+.587*parseInt(i.substr(2,2),16)+.114*parseInt(i.substr(4,2),16))/255>.5?"#000000":"#ffffff"}render(){var r,i;const e=!!this.error,l=Array.isArray(this.value)?null!==(r=this.value[0])&&void 0!==r?r:"":null!==(i=this.value)&&void 0!==i?i:"";return t(s,null,t("div",{class:"mrd-list-field"},this.label&&t("label",{class:"mrd-list-field__label"+(this.required?" mrd-list-field__label--required":"")},this.label),this.multiple?t("div",{class:"mrd-list-field__checkbox-list"+(e?" mrd-list-field__checkbox-list--error":"")},this.listValues.map((r=>t("label",{key:r.value,class:"mrd-list-field__checkbox-item"},t("input",{type:"checkbox",checked:this.selected.includes(r.value),disabled:this.disabled,onChange:()=>this.toggleCheckbox(r.value)}),r.color&&t("span",{class:"mrd-list-field__color-dot",style:{backgroundColor:r.color}}),t("span",null,r.label))))):t("select",{class:"mrd-list-field__select"+(e?" mrd-list-field__select--error":""),name:this.name,required:this.required,disabled:this.disabled,onChange:this.handleSelectChange,onBlur:this.handleBlur},t("option",{value:""},d("select_placeholder",this.locale)),this.listValues.map((r=>{const i=r.color?{backgroundColor:r.color,color:this.getContrastColor(r.color)}:{};return t("option",{key:r.value,value:r.value,selected:r.value===l,style:i},r.label)}))),e&&t("span",{class:"mrd-list-field__error"},this.error)))}static get style(){return".sc-mrd-list-field-h{display:block}.mrd-list-field.sc-mrd-list-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-list-field__label.sc-mrd-list-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-list-field__label--required.sc-mrd-list-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-list-field__select.sc-mrd-list-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);padding-right:calc(var(--mrd-input-padding-x) + 1.5rem);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right var(--mrd-space-3) center;border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;cursor:pointer;box-sizing:border-box}.mrd-list-field__select.sc-mrd-list-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-list-field__select.sc-mrd-list-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-list-field__select--error.sc-mrd-list-field{border-color:var(--mrd-border-color-error)}.mrd-list-field__select--error.sc-mrd-list-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-list-field__checkbox-list.sc-mrd-list-field{display:flex;flex-direction:column;gap:var(--mrd-space-2);padding:var(--mrd-space-3);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);background-color:var(--mrd-input-bg)}.mrd-list-field__checkbox-list--error.sc-mrd-list-field{border-color:var(--mrd-border-color-error)}.mrd-list-field__checkbox-item.sc-mrd-list-field{display:flex;align-items:center;gap:var(--mrd-space-2);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);cursor:pointer}.mrd-list-field__checkbox-item.sc-mrd-list-field input[type='checkbox'].sc-mrd-list-field{width:1rem;height:1rem;cursor:pointer;accent-color:var(--mrd-color-primary)}.mrd-list-field__color-dot.sc-mrd-list-field{display:inline-block;width:12px;height:12px;border-radius:50%;flex-shrink:0}.mrd-list-field__error.sc-mrd-list-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-list-field",{name:[1],label:[1],value:[1],required:[4],disabled:[4],multiple:[4],locale:[1],listValues:[16],error:[32],selected:[32]}]);function c(){"undefined"!=typeof customElements&&["mrd-list-field"].forEach((r=>{"mrd-list-field"===r&&(customElements.get(l(r))||customElements.define(l(r),a))}))}export{a as M,c as d}

package/dist/components/mrd-number-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdNumberField extends Components.MrdNumberField, HTMLElement {}
+export const MrdNumberField: {
+    prototype: MrdNumberField;
+    new (): MrdNumberField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-number-field.js

@@ -0,0 +1 @@
+import{M as r,d as m}from"./mrd-number-field2.js";const o=r,s=m;export{o as MrdNumberField,s as defineCustomElement}

package/dist/components/mrd-number-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as i,createEvent as e,h as d,Host as t,transformTag as s}from"@stencil/core/internal/client";import{t as o}from"./i18n.js";import{c as a,v as l}from"./validation.js";import{p as n,f as m}from"./format.js";import{a as c}from"./client-layout.js";const u=r(class extends i{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=e(this,"mrdChange",7),this.mrdBlur=e(this,"mrdBlur",7),this.name="",this.label="",this.value=null,this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.dataType=c.INTEGER,this.decimalPrecision=2,this.displayValue="",this.error="",this.handleInput=r=>{this.displayValue=r.target.value},this.handleBlur=r=>{const i=r.target.value,e=n(i,this.locale);this.error=!this.required||null!==e&&""!==i?""===i||a(e,this.dataType)?"":o("invalid_number",this.locale):o("required",this.locale),null!==e&&l(i)&&(this.displayValue=this.formatForDisplay(e)),this.mrdChange.emit({name:this.name,value:e}),this.mrdBlur.emit({name:this.name,value:e})},this.handleFocus=()=>{if(null!=this.value){const r=String(this.value);this.displayValue=r}}}componentWillLoad(){null!=this.value&&(this.displayValue=this.formatForDisplay(this.value))}formatForDisplay(r){return this.dataType===c.PERCENTAGE?m(r,this.locale,{minimumFractionDigits:0,maximumFractionDigits:this.decimalPrecision})+"%":m(r,this.locale,this.dataType===c.DECIMAL?{minimumFractionDigits:this.decimalPrecision,maximumFractionDigits:this.decimalPrecision}:{maximumFractionDigits:0})}render(){const r=!!this.error,i=this.dataType===c.PERCENTAGE?"%":"";return d(t,{key:"68d81012d9180dde4160a507121b83f04698834a"},d("div",{key:"b8e46f6d23527b2c95ad2738fc63a07adfce4fda",class:"mrd-number-field"},this.label&&d("label",{key:"c3271c7a8adfd8bcb3b4f51e580239f928a354a5",class:"mrd-number-field__label"+(this.required?" mrd-number-field__label--required":"")},this.label),d("div",{key:"c46b69affd1e22c539511f6743b6d23fe73fb079",class:"mrd-number-field__input-wrapper"},d("input",{key:"e68188829c2e03c947c5605332a2681de550a0d5",class:"mrd-number-field__input"+(r?" mrd-number-field__input--error":""),type:"text",inputMode:"decimal",name:this.name,value:this.displayValue,placeholder:this.placeholder||(i?`0${i}`:"0"),required:this.required,disabled:this.disabled,onInput:this.handleInput,onBlur:this.handleBlur,onFocus:this.handleFocus})),r&&d("span",{key:"bdc2723e2547517765bd64ad70c5103c7a2b363c",class:"mrd-number-field__error"},this.error)))}static get style(){return".sc-mrd-number-field-h{display:block}.mrd-number-field.sc-mrd-number-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-number-field__label.sc-mrd-number-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-number-field__label--required.sc-mrd-number-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-number-field__input-wrapper.sc-mrd-number-field{position:relative;display:flex;align-items:center}.mrd-number-field__input.sc-mrd-number-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box;text-align:right}.mrd-number-field__input.sc-mrd-number-field::placeholder{color:var(--mrd-input-placeholder-color);text-align:left}.mrd-number-field__input.sc-mrd-number-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-number-field__input.sc-mrd-number-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-number-field__input--error.sc-mrd-number-field{border-color:var(--mrd-border-color-error)}.mrd-number-field__input--error.sc-mrd-number-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-number-field__error.sc-mrd-number-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-number-field",{name:[1],label:[1],value:[2],placeholder:[1],required:[4],disabled:[4],locale:[1],dataType:[1,"data-type"],decimalPrecision:[2,"decimal-precision"],displayValue:[32],error:[32]}]);function f(){"undefined"!=typeof customElements&&["mrd-number-field"].forEach((r=>{"mrd-number-field"===r&&(customElements.get(s(r))||customElements.define(s(r),u))}))}export{u as M,f as d}

package/dist/components/mrd-relation-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdRelationField extends Components.MrdRelationField, HTMLElement {}
+export const MrdRelationField: {
+    prototype: MrdRelationField;
+    new (): MrdRelationField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-relation-field.js

@@ -0,0 +1 @@
+import{M as o,d as r}from"./mrd-relation-field2.js";const s=o,t=r;export{s as MrdRelationField,t as defineCustomElement}

package/dist/components/mrd-relation-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as i,h as t,Host as o,transformTag as l}from"@stencil/core/internal/client";import{t as d}from"./i18n.js";import{v as a}from"./validation.js";import{b as s}from"./client-layout.js";const n=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.mrdSearch=i(this,"mrdSearch",7),this.name="",this.label="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.relatedClass="",this.displayType=s.SEARCH,this.multiple=!1,this.dropdownValues=[],this.value=null,this.searchQuery="",this.searchResults=[],this.isLoading=!1,this.selectedItems=[],this.showResults=!1,this.error="",this.highlightedIndex=-1,this.searchDebounce=null,this.handleKeyDown=r=>{this.showResults&&0!==this.searchResults.length?"ArrowDown"===r.key?(r.preventDefault(),this.highlightedIndex=Math.min(this.highlightedIndex+1,this.searchResults.length-1)):"ArrowUp"===r.key?(r.preventDefault(),this.highlightedIndex=Math.max(this.highlightedIndex-1,0)):"Enter"===r.key?(r.preventDefault(),this.highlightedIndex>=0&&this.handleResultSelect(this.searchResults[this.highlightedIndex])):"Escape"===r.key&&(this.showResults=!1,this.highlightedIndex=-1):"Escape"===r.key&&(this.showResults=!1,this.highlightedIndex=-1)},this.clearSelection=()=>{this.selectedItems=[],this.searchQuery="",this.searchResults=[],this.showResults=!1,this.highlightedIndex=-1,this.mrdChange.emit({name:this.name,value:this.multiple?[]:null})},this.handleSearchInput=r=>{const e=r.target.value;this.searchQuery=e,this.searchDebounce&&clearTimeout(this.searchDebounce),e.trim().length>=2?(this.isLoading=!0,this.showResults=!0,this.searchDebounce=setTimeout((()=>{this.mrdSearch.emit({query:e,relatedClass:this.relatedClass})}),300)):(this.searchResults=[],this.showResults=!1,this.isLoading=!1)},this.handleResultSelect=r=>{if(this.multiple){this.selectedItems.find((e=>e.id===r.id))||(this.selectedItems=[...this.selectedItems,r]),this.searchQuery="",this.searchResults=[],this.showResults=!1;const e=this.selectedItems.map((r=>r.id));this.mrdChange.emit({name:this.name,value:e})}else this.selectedItems=[r],this.searchQuery=r.label,this.showResults=!1,this.mrdChange.emit({name:this.name,value:r.id});this.error=this.required&&!a(this.selectedItems)?d("required",this.locale):""},this.handleRemoveSelected=r=>{this.selectedItems=this.selectedItems.filter((e=>e.id!==r));const e=this.selectedItems.map((r=>r.id));this.mrdChange.emit({name:this.name,value:this.multiple?e:null})},this.handleDropdownChange=r=>{const e=r.target.value;this.error=this.required&&!a(e)?d("required",this.locale):"",this.mrdChange.emit({name:this.name,value:e})},this.handleBlur=()=>{var r,e;setTimeout((()=>{this.showResults=!1,this.highlightedIndex=-1}),200);const i=this.multiple?this.selectedItems.map((r=>r.id)):null!==(e=null===(r=this.selectedItems[0])||void 0===r?void 0:r.id)&&void 0!==e?e:null;this.mrdBlur.emit({name:this.name,value:i})}}async setSearchResults(r){this.searchResults=r,this.isLoading=!1,this.showResults=!0,this.highlightedIndex=-1}async setLoading(r){this.isLoading=r}render(){var r,e;const i=!!this.error;if(this.displayType===s.DROPDOWN){const l=Array.isArray(this.value)?null!==(r=this.value[0])&&void 0!==r?r:"":null!==(e=this.value)&&void 0!==e?e:"";return t(o,null,t("div",{class:"mrd-relation-field"},this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label),t("select",{class:"mrd-relation-field__select"+(i?" mrd-relation-field__select--error":""),name:this.name,required:this.required,disabled:this.disabled,onChange:this.handleDropdownChange},t("option",{value:""},d("select_placeholder",this.locale)),this.dropdownValues.map((r=>t("option",{key:r.value,value:r.value,selected:r.value===l},r.label)))),i&&t("span",{class:"mrd-relation-field__error"},this.error)))}const l=this.label&&t("label",{class:"mrd-relation-field__label"+(this.required?" mrd-relation-field__label--required":"")},this.label);return t(o,null,!this.multiple&&this.selectedItems.length>0?t("div",{class:"mrd-relation-field"},l,t("div",{class:"mrd-relation-field__selected-value"+(i?" mrd-relation-field__selected-value--error":"")},t("span",{class:"mrd-relation-field__selected-name"},this.selectedItems[0].label),t("button",{type:"button",class:"mrd-relation-field__selected-clear",onClick:this.clearSelection,"aria-label":d("remove",this.locale)},"✕")),i&&t("span",{class:"mrd-relation-field__error"},this.error)):t("div",{class:"mrd-relation-field"},l,this.multiple&&this.selectedItems.length>0&&t("div",{class:"mrd-relation-field__tags"},this.selectedItems.map((r=>t("span",{key:r.id,class:"mrd-relation-field__tag"},r.label,t("button",{type:"button",class:"mrd-relation-field__tag-remove",onClick:()=>this.handleRemoveSelected(r.id),"aria-label":d("remove",this.locale)},"✕"))))),t("div",{class:"mrd-relation-field__search-wrapper"},t("input",{class:"mrd-relation-field__search"+(i?" mrd-relation-field__search--error":""),type:"text",value:this.searchQuery,placeholder:d("search_placeholder",this.locale),disabled:this.disabled,onInput:this.handleSearchInput,onKeyDown:this.handleKeyDown,onBlur:this.handleBlur}),this.isLoading&&t("span",{class:"mrd-relation-field__spinner","aria-label":d("loading",this.locale)})),this.showResults&&t("div",{class:"mrd-relation-field__results"},0!==this.searchResults.length||this.isLoading?this.searchResults.map(((r,e)=>t("div",{key:r.id,class:"mrd-relation-field__result-item"+(e===this.highlightedIndex?" mrd-relation-field__result-item--highlighted":""),onMouseDown:()=>this.handleResultSelect(r)},t("span",{class:"mrd-relation-field__result-label"},r.label),r.description&&t("span",{class:"mrd-relation-field__result-desc"},r.description)))):t("div",{class:"mrd-relation-field__no-results"},d("no_results",this.locale))),i&&t("span",{class:"mrd-relation-field__error"},this.error)))}static get style(){return".sc-mrd-relation-field-h{display:block}.mrd-relation-field.sc-mrd-relation-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%;position:relative}.mrd-relation-field__label.sc-mrd-relation-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-relation-field__label--required.sc-mrd-relation-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-relation-field__select.sc-mrd-relation-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);padding-right:calc(var(--mrd-input-padding-x) + 1.5rem);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right var(--mrd-space-3) center;border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;cursor:pointer;box-sizing:border-box}.mrd-relation-field__select.sc-mrd-relation-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-relation-field__select.sc-mrd-relation-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-relation-field__select--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error)}.mrd-relation-field__select--error.sc-mrd-relation-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-relation-field__tags.sc-mrd-relation-field{display:flex;flex-wrap:wrap;gap:var(--mrd-space-1);margin-bottom:var(--mrd-space-1)}.mrd-relation-field__tag.sc-mrd-relation-field{display:inline-flex;align-items:center;gap:var(--mrd-space-1);padding:var(--mrd-space-1) var(--mrd-space-2);background-color:var(--mrd-color-primary-light);color:var(--mrd-color-primary-dark);border-radius:var(--mrd-border-radius-full);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);font-weight:var(--mrd-font-weight-medium)}.mrd-relation-field__tag-remove.sc-mrd-relation-field{background:none;border:none;cursor:pointer;color:var(--mrd-color-primary-dark);font-size:var(--mrd-font-size-xs);padding:0;line-height:1;opacity:0.7}.mrd-relation-field__tag-remove.sc-mrd-relation-field:hover{opacity:1}.mrd-relation-field__search-wrapper.sc-mrd-relation-field{position:relative;display:flex;align-items:center}.mrd-relation-field__search.sc-mrd-relation-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);outline:none;appearance:none;box-sizing:border-box}.mrd-relation-field__search.sc-mrd-relation-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-relation-field__search.sc-mrd-relation-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-relation-field__search.sc-mrd-relation-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-relation-field__search--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error)}.mrd-relation-field__search--error.sc-mrd-relation-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-relation-field__spinner.sc-mrd-relation-field{position:absolute;right:var(--mrd-space-3);width:16px;height:16px;border:2px solid var(--mrd-color-neutral-200);border-top-color:var(--mrd-color-primary);border-radius:50%;animation:mrd-spin 0.7s linear infinite}@keyframes mrd-spin{to{transform:rotate(360deg)}}.mrd-relation-field__results.sc-mrd-relation-field{position:absolute;top:calc(100% + var(--mrd-space-1));left:0;right:0;background-color:var(--mrd-color-white);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);box-shadow:var(--mrd-shadow-md);z-index:var(--mrd-z-dropdown);max-height:240px;overflow-y:auto}.mrd-relation-field__result-item.sc-mrd-relation-field{display:flex;flex-direction:column;padding:var(--mrd-space-2) var(--mrd-space-3);cursor:pointer;transition:background-color var(--mrd-transition-fast)}.mrd-relation-field__result-item.sc-mrd-relation-field:hover{background-color:var(--mrd-color-neutral-50)}.mrd-relation-field__result-item.sc-mrd-relation-field:not(:last-child){border-bottom:var(--mrd-border-width) solid var(--mrd-color-neutral-100)}.mrd-relation-field__result-label.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-color-neutral-800);font-weight:var(--mrd-font-weight-medium)}.mrd-relation-field__result-desc.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-xs);color:var(--mrd-color-neutral-500);margin-top:var(--mrd-space-1)}.mrd-relation-field__result-item--highlighted.sc-mrd-relation-field{background-color:var(--mrd-color-primary-light)}.mrd-relation-field__selected-value.sc-mrd-relation-field{display:flex;align-items:center;gap:var(--mrd-space-2);height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);background-color:var(--mrd-color-primary-light);border:var(--mrd-border-width) solid var(--mrd-color-primary);border-radius:var(--mrd-border-radius);box-sizing:border-box}.mrd-relation-field__selected-value--error.sc-mrd-relation-field{border-color:var(--mrd-border-color-error);background-color:var(--mrd-color-danger-light)}.mrd-relation-field__selected-name.sc-mrd-relation-field{flex:1;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);font-weight:var(--mrd-font-weight-medium);color:var(--mrd-color-primary-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mrd-relation-field__selected-clear.sc-mrd-relation-field{flex-shrink:0;background:none;border:none;cursor:pointer;color:var(--mrd-color-primary-dark);font-size:var(--mrd-font-size-sm);padding:0;line-height:1;opacity:0.6;transition:opacity var(--mrd-transition-fast)}.mrd-relation-field__selected-clear.sc-mrd-relation-field:hover{opacity:1}.mrd-relation-field__no-results.sc-mrd-relation-field{padding:var(--mrd-space-4);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-500);text-align:center}.mrd-relation-field__error.sc-mrd-relation-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-relation-field",{name:[1],label:[1],required:[4],disabled:[4],locale:[1],relatedClass:[1,"related-class"],displayType:[1,"display-type"],multiple:[4],dropdownValues:[16],value:[1],searchQuery:[32],searchResults:[32],isLoading:[32],selectedItems:[32],showResults:[32],error:[32],highlightedIndex:[32],setSearchResults:[64],setLoading:[64]}]);function m(){"undefined"!=typeof customElements&&["mrd-relation-field"].forEach((r=>{"mrd-relation-field"===r&&(customElements.get(l(r))||customElements.define(l(r),n))}))}export{n as M,m as d}

package/dist/components/mrd-table.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdTable extends Components.MrdTable, HTMLElement {}
+export const MrdTable: {
+    prototype: MrdTable;
+    new (): MrdTable;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-table.js

@@ -0,0 +1 @@
+import{proxyCustomElement as t,HTMLElement as r,createEvent as e,h as s,Host as a,transformTag as l}from"@stencil/core/internal/client";import{a as i,b as o,c as d,d as n,f as c,e as h}from"./format.js";class m{static render(t,r,e){var s,a;if("RELATION"===t.type){const e=null===(s=null==r?void 0:r._links)||void 0===s?void 0:s[t.name];return e?Array.isArray(e)?e.map((t=>{var r;return null!==(r=t.name)&&void 0!==r?r:""})).filter(Boolean).join(", "):null!==(a=e.name)&&void 0!==a?a:"":""}const l=null==r?void 0:r[t.name];return null==l||""===l?"":(Array.isArray(l)?l:[l]).map((r=>{var s;return m.renderValue(null!==(s=t.dataType)&&void 0!==s?s:"TEXT",r,t,e)})).filter((t=>""!==t)).join(", ")}static renderValue(t,r,e,s){var a,l;switch(t){case"INTEGER":return c(Number(r),s,{maximumFractionDigits:0});case"DECIMAL":return c(Number(r),s);case"PERCENTAGE":return h(Number(r),s);case"CURRENCY":{const{amount:t,currency:e}="object"==typeof r&&null!==r?r:{amount:r,currency:""};return e?n(Number(t),e,s):c(Number(t),s)}case"DATE":return d(r,s);case"DATETIME":return o(r,s);case"TIME":return i(r,s);case"BOOLEAN":return r?"✓":"";case"LIST":{const t=null===(a=e.listItems)||void 0===a?void 0:a.find((t=>t.key===r+""));return null!==(l=null==t?void 0:t.label)&&void 0!==l?l:r+""}case"TEXTBLOCK":return(r+"").replace(/<[^>]*>/g,"").trim();default:return r+""}}}const b=t(class extends r{constructor(t){super(),!1!==t&&this.__registerHost(),this.mrdLoadPage=e(this,"mrdLoadPage",7),this.pendingPages=new Set,this.debounceTimer=null,this.columns=[],this.rows=[],this.locale=navigator.language,this.totalElements=0,this.pageSize=20,this.rowHeight=36,this.tableHeight=500,this.defaultSort="",this.loadedPages=new Map,this.requestedPages=new Set,this.renderStart=0,this.renderEnd=0,this.colWidths=[],this.sortField="",this.sortDir="asc",this.handleScroll=t=>{const r=this.totalElements,e=Math.floor(t.currentTarget.scrollTop/this.rowHeight),s=Math.min(e+this.visibleCount(),r-1);this.renderStart=Math.max(0,e-10),this.renderEnd=Math.min(r-1,s+10),this.requestPagesForWindow(this.renderStart,this.renderEnd)}}async init(){var t;if(null!==this.debounceTimer&&(clearTimeout(this.debounceTimer),this.debounceTimer=null),this.pendingPages.clear(),this.loadedPages=new Map,this.requestedPages=new Set,this.colWidths=[],this.defaultSort){const r=this.defaultSort.split(",");this.sortField=r[0].trim(),this.sortDir="desc"===(null===(t=r[1])||void 0===t?void 0:t.trim())?"desc":"asc"}else this.sortField="",this.sortDir="asc";this.renderStart=0,this.renderEnd=Math.max(0,Math.min(this.visibleCount()+10,this.totalElements-1));const r=this.el.querySelector(".mrd-table__scroll");r&&(r.scrollTop=0)}async setPage(t,r){const e=new Map(this.loadedPages);e.set(t,r),this.loadedPages=e}visibleCount(){return Math.ceil(this.tableHeight/this.rowHeight)}sortParam(){return this.sortField?"desc"===this.sortDir?this.sortField+",desc":this.sortField:""}handleSortClick(t){this.sortField===t.name?this.sortDir="asc"===this.sortDir?"desc":"asc":(this.sortField=t.name,this.sortDir="asc"),null!==this.debounceTimer&&(clearTimeout(this.debounceTimer),this.debounceTimer=null),this.pendingPages.clear(),this.loadedPages=new Map,this.requestedPages=new Set,this.colWidths=[],this.renderStart=0,this.renderEnd=Math.max(0,Math.min(this.visibleCount()+10,this.totalElements-1));const r=this.el.querySelector(".mrd-table__scroll");r&&(r.scrollTop=0),this.emitPagesForWindow(this.renderStart,this.renderEnd)}emitPagesForWindow(t,r){const e=Math.floor(t/this.pageSize),s=Math.floor(r/this.pageSize),a=new Set(this.requestedPages);let l=!1;for(let t=e;t<=s;t++)this.loadedPages.has(t)||a.has(t)||(a.add(t),this.mrdLoadPage.emit({page:t,sort:this.sortParam()}),l=!0);l&&(this.requestedPages=a)}getRow(t){var r;const e=this.loadedPages.get(Math.floor(t/this.pageSize));return null!==(r=null==e?void 0:e[t%this.pageSize])&&void 0!==r?r:null}requestPagesForWindow(t,r){const e=Math.floor(t/this.pageSize),s=Math.floor(r/this.pageSize);let a=!1;for(let t=e;t<=s;t++)this.loadedPages.has(t)||this.requestedPages.has(t)||this.pendingPages.has(t)||(this.pendingPages.add(t),a=!0);a&&(null!==this.debounceTimer&&clearTimeout(this.debounceTimer),this.debounceTimer=setTimeout((()=>this.flushPendingPages()),150))}flushPendingPages(){if(this.debounceTimer=null,0===this.pendingPages.size)return;const t=new Set(this.requestedPages);let r=!1;for(const e of this.pendingPages){if(this.loadedPages.has(e)||t.has(e))continue;const s=e*this.pageSize;s+this.pageSize-1<this.renderStart||s>this.renderEnd||(t.add(e),this.mrdLoadPage.emit({page:e,sort:this.sortParam()}),r=!0)}this.pendingPages.clear(),r&&(this.requestedPages=t)}componentDidRender(){if(0===this.colWidths.length&&this.loadedPages.size>0&&this.totalElements>0){const t=this.el.querySelectorAll(".mrd-table__header");t.length>0&&(this.colWidths=Array.from(t).map((t=>t.offsetWidth)))}}render(){var t,r;if(!(null===(t=this.columns)||void 0===t?void 0:t.length))return null;const e=new Set(["INTEGER","DECIMAL","PERCENTAGE","CURRENCY"]);if(0===this.totalElements)return s(a,null,s("div",{class:"mrd-table"},s("table",{class:"mrd-table__table"},s("thead",null,s("tr",null,this.columns.map((t=>s("th",{class:"mrd-table__header"},t.label))))),s("tbody",null,null===(r=this.rows)||void 0===r?void 0:r.map(((t,r)=>s("tr",{class:"mrd-table__row",style:{background:r%2==0?"":"var(--mrd-color-neutral-100)"}},this.columns.map((r=>{var a;const l=m.render(r,t,this.locale),i="FIELD"===r.type&&e.has(null!==(a=r.dataType)&&void 0!==a?a:"");return s("td",{class:"mrd-table__cell"+(i?" mrd-table__cell--numeric":"")},l)}))))))),(!this.rows||0===this.rows.length)&&s("p",{class:"mrd-table__empty"},"Geen resultaten gevonden.")));const l=this.totalElements,i=this.columns.length,o=this.renderStart*this.rowHeight,d=Math.max(0,(l-1-this.renderEnd)*this.rowHeight),n=[];for(let t=this.renderStart;t<=this.renderEnd;t++){const r=this.getRow(t);n.push(null===r?s("tr",{class:"mrd-table__row mrd-table__row--loading"},s("td",{class:"mrd-table__cell--placeholder",colSpan:i},s("span",{class:"mrd-table__placeholder-bar"}))):s("tr",{class:"mrd-table__row",style:{background:t%2==0?"":"var(--mrd-color-neutral-100)"}},this.columns.map((t=>{var a;const l=m.render(t,r,this.locale),i="FIELD"===t.type&&e.has(null!==(a=t.dataType)&&void 0!==a?a:"");return s("td",{class:"mrd-table__cell"+(i?" mrd-table__cell--numeric":"")},l)}))))}return s(a,null,s("div",{class:"mrd-table__scroll",style:{height:this.tableHeight+"px"},onScroll:this.handleScroll},s("table",{class:"mrd-table__table",style:this.colWidths.length>0?{tableLayout:"fixed"}:void 0},s("thead",null,s("tr",null,this.columns.map(((t,r)=>{const e=this.sortField===t.name;return s("th",{class:"mrd-table__header mrd-table__header--sortable"+(e?" mrd-table__header--sorted-"+this.sortDir:""),style:this.colWidths[r]?{width:this.colWidths[r]+"px"}:void 0,onClick:()=>this.handleSortClick(t)},s("span",{class:"mrd-table__header-label"},t.label),s("span",{class:"mrd-table__sort-icon","aria-hidden":"true"},e?"asc"===this.sortDir?"▲":"▼":"⇅"))})))),s("tbody",null,o>0&&s("tr",{class:"mrd-table__spacer",style:{height:o+"px"}},s("td",{colSpan:i})),n,d>0&&s("tr",{class:"mrd-table__spacer",style:{height:d+"px"}},s("td",{colSpan:i}))))),0===l&&s("p",{class:"mrd-table__empty"},"Geen resultaten gevonden."))}get el(){return this}static get style(){return".sc-mrd-table-h{display:block;width:100%}.mrd-table__scroll.sc-mrd-table{overflow-y:auto;overflow-x:auto;border:1px solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);overflow-anchor:none}.mrd-table.sc-mrd-table{overflow-x:auto}.mrd-table__table.sc-mrd-table{width:auto;min-width:100%;border-collapse:collapse;font-size:var(--mrd-font-size-sm);color:var(--mrd-color-neutral-900)}.mrd-table__scroll.sc-mrd-table .mrd-table__table.sc-mrd-table{min-width:max-content}.mrd-table__header.sc-mrd-table{position:sticky;top:0;z-index:1;background:var(--mrd-color-white);text-align:left;padding:var(--mrd-space-2) var(--mrd-space-4);border-bottom:2px solid var(--mrd-border-color);color:var(--mrd-color-neutral-600);font-weight:var(--mrd-font-weight-medium);white-space:nowrap;font-size:var(--mrd-font-size-xs);text-transform:uppercase;letter-spacing:0.04em}.mrd-table__header--sortable.sc-mrd-table{cursor:pointer;user-select:none}.mrd-table__header--sortable.sc-mrd-table:hover{background:var(--mrd-color-neutral-50);color:var(--mrd-color-neutral-800)}.mrd-table__header--sorted-asc.sc-mrd-table,.mrd-table__header--sorted-desc.sc-mrd-table{color:var(--mrd-color-primary);border-bottom-color:var(--mrd-color-primary)}.mrd-table__header-label.sc-mrd-table{margin-right:var(--mrd-space-1)}.mrd-table__sort-icon.sc-mrd-table{font-size:0.65rem;opacity:0.4;vertical-align:middle}.mrd-table__header--sorted-asc.sc-mrd-table .mrd-table__sort-icon.sc-mrd-table,.mrd-table__header--sorted-desc.sc-mrd-table .mrd-table__sort-icon.sc-mrd-table{opacity:1;color:var(--mrd-color-primary)}.mrd-table__row.sc-mrd-table{border-bottom:1px solid var(--mrd-border-color)}.mrd-table__row.sc-mrd-table:hover{background:var(--mrd-color-neutral-200) !important}.mrd-table__spacer.sc-mrd-table{border:none}.mrd-table__spacer.sc-mrd-table td.sc-mrd-table{padding:0;border:none}.mrd-table__cell.sc-mrd-table{padding:var(--mrd-space-2) var(--mrd-space-4);vertical-align:top;white-space:nowrap}.mrd-table__cell--numeric.sc-mrd-table{text-align:right;font-variant-numeric:tabular-nums}.mrd-table__row--loading.sc-mrd-table{background:transparent}.mrd-table__cell--placeholder.sc-mrd-table{padding:var(--mrd-space-2) var(--mrd-space-4);border-bottom:1px solid var(--mrd-border-color)}.mrd-table__placeholder-bar.sc-mrd-table{display:block;height:0.75rem;width:55%;border-radius:var(--mrd-border-radius-sm);background:linear-gradient(     90deg,     var(--mrd-color-neutral-200) 25%,     var(--mrd-color-neutral-100) 50%,     var(--mrd-color-neutral-200) 75%   );background-size:200% 100%;animation:mrd-shimmer 1.4s ease infinite}@keyframes mrd-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.mrd-table__empty.sc-mrd-table{padding:var(--mrd-space-4) var(--mrd-space-3);color:var(--mrd-color-neutral-500);font-size:var(--mrd-font-size-sm);text-align:center;margin:0}"}},[2,"mrd-table",{columns:[16],rows:[16],locale:[1],totalElements:[2,"total-elements"],pageSize:[2,"page-size"],rowHeight:[2,"row-height"],tableHeight:[2,"table-height"],defaultSort:[1,"default-sort"],loadedPages:[32],requestedPages:[32],renderStart:[32],renderEnd:[32],colWidths:[32],sortField:[32],sortDir:[32],init:[64],setPage:[64]}]),u=b,_=function(){"undefined"!=typeof customElements&&["mrd-table"].forEach((t=>{"mrd-table"===t&&(customElements.get(l(t))||customElements.define(l(t),b))}))};export{u as MrdTable,_ as defineCustomElement}

package/dist/components/mrd-text-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdTextField extends Components.MrdTextField, HTMLElement {}
+export const MrdTextField: {
+    prototype: MrdTextField;
+    new (): MrdTextField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-text-field.js

@@ -0,0 +1 @@
+import{M as t,d as o}from"./mrd-text-field2.js";const r=t,s=o;export{r as MrdTextField,s as defineCustomElement}

package/dist/components/mrd-text-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as t,h as d,Host as i,transformTag as o}from"@stencil/core/internal/client";import{t as l}from"./i18n.js";import{v as a}from"./validation.js";const s=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=t(this,"mrdChange",7),this.mrdBlur=t(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.handleInput=r=>{this.mrdChange.emit({name:this.name,value:r.target.value})},this.handleBlur=r=>{const e=r.target.value;this.error=this.required&&!a(e)?l("required",this.locale):"",this.mrdBlur.emit({name:this.name,value:e})}}render(){const r=!!this.error;return d(i,{key:"4ddbcb2f8915235631c6f66449b28e664c24c0a4"},d("div",{key:"91dbb52ed715c92d4ef2bc0924fd378d0dc839a8",class:"mrd-text-field"},this.label&&d("label",{key:"cf3278503107d313c08034273916a4b84a16febd",class:"mrd-text-field__label"+(this.required?" mrd-text-field__label--required":"")},this.label),d("input",{key:"9ab992213bfaa372e453331e1b1e12a853c3ae6e",class:"mrd-text-field__input"+(r?" mrd-text-field__input--error":""),type:"text",name:this.name,value:this.value,placeholder:this.placeholder,required:this.required,disabled:this.disabled,onInput:this.handleInput,onBlur:this.handleBlur}),r&&d("span",{key:"a4ff2fdd2490f644eb97f66f15edc5af0b22e823",class:"mrd-text-field__error"},this.error)))}static get style(){return".sc-mrd-text-field-h{display:block}.mrd-text-field.sc-mrd-text-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-text-field__label.sc-mrd-text-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-text-field__label--required.sc-mrd-text-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-text-field__input.sc-mrd-text-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box}.mrd-text-field__input.sc-mrd-text-field::placeholder{color:var(--mrd-input-placeholder-color)}.mrd-text-field__input.sc-mrd-text-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-text-field__input.sc-mrd-text-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-text-field__input--error.sc-mrd-text-field{border-color:var(--mrd-border-color-error)}.mrd-text-field__input--error.sc-mrd-text-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-text-field__error.sc-mrd-text-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-text-field",{name:[1],label:[1],value:[1],placeholder:[1],required:[4],disabled:[4],locale:[1],error:[32]}]);function n(){"undefined"!=typeof customElements&&["mrd-text-field"].forEach((r=>{"mrd-text-field"===r&&(customElements.get(o(r))||customElements.define(o(r),s))}))}export{s as M,n as d}

package/dist/components/mrd-textarea-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdTextareaField extends Components.MrdTextareaField, HTMLElement {}
+export const MrdTextareaField: {
+    prototype: MrdTextareaField;
+    new (): MrdTextareaField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-textarea-field.js

@@ -0,0 +1 @@
+import{M as r,d as t}from"./mrd-textarea-field2.js";const a=r,e=t;export{a as MrdTextareaField,e as defineCustomElement}

package/dist/components/mrd-textarea-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as r,createEvent as t,h as a,Host as d,transformTag as i}from"@stencil/core/internal/client";import{t as o}from"./i18n.js";import{v as l}from"./validation.js";const s=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.mrdChange=t(this,"mrdChange",7),this.mrdBlur=t(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.placeholder="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.editorReady=!1}componentDidLoad(){this.initQuill()}async initQuill(){try{const e=(await import("./quill.js")).default;if(this.editorEl=this.el.querySelector(".mrd-textarea-field__editor"),!this.editorEl)return;const r=new e(this.editorEl,{theme:"snow",placeholder:this.placeholder,readOnly:this.disabled,modules:{toolbar:[["bold","italic","underline","strike"],[{list:"ordered"},{list:"bullet"}],[{header:[1,2,3,!1]}],["link"],["clean"]]}});this.value&&r.clipboard.dangerouslyPasteHTML(this.value),r.on("text-change",(()=>{var e,r;const t=null!==(r=null===(e=this.editorEl.querySelector(".ql-editor"))||void 0===e?void 0:e.innerHTML)&&void 0!==r?r:"";this.mrdChange.emit({name:this.name,value:t})})),r.on("selection-change",(e=>{var r,t;if(!e){const e=null!==(t=null===(r=this.editorEl.querySelector(".ql-editor"))||void 0===r?void 0:r.innerHTML)&&void 0!==t?t:"";this.error=this.required&&!l(e)?o("required",this.locale):"",this.mrdBlur.emit({name:this.name,value:e})}})),this.editorReady=!0}catch(e){console.error("Failed to load Quill editor:",e)}}render(){return a(d,{key:"8f7544745341ea2eca4450296db53ed8b41af0e2"},a("div",{key:"62937448dd685071e0500b8f7f53fe22b10ffa15",class:"mrd-textarea-field"},this.label&&a("label",{key:"4a7d807d78c2a9abeaf3ff94ee5e71b167475e25",class:"mrd-textarea-field__label"+(this.required?" mrd-textarea-field__label--required":"")},this.label),a("div",{key:"599e28a45b1c161d7cfec3de138e386bf997f9b9",class:"mrd-textarea-field__container"+(this.error?" mrd-textarea-field__container--error":"")},a("div",{key:"5824a225fa6ea29bf02dfd8e4b27a71e853f059e",class:"mrd-textarea-field__editor"})),this.error&&a("span",{key:"1c7693269df8f3fe112a6df419e6cbace75bdaa9",class:"mrd-textarea-field__error"},this.error)))}get el(){return this}static get style(){return".sc-mrd-textarea-field-h{display:block}.mrd-textarea-field.sc-mrd-textarea-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-textarea-field__label.sc-mrd-textarea-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-textarea-field__label--required.sc-mrd-textarea-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-textarea-field__container.sc-mrd-textarea-field{border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);overflow:hidden;background-color:var(--mrd-input-bg);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition)}.mrd-textarea-field__container.sc-mrd-textarea-field:focus-within{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-textarea-field__container--error.sc-mrd-textarea-field{border-color:var(--mrd-border-color-error)}.mrd-textarea-field__container--error.sc-mrd-textarea-field:focus-within{box-shadow:var(--mrd-shadow-focus-error)}.mrd-textarea-field__editor.sc-mrd-textarea-field{min-height:150px;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base)}.mrd-textarea-field__editor.sc-mrd-textarea-field .ql-toolbar.sc-mrd-textarea-field{border:none;border-bottom:var(--mrd-border-width) solid var(--mrd-border-color);font-family:var(--mrd-font-family)}.mrd-textarea-field__editor.sc-mrd-textarea-field .ql-container.sc-mrd-textarea-field{border:none;font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base)}.mrd-textarea-field__editor.sc-mrd-textarea-field .ql-editor.sc-mrd-textarea-field{min-height:120px;padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x)}.mrd-textarea-field__editor.sc-mrd-textarea-field .ql-editor.ql-blank.sc-mrd-textarea-field::before{color:var(--mrd-input-placeholder-color);font-style:normal}.mrd-textarea-field__error.sc-mrd-textarea-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-textarea-field",{name:[1],label:[1],value:[1],placeholder:[1],required:[4],disabled:[4],locale:[1],error:[32],editorReady:[32]}]);function n(){"undefined"!=typeof customElements&&["mrd-textarea-field"].forEach((e=>{"mrd-textarea-field"===e&&(customElements.get(i(e))||customElements.define(i(e),s))}))}export{s as M,n as d}

package/dist/components/mrd-time-field.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface MrdTimeField extends Components.MrdTimeField, HTMLElement {}
+export const MrdTimeField: {
+    prototype: MrdTimeField;
+    new (): MrdTimeField;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/mrd-time-field.js

@@ -0,0 +1 @@
+import{M as m,d as o}from"./mrd-time-field2.js";const r=m,s=o;export{r as MrdTimeField,s as defineCustomElement}

package/dist/components/mrd-time-field2.js

@@ -0,0 +1 @@
+import{proxyCustomElement as r,HTMLElement as e,createEvent as i,h as d,Host as t,transformTag as o}from"@stencil/core/internal/client";import{t as a}from"./i18n.js";import{v as m}from"./validation.js";const s=r(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.mrdChange=i(this,"mrdChange",7),this.mrdBlur=i(this,"mrdBlur",7),this.name="",this.label="",this.value="",this.required=!1,this.disabled=!1,this.locale=navigator.language,this.error="",this.handleChange=r=>{const e=r.target.value;this.error=this.required&&!m(e)?a("required",this.locale):"",this.mrdChange.emit({name:this.name,value:e})},this.handleBlur=r=>{this.mrdBlur.emit({name:this.name,value:r.target.value})}}render(){const r=!!this.error;return d(t,{key:"0a6e3047eb409b50a7dfa46c724e0d9824bdbad9"},d("div",{key:"1fdcaa9cc0e44edd514d3453df0cfb264989cbca",class:"mrd-time-field"},this.label&&d("label",{key:"ae53864761258ae56e29474c2da68c852fe8db57",class:"mrd-time-field__label"+(this.required?" mrd-time-field__label--required":"")},this.label),d("input",{key:"60336f497545b61656756790cfb5ec096034ecf7",class:"mrd-time-field__input"+(r?" mrd-time-field__input--error":""),type:"time",name:this.name,value:this.value,required:this.required,disabled:this.disabled,onChange:this.handleChange,onBlur:this.handleBlur}),r&&d("span",{key:"f8409b690c67873f6e4fe10f1d404b57005f0557",class:"mrd-time-field__error"},this.error)))}static get style(){return".sc-mrd-time-field-h{display:block}.mrd-time-field.sc-mrd-time-field{display:flex;flex-direction:column;gap:var(--mrd-space-1);width:100%}.mrd-time-field__label.sc-mrd-time-field{display:block;font-family:var(--mrd-font-family);font-size:var(--mrd-label-font-size);font-weight:var(--mrd-label-font-weight);color:var(--mrd-label-color)}.mrd-time-field__label--required.sc-mrd-time-field::after{content:' *';color:var(--mrd-color-danger)}.mrd-time-field__input.sc-mrd-time-field{display:block;width:100%;height:var(--mrd-input-height);padding:var(--mrd-input-padding-y) var(--mrd-input-padding-x);font-family:var(--mrd-font-family);font-size:var(--mrd-font-size-base);color:var(--mrd-input-color);background-color:var(--mrd-input-bg);border:var(--mrd-border-width) solid var(--mrd-border-color);border-radius:var(--mrd-border-radius);transition:border-color var(--mrd-transition), box-shadow var(--mrd-transition);outline:none;appearance:none;box-sizing:border-box;cursor:pointer}.mrd-time-field__input.sc-mrd-time-field:focus{border-color:var(--mrd-border-color-focus);box-shadow:var(--mrd-shadow-focus)}.mrd-time-field__input.sc-mrd-time-field:disabled{background-color:var(--mrd-input-bg-disabled);cursor:not-allowed;opacity:0.7}.mrd-time-field__input--error.sc-mrd-time-field{border-color:var(--mrd-border-color-error)}.mrd-time-field__input--error.sc-mrd-time-field:focus{box-shadow:var(--mrd-shadow-focus-error)}.mrd-time-field__error.sc-mrd-time-field{font-family:var(--mrd-font-family);font-size:var(--mrd-error-font-size);color:var(--mrd-error-color)}"}},[2,"mrd-time-field",{name:[1],label:[1],value:[1],required:[4],disabled:[4],locale:[1],error:[32]}]);function l(){"undefined"!=typeof customElements&&["mrd-time-field"].forEach((r=>{"mrd-time-field"===r&&(customElements.get(o(r))||customElements.define(o(r),s))}))}export{s as M,l as d}