@randstad-uca/design-system 1.0.62 → 1.0.63
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/icons/arrow_next.svg +3 -0
- package/dist/assets/icons/arrow_prev.svg +3 -0
- package/dist/components/Carousel.d.ts +63 -10
- package/dist/components/CarouselCards.d.ts +2 -0
- package/dist/components/Icon.d.ts +2 -2
- package/dist/index.js +570 -307
- package/dist/index.js.map +1 -1
- package/dist/package.json +1 -1
- package/dist/stories/Carousel.stories.d.ts +6 -2
- package/dist/stories/CarouselCards.stories.d.ts +1 -0
- package/dist/stories/Upload.stories.d.ts +16 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import{LitElement as
|
|
1
|
+
import{LitElement as t,html as e,nothing as i,css as o,isServer as r}from"lit";import{classMap as s}from"lit/directives/class-map.js";function a(t,e,i,o){var r,s=arguments.length,a=s<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,o);else for(var n=t.length-1;n>=0;n--)(r=t[n])&&(a=(s<3?r(a):s>3?r(e,i,a):r(e,i))||a);return s>3&&a&&Object.defineProperty(e,i,a),a}function n(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}"function"==typeof SuppressedError&&SuppressedError;
|
|
2
2
|
/**
|
|
3
3
|
* @license
|
|
4
4
|
* Copyright 2017 Google LLC
|
|
5
5
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
6
6
|
*/
|
|
7
|
-
const
|
|
7
|
+
const l=t=>(e,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(t,e)})):customElements.define(t,e)},d=globalThis,c=d.ShadowRoot&&(void 0===d.ShadyCSS||d.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,h=Symbol(),p=new WeakMap;
|
|
8
8
|
/**
|
|
9
9
|
* @license
|
|
10
10
|
* Copyright 2019 Google LLC
|
|
11
11
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
12
|
-
*/let u=class{constructor(e,
|
|
12
|
+
*/let u=class{constructor(t,e,i){if(this._$cssResult$=!0,i!==h)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(c&&void 0===t){const i=void 0!==e&&1===e.length;i&&(t=p.get(e)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),i&&p.set(e,t))}return t}toString(){return this.cssText}};const g=(t,e)=>{if(c)t.adoptedStyleSheets=e.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const i of e){const e=document.createElement("style"),o=d.litNonce;void 0!==o&&e.setAttribute("nonce",o),e.textContent=i.cssText,t.appendChild(e)}},m=c?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const i of t.cssRules)e+=i.cssText;return(t=>new u("string"==typeof t?t:t+"",void 0,h))(e)})(t):t,{is:b,defineProperty:y,getOwnPropertyDescriptor:v,getOwnPropertyNames:f,getOwnPropertySymbols:x,getPrototypeOf:w}=Object,k=globalThis,$=k.trustedTypes,S=$?$.emptyScript:"",C=k.reactiveElementPolyfillSupport,D=(t,e)=>t,E={toAttribute(t,e){switch(e){case Boolean:t=t?S:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},M=(t,e)=>!b(t,e),O={attribute:!0,type:String,converter:E,reflect:!1,useDefault:!1,hasChanged:M};
|
|
13
13
|
/**
|
|
14
14
|
* @license
|
|
15
15
|
* Copyright 2017 Google LLC
|
|
16
16
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
17
|
-
*/Symbol.metadata??=Symbol("metadata"),k.litPropertyMetadata??=new WeakMap;class F extends HTMLElement{static addInitializer(
|
|
17
|
+
*/Symbol.metadata??=Symbol("metadata"),k.litPropertyMetadata??=new WeakMap;class F extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=O){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const i=Symbol(),o=this.getPropertyDescriptor(t,i,e);void 0!==o&&y(this.prototype,t,o)}}static getPropertyDescriptor(t,e,i){const{get:o,set:r}=v(this.prototype,t)??{get(){return this[e]},set(t){this[e]=t}};return{get:o,set(e){const s=o?.call(this);r?.call(this,e),this.requestUpdate(t,s,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??O}static _$Ei(){if(this.hasOwnProperty(D("elementProperties")))return;const t=w(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(D("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(D("properties"))){const t=this.properties,e=[...f(t),...x(t)];for(const i of e)this.createProperty(i,t[i])}const t=this[Symbol.metadata];if(null!==t){const e=litPropertyMetadata.get(t);if(void 0!==e)for(const[t,i]of e)this.elementProperties.set(t,i)}this._$Eh=new Map;for(const[t,e]of this.elementProperties){const i=this._$Eu(t,e);void 0!==i&&this._$Eh.set(i,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const i=new Set(t.flat(1/0).reverse());for(const t of i)e.unshift(m(t))}else void 0!==t&&e.push(m(t));return e}static _$Eu(t,e){const i=e.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const i of e.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return g(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,e,i){this._$AK(t,i)}_$ET(t,e){const i=this.constructor.elementProperties.get(t),o=this.constructor._$Eu(t,i);if(void 0!==o&&!0===i.reflect){const r=(void 0!==i.converter?.toAttribute?i.converter:E).toAttribute(e,i.type);this._$Em=t,null==r?this.removeAttribute(o):this.setAttribute(o,r),this._$Em=null}}_$AK(t,e){const i=this.constructor,o=i._$Eh.get(t);if(void 0!==o&&this._$Em!==o){const t=i.getPropertyOptions(o),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:E;this._$Em=o,this[o]=r.fromAttribute(e,t.type)??this._$Ej?.get(o)??null,this._$Em=null}}requestUpdate(t,e,i){if(void 0!==t){const o=this.constructor,r=this[t];if(i??=o.getPropertyOptions(t),!((i.hasChanged??M)(r,e)||i.useDefault&&i.reflect&&r===this._$Ej?.get(t)&&!this.hasAttribute(o._$Eu(t,i))))return;this.C(t,e,i)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(t,e,{useDefault:i,reflect:o,wrapped:r},s){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,s??e??this[t]),!0!==r||void 0!==s)||(this._$AL.has(t)||(this.hasUpdated||i||(e=void 0),this._$AL.set(t,e)),!0===o&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,e]of this._$Ep)this[t]=e;this._$Ep=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[e,i]of t){const{wrapped:t}=i,o=this[e];!0!==t||this._$AL.has(e)||void 0===o||this.C(e,void 0,i,o)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(e)):this._$EM()}catch(e){throw t=!1,this._$EM(),e}t&&this._$AE(e)}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach((t=>this._$ET(t,this[t]))),this._$EM()}updated(t){}firstUpdated(t){}}F.elementStyles=[],F.shadowRootOptions={mode:"open"},F[D("elementProperties")]=new Map,F[D("finalized")]=new Map,C?.({ReactiveElement:F}),(k.reactiveElementVersions??=[]).push("2.1.0");
|
|
18
18
|
/**
|
|
19
19
|
* @license
|
|
20
20
|
* Copyright 2017 Google LLC
|
|
21
21
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
22
22
|
*/
|
|
23
|
-
const
|
|
23
|
+
const P={attribute:!0,type:String,converter:E,reflect:!1,hasChanged:M},T=(t=P,e,i)=>{const{kind:o,metadata:r}=i;let s=globalThis.litPropertyMetadata.get(r);if(void 0===s&&globalThis.litPropertyMetadata.set(r,s=new Map),"setter"===o&&((t=Object.create(t)).wrapped=!0),s.set(i.name,t),"accessor"===o){const{name:o}=i;return{set(i){const r=e.get.call(this);e.set.call(this,i),this.requestUpdate(o,r,t)},init(e){return void 0!==e&&this.C(o,void 0,t,e),e}}}if("setter"===o){const{name:o}=i;return function(i){const r=this[o];e.call(this,i),this.requestUpdate(o,r,t)}}throw Error("Unsupported decorator location: "+o)};function L(t){return(e,i)=>"object"==typeof i?T(t,e,i):((t,e,i)=>{const o=e.hasOwnProperty(i);return e.constructor.createProperty(i,t),o?Object.getOwnPropertyDescriptor(e,i):void 0})(t,e,i)}
|
|
24
24
|
/**
|
|
25
25
|
* @license
|
|
26
26
|
* Copyright 2017 Google LLC
|
|
27
27
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
28
|
-
*/function
|
|
28
|
+
*/function B(t){return L({...t,state:!0,attribute:!1})}
|
|
29
29
|
/**
|
|
30
30
|
* @license
|
|
31
31
|
* Copyright 2017 Google LLC
|
|
@@ -36,95 +36,95 @@ const T={attribute:!0,type:String,converter:D,reflect:!1,hasChanged:M},j=(e=T,t,
|
|
|
36
36
|
* Copyright 2017 Google LLC
|
|
37
37
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
38
38
|
*/
|
|
39
|
-
function
|
|
40
|
-
${this.label?
|
|
39
|
+
function j(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Reflect.decorate&&"object"!=typeof e&&Object.defineProperty(t,e,i),i))(e,i,{get(){return(e=>e.renderRoot?.querySelector(t)??null)(this)}})}let A=class extends t{constructor(){super(...arguments),this.label="",this.placeholder="",this.labelColor="",this.value="",this.required=!1,this.optional=!1,this.disabled=!1,this.error=!1,this.errorMessage=null,this.helper=null,this.helperAlign="left"}renderLabelContainer(){return e`
|
|
40
|
+
${this.label?e`
|
|
41
41
|
<div class="label-container">
|
|
42
42
|
${this.renderLabel()}
|
|
43
43
|
|
|
44
44
|
${this.renderHelp()}
|
|
45
45
|
</div>
|
|
46
46
|
`:""}
|
|
47
|
-
`}renderLabel(){return
|
|
47
|
+
`}renderLabel(){return e`
|
|
48
48
|
<label class="form-label">
|
|
49
49
|
${this.label}
|
|
50
|
-
${this.required?
|
|
51
|
-
<span class="required">*</span>`:this.optional?
|
|
50
|
+
${this.required?e`
|
|
51
|
+
<span class="required">*</span>`:this.optional?e` <span class="optional">opcional</span> `:i}
|
|
52
52
|
</label>
|
|
53
|
-
`}renderHelp(){return
|
|
54
|
-
${this.help?
|
|
53
|
+
`}renderHelp(){return e`
|
|
54
|
+
${this.help?e`
|
|
55
55
|
<div class="tooltip-wrapper">
|
|
56
56
|
<randstad-icon name="info" size="20px"></randstad-icon>
|
|
57
57
|
|
|
58
58
|
<div class="tooltip">${this.help}</div>
|
|
59
59
|
</div>
|
|
60
|
-
`:this.helpLink?
|
|
60
|
+
`:this.helpLink?e`
|
|
61
61
|
<a class="tooltip-wrapper" href="${this.helpLink}">
|
|
62
62
|
<randstad-icon name="ayuda" size="20px"></randstad-icon>
|
|
63
63
|
|
|
64
|
-
${this.helpLinkTooltipMessage?
|
|
64
|
+
${this.helpLinkTooltipMessage?e`<div class="tooltip">${this.helpLinkTooltipMessage}</div>`:i}
|
|
65
65
|
</a>
|
|
66
66
|
`:i}
|
|
67
|
-
`}renderError(){return
|
|
68
|
-
${this.error?
|
|
67
|
+
`}renderError(){return e`
|
|
68
|
+
${this.error?e`
|
|
69
69
|
<div class="error-message">
|
|
70
|
-
${this.errorMessage?this.errorMessage:
|
|
70
|
+
${this.errorMessage?this.errorMessage:e`<slot name="error-extended"></slot>`}
|
|
71
71
|
</div>
|
|
72
72
|
`:i}
|
|
73
|
-
`}renderHelper(){const
|
|
74
|
-
${this.helper?
|
|
73
|
+
`}renderHelper(){const t=`text-align: ${this.helperAlign??"left"};`;return e`
|
|
74
|
+
${this.helper?e`
|
|
75
75
|
<p
|
|
76
76
|
class="helper-description"
|
|
77
|
-
style=${
|
|
77
|
+
style=${t}
|
|
78
78
|
>
|
|
79
79
|
${this.helper}
|
|
80
80
|
</p>
|
|
81
81
|
`:i}
|
|
82
|
-
`}};a([
|
|
82
|
+
`}};a([L({type:String}),n("design:type",Object)],A.prototype,"label",void 0),a([L({type:String}),n("design:type",Object)],A.prototype,"placeholder",void 0),a([L({type:String}),n("design:type",Object)],A.prototype,"labelColor",void 0),a([L(),n("design:type",Object)],A.prototype,"value",void 0),a([L({type:Boolean}),n("design:type",Object)],A.prototype,"required",void 0),a([L({type:Boolean}),n("design:type",Object)],A.prototype,"optional",void 0),a([L({type:Boolean}),n("design:type",Object)],A.prototype,"disabled",void 0),a([L({type:Boolean,reflect:!0}),n("design:type",Object)],A.prototype,"error",void 0),a([L({type:String}),n("design:type",Object)],A.prototype,"errorMessage",void 0),a([L({type:String}),n("design:type",Object)],A.prototype,"helper",void 0),a([L({type:String}),n("design:type",String)],A.prototype,"helperAlign",void 0),a([L({type:String}),n("design:type",String)],A.prototype,"help",void 0),a([L({type:String}),n("design:type",String)],A.prototype,"helpLink",void 0),a([L({type:String}),n("design:type",String)],A.prototype,"helpLinkTooltipMessage",void 0),A=a([l("base-control")],A);const z=o`
|
|
83
83
|
font-family: 'Graphik', sans-serif;
|
|
84
84
|
font-weight: 400;
|
|
85
85
|
font-size: 12px;
|
|
86
86
|
line-height: 15px;
|
|
87
87
|
letter-spacing: 0%;
|
|
88
|
-
`,
|
|
88
|
+
`,W=o`
|
|
89
89
|
font-family: 'Graphik', sans-serif;
|
|
90
90
|
font-weight: 400;
|
|
91
91
|
font-size: 14px;
|
|
92
92
|
line-height: 25px;
|
|
93
93
|
letter-spacing: 0%;
|
|
94
|
-
`,
|
|
94
|
+
`,I=o`
|
|
95
95
|
font-family: 'Graphik', sans-serif;
|
|
96
96
|
font-weight: 400;
|
|
97
97
|
font-size: 16px;
|
|
98
98
|
line-height: 25px;
|
|
99
99
|
letter-spacing: 0%;
|
|
100
|
-
`,
|
|
100
|
+
`,N=o`
|
|
101
101
|
font-family: 'Graphik', sans-serif;
|
|
102
102
|
font-weight: 400;
|
|
103
103
|
font-size: 18px;
|
|
104
104
|
line-height: 30px;
|
|
105
105
|
letter-spacing: 0%;
|
|
106
|
-
`,
|
|
106
|
+
`,_=o`
|
|
107
107
|
font-family: 'Graphik', sans-serif;
|
|
108
108
|
font-weight: 400;
|
|
109
109
|
font-size: 18px;
|
|
110
110
|
line-height: 30px;
|
|
111
111
|
letter-spacing: 0%;
|
|
112
112
|
vertical-align: middle;
|
|
113
|
-
`,
|
|
113
|
+
`,R=o`
|
|
114
114
|
font-family: 'Graphik', sans-serif;
|
|
115
115
|
font-weight: 400;
|
|
116
116
|
font-size: 20px;
|
|
117
117
|
line-height: 30px;
|
|
118
118
|
letter-spacing: -1%;
|
|
119
119
|
vertical-align: middle;
|
|
120
|
-
`,
|
|
120
|
+
`,V=o`
|
|
121
121
|
font-family: 'Graphik', sans-serif;
|
|
122
122
|
font-weight: 400;
|
|
123
123
|
font-size: 26px;
|
|
124
124
|
line-height: 30px;
|
|
125
125
|
letter-spacing: -1%;
|
|
126
126
|
vertical-align: middle;
|
|
127
|
-
`;let
|
|
127
|
+
`;let U=class extends t{constructor(){super(...arguments),this.title="",this.isOpen=!1,this.isDesktop=window.innerWidth>940,this.handleResize=()=>{this.isDesktop=window.innerWidth>940}}static{this.styles=o`
|
|
128
128
|
:host {
|
|
129
129
|
display: flex;
|
|
130
130
|
flex-direction: column;
|
|
@@ -143,7 +143,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
143
143
|
}
|
|
144
144
|
|
|
145
145
|
.title {
|
|
146
|
-
${
|
|
146
|
+
${I}
|
|
147
147
|
color: var( --secondary-color );
|
|
148
148
|
}
|
|
149
149
|
|
|
@@ -196,32 +196,32 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
196
196
|
background-color: var( --primary-color-5 );
|
|
197
197
|
}
|
|
198
198
|
}
|
|
199
|
-
`}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.handleResize)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this.handleResize)}toggle(){this.isOpen=!this.isOpen}render(){const e
|
|
199
|
+
`}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.handleResize)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this.handleResize)}toggle(){this.isOpen=!this.isOpen}render(){const t=e`
|
|
200
200
|
<randstad-icon
|
|
201
201
|
name="${this.isOpen?"arrow_up":"arrow_down"}"
|
|
202
202
|
size="24"
|
|
203
203
|
.color=${"var( --primary-color )"}
|
|
204
204
|
>
|
|
205
205
|
</randstad-icon>
|
|
206
|
-
`;return
|
|
206
|
+
`;return e`
|
|
207
207
|
<div class="header" @click=${this.toggle}>
|
|
208
208
|
<div class="title">${this.title}</div>
|
|
209
209
|
|
|
210
210
|
<div class="icon">
|
|
211
|
-
${this.isDesktop?
|
|
211
|
+
${this.isDesktop?e`<div class="icon-wrapper">${t}</div>`:t}
|
|
212
212
|
</div>
|
|
213
213
|
</div>
|
|
214
214
|
|
|
215
215
|
<div class="content ${this.isOpen?"open":""}">
|
|
216
216
|
<slot></slot>
|
|
217
217
|
</div>
|
|
218
|
-
`}};a([
|
|
218
|
+
`}};a([L({type:String}),n("design:type",Object)],U.prototype,"title",void 0),a([B(),n("design:type",Object)],U.prototype,"isOpen",void 0),a([B(),n("design:type",Object)],U.prototype,"isDesktop",void 0),U=a([l("accordion-panel")],U);let q=class extends t{static{this.styles=o`
|
|
219
219
|
:host {
|
|
220
220
|
display: flex;
|
|
221
221
|
flex-direction: column;
|
|
222
222
|
gap: 16px;
|
|
223
223
|
}
|
|
224
|
-
`}render(){return
|
|
224
|
+
`}render(){return e`<slot></slot>`}};q=a([l("accordion-list")],q);let Y=class extends t{constructor(){super(...arguments),this.type="button",this.variant="button-primary",this.size="md",this.label="",this.loader=!1,this.iconPosition="left",this.iconName=null,this.disabled=!1,this.idevent=""}static{this.styles=o`
|
|
225
225
|
:host {
|
|
226
226
|
display: inline-block;
|
|
227
227
|
--content-padding: 16px;
|
|
@@ -261,12 +261,12 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
261
261
|
}
|
|
262
262
|
|
|
263
263
|
.button-lg {
|
|
264
|
-
${
|
|
264
|
+
${N}
|
|
265
265
|
min-height: 62px;
|
|
266
266
|
}
|
|
267
267
|
|
|
268
268
|
.button-md {
|
|
269
|
-
${
|
|
269
|
+
${I}
|
|
270
270
|
min-height: 57px;
|
|
271
271
|
}
|
|
272
272
|
|
|
@@ -518,16 +518,16 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
518
518
|
color: #6F758D;
|
|
519
519
|
cursor: default;
|
|
520
520
|
}
|
|
521
|
-
`}handleClick(
|
|
521
|
+
`}handleClick(t){if(!this.disabled)if("submit"===this.type){const t=this.closest("form");t&&t.requestSubmit()}else if("reset"===this.type){const t=this.closest("form");t&&t.reset()}else this.idevent&&this.dispatchEvent(new CustomEvent("randstad-button-click",{detail:this.idevent,composed:!0,bubbles:!0,cancelable:!1}))}render(){const t={button:!0,[this.variant]:!0,loader:this.loader,[`button-${this.size}`]:["button-primary","button-secondary","button-tertiary"].includes(this.variant)},i="button-tertiary"===this.variant?"var(--primary-color)":"white";return e`
|
|
522
522
|
<button
|
|
523
523
|
part="button"
|
|
524
524
|
type=${this.type}
|
|
525
|
-
class=${
|
|
525
|
+
class=${s(t)}
|
|
526
526
|
?disabled=${this.disabled||this.loader}
|
|
527
527
|
?aria-busy=${this.loader}
|
|
528
528
|
@click=${this.handleClick}
|
|
529
529
|
>
|
|
530
|
-
${this.loader?
|
|
530
|
+
${this.loader?e`
|
|
531
531
|
<div class="content-container">
|
|
532
532
|
<div class="loader">
|
|
533
533
|
<span class="dot" style="background-color: ${i};"></span>
|
|
@@ -535,19 +535,19 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
535
535
|
<span class="dot" style="background-color: ${i};"></span>
|
|
536
536
|
</div>
|
|
537
537
|
</div>
|
|
538
|
-
`:
|
|
538
|
+
`:e`
|
|
539
539
|
<div class="content-container">
|
|
540
|
-
${this.iconSrc&&"button-round"===this.variant?
|
|
540
|
+
${this.iconSrc&&"button-round"===this.variant?e`<img src=${this.iconSrc} alt="icon" class="button-icon" part="button-icon"/>`:""}
|
|
541
541
|
|
|
542
|
-
${this.iconName&&"button-round"!==this.variant&&"left"===this.iconPosition?
|
|
542
|
+
${this.iconName&&"button-round"!==this.variant&&"left"===this.iconPosition?e`<randstad-icon name=${this.iconName} size="24px"></randstad-icon>`:""}
|
|
543
543
|
|
|
544
|
-
${this.label?
|
|
544
|
+
${this.label?e`<span class="label-text" part="label">${this.label}</span>`:e`<slot></slot>`}
|
|
545
545
|
|
|
546
|
-
${this.iconName&&"button-round"!==this.variant&&"right"===this.iconPosition?
|
|
546
|
+
${this.iconName&&"button-round"!==this.variant&&"right"===this.iconPosition?e`<randstad-icon name=${this.iconName} size="24px"></randstad-icon>`:""}
|
|
547
547
|
</div>
|
|
548
548
|
`}
|
|
549
549
|
</button>
|
|
550
|
-
`}};a([
|
|
550
|
+
`}};a([L({type:String}),n("design:type",String)],Y.prototype,"type",void 0),a([L({type:String}),n("design:type",String)],Y.prototype,"variant",void 0),a([L({type:String}),n("design:type",String)],Y.prototype,"size",void 0),a([L({type:String}),n("design:type",Object)],Y.prototype,"label",void 0),a([L({type:Boolean}),n("design:type",Object)],Y.prototype,"loader",void 0),a([L({type:String,attribute:"icon-src"}),n("design:type",String)],Y.prototype,"iconSrc",void 0),a([L({type:String}),n("design:type",String)],Y.prototype,"iconPosition",void 0),a([L({type:String}),n("design:type",Object)],Y.prototype,"iconName",void 0),a([L({type:Boolean,reflect:!0}),n("design:type",Boolean)],Y.prototype,"disabled",void 0),a([L({type:String}),n("design:type",Object)],Y.prototype,"idevent",void 0),Y=a([l("randstad-button")],Y);let H=class extends t{constructor(){super(...arguments),this.img="",this.name="",this.title="",this.description="",this.buttonLabel="",this.cardId="",this.width="",this.height=""}static{this.styles=o`
|
|
551
551
|
:host {
|
|
552
552
|
display: inline-block;
|
|
553
553
|
font-family: "Graphik", sans-serif;
|
|
@@ -556,8 +556,6 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
556
556
|
}
|
|
557
557
|
|
|
558
558
|
.image-container {
|
|
559
|
-
width: 280px;
|
|
560
|
-
height: 390px;
|
|
561
559
|
position: relative;
|
|
562
560
|
border-radius: 8px;
|
|
563
561
|
overflow: hidden;
|
|
@@ -613,7 +611,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
613
611
|
}
|
|
614
612
|
|
|
615
613
|
.title {
|
|
616
|
-
${
|
|
614
|
+
${N}
|
|
617
615
|
margin: 0;
|
|
618
616
|
}
|
|
619
617
|
|
|
@@ -635,7 +633,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
635
633
|
}
|
|
636
634
|
|
|
637
635
|
.description {
|
|
638
|
-
${
|
|
636
|
+
${W}
|
|
639
637
|
margin: 0;
|
|
640
638
|
}
|
|
641
639
|
|
|
@@ -648,14 +646,14 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
648
646
|
}
|
|
649
647
|
|
|
650
648
|
::part(button):hover {
|
|
651
|
-
background-color: rgba(255, 255, 255, 0.1);
|
|
649
|
+
background-color: rgba( 255, 255, 255, 0.1 );
|
|
652
650
|
}
|
|
653
651
|
|
|
654
652
|
::part(button):active {
|
|
655
|
-
background-color: rgba(255, 255, 255, 0.2);
|
|
653
|
+
background-color: rgba( 255, 255, 255, 0.2 );
|
|
656
654
|
}
|
|
657
|
-
`}handleButtonClick(
|
|
658
|
-
<div class="image-container" style="
|
|
655
|
+
`}handleButtonClick(t){t.stopPropagation(),this.onClick?this.onClick(t):this.dispatchEvent(new CustomEvent("card-button-click",{detail:t.detail,bubbles:!0,composed:!0}))}connectedCallback(){super.connectedCallback(),this.addEventListener("randstad-button-click",this.handleButtonClick)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("randstad-button-click",this.handleButtonClick)}render(){const t=` background-image: url( ${this.img} ); `,i=`${this.width?`width: ${this.width};`:""} height: ${this.height??"390px"};`;return e`
|
|
656
|
+
<div class="image-container" style="${`${i} ${t}`};">
|
|
659
657
|
<div class="overlay-gradient"></div>
|
|
660
658
|
|
|
661
659
|
<div class="overlay-hover"></div>
|
|
@@ -668,14 +666,14 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
668
666
|
<div class="details">
|
|
669
667
|
<p class="description">${this.description}</p>
|
|
670
668
|
|
|
671
|
-
${this.cardId?
|
|
669
|
+
${this.cardId?e`
|
|
672
670
|
<randstad-button
|
|
673
671
|
variant="button-tertiary"
|
|
674
672
|
.label=${this.buttonLabel}
|
|
675
673
|
idevent=${this.cardId}
|
|
676
674
|
@randstad-button-click=${this.handleButtonClick}
|
|
677
675
|
>
|
|
678
|
-
</randstad-button>`:
|
|
676
|
+
</randstad-button>`:e`
|
|
679
677
|
<randstad-button
|
|
680
678
|
variant="button-tertiary"
|
|
681
679
|
.label=${this.buttonLabel}
|
|
@@ -686,14 +684,14 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
686
684
|
</div>
|
|
687
685
|
</div>
|
|
688
686
|
</div>
|
|
689
|
-
`}};a([
|
|
687
|
+
`}};a([L({type:String}),n("design:type",Object)],H.prototype,"img",void 0),a([L({type:String}),n("design:type",Object)],H.prototype,"name",void 0),a([L({type:String}),n("design:type",Object)],H.prototype,"title",void 0),a([L({type:String}),n("design:type",Object)],H.prototype,"description",void 0),a([L({type:String}),n("design:type",Object)],H.prototype,"buttonLabel",void 0),a([L({type:String}),n("design:type",Object)],H.prototype,"cardId",void 0),a([L({type:Object}),n("design:type",Object)],H.prototype,"onClick",void 0),a([L({type:String}),n("design:type",String)],H.prototype,"width",void 0),a([L({type:String}),n("design:type",String)],H.prototype,"height",void 0),H=a([l("carousel-card")],H);let G=class extends t{constructor(){super(...arguments),this.checked=!1,this.error=!1,this.disabled=!1}static{this.styles=o`
|
|
690
688
|
:host {
|
|
691
689
|
display: block;
|
|
692
690
|
max-width: 100%;
|
|
693
691
|
}
|
|
694
692
|
|
|
695
693
|
label {
|
|
696
|
-
${
|
|
694
|
+
${W}
|
|
697
695
|
display: flex;
|
|
698
696
|
align-items: center;
|
|
699
697
|
gap: 8px;
|
|
@@ -789,7 +787,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
789
787
|
label.disabled {
|
|
790
788
|
color: #9FA3B3;
|
|
791
789
|
}
|
|
792
|
-
`}toggleCheck(
|
|
790
|
+
`}toggleCheck(t){this.checked=t.target.checked,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("click",{bubbles:!0,composed:!0}))}render(){return e`
|
|
793
791
|
<label class="${this.error?"error":""} ${this.disabled?"disabled":""}">
|
|
794
792
|
<input
|
|
795
793
|
type="checkbox"
|
|
@@ -805,7 +803,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
805
803
|
<slot></slot>
|
|
806
804
|
</span>
|
|
807
805
|
</label>
|
|
808
|
-
`}};a([
|
|
806
|
+
`}};a([L({type:Boolean,reflect:!0}),n("design:type",Object)],G.prototype,"checked",void 0),a([L({type:Boolean}),n("design:type",Object)],G.prototype,"error",void 0),a([L({type:Boolean}),n("design:type",Object)],G.prototype,"disabled",void 0),G=a([l("randstad-checkbox")],G);const X=o`
|
|
809
807
|
.label-container {
|
|
810
808
|
display: flex;
|
|
811
809
|
align-items: center;
|
|
@@ -867,7 +865,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
867
865
|
}
|
|
868
866
|
|
|
869
867
|
.form-label {
|
|
870
|
-
${
|
|
868
|
+
${I}
|
|
871
869
|
display: flex;
|
|
872
870
|
align-items: baseline;
|
|
873
871
|
flex-direction: row;
|
|
@@ -882,12 +880,12 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
882
880
|
}
|
|
883
881
|
|
|
884
882
|
input::placeholder {
|
|
885
|
-
${
|
|
883
|
+
${N}
|
|
886
884
|
color: var( --secondary-color-40 );
|
|
887
885
|
}
|
|
888
886
|
|
|
889
887
|
.helper-description {
|
|
890
|
-
${
|
|
888
|
+
${I}
|
|
891
889
|
color: var( --secondary-color-40 );
|
|
892
890
|
margin: 0;
|
|
893
891
|
}
|
|
@@ -898,7 +896,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
898
896
|
|
|
899
897
|
.optional {
|
|
900
898
|
color: var( --secondary-color-60 );
|
|
901
|
-
${
|
|
899
|
+
${z}
|
|
902
900
|
}
|
|
903
901
|
|
|
904
902
|
randstad-icon {
|
|
@@ -919,7 +917,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
919
917
|
}
|
|
920
918
|
|
|
921
919
|
.error-message {
|
|
922
|
-
${
|
|
920
|
+
${I}
|
|
923
921
|
color: var(--ui-negative, #E00F0F);
|
|
924
922
|
margin-top: 4px;
|
|
925
923
|
}
|
|
@@ -941,7 +939,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
941
939
|
::-webkit-scrollbar-button {
|
|
942
940
|
display: none;
|
|
943
941
|
}
|
|
944
|
-
`.cssText);let Z=class extends
|
|
942
|
+
`.cssText);let Z=class extends A{constructor(){super(...arguments),this.keydown=void 0,this.size="md",this.icon=null,this.typing=!1,this.type="text",this.isPasswordVisible=!1,this.cleanButton=!1}static{this.styles=[J,o`
|
|
945
943
|
${K}
|
|
946
944
|
${Q}
|
|
947
945
|
${X}
|
|
@@ -954,7 +952,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
954
952
|
}
|
|
955
953
|
|
|
956
954
|
.form-input {
|
|
957
|
-
${
|
|
955
|
+
${N}
|
|
958
956
|
padding: 16px;
|
|
959
957
|
border: 1px solid var(--secondary-color-10);
|
|
960
958
|
border-radius: 4px;
|
|
@@ -1029,7 +1027,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1029
1027
|
}
|
|
1030
1028
|
|
|
1031
1029
|
textarea {
|
|
1032
|
-
${
|
|
1030
|
+
${N}
|
|
1033
1031
|
resize: none;
|
|
1034
1032
|
}
|
|
1035
1033
|
|
|
@@ -1045,7 +1043,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1045
1043
|
}
|
|
1046
1044
|
|
|
1047
1045
|
.link-text {
|
|
1048
|
-
${
|
|
1046
|
+
${I}
|
|
1049
1047
|
color: var(--primary-color);
|
|
1050
1048
|
cursor: pointer;
|
|
1051
1049
|
text-align: end;
|
|
@@ -1081,15 +1079,13 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1081
1079
|
height: 24px;
|
|
1082
1080
|
color: var( --primary-color );
|
|
1083
1081
|
}
|
|
1084
|
-
`]}togglePassword(
|
|
1085
|
-
${this.labelColor?`--label-color: ${this.labelColor};`:""}
|
|
1086
|
-
`,n=t`
|
|
1082
|
+
`]}togglePassword(t){this.isPasswordVisible=!this.isPasswordVisible;const e=t.currentTarget.parentElement?.querySelector("input");e&&(e.type=this.isPasswordVisible?"text":"password"),this.requestUpdate()}handleInput(t){this.handleInputCustom(t);const e=t.target.value;void 0!==this.maxLength&&"textarea"!==this.type?this.value=e.slice(0,this.maxLength):this.value=e,this.dispatchEvent(new CustomEvent("valueChanged",{detail:this.value})),this.dispatchEvent(new Event("input",{bubbles:!0})),this.requestUpdate()}handleClear(){this.value="",this.dispatchEvent(new CustomEvent("valueChanged",{detail:this.value})),this.dispatchEvent(new Event("input",{bubbles:!0})),this.requestUpdate()}handleLinkClick(t){t.preventDefault(),this.linkRoute&&this.dispatchEvent(new CustomEvent("linkClicked",{detail:this.linkRoute,bubbles:!0,composed:!0}))}handleInputCustom(t){"number"===this.keydown?this.onlyNumeric(t):"text"===this.keydown&&this.onlyText(t)}onlyNumeric(t){const e=t.target,i=e.value.replace(/[^0-9]/g,"");e.value=i}onlyText(t){const e=t.target,i=e.value.replace(/[^a-zA-Z\sáéíóúñÁÉÍÓÚÑ]/g,"");e.value=i}handleKeyDown(t){if("Enter"!==t.key)return;const e=new Event("submit",{bubbles:!0,composed:!0,cancelable:!0}),i=this.closest("form");i&&i.dispatchEvent(e)}render(){const t=this.cleanButton&&this.value&&"password"!==this.type&&"textarea"!==this.type,o="textarea"===this.type?`height: ${this.heightTextArea??"30px"}; max-height: ${this.maxHeightTextArea??"30px"}; overflow-y: auto;`:"",r=this.labelColor?`--label-color: ${this.labelColor};`:"",s=e`
|
|
1087
1083
|
<randstad-icon
|
|
1088
1084
|
name="${this.isPasswordVisible?"eye_crossed":"eye"}"
|
|
1089
1085
|
size="24px"
|
|
1090
1086
|
>
|
|
1091
1087
|
</randstad-icon>
|
|
1092
|
-
`;return
|
|
1088
|
+
`;return e`
|
|
1093
1089
|
<div
|
|
1094
1090
|
class="form ${this.error?"error":""} ${this.disabled?"disabled":""}"
|
|
1095
1091
|
style="${r}"
|
|
@@ -1097,10 +1093,10 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1097
1093
|
${this.renderLabelContainer()}
|
|
1098
1094
|
|
|
1099
1095
|
<div class="form-container">
|
|
1100
|
-
${"left"===this.icon?
|
|
1096
|
+
${"left"===this.icon?e`<span class="icon left"></span>`:i}
|
|
1101
1097
|
|
|
1102
1098
|
<div class="input-with-button">
|
|
1103
|
-
${"textarea"===this.type?
|
|
1099
|
+
${"textarea"===this.type?e`
|
|
1104
1100
|
<textarea
|
|
1105
1101
|
class="form-input"
|
|
1106
1102
|
placeholder=${this.placeholder||""}
|
|
@@ -1112,7 +1108,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1112
1108
|
style="${o}"
|
|
1113
1109
|
>
|
|
1114
1110
|
</textarea>
|
|
1115
|
-
`:
|
|
1111
|
+
`:e`
|
|
1116
1112
|
<input
|
|
1117
1113
|
class="form-input"
|
|
1118
1114
|
type=${"password"!==this.type||this.isPasswordVisible?"text":"password"}
|
|
@@ -1124,17 +1120,17 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1124
1120
|
maxlength=${this.maxLength??i}
|
|
1125
1121
|
/>
|
|
1126
1122
|
|
|
1127
|
-
${"password"===this.type?
|
|
1123
|
+
${"password"===this.type?e`
|
|
1128
1124
|
<button
|
|
1129
1125
|
type="button"
|
|
1130
1126
|
class="toggle-password"
|
|
1131
1127
|
@click=${this.togglePassword}
|
|
1132
1128
|
?disabled=${this.disabled}
|
|
1133
1129
|
>
|
|
1134
|
-
${
|
|
1130
|
+
${s}
|
|
1135
1131
|
</button>`:i}
|
|
1136
1132
|
|
|
1137
|
-
${e
|
|
1133
|
+
${t?e`
|
|
1138
1134
|
<button
|
|
1139
1135
|
type="button"
|
|
1140
1136
|
class="clean-button"
|
|
@@ -1150,13 +1146,13 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1150
1146
|
`}
|
|
1151
1147
|
</div>
|
|
1152
1148
|
|
|
1153
|
-
${"right"===this.icon?
|
|
1149
|
+
${"right"===this.icon?e`<span class="icon right"></span>`:i}
|
|
1154
1150
|
|
|
1155
1151
|
${this.renderError()}
|
|
1156
1152
|
</div>
|
|
1157
1153
|
|
|
1158
1154
|
|
|
1159
|
-
${this.linkText&&this.linkRoute?
|
|
1155
|
+
${this.linkText&&this.linkRoute?e`
|
|
1160
1156
|
<div style="text-align: end;">
|
|
1161
1157
|
<a class="link-text" @click=${this.handleLinkClick}>
|
|
1162
1158
|
${this.linkText}
|
|
@@ -1165,7 +1161,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1165
1161
|
|
|
1166
1162
|
${this.renderHelper()}
|
|
1167
1163
|
</div>
|
|
1168
|
-
`}};a([
|
|
1164
|
+
`}};a([L({type:String}),n("design:type",Object)],Z.prototype,"keydown",void 0),a([L({type:String}),n("design:type",String)],Z.prototype,"size",void 0),a([L({type:String}),n("design:type",Object)],Z.prototype,"icon",void 0),a([L({type:Boolean}),n("design:type",Boolean)],Z.prototype,"typing",void 0),a([L({type:String}),n("design:type",String)],Z.prototype,"type",void 0),a([L({type:String}),n("design:type",String)],Z.prototype,"linkText",void 0),a([L({type:String}),n("design:type",String)],Z.prototype,"linkRoute",void 0),a([L({type:Boolean,reflect:!0}),n("design:type",Object)],Z.prototype,"isPasswordVisible",void 0),a([L({type:Boolean}),n("design:type",Boolean)],Z.prototype,"cleanButton",void 0),a([L({type:Number}),n("design:type",Number)],Z.prototype,"maxLength",void 0),a([L({type:String}),n("design:type",String)],Z.prototype,"heightTextArea",void 0),a([L({type:String}),n("design:type",String)],Z.prototype,"maxHeightTextArea",void 0),Z=a([l("randstad-form")],Z);let tt=class extends A{constructor(){super(...arguments),this.rows=""}static{this.styles=o`
|
|
1169
1165
|
${K}
|
|
1170
1166
|
${Q}
|
|
1171
1167
|
${X}
|
|
@@ -1186,12 +1182,12 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1186
1182
|
.fields {
|
|
1187
1183
|
gap: 8px;
|
|
1188
1184
|
}
|
|
1189
|
-
`}render(){const
|
|
1185
|
+
`}render(){const t=this.rows?`display: grid; grid-template-columns: ${this.rows};`:"display: flex; flex-direction: column;";return e`
|
|
1190
1186
|
<div class="group-container">
|
|
1191
1187
|
${this.renderLabelContainer()}
|
|
1192
1188
|
|
|
1193
1189
|
<div class="input-container">
|
|
1194
|
-
<div class="fields" style="${
|
|
1190
|
+
<div class="fields" style="${t};">
|
|
1195
1191
|
<slot></slot>
|
|
1196
1192
|
</div>
|
|
1197
1193
|
|
|
@@ -1200,7 +1196,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1200
1196
|
|
|
1201
1197
|
${this.renderHelper()}
|
|
1202
1198
|
</div>
|
|
1203
|
-
`}};a([
|
|
1199
|
+
`}};a([L({type:String}),n("design:type",String)],tt.prototype,"rows",void 0),tt=a([l("randstad-form-group")],tt);class et extends t{constructor(){super(...arguments),this.name="",this.size="24px",this.color="",this.svgTemplate=null}static{this.styles=o`
|
|
1204
1200
|
:host {
|
|
1205
1201
|
display: inline-flex;
|
|
1206
1202
|
width: var( --icon-size, 24px );
|
|
@@ -1222,18 +1218,18 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1222
1218
|
width: 100%;
|
|
1223
1219
|
height: 100%;
|
|
1224
1220
|
}
|
|
1225
|
-
`}updated(
|
|
1221
|
+
`}updated(t){super.updated(t),t.has("size")&&this.style.setProperty("--icon-size",this.size),t.has("color")&&this.style.setProperty("--icon-color",this.color),t.has("name")&&this.name&&this.loadIcon()}async loadIcon(){try{const t=await fetch(`/assets/icons/${this.name}.svg`);if(!t.ok)throw new Error("Icon not found");let i=await t.text();i=i.replace(/fill="[^"]*"/g,""),i=i.replace(/fill='[^']*'/g,"");const o=new DOMParser,r=o.parseFromString(i,"image/svg+xml").documentElement;this.svgTemplate=e` ${r} `}catch(t){console.error(`❌ Error cargando icono ${this.name}:`,t),this.innerHTML=" <span>⚠️</span> "}}render(){return this.svgTemplate?e`
|
|
1226
1222
|
<div class="custom-icon" style="color: ${this.color};">
|
|
1227
1223
|
${this.svgTemplate}
|
|
1228
1224
|
</div>
|
|
1229
|
-
`:
|
|
1225
|
+
`:e``}}a([L({type:String}),n("design:type",Object)],et.prototype,"name",void 0),a([L({type:String}),n("design:type",Object)],et.prototype,"size",void 0),a([L({type:String}),n("design:type",Object)],et.prototype,"color",void 0),a([B(),n("design:type",Object)],et.prototype,"svgTemplate",void 0),customElements.define("randstad-icon",et);let it=class extends t{constructor(){super(...arguments),this.type="informative",this.icon="info",this.message="Este es un mensaje.",this.open=!1}static{this.styles=o`
|
|
1230
1226
|
:host {
|
|
1231
1227
|
display: block;
|
|
1232
1228
|
font-family: 'Graphik', sans-serif;
|
|
1233
1229
|
}
|
|
1234
1230
|
|
|
1235
1231
|
.container {
|
|
1236
|
-
${
|
|
1232
|
+
${I}
|
|
1237
1233
|
display: flex;
|
|
1238
1234
|
align-items: flex-start;
|
|
1239
1235
|
gap: 8px;
|
|
@@ -1274,7 +1270,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1274
1270
|
background: var(--ui-informative-10);
|
|
1275
1271
|
--icon-color: var(--ui-informative);
|
|
1276
1272
|
}
|
|
1277
|
-
`}render(){return
|
|
1273
|
+
`}render(){return e`
|
|
1278
1274
|
<div class="container ${this.open?"":"hidden"} ${this.type}">
|
|
1279
1275
|
<randstad-icon
|
|
1280
1276
|
name="${this.icon}"
|
|
@@ -1283,7 +1279,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1283
1279
|
|
|
1284
1280
|
<span class="message">${this.message}</span>
|
|
1285
1281
|
</div>
|
|
1286
|
-
`}};a([
|
|
1282
|
+
`}};a([L({type:String}),n("design:type",String)],it.prototype,"type",void 0),a([L({type:String}),n("design:type",String)],it.prototype,"icon",void 0),a([L({type:String}),n("design:type",String)],it.prototype,"message",void 0),a([L({type:Boolean}),n("design:type",Boolean)],it.prototype,"open",void 0),it=a([l("randstad-notice")],it);let ot=class extends t{constructor(){super(...arguments),this.open=!1,this.title="Título del modal",this.showNotice=!1,this.noticeType="informative",this.noticeMessage="",this.noticeIcon="info",this.showPrimaryButton=!1,this.primaryButtonLabel="Aceptar",this.showSecondaryButton=!1,this.secondaryButtonLabel="Cancelar",this.isFooterCustom=!1,this.isPrimaryLoader=!1,this.isPrimaryDisabled=!1,this.modalWidth="500px",this.scrollable=!1,this.setScrollableMode=()=>{this.scrollable=window.innerWidth>940}}static{this.styles=[J,o`
|
|
1287
1283
|
:host {
|
|
1288
1284
|
font-family: 'Graphik', sans-serif;
|
|
1289
1285
|
display: none;
|
|
@@ -1382,13 +1378,13 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1382
1378
|
}
|
|
1383
1379
|
|
|
1384
1380
|
.modal-title {
|
|
1385
|
-
${
|
|
1381
|
+
${V}
|
|
1386
1382
|
margin: 0;
|
|
1387
1383
|
color: var(--secondary-color);
|
|
1388
1384
|
}
|
|
1389
1385
|
|
|
1390
1386
|
.modal-subtitle {
|
|
1391
|
-
${
|
|
1387
|
+
${I}
|
|
1392
1388
|
margin: 0;
|
|
1393
1389
|
color: var(--secondary-color-60);
|
|
1394
1390
|
}
|
|
@@ -1420,7 +1416,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1420
1416
|
gap: 16px;
|
|
1421
1417
|
border-top: 1px solid var(--secondary-color-20);
|
|
1422
1418
|
}
|
|
1423
|
-
`]}closeModal(){this.dispatchEvent(new CustomEvent("modal-close"))}connectedCallback(){super.connectedCallback(),this.setScrollableMode(),window.addEventListener("resize",this.setScrollableMode)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this.setScrollableMode)}getFooterClass(){return!this.isFooterCustom||this.showPrimaryButton||this.showSecondaryButton?this.showPrimaryButton&&this.showSecondaryButton?"two-buttons":"one-button":"footer-custom"}render(){return
|
|
1419
|
+
`]}closeModal(){this.dispatchEvent(new CustomEvent("modal-close"))}connectedCallback(){super.connectedCallback(),this.setScrollableMode(),window.addEventListener("resize",this.setScrollableMode)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this.setScrollableMode)}getFooterClass(){return!this.isFooterCustom||this.showPrimaryButton||this.showSecondaryButton?this.showPrimaryButton&&this.showSecondaryButton?"two-buttons":"one-button":"footer-custom"}render(){return e`
|
|
1424
1420
|
<div class="overlay" role="dialog" aria-modal="true">
|
|
1425
1421
|
<div class="modal" style="--modal-width: ${this.modalWidth};">
|
|
1426
1422
|
<div class="modal-header">
|
|
@@ -1428,7 +1424,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1428
1424
|
<div class="titles-container">
|
|
1429
1425
|
<div class="modal-title">${this.title}</div>
|
|
1430
1426
|
|
|
1431
|
-
${this.subtitle?
|
|
1427
|
+
${this.subtitle?e`<div class="modal-subtitle">${this.subtitle}</div>`:i}
|
|
1432
1428
|
</div>
|
|
1433
1429
|
|
|
1434
1430
|
<button class="modal-close" @click=${this.closeModal} aria-label="Cerrar modal">
|
|
@@ -1441,7 +1437,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1441
1437
|
</button>
|
|
1442
1438
|
</div>
|
|
1443
1439
|
|
|
1444
|
-
${this.showNotice?
|
|
1440
|
+
${this.showNotice?e`
|
|
1445
1441
|
<randstad-notice
|
|
1446
1442
|
.open=${!0}
|
|
1447
1443
|
.type=${this.noticeType}
|
|
@@ -1457,9 +1453,9 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1457
1453
|
</div>
|
|
1458
1454
|
|
|
1459
1455
|
<div class="modal-footer ${this.getFooterClass()}">
|
|
1460
|
-
${!this.isFooterCustom||this.showPrimaryButton||this.showSecondaryButton?i:
|
|
1456
|
+
${!this.isFooterCustom||this.showPrimaryButton||this.showSecondaryButton?i:e` <slot name="footer-custom"></slot> `}
|
|
1461
1457
|
|
|
1462
|
-
${this.showSecondaryButton?
|
|
1458
|
+
${this.showSecondaryButton?e`
|
|
1463
1459
|
<randstad-button
|
|
1464
1460
|
variant="button-secondary"
|
|
1465
1461
|
size="md"
|
|
@@ -1468,7 +1464,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1468
1464
|
>
|
|
1469
1465
|
</randstad-button>
|
|
1470
1466
|
`:i}
|
|
1471
|
-
${this.showPrimaryButton?
|
|
1467
|
+
${this.showPrimaryButton?e`
|
|
1472
1468
|
<randstad-button
|
|
1473
1469
|
variant="button-primary"
|
|
1474
1470
|
size="md"
|
|
@@ -1482,7 +1478,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1482
1478
|
</div>
|
|
1483
1479
|
</div>
|
|
1484
1480
|
</div>
|
|
1485
|
-
`}};a([
|
|
1481
|
+
`}};a([L({type:Boolean,reflect:!0}),n("design:type",Object)],ot.prototype,"open",void 0),a([L({type:String}),n("design:type",Object)],ot.prototype,"title",void 0),a([L({type:String}),n("design:type",String)],ot.prototype,"subtitle",void 0),a([L({type:Boolean}),n("design:type",Object)],ot.prototype,"showNotice",void 0),a([L({type:String}),n("design:type",String)],ot.prototype,"noticeType",void 0),a([L({type:String}),n("design:type",Object)],ot.prototype,"noticeMessage",void 0),a([L({type:String}),n("design:type",Object)],ot.prototype,"noticeIcon",void 0),a([L({type:Boolean}),n("design:type",Object)],ot.prototype,"showPrimaryButton",void 0),a([L({type:String}),n("design:type",Object)],ot.prototype,"primaryButtonLabel",void 0),a([L({type:Boolean}),n("design:type",Object)],ot.prototype,"showSecondaryButton",void 0),a([L({type:String}),n("design:type",Object)],ot.prototype,"secondaryButtonLabel",void 0),a([L({type:Boolean}),n("design:type",Object)],ot.prototype,"isFooterCustom",void 0),a([L({type:Boolean}),n("design:type",Object)],ot.prototype,"isPrimaryLoader",void 0),a([L({type:Boolean}),n("design:type",Object)],ot.prototype,"isPrimaryDisabled",void 0),a([L({type:String}),n("design:type",Object)],ot.prototype,"modalWidth",void 0),a([B(),n("design:type",Object)],ot.prototype,"scrollable",void 0),ot=a([l("custom-modal")],ot);let rt=class extends t{constructor(){super(...arguments),this.open=!1,this.type="default",this.icon="warning",this.title="Título del Popup",this.description="Descripción del popup",this.width="400px",this.buttonText="Aceptar",this.confirmText="Sí",this.cancelText="No",this.stackedActions=[],this._onBackgroundClick=t=>{const e=t.composedPath(),i=this.renderRoot.querySelector(".popup");i&&!e.includes(i)&&(this.dispatchEvent(new CustomEvent("popup-close",{detail:null})),this.open=!1)}}static{this.styles=o`
|
|
1486
1482
|
:host {
|
|
1487
1483
|
display: none;
|
|
1488
1484
|
position: fixed;
|
|
@@ -1544,13 +1540,13 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1544
1540
|
}
|
|
1545
1541
|
|
|
1546
1542
|
.popup-title {
|
|
1547
|
-
${
|
|
1543
|
+
${R}
|
|
1548
1544
|
margin: 0;
|
|
1549
1545
|
color: var(--secondary-color-80);
|
|
1550
1546
|
}
|
|
1551
1547
|
|
|
1552
1548
|
.popup-description {
|
|
1553
|
-
${
|
|
1549
|
+
${I}
|
|
1554
1550
|
margin: 0;
|
|
1555
1551
|
color: var(--secondary-color-60);
|
|
1556
1552
|
}
|
|
@@ -1578,7 +1574,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1578
1574
|
}
|
|
1579
1575
|
|
|
1580
1576
|
.action-item {
|
|
1581
|
-
${
|
|
1577
|
+
${_};
|
|
1582
1578
|
display: flex;
|
|
1583
1579
|
align-items: center;
|
|
1584
1580
|
gap: 16px;
|
|
@@ -1603,19 +1599,19 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1603
1599
|
justify-content: center;
|
|
1604
1600
|
}
|
|
1605
1601
|
|
|
1606
|
-
`}firstUpdated(){if(this.open){const
|
|
1602
|
+
`}firstUpdated(){if(this.open){const t=this.renderRoot.querySelector("randstad-button");t&&t.focus()}this.addEventListener("click",this._onBackgroundClick)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this._onBackgroundClick)}closePopup(t){this.dispatchEvent(new CustomEvent("popup-close",{detail:t})),this.open=!1}render(){return e`
|
|
1607
1603
|
<div
|
|
1608
1604
|
class="popup"
|
|
1609
1605
|
role="dialog"
|
|
1610
1606
|
aria-modal="true"
|
|
1611
|
-
${"default"!==this.type?
|
|
1607
|
+
${"default"!==this.type?e`aria-labelledby="popup-title"`:i}
|
|
1612
1608
|
aria-describedby="popup-description"
|
|
1613
1609
|
>
|
|
1614
|
-
${"stacked"!==this.type&&this.icon?
|
|
1610
|
+
${"stacked"!==this.type&&this.icon?e`<img src="/assets/icons/${this.icon}" alt="" width="56" height="56" />`:i}
|
|
1615
1611
|
|
|
1616
1612
|
<div class="popup-content">
|
|
1617
|
-
${"default"===this.type?
|
|
1618
|
-
${this.title?
|
|
1613
|
+
${"default"===this.type?e`
|
|
1614
|
+
${this.title?e`<h2 id="popup-title" class="popup-title">${this.title}</h2>`:i}
|
|
1619
1615
|
|
|
1620
1616
|
<div class="titles-container">
|
|
1621
1617
|
<p id="popup-description" class="popup-description">${this.description}</p>
|
|
@@ -1629,26 +1625,26 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1629
1625
|
label=${this.buttonText}
|
|
1630
1626
|
></randstad-button>
|
|
1631
1627
|
</div>
|
|
1632
|
-
`:"stacked"===this.type?
|
|
1628
|
+
`:"stacked"===this.type?e`
|
|
1633
1629
|
<div class="popup-actions">
|
|
1634
|
-
${this.stackedActions.map((e
|
|
1630
|
+
${this.stackedActions.map((t=>e`
|
|
1635
1631
|
<div
|
|
1636
1632
|
class="action-item"
|
|
1637
|
-
@click=${()=>this.closePopup(
|
|
1633
|
+
@click=${()=>this.closePopup(t.value)}
|
|
1638
1634
|
>
|
|
1639
1635
|
<div class="icon-circle">
|
|
1640
1636
|
<randstad-icon
|
|
1641
|
-
name=${
|
|
1637
|
+
name=${t.icon}
|
|
1642
1638
|
size="24px"
|
|
1643
1639
|
.color=${"var( --primary-color )"}
|
|
1644
1640
|
>
|
|
1645
1641
|
</randstad-icon>
|
|
1646
1642
|
</div>
|
|
1647
|
-
<span>${
|
|
1643
|
+
<span>${t.label}</span>
|
|
1648
1644
|
</div>
|
|
1649
1645
|
`))}
|
|
1650
1646
|
</div>
|
|
1651
|
-
`:
|
|
1647
|
+
`:e`
|
|
1652
1648
|
<div class="titles-container">
|
|
1653
1649
|
<h2 id="popup-title" class="popup-title">${this.title}</h2>
|
|
1654
1650
|
<p id="popup-description" class="popup-description">${this.description}</p>
|
|
@@ -1674,7 +1670,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1674
1670
|
`}
|
|
1675
1671
|
</div>
|
|
1676
1672
|
</div>
|
|
1677
|
-
`}};a([
|
|
1673
|
+
`}};a([L({type:Boolean,reflect:!0}),n("design:type",Object)],rt.prototype,"open",void 0),a([L({type:String}),n("design:type",String)],rt.prototype,"type",void 0),a([L({type:String}),n("design:type",Object)],rt.prototype,"icon",void 0),a([L({type:String}),n("design:type",Object)],rt.prototype,"title",void 0),a([L({type:String}),n("design:type",Object)],rt.prototype,"description",void 0),a([L({type:String}),n("design:type",Object)],rt.prototype,"width",void 0),a([L({type:String}),n("design:type",Object)],rt.prototype,"buttonText",void 0),a([L({type:String}),n("design:type",Object)],rt.prototype,"confirmText",void 0),a([L({type:String}),n("design:type",Object)],rt.prototype,"cancelText",void 0),a([L({type:Array}),n("design:type",Array)],rt.prototype,"stackedActions",void 0),rt=a([l("custom-popup")],rt);let st=class extends t{constructor(){super(...arguments),this.value=0,this.max=5}static{this.styles=o`
|
|
1678
1674
|
:host {
|
|
1679
1675
|
display: inline-block;
|
|
1680
1676
|
width: 64px;
|
|
@@ -1687,7 +1683,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1687
1683
|
}
|
|
1688
1684
|
|
|
1689
1685
|
.circle-text {
|
|
1690
|
-
${
|
|
1686
|
+
${z};
|
|
1691
1687
|
text-align: center;
|
|
1692
1688
|
vertical-align: middle;
|
|
1693
1689
|
fill: var(--randstad-dark-blue-40);
|
|
@@ -1703,7 +1699,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1703
1699
|
stroke: var(--primary-light-blue);
|
|
1704
1700
|
stroke-linecap: round;
|
|
1705
1701
|
}
|
|
1706
|
-
`}render(){const
|
|
1702
|
+
`}render(){const t=2*Math.PI*28,i=Math.max(this.max,1),o=t*(1-Math.min(this.value/i,1));return e`
|
|
1707
1703
|
<svg
|
|
1708
1704
|
viewBox="0 0 64 64"
|
|
1709
1705
|
role="img"
|
|
@@ -1726,7 +1722,7 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1726
1722
|
r="${28}"
|
|
1727
1723
|
stroke-width="${6}"
|
|
1728
1724
|
fill="none"
|
|
1729
|
-
stroke-dasharray="${
|
|
1725
|
+
stroke-dasharray="${t}"
|
|
1730
1726
|
stroke-dashoffset="${o}"
|
|
1731
1727
|
transform="rotate(-90 32 32)"
|
|
1732
1728
|
/>
|
|
@@ -1735,18 +1731,18 @@ function A(e,t){return(t,i,o)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1735
1731
|
${this.value} de ${this.max}
|
|
1736
1732
|
</text>
|
|
1737
1733
|
</svg>
|
|
1738
|
-
`}};a([
|
|
1734
|
+
`}};a([L({type:Number}),n("design:type",Object)],st.prototype,"value",void 0),a([L({type:Number}),n("design:type",Object)],st.prototype,"max",void 0),st=a([l("progress-circle")],st);
|
|
1739
1735
|
/**
|
|
1740
1736
|
* @license
|
|
1741
1737
|
* Copyright 2023 Google LLC
|
|
1742
1738
|
* SPDX-License-Identifier: Apache-2.0
|
|
1743
1739
|
*/
|
|
1744
|
-
const
|
|
1740
|
+
const at=Symbol("attachableController");let nt;r||(nt=new MutationObserver((t=>{for(const e of t)e.target[at]?.hostConnected()})));class lt{get htmlFor(){return this.host.getAttribute("for")}set htmlFor(t){null===t?this.host.removeAttribute("for"):this.host.setAttribute("for",t)}get control(){return this.host.hasAttribute("for")?this.htmlFor&&this.host.isConnected?this.host.getRootNode().querySelector(`#${this.htmlFor}`):null:this.currentControl||this.host.parentElement}set control(t){t?this.attach(t):this.detach()}constructor(t,e){this.host=t,this.onControlChange=e,this.currentControl=null,t.addController(this),t[at]=this,nt?.observe(t,{attributeFilter:["for"]})}attach(t){t!==this.currentControl&&(this.setCurrentControl(t),this.host.removeAttribute("for"))}detach(){this.setCurrentControl(null),this.host.setAttribute("for","")}hostConnected(){this.setCurrentControl(this.control)}hostDisconnected(){this.setCurrentControl(null)}setCurrentControl(t){this.onControlChange(this.currentControl,t),this.currentControl=t}}
|
|
1745
1741
|
/**
|
|
1746
1742
|
* @license
|
|
1747
1743
|
* Copyright 2021 Google LLC
|
|
1748
1744
|
* SPDX-License-Identifier: Apache-2.0
|
|
1749
|
-
*/const
|
|
1745
|
+
*/const dt=["focusin","focusout","pointerdown"];class ct extends t{constructor(){super(...arguments),this.visible=!1,this.inward=!1,this.attachableController=new lt(this,this.onControlChange.bind(this))}get htmlFor(){return this.attachableController.htmlFor}set htmlFor(t){this.attachableController.htmlFor=t}get control(){return this.attachableController.control}set control(t){this.attachableController.control=t}attach(t){this.attachableController.attach(t)}detach(){this.attachableController.detach()}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true")}handleEvent(t){if(!t[ht]){switch(t.type){default:return;case"focusin":this.visible=this.control?.matches(":focus-visible")??!1;break;case"focusout":case"pointerdown":this.visible=!1}t[ht]=!0}}onControlChange(t,e){if(!r)for(const i of dt)t?.removeEventListener(i,this),e?.addEventListener(i,this)}update(t){t.has("visible")&&this.dispatchEvent(new Event("visibility-changed")),super.update(t)}}a([L({type:Boolean,reflect:!0})],ct.prototype,"visible",void 0),a([L({type:Boolean,reflect:!0})],ct.prototype,"inward",void 0);const ht=Symbol("handledByFocusRing"),pt=o`:host{animation-delay:0s,calc(var(--md-focus-ring-duration, 600ms)*.25);animation-duration:calc(var(--md-focus-ring-duration, 600ms)*.25),calc(var(--md-focus-ring-duration, 600ms)*.75);animation-timing-function:cubic-bezier(0.2, 0, 0, 1);box-sizing:border-box;color:var(--md-focus-ring-color, var(--md-sys-color-secondary, #625b71));display:none;pointer-events:none;position:absolute}:host([visible]){display:flex}:host(:not([inward])){animation-name:outward-grow,outward-shrink;border-end-end-radius:calc(var(--md-focus-ring-shape-end-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-end-start-radius:calc(var(--md-focus-ring-shape-end-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-start-end-radius:calc(var(--md-focus-ring-shape-start-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-start-start-radius:calc(var(--md-focus-ring-shape-start-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));inset:calc(-1*var(--md-focus-ring-outward-offset, 2px));outline:var(--md-focus-ring-width, 3px) solid currentColor}:host([inward]){animation-name:inward-grow,inward-shrink;border-end-end-radius:calc(var(--md-focus-ring-shape-end-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-end-start-radius:calc(var(--md-focus-ring-shape-end-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-start-end-radius:calc(var(--md-focus-ring-shape-start-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-start-start-radius:calc(var(--md-focus-ring-shape-start-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border:var(--md-focus-ring-width, 3px) solid currentColor;inset:var(--md-focus-ring-inward-offset, 0px)}@keyframes outward-grow{from{outline-width:0}to{outline-width:var(--md-focus-ring-active-width, 8px)}}@keyframes outward-shrink{from{outline-width:var(--md-focus-ring-active-width, 8px)}}@keyframes inward-grow{from{border-width:0}to{border-width:var(--md-focus-ring-active-width, 8px)}}@keyframes inward-shrink{from{border-width:var(--md-focus-ring-active-width, 8px)}}@media(prefers-reduced-motion){:host{animation:none}}
|
|
1750
1746
|
`
|
|
1751
1747
|
/**
|
|
1752
1748
|
* @license
|
|
@@ -1757,81 +1753,81 @@ const ae=Symbol("attachableController");let se;r||(se=new MutationObserver((e=>{
|
|
|
1757
1753
|
* @license
|
|
1758
1754
|
* Copyright 2024 Google LLC
|
|
1759
1755
|
* SPDX-License-Identifier: Apache-2.0
|
|
1760
|
-
*/let
|
|
1756
|
+
*/let ut=class extends ct{};ut.styles=[pt],ut=a([l("md-focus-ring")],ut);
|
|
1761
1757
|
/**
|
|
1762
1758
|
* @license
|
|
1763
1759
|
* Copyright 2021 Google LLC
|
|
1764
1760
|
* SPDX-License-Identifier: Apache-2.0
|
|
1765
1761
|
*/
|
|
1766
|
-
const
|
|
1762
|
+
const gt="cubic-bezier(0.2, 0, 0, 1)";
|
|
1767
1763
|
/**
|
|
1768
1764
|
* @license
|
|
1769
1765
|
* Copyright 2022 Google LLC
|
|
1770
1766
|
* SPDX-License-Identifier: Apache-2.0
|
|
1771
|
-
*/var
|
|
1767
|
+
*/var mt;!function(t){t[t.INACTIVE=0]="INACTIVE",t[t.TOUCH_DELAY=1]="TOUCH_DELAY",t[t.HOLDING=2]="HOLDING",t[t.WAITING_FOR_CLICK=3]="WAITING_FOR_CLICK"}(mt||(mt={}));const bt=["click","contextmenu","pointercancel","pointerdown","pointerenter","pointerleave","pointerup"],yt=r?null:window.matchMedia("(forced-colors: active)");class vt extends t{constructor(){super(...arguments),this.disabled=!1,this.hovered=!1,this.pressed=!1,this.rippleSize="",this.rippleScale="",this.initialSize=0,this.state=mt.INACTIVE,this.checkBoundsAfterContextMenu=!1,this.attachableController=new lt(this,this.onControlChange.bind(this))}get htmlFor(){return this.attachableController.htmlFor}set htmlFor(t){this.attachableController.htmlFor=t}get control(){return this.attachableController.control}set control(t){this.attachableController.control=t}attach(t){this.attachableController.attach(t)}detach(){this.attachableController.detach()}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true")}render(){const t={hovered:this.hovered,pressed:this.pressed};return e`<div class="surface ${s(t)}"></div>`}update(t){t.has("disabled")&&this.disabled&&(this.hovered=!1,this.pressed=!1),super.update(t)}handlePointerenter(t){this.shouldReactToEvent(t)&&(this.hovered=!0)}handlePointerleave(t){this.shouldReactToEvent(t)&&(this.hovered=!1,this.state!==mt.INACTIVE&&this.endPressAnimation())}handlePointerup(t){if(this.shouldReactToEvent(t)){if(this.state!==mt.HOLDING)return this.state===mt.TOUCH_DELAY?(this.state=mt.WAITING_FOR_CLICK,void this.startPressAnimation(this.rippleStartEvent)):void 0;this.state=mt.WAITING_FOR_CLICK}}async handlePointerdown(t){if(this.shouldReactToEvent(t)){if(this.rippleStartEvent=t,!this.isTouch(t))return this.state=mt.WAITING_FOR_CLICK,void this.startPressAnimation(t);this.checkBoundsAfterContextMenu&&!this.inBounds(t)||(this.checkBoundsAfterContextMenu=!1,this.state=mt.TOUCH_DELAY,await new Promise((t=>{setTimeout(t,150)})),this.state===mt.TOUCH_DELAY&&(this.state=mt.HOLDING,this.startPressAnimation(t)))}}handleClick(){this.disabled||(this.state!==mt.WAITING_FOR_CLICK?this.state===mt.INACTIVE&&(this.startPressAnimation(),this.endPressAnimation()):this.endPressAnimation())}handlePointercancel(t){this.shouldReactToEvent(t)&&this.endPressAnimation()}handleContextmenu(){this.disabled||(this.checkBoundsAfterContextMenu=!0,this.endPressAnimation())}determineRippleSize(){const{height:t,width:e}=this.getBoundingClientRect(),i=Math.max(t,e),o=Math.max(.35*i,75),r=Math.floor(.2*i),s=Math.sqrt(e**2+t**2)+10;this.initialSize=r,this.rippleScale=""+(s+o)/r,this.rippleSize=`${r}px`}getNormalizedPointerEventCoords(t){const{scrollX:e,scrollY:i}=window,{left:o,top:r}=this.getBoundingClientRect(),s=e+o,a=i+r,{pageX:n,pageY:l}=t;return{x:n-s,y:l-a}}getTranslationCoordinates(t){const{height:e,width:i}=this.getBoundingClientRect(),o={x:(i-this.initialSize)/2,y:(e-this.initialSize)/2};let r;return r=t instanceof PointerEvent?this.getNormalizedPointerEventCoords(t):{x:i/2,y:e/2},r={x:r.x-this.initialSize/2,y:r.y-this.initialSize/2},{startPoint:r,endPoint:o}}startPressAnimation(t){if(!this.mdRoot)return;this.pressed=!0,this.growAnimation?.cancel(),this.determineRippleSize();const{startPoint:e,endPoint:i}=this.getTranslationCoordinates(t),o=`${e.x}px, ${e.y}px`,r=`${i.x}px, ${i.y}px`;this.growAnimation=this.mdRoot.animate({top:[0,0],left:[0,0],height:[this.rippleSize,this.rippleSize],width:[this.rippleSize,this.rippleSize],transform:[`translate(${o}) scale(1)`,`translate(${r}) scale(${this.rippleScale})`]},{pseudoElement:"::after",duration:450,easing:gt,fill:"forwards"})}async endPressAnimation(){this.rippleStartEvent=void 0,this.state=mt.INACTIVE;const t=this.growAnimation;let e=1/0;"number"==typeof t?.currentTime?e=t.currentTime:t?.currentTime&&(e=t.currentTime.to("ms").value),e>=225?this.pressed=!1:(await new Promise((t=>{setTimeout(t,225-e)})),this.growAnimation===t&&(this.pressed=!1))}shouldReactToEvent(t){if(this.disabled||!t.isPrimary)return!1;if(this.rippleStartEvent&&this.rippleStartEvent.pointerId!==t.pointerId)return!1;if("pointerenter"===t.type||"pointerleave"===t.type)return!this.isTouch(t);const e=1===t.buttons;return this.isTouch(t)||e}inBounds({x:t,y:e}){const{top:i,left:o,bottom:r,right:s}=this.getBoundingClientRect();return t>=o&&t<=s&&e>=i&&e<=r}isTouch({pointerType:t}){return"touch"===t}async handleEvent(t){if(!yt?.matches)switch(t.type){case"click":this.handleClick();break;case"contextmenu":this.handleContextmenu();break;case"pointercancel":this.handlePointercancel(t);break;case"pointerdown":await this.handlePointerdown(t);break;case"pointerenter":this.handlePointerenter(t);break;case"pointerleave":this.handlePointerleave(t);break;case"pointerup":this.handlePointerup(t)}}onControlChange(t,e){if(!r)for(const i of bt)t?.removeEventListener(i,this),e?.addEventListener(i,this)}}a([L({type:Boolean,reflect:!0})],vt.prototype,"disabled",void 0),a([B()],vt.prototype,"hovered",void 0),a([B()],vt.prototype,"pressed",void 0),a([j(".surface")],vt.prototype,"mdRoot",void 0);
|
|
1772
1768
|
/**
|
|
1773
1769
|
* @license
|
|
1774
1770
|
* Copyright 2024 Google LLC
|
|
1775
1771
|
* SPDX-License-Identifier: Apache-2.0
|
|
1776
1772
|
*/
|
|
1777
|
-
const
|
|
1773
|
+
const ft=o`:host{display:flex;margin:auto;pointer-events:none}:host([disabled]){display:none}@media(forced-colors: active){:host{display:none}}:host,.surface{border-radius:inherit;position:absolute;inset:0;overflow:hidden}.surface{-webkit-tap-highlight-color:rgba(0,0,0,0)}.surface::before,.surface::after{content:"";opacity:0;position:absolute}.surface::before{background-color:var(--md-ripple-hover-color, var(--md-sys-color-on-surface, #1d1b20));inset:0;transition:opacity 15ms linear,background-color 15ms linear}.surface::after{background:radial-gradient(closest-side, var(--md-ripple-pressed-color, var(--md-sys-color-on-surface, #1d1b20)) max(100% - 70px, 65%), transparent 100%);transform-origin:center center;transition:opacity 375ms linear}.hovered::before{background-color:var(--md-ripple-hover-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-ripple-hover-opacity, 0.08)}.pressed::after{opacity:var(--md-ripple-pressed-opacity, 0.12);transition-duration:105ms}
|
|
1778
1774
|
`
|
|
1779
1775
|
/**
|
|
1780
1776
|
* @license
|
|
1781
1777
|
* Copyright 2022 Google LLC
|
|
1782
1778
|
* SPDX-License-Identifier: Apache-2.0
|
|
1783
|
-
*/;let
|
|
1779
|
+
*/;let xt=class extends vt{};
|
|
1784
1780
|
/**
|
|
1785
1781
|
* @license
|
|
1786
1782
|
* Copyright 2021 Google LLC
|
|
1787
1783
|
* SPDX-License-Identifier: Apache-2.0
|
|
1788
1784
|
*/
|
|
1789
|
-
function
|
|
1785
|
+
function wt(t){return t.currentTarget===t.target&&(t.composedPath()[0]===t.target&&(!t.target.disabled&&!function(t){const e=kt;e&&(t.preventDefault(),t.stopImmediatePropagation());return async function(){kt=!0,await null,kt=!1}
|
|
1790
1786
|
/**
|
|
1791
1787
|
* @license
|
|
1792
1788
|
* Copyright 2023 Google LLC
|
|
1793
1789
|
* SPDX-License-Identifier: Apache-2.0
|
|
1794
|
-
*/(),
|
|
1790
|
+
*/(),e}(t)))}xt.styles=[ft],xt=a([l("md-ripple")],xt);let kt=!1;const $t=Symbol("internals"),St=Symbol("privateInternals");
|
|
1795
1791
|
/**
|
|
1796
1792
|
* @license
|
|
1797
1793
|
* Copyright 2023 Google LLC
|
|
1798
1794
|
* SPDX-License-Identifier: Apache-2.0
|
|
1799
1795
|
*/
|
|
1800
|
-
const
|
|
1796
|
+
const Ct=Symbol("createValidator"),Dt=Symbol("getValidityAnchor"),Et=Symbol("privateValidator"),Mt=Symbol("privateSyncValidity"),Ot=Symbol("privateCustomValidationMessage");
|
|
1801
1797
|
/**
|
|
1802
1798
|
* @license
|
|
1803
1799
|
* Copyright 2023 Google LLC
|
|
1804
1800
|
* SPDX-License-Identifier: Apache-2.0
|
|
1805
1801
|
*/
|
|
1806
|
-
const
|
|
1802
|
+
const Ft=Symbol("isFocusable"),Pt=Symbol("privateIsFocusable"),Tt=Symbol("externalTabIndex"),Lt=Symbol("isUpdatingTabIndex"),Bt=Symbol("updateTabIndex");
|
|
1807
1803
|
/**
|
|
1808
1804
|
* @license
|
|
1809
1805
|
* Copyright 2023 Google LLC
|
|
1810
1806
|
* SPDX-License-Identifier: Apache-2.0
|
|
1811
1807
|
*/
|
|
1812
|
-
const
|
|
1808
|
+
const jt=Symbol("getFormValue"),At=Symbol("getFormState");
|
|
1813
1809
|
/**
|
|
1814
1810
|
* @license
|
|
1815
1811
|
* Copyright 2023 Google LLC
|
|
1816
1812
|
* SPDX-License-Identifier: Apache-2.0
|
|
1817
1813
|
*/
|
|
1818
|
-
class
|
|
1814
|
+
class zt{constructor(t){this.getCurrentState=t,this.currentValidity={validity:{},validationMessage:""}}getValidity(){const t=this.getCurrentState();if(!(!this.prevState||!this.equals(this.prevState,t)))return this.currentValidity;const{validity:e,validationMessage:i}=this.computeValidity(t);return this.prevState=this.copy(t),this.currentValidity={validationMessage:i,validity:{badInput:e.badInput,customError:e.customError,patternMismatch:e.patternMismatch,rangeOverflow:e.rangeOverflow,rangeUnderflow:e.rangeUnderflow,stepMismatch:e.stepMismatch,tooLong:e.tooLong,tooShort:e.tooShort,typeMismatch:e.typeMismatch,valueMissing:e.valueMissing}},this.currentValidity}}
|
|
1819
1815
|
/**
|
|
1820
1816
|
* @license
|
|
1821
1817
|
* Copyright 2023 Google LLC
|
|
1822
1818
|
* SPDX-License-Identifier: Apache-2.0
|
|
1823
|
-
*/class
|
|
1819
|
+
*/class Wt extends zt{computeValidity(t){this.radioElement||(this.radioElement=document.createElement("input"),this.radioElement.type="radio",this.radioElement.name="group");let e=!1,i=!1;for(const{checked:o,required:r}of t)r&&(e=!0),o&&(i=!0);return this.radioElement.checked=i,this.radioElement.required=e,{validity:{valueMissing:e&&!i},validationMessage:this.radioElement.validationMessage}}equals(t,e){if(t.length!==e.length)return!1;for(let i=0;i<t.length;i++){const o=t[i],r=e[i];if(o.checked!==r.checked||o.required!==r.required)return!1}return!0}copy(t){return t.map((({checked:t,required:e})=>({checked:t,required:e})))}}
|
|
1824
1820
|
/**
|
|
1825
1821
|
* @license
|
|
1826
1822
|
* Copyright 2022 Google LLC
|
|
1827
1823
|
* SPDX-License-Identifier: Apache-2.0
|
|
1828
|
-
*/class
|
|
1824
|
+
*/class It{get controls(){const t=this.host.getAttribute("name");return t&&this.root&&this.host.isConnected?Array.from(this.root.querySelectorAll(`[name="${t}"]`)):[this.host]}constructor(t){this.host=t,this.focused=!1,this.root=null,this.handleFocusIn=()=>{this.focused=!0,this.updateTabIndices()},this.handleFocusOut=()=>{this.focused=!1,this.updateTabIndices()},this.handleKeyDown=t=>{const e="ArrowDown"===t.key,i="ArrowUp"===t.key,o="ArrowLeft"===t.key,r="ArrowRight"===t.key;if(!(o||r||e||i))return;const s=this.controls;if(!s.length)return;t.preventDefault();const a="rtl"===getComputedStyle(this.host).direction?o||e:r||e,n=s.indexOf(this.host);let l=a?n+1:n-1;for(;l!==n;){l>=s.length?l=0:l<0&&(l=s.length-1);const t=s[l];if(!t.hasAttribute("disabled")){for(const e of s)e!==t&&(e.checked=!1,e.tabIndex=-1,e.blur());t.checked=!0,t.tabIndex=0,t.focus(),t.dispatchEvent(new Event("change",{bubbles:!0}));break}a?l++:l--}}}hostConnected(){this.root=this.host.getRootNode(),this.host.addEventListener("keydown",this.handleKeyDown),this.host.addEventListener("focusin",this.handleFocusIn),this.host.addEventListener("focusout",this.handleFocusOut),this.host.checked&&this.uncheckSiblings(),this.updateTabIndices()}hostDisconnected(){this.host.removeEventListener("keydown",this.handleKeyDown),this.host.removeEventListener("focusin",this.handleFocusIn),this.host.removeEventListener("focusout",this.handleFocusOut),this.updateTabIndices(),this.root=null}handleCheckedChange(){this.host.checked&&(this.uncheckSiblings(),this.updateTabIndices())}uncheckSiblings(){for(const t of this.controls)t!==this.host&&(t.checked=!1)}updateTabIndices(){const t=this.controls,e=t.find((t=>t.checked));if(e||this.focused){const i=e||this.host;i.tabIndex=0;for(const e of t)e!==i&&(e.tabIndex=-1)}else for(const e of t)e.tabIndex=0}}
|
|
1829
1825
|
/**
|
|
1830
1826
|
* @license
|
|
1831
1827
|
* Copyright 2018 Google LLC
|
|
1832
1828
|
* SPDX-License-Identifier: Apache-2.0
|
|
1833
|
-
*/var
|
|
1834
|
-
<div class="container ${
|
|
1829
|
+
*/var Nt;const _t=Symbol("checked");let Rt=0;const Vt=function(t){var e;class i extends t{constructor(){super(...arguments),this[e]=""}get validity(){return this[Mt](),this[$t].validity}get validationMessage(){return this[Mt](),this[$t].validationMessage}get willValidate(){return this[Mt](),this[$t].willValidate}checkValidity(){return this[Mt](),this[$t].checkValidity()}reportValidity(){return this[Mt](),this[$t].reportValidity()}setCustomValidity(t){this[Ot]=t,this[Mt]()}requestUpdate(t,e,i){super.requestUpdate(t,e,i),this[Mt]()}firstUpdated(t){super.firstUpdated(t),this[Mt]()}[(e=Ot,Mt)](){if(r)return;this[Et]||(this[Et]=this[Ct]());const{validity:t,validationMessage:e}=this[Et].getValidity(),i=!!this[Ot],o=this[Ot]||e;this[$t].setValidity({...t,customError:i},o,this[Dt]()??void 0)}[Ct](){throw new Error("Implement [createValidator]")}[Dt](){throw new Error("Implement [getValidityAnchor]")}}return i}(function(t){class e extends t{get form(){return this[$t].form}get labels(){return this[$t].labels}get name(){return this.getAttribute("name")??""}set name(t){this.setAttribute("name",t)}get disabled(){return this.hasAttribute("disabled")}set disabled(t){this.toggleAttribute("disabled",t)}attributeChangedCallback(t,e,i){if("name"!==t&&"disabled"!==t)super.attributeChangedCallback(t,e,i);else{const i="disabled"===t?null!==e:e;this.requestUpdate(t,i)}}requestUpdate(t,e,i){super.requestUpdate(t,e,i),this[$t].setFormValue(this[jt](),this[At]())}[jt](){throw new Error("Implement [getFormValue]")}[At](){return this[jt]()}formDisabledCallback(t){this.disabled=t}}return e.formAssociated=!0,a([L({noAccessor:!0})],e.prototype,"name",null),a([L({type:Boolean,noAccessor:!0})],e.prototype,"disabled",null),e}((Ut=function(t){var e,i,o;class r extends t{constructor(){super(...arguments),this[e]=!0,this[i]=null,this[o]=!1}get[Ft](){return this[Pt]}set[Ft](t){this[Ft]!==t&&(this[Pt]=t,this[Bt]())}connectedCallback(){super.connectedCallback(),this[Bt]()}attributeChangedCallback(t,e,i){if("tabindex"===t){if(this.requestUpdate("tabIndex",Number(e??-1)),!this[Lt])return this.hasAttribute("tabindex")?void(this[Tt]=this.tabIndex):(this[Tt]=null,void this[Bt]())}else super.attributeChangedCallback(t,e,i)}[(e=Pt,i=Tt,o=Lt,Bt)](){const t=this[Ft]?0:-1,e=this[Tt]??t;this[Lt]=!0,this.tabIndex=e,this[Lt]=!1}}return a([L({noAccessor:!0})],r.prototype,"tabIndex",void 0),r}(t),class extends Ut{get[$t](){return this[St]||(this[St]=this.attachInternals()),this[St]}})));var Ut;class qt extends Vt{get checked(){return this[_t]}set checked(t){const e=this.checked;e!==t&&(this[_t]=t,this.requestUpdate("checked",e),this.selectionController.handleCheckedChange())}constructor(){super(),this.maskId="cutout"+ ++Rt,this[Nt]=!1,this.required=!1,this.value="on",this.selectionController=new It(this),this.addController(this.selectionController),r||(this[$t].role="radio",this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.handleKeydown.bind(this)))}render(){const t={checked:this.checked};return e`
|
|
1830
|
+
<div class="container ${s(t)}" aria-hidden="true">
|
|
1835
1831
|
<md-ripple
|
|
1836
1832
|
part="ripple"
|
|
1837
1833
|
.control=${this}
|
|
@@ -1853,19 +1849,19 @@ class Ie{constructor(e){this.getCurrentState=e,this.currentValidity={validity:{}
|
|
|
1853
1849
|
|
|
1854
1850
|
<div class="touch-target"></div>
|
|
1855
1851
|
</div>
|
|
1856
|
-
`}updated(){this[$
|
|
1852
|
+
`}updated(){this[$t].ariaChecked=String(this.checked)}async handleClick(t){this.disabled||(await 0,t.defaultPrevented||(wt(t)&&this.focus(),this.checked=!0,this.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new InputEvent("input",{bubbles:!0,composed:!0}))))}async handleKeydown(t){await 0," "!==t.key||t.defaultPrevented||this.click()}[(Nt=_t,jt)](){return this.checked?this.value:null}[At](){return String(this.checked)}formResetCallback(){this.checked=this.hasAttribute("checked")}formStateRestoreCallback(t){this.checked="true"===t}[Ct](){return new Wt((()=>this.selectionController?this.selectionController.controls:[this]))}[Dt](){return this.container}}a([L({type:Boolean})],qt.prototype,"checked",null),a([L({type:Boolean})],qt.prototype,"required",void 0),a([L()],qt.prototype,"value",void 0),a([j(".container")],qt.prototype,"container",void 0);
|
|
1857
1853
|
/**
|
|
1858
1854
|
* @license
|
|
1859
1855
|
* Copyright 2024 Google LLC
|
|
1860
1856
|
* SPDX-License-Identifier: Apache-2.0
|
|
1861
1857
|
*/
|
|
1862
|
-
const
|
|
1858
|
+
const Yt=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20px);outline:none;position:relative;vertical-align:top;width:var(--md-radio-icon-size, 20px);-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer;--md-ripple-hover-color: var(--md-radio-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-hover-opacity: var(--md-radio-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-pressed-opacity: var(--md-radio-pressed-state-layer-opacity, 0.12)}:host([disabled]){cursor:default}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--md-radio-icon-size, 20px))/2)}.container{display:flex;height:100%;place-content:center;place-items:center;width:100%}md-focus-ring{height:44px;inset:unset;width:44px}.checked{--md-ripple-hover-color: var(--md-radio-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-hover-opacity: var(--md-radio-selected-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-radio-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-pressed-opacity: var(--md-radio-selected-pressed-state-layer-opacity, 0.12)}.touch-target{height:48px;position:absolute;width:48px}:host([touch-target=none]) .touch-target{display:none}md-ripple{border-radius:50%;height:var(--md-radio-state-layer-size, 40px);inset:unset;width:var(--md-radio-state-layer-size, 40px)}.icon{fill:var(--md-radio-icon-color, var(--md-sys-color-on-surface-variant, #49454f));inset:0;position:absolute}.outer.circle{transition:fill 50ms linear}.inner.circle{opacity:0;transform-origin:center;transition:opacity 50ms linear}.checked .icon{fill:var(--md-radio-selected-icon-color, var(--md-sys-color-primary, #6750a4))}.checked .inner.circle{animation:inner-circle-grow 300ms cubic-bezier(0.05, 0.7, 0.1, 1);opacity:1}@keyframes inner-circle-grow{from{transform:scale(0)}to{transform:scale(1)}}:host([disabled]) .circle{animation-duration:0s;transition-duration:0s}:host(:hover) .icon{fill:var(--md-radio-hover-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:focus-within) .icon{fill:var(--md-radio-focus-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host(:active) .icon{fill:var(--md-radio-pressed-icon-color, var(--md-sys-color-on-surface, #1d1b20))}:host([disabled]) .icon{fill:var(--md-radio-disabled-unselected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-unselected-icon-opacity, 0.38)}:host(:hover) .checked .icon{fill:var(--md-radio-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:focus-within) .checked .icon{fill:var(--md-radio-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4))}:host(:active) .checked .icon{fill:var(--md-radio-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4))}:host([disabled]) .checked .icon{fill:var(--md-radio-disabled-selected-icon-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-radio-disabled-selected-icon-opacity, 0.38)}}@layer hcm{@media(forced-colors: active){.icon{fill:CanvasText}:host([disabled]) .icon{fill:GrayText;opacity:1}}}
|
|
1863
1859
|
`
|
|
1864
1860
|
/**
|
|
1865
1861
|
* @license
|
|
1866
1862
|
* Copyright 2022 Google LLC
|
|
1867
1863
|
* SPDX-License-Identifier: Apache-2.0
|
|
1868
|
-
*/;let
|
|
1864
|
+
*/;let Ht=class extends qt{};Ht.styles=[Yt],Ht=a([l("md-radio")],Ht);let Gt=class extends t{constructor(){super(...arguments),this.name="radio-group",this.checked=!1,this.disabled=!1,this.error=!1}static{this.styles=o`
|
|
1869
1865
|
:host {
|
|
1870
1866
|
font-family: "Graphik", sans-serif;
|
|
1871
1867
|
}
|
|
@@ -1919,11 +1915,11 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
1919
1915
|
color: #9FA3B3;
|
|
1920
1916
|
cursor: default;
|
|
1921
1917
|
}
|
|
1922
|
-
`}render(){const
|
|
1918
|
+
`}render(){const t=[this.checked?"checked":"",this.error?"error":"",this.disabled?"disabled":""].join(" ");return e`
|
|
1923
1919
|
<label class="radio-container ${this.disabled?"disabled":""}">
|
|
1924
1920
|
<md-radio
|
|
1925
1921
|
name=${this.name}
|
|
1926
|
-
class=${
|
|
1922
|
+
class=${t}
|
|
1927
1923
|
?checked=${this.checked}
|
|
1928
1924
|
?disabled=${this.disabled}
|
|
1929
1925
|
>
|
|
@@ -1931,7 +1927,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
1931
1927
|
|
|
1932
1928
|
<span>${this.checked?"On":"Off"} ${this.error?"Error":""}</span>
|
|
1933
1929
|
</label>
|
|
1934
|
-
`}};a([
|
|
1930
|
+
`}};a([L({type:String}),n("design:type",Object)],Gt.prototype,"name",void 0),a([L({type:Boolean}),n("design:type",Object)],Gt.prototype,"checked",void 0),a([L({type:Boolean}),n("design:type",Object)],Gt.prototype,"disabled",void 0),a([L({type:Boolean}),n("design:type",Object)],Gt.prototype,"error",void 0),Gt=a([l("custom-radio")],Gt);let Xt=class extends A{constructor(){super(...arguments),this.value="",this.defaultValue="",this.options=[],this.filterable=!0,this.isMobile=!1,this.highlightedIndex=-1,this._isCleared=!1,this.filteredOptions=[],this.filterValue="",this.isOpen=!1,this.mobileFilterValue="",this.debounceTimeout=null,this.updateResponsiveModeBound=this.updateResponsiveMode.bind(this)}static{this.styles=[J,o`
|
|
1935
1931
|
${K}
|
|
1936
1932
|
${Q}
|
|
1937
1933
|
${X}
|
|
@@ -2043,7 +2039,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2043
2039
|
}
|
|
2044
2040
|
|
|
2045
2041
|
.filter-input {
|
|
2046
|
-
${
|
|
2042
|
+
${N};
|
|
2047
2043
|
padding: 16px;
|
|
2048
2044
|
padding-right: 40px;
|
|
2049
2045
|
border: none;
|
|
@@ -2064,8 +2060,8 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2064
2060
|
}
|
|
2065
2061
|
|
|
2066
2062
|
.filter-input::placeholder {
|
|
2067
|
-
${
|
|
2068
|
-
|
|
2063
|
+
${N};
|
|
2064
|
+
color: var( --filter-text-color, var( --secondary-color-40 ) );
|
|
2069
2065
|
}
|
|
2070
2066
|
|
|
2071
2067
|
.icon-button {
|
|
@@ -2109,7 +2105,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2109
2105
|
}
|
|
2110
2106
|
|
|
2111
2107
|
.options-list li {
|
|
2112
|
-
${
|
|
2108
|
+
${N};
|
|
2113
2109
|
padding: 8px 16px 8px 16px;
|
|
2114
2110
|
cursor: pointer;
|
|
2115
2111
|
color: var(--secondary-color-80);
|
|
@@ -2179,14 +2175,14 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2179
2175
|
}
|
|
2180
2176
|
|
|
2181
2177
|
.filter-fake {
|
|
2182
|
-
${
|
|
2178
|
+
${N};
|
|
2183
2179
|
padding: 15px;
|
|
2184
2180
|
padding-right: 40px;
|
|
2185
2181
|
width: 100%;
|
|
2186
2182
|
background: white;
|
|
2187
2183
|
box-sizing: border-box;
|
|
2188
2184
|
cursor: pointer;
|
|
2189
|
-
|
|
2185
|
+
color: var( --filter-text-color, var( --secondary-color-80 ) );
|
|
2190
2186
|
white-space: nowrap;
|
|
2191
2187
|
overflow: hidden;
|
|
2192
2188
|
text-overflow: ellipsis;
|
|
@@ -2249,21 +2245,21 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2249
2245
|
margin-right: 8px;
|
|
2250
2246
|
flex-shrink: 0;
|
|
2251
2247
|
}
|
|
2252
|
-
`]}update(
|
|
2248
|
+
`]}update(t){if(t.has("options")&&(this.filteredOptions=[...this.options]),t.has("defaultValue")||t.has("options")||t.has("value")){if(this._isCleared)return void super.update(t);const e=this.value||this.defaultValue,i=this.options.find((t=>"string"==typeof t?t===e:t.value===e));i?(this.filterValue="string"==typeof i?i:i.label,this.value="string"==typeof i?i:i.value):(this.filterValue="",this.value="")}super.update(t)}connectedCallback(){super.connectedCallback(),this.updateResponsiveMode(),window.addEventListener("resize",this.updateResponsiveModeBound),document.addEventListener("click",this.handleClickOutside.bind(this))}disconnectedCallback(){window.removeEventListener("resize",this.updateResponsiveModeBound),document.removeEventListener("click",this.handleClickOutside.bind(this)),super.disconnectedCallback()}updateResponsiveMode(){this.isMobile=window.innerWidth<=940}handleInputClick(t){this.isMobile&&(this.mobileFilterValue=""),this.disabled||(this.isOpen=!this.isOpen,this.requestUpdate())}handleInput(t){if(!this.filterable)return;this._isCleared=!1;const e=t.target.value,i=this.maxLength?e.slice(0,this.maxLength).toLowerCase():e.toLowerCase();this.filterValue=i,this.value="",this.filteredOptions=this.options.filter((t=>("string"==typeof t?t:t.label).toLowerCase().includes(this.filterValue.toLowerCase()))),this.isOpen=!0,this.debounceTimeout&&clearTimeout(this.debounceTimeout),this.debounceTimeout=window.setTimeout((()=>{this.filterValue.length>2&&this.dispatchEvent(new CustomEvent("filter-location",{detail:{value:this.filterValue},bubbles:!0,composed:!0}))}),300),this.requestUpdate()}handleMobileInput(t){this._isCleared=!1;const e=t.target.value,i=this.maxLength?e.slice(0,this.maxLength).toLowerCase():e.toLowerCase();this.mobileFilterValue=i,this.value="",this.filteredOptions=this.options.filter((t=>("string"==typeof t?t:t.label).toLowerCase().includes(i))),this.debounceTimeout&&clearTimeout(this.debounceTimeout),this.debounceTimeout=window.setTimeout((()=>{i.length>2&&this.dispatchEvent(new CustomEvent("filter-location",{detail:{value:i},bubbles:!0,composed:!0}))}),300)}handleSelect(t){this._isCleared=!1;const e="string"==typeof t?t:t.value;this.dispatchEvent(new CustomEvent("option-selected",{detail:{value:e},bubbles:!0,composed:!0})),this.filterValue="string"==typeof t?t:t.label,this.value=e,this.isOpen=!1,this.requestUpdate()}handleIconClick(){this.disabled||(this.filterable&&this.filterValue?(this._isCleared=!0,this.filterValue="",this.value="",this.filteredOptions=[...this.options],this.dispatchEvent(new CustomEvent("option-selected",{detail:{value:""},bubbles:!0,composed:!0})),this.isOpen=!1):this.isOpen=!this.isOpen,this.requestUpdate())}handleClickOutside(t){const e=t.target;e instanceof Node&&(this.contains(e)||(this.isOpen=!1,this.requestUpdate()))}handleKeyDown(t){const{key:e}=t;if(!this.isOpen&&("Enter"===e||" "===e))return t.preventDefault(),void(this.isOpen=!0);if(this.isOpen)if("ArrowDown"===e)t.preventDefault(),this.highlightedIndex=Math.min(this.highlightedIndex+1,this.filteredOptions.length-1),this.requestUpdate();else if("ArrowUp"===e)t.preventDefault(),this.highlightedIndex=Math.max(this.highlightedIndex-1,0),this.requestUpdate();else if("Enter"===e){t.preventDefault();const e=this.filteredOptions[this.highlightedIndex];e&&this.handleSelect(e)}else"Escape"===e&&(t.preventDefault(),this.isOpen=!1)}renderSelectedIcon(){const t=this.options.find((t=>"string"==typeof t?t===this.value:t.value===this.value));return t&&"string"!=typeof t&&t.icon&&"string"==typeof t.icon?e`<span class="icon-selected" .innerHTML="${t.icon}"></span>`:i}renderOptionIcon(t){return t&&"string"==typeof t?e`<span class="icon-list" .innerHTML="${t}"></span>`:i}render(){const t=this.isMobile,o=` --filter-text-color: ${this.value?"var( --secondary-color )":"var( --secondary-color-40 )"}; `,r=e`
|
|
2253
2249
|
<randstad-icon
|
|
2254
2250
|
name="${this.isOpen&&this.filteredOptions.length>0?"arrow_up":"arrow_down"}"
|
|
2255
2251
|
size="24px"
|
|
2256
2252
|
.color=${"var( --primary-color )"}
|
|
2257
2253
|
>
|
|
2258
2254
|
</randstad-icon>
|
|
2259
|
-
`;return
|
|
2260
|
-
<div class="select-container" style="${this.labelColor?` --label-color: ${this.labelColor}
|
|
2255
|
+
`;return e`
|
|
2256
|
+
<div class="select-container" style="${this.labelColor?` --label-color: ${this.labelColor};`:""} ${o}">
|
|
2261
2257
|
${this.renderLabelContainer()}
|
|
2262
2258
|
|
|
2263
2259
|
<div class="list-container">
|
|
2264
|
-
<div class="input-container ${this.isOpen?"focused":""} ${this.isOpen&&this.filteredOptions.length>0?"open":""} ${
|
|
2260
|
+
<div class="input-container ${this.isOpen?"focused":""} ${this.isOpen&&this.filteredOptions.length>0?"open":""} ${t?"mobile":""}">
|
|
2265
2261
|
<div class="input-wrapper ${this.disabled?"disabled":""}">
|
|
2266
|
-
${e
|
|
2262
|
+
${t?e`
|
|
2267
2263
|
<div
|
|
2268
2264
|
class="filter-fake"
|
|
2269
2265
|
@click="${this.handleInputClick}"
|
|
@@ -2278,7 +2274,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2278
2274
|
${this.renderSelectedIcon()}
|
|
2279
2275
|
<span class="value-text">${this.filterValue||this.placeholder}</span>
|
|
2280
2276
|
</div>
|
|
2281
|
-
`:
|
|
2277
|
+
`:e`
|
|
2282
2278
|
${this.renderSelectedIcon()}
|
|
2283
2279
|
|
|
2284
2280
|
<input
|
|
@@ -2299,20 +2295,20 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2299
2295
|
@click="${this.handleIconClick}"
|
|
2300
2296
|
?disabled="${this.disabled}"
|
|
2301
2297
|
>
|
|
2302
|
-
${this.filterable&&this.filterValue?
|
|
2298
|
+
${this.filterable&&this.filterValue?e`<randstad-icon name="close" size="24px"></randstad-icon>`:r}
|
|
2303
2299
|
</button>
|
|
2304
2300
|
</div>
|
|
2305
2301
|
|
|
2306
|
-
${!
|
|
2302
|
+
${!t&&this.isOpen&&this.filteredOptions.length>0?e`
|
|
2307
2303
|
<ul class="options-list">
|
|
2308
|
-
${this.filteredOptions.map(((
|
|
2304
|
+
${this.filteredOptions.map(((t,i)=>{const o="string"==typeof t?t:t.label,r="object"==typeof t&&t.disabled,s="object"==typeof t?t.icon:void 0;return e`
|
|
2309
2305
|
<li
|
|
2310
2306
|
class="${r?"disabled":""} ${i===this.highlightedIndex?"highlighted":""}"
|
|
2311
2307
|
role="option"
|
|
2312
2308
|
aria-selected="${i===this.highlightedIndex}"
|
|
2313
|
-
@click="${()=>{r||this.handleSelect(
|
|
2309
|
+
@click="${()=>{r||this.handleSelect(t)}}"
|
|
2314
2310
|
>
|
|
2315
|
-
${this.renderOptionIcon(
|
|
2311
|
+
${this.renderOptionIcon(s)}
|
|
2316
2312
|
${o}
|
|
2317
2313
|
</li>
|
|
2318
2314
|
`}))}
|
|
@@ -2326,14 +2322,14 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2326
2322
|
${this.renderHelper()}
|
|
2327
2323
|
</div>
|
|
2328
2324
|
|
|
2329
|
-
${
|
|
2325
|
+
${t&&this.isOpen?e`
|
|
2330
2326
|
<div class="mobile-backdrop" @click="${()=>{this.isOpen=!1}}">
|
|
2331
|
-
<div class="mobile-modal" @click="${
|
|
2327
|
+
<div class="mobile-modal" @click="${t=>t.stopPropagation()}">
|
|
2332
2328
|
<div class="modal-input-container">
|
|
2333
2329
|
<input
|
|
2334
2330
|
class="filter-input"
|
|
2335
2331
|
.value="${this.mobileFilterValue||""}"
|
|
2336
|
-
@input=${
|
|
2332
|
+
@input=${t=>this.handleMobileInput(t)}
|
|
2337
2333
|
placeholder="${this.placeholder}"
|
|
2338
2334
|
maxlength="${this.maxLength??""}"
|
|
2339
2335
|
/>
|
|
@@ -2343,14 +2339,14 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2343
2339
|
</div>
|
|
2344
2340
|
|
|
2345
2341
|
<ul class="options-list">
|
|
2346
|
-
${this.filteredOptions.map(((
|
|
2342
|
+
${this.filteredOptions.map(((t,i)=>{const o="string"==typeof t?t:t.label,r="object"==typeof t&&t.disabled,s="object"==typeof t?t.icon:void 0;return e`
|
|
2347
2343
|
<li
|
|
2348
2344
|
class="${r?"disabled":""} ${i===this.highlightedIndex?"highlighted":""}"
|
|
2349
2345
|
role="option"
|
|
2350
2346
|
aria-selected="${i===this.highlightedIndex}"
|
|
2351
|
-
@click="${()=>{r||this.handleSelect(
|
|
2347
|
+
@click="${()=>{r||this.handleSelect(t)}}"
|
|
2352
2348
|
>
|
|
2353
|
-
${this.renderOptionIcon(
|
|
2349
|
+
${this.renderOptionIcon(s)}
|
|
2354
2350
|
${o}
|
|
2355
2351
|
</li>
|
|
2356
2352
|
`}))}
|
|
@@ -2358,7 +2354,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2358
2354
|
</div>
|
|
2359
2355
|
</div>
|
|
2360
2356
|
`:i}
|
|
2361
|
-
`}};a([
|
|
2357
|
+
`}};a([L({type:Object}),n("design:type",Object)],Xt.prototype,"value",void 0),a([L({type:String,attribute:"default-value"}),n("design:type",Object)],Xt.prototype,"defaultValue",void 0),a([L({type:Array}),n("design:type",Array)],Xt.prototype,"options",void 0),a([L({type:Boolean}),n("design:type",Object)],Xt.prototype,"filterable",void 0),a([L({type:Number}),n("design:type",Number)],Xt.prototype,"maxLength",void 0),a([B(),n("design:type",Boolean)],Xt.prototype,"isMobile",void 0),a([B(),n("design:type",Object)],Xt.prototype,"highlightedIndex",void 0),a([B(),n("design:type",Boolean)],Xt.prototype,"_isCleared",void 0),a([B(),n("design:type",Array)],Xt.prototype,"filteredOptions",void 0),a([B(),n("design:type",Object)],Xt.prototype,"filterValue",void 0),a([B(),n("design:type",Object)],Xt.prototype,"isOpen",void 0),a([B(),n("design:type",Object)],Xt.prototype,"mobileFilterValue",void 0),Xt=a([l("filterable-select")],Xt);const Kt=new CSSStyleSheet;Kt.replaceSync("\n @font-face {\n font-family: 'Graphik';\n src: url('/src/assets/font/Graphik-Regular.woff2') format('woff2'),\n url('/src/assets/font/Graphik-Regular.woff') format('woff'),\n url('/src/assets/font/Graphik-Regular.eot') format('embedded-opentype');\n font-weight: normal;\n font-style: normal;\n }\n\n .body-s {\n font-weight: 400;\n font-size: 14px;\n line-height: 100%;\n letter-spacing: 0%;\n color: green;\n }\n\n .body-l {\n font-family: Graphik;\n font-size: 18px;\n font-style: normal;\n font-weight: 400;\n line-height: 30px;\n }\n");class Qt extends t{static{this.styles=[Kt,o`
|
|
2362
2358
|
:host {
|
|
2363
2359
|
display: flex;
|
|
2364
2360
|
position: fixed;
|
|
@@ -2428,7 +2424,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2428
2424
|
}
|
|
2429
2425
|
|
|
2430
2426
|
.container {
|
|
2431
|
-
${
|
|
2427
|
+
${W};
|
|
2432
2428
|
display: flex;
|
|
2433
2429
|
align-items: center;
|
|
2434
2430
|
box-sizing: border-box;
|
|
@@ -2485,16 +2481,16 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2485
2481
|
.informative {
|
|
2486
2482
|
background-color: var(--ui-informative);
|
|
2487
2483
|
}
|
|
2488
|
-
`]}static get properties(){return{type:{type:String},icon:{type:String},message:{type:String},open:{type:Boolean},position:{type:String,reflect:!0}}}constructor(){super(),this.type="informative",this.icon="info",this.message="Este es un mensaje.",this.open=!1,this.position="bottom-center",this.isMobile=!1,this.updateResponsiveStyles=this.updateResponsiveStyles.bind(this)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.updateResponsiveStyles),this.updateResponsiveStyles()}disconnectedCallback(){window.removeEventListener("resize",this.updateResponsiveStyles),super.disconnectedCallback()}updateResponsiveStyles(){const
|
|
2484
|
+
`]}static get properties(){return{type:{type:String},icon:{type:String},message:{type:String},open:{type:Boolean},position:{type:String,reflect:!0}}}constructor(){super(),this.type="informative",this.icon="info",this.message="Este es un mensaje.",this.open=!1,this.position="bottom-center",this.isMobile=!1,this.updateResponsiveStyles=this.updateResponsiveStyles.bind(this)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.updateResponsiveStyles),this.updateResponsiveStyles()}disconnectedCallback(){window.removeEventListener("resize",this.updateResponsiveStyles),super.disconnectedCallback()}updateResponsiveStyles(){const t=window.innerWidth<=940;this.classList.toggle("mobile",t)}render(){const t="error"===this.type||"warning"===this.type?"alert":"status";return e`
|
|
2489
2485
|
<div
|
|
2490
2486
|
class="container ${this.open?"":"hidden"} ${this.type}"
|
|
2491
|
-
role="${
|
|
2487
|
+
role="${t}"
|
|
2492
2488
|
aria-live="polite"
|
|
2493
2489
|
>
|
|
2494
2490
|
<randstad-icon name=${this.icon} size="24px" color="white"></randstad-icon>
|
|
2495
2491
|
<span class="message">${this.message}</span>
|
|
2496
2492
|
</div>
|
|
2497
|
-
`}}customElements.define("randstad-snackbar",
|
|
2493
|
+
`}}customElements.define("randstad-snackbar",Qt);let Jt=class extends t{constructor(){super(...arguments),this.totalSteps=4,this.currentStep=0}static{this.styles=o`
|
|
2498
2494
|
.stepper {
|
|
2499
2495
|
display: flex;
|
|
2500
2496
|
gap: 20px;
|
|
@@ -2581,20 +2577,20 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2581
2577
|
-webkit-font-smoothing: antialiased;
|
|
2582
2578
|
-moz-osx-font-smoothing: grayscale;
|
|
2583
2579
|
}
|
|
2584
|
-
`}render(){return
|
|
2580
|
+
`}render(){return e`
|
|
2585
2581
|
<div class="stepper">
|
|
2586
|
-
${Array.from({length:this.totalSteps},((
|
|
2582
|
+
${Array.from({length:this.totalSteps},((t,i)=>e`
|
|
2587
2583
|
<div
|
|
2588
2584
|
class="step ${i<this.currentStep?"completed":i===this.currentStep?"active":""}"
|
|
2589
2585
|
>
|
|
2590
|
-
${i<this.currentStep?
|
|
2586
|
+
${i<this.currentStep?e`<randstad-icon name="tick-circle" size="16px"></randstad-icon>`:i===this.currentStep?e`
|
|
2591
2587
|
<span class="pulse-circle"></span>
|
|
2592
2588
|
<span class="inner-circle"></span>
|
|
2593
|
-
`:
|
|
2589
|
+
`:e`<span class="inner-circle"></span>`}
|
|
2594
2590
|
</div>
|
|
2595
2591
|
`))}
|
|
2596
2592
|
</div>
|
|
2597
|
-
`}};a([
|
|
2593
|
+
`}};a([L({type:Number}),n("design:type",Object)],Jt.prototype,"totalSteps",void 0),a([L({type:Number}),n("design:type",Object)],Jt.prototype,"currentStep",void 0),Jt=a([l("custom-stepper")],Jt);let Zt=class extends t{constructor(){super(...arguments),this.tabs=[],this.selected="",this.internalSelected="",this.showPrev=!1,this.showNext=!1,this.SCROLL_OFFSET=56,this.handleScroll=()=>{const t=this.renderRoot.querySelector(".tab-wrapper");if(!t)return;const{scrollLeft:e,scrollWidth:i,clientWidth:o}=t;this.showPrev=e>0,this.showNext=e+o<i-1}}static{this.styles=o`
|
|
2598
2594
|
:host {
|
|
2599
2595
|
display: block;
|
|
2600
2596
|
border-bottom: 1px solid #E7E8EC;
|
|
@@ -2607,7 +2603,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2607
2603
|
}
|
|
2608
2604
|
|
|
2609
2605
|
.tab {
|
|
2610
|
-
${
|
|
2606
|
+
${_};
|
|
2611
2607
|
display: flex;
|
|
2612
2608
|
gap: 8px;
|
|
2613
2609
|
flex-direction: row;
|
|
@@ -2705,45 +2701,45 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2705
2701
|
|
|
2706
2702
|
@media (max-width: 940px) {
|
|
2707
2703
|
.tab {
|
|
2708
|
-
${
|
|
2704
|
+
${I};
|
|
2709
2705
|
padding: 16px;
|
|
2710
2706
|
}
|
|
2711
2707
|
}
|
|
2712
|
-
`}firstUpdated(){this.handleScroll()}updated(
|
|
2708
|
+
`}firstUpdated(){this.handleScroll()}updated(t){t.has("selected")&&(this.internalSelected=this.selected)}selectTab(t){this.internalSelected=t;const e=this.tabs.find((e=>e.value===t));e&&this.dispatchEvent(new CustomEvent("tab-change",{detail:e,bubbles:!0,composed:!0}))}scrollTabsLeft(){const t=this.renderRoot.querySelector(".tab-wrapper");if(!t)return;const e=t.scrollLeft,i=Array.from(t.querySelectorAll(".tab"));for(let o=i.length-1;o>=0;o--){const r=i[o].offsetLeft;if(r<e+this.SCROLL_OFFSET-1){const e=r-this.SCROLL_OFFSET;t.scrollTo({left:e,behavior:"smooth"});break}}setTimeout((()=>this.handleScroll()),300)}scrollTabsRight(){const t=this.renderRoot.querySelector(".tab-wrapper");if(!t)return;const e=t.scrollLeft,i=Array.from(t.querySelectorAll(".tab"));for(const o of i)if(o.offsetLeft>e+this.SCROLL_OFFSET){const e=o.offsetLeft-this.SCROLL_OFFSET;t.scrollTo({left:e,behavior:"smooth"});break}setTimeout((()=>this.handleScroll()),300)}render(){return e`
|
|
2713
2709
|
<div class="scroll-container">
|
|
2714
|
-
${this.showPrev?
|
|
2710
|
+
${this.showPrev?e`
|
|
2715
2711
|
<button class="scroll-button prev" @click=${this.scrollTabsLeft}>
|
|
2716
2712
|
<randstad-icon name="arrow_left" size="36px"></randstad-icon>
|
|
2717
2713
|
</button>
|
|
2718
2714
|
`:null}
|
|
2719
2715
|
|
|
2720
2716
|
<div class="tab-wrapper" @scroll=${this.handleScroll}>
|
|
2721
|
-
${this.tabs.map((e
|
|
2722
|
-
<div class="tab ${this.internalSelected===
|
|
2723
|
-
@click=${()=>this.selectTab(
|
|
2724
|
-
<img src="/assets/icons/${
|
|
2725
|
-
<span>${
|
|
2717
|
+
${this.tabs.map((t=>e`
|
|
2718
|
+
<div class="tab ${this.internalSelected===t.value?"active":""}"
|
|
2719
|
+
@click=${()=>this.selectTab(t.value)}>
|
|
2720
|
+
<img src="/assets/icons/${t.icon}" alt="${t.label}" />
|
|
2721
|
+
<span>${t.label}</span>
|
|
2726
2722
|
</div>
|
|
2727
2723
|
`))}
|
|
2728
2724
|
</div>
|
|
2729
2725
|
|
|
2730
|
-
${this.showNext?
|
|
2726
|
+
${this.showNext?e`
|
|
2731
2727
|
<button class="scroll-button next" @click=${this.scrollTabsRight}>
|
|
2732
2728
|
<randstad-icon name="arrow_right" size="36px"></randstad-icon>
|
|
2733
2729
|
</button>
|
|
2734
2730
|
`:null}
|
|
2735
2731
|
</div>
|
|
2736
|
-
`}};a([
|
|
2737
|
-
${this.loading?
|
|
2732
|
+
`}};a([L({type:Array}),n("design:type",Array)],Zt.prototype,"tabs",void 0),a([L({type:String}),n("design:type",String)],Zt.prototype,"selected",void 0),a([B(),n("design:type",String)],Zt.prototype,"internalSelected",void 0),a([B(),n("design:type",Object)],Zt.prototype,"showPrev",void 0),a([B(),n("design:type",Object)],Zt.prototype,"showNext",void 0),Zt=a([l("tabs-bar")],Zt);let te=class extends A{constructor(){super(...arguments),this.files=[],this.simulatedDelay=0,this.loading=!1,this.progress=0,this.errorTextMessage=null}baseGetTextMaxFileSize(t){return t/1048576}getReadableFileTypes(t,e){const i=t.map((t=>e[t]||t));if(i.length<=1)return i.join("");const o=i.pop();return`${i.join(", ")} y ${o}`}validateFiles(t,e,i,o,r,s){const a=e>0,n=i.length>0;for(const l of t){if(n&&!i.includes(l.type))return this.setError(s,o),!1;if(a&&l.size>e)return this.setError(s,r),!1}return!0}async baseHandleFiles(t,e){const{baseMaxFiles:i,maxFileSize:o,acceptedFileTypes:r,errorMessageType:s,errorMessageSize:a,typeError:n}=e;if(this.setError(n,null),!t||this.disabled||this.loading)return;const l=Array.isArray(this.files)?this.files:[],d=Number.isFinite(i)&&i>0?i:1,c=d-l.length;if(c<=0){const t=`se ha alcanzado el número máximo de archivos (${d}).`;return void this.setError(n,t)}const h=Array.from(t).slice(0,c);if(0===h.length)return;if(!this.validateFiles(h,o,r,s,a,n))return;const p=this.simulatedDelay??0;if(p<=0)return this.files=[...l,...h],void this.dispatchEvent(new CustomEvent("files-changed",{detail:this.files}));this.loading=!0,this.progress=0,await this.updateComplete;const u=Date.now(),g=setInterval((()=>{const t=Date.now()-u,e=Math.min(Math.round(t/p*100),100);this.progress=e,this.progress>=100&&(clearInterval(g),this.files=[...l,...h],this.loading=!1,this.progress=0,this.dispatchEvent(new CustomEvent("files-changed",{detail:this.files})))}),10);this.fileInput&&(this.fileInput.value="")}baseOnFileInputChange(t,e){const i=t.target;this.baseHandleFiles(i.files,e),this.fileInput&&(this.fileInput.value="")}removeFile(t,e){this.files=this.files.filter(((e,i)=>i!==t)),this.dispatchEvent(new CustomEvent("files-changed",{detail:this.files})),0===this.files.length&&this.setError(e,null)}setError(t="file",e){"file"===t&&(this.error=!!e,this.errorMessage=e),"image"===t&&(this.errorTextMessage=e)}renderLoadingContainer(t){return e`
|
|
2733
|
+
${this.loading?e`
|
|
2738
2734
|
<div class="progress-bar-container">
|
|
2739
2735
|
<div class="progress-bar" role="progressbar" aria-label="Subiendo archivo…">
|
|
2740
2736
|
<div class="progress-bar-fill" style="width: ${this.progress}%;"></div>
|
|
2741
2737
|
</div>
|
|
2742
2738
|
</div>
|
|
2743
|
-
`:
|
|
2744
|
-
${
|
|
2739
|
+
`:e`
|
|
2740
|
+
${t}
|
|
2745
2741
|
`}
|
|
2746
|
-
`}};a([
|
|
2742
|
+
`}};a([L({type:Array}),n("design:type",Array)],te.prototype,"files",void 0),a([L({type:Number}),n("design:type",Object)],te.prototype,"simulatedDelay",void 0),a([B(),n("design:type",Object)],te.prototype,"loading",void 0),a([B(),n("design:type",Object)],te.prototype,"progress",void 0),a([B(),n("design:type",Object)],te.prototype,"errorTextMessage",void 0),a([j('input[ type="file" ]'),n("design:type",HTMLInputElement)],te.prototype,"fileInput",void 0),te=a([l("base-upload")],te);const ee={"image/jpg":".jpg","image/jpeg":".jpeg","image/png":".png"},ie={"application/pdf":".pdf","application/msword":".doc","application/vnd.openxmlformats-officedocument.wordprocessingml.document":".docx",...ee,"text/plain":".txt"},oe=o`
|
|
2747
2743
|
.progress-bar-container {
|
|
2748
2744
|
min-height: 23px;
|
|
2749
2745
|
display: flex;
|
|
@@ -2763,13 +2759,20 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2763
2759
|
background-color: var( --primary-color );
|
|
2764
2760
|
transition: width 0.1s ease;
|
|
2765
2761
|
}
|
|
2766
|
-
|
|
2767
|
-
${
|
|
2762
|
+
`;let re=class extends te{constructor(){super(...arguments),this.acceptedFileTypes=[],this.maxFiles=3,this.maxFileSize=0,this.isDragging=!1,this.imageUrls=[],this.isMaxFilesReached=!1}static{this.styles=o`
|
|
2763
|
+
${K}
|
|
2764
|
+
${oe}
|
|
2768
2765
|
|
|
2769
2766
|
:host {
|
|
2770
2767
|
font-family: 'Graphik', sans-serif;
|
|
2771
2768
|
}
|
|
2772
2769
|
|
|
2770
|
+
.image-container {
|
|
2771
|
+
display: flex;
|
|
2772
|
+
flex-direction: column;
|
|
2773
|
+
gap: 8px;
|
|
2774
|
+
}
|
|
2775
|
+
|
|
2773
2776
|
.upload-component-wrapper {
|
|
2774
2777
|
display: flex;
|
|
2775
2778
|
flex-direction: column;
|
|
@@ -2805,28 +2808,28 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2805
2808
|
}
|
|
2806
2809
|
|
|
2807
2810
|
.text-main {
|
|
2808
|
-
${
|
|
2811
|
+
${W};
|
|
2809
2812
|
text-align: center;
|
|
2810
2813
|
vertical-align: middle;
|
|
2811
2814
|
color: var( --secondary-color-80 );
|
|
2812
2815
|
}
|
|
2813
2816
|
|
|
2814
2817
|
.text-secondary {
|
|
2815
|
-
${
|
|
2818
|
+
${z};
|
|
2816
2819
|
text-align: center;
|
|
2817
2820
|
vertical-align: middle;
|
|
2818
2821
|
color: var( --secondary-color-60 );
|
|
2819
2822
|
}
|
|
2820
2823
|
|
|
2821
2824
|
.text-tertiary {
|
|
2822
|
-
${
|
|
2825
|
+
${z};
|
|
2823
2826
|
text-align: center;
|
|
2824
2827
|
vertical-align: middle;
|
|
2825
2828
|
color: var( --secondary-color-40 );
|
|
2826
2829
|
}
|
|
2827
2830
|
|
|
2828
2831
|
.button {
|
|
2829
|
-
${
|
|
2832
|
+
${z};
|
|
2830
2833
|
background-color: var( --primary-color );
|
|
2831
2834
|
border: none;
|
|
2832
2835
|
padding: 4px 16px;
|
|
@@ -2885,7 +2888,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2885
2888
|
.text-main.error {
|
|
2886
2889
|
color: var(--ui-negative, #E00F0F);
|
|
2887
2890
|
}
|
|
2888
|
-
`}getFileConfig(){const
|
|
2891
|
+
`}getFileConfig(){const t="tu archivo no es válido",e=this.maxFileSize>0,i=this.acceptedFileTypes.length>0;return{baseMaxFiles:this.maxFiles,maxFileSize:this.maxFileSize,acceptedFileTypes:this.acceptedFileTypes,errorMessageType:i?t:"",errorMessageSize:e?t:"",typeError:"image"}}getTextAcceptedFileTypes(){return this.getReadableFileTypes(this.acceptedFileTypes,ee)}getTextMaxFileSize(){return this.baseGetTextMaxFileSize(this.maxFileSize)}updated(t){t.has("files")&&this.files&&(this.imageUrls.forEach((t=>URL.revokeObjectURL(t))),this.imageUrls=this.files.map((t=>URL.createObjectURL(t))))}disconnectedCallback(){super.disconnectedCallback(),this.imageUrls.forEach((t=>URL.revokeObjectURL(t)))}async handleFiles(t){await this.baseHandleFiles(t,this.getFileConfig())}onFileInputChange(t){this.baseOnFileInputChange(t,this.getFileConfig())}onDrop(t){t.preventDefault(),this.disabled||(this.isDragging=!1,this.handleFiles(t.dataTransfer?.files||null))}onDragOver(t){t.preventDefault(),this.disabled||(this.isDragging=!0)}onDragLeave(t){t.preventDefault(),this.disabled||(this.isDragging=!1)}willUpdate(t){t.has("files")&&(this.isMaxFilesReached=(this.files||[]).length>=3)}render(){const t=this.disabled||this.isMaxFilesReached,o=this.disabled,r=this.maxFileSize>0,s=this.acceptedFileTypes.length>0,a=r?` / max. ${this.getTextMaxFileSize()}MB`:"",n=s?this.getTextAcceptedFileTypes():"",l=this.errorTextMessage||`subí hasta ${this.maxFiles} imágenes`,d=this.errorTextMessage?"assets/img/image-upload-error.svg":t?"assets/img/image-upload-disabled.svg":"assets/img/image-upload-circle.svg",c=`container ${this.isDragging?"dragging":""} ${this.errorTextMessage?"error":""}`,h=e`
|
|
2889
2892
|
<label class="button">
|
|
2890
2893
|
agregar archivo
|
|
2891
2894
|
|
|
@@ -2894,56 +2897,60 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2894
2897
|
accept=${this.acceptedFileTypes.join(",")}
|
|
2895
2898
|
?multiple=${this.maxFiles>1}
|
|
2896
2899
|
@change="${this.onFileInputChange}"
|
|
2897
|
-
?disabled="${
|
|
2900
|
+
?disabled="${t}"
|
|
2898
2901
|
/>
|
|
2899
2902
|
</label>
|
|
2900
|
-
`;return
|
|
2901
|
-
<div class="
|
|
2902
|
-
${this.
|
|
2903
|
-
|
|
2904
|
-
|
|
2905
|
-
|
|
2906
|
-
|
|
2907
|
-
|
|
2908
|
-
<
|
|
2909
|
-
|
|
2910
|
-
|
|
2911
|
-
|
|
2912
|
-
|
|
2913
|
-
|
|
2914
|
-
|
|
2915
|
-
|
|
2916
|
-
|
|
2917
|
-
|
|
2918
|
-
|
|
2903
|
+
`;return e`
|
|
2904
|
+
<div class="image-container" style="${this.labelColor?` --label-color: ${this.labelColor}`:""}">
|
|
2905
|
+
${this.label?e` ${this.renderLabelContainer()} `:i}
|
|
2906
|
+
|
|
2907
|
+
<div class="upload-component-wrapper">
|
|
2908
|
+
${this.imageUrls.length>0?e`
|
|
2909
|
+
<div class="image-gallery">
|
|
2910
|
+
${this.imageUrls.map(((t,i)=>e`
|
|
2911
|
+
<div class="image-item">
|
|
2912
|
+
<img src="${t}" loading="lazy" alt="Uploaded image" />
|
|
2913
|
+
|
|
2914
|
+
<randstad-button
|
|
2915
|
+
.variant=${"button-icon"}
|
|
2916
|
+
.iconName=${"trash"}
|
|
2917
|
+
@click=${()=>this.removeFile(i,"image")}
|
|
2918
|
+
?disabled=${o}
|
|
2919
|
+
>
|
|
2920
|
+
</randstad-button>
|
|
2921
|
+
</div>
|
|
2922
|
+
`))}
|
|
2923
|
+
</div>
|
|
2924
|
+
`:""}
|
|
2919
2925
|
|
|
2920
|
-
|
|
2921
|
-
|
|
2922
|
-
|
|
2923
|
-
|
|
2924
|
-
|
|
2925
|
-
|
|
2926
|
-
|
|
2927
|
-
|
|
2928
|
-
|
|
2929
|
-
|
|
2930
|
-
|
|
2931
|
-
|
|
2926
|
+
<div
|
|
2927
|
+
class="${c}"
|
|
2928
|
+
?disabled="${t}"
|
|
2929
|
+
@drop="${this.onDrop}"
|
|
2930
|
+
@dragover="${this.onDragOver}"
|
|
2931
|
+
@dragleave="${this.onDragLeave}"
|
|
2932
|
+
>
|
|
2933
|
+
<img
|
|
2934
|
+
class="icon"
|
|
2935
|
+
src=${d}
|
|
2936
|
+
alt="Subir imagen"
|
|
2937
|
+
/>
|
|
2938
|
+
|
|
2939
|
+
<div class="text-container">
|
|
2940
|
+
<div class="text-main ${this.errorTextMessage?"error":""}">${l}</div>
|
|
2932
2941
|
|
|
2933
|
-
|
|
2934
|
-
|
|
2942
|
+
<div class="text-secondary">
|
|
2943
|
+
Podés agregar un archivo o arrastrar y soltar acá
|
|
2944
|
+
</div>
|
|
2935
2945
|
|
|
2936
|
-
|
|
2937
|
-
Podés agregar un archivo o arrastrar y soltar acá
|
|
2946
|
+
<div class="text-tertiary">${n}${a}</div>
|
|
2938
2947
|
</div>
|
|
2939
2948
|
|
|
2940
|
-
|
|
2949
|
+
${this.renderLoadingContainer(h)}
|
|
2941
2950
|
</div>
|
|
2942
|
-
|
|
2943
|
-
${this.renderLoadingContainer(a)}
|
|
2944
2951
|
</div>
|
|
2945
2952
|
</div>
|
|
2946
|
-
`}};a([P({type:Array}),s("design:type",Array)],rt.prototype,"acceptedFileTypes",void 0),a([P({type:Number}),s("design:type",Object)],rt.prototype,"maxFiles",void 0),a([P({type:Number}),s("design:type",Object)],rt.prototype,"maxFileSize",void 0),a([z(),s("design:type",Object)],rt.prototype,"isDragging",void 0),a([z(),s("design:type",Array)],rt.prototype,"imageUrls",void 0),a([z(),s("design:type",Boolean)],rt.prototype,"isMaxFilesReached",void 0),rt=a([d("upload-image")],rt);const nt=6048e5,at=Symbol.for("constructDateFrom");function st(e,t){return"function"==typeof e?e(t):e&&"object"==typeof e&&at in e?e[at](t):e instanceof Date?new e.constructor(t):new Date(t)}function dt(e,t){return st(t||e,e)}function lt(e,t,i){const o=dt(e,i?.in);if(isNaN(t))return st(e,NaN);if(!t)return o;const r=o.getDate(),n=st(e,o.getTime());n.setMonth(o.getMonth()+t+1,0);return r>=n.getDate()?n:(o.setFullYear(n.getFullYear(),n.getMonth(),r),o)}let ct={};function pt(){return ct}function ht(e,t){const i=pt(),o=t?.weekStartsOn??t?.locale?.options?.weekStartsOn??i.weekStartsOn??i.locale?.options?.weekStartsOn??0,r=dt(e,t?.in),n=r.getDay(),a=(n<o?7:0)+n-o;return r.setDate(r.getDate()-a),r.setHours(0,0,0,0),r}function ut(e,t){return ht(e,{...t,weekStartsOn:1})}function bt(e,t){const i=dt(e,t?.in),o=i.getFullYear(),r=st(i,0);r.setFullYear(o+1,0,4),r.setHours(0,0,0,0);const n=ut(r),a=st(i,0);a.setFullYear(o,0,4),a.setHours(0,0,0,0);const s=ut(a);return i.getTime()>=n.getTime()?o+1:i.getTime()>=s.getTime()?o:o-1}function gt(e){const t=dt(e),i=new Date(Date.UTC(t.getFullYear(),t.getMonth(),t.getDate(),t.getHours(),t.getMinutes(),t.getSeconds(),t.getMilliseconds()));return i.setUTCFullYear(t.getFullYear()),+e-+i}function mt(e,...t){const i=st.bind(null,t.find((e=>"object"==typeof e)));return t.map(i)}function yt(e,t){const i=dt(e,t?.in);return i.setHours(0,0,0,0),i}function vt(e,t,i){return lt(e,12*t,i)}function ft(e){return!(!((t=e)instanceof Date||"object"==typeof t&&"[object Date]"===Object.prototype.toString.call(t))&&"number"!=typeof e||isNaN(+dt(e)));var t}function xt(e,t){const i=dt(e,t?.in);return i.setDate(1),i.setHours(0,0,0,0),i}const wt={lessThanXSeconds:{one:"less than a second",other:"less than {{count}} seconds"},xSeconds:{one:"1 second",other:"{{count}} seconds"},halfAMinute:"half a minute",lessThanXMinutes:{one:"less than a minute",other:"less than {{count}} minutes"},xMinutes:{one:"1 minute",other:"{{count}} minutes"},aboutXHours:{one:"about 1 hour",other:"about {{count}} hours"},xHours:{one:"1 hour",other:"{{count}} hours"},xDays:{one:"1 day",other:"{{count}} days"},aboutXWeeks:{one:"about 1 week",other:"about {{count}} weeks"},xWeeks:{one:"1 week",other:"{{count}} weeks"},aboutXMonths:{one:"about 1 month",other:"about {{count}} months"},xMonths:{one:"1 month",other:"{{count}} months"},aboutXYears:{one:"about 1 year",other:"about {{count}} years"},xYears:{one:"1 year",other:"{{count}} years"},overXYears:{one:"over 1 year",other:"over {{count}} years"},almostXYears:{one:"almost 1 year",other:"almost {{count}} years"}};function kt(e){return(t={})=>{const i=t.width?String(t.width):e.defaultWidth;return e.formats[i]||e.formats[e.defaultWidth]}}const $t={date:kt({formats:{full:"EEEE, MMMM do, y",long:"MMMM do, y",medium:"MMM d, y",short:"MM/dd/yyyy"},defaultWidth:"full"}),time:kt({formats:{full:"h:mm:ss a zzzz",long:"h:mm:ss a z",medium:"h:mm:ss a",short:"h:mm a"},defaultWidth:"full"}),dateTime:kt({formats:{full:"{{date}} 'at' {{time}}",long:"{{date}} 'at' {{time}}",medium:"{{date}}, {{time}}",short:"{{date}}, {{time}}"},defaultWidth:"full"})},St={lastWeek:"'last' eeee 'at' p",yesterday:"'yesterday at' p",today:"'today at' p",tomorrow:"'tomorrow at' p",nextWeek:"eeee 'at' p",other:"P"};function Ct(e){return(t,i)=>{let o;if("formatting"===(i?.context?String(i.context):"standalone")&&e.formattingValues){const t=e.defaultFormattingWidth||e.defaultWidth,r=i?.width?String(i.width):t;o=e.formattingValues[r]||e.formattingValues[t]}else{const t=e.defaultWidth,r=i?.width?String(i.width):e.defaultWidth;o=e.values[r]||e.values[t]}return o[e.argumentCallback?e.argumentCallback(t):t]}}function Et(e){return(t,i={})=>{const o=i.width,r=o&&e.matchPatterns[o]||e.matchPatterns[e.defaultMatchWidth],n=t.match(r);if(!n)return null;const a=n[0],s=o&&e.parsePatterns[o]||e.parsePatterns[e.defaultParseWidth],d=Array.isArray(s)?function(e,t){for(let i=0;i<e.length;i++)if(t(e[i]))return i;return}(s,(e=>e.test(a))):function(e,t){for(const i in e)if(Object.prototype.hasOwnProperty.call(e,i)&&t(e[i]))return i;return}(s,(e=>e.test(a)));let l;l=e.valueCallback?e.valueCallback(d):d,l=i.valueCallback?i.valueCallback(l):l;return{value:l,rest:t.slice(a.length)}}}var Dt;const Mt={code:"en-US",formatDistance:(e,t,i)=>{let o;const r=wt[e];return o="string"==typeof r?r:1===t?r.one:r.other.replace("{{count}}",t.toString()),i?.addSuffix?i.comparison&&i.comparison>0?"in "+o:o+" ago":o},formatLong:$t,formatRelative:(e,t,i,o)=>St[e],localize:{ordinalNumber:(e,t)=>{const i=Number(e),o=i%100;if(o>20||o<10)switch(o%10){case 1:return i+"st";case 2:return i+"nd";case 3:return i+"rd"}return i+"th"},era:Ct({values:{narrow:["B","A"],abbreviated:["BC","AD"],wide:["Before Christ","Anno Domini"]},defaultWidth:"wide"}),quarter:Ct({values:{narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["1st quarter","2nd quarter","3rd quarter","4th quarter"]},defaultWidth:"wide",argumentCallback:e=>e-1}),month:Ct({values:{narrow:["J","F","M","A","M","J","J","A","S","O","N","D"],abbreviated:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],wide:["January","February","March","April","May","June","July","August","September","October","November","December"]},defaultWidth:"wide"}),day:Ct({values:{narrow:["S","M","T","W","T","F","S"],short:["Su","Mo","Tu","We","Th","Fr","Sa"],abbreviated:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],wide:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]},defaultWidth:"wide"}),dayPeriod:Ct({values:{narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"}},defaultWidth:"wide",formattingValues:{narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"}},defaultFormattingWidth:"wide"})},match:{ordinalNumber:(Dt={matchPattern:/^(\d+)(th|st|nd|rd)?/i,parsePattern:/\d+/i,valueCallback:e=>parseInt(e,10)},(e,t={})=>{const i=e.match(Dt.matchPattern);if(!i)return null;const o=i[0],r=e.match(Dt.parsePattern);if(!r)return null;let n=Dt.valueCallback?Dt.valueCallback(r[0]):r[0];return n=t.valueCallback?t.valueCallback(n):n,{value:n,rest:e.slice(o.length)}}),era:Et({matchPatterns:{narrow:/^(b|a)/i,abbreviated:/^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,wide:/^(before christ|before common era|anno domini|common era)/i},defaultMatchWidth:"wide",parsePatterns:{any:[/^b/i,/^(a|c)/i]},defaultParseWidth:"any"}),quarter:Et({matchPatterns:{narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](th|st|nd|rd)? quarter/i},defaultMatchWidth:"wide",parsePatterns:{any:[/1/i,/2/i,/3/i,/4/i]},defaultParseWidth:"any",valueCallback:e=>e+1}),month:Et({matchPatterns:{narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,wide:/^(january|february|march|april|may|june|july|august|september|october|november|december)/i},defaultMatchWidth:"wide",parsePatterns:{narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^may/i,/^jun/i,/^jul/i,/^au/i,/^s/i,/^o/i,/^n/i,/^d/i]},defaultParseWidth:"any"}),day:Et({matchPatterns:{narrow:/^[smtwf]/i,short:/^(su|mo|tu|we|th|fr|sa)/i,abbreviated:/^(sun|mon|tue|wed|thu|fri|sat)/i,wide:/^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i},defaultMatchWidth:"wide",parsePatterns:{narrow:[/^s/i,/^m/i,/^t/i,/^w/i,/^t/i,/^f/i,/^s/i],any:[/^su/i,/^m/i,/^tu/i,/^w/i,/^th/i,/^f/i,/^sa/i]},defaultParseWidth:"any"}),dayPeriod:Et({matchPatterns:{narrow:/^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,any:/^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i},defaultMatchWidth:"any",parsePatterns:{any:{am:/^a/i,pm:/^p/i,midnight:/^mi/i,noon:/^no/i,morning:/morning/i,afternoon:/afternoon/i,evening:/evening/i,night:/night/i}},defaultParseWidth:"any"})},options:{weekStartsOn:0,firstWeekContainsDate:1}};function Ot(e,t){const i=dt(e,t?.in),o=function(e,t){const[i,o]=mt(0,e,t),r=yt(i),n=yt(o),a=+r-gt(r),s=+n-gt(n);return Math.round((a-s)/864e5)}(i,function(e,t){const i=dt(e,t?.in);return i.setFullYear(i.getFullYear(),0,1),i.setHours(0,0,0,0),i}(i));return o+1}function Ft(e,t){const i=dt(e,t?.in),o=+ut(i)-+function(e,t){const i=bt(e,t),o=st(e,0);return o.setFullYear(i,0,4),o.setHours(0,0,0,0),ut(o)}(i);return Math.round(o/nt)+1}function Tt(e,t){const i=dt(e,t?.in),o=i.getFullYear(),r=pt(),n=t?.firstWeekContainsDate??t?.locale?.options?.firstWeekContainsDate??r.firstWeekContainsDate??r.locale?.options?.firstWeekContainsDate??1,a=st(t?.in||e,0);a.setFullYear(o+1,0,n),a.setHours(0,0,0,0);const s=ht(a,t),d=st(t?.in||e,0);d.setFullYear(o,0,n),d.setHours(0,0,0,0);const l=ht(d,t);return+i>=+s?o+1:+i>=+l?o:o-1}function jt(e,t){const i=dt(e,t?.in),o=+ht(i,t)-+function(e,t){const i=pt(),o=t?.firstWeekContainsDate??t?.locale?.options?.firstWeekContainsDate??i.firstWeekContainsDate??i.locale?.options?.firstWeekContainsDate??1,r=Tt(e,t),n=st(t?.in||e,0);return n.setFullYear(r,0,o),n.setHours(0,0,0,0),ht(n,t)}(i,t);return Math.round(o/nt)+1}function Pt(e,t){return(e<0?"-":"")+Math.abs(e).toString().padStart(t,"0")}const zt={y(e,t){const i=e.getFullYear(),o=i>0?i:1-i;return Pt("yy"===t?o%100:o,t.length)},M(e,t){const i=e.getMonth();return"M"===t?String(i+1):Pt(i+1,2)},d:(e,t)=>Pt(e.getDate(),t.length),a(e,t){const i=e.getHours()/12>=1?"pm":"am";switch(t){case"a":case"aa":return i.toUpperCase();case"aaa":return i;case"aaaaa":return i[0];default:return"am"===i?"a.m.":"p.m."}},h:(e,t)=>Pt(e.getHours()%12||12,t.length),H:(e,t)=>Pt(e.getHours(),t.length),m:(e,t)=>Pt(e.getMinutes(),t.length),s:(e,t)=>Pt(e.getSeconds(),t.length),S(e,t){const i=t.length,o=e.getMilliseconds();return Pt(Math.trunc(o*Math.pow(10,i-3)),t.length)}},At="midnight",Lt="noon",It="morning",_t="afternoon",Bt="evening",Rt="night",Nt={G:function(e,t,i){const o=e.getFullYear()>0?1:0;switch(t){case"G":case"GG":case"GGG":return i.era(o,{width:"abbreviated"});case"GGGGG":return i.era(o,{width:"narrow"});default:return i.era(o,{width:"wide"})}},y:function(e,t,i){if("yo"===t){const t=e.getFullYear(),o=t>0?t:1-t;return i.ordinalNumber(o,{unit:"year"})}return zt.y(e,t)},Y:function(e,t,i,o){const r=Tt(e,o),n=r>0?r:1-r;if("YY"===t){return Pt(n%100,2)}return"Yo"===t?i.ordinalNumber(n,{unit:"year"}):Pt(n,t.length)},R:function(e,t){return Pt(bt(e),t.length)},u:function(e,t){return Pt(e.getFullYear(),t.length)},Q:function(e,t,i){const o=Math.ceil((e.getMonth()+1)/3);switch(t){case"Q":return String(o);case"QQ":return Pt(o,2);case"Qo":return i.ordinalNumber(o,{unit:"quarter"});case"QQQ":return i.quarter(o,{width:"abbreviated",context:"formatting"});case"QQQQQ":return i.quarter(o,{width:"narrow",context:"formatting"});default:return i.quarter(o,{width:"wide",context:"formatting"})}},q:function(e,t,i){const o=Math.ceil((e.getMonth()+1)/3);switch(t){case"q":return String(o);case"qq":return Pt(o,2);case"qo":return i.ordinalNumber(o,{unit:"quarter"});case"qqq":return i.quarter(o,{width:"abbreviated",context:"standalone"});case"qqqqq":return i.quarter(o,{width:"narrow",context:"standalone"});default:return i.quarter(o,{width:"wide",context:"standalone"})}},M:function(e,t,i){const o=e.getMonth();switch(t){case"M":case"MM":return zt.M(e,t);case"Mo":return i.ordinalNumber(o+1,{unit:"month"});case"MMM":return i.month(o,{width:"abbreviated",context:"formatting"});case"MMMMM":return i.month(o,{width:"narrow",context:"formatting"});default:return i.month(o,{width:"wide",context:"formatting"})}},L:function(e,t,i){const o=e.getMonth();switch(t){case"L":return String(o+1);case"LL":return Pt(o+1,2);case"Lo":return i.ordinalNumber(o+1,{unit:"month"});case"LLL":return i.month(o,{width:"abbreviated",context:"standalone"});case"LLLLL":return i.month(o,{width:"narrow",context:"standalone"});default:return i.month(o,{width:"wide",context:"standalone"})}},w:function(e,t,i,o){const r=jt(e,o);return"wo"===t?i.ordinalNumber(r,{unit:"week"}):Pt(r,t.length)},I:function(e,t,i){const o=Ft(e);return"Io"===t?i.ordinalNumber(o,{unit:"week"}):Pt(o,t.length)},d:function(e,t,i){return"do"===t?i.ordinalNumber(e.getDate(),{unit:"date"}):zt.d(e,t)},D:function(e,t,i){const o=Ot(e);return"Do"===t?i.ordinalNumber(o,{unit:"dayOfYear"}):Pt(o,t.length)},E:function(e,t,i){const o=e.getDay();switch(t){case"E":case"EE":case"EEE":return i.day(o,{width:"abbreviated",context:"formatting"});case"EEEEE":return i.day(o,{width:"narrow",context:"formatting"});case"EEEEEE":return i.day(o,{width:"short",context:"formatting"});default:return i.day(o,{width:"wide",context:"formatting"})}},e:function(e,t,i,o){const r=e.getDay(),n=(r-o.weekStartsOn+8)%7||7;switch(t){case"e":return String(n);case"ee":return Pt(n,2);case"eo":return i.ordinalNumber(n,{unit:"day"});case"eee":return i.day(r,{width:"abbreviated",context:"formatting"});case"eeeee":return i.day(r,{width:"narrow",context:"formatting"});case"eeeeee":return i.day(r,{width:"short",context:"formatting"});default:return i.day(r,{width:"wide",context:"formatting"})}},c:function(e,t,i,o){const r=e.getDay(),n=(r-o.weekStartsOn+8)%7||7;switch(t){case"c":return String(n);case"cc":return Pt(n,t.length);case"co":return i.ordinalNumber(n,{unit:"day"});case"ccc":return i.day(r,{width:"abbreviated",context:"standalone"});case"ccccc":return i.day(r,{width:"narrow",context:"standalone"});case"cccccc":return i.day(r,{width:"short",context:"standalone"});default:return i.day(r,{width:"wide",context:"standalone"})}},i:function(e,t,i){const o=e.getDay(),r=0===o?7:o;switch(t){case"i":return String(r);case"ii":return Pt(r,t.length);case"io":return i.ordinalNumber(r,{unit:"day"});case"iii":return i.day(o,{width:"abbreviated",context:"formatting"});case"iiiii":return i.day(o,{width:"narrow",context:"formatting"});case"iiiiii":return i.day(o,{width:"short",context:"formatting"});default:return i.day(o,{width:"wide",context:"formatting"})}},a:function(e,t,i){const o=e.getHours()/12>=1?"pm":"am";switch(t){case"a":case"aa":return i.dayPeriod(o,{width:"abbreviated",context:"formatting"});case"aaa":return i.dayPeriod(o,{width:"abbreviated",context:"formatting"}).toLowerCase();case"aaaaa":return i.dayPeriod(o,{width:"narrow",context:"formatting"});default:return i.dayPeriod(o,{width:"wide",context:"formatting"})}},b:function(e,t,i){const o=e.getHours();let r;switch(r=12===o?Lt:0===o?At:o/12>=1?"pm":"am",t){case"b":case"bb":return i.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"bbb":return i.dayPeriod(r,{width:"abbreviated",context:"formatting"}).toLowerCase();case"bbbbb":return i.dayPeriod(r,{width:"narrow",context:"formatting"});default:return i.dayPeriod(r,{width:"wide",context:"formatting"})}},B:function(e,t,i){const o=e.getHours();let r;switch(r=o>=17?Bt:o>=12?_t:o>=4?It:Rt,t){case"B":case"BB":case"BBB":return i.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"BBBBB":return i.dayPeriod(r,{width:"narrow",context:"formatting"});default:return i.dayPeriod(r,{width:"wide",context:"formatting"})}},h:function(e,t,i){if("ho"===t){let t=e.getHours()%12;return 0===t&&(t=12),i.ordinalNumber(t,{unit:"hour"})}return zt.h(e,t)},H:function(e,t,i){return"Ho"===t?i.ordinalNumber(e.getHours(),{unit:"hour"}):zt.H(e,t)},K:function(e,t,i){const o=e.getHours()%12;return"Ko"===t?i.ordinalNumber(o,{unit:"hour"}):Pt(o,t.length)},k:function(e,t,i){let o=e.getHours();return 0===o&&(o=24),"ko"===t?i.ordinalNumber(o,{unit:"hour"}):Pt(o,t.length)},m:function(e,t,i){return"mo"===t?i.ordinalNumber(e.getMinutes(),{unit:"minute"}):zt.m(e,t)},s:function(e,t,i){return"so"===t?i.ordinalNumber(e.getSeconds(),{unit:"second"}):zt.s(e,t)},S:function(e,t){return zt.S(e,t)},X:function(e,t,i){const o=e.getTimezoneOffset();if(0===o)return"Z";switch(t){case"X":return Ut(o);case"XXXX":case"XX":return qt(o);default:return qt(o,":")}},x:function(e,t,i){const o=e.getTimezoneOffset();switch(t){case"x":return Ut(o);case"xxxx":case"xx":return qt(o);default:return qt(o,":")}},O:function(e,t,i){const o=e.getTimezoneOffset();switch(t){case"O":case"OO":case"OOO":return"GMT"+Vt(o,":");default:return"GMT"+qt(o,":")}},z:function(e,t,i){const o=e.getTimezoneOffset();switch(t){case"z":case"zz":case"zzz":return"GMT"+Vt(o,":");default:return"GMT"+qt(o,":")}},t:function(e,t,i){return Pt(Math.trunc(+e/1e3),t.length)},T:function(e,t,i){return Pt(+e,t.length)}};function Vt(e,t=""){const i=e>0?"-":"+",o=Math.abs(e),r=Math.trunc(o/60),n=o%60;return 0===n?i+String(r):i+String(r)+t+Pt(n,2)}function Ut(e,t){if(e%60==0){return(e>0?"-":"+")+Pt(Math.abs(e)/60,2)}return qt(e,t)}function qt(e,t=""){const i=e>0?"-":"+",o=Math.abs(e);return i+Pt(Math.trunc(o/60),2)+t+Pt(o%60,2)}const Yt=(e,t)=>{switch(e){case"P":return t.date({width:"short"});case"PP":return t.date({width:"medium"});case"PPP":return t.date({width:"long"});default:return t.date({width:"full"})}},Wt=(e,t)=>{switch(e){case"p":return t.time({width:"short"});case"pp":return t.time({width:"medium"});case"ppp":return t.time({width:"long"});default:return t.time({width:"full"})}},Ht={p:Wt,P:(e,t)=>{const i=e.match(/(P+)(p+)?/)||[],o=i[1],r=i[2];if(!r)return Yt(e,t);let n;switch(o){case"P":n=t.dateTime({width:"short"});break;case"PP":n=t.dateTime({width:"medium"});break;case"PPP":n=t.dateTime({width:"long"});break;default:n=t.dateTime({width:"full"})}return n.replace("{{date}}",Yt(o,t)).replace("{{time}}",Wt(r,t))}},Gt=/^D+$/,Xt=/^Y+$/,Kt=["D","DD","YY","YYYY"];const Qt=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,Jt=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,Zt=/^'([^]*?)'?$/,ei=/''/g,ti=/[a-zA-Z]/;function ii(e,t,i){const o=pt(),r=o.locale??Mt,n=o.firstWeekContainsDate??o.locale?.options?.firstWeekContainsDate??1,a=o.weekStartsOn??o.locale?.options?.weekStartsOn??0,s=dt(e,i?.in);if(!ft(s))throw new RangeError("Invalid time value");let d=t.match(Jt).map((e=>{const t=e[0];if("p"===t||"P"===t){return(0,Ht[t])(e,r.formatLong)}return e})).join("").match(Qt).map((e=>{if("''"===e)return{isToken:!1,value:"'"};const t=e[0];if("'"===t)return{isToken:!1,value:oi(e)};if(Nt[t])return{isToken:!0,value:e};if(t.match(ti))throw new RangeError("Format string contains an unescaped latin alphabet character `"+t+"`");return{isToken:!1,value:e}}));r.localize.preprocessor&&(d=r.localize.preprocessor(s,d));const l={firstWeekContainsDate:n,weekStartsOn:a,locale:r};return d.map((i=>{if(!i.isToken)return i.value;const o=i.value;(function(e){return Xt.test(e)}(o)||function(e){return Gt.test(e)}(o))&&function(e,t,i){const o=function(e,t,i){const o="Y"===e[0]?"years":"days of the month";return`Use \`${e.toLowerCase()}\` instead of \`${e}\` (in \`${t}\`) for formatting ${o} to the input \`${i}\`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md`}(e,t,i);if(console.warn(o),Kt.includes(e))throw new RangeError(o)}(o,t,String(e));return(0,Nt[o[0]])(s,o,r.localize,l)})).join("")}function oi(e){const t=e.match(Zt);return t?t[1].replace(ei,"'"):e}function ri(e,t){return dt(e,t?.in).getDate()}function ni(e,t){const i=dt(e,t?.in),o=i.getFullYear(),r=i.getMonth(),n=st(i,0);return n.setFullYear(o,r+1,0),n.setHours(0,0,0,0),n.getDate()}function ai(e,t){return+dt(e)>+dt(t)}function si(e,t){return+dt(e)<+dt(t)}function di(e,t,i){const[o,r]=mt(0,e,t);return o.getFullYear()===r.getFullYear()&&o.getMonth()===r.getMonth()}function li(e,t,i){const[o,r]=mt(0,e,t);return o.getFullYear()===r.getFullYear()}function ci(e,t){return function(e,t){const[i,o]=mt(0,e,t);return+yt(i)===+yt(o)}(st(e,e),function(e){return st(e,Date.now())}(e))}let pi=class extends e{constructor(){super(...arguments),this.selectedDate=null,this.viewDate=new Date,this.isMobile=!1,this.calendarWidth=0,this.minDate=null,this.maxDate=null,this.currentView="days",this.handleOutsideClick=e=>{const t=this.getRootNode(),i=t?.host;!i||e.composedPath().includes(this)||e.composedPath().includes(i)||this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}}static{this.styles=[J,o`
|
|
2953
|
+
`}};a([L({type:Array}),n("design:type",Array)],re.prototype,"acceptedFileTypes",void 0),a([L({type:Number}),n("design:type",Object)],re.prototype,"maxFiles",void 0),a([L({type:Number}),n("design:type",Object)],re.prototype,"maxFileSize",void 0),a([B(),n("design:type",Object)],re.prototype,"isDragging",void 0),a([B(),n("design:type",Array)],re.prototype,"imageUrls",void 0),a([B(),n("design:type",Boolean)],re.prototype,"isMaxFilesReached",void 0),re=a([l("upload-image")],re);const se=6048e5,ae=Symbol.for("constructDateFrom");function ne(t,e){return"function"==typeof t?t(e):t&&"object"==typeof t&&ae in t?t[ae](e):t instanceof Date?new t.constructor(e):new Date(e)}function le(t,e){return ne(e||t,t)}function de(t,e,i){const o=le(t,i?.in);if(isNaN(e))return ne(t,NaN);if(!e)return o;const r=o.getDate(),s=ne(t,o.getTime());s.setMonth(o.getMonth()+e+1,0);return r>=s.getDate()?s:(o.setFullYear(s.getFullYear(),s.getMonth(),r),o)}let ce={};function he(){return ce}function pe(t,e){const i=he(),o=e?.weekStartsOn??e?.locale?.options?.weekStartsOn??i.weekStartsOn??i.locale?.options?.weekStartsOn??0,r=le(t,e?.in),s=r.getDay(),a=(s<o?7:0)+s-o;return r.setDate(r.getDate()-a),r.setHours(0,0,0,0),r}function ue(t,e){return pe(t,{...e,weekStartsOn:1})}function ge(t,e){const i=le(t,e?.in),o=i.getFullYear(),r=ne(i,0);r.setFullYear(o+1,0,4),r.setHours(0,0,0,0);const s=ue(r),a=ne(i,0);a.setFullYear(o,0,4),a.setHours(0,0,0,0);const n=ue(a);return i.getTime()>=s.getTime()?o+1:i.getTime()>=n.getTime()?o:o-1}function me(t){const e=le(t),i=new Date(Date.UTC(e.getFullYear(),e.getMonth(),e.getDate(),e.getHours(),e.getMinutes(),e.getSeconds(),e.getMilliseconds()));return i.setUTCFullYear(e.getFullYear()),+t-+i}function be(t,...e){const i=ne.bind(null,e.find((t=>"object"==typeof t)));return e.map(i)}function ye(t,e){const i=le(t,e?.in);return i.setHours(0,0,0,0),i}function ve(t,e,i){return de(t,12*e,i)}function fe(t){return!(!((e=t)instanceof Date||"object"==typeof e&&"[object Date]"===Object.prototype.toString.call(e))&&"number"!=typeof t||isNaN(+le(t)));var e}function xe(t,e){const i=le(t,e?.in);return i.setDate(1),i.setHours(0,0,0,0),i}const we={lessThanXSeconds:{one:"less than a second",other:"less than {{count}} seconds"},xSeconds:{one:"1 second",other:"{{count}} seconds"},halfAMinute:"half a minute",lessThanXMinutes:{one:"less than a minute",other:"less than {{count}} minutes"},xMinutes:{one:"1 minute",other:"{{count}} minutes"},aboutXHours:{one:"about 1 hour",other:"about {{count}} hours"},xHours:{one:"1 hour",other:"{{count}} hours"},xDays:{one:"1 day",other:"{{count}} days"},aboutXWeeks:{one:"about 1 week",other:"about {{count}} weeks"},xWeeks:{one:"1 week",other:"{{count}} weeks"},aboutXMonths:{one:"about 1 month",other:"about {{count}} months"},xMonths:{one:"1 month",other:"{{count}} months"},aboutXYears:{one:"about 1 year",other:"about {{count}} years"},xYears:{one:"1 year",other:"{{count}} years"},overXYears:{one:"over 1 year",other:"over {{count}} years"},almostXYears:{one:"almost 1 year",other:"almost {{count}} years"}};function ke(t){return(e={})=>{const i=e.width?String(e.width):t.defaultWidth;return t.formats[i]||t.formats[t.defaultWidth]}}const $e={date:ke({formats:{full:"EEEE, MMMM do, y",long:"MMMM do, y",medium:"MMM d, y",short:"MM/dd/yyyy"},defaultWidth:"full"}),time:ke({formats:{full:"h:mm:ss a zzzz",long:"h:mm:ss a z",medium:"h:mm:ss a",short:"h:mm a"},defaultWidth:"full"}),dateTime:ke({formats:{full:"{{date}} 'at' {{time}}",long:"{{date}} 'at' {{time}}",medium:"{{date}}, {{time}}",short:"{{date}}, {{time}}"},defaultWidth:"full"})},Se={lastWeek:"'last' eeee 'at' p",yesterday:"'yesterday at' p",today:"'today at' p",tomorrow:"'tomorrow at' p",nextWeek:"eeee 'at' p",other:"P"};function Ce(t){return(e,i)=>{let o;if("formatting"===(i?.context?String(i.context):"standalone")&&t.formattingValues){const e=t.defaultFormattingWidth||t.defaultWidth,r=i?.width?String(i.width):e;o=t.formattingValues[r]||t.formattingValues[e]}else{const e=t.defaultWidth,r=i?.width?String(i.width):t.defaultWidth;o=t.values[r]||t.values[e]}return o[t.argumentCallback?t.argumentCallback(e):e]}}function De(t){return(e,i={})=>{const o=i.width,r=o&&t.matchPatterns[o]||t.matchPatterns[t.defaultMatchWidth],s=e.match(r);if(!s)return null;const a=s[0],n=o&&t.parsePatterns[o]||t.parsePatterns[t.defaultParseWidth],l=Array.isArray(n)?function(t,e){for(let i=0;i<t.length;i++)if(e(t[i]))return i;return}(n,(t=>t.test(a))):function(t,e){for(const i in t)if(Object.prototype.hasOwnProperty.call(t,i)&&e(t[i]))return i;return}(n,(t=>t.test(a)));let d;d=t.valueCallback?t.valueCallback(l):l,d=i.valueCallback?i.valueCallback(d):d;return{value:d,rest:e.slice(a.length)}}}var Ee;const Me={code:"en-US",formatDistance:(t,e,i)=>{let o;const r=we[t];return o="string"==typeof r?r:1===e?r.one:r.other.replace("{{count}}",e.toString()),i?.addSuffix?i.comparison&&i.comparison>0?"in "+o:o+" ago":o},formatLong:$e,formatRelative:(t,e,i,o)=>Se[t],localize:{ordinalNumber:(t,e)=>{const i=Number(t),o=i%100;if(o>20||o<10)switch(o%10){case 1:return i+"st";case 2:return i+"nd";case 3:return i+"rd"}return i+"th"},era:Ce({values:{narrow:["B","A"],abbreviated:["BC","AD"],wide:["Before Christ","Anno Domini"]},defaultWidth:"wide"}),quarter:Ce({values:{narrow:["1","2","3","4"],abbreviated:["Q1","Q2","Q3","Q4"],wide:["1st quarter","2nd quarter","3rd quarter","4th quarter"]},defaultWidth:"wide",argumentCallback:t=>t-1}),month:Ce({values:{narrow:["J","F","M","A","M","J","J","A","S","O","N","D"],abbreviated:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],wide:["January","February","March","April","May","June","July","August","September","October","November","December"]},defaultWidth:"wide"}),day:Ce({values:{narrow:["S","M","T","W","T","F","S"],short:["Su","Mo","Tu","We","Th","Fr","Sa"],abbreviated:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],wide:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]},defaultWidth:"wide"}),dayPeriod:Ce({values:{narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"morning",afternoon:"afternoon",evening:"evening",night:"night"}},defaultWidth:"wide",formattingValues:{narrow:{am:"a",pm:"p",midnight:"mi",noon:"n",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},abbreviated:{am:"AM",pm:"PM",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"},wide:{am:"a.m.",pm:"p.m.",midnight:"midnight",noon:"noon",morning:"in the morning",afternoon:"in the afternoon",evening:"in the evening",night:"at night"}},defaultFormattingWidth:"wide"})},match:{ordinalNumber:(Ee={matchPattern:/^(\d+)(th|st|nd|rd)?/i,parsePattern:/\d+/i,valueCallback:t=>parseInt(t,10)},(t,e={})=>{const i=t.match(Ee.matchPattern);if(!i)return null;const o=i[0],r=t.match(Ee.parsePattern);if(!r)return null;let s=Ee.valueCallback?Ee.valueCallback(r[0]):r[0];return s=e.valueCallback?e.valueCallback(s):s,{value:s,rest:t.slice(o.length)}}),era:De({matchPatterns:{narrow:/^(b|a)/i,abbreviated:/^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,wide:/^(before christ|before common era|anno domini|common era)/i},defaultMatchWidth:"wide",parsePatterns:{any:[/^b/i,/^(a|c)/i]},defaultParseWidth:"any"}),quarter:De({matchPatterns:{narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](th|st|nd|rd)? quarter/i},defaultMatchWidth:"wide",parsePatterns:{any:[/1/i,/2/i,/3/i,/4/i]},defaultParseWidth:"any",valueCallback:t=>t+1}),month:De({matchPatterns:{narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,wide:/^(january|february|march|april|may|june|july|august|september|october|november|december)/i},defaultMatchWidth:"wide",parsePatterns:{narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^may/i,/^jun/i,/^jul/i,/^au/i,/^s/i,/^o/i,/^n/i,/^d/i]},defaultParseWidth:"any"}),day:De({matchPatterns:{narrow:/^[smtwf]/i,short:/^(su|mo|tu|we|th|fr|sa)/i,abbreviated:/^(sun|mon|tue|wed|thu|fri|sat)/i,wide:/^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i},defaultMatchWidth:"wide",parsePatterns:{narrow:[/^s/i,/^m/i,/^t/i,/^w/i,/^t/i,/^f/i,/^s/i],any:[/^su/i,/^m/i,/^tu/i,/^w/i,/^th/i,/^f/i,/^sa/i]},defaultParseWidth:"any"}),dayPeriod:De({matchPatterns:{narrow:/^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,any:/^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i},defaultMatchWidth:"any",parsePatterns:{any:{am:/^a/i,pm:/^p/i,midnight:/^mi/i,noon:/^no/i,morning:/morning/i,afternoon:/afternoon/i,evening:/evening/i,night:/night/i}},defaultParseWidth:"any"})},options:{weekStartsOn:0,firstWeekContainsDate:1}};function Oe(t,e){const i=le(t,e?.in),o=function(t,e){const[i,o]=be(0,t,e),r=ye(i),s=ye(o),a=+r-me(r),n=+s-me(s);return Math.round((a-n)/864e5)}(i,function(t,e){const i=le(t,e?.in);return i.setFullYear(i.getFullYear(),0,1),i.setHours(0,0,0,0),i}(i));return o+1}function Fe(t,e){const i=le(t,e?.in),o=+ue(i)-+function(t,e){const i=ge(t,e),o=ne(t,0);return o.setFullYear(i,0,4),o.setHours(0,0,0,0),ue(o)}(i);return Math.round(o/se)+1}function Pe(t,e){const i=le(t,e?.in),o=i.getFullYear(),r=he(),s=e?.firstWeekContainsDate??e?.locale?.options?.firstWeekContainsDate??r.firstWeekContainsDate??r.locale?.options?.firstWeekContainsDate??1,a=ne(e?.in||t,0);a.setFullYear(o+1,0,s),a.setHours(0,0,0,0);const n=pe(a,e),l=ne(e?.in||t,0);l.setFullYear(o,0,s),l.setHours(0,0,0,0);const d=pe(l,e);return+i>=+n?o+1:+i>=+d?o:o-1}function Te(t,e){const i=le(t,e?.in),o=+pe(i,e)-+function(t,e){const i=he(),o=e?.firstWeekContainsDate??e?.locale?.options?.firstWeekContainsDate??i.firstWeekContainsDate??i.locale?.options?.firstWeekContainsDate??1,r=Pe(t,e),s=ne(e?.in||t,0);return s.setFullYear(r,0,o),s.setHours(0,0,0,0),pe(s,e)}(i,e);return Math.round(o/se)+1}function Le(t,e){return(t<0?"-":"")+Math.abs(t).toString().padStart(e,"0")}const Be={y(t,e){const i=t.getFullYear(),o=i>0?i:1-i;return Le("yy"===e?o%100:o,e.length)},M(t,e){const i=t.getMonth();return"M"===e?String(i+1):Le(i+1,2)},d:(t,e)=>Le(t.getDate(),e.length),a(t,e){const i=t.getHours()/12>=1?"pm":"am";switch(e){case"a":case"aa":return i.toUpperCase();case"aaa":return i;case"aaaaa":return i[0];default:return"am"===i?"a.m.":"p.m."}},h:(t,e)=>Le(t.getHours()%12||12,e.length),H:(t,e)=>Le(t.getHours(),e.length),m:(t,e)=>Le(t.getMinutes(),e.length),s:(t,e)=>Le(t.getSeconds(),e.length),S(t,e){const i=e.length,o=t.getMilliseconds();return Le(Math.trunc(o*Math.pow(10,i-3)),e.length)}},je="midnight",Ae="noon",ze="morning",We="afternoon",Ie="evening",Ne="night",_e={G:function(t,e,i){const o=t.getFullYear()>0?1:0;switch(e){case"G":case"GG":case"GGG":return i.era(o,{width:"abbreviated"});case"GGGGG":return i.era(o,{width:"narrow"});default:return i.era(o,{width:"wide"})}},y:function(t,e,i){if("yo"===e){const e=t.getFullYear(),o=e>0?e:1-e;return i.ordinalNumber(o,{unit:"year"})}return Be.y(t,e)},Y:function(t,e,i,o){const r=Pe(t,o),s=r>0?r:1-r;if("YY"===e){return Le(s%100,2)}return"Yo"===e?i.ordinalNumber(s,{unit:"year"}):Le(s,e.length)},R:function(t,e){return Le(ge(t),e.length)},u:function(t,e){return Le(t.getFullYear(),e.length)},Q:function(t,e,i){const o=Math.ceil((t.getMonth()+1)/3);switch(e){case"Q":return String(o);case"QQ":return Le(o,2);case"Qo":return i.ordinalNumber(o,{unit:"quarter"});case"QQQ":return i.quarter(o,{width:"abbreviated",context:"formatting"});case"QQQQQ":return i.quarter(o,{width:"narrow",context:"formatting"});default:return i.quarter(o,{width:"wide",context:"formatting"})}},q:function(t,e,i){const o=Math.ceil((t.getMonth()+1)/3);switch(e){case"q":return String(o);case"qq":return Le(o,2);case"qo":return i.ordinalNumber(o,{unit:"quarter"});case"qqq":return i.quarter(o,{width:"abbreviated",context:"standalone"});case"qqqqq":return i.quarter(o,{width:"narrow",context:"standalone"});default:return i.quarter(o,{width:"wide",context:"standalone"})}},M:function(t,e,i){const o=t.getMonth();switch(e){case"M":case"MM":return Be.M(t,e);case"Mo":return i.ordinalNumber(o+1,{unit:"month"});case"MMM":return i.month(o,{width:"abbreviated",context:"formatting"});case"MMMMM":return i.month(o,{width:"narrow",context:"formatting"});default:return i.month(o,{width:"wide",context:"formatting"})}},L:function(t,e,i){const o=t.getMonth();switch(e){case"L":return String(o+1);case"LL":return Le(o+1,2);case"Lo":return i.ordinalNumber(o+1,{unit:"month"});case"LLL":return i.month(o,{width:"abbreviated",context:"standalone"});case"LLLLL":return i.month(o,{width:"narrow",context:"standalone"});default:return i.month(o,{width:"wide",context:"standalone"})}},w:function(t,e,i,o){const r=Te(t,o);return"wo"===e?i.ordinalNumber(r,{unit:"week"}):Le(r,e.length)},I:function(t,e,i){const o=Fe(t);return"Io"===e?i.ordinalNumber(o,{unit:"week"}):Le(o,e.length)},d:function(t,e,i){return"do"===e?i.ordinalNumber(t.getDate(),{unit:"date"}):Be.d(t,e)},D:function(t,e,i){const o=Oe(t);return"Do"===e?i.ordinalNumber(o,{unit:"dayOfYear"}):Le(o,e.length)},E:function(t,e,i){const o=t.getDay();switch(e){case"E":case"EE":case"EEE":return i.day(o,{width:"abbreviated",context:"formatting"});case"EEEEE":return i.day(o,{width:"narrow",context:"formatting"});case"EEEEEE":return i.day(o,{width:"short",context:"formatting"});default:return i.day(o,{width:"wide",context:"formatting"})}},e:function(t,e,i,o){const r=t.getDay(),s=(r-o.weekStartsOn+8)%7||7;switch(e){case"e":return String(s);case"ee":return Le(s,2);case"eo":return i.ordinalNumber(s,{unit:"day"});case"eee":return i.day(r,{width:"abbreviated",context:"formatting"});case"eeeee":return i.day(r,{width:"narrow",context:"formatting"});case"eeeeee":return i.day(r,{width:"short",context:"formatting"});default:return i.day(r,{width:"wide",context:"formatting"})}},c:function(t,e,i,o){const r=t.getDay(),s=(r-o.weekStartsOn+8)%7||7;switch(e){case"c":return String(s);case"cc":return Le(s,e.length);case"co":return i.ordinalNumber(s,{unit:"day"});case"ccc":return i.day(r,{width:"abbreviated",context:"standalone"});case"ccccc":return i.day(r,{width:"narrow",context:"standalone"});case"cccccc":return i.day(r,{width:"short",context:"standalone"});default:return i.day(r,{width:"wide",context:"standalone"})}},i:function(t,e,i){const o=t.getDay(),r=0===o?7:o;switch(e){case"i":return String(r);case"ii":return Le(r,e.length);case"io":return i.ordinalNumber(r,{unit:"day"});case"iii":return i.day(o,{width:"abbreviated",context:"formatting"});case"iiiii":return i.day(o,{width:"narrow",context:"formatting"});case"iiiiii":return i.day(o,{width:"short",context:"formatting"});default:return i.day(o,{width:"wide",context:"formatting"})}},a:function(t,e,i){const o=t.getHours()/12>=1?"pm":"am";switch(e){case"a":case"aa":return i.dayPeriod(o,{width:"abbreviated",context:"formatting"});case"aaa":return i.dayPeriod(o,{width:"abbreviated",context:"formatting"}).toLowerCase();case"aaaaa":return i.dayPeriod(o,{width:"narrow",context:"formatting"});default:return i.dayPeriod(o,{width:"wide",context:"formatting"})}},b:function(t,e,i){const o=t.getHours();let r;switch(r=12===o?Ae:0===o?je:o/12>=1?"pm":"am",e){case"b":case"bb":return i.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"bbb":return i.dayPeriod(r,{width:"abbreviated",context:"formatting"}).toLowerCase();case"bbbbb":return i.dayPeriod(r,{width:"narrow",context:"formatting"});default:return i.dayPeriod(r,{width:"wide",context:"formatting"})}},B:function(t,e,i){const o=t.getHours();let r;switch(r=o>=17?Ie:o>=12?We:o>=4?ze:Ne,e){case"B":case"BB":case"BBB":return i.dayPeriod(r,{width:"abbreviated",context:"formatting"});case"BBBBB":return i.dayPeriod(r,{width:"narrow",context:"formatting"});default:return i.dayPeriod(r,{width:"wide",context:"formatting"})}},h:function(t,e,i){if("ho"===e){let e=t.getHours()%12;return 0===e&&(e=12),i.ordinalNumber(e,{unit:"hour"})}return Be.h(t,e)},H:function(t,e,i){return"Ho"===e?i.ordinalNumber(t.getHours(),{unit:"hour"}):Be.H(t,e)},K:function(t,e,i){const o=t.getHours()%12;return"Ko"===e?i.ordinalNumber(o,{unit:"hour"}):Le(o,e.length)},k:function(t,e,i){let o=t.getHours();return 0===o&&(o=24),"ko"===e?i.ordinalNumber(o,{unit:"hour"}):Le(o,e.length)},m:function(t,e,i){return"mo"===e?i.ordinalNumber(t.getMinutes(),{unit:"minute"}):Be.m(t,e)},s:function(t,e,i){return"so"===e?i.ordinalNumber(t.getSeconds(),{unit:"second"}):Be.s(t,e)},S:function(t,e){return Be.S(t,e)},X:function(t,e,i){const o=t.getTimezoneOffset();if(0===o)return"Z";switch(e){case"X":return Ve(o);case"XXXX":case"XX":return Ue(o);default:return Ue(o,":")}},x:function(t,e,i){const o=t.getTimezoneOffset();switch(e){case"x":return Ve(o);case"xxxx":case"xx":return Ue(o);default:return Ue(o,":")}},O:function(t,e,i){const o=t.getTimezoneOffset();switch(e){case"O":case"OO":case"OOO":return"GMT"+Re(o,":");default:return"GMT"+Ue(o,":")}},z:function(t,e,i){const o=t.getTimezoneOffset();switch(e){case"z":case"zz":case"zzz":return"GMT"+Re(o,":");default:return"GMT"+Ue(o,":")}},t:function(t,e,i){return Le(Math.trunc(+t/1e3),e.length)},T:function(t,e,i){return Le(+t,e.length)}};function Re(t,e=""){const i=t>0?"-":"+",o=Math.abs(t),r=Math.trunc(o/60),s=o%60;return 0===s?i+String(r):i+String(r)+e+Le(s,2)}function Ve(t,e){if(t%60==0){return(t>0?"-":"+")+Le(Math.abs(t)/60,2)}return Ue(t,e)}function Ue(t,e=""){const i=t>0?"-":"+",o=Math.abs(t);return i+Le(Math.trunc(o/60),2)+e+Le(o%60,2)}const qe=(t,e)=>{switch(t){case"P":return e.date({width:"short"});case"PP":return e.date({width:"medium"});case"PPP":return e.date({width:"long"});default:return e.date({width:"full"})}},Ye=(t,e)=>{switch(t){case"p":return e.time({width:"short"});case"pp":return e.time({width:"medium"});case"ppp":return e.time({width:"long"});default:return e.time({width:"full"})}},He={p:Ye,P:(t,e)=>{const i=t.match(/(P+)(p+)?/)||[],o=i[1],r=i[2];if(!r)return qe(t,e);let s;switch(o){case"P":s=e.dateTime({width:"short"});break;case"PP":s=e.dateTime({width:"medium"});break;case"PPP":s=e.dateTime({width:"long"});break;default:s=e.dateTime({width:"full"})}return s.replace("{{date}}",qe(o,e)).replace("{{time}}",Ye(r,e))}},Ge=/^D+$/,Xe=/^Y+$/,Ke=["D","DD","YY","YYYY"];const Qe=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,Je=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,Ze=/^'([^]*?)'?$/,ti=/''/g,ei=/[a-zA-Z]/;function ii(t,e,i){const o=he(),r=o.locale??Me,s=o.firstWeekContainsDate??o.locale?.options?.firstWeekContainsDate??1,a=o.weekStartsOn??o.locale?.options?.weekStartsOn??0,n=le(t,i?.in);if(!fe(n))throw new RangeError("Invalid time value");let l=e.match(Je).map((t=>{const e=t[0];if("p"===e||"P"===e){return(0,He[e])(t,r.formatLong)}return t})).join("").match(Qe).map((t=>{if("''"===t)return{isToken:!1,value:"'"};const e=t[0];if("'"===e)return{isToken:!1,value:oi(t)};if(_e[e])return{isToken:!0,value:t};if(e.match(ei))throw new RangeError("Format string contains an unescaped latin alphabet character `"+e+"`");return{isToken:!1,value:t}}));r.localize.preprocessor&&(l=r.localize.preprocessor(n,l));const d={firstWeekContainsDate:s,weekStartsOn:a,locale:r};return l.map((i=>{if(!i.isToken)return i.value;const o=i.value;(function(t){return Xe.test(t)}(o)||function(t){return Ge.test(t)}(o))&&function(t,e,i){const o=function(t,e,i){const o="Y"===t[0]?"years":"days of the month";return`Use \`${t.toLowerCase()}\` instead of \`${t}\` (in \`${e}\`) for formatting ${o} to the input \`${i}\`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md`}(t,e,i);if(console.warn(o),Ke.includes(t))throw new RangeError(o)}(o,e,String(t));return(0,_e[o[0]])(n,o,r.localize,d)})).join("")}function oi(t){const e=t.match(Ze);return e?e[1].replace(ti,"'"):t}function ri(t,e){return le(t,e?.in).getDate()}function si(t,e){const i=le(t,e?.in),o=i.getFullYear(),r=i.getMonth(),s=ne(i,0);return s.setFullYear(o,r+1,0),s.setHours(0,0,0,0),s.getDate()}function ai(t,e){return+le(t)>+le(e)}function ni(t,e){return+le(t)<+le(e)}function li(t,e,i){const[o,r]=be(0,t,e);return o.getFullYear()===r.getFullYear()&&o.getMonth()===r.getMonth()}function di(t,e,i){const[o,r]=be(0,t,e);return o.getFullYear()===r.getFullYear()}function ci(t,e){return function(t,e){const[i,o]=be(0,t,e);return+ye(i)===+ye(o)}(ne(t,t),function(t){return ne(t,Date.now())}(t))}let hi=class extends t{constructor(){super(...arguments),this.selectedDate=null,this.viewDate=new Date,this.isMobile=!1,this.calendarWidth=0,this.minDate=null,this.maxDate=null,this.currentView="days",this.handleOutsideClick=t=>{const e=this.getRootNode(),i=e?.host;!i||t.composedPath().includes(this)||t.composedPath().includes(i)||this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}}static{this.styles=[J,o`
|
|
2947
2954
|
/* Estilos generales del contenedor del calendario (escritorio) */
|
|
2948
2955
|
.calendar-container {
|
|
2949
2956
|
position: absolute;
|
|
@@ -3008,7 +3015,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3008
3015
|
}
|
|
3009
3016
|
|
|
3010
3017
|
.month-year-button {
|
|
3011
|
-
${
|
|
3018
|
+
${W}
|
|
3012
3019
|
display: flex;
|
|
3013
3020
|
align-items: center;
|
|
3014
3021
|
justify-content: center;
|
|
@@ -3057,7 +3064,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3057
3064
|
|
|
3058
3065
|
/* Estilos para cada botón de día */
|
|
3059
3066
|
.day {
|
|
3060
|
-
${
|
|
3067
|
+
${I}
|
|
3061
3068
|
display: flex;
|
|
3062
3069
|
align-items: center;
|
|
3063
3070
|
justify-content: center;
|
|
@@ -3120,7 +3127,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3120
3127
|
/* Botones de año y mes en la grilla */
|
|
3121
3128
|
.year-button,
|
|
3122
3129
|
.month-button {
|
|
3123
|
-
${
|
|
3130
|
+
${I}
|
|
3124
3131
|
background: var(--secondary-white, #fff);
|
|
3125
3132
|
border: 1px solid transparent;
|
|
3126
3133
|
color: var(--secondary-randstad-dark-blue-80, #3c4257);
|
|
@@ -3274,7 +3281,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3274
3281
|
}
|
|
3275
3282
|
|
|
3276
3283
|
.mobile-modal .day {
|
|
3277
|
-
${
|
|
3284
|
+
${N}
|
|
3278
3285
|
font-weight: 500;
|
|
3279
3286
|
display: flex;
|
|
3280
3287
|
align-items: center;
|
|
@@ -3357,19 +3364,19 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3357
3364
|
color: var(--secondary-randstad-dark-blue-30, #b1b5c4);
|
|
3358
3365
|
}
|
|
3359
3366
|
/* */
|
|
3360
|
-
`]}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.handleOutsideClick)}handleHeaderClick(){"days"===this.currentView?this.currentView="years":this.currentView="days"}_updateView(e
|
|
3367
|
+
`]}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.handleOutsideClick)}handleHeaderClick(){"days"===this.currentView?this.currentView="years":this.currentView="days"}_updateView(t,e=null){this.viewDate=t,e&&(this.currentView=e),this.dispatchEvent(new CustomEvent("view-date-change",{detail:{date:this.viewDate}}))}handleNavClick(t){let e=this.viewDate;e="days"===this.currentView?de(this.viewDate,t):"months"===this.currentView?ve(this.viewDate,t):ve(this.viewDate,21*t),this._updateView(e)}handleYearSelect(t){const e=function(t,e,i){const o=le(t,i?.in);return isNaN(+o)?ne(t,NaN):(o.setFullYear(e),o)}(this.viewDate,t);this._updateView(e,"months")}handleMonthSelect(t){const e=function(t,e,i){const o=le(t,i?.in),r=o.getFullYear(),s=o.getDate(),a=ne(t,0);a.setFullYear(r,e,15),a.setHours(0,0,0,0);const n=si(a);return o.setMonth(e,Math.min(s,n)),o}(this.viewDate,t);this._updateView(e,"days")}handleDayClick(t){this.selectedDate=t,this.dispatchEvent(new CustomEvent("date-selected",{detail:{date:t},bubbles:!0,composed:!0}))}getFullMonthNames(){return["Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre"]}getShortMonthNames(){return this.getFullMonthNames().map((t=>t.substring(0,3)))}getShortWeekdays(){return["lu","ma","mi","ju","vi","sa","do"]}renderHeader(){const t=this.getFullMonthNames();let i="",o=!1,r=!1;if("years"===this.currentView){const t=this.viewDate.getFullYear()-this.viewDate.getFullYear()%21,e=t+20;i=`${t} - ${e}`;o=t<=(this.minDate?this.minDate.getFullYear():-1/0),r=e>=(this.maxDate?this.maxDate.getFullYear():1/0)}else if("months"===this.currentView){i=`${this.viewDate.getFullYear()}`;const t=this.viewDate.getFullYear();o=t<=(this.minDate?this.minDate.getFullYear():-1/0),r=t>=(this.maxDate?this.maxDate.getFullYear():1/0)}else{i=`${t[this.viewDate.getMonth()]} ${this.viewDate.getFullYear()}`,this.minDate&&(o=li(xe(this.viewDate),xe(this.minDate))||ni(this.viewDate,this.minDate)),this.maxDate&&(r=li(xe(this.viewDate),xe(this.maxDate))||ai(this.viewDate,this.maxDate))}const s=e`
|
|
3361
3368
|
<randstad-icon
|
|
3362
3369
|
name="${"days"===this.currentView?"arrow_drop_down":"arrow_drop_up"}"
|
|
3363
3370
|
class="select-icon"
|
|
3364
3371
|
>
|
|
3365
3372
|
</randstad-icon>
|
|
3366
|
-
`;return
|
|
3373
|
+
`;return e`
|
|
3367
3374
|
<div class="header">
|
|
3368
3375
|
<div class="header-left">
|
|
3369
3376
|
<button class="month-year-button" @click=${this.handleHeaderClick}>
|
|
3370
3377
|
<span>${i}</span>
|
|
3371
3378
|
|
|
3372
|
-
${
|
|
3379
|
+
${s}
|
|
3373
3380
|
</button>
|
|
3374
3381
|
</div>
|
|
3375
3382
|
|
|
@@ -3383,61 +3390,61 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3383
3390
|
</button>
|
|
3384
3391
|
</div>
|
|
3385
3392
|
</div>
|
|
3386
|
-
`}renderYearsView(){const
|
|
3393
|
+
`}renderYearsView(){const t=this.viewDate.getFullYear()-this.viewDate.getFullYear()%21,i=Array.from({length:21},((e,i)=>t+i)),o=this.selectedDate?this.selectedDate.getFullYear():null,r=(new Date).getFullYear(),s=this.minDate?this.minDate.getFullYear():-1/0,a=this.maxDate?this.maxDate.getFullYear():1/0;return e`
|
|
3387
3394
|
<div class="year-grid">
|
|
3388
|
-
${i.map((e
|
|
3395
|
+
${i.map((t=>e`
|
|
3389
3396
|
<button
|
|
3390
|
-
class="${"year-button "+(
|
|
3391
|
-
@click=${()=>this.handleYearSelect(
|
|
3392
|
-
?disabled=${
|
|
3397
|
+
class="${"year-button "+(t===o?"selected":t===r?"current":"")}"
|
|
3398
|
+
@click=${()=>this.handleYearSelect(t)}
|
|
3399
|
+
?disabled=${t<s||t>a}
|
|
3393
3400
|
>
|
|
3394
|
-
${
|
|
3401
|
+
${t}
|
|
3395
3402
|
</button>
|
|
3396
3403
|
`))}
|
|
3397
3404
|
</div>
|
|
3398
|
-
`}renderMonthsView(){const
|
|
3405
|
+
`}renderMonthsView(){const t=this.getShortMonthNames(),i=this.selectedDate?.getMonth(),o=(new Date).getMonth(),r=this.viewDate.getFullYear();return e`
|
|
3399
3406
|
<div class="month-grid">
|
|
3400
|
-
${
|
|
3407
|
+
${t.map(((t,s)=>{const a=s===o,n=s===i&&this.selectedDate&&di(this.viewDate,this.selectedDate),l=s===i&&this.selectedDate&&!di(this.viewDate,this.selectedDate);let d=!1;this.minDate&&r===this.minDate.getFullYear()&&(d=s<this.minDate.getMonth()),this.maxDate&&r===this.maxDate.getFullYear()&&(d=d||s>this.maxDate.getMonth());return e`
|
|
3401
3408
|
<button
|
|
3402
|
-
class="${"month-button "+(
|
|
3403
|
-
?disabled=${
|
|
3404
|
-
@click=${()=>this.handleMonthSelect(
|
|
3409
|
+
class="${"month-button "+(n?"selected":l?"secondary-selected":a?"current":"")}"
|
|
3410
|
+
?disabled=${d}
|
|
3411
|
+
@click=${()=>this.handleMonthSelect(s)}
|
|
3405
3412
|
>
|
|
3406
|
-
${
|
|
3413
|
+
${t}
|
|
3407
3414
|
</button>
|
|
3408
3415
|
`}))}
|
|
3409
3416
|
</div>
|
|
3410
|
-
`}renderDayView(){const
|
|
3417
|
+
`}renderDayView(){const t=si(this.viewDate),i=xe(this.viewDate),o=le(i,r?.in).getDay();var r;const s=Array.from({length:0===o?6:o-1},(()=>null)),a=Array.from({length:t},((t,e)=>function(t,e,i){const o=le(t,i?.in);return o.setDate(e),o}(i,e+1))),n=this.getShortWeekdays();return e`
|
|
3411
3418
|
<div class="weekdays">
|
|
3412
|
-
${
|
|
3419
|
+
${n.map((t=>e`<div>${t}</div>`))}
|
|
3413
3420
|
</div>
|
|
3414
3421
|
|
|
3415
3422
|
<div class="days-grid">
|
|
3416
|
-
${
|
|
3417
|
-
${a.map((
|
|
3423
|
+
${s.map((()=>e`<div></div>`))}
|
|
3424
|
+
${a.map((t=>{const i=ye(t),o=this.selectedDate?ye(this.selectedDate):null,r=this.minDate&&ni(i,ye(this.minDate))||this.maxDate&&ai(i,ye(this.maxDate)),s=ci(i),a=o&&ri(i)===ri(o),n=a&&o&&li(i,o)&&di(i,o);return e`
|
|
3418
3425
|
<button
|
|
3419
|
-
class="${`day ${
|
|
3426
|
+
class="${`day ${s?"today":""} ${n?"selected":a&&!n?"secondary-selected":""}`}"
|
|
3420
3427
|
?disabled=${r}
|
|
3421
|
-
@click=${()=>this.handleDayClick(
|
|
3428
|
+
@click=${()=>this.handleDayClick(t)}
|
|
3422
3429
|
>
|
|
3423
|
-
${ii(
|
|
3430
|
+
${ii(t,"d")}
|
|
3424
3431
|
</button>
|
|
3425
3432
|
`}))}
|
|
3426
3433
|
</div>
|
|
3427
|
-
`}render(){let
|
|
3434
|
+
`}render(){let t;t="days"===this.currentView?this.renderDayView():"months"===this.currentView?this.renderMonthsView():this.renderYearsView();const i=e`${this.renderHeader()} <div class="weekdays-separator"></div> ${t}`;return this.isMobile?e`
|
|
3428
3435
|
<div
|
|
3429
3436
|
class="mobile-backdrop"
|
|
3430
3437
|
@click=${()=>this.dispatchEvent(new CustomEvent("close"))}
|
|
3431
3438
|
>
|
|
3432
|
-
<div class="mobile-modal" @click=${
|
|
3439
|
+
<div class="mobile-modal" @click=${t=>t.stopPropagation()}>
|
|
3433
3440
|
${i}
|
|
3434
3441
|
</div>
|
|
3435
3442
|
</div>
|
|
3436
|
-
`:
|
|
3443
|
+
`:e`
|
|
3437
3444
|
<div class="calendar-container" style="width: ${this.calendarWidth}px;">
|
|
3438
3445
|
${i}
|
|
3439
3446
|
</div>
|
|
3440
|
-
`}};a([
|
|
3447
|
+
`}};a([L({type:Object}),n("design:type",Object)],hi.prototype,"selectedDate",void 0),a([L({type:Object}),n("design:type",Date)],hi.prototype,"viewDate",void 0),a([L({type:Boolean}),n("design:type",Object)],hi.prototype,"isMobile",void 0),a([L({type:Number}),n("design:type",Number)],hi.prototype,"calendarWidth",void 0),a([L({type:Object}),n("design:type",Object)],hi.prototype,"minDate",void 0),a([L({type:Object}),n("design:type",Object)],hi.prototype,"maxDate",void 0),a([B(),n("design:type",String)],hi.prototype,"currentView",void 0),hi=a([l("calendar-overlay")],hi);let pi=class extends A{constructor(){super(...arguments),this.isRenderClearButton=!0,this.eighteenOrOlder=!1,this.isOpen=!1,this.selectedDate=null,this.viewDate=new Date,this.isMobile=!1,this.calendarWidth=0,this.inputValue=null,this.updateResponsiveModeBound=this.updateResponsiveMode.bind(this),this.handleClickOutside=t=>{t.composedPath().includes(this)||(this.isOpen=!1)}}static{this.styles=o`
|
|
3441
3448
|
${K}
|
|
3442
3449
|
${Q}
|
|
3443
3450
|
${X}
|
|
@@ -3500,7 +3507,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3500
3507
|
}
|
|
3501
3508
|
|
|
3502
3509
|
.date-input {
|
|
3503
|
-
${
|
|
3510
|
+
${N}
|
|
3504
3511
|
flex-grow: 1;
|
|
3505
3512
|
border: none;
|
|
3506
3513
|
outline: none;
|
|
@@ -3538,12 +3545,12 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3538
3545
|
.calendar-button randstad-icon {
|
|
3539
3546
|
font-size: 18px;
|
|
3540
3547
|
}
|
|
3541
|
-
`}setMessageErrorFormatInvalid(){return"formato de fecha inválido, se esperaba 'dd-MM-yyyy'"}connectedCallback(){super.connectedCallback(),this.updateResponsiveMode(),window.addEventListener("resize",this.updateResponsiveModeBound),document.addEventListener("click",this.handleClickOutside)}disconnectedCallback(){window.removeEventListener("resize",this.updateResponsiveModeBound),document.removeEventListener("click",this.handleClickOutside),super.disconnectedCallback()}firstUpdated(){this.setInitialWidth()}updated(
|
|
3548
|
+
`}setMessageErrorFormatInvalid(){return"formato de fecha inválido, se esperaba 'dd-MM-yyyy'"}connectedCallback(){super.connectedCallback(),this.updateResponsiveMode(),window.addEventListener("resize",this.updateResponsiveModeBound),document.addEventListener("click",this.handleClickOutside)}disconnectedCallback(){window.removeEventListener("resize",this.updateResponsiveModeBound),document.removeEventListener("click",this.handleClickOutside),super.disconnectedCallback()}firstUpdated(){this.setInitialWidth()}updated(t){t.has("value")&&this._syncValue(this.value),(t.has("isOpen")||t.has("value"))&&this.setInitialWidth(),super.updated(t)}setInitialWidth(){this.inputContainer&&(this.calendarWidth=this.inputContainer.getBoundingClientRect().width)}updateResponsiveMode(){this.isMobile=window.innerWidth<=940,this.setInitialWidth()}handleInput(t){const e=t.target;this.inputValue=e.value,this._parseAndValidateDate(e.value,!0)}handleCalendarButtonClick(t){this.disabled||(t.stopPropagation(),this.isOpen=!this.isOpen,this.selectedDate?this.viewDate=this.selectedDate:this.viewDate=new Date,this.requestUpdate())}handleClearDate(){this.inputValue=null,this.selectedDate=null,this.error=!1,this.errorMessage=null,this.closeOverlay(null)}handleDateSelect(t){const e=t.detail.date;if(!e)return;if(this._validateDate(e)){this.selectedDate=e,this.viewDate=e;const t=ii(e,"dd-MM-yyyy");this.inputValue=t,this.closeOverlay(t)}else{const t=ii(e,"dd-MM-yyyy");this.inputValue=t,this.selectedDate=null,this.closeOverlay(null)}}handleViewDateChange(t){this.viewDate=t.detail.date}closeOverlay(t){this.value=t,this.dispatchEvent(new CustomEvent("date-selected",{detail:{value:t}})),this.isOpen=!1}_syncValue(t){if(""===t||null===t)return void(this.error||(this.selectedDate=null,this.inputValue=null,this.errorMessage=null));const e=this._parseDate(t);e&&this._validateDate(e)?(this.selectedDate=e,this.viewDate=e,this.error=!1,this.errorMessage=null,this.value=ii(e,"dd-MM-yyyy"),this.inputValue=this.value):this.selectedDate=e}_validateDate(t){if(!t)return!1;if(this.error=!1,this.errorMessage=null,this.eighteenOrOlder){const e=function(t,e,i){return ve(t,-18,i)}(new Date);if(ai(t,e))return this.error=!0,this.errorMessage="tenés que ser mayor de 18 años",!1}if(!this._isWithinBounds(t)){const t=this._getValidDateRange();return this.error=!0,this.errorMessage=`la fecha debe estar entre ${t?.minDate?ii(t.minDate,"dd-MM-yyyy"):""} y ${t?.maxDate?ii(t.maxDate,"dd-MM-yyyy"):""}.`,!1}return!0}_parseAndValidateDate(t,e){if(this.disabled)return;if(""===t||null===t)return this.selectedDate=null,this.error=!1,this.errorMessage=null,void(e&&this.closeOverlay(null));const i=this._parseDate(t);if(i){this._validateDate(i)?(this.selectedDate=i,this.viewDate=i,this.error=!1,this.errorMessage=null,e&&this.closeOverlay(ii(i,"dd-MM-yyyy"))):(this.error=!0,this.selectedDate=null,e&&this.closeOverlay(null))}else this.error=!0,this.errorMessage=this.setMessageErrorFormatInvalid(),this.selectedDate=null,e&&this.closeOverlay(null)}_parseDate(t){const e=t.split("-").map(Number);if(3===e.length){const[i,o,r]=e;if(i&&o&&r&&o>=1&&o<=12&&r>1e3){const e=new Date(r,o-1,i,12);if(fe(e)&&ii(e,"dd-MM-yyyy")===t)return e}}const i=t.split("-").map(Number);if(3===i.length){const[e,o,r]=i;if(e&&o&&r&&o>=1&&o<=12&&e>1e3){const i=new Date(e,o-1,r,12);if(fe(i)&&ii(i,"yyyy-MM-dd")===t)return i}}return null}_parseDateString(t){if(!t)return null;const e=t.split("-").map(Number);if(3===e.length&&!isNaN(e[0])&&!isNaN(e[1])&&!isNaN(e[2])){return new Date(e[0],e[1]-1,e[2],12)}return null}_getValidDateRange(){const t=this._parseDateString(this.minDate),e=this._parseDateString(this.maxDate);return t||e?t&&e&&ai(t,e)?null:{minDate:t,maxDate:e}:{minDate:null,maxDate:null}}_isWithinBounds(t){const e=this._getValidDateRange();return!e||(!e.minDate||!ni(t,e.minDate))&&(!e.maxDate||!ai(t,e.maxDate))}render(){const t=s({"input-wrapper":!0,active:this.isOpen,error:this.error,disabled:this.disabled}),o=`width: ${this.width||"100%"};`,r=this._getValidDateRange();return e`
|
|
3542
3549
|
<div class="datepicker-container" style="${this.labelColor?` --label-color: ${this.labelColor}`:""} ${o}">
|
|
3543
3550
|
${this.renderLabelContainer()}
|
|
3544
3551
|
|
|
3545
3552
|
<div class="input-container">
|
|
3546
|
-
<div class="${
|
|
3553
|
+
<div class="${t}" style="width: 100%">
|
|
3547
3554
|
<input
|
|
3548
3555
|
type="text"
|
|
3549
3556
|
class="date-input"
|
|
@@ -3553,7 +3560,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3553
3560
|
@input=${this.handleInput}
|
|
3554
3561
|
/>
|
|
3555
3562
|
|
|
3556
|
-
${this.isRenderClearButton&&this.selectedDate&&!this.disabled?
|
|
3563
|
+
${this.isRenderClearButton&&this.selectedDate&&!this.disabled?e`
|
|
3557
3564
|
<button
|
|
3558
3565
|
class="icon-button clear-button"
|
|
3559
3566
|
@click=${this.handleClearDate}
|
|
@@ -3570,7 +3577,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3570
3577
|
</button>
|
|
3571
3578
|
</div>
|
|
3572
3579
|
|
|
3573
|
-
${this.isOpen?
|
|
3580
|
+
${this.isOpen?e`
|
|
3574
3581
|
<calendar-overlay
|
|
3575
3582
|
.isMobile=${this.isMobile}
|
|
3576
3583
|
.selectedDate=${this.selectedDate}
|
|
@@ -3590,11 +3597,11 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3590
3597
|
|
|
3591
3598
|
${this.renderHelper()}
|
|
3592
3599
|
</div>
|
|
3593
|
-
`}};a([
|
|
3600
|
+
`}};a([L({type:String}),n("design:type",String)],pi.prototype,"width",void 0),a([L({type:Boolean}),n("design:type",Object)],pi.prototype,"isRenderClearButton",void 0),a([L({type:String}),n("design:type",String)],pi.prototype,"minDate",void 0),a([L({type:String}),n("design:type",String)],pi.prototype,"maxDate",void 0),a([L({type:Boolean}),n("design:type",Object)],pi.prototype,"eighteenOrOlder",void 0),a([B(),n("design:type",Object)],pi.prototype,"isOpen",void 0),a([B(),n("design:type",Object)],pi.prototype,"selectedDate",void 0),a([B(),n("design:type",Date)],pi.prototype,"viewDate",void 0),a([B(),n("design:type",Object)],pi.prototype,"isMobile",void 0),a([B(),n("design:type",Number)],pi.prototype,"calendarWidth",void 0),a([B(),n("design:type",Object)],pi.prototype,"inputValue",void 0),a([j(".input-container"),n("design:type",HTMLDivElement)],pi.prototype,"inputContainer",void 0),pi=a([l("datepicker-component")],pi);let ui=class extends te{constructor(){super(...arguments),this.maxFiles=1,this.acceptedFileTypes=[],this.maxFileSize=0,this.buttonText="Agregar archivo"}static{this.styles=o`
|
|
3594
3601
|
${K}
|
|
3595
3602
|
${Q}
|
|
3596
3603
|
${X}
|
|
3597
|
-
${
|
|
3604
|
+
${oe}
|
|
3598
3605
|
|
|
3599
3606
|
:host([width]) {
|
|
3600
3607
|
width: var( --upload-file-width );
|
|
@@ -3633,7 +3640,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3633
3640
|
}
|
|
3634
3641
|
|
|
3635
3642
|
.file-name {
|
|
3636
|
-
${
|
|
3643
|
+
${I};
|
|
3637
3644
|
text-align: right;
|
|
3638
3645
|
color: var( --secondary-color-40 );
|
|
3639
3646
|
vertical-align: middle;
|
|
@@ -3651,7 +3658,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3651
3658
|
.progress-bar {
|
|
3652
3659
|
width: 100%;
|
|
3653
3660
|
}
|
|
3654
|
-
`}getFileConfig(){return{baseMaxFiles:this.maxFiles,maxFileSize:this.maxFileSize,acceptedFileTypes:this.acceptedFileTypes,errorMessageType
|
|
3661
|
+
`}getFileConfig(){const t=this.acceptedFileTypes.length>0,e=this.maxFileSize>0;return{baseMaxFiles:this.maxFiles,maxFileSize:this.maxFileSize,acceptedFileTypes:this.acceptedFileTypes,errorMessageType:t?`formato de archivo no válido, se aceptan: ${this.getTextAcceptedFileTypes()}`:"",errorMessageSize:e?`el archivo es demasiado grande, el máximo es de ${this.getTextMaxFileSize()}MB`:"",typeError:"file"}}getTextAcceptedFileTypes(){return this.getReadableFileTypes(this.acceptedFileTypes,ie)}getTextMaxFileSize(){return this.baseGetTextMaxFileSize(this.maxFileSize)}updated(t){super.updated(t),this.applyWidth()}applyWidth(){this.width&&this.style.setProperty("--upload-file-width",this.width)}onFileInputChange(t){this.baseOnFileInputChange(t,this.getFileConfig())}render(){const t=this.files.length>=this.maxFiles,o=this.disabled||t,r=e`
|
|
3655
3662
|
<randstad-button
|
|
3656
3663
|
.label=${this.buttonText}
|
|
3657
3664
|
.variant=${"button-primary"}
|
|
@@ -3659,7 +3666,7 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3659
3666
|
@click=${()=>this.fileInput?.click()}
|
|
3660
3667
|
>
|
|
3661
3668
|
</randstad-button>
|
|
3662
|
-
`;return
|
|
3669
|
+
`;return e`
|
|
3663
3670
|
<div class="file-container" style="${this.labelColor?`--label-color: ${this.labelColor};`:""}">
|
|
3664
3671
|
${this.renderLabelContainer()}
|
|
3665
3672
|
|
|
@@ -3677,12 +3684,12 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3677
3684
|
|
|
3678
3685
|
${this.renderHelper()}
|
|
3679
3686
|
|
|
3680
|
-
${this.files.length>0?
|
|
3687
|
+
${this.files.length>0?e`
|
|
3681
3688
|
<div class="file-list-container">
|
|
3682
3689
|
<div class="file-list">
|
|
3683
|
-
${this.files.map(((
|
|
3690
|
+
${this.files.map(((t,i)=>e`
|
|
3684
3691
|
<div class="file-item">
|
|
3685
|
-
<span class="file-name">${
|
|
3692
|
+
<span class="file-name">${t.name}</span>
|
|
3686
3693
|
|
|
3687
3694
|
<randstad-button
|
|
3688
3695
|
class="remove-file-button"
|
|
@@ -3698,59 +3705,315 @@ const We=o`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
3698
3705
|
</div>
|
|
3699
3706
|
`:i}
|
|
3700
3707
|
</div>
|
|
3701
|
-
`}};a([
|
|
3708
|
+
`}};a([L({type:String}),n("design:type",String)],ui.prototype,"width",void 0),a([L({type:Number}),n("design:type",Object)],ui.prototype,"maxFiles",void 0),a([L({type:Array}),n("design:type",Array)],ui.prototype,"acceptedFileTypes",void 0),a([L({type:Number}),n("design:type",Object)],ui.prototype,"maxFileSize",void 0),a([L({type:String}),n("design:type",Object)],ui.prototype,"buttonText",void 0),ui=a([l("upload-file")],ui);let gi=class extends t{constructor(){super(),this.cards=[],this.cardWidth="",this.cardHeight="",this.navWidth=112,this.showNavButtons=!0,this.isDynamicWidth=!0,this.isInfiniteScrollPartial=!0,this.autoPlayDelayMs=0,this.showPrevButton=!1,this.showNextButton=!0,this.isDraggingWithButtons=!1,this.isDownWithButtons=!1,this.startXWithButtons=0,this.scrollLeftPositionWithButtons=0,this.isScrollingByButton=!1,this.isDownDrag=!1,this.prevXDrag=0,this.isDraggingDrag=!1,this.scrollLeftDrag=0,this.observer=null,this.scrollTimeout=null,this.autoPlayTimer=null,this.handleResize=()=>{},this.DESKTOP_GAP=40,this.TABLET_GAP=24,this.MOBILE_GAP=24,this.handleMouseDownWithButtons=this.handleMouseDownWithButtons.bind(this),this.handleMouseLeaveWithButtons=this.handleMouseLeaveWithButtons.bind(this),this.handleMouseUpWithButtons=this.handleMouseUpWithButtons.bind(this),this.handleMouseMoveWithButtons=this.handleMouseMoveWithButtons.bind(this),this.handleScrollWithButtons=this.handleScrollWithButtons.bind(this),this.handleMouseDownDrag=this.handleMouseDownDrag.bind(this),this.handleMouseLeaveDrag=this.handleMouseLeaveDrag.bind(this),this.handleMouseUpDrag=this.handleMouseUpDrag.bind(this),this.handleMouseMoveDrag=this.handleMouseMoveDrag.bind(this),this.handleResize=this.resizeHandler.bind(this)}static{this.styles=o`
|
|
3702
3709
|
:host {
|
|
3703
3710
|
display: block;
|
|
3704
3711
|
width: 100%;
|
|
3705
3712
|
overflow: hidden;
|
|
3706
3713
|
user-select: none;
|
|
3714
|
+
position: relative;
|
|
3715
|
+
|
|
3716
|
+
--nav-width: 112px;
|
|
3717
|
+
--carousel-cards-gap: 24px;
|
|
3707
3718
|
}
|
|
3708
3719
|
|
|
3709
3720
|
.carousel-wrapper {
|
|
3710
3721
|
display: flex;
|
|
3711
|
-
gap:
|
|
3722
|
+
gap: var( --carousel-cards-gap );
|
|
3712
3723
|
overflow-x: auto;
|
|
3713
3724
|
-webkit-overflow-scrolling: touch;
|
|
3714
|
-
|
|
3725
|
+
scroll-snap-type: x mandatory;
|
|
3726
|
+
|
|
3727
|
+
scroll-padding-left: 25px;
|
|
3728
|
+
padding-right: 0;
|
|
3729
|
+
padding-left: 0;
|
|
3730
|
+
}
|
|
3731
|
+
|
|
3732
|
+
.carousel-wrapper.not-ininite-scroll-partial {
|
|
3733
|
+
scroll-padding-left: var( --nav-width );
|
|
3734
|
+
padding-right: 0;
|
|
3735
|
+
}
|
|
3736
|
+
|
|
3737
|
+
.carousel-wrapper::-webkit-scrollbar {
|
|
3738
|
+
display: none;
|
|
3739
|
+
}
|
|
3740
|
+
|
|
3741
|
+
.carousel-card-item {
|
|
3742
|
+
flex-shrink: 0;
|
|
3743
|
+
scroll-snap-align: start;
|
|
3744
|
+
}
|
|
3745
|
+
|
|
3746
|
+
.nav-button {
|
|
3747
|
+
width: var( --nav-width );
|
|
3748
|
+
display: flex;
|
|
3749
|
+
align-items: center;
|
|
3750
|
+
justify-content: center;
|
|
3751
|
+
position: absolute;
|
|
3752
|
+
top: 0;
|
|
3753
|
+
height: 100%;
|
|
3754
|
+
border: none;
|
|
3755
|
+
background-color: rgba( 15, 25, 65, 0.7 );
|
|
3756
|
+
cursor: pointer;
|
|
3757
|
+
z-index: 10;
|
|
3758
|
+
transition: opacity 0.3s ease, background-color 0.3s ease;
|
|
3759
|
+
}
|
|
3760
|
+
|
|
3761
|
+
.nav-button:hover, .nav-button:active {
|
|
3762
|
+
background-color: rgba( 15, 25, 65, 0.7 );
|
|
3763
|
+
}
|
|
3764
|
+
|
|
3765
|
+
.nav-button.prev {
|
|
3766
|
+
left: 0;
|
|
3767
|
+
}
|
|
3768
|
+
|
|
3769
|
+
.nav-button.next {
|
|
3770
|
+
right: 0;
|
|
3771
|
+
}
|
|
3772
|
+
|
|
3773
|
+
.nav-button.hidden {
|
|
3774
|
+
opacity: 0;
|
|
3775
|
+
pointer-events: none;
|
|
3776
|
+
}
|
|
3777
|
+
|
|
3778
|
+
.nav-button-inner {
|
|
3779
|
+
width: 48px;
|
|
3780
|
+
height: 48px;
|
|
3781
|
+
border-radius: 50%;
|
|
3782
|
+
display: flex;
|
|
3783
|
+
justify-content: center;
|
|
3784
|
+
align-items: center;
|
|
3785
|
+
background-color: transparent;
|
|
3786
|
+
transition: background-color 0.3s ease;
|
|
3787
|
+
}
|
|
3788
|
+
|
|
3789
|
+
.nav-button:hover .nav-button-inner {
|
|
3790
|
+
background-color: rgba( 0, 215, 255, 1 );
|
|
3791
|
+
}
|
|
3792
|
+
|
|
3793
|
+
.nav-button:hover .nav-button-inner:active, .nav-button:active .nav-button-inner {
|
|
3794
|
+
background-color: rgba( 0, 194, 230, 1 );
|
|
3795
|
+
}
|
|
3796
|
+
|
|
3797
|
+
.nav-button-inner randstad-icon {
|
|
3798
|
+
width: 32px;
|
|
3799
|
+
height: 32px;
|
|
3800
|
+
--icon-color: white;
|
|
3801
|
+
transition: --icon-color 0.3s ease;
|
|
3802
|
+
}
|
|
3803
|
+
|
|
3804
|
+
.nav-button:hover .nav-button-inner randstad-icon {
|
|
3805
|
+
--icon-color: rgba( 15, 25, 65, 1 );
|
|
3806
|
+
}
|
|
3807
|
+
|
|
3808
|
+
.nav-button:hover .nav-button-inner:active randstad-icon {
|
|
3809
|
+
--icon-color: rgba( 15, 25, 65, 1 );
|
|
3810
|
+
}
|
|
3811
|
+
|
|
3812
|
+
.carousel-wrapper.drag-mode {
|
|
3813
|
+
scroll-snap-type: none;
|
|
3814
|
+
|
|
3815
|
+
padding-right: 25px !important;
|
|
3816
|
+
padding-left: 25px !important;
|
|
3817
|
+
}
|
|
3818
|
+
|
|
3819
|
+
.carousel-wrapper.drag-mode.not-ininite-scroll-partial {
|
|
3820
|
+
scroll-snap-type: none;
|
|
3821
|
+
scroll-padding-left: 0 !important;
|
|
3715
3822
|
}
|
|
3716
3823
|
|
|
3717
|
-
.carousel-wrapper:hover {
|
|
3824
|
+
.carousel-wrapper.drag-mode:hover {
|
|
3718
3825
|
cursor: grab;
|
|
3719
3826
|
}
|
|
3720
3827
|
|
|
3721
|
-
.carousel-wrapper.active {
|
|
3828
|
+
.carousel-wrapper.drag-mode.active {
|
|
3722
3829
|
cursor: grabbing;
|
|
3723
3830
|
}
|
|
3831
|
+
|
|
3832
|
+
.dynamic-width-mode, .static-width-mode {
|
|
3833
|
+
padding-right: 15%;
|
|
3834
|
+
scroll-padding-left: var( --nav-width );
|
|
3835
|
+
}
|
|
3724
3836
|
|
|
3725
|
-
.carousel-
|
|
3726
|
-
|
|
3837
|
+
.dynamic-width-mode .carousel-card-item {
|
|
3838
|
+
width: 85%;
|
|
3727
3839
|
}
|
|
3728
3840
|
|
|
3729
|
-
|
|
3730
|
-
|
|
3841
|
+
@media ( min-width: 941px ) {
|
|
3842
|
+
.carousel-wrapper {
|
|
3843
|
+
gap: var( --carousel-cards-gap );
|
|
3844
|
+
scroll-padding-left: 100px;
|
|
3845
|
+
scroll-padding-right: 100px;
|
|
3846
|
+
}
|
|
3847
|
+
|
|
3848
|
+
.carousel-wrapper.not-ininite-scroll-partial {
|
|
3849
|
+
gap: var( --carousel-cards-gap );
|
|
3850
|
+
scroll-padding-left: 0;
|
|
3851
|
+
scroll-padding-right: 0;
|
|
3852
|
+
}
|
|
3853
|
+
|
|
3854
|
+
.static-width-mode.carousel-wrapper, .dynamic-width-mode.carousel-wrapper {
|
|
3855
|
+
gap: var( --carousel-cards-gap );
|
|
3856
|
+
padding-right: 100px !important;
|
|
3857
|
+
padding-left: 100px !important;
|
|
3858
|
+
}
|
|
3859
|
+
|
|
3860
|
+
.static-width-mode.carousel-wrapper.not-ininite-scroll-partial,.dynamic-width-mode.carousel-wrapper.not-ininite-scroll-partial {
|
|
3861
|
+
gap: var( --carousel-cards-gap );
|
|
3862
|
+
padding-right: 0 !important;
|
|
3863
|
+
padding-left: 0 !important;
|
|
3864
|
+
}
|
|
3865
|
+
|
|
3866
|
+
.dynamic-width-mode .carousel-card-item {
|
|
3867
|
+
width: calc( ( 100% - ( 2 * var( --carousel-cards-gap ) ) + 100px ) / 3 );
|
|
3868
|
+
}
|
|
3869
|
+
|
|
3870
|
+
.dynamic-width-mode.not-ininite-scroll-partial .carousel-card-item {
|
|
3871
|
+
width: calc( ( 100% - ( 2 * var( --carousel-cards-gap ) ) ) / 3 );
|
|
3872
|
+
}
|
|
3731
3873
|
}
|
|
3732
3874
|
|
|
3733
|
-
@media ( min-width:
|
|
3875
|
+
@media ( min-width: 501px ) and ( max-width: 940px ) {
|
|
3876
|
+
.nav-button {
|
|
3877
|
+
/* Se ocultan en modo tablet. Se mantiene lógica por un posible futuro fix. */
|
|
3878
|
+
display: none;
|
|
3879
|
+
}
|
|
3880
|
+
|
|
3881
|
+
.carousel-wrapper {
|
|
3882
|
+
gap: var( --carousel-cards-gap );
|
|
3883
|
+
scroll-padding-left: 50px !important;
|
|
3884
|
+
padding-right: var( --nav-width ) !important;
|
|
3885
|
+
}
|
|
3886
|
+
|
|
3887
|
+
.carousel-wrapper.not-ininite-scroll-partial {
|
|
3888
|
+
scroll-padding-left: 0 !important;
|
|
3889
|
+
}
|
|
3890
|
+
|
|
3891
|
+
.carousel-wrapper.drag-mode {
|
|
3892
|
+
padding-right: 0 !important;
|
|
3893
|
+
padding-left: 50px !important;
|
|
3894
|
+
}
|
|
3895
|
+
|
|
3896
|
+
.carousel-wrapper.drag-mode.not-ininite-scroll-partial {
|
|
3897
|
+
padding-right: 0 !important;
|
|
3898
|
+
padding-left: 0 !important;
|
|
3899
|
+
}
|
|
3900
|
+
|
|
3901
|
+
.static-width-mode.carousel-wrapper, .dynamic-width-mode.carousel-wrapper {
|
|
3902
|
+
gap: var( --carousel-cards-gap );
|
|
3903
|
+
padding-left: 50px !important;
|
|
3904
|
+
padding-right: 0 !important;
|
|
3905
|
+
}
|
|
3906
|
+
|
|
3907
|
+
.static-width-mode.carousel-wrapper.not-ininite-scroll-partial, .dynamic-width-mode.carousel-wrapper.not-ininite-scroll-partial {
|
|
3908
|
+
gap: var( --carousel-cards-gap );
|
|
3909
|
+
padding-left: 0 !important;
|
|
3910
|
+
padding-right: 0 !important;
|
|
3911
|
+
}
|
|
3912
|
+
|
|
3913
|
+
.static-width-mode:not(.drag-mode).carousel-wrapper, .dynamic-width-mode:not(.drag-mode).carousel-wrapper, .static-width-mode:not(.drag-mode).carousel-wrapper.not-ininite-scroll-partial, .dynamic-width-mode:not(.drag-mode).carousel-wrapper.not-ininite-scroll-partial {
|
|
3914
|
+
gap: var( --carousel-cards-gap );
|
|
3915
|
+
}
|
|
3916
|
+
|
|
3917
|
+
.dynamic-width-mode .carousel-card-item {
|
|
3918
|
+
width: calc( 100% - var( --nav-width ) - var( --carousel-cards-gap ) - 50px ); /* Ancho ajustado para nav-mode */
|
|
3919
|
+
}
|
|
3920
|
+
|
|
3921
|
+
.dynamic-width-mode.not-ininite-scroll-partial .carousel-card-item {
|
|
3922
|
+
width: calc( 100% - var( --nav-width ) - var( --carousel-cards-gap ) );
|
|
3923
|
+
}
|
|
3924
|
+
|
|
3925
|
+
.dynamic-width-mode.drag-mode .carousel-card-item {
|
|
3926
|
+
width: 85%;
|
|
3927
|
+
}
|
|
3928
|
+
}
|
|
3929
|
+
|
|
3930
|
+
@media ( max-width: 500px ) {
|
|
3931
|
+
.nav-button {
|
|
3932
|
+
display: none;
|
|
3933
|
+
}
|
|
3934
|
+
|
|
3734
3935
|
.carousel-wrapper {
|
|
3735
|
-
|
|
3936
|
+
scroll-padding-left: 25px !important;
|
|
3937
|
+
padding-right: 15%;
|
|
3938
|
+
}
|
|
3939
|
+
|
|
3940
|
+
.carousel-wrapper.not-ininite-scroll-partial {
|
|
3941
|
+
scroll-padding-left: 0 !important;
|
|
3942
|
+
}
|
|
3943
|
+
|
|
3944
|
+
.static-width-mode.carousel-wrapper, .dynamic-width-mode.carousel-wrapper {
|
|
3945
|
+
gap: var( --carousel-cards-gap );
|
|
3946
|
+
padding-left: 25px !important;
|
|
3947
|
+
padding-right: 0;
|
|
3948
|
+
}
|
|
3949
|
+
|
|
3950
|
+
.static-width-mode.carousel-wrapper.not-ininite-scroll-partial, .dynamic-width-mode.carousel-wrapper.not-ininite-scroll-partial {
|
|
3951
|
+
gap: var( --carousel-cards-gap );
|
|
3952
|
+
padding-left: 0 !important;
|
|
3953
|
+
padding-right: 0 !important;
|
|
3954
|
+
}
|
|
3955
|
+
|
|
3956
|
+
.dynamic-width-mode .carousel-card-item {
|
|
3957
|
+
width: 85%;
|
|
3958
|
+
}
|
|
3959
|
+
|
|
3960
|
+
.static-width-mode.drag-mode.carousel-wrapper, .dynamic-width-mode.drag-mode.carousel-wrapper {
|
|
3961
|
+
padding-right: 0 !important;
|
|
3962
|
+
padding-left: 25px !important;
|
|
3963
|
+
}
|
|
3964
|
+
|
|
3965
|
+
.static-width-mode.drag-mode.carousel-wrapper.not-ininite-scroll-partial, .dynamic-width-mode.drag-mode.carousel-wrapper.not-ininite-scroll-partial {
|
|
3966
|
+
padding-right: 0 !important;
|
|
3967
|
+
padding-left: 0 !important;
|
|
3968
|
+
}
|
|
3969
|
+
|
|
3970
|
+
.static-width-mode:not(.drag-mode).carousel-wrapper.not-ininite-scroll-partial, .dynamic-width-mode:not(.drag-mode).carousel-wrapper.not-ininite-scroll-partial {
|
|
3971
|
+
gap: var( --carousel-cards-gap );
|
|
3972
|
+
padding-right: 0 !important;
|
|
3736
3973
|
}
|
|
3737
3974
|
}
|
|
3738
|
-
`}disconnectedCallback(){super.disconnectedCallback(),this.baseAddListeners()}get slider(){return this.shadowRoot.querySelector(".carousel-wrapper")}handleMouseDown(e){this.slider&&0===e.button&&(this.isDown=!0,this.isDragging=!1,this.slider.classList.add("active"),this.prevX=e.pageX)}handleMouseLeave(){this.slider&&(this.isDown=!1,this.isDragging=!1,this.slider.classList.remove("active"))}handleMouseUp(){if(this.slider){if(this.isDown=!1,this.slider.classList.remove("active"),this.isDragging){const e=this.slider.querySelector(".carousel-card-item").getBoundingClientRect().width+24,t=this.slider.scrollLeft,i=Math.round(t/e)*e;this.slider.scrollTo({left:i,behavior:"smooth"})}this.isDragging=!1}}handleMouseMove(e){if(e.preventDefault(),!this.isDown||!this.slider)return;this.isDragging=!0;const t=e.pageX-this.prevX;this.slider.scrollLeft-=1.5*t,this.prevX=e.pageX}firstUpdated(){const e=this.slider;e&&(e.addEventListener("mousedown",this.handleMouseDown.bind(this)),e.addEventListener("mouseleave",this.handleMouseLeave.bind(this)),e.addEventListener("mouseup",this.handleMouseUp.bind(this)),e.addEventListener("mousemove",this.handleMouseMove.bind(this)),e.addEventListener("dragstart",(e=>e.preventDefault())))}baseAddListeners(){const e=this.slider;e&&(e.addEventListener("mousedown",this.handleMouseDown.bind(this)),e.addEventListener("mouseleave",this.handleMouseLeave.bind(this)),e.addEventListener("mouseup",this.handleMouseUp.bind(this)),e.addEventListener("mousemove",this.handleMouseMove.bind(this)),e.addEventListener("dragstart",(e=>e.preventDefault())))}render(){return t`
|
|
3739
|
-
<div class="
|
|
3740
|
-
|
|
3741
|
-
|
|
3742
|
-
|
|
3743
|
-
|
|
3744
|
-
|
|
3745
|
-
|
|
3746
|
-
|
|
3747
|
-
|
|
3748
|
-
|
|
3749
|
-
|
|
3750
|
-
|
|
3751
|
-
|
|
3752
|
-
|
|
3753
|
-
|
|
3975
|
+
`}getCarouselGap(){let t;const e=window.innerWidth;return t=e>=941?this.DESKTOP_GAP:e>=501?this.TABLET_GAP:this.MOBILE_GAP,t}setCarouselGap(){this.style.setProperty("--carousel-cards-gap",`${this.getCarouselGap()}px`)}getNavWidth(){return this.navWidth??112}getInitialPadding(){if(!this.slider||!1===this.showNavButtons)return 0;const t=window.getComputedStyle(this.slider).getPropertyValue("scroll-padding-left");return parseFloat(t)||0}updated(t){super.updated(t),t.has("navWidth")&&this.style.setProperty("--nav-width",`${this.getNavWidth()}px`)}firstUpdated(){this.slider&&(this.setCarouselGap(),this.initAutoPlayConfig(),this.cardWidth||!1===this.isDynamicWidth?this.isDynamicWidth=!1:this.hasAttribute("isdynamicwidth")&&void 0!==this.isDynamicWidth||(this.isDynamicWidth=!0),this.initNavModeConfig(),this.slider.addEventListener("dragstart",(t=>t.preventDefault())),0===this.cards.length&&this.slotElement&&this.loadMutationObserver())}initAutoPlayConfig(){this.autoPlayDelayMs>0&&(this.isDynamicWidth=!0,this.showNavButtons=!1),this.autoPlayDelayMs>0&&this.slider&&(this.slider.addEventListener("mouseenter",this.handleMouseEnter.bind(this)),this.slider.addEventListener("mouseleave",this.handleMouseLeaveDrag.bind(this)),this.slider.addEventListener("touchstart",this.handleMouseEnter.bind(this)),this.slider.addEventListener("touchend",this.handleMouseLeaveDrag.bind(this)))}initNavModeConfig(){!1!==this.showNavButtons?(this.slider.addEventListener("mousedown",this.handleMouseDownWithButtons),this.slider.addEventListener("mouseleave",this.handleMouseLeaveWithButtons),this.slider.addEventListener("mouseup",this.handleMouseUpWithButtons),this.slider.addEventListener("mousemove",this.handleMouseMoveWithButtons),this.slider.addEventListener("scroll",this.handleScrollWithButtons),window.requestAnimationFrame((()=>this.handleScrollWithButtons())),this.slider.addEventListener("mouseenter",this.handleMouseEnter.bind(this))):(this.slider.classList.add("drag-mode"),this.slider.addEventListener("mousedown",this.handleMouseDownDrag),this.slider.addEventListener("mouseleave",this.handleMouseLeaveDrag),this.slider.addEventListener("mouseup",this.handleMouseUpDrag),this.slider.addEventListener("mousemove",this.handleMouseMoveDrag),this.slider.addEventListener("mouseenter",this.handleMouseEnter.bind(this)))}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this.handleResize),this.autoPlayDelayMs>0&&setTimeout((()=>this.startAutoPlay()),100)}disconnectedCallback(){super.disconnectedCallback(),this.slider&&(this.slider.removeEventListener("mousedown",this.handleMouseDownWithButtons),this.slider.removeEventListener("mouseleave",this.handleMouseLeaveWithButtons),this.slider.removeEventListener("mouseup",this.handleMouseUpWithButtons),this.slider.removeEventListener("mousemove",this.handleMouseMoveWithButtons),this.slider.removeEventListener("scroll",this.handleScrollWithButtons),this.slider.removeEventListener("mousedown",this.handleMouseDownDrag),this.slider.removeEventListener("mouseleave",this.handleMouseLeaveDrag),this.slider.removeEventListener("mouseup",this.handleMouseUpDrag),this.slider.removeEventListener("mousemove",this.handleMouseMoveDrag),null!==this.scrollTimeout&&window.clearTimeout(this.scrollTimeout),this.observer&&this.observer.disconnect(),this.stopAutoPlay())}resizeHandler(){this.requestUpdate(),this.setCarouselGap()}loadMutationObserver(){this.observer=new MutationObserver(((t,e)=>{t.some((t=>t.addedNodes.length>0))&&setTimeout((()=>{this.handleScrollWithButtons(),this.slider.scrollWidth>this.slider.clientWidth&&e.disconnect()}),50)})),this.observer.observe(this,{childList:!0,subtree:!0})}handleMouseEnter(){this.stopAutoPlay()}startAutoPlay(){this.autoPlayDelayMs<=0||!this.slider||null!==this.autoPlayTimer||window.setTimeout((()=>{null===this.autoPlayTimer&&(this.autoPlayTimer=window.setInterval((()=>this.scrollToNext(new Event("autoplay"))),this.autoPlayDelayMs))}),100)}stopAutoPlay(){null!==this.autoPlayTimer&&(window.clearInterval(this.autoPlayTimer),this.autoPlayTimer=null)}handleMouseDownDrag(t){this.slider&&0===t.button&&(this.autoPlayDelayMs>0&&this.stopAutoPlay(),this.isDownDrag=!0,this.isDraggingDrag=!1,this.slider.classList.add("active"),this.slider.style.scrollBehavior="auto",this.prevXDrag=t.pageX,this.scrollLeftDrag=this.slider.scrollLeft)}handleMouseLeaveDrag(){this.slider&&(this.isDownDrag=!1,this.isDraggingDrag=!1,this.slider.classList.remove("active"),this.autoPlayDelayMs>0&&window.setTimeout((()=>{this.startAutoPlay()}),500))}handleMouseUpDrag(){this.slider&&(this.isDownDrag=!1,this.isDraggingDrag=!1,this.slider.classList.remove("active"))}handleMouseMoveDrag(t){if(t.preventDefault(),!this.isDownDrag||!this.slider)return;this.isDraggingDrag=!0;const e=t.pageX-this.prevXDrag;this.slider.scrollLeft-=1.5*e,this.prevXDrag=t.pageX}shouldPreventDragWithButtons(){if(!this.slider)return!1;return this.slider.scrollWidth-this.slider.clientWidth>1}handleMouseDownWithButtons(t){this.slider&&0===t.button&&(this.shouldPreventDragWithButtons()||(this.isDownWithButtons=!0,this.isDraggingWithButtons=!1,this.slider.classList.add("active"),this.slider.style.scrollBehavior="auto",this.startXWithButtons=t.pageX,this.scrollLeftPositionWithButtons=this.slider.scrollLeft))}handleMouseMoveWithButtons(t){if(t.preventDefault(),!this.isDownWithButtons||!this.slider)return;if(this.shouldPreventDragWithButtons())return;this.isDraggingWithButtons=!0;const e=1.5*(t.pageX-this.startXWithButtons);this.slider.scrollLeft=this.scrollLeftPositionWithButtons-e}handleMouseUpWithButtons(){this.slider&&(this.isDownWithButtons=!1,this.isDraggingWithButtons=!1,this.slider.classList.remove("active"))}handleMouseLeaveWithButtons(){this.isDownWithButtons&&(this.isDownWithButtons=!1,this.isDraggingWithButtons=!1,this.slider.classList.remove("active"),this.autoPlayDelayMs>0&&this.startAutoPlay())}handleScrollWithButtons(){if(!this.slider)return;if(this.isScrollingByButton){const t=this.slider.scrollWidth-this.slider.clientWidth,e=this.slider.scrollLeft,i=10;return t<=i?(this.showPrevButton=!1,void(this.showNextButton=!1)):(this.showPrevButton=e>i,void(this.showNextButton=e<t-i))}null!==this.scrollTimeout&&window.clearTimeout(this.scrollTimeout),this.scrollTimeout=window.setTimeout((()=>{this.slider.style.scrollSnapType="none",this.scrollTimeout=null}),100);const t=this.slider.scrollWidth-this.slider.clientWidth,e=this.slider.scrollLeft;if(t<=10)return this.showPrevButton=!1,void(this.showNextButton=!1);this.showPrevButton=e>10,this.showNextButton=e<t-10}getNavButtonWidth(){if(!1===this.showNavButtons)return 0;if(!this.isDynamicWidth)return this.getNavWidth();return window.matchMedia("( max-width: 500px )").matches?0:this.getNavWidth()}getScrollAmount(){let t=null;if(this.cards.length>0)t=this.slider.querySelector(".carousel-card-item");else if(this.slotElement){t=this.slotElement.assignedElements({flatten:!0}).find((t=>t.classList.contains("carousel-card-item")))||null}if(!t||0===t.getBoundingClientRect().width){const t=parseFloat(this.cardWidth.replace("px",""))||280,e=window.getComputedStyle(this.slider),i=e.getPropertyValue("gap")||e.getPropertyValue("column-gap");return t+(parseFloat(i)||0)}const e=t.getBoundingClientRect().width,i=window.getComputedStyle(this.slider),o=i.getPropertyValue("gap")||i.getPropertyValue("column-gap");return e+(parseFloat(o)||0)}getCarouselItems(){return this.cards.length>0?this.slider?Array.from(this.slider.querySelectorAll(".carousel-card-item")):[]:this.slotElement?this.slotElement.assignedElements({flatten:!0}):[]}getCardsToCenterCount(){return this.isDynamicWidth&&window.matchMedia("( min-width: 941px )").matches?2:1}calculateTargetIndex(t,e,i){const o=this.getCardsToCenterCount();if(0===i.length||0===o)return-1;let r;r=t+5;let s,a=0;for(let t=0;t<i.length;t++){if(i[t].offsetLeft>=r){a=t;break}}if(this.isInfiniteScrollPartial){const e=this.getInitialPadding();0===a&&t>e&&(a=i.length-o)}if(!e&&t<5)return 0;const n=i.length-o,l=2===o;if(e){s=t<(this.isInfiniteScrollPartial?this.getInitialPadding():this.getNavButtonWidth())+5?l?2:1:a+1,s=Math.min(s,n)}else s=l&&a<=2?0:a-1,s=Math.max(0,s);return s}getScrollLeftToCenter(t,e){const i=this.getCardsToCenterCount();if(t<0||t>=e.length||0===i)return this.slider.scrollLeft;const o=e[t],r=o.getBoundingClientRect().width;if(0===r)return this.slider.scrollLeft;const s=window.getComputedStyle(this.slider),a=s.getPropertyValue("gap")||s.getPropertyValue("column-gap"),n=r*i+(parseFloat(a)||0)*(i-1);let l=o.offsetLeft+n/2-this.slider.clientWidth/2;l=Math.max(0,l);const d=this.slider.scrollWidth-this.slider.clientWidth;return l=Math.min(l,d),l}scrollToPrev(t){if("autoplay"===t.type||(t.preventDefault(),t.stopPropagation()),!this.slider)return;const e=this.getCarouselItems();if(0===e.length)return;let i;if(this.isDynamicWidth&&window.matchMedia("( min-width: 501px )").matches){const t=this.slider.scrollLeft,o=this.calculateTargetIndex(t,!1,e);i=this.getScrollLeftToCenter(o,e)}else{const t=this.slider.scrollLeft;i=0;const o=this.getInitialPadding(),r=this.getNavButtonWidth(),s=this.isInfiniteScrollPartial?o:r;for(let o=e.length-1;o>=0;o--){const r=e[o];if(Math.round(r.offsetLeft-s)<Math.round(t)-1){i=r.offsetLeft-s;break}}}this.slider.style.scrollSnapType="none",this.isScrollingByButton=!0,this.slider.scrollTo({left:i,behavior:"smooth"}),window.setTimeout((()=>{this.isScrollingByButton=!1,this.handleScrollWithButtons()}),350)}scrollToNext(t){const e="autoplay"===t.type;if(e||(t.preventDefault(),t.stopPropagation()),!this.slider)return;const i=this.getCarouselItems();if(0===i.length)return;let o;if(this.isDynamicWidth&&window.matchMedia("( min-width: 501px )").matches){const t=this.slider.scrollLeft,e=this.calculateTargetIndex(t,!0,i);o=this.getScrollLeftToCenter(e,i)}else{const t=this.slider.scrollLeft;o=-1;const e=this.getInitialPadding(),r=this.getNavButtonWidth(),s=this.isInfiniteScrollPartial?e:r;for(let e=0;e<i.length;e++){const r=i[e];if(Math.round(r.offsetLeft-s)>Math.round(t)+1){o=r.offsetLeft-s;break}}if(-1===o){o=this.slider.scrollWidth-this.slider.clientWidth}}const r=this.slider.scrollWidth-this.slider.clientWidth,s=this.slider.scrollLeft;if(e&&Math.round(s)>=Math.round(r))return this.slider.style.scrollBehavior="auto",this.slider.scrollTo({left:0,behavior:"auto"}),void(this.slider.style.scrollBehavior="smooth");this.slider.style.scrollSnapType="none",this.isScrollingByButton=!0,this.slider.scrollTo({left:o,behavior:"smooth"}),window.setTimeout((()=>{this.isScrollingByButton=!1,this.handleScrollWithButtons()}),350)}getCardCustomDimensionValue(t,e){if("width"!==t||!this.isDynamicWidth){if("width"===t){let t=window.innerWidth;if(t-=2*this.getNavButtonWidth(),t-=this.getCarouselGap(),!e)return`${t}px`;const i=e.match(/^(\d+)px$/);if(!i)return`${t}px`;return parseFloat(i[1])>t?`${t}px`:e}{const t=window.innerHeight;if(!e)return;const i=e.match(/^(\d+)px$/);if(!i)return e;return parseFloat(i[1])>t?`${t}px`:e}}}renderNavButtons(){if(!1===this.showNavButtons)return e``;const t={"nav-button":!0,prev:!0,hidden:!this.showPrevButton},i={"nav-button":!0,next:!0,hidden:!this.showNextButton};return e`
|
|
3976
|
+
<div class="nav-buttons-container">
|
|
3977
|
+
<button
|
|
3978
|
+
class=${s(t)}
|
|
3979
|
+
@click=${this.scrollToPrev}
|
|
3980
|
+
>
|
|
3981
|
+
<div class="nav-button-inner">
|
|
3982
|
+
<randstad-icon name="arrow_prev" size="32px"></randstad-icon>
|
|
3983
|
+
</div>
|
|
3984
|
+
</button>
|
|
3985
|
+
|
|
3986
|
+
<button
|
|
3987
|
+
class=${s(i)}
|
|
3988
|
+
@click=${this.scrollToNext}
|
|
3989
|
+
>
|
|
3990
|
+
<div class="nav-button-inner">
|
|
3991
|
+
<randstad-icon name="arrow_next" size="32px"></randstad-icon>
|
|
3992
|
+
</div>
|
|
3993
|
+
</button>
|
|
3994
|
+
</div>
|
|
3995
|
+
`}renderContent(){const t=this.getCardCustomDimensionValue("width",this.cardWidth),i=this.getCardCustomDimensionValue("height",this.cardHeight);return this.cards&&this.cards.length>0?this.cards.map((o=>e`
|
|
3996
|
+
<div class="carousel-card-item">
|
|
3997
|
+
<carousel-card
|
|
3998
|
+
.img=${o.img}
|
|
3999
|
+
.name=${o.name}
|
|
4000
|
+
.title=${o.title}
|
|
4001
|
+
.description=${o.description}
|
|
4002
|
+
.buttonLabel=${o.buttonLabel}
|
|
4003
|
+
.cardId=${o.cardId}
|
|
4004
|
+
.width=${t}
|
|
4005
|
+
.height=${i}
|
|
4006
|
+
.onClick=${o.onClick}
|
|
4007
|
+
>
|
|
4008
|
+
</carousel-card>
|
|
4009
|
+
</div>
|
|
4010
|
+
`)):e`<slot></slot>`}render(){const t=!1!==this.showNavButtons,i=!1===this.isInfiniteScrollPartial,o={"carousel-wrapper":!0,"drag-mode":!t,"dynamic-width-mode":this.isDynamicWidth,"static-width-mode":!this.isDynamicWidth,"not-ininite-scroll-partial":i};return e`
|
|
4011
|
+
<div class="carousel-container">
|
|
4012
|
+
<div class=${s(o)}>
|
|
4013
|
+
${this.renderContent()}
|
|
4014
|
+
</div>
|
|
4015
|
+
|
|
4016
|
+
${this.renderNavButtons()}
|
|
3754
4017
|
</div>
|
|
3755
|
-
`}};a([
|
|
4018
|
+
`}};a([L({type:Array}),n("design:type",Array)],gi.prototype,"cards",void 0),a([L({type:String}),n("design:type",String)],gi.prototype,"cardWidth",void 0),a([L({type:String}),n("design:type",String)],gi.prototype,"cardHeight",void 0),a([L({type:Number}),n("design:type",Number)],gi.prototype,"navWidth",void 0),a([L({type:Boolean}),n("design:type",Boolean)],gi.prototype,"showNavButtons",void 0),a([L({type:Boolean}),n("design:type",Boolean)],gi.prototype,"isDynamicWidth",void 0),a([L({type:Boolean}),n("design:type",Boolean)],gi.prototype,"isInfiniteScrollPartial",void 0),a([L({type:Number}),n("design:type",Number)],gi.prototype,"autoPlayDelayMs",void 0),a([B(),n("design:type",Object)],gi.prototype,"showPrevButton",void 0),a([B(),n("design:type",Object)],gi.prototype,"showNextButton",void 0),a([j(".carousel-wrapper"),n("design:type",HTMLElement)],gi.prototype,"slider",void 0),a([j("slot"),n("design:type",HTMLSlotElement)],gi.prototype,"slotElement",void 0),gi=a([l("carousel-component"),n("design:paramtypes",[])],gi);export{q as AccordionList,U as AccordionPanel,A as BaseControl,hi as CalendarOverlay,gi as Carousel,H as CarouselCard,G as Checkbox,ot as CustomModal,rt as CustomPopup,Gt as CustomRadio,Jt as CustomStepper,pi as DatePickerComponent,Xt as FilterableSelect,tt as FormGroup,et as IconComponent,st as ProgressCircle,Y as RandstadButton,Z as RandstadForm,it as RandstadNotice,Zt as TabsBar,ui as UploadFile,re as UploadImage,J as scrollbarStyles};
|
|
3756
4019
|
//# sourceMappingURL=index.js.map
|