@randstad-uca/design-system 1.0.40 → 1.0.42
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_drop_down.svg +3 -0
- package/dist/assets/icons/arrow_drop_up.svg +3 -0
- package/dist/components/CalendarOverlay.d.ts +107 -0
- package/dist/components/DatePicker.d.ts +97 -0
- package/dist/components/Modal.d.ts +2 -0
- package/dist/index.js +36 -29
- package/dist/index.js.map +1 -1
- package/dist/package.json +3 -1
- package/dist/stories/DatePicker.stories.d.ts +45 -0
- package/dist/stories/Modal.stories.d.ts +1 -0
- package/dist/styles/globalStyles.ts +8 -0
- package/package.json +3 -1
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
import { LitElement } from "lit";
|
|
2
|
+
export declare class CalendarOverlay extends LitElement {
|
|
3
|
+
/**
|
|
4
|
+
* La fecha actualmente seleccionada por el usuario.
|
|
5
|
+
* Se utiliza para marcar visualmente el día seleccionado en el calendario.
|
|
6
|
+
*/
|
|
7
|
+
selectedDate: Date | null;
|
|
8
|
+
/**
|
|
9
|
+
* La fecha que define el mes y año que se muestra actualmente en la vista del calendario.
|
|
10
|
+
* Cambia al navegar entre meses o años.
|
|
11
|
+
*/
|
|
12
|
+
viewDate: Date;
|
|
13
|
+
isMobile: boolean;
|
|
14
|
+
calendarWidth: number;
|
|
15
|
+
/**
|
|
16
|
+
* El estado de la vista actual del calendario, que puede ser 'días', 'meses' o 'años'.
|
|
17
|
+
* Determina qué cuadrícula se renderiza en el overlay.
|
|
18
|
+
*/
|
|
19
|
+
private currentView;
|
|
20
|
+
static styles: import("lit").CSSResult;
|
|
21
|
+
connectedCallback(): void;
|
|
22
|
+
disconnectedCallback(): void;
|
|
23
|
+
/**
|
|
24
|
+
* Cierra el overlay del calendario si el clic se produce fuera de sus límites.
|
|
25
|
+
* Se utiliza un `event listener` en el documento para detectar clics en cualquier lugar de la página.
|
|
26
|
+
|
|
27
|
+
* @param e - Objeto de evento del clic.
|
|
28
|
+
*/
|
|
29
|
+
private handleOutsideClick;
|
|
30
|
+
/**
|
|
31
|
+
* Alterna la vista del calendario entre 'days' y 'years' al hacer clic en el encabezado.
|
|
32
|
+
* Si la vista actual es 'days', cambia a 'years'; si no, vuelve a 'days'.
|
|
33
|
+
*/
|
|
34
|
+
private handleHeaderClick;
|
|
35
|
+
/**
|
|
36
|
+
* Método auxiliar para actualizar la vista y disparar el evento
|
|
37
|
+
*/
|
|
38
|
+
private _updateView;
|
|
39
|
+
/**
|
|
40
|
+
* Maneja la navegación entre periodos en el calendario según la vista actual.
|
|
41
|
+
* Si la vista es de días, navega por meses; si es de meses, navega por años;
|
|
42
|
+
* si es de años, navega por bloques de 21 años.
|
|
43
|
+
* Actualiza la vista con la nueva fecha calculada.
|
|
44
|
+
|
|
45
|
+
* @param direction -1 para retroceder, 1 para avanzar.
|
|
46
|
+
*/
|
|
47
|
+
private handleNavClick;
|
|
48
|
+
/**
|
|
49
|
+
* Maneja la selección de un año en la vista de años.
|
|
50
|
+
* Al seleccionar un año, actualiza la fecha de vista y cambia a la vista de meses.
|
|
51
|
+
|
|
52
|
+
* @param year - El año seleccionado (número de 4 dígitos).
|
|
53
|
+
*/
|
|
54
|
+
private handleYearSelect;
|
|
55
|
+
/**
|
|
56
|
+
* Maneja la selección de un mes en la vista de meses.
|
|
57
|
+
* Al seleccionar un mes, actualiza la fecha de vista y cambia a la vista de días.
|
|
58
|
+
|
|
59
|
+
* @param monthIndex - El índice del mes seleccionado (0-11, donde 0 es Enero).
|
|
60
|
+
*/
|
|
61
|
+
private handleMonthSelect;
|
|
62
|
+
/**
|
|
63
|
+
* Maneja el clic en un día del calendario.
|
|
64
|
+
* Emite un evento `date-selected` al componente padre con la fecha y su valor formateado.
|
|
65
|
+
|
|
66
|
+
* @param day - El objeto Date del día seleccionado.
|
|
67
|
+
*/
|
|
68
|
+
private handleDayClick;
|
|
69
|
+
private getFullMonthNames;
|
|
70
|
+
private getShortMonthNames;
|
|
71
|
+
private getShortWeekdays;
|
|
72
|
+
/**
|
|
73
|
+
* Renderiza el encabezado del calendario, mostrando el mes y el año actuales.
|
|
74
|
+
* Incluye botones de navegación y un botón para cambiar la vista (a meses/años).
|
|
75
|
+
*/
|
|
76
|
+
private renderHeader;
|
|
77
|
+
/**
|
|
78
|
+
* Renderiza la vista de selección de años en el calendario.
|
|
79
|
+
* Genera una cuadrícula de botones, cada uno representando un año dentro de un rango de 21 años.
|
|
80
|
+
* El año actualmente seleccionado se resalta visualmente.
|
|
81
|
+
* Al hacer clic en un botón de año, se invoca el método de manejo de selección de año.
|
|
82
|
+
|
|
83
|
+
* @returns {TemplateResult} Plantilla HTML para la vista de años.
|
|
84
|
+
*/
|
|
85
|
+
private renderYearsView;
|
|
86
|
+
/**
|
|
87
|
+
* Renderiza la vista de selección de meses en el calendario.
|
|
88
|
+
* Genera una cuadrícula de botones, cada uno representando un mes abreviado.
|
|
89
|
+
* El mes actualmente seleccionado se resalta visualmente.
|
|
90
|
+
* Al hacer clic en un botón de mes, se invoca el método de manejo de selección de mes.
|
|
91
|
+
|
|
92
|
+
* @returns {TemplateResult} Plantilla HTML para la vista de meses.
|
|
93
|
+
*/
|
|
94
|
+
private renderMonthsView;
|
|
95
|
+
/**
|
|
96
|
+
* Renderiza la cuadrícula de días para el mes actual.
|
|
97
|
+
* Incluye los días de la semana, los días del mes y marca el día actual y el seleccionado.
|
|
98
|
+
*/
|
|
99
|
+
private renderDayView;
|
|
100
|
+
/**
|
|
101
|
+
* Renderiza el overlay del calendario según la vista actual (días, meses o años).
|
|
102
|
+
* Incluye el encabezado y la cuadrícula correspondiente.
|
|
103
|
+
|
|
104
|
+
* @returns {TemplateResult} Plantilla HTML del overlay del calendario.
|
|
105
|
+
*/
|
|
106
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
107
|
+
}
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { LitElement } from "lit";
|
|
2
|
+
import "./CalendarOverlay.ts";
|
|
3
|
+
export declare class DatePickerComponent extends LitElement {
|
|
4
|
+
label: string;
|
|
5
|
+
placeholder: string;
|
|
6
|
+
value: string;
|
|
7
|
+
required: boolean;
|
|
8
|
+
disabled: boolean;
|
|
9
|
+
error: boolean;
|
|
10
|
+
width?: string;
|
|
11
|
+
isRenderClearButton: boolean;
|
|
12
|
+
private isOpen;
|
|
13
|
+
private selectedDate;
|
|
14
|
+
/** La fecha que determina el mes y año actualmente visibles en el calendario. */
|
|
15
|
+
private viewDate;
|
|
16
|
+
private isMobile;
|
|
17
|
+
private calendarWidth;
|
|
18
|
+
private inputContainer;
|
|
19
|
+
static styles: import("lit").CSSResult;
|
|
20
|
+
/**
|
|
21
|
+
* Ciclo de vida: se ejecuta al conectar el componente al DOM.
|
|
22
|
+
* Inicializa el modo responsivo y listeners globales.
|
|
23
|
+
*/
|
|
24
|
+
connectedCallback(): void;
|
|
25
|
+
/**
|
|
26
|
+
* Ciclo de vida: se ejecuta al desconectar el componente del DOM.
|
|
27
|
+
* Limpia listeners globales.
|
|
28
|
+
*/
|
|
29
|
+
disconnectedCallback(): void;
|
|
30
|
+
/**
|
|
31
|
+
* Ciclo de vida: se llama después de que la primera actualización del componente ha terminado.
|
|
32
|
+
* Es ideal para obtener el ancho del DOM por primera vez.
|
|
33
|
+
*/
|
|
34
|
+
firstUpdated(): void;
|
|
35
|
+
/**
|
|
36
|
+
* Ciclo de vida: se llama después de cada actualización.
|
|
37
|
+
* Se usa para recalcular el ancho si la apertura del calendario ha cambiado.
|
|
38
|
+
|
|
39
|
+
* @param changedProperties - Mapa de propiedades que han cambiado.
|
|
40
|
+
*/
|
|
41
|
+
updated(changedProperties: Map<string, any>): void;
|
|
42
|
+
private setInitialWidth;
|
|
43
|
+
/**
|
|
44
|
+
* Referencia enlazada para el listener de resize.
|
|
45
|
+
*/
|
|
46
|
+
private updateResponsiveModeBound;
|
|
47
|
+
/**
|
|
48
|
+
* Actualiza el estado isMobile según el ancho de la ventana.
|
|
49
|
+
*/
|
|
50
|
+
private updateResponsiveMode;
|
|
51
|
+
/**
|
|
52
|
+
* Actualiza el componente cuando una propiedad cambia.
|
|
53
|
+
* Se encarga de parsear la fecha de la propiedad `value` al estado `selectedDate`.
|
|
54
|
+
|
|
55
|
+
* @param changedProperties - Mapa de propiedades que han cambiado.
|
|
56
|
+
*/
|
|
57
|
+
update(changedProperties: Map<string, any>): void;
|
|
58
|
+
/**
|
|
59
|
+
* Maneja el evento de entrada del usuario en el input.
|
|
60
|
+
* Valida el formato de la fecha y actualiza el estado del componente.
|
|
61
|
+
|
|
62
|
+
* @param e - Objeto de evento de entrada.
|
|
63
|
+
*/
|
|
64
|
+
handleInput(e: Event): void;
|
|
65
|
+
/**
|
|
66
|
+
* Cierra el calendario si el clic se realiza fuera del componente.
|
|
67
|
+
* Se ejecuta en el `document` para detectar clics en cualquier lugar de la página.
|
|
68
|
+
|
|
69
|
+
* @param e - Objeto de evento del clic.
|
|
70
|
+
*/
|
|
71
|
+
private handleClickOutside;
|
|
72
|
+
/**
|
|
73
|
+
* Abre o cierra el calendario al hacer clic en el botón de calendario.
|
|
74
|
+
|
|
75
|
+
* @param e - Objeto de evento del clic.
|
|
76
|
+
*/
|
|
77
|
+
handleCalendarButtonClick(e: Event): void;
|
|
78
|
+
/**
|
|
79
|
+
* Borra la fecha seleccionada y cierra el calendario.
|
|
80
|
+
*/
|
|
81
|
+
handleClearDate(): void;
|
|
82
|
+
/**
|
|
83
|
+
* Maneja la selección de fecha desde el calendario.
|
|
84
|
+
*/
|
|
85
|
+
private handleDateSelect;
|
|
86
|
+
/**
|
|
87
|
+
* Cierra el calendario y actualiza el valor del componente.
|
|
88
|
+
* Emite un evento 'date-selected' con el valor de la fecha seleccionada.
|
|
89
|
+
|
|
90
|
+
* @param valueSet - La fecha en formato de cadena (ej: 'dd-MM-yyyy') a establecer.
|
|
91
|
+
*/
|
|
92
|
+
private closeOverlay;
|
|
93
|
+
/**
|
|
94
|
+
* Renderiza el componente DatePicker, incluyendo el input, botones y el overlay del calendario.
|
|
95
|
+
*/
|
|
96
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
97
|
+
}
|
|
@@ -13,11 +13,13 @@ export declare class CustomModal extends LitElement {
|
|
|
13
13
|
primaryButtonLabel: string;
|
|
14
14
|
showSecondaryButton: boolean;
|
|
15
15
|
secondaryButtonLabel: string;
|
|
16
|
+
isFooterCustom: boolean;
|
|
16
17
|
private scrollable;
|
|
17
18
|
static styles: import("lit").CSSResult;
|
|
18
19
|
private closeModal;
|
|
19
20
|
connectedCallback(): void;
|
|
20
21
|
disconnectedCallback(): void;
|
|
21
22
|
private setScrollableMode;
|
|
23
|
+
private getFooterClass;
|
|
22
24
|
render(): import("lit-html").TemplateResult<1>;
|
|
23
25
|
}
|
package/dist/index.js
CHANGED
|
@@ -20,7 +20,7 @@ const l=t=>(e,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(t,e)}
|
|
|
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:O,reflect:!1,hasChanged:j},I=(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 T(t){return(e,i)=>"object"==typeof i?I(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
|
|
@@ -36,7 +36,7 @@ const I={attribute:!0,type:String,converter:O,reflect:!1,hasChanged:j},P=(t=I,e,
|
|
|
36
36
|
* Copyright 2017 Google LLC
|
|
37
37
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
38
38
|
*/
|
|
39
|
-
function
|
|
39
|
+
function F(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)}})}const _=t`
|
|
40
40
|
font-family: 'Graphik', sans-serif;
|
|
41
41
|
font-weight: 400;
|
|
42
42
|
font-size: 12px;
|
|
@@ -873,7 +873,7 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
873
873
|
|
|
874
874
|
.optional {
|
|
875
875
|
color: var(--secondary-color-60);
|
|
876
|
-
${
|
|
876
|
+
${_}
|
|
877
877
|
}
|
|
878
878
|
`}togglePassword(t){this.isPasswordVisible=!this.isPasswordVisible;const e=t.currentTarget.parentElement?.querySelector("input");e&&(e.type=this.isPasswordVisible?"text":"password"),this.requestUpdate()}handleInput(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}))}handleKeyDown(t){if("Enter"===t.key){const t=new Event("submit",{bubbles:!0,composed:!0,cancelable:!0}),e=this.closest("form");e&&e.dispatchEvent(t)}}render(){const t=this.cleanButton&&this.value&&"password"!==this.type&&"textarea"!==this.type;return i`
|
|
879
879
|
<div
|
|
@@ -986,7 +986,7 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
986
986
|
|
|
987
987
|
.optional {
|
|
988
988
|
color: var(--secondary-color-60);
|
|
989
|
-
${
|
|
989
|
+
${_}
|
|
990
990
|
}
|
|
991
991
|
`}render(){return i`
|
|
992
992
|
<label class="form-label">
|
|
@@ -1066,7 +1066,7 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1066
1066
|
<randstad-icon class="icon" name="${this.icon}" size="24px" style="color: var(--icon-color);"></randstad-icon>
|
|
1067
1067
|
<span class="message">${this.message}</span>
|
|
1068
1068
|
</div>
|
|
1069
|
-
`}};n([T({type:String}),a("design:type",String)],J.prototype,"type",void 0),n([T({type:String}),a("design:type",String)],J.prototype,"icon",void 0),n([T({type:String}),a("design:type",String)],J.prototype,"message",void 0),n([T({type:Boolean}),a("design:type",Boolean)],J.prototype,"open",void 0),J=n([l("randstad-notice")],J);let Q=class extends e{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.scrollable=!1,this.setScrollableMode=()=>{this.scrollable=window.innerWidth>940}}static{this.styles=t`
|
|
1069
|
+
`}};n([T({type:String}),a("design:type",String)],J.prototype,"type",void 0),n([T({type:String}),a("design:type",String)],J.prototype,"icon",void 0),n([T({type:String}),a("design:type",String)],J.prototype,"message",void 0),n([T({type:Boolean}),a("design:type",Boolean)],J.prototype,"open",void 0),J=n([l("randstad-notice")],J);let Q=class extends e{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.scrollable=!1,this.setScrollableMode=()=>{this.scrollable=window.innerWidth>940}}static{this.styles=t`
|
|
1070
1070
|
:host {
|
|
1071
1071
|
font-family: 'Graphik', sans-serif;
|
|
1072
1072
|
display: none;
|
|
@@ -1179,7 +1179,7 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1179
1179
|
border-top: 1px solid var(--secondary-color-20);
|
|
1180
1180
|
}
|
|
1181
1181
|
|
|
1182
|
-
.modal-footer.one-button randstad-button {
|
|
1182
|
+
.modal-footer.one-button randstad-button, .modal-footer.footer-custom {
|
|
1183
1183
|
width: 100%;
|
|
1184
1184
|
}
|
|
1185
1185
|
|
|
@@ -1196,7 +1196,7 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1196
1196
|
width: 100%;
|
|
1197
1197
|
}
|
|
1198
1198
|
}
|
|
1199
|
-
`}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)}render(){return i`
|
|
1199
|
+
`}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 i`
|
|
1200
1200
|
<div class="overlay" role="dialog" aria-modal="true">
|
|
1201
1201
|
<div class="modal ${this.scrollable?"scrollable":""}">
|
|
1202
1202
|
<div class="modal-header">
|
|
@@ -1205,10 +1205,12 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1205
1205
|
<div class="modal-title">${this.title}</div>
|
|
1206
1206
|
${this.subtitle?i`<div class="modal-subtitle">${this.subtitle}</div>`:o}
|
|
1207
1207
|
</div>
|
|
1208
|
+
|
|
1208
1209
|
<button class="modal-close" @click=${this.closeModal} aria-label="Cerrar modal">
|
|
1209
1210
|
<randstad-icon name="close" size="24px" style="--icon-color: var(--primary-color);"></randstad-icon>
|
|
1210
1211
|
</button>
|
|
1211
1212
|
</div>
|
|
1213
|
+
|
|
1212
1214
|
${this.showNotice?i`
|
|
1213
1215
|
<randstad-notice
|
|
1214
1216
|
.open=${!0}
|
|
@@ -1218,18 +1220,14 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1218
1220
|
></randstad-notice>
|
|
1219
1221
|
`:o}
|
|
1220
1222
|
</div>
|
|
1223
|
+
|
|
1221
1224
|
<div class="modal-body ${this.scrollable?"scrollable":""}">
|
|
1222
1225
|
<slot name="content"></slot>
|
|
1223
1226
|
</div>
|
|
1224
|
-
|
|
1225
|
-
|
|
1226
|
-
|
|
1227
|
-
|
|
1228
|
-
size="md"
|
|
1229
|
-
@click=${()=>this.dispatchEvent(new CustomEvent("primary-click"))}
|
|
1230
|
-
label=${this.primaryButtonLabel}
|
|
1231
|
-
></randstad-button>
|
|
1232
|
-
`:o}
|
|
1227
|
+
|
|
1228
|
+
<div class="modal-footer ${this.getFooterClass}">
|
|
1229
|
+
${!this.isFooterCustom||this.showPrimaryButton||this.showSecondaryButton?o:i` <slot name="footer-custom"></slot> `}
|
|
1230
|
+
|
|
1233
1231
|
${this.showSecondaryButton?i`
|
|
1234
1232
|
<randstad-button
|
|
1235
1233
|
variant="button-secondary"
|
|
@@ -1238,10 +1236,19 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1238
1236
|
label=${this.secondaryButtonLabel}
|
|
1239
1237
|
></randstad-button>
|
|
1240
1238
|
`:o}
|
|
1239
|
+
|
|
1240
|
+
${this.showPrimaryButton?i`
|
|
1241
|
+
<randstad-button
|
|
1242
|
+
variant="button-primary"
|
|
1243
|
+
size="md"
|
|
1244
|
+
@click=${()=>this.dispatchEvent(new CustomEvent("primary-click"))}
|
|
1245
|
+
label=${this.primaryButtonLabel}
|
|
1246
|
+
></randstad-button>
|
|
1247
|
+
`:o}
|
|
1241
1248
|
</div>
|
|
1242
1249
|
</div>
|
|
1243
1250
|
</div>
|
|
1244
|
-
`}};n([T({type:Boolean,reflect:!0}),a("design:type",Object)],Q.prototype,"open",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"title",void 0),n([T({type:String}),a("design:type",String)],Q.prototype,"subtitle",void 0),n([T({type:Boolean}),a("design:type",Object)],Q.prototype,"showNotice",void 0),n([T({type:String}),a("design:type",String)],Q.prototype,"noticeType",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"noticeMessage",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"noticeIcon",void 0),n([T({type:Boolean}),a("design:type",Object)],Q.prototype,"showPrimaryButton",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"primaryButtonLabel",void 0),n([T({type:Boolean}),a("design:type",Object)],Q.prototype,"showSecondaryButton",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"secondaryButtonLabel",void 0),n([L(),a("design:type",Object)],Q.prototype,"scrollable",void 0),Q=n([l("custom-modal")],Q);let Z=class extends e{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=t`
|
|
1251
|
+
`}};n([T({type:Boolean,reflect:!0}),a("design:type",Object)],Q.prototype,"open",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"title",void 0),n([T({type:String}),a("design:type",String)],Q.prototype,"subtitle",void 0),n([T({type:Boolean}),a("design:type",Object)],Q.prototype,"showNotice",void 0),n([T({type:String}),a("design:type",String)],Q.prototype,"noticeType",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"noticeMessage",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"noticeIcon",void 0),n([T({type:Boolean}),a("design:type",Object)],Q.prototype,"showPrimaryButton",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"primaryButtonLabel",void 0),n([T({type:Boolean}),a("design:type",Object)],Q.prototype,"showSecondaryButton",void 0),n([T({type:String}),a("design:type",Object)],Q.prototype,"secondaryButtonLabel",void 0),n([T({type:Boolean}),a("design:type",Object)],Q.prototype,"isFooterCustom",void 0),n([L(),a("design:type",Object)],Q.prototype,"scrollable",void 0),Q=n([l("custom-modal")],Q);let Z=class extends e{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=t`
|
|
1245
1252
|
:host {
|
|
1246
1253
|
display: none;
|
|
1247
1254
|
position: fixed;
|
|
@@ -1438,7 +1445,7 @@ function _(t,e){return(e,i,o)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Refl
|
|
|
1438
1445
|
}
|
|
1439
1446
|
|
|
1440
1447
|
.circle-text {
|
|
1441
|
-
${
|
|
1448
|
+
${_};
|
|
1442
1449
|
text-align: center;
|
|
1443
1450
|
vertical-align: middle;
|
|
1444
1451
|
fill: var(--randstad-dark-blue-40);
|
|
@@ -1519,7 +1526,7 @@ const dt="cubic-bezier(0.2, 0, 0, 1)";
|
|
|
1519
1526
|
* @license
|
|
1520
1527
|
* Copyright 2022 Google LLC
|
|
1521
1528
|
* SPDX-License-Identifier: Apache-2.0
|
|
1522
|
-
*/var ct;!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"}(ct||(ct={}));const pt=["click","contextmenu","pointercancel","pointerdown","pointerenter","pointerleave","pointerup"],ht=r?null:window.matchMedia("(forced-colors: active)");class ut extends e{constructor(){super(...arguments),this.disabled=!1,this.hovered=!1,this.pressed=!1,this.rippleSize="",this.rippleScale="",this.initialSize=0,this.state=ct.INACTIVE,this.checkBoundsAfterContextMenu=!1,this.attachableController=new ot(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 i`<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!==ct.INACTIVE&&this.endPressAnimation())}handlePointerup(t){if(this.shouldReactToEvent(t)){if(this.state!==ct.HOLDING)return this.state===ct.TOUCH_DELAY?(this.state=ct.WAITING_FOR_CLICK,void this.startPressAnimation(this.rippleStartEvent)):void 0;this.state=ct.WAITING_FOR_CLICK}}async handlePointerdown(t){if(this.shouldReactToEvent(t)){if(this.rippleStartEvent=t,!this.isTouch(t))return this.state=ct.WAITING_FOR_CLICK,void this.startPressAnimation(t);this.checkBoundsAfterContextMenu&&!this.inBounds(t)||(this.checkBoundsAfterContextMenu=!1,this.state=ct.TOUCH_DELAY,await new Promise((t=>{setTimeout(t,150)})),this.state===ct.TOUCH_DELAY&&(this.state=ct.HOLDING,this.startPressAnimation(t)))}}handleClick(){this.disabled||(this.state!==ct.WAITING_FOR_CLICK?this.state===ct.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,n=i+r,{pageX:a,pageY:l}=t;return{x:a-s,y:l-n}}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:dt,fill:"forwards"})}async endPressAnimation(){this.rippleStartEvent=void 0,this.state=ct.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(!ht?.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 pt)t?.removeEventListener(i,this),e?.addEventListener(i,this)}}n([T({type:Boolean,reflect:!0})],ut.prototype,"disabled",void 0),n([L()],ut.prototype,"hovered",void 0),n([L()],ut.prototype,"pressed",void 0),n([
|
|
1529
|
+
*/var ct;!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"}(ct||(ct={}));const pt=["click","contextmenu","pointercancel","pointerdown","pointerenter","pointerleave","pointerup"],ht=r?null:window.matchMedia("(forced-colors: active)");class ut extends e{constructor(){super(...arguments),this.disabled=!1,this.hovered=!1,this.pressed=!1,this.rippleSize="",this.rippleScale="",this.initialSize=0,this.state=ct.INACTIVE,this.checkBoundsAfterContextMenu=!1,this.attachableController=new ot(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 i`<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!==ct.INACTIVE&&this.endPressAnimation())}handlePointerup(t){if(this.shouldReactToEvent(t)){if(this.state!==ct.HOLDING)return this.state===ct.TOUCH_DELAY?(this.state=ct.WAITING_FOR_CLICK,void this.startPressAnimation(this.rippleStartEvent)):void 0;this.state=ct.WAITING_FOR_CLICK}}async handlePointerdown(t){if(this.shouldReactToEvent(t)){if(this.rippleStartEvent=t,!this.isTouch(t))return this.state=ct.WAITING_FOR_CLICK,void this.startPressAnimation(t);this.checkBoundsAfterContextMenu&&!this.inBounds(t)||(this.checkBoundsAfterContextMenu=!1,this.state=ct.TOUCH_DELAY,await new Promise((t=>{setTimeout(t,150)})),this.state===ct.TOUCH_DELAY&&(this.state=ct.HOLDING,this.startPressAnimation(t)))}}handleClick(){this.disabled||(this.state!==ct.WAITING_FOR_CLICK?this.state===ct.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,n=i+r,{pageX:a,pageY:l}=t;return{x:a-s,y:l-n}}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:dt,fill:"forwards"})}async endPressAnimation(){this.rippleStartEvent=void 0,this.state=ct.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(!ht?.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 pt)t?.removeEventListener(i,this),e?.addEventListener(i,this)}}n([T({type:Boolean,reflect:!0})],ut.prototype,"disabled",void 0),n([L()],ut.prototype,"hovered",void 0),n([L()],ut.prototype,"pressed",void 0),n([F(".surface")],ut.prototype,"mdRoot",void 0);
|
|
1523
1530
|
/**
|
|
1524
1531
|
* @license
|
|
1525
1532
|
* Copyright 2024 Google LLC
|
|
@@ -1560,18 +1567,18 @@ const Ct=Symbol("isFocusable"),Et=Symbol("privateIsFocusable"),Ot=Symbol("extern
|
|
|
1560
1567
|
* Copyright 2023 Google LLC
|
|
1561
1568
|
* SPDX-License-Identifier: Apache-2.0
|
|
1562
1569
|
*/
|
|
1563
|
-
const zt=Symbol("getFormValue"),
|
|
1570
|
+
const zt=Symbol("getFormValue"),Pt=Symbol("getFormState");
|
|
1564
1571
|
/**
|
|
1565
1572
|
* @license
|
|
1566
1573
|
* Copyright 2023 Google LLC
|
|
1567
1574
|
* SPDX-License-Identifier: Apache-2.0
|
|
1568
1575
|
*/
|
|
1569
|
-
class
|
|
1576
|
+
class It{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}}
|
|
1570
1577
|
/**
|
|
1571
1578
|
* @license
|
|
1572
1579
|
* Copyright 2023 Google LLC
|
|
1573
1580
|
* SPDX-License-Identifier: Apache-2.0
|
|
1574
|
-
*/class Tt extends
|
|
1581
|
+
*/class Tt extends It{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})))}}
|
|
1575
1582
|
/**
|
|
1576
1583
|
* @license
|
|
1577
1584
|
* Copyright 2022 Google LLC
|
|
@@ -1581,7 +1588,7 @@ class Pt{constructor(t){this.getCurrentState=t,this.currentValidity={validity:{}
|
|
|
1581
1588
|
* @license
|
|
1582
1589
|
* Copyright 2018 Google LLC
|
|
1583
1590
|
* SPDX-License-Identifier: Apache-2.0
|
|
1584
|
-
*/var
|
|
1591
|
+
*/var Ft;const _t=Symbol("checked");let Mt=0;const Rt=function(t){var e;class i extends t{constructor(){super(...arguments),this[e]=""}get validity(){return this[$t](),this[mt].validity}get validationMessage(){return this[$t](),this[mt].validationMessage}get willValidate(){return this[$t](),this[mt].willValidate}checkValidity(){return this[$t](),this[mt].checkValidity()}reportValidity(){return this[$t](),this[mt].reportValidity()}setCustomValidity(t){this[St]=t,this[$t]()}requestUpdate(t,e,i){super.requestUpdate(t,e,i),this[$t]()}firstUpdated(t){super.firstUpdated(t),this[$t]()}[(e=St,$t)](){if(r)return;this[kt]||(this[kt]=this[xt]());const{validity:t,validationMessage:e}=this[kt].getValidity(),i=!!this[St],o=this[St]||e;this[mt].setValidity({...t,customError:i},o,this[wt]()??void 0)}[xt](){throw new Error("Implement [createValidator]")}[wt](){throw new Error("Implement [getValidityAnchor]")}}return i}(function(t){class e extends t{get form(){return this[mt].form}get labels(){return this[mt].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[mt].setFormValue(this[zt](),this[Pt]())}[zt](){throw new Error("Implement [getFormValue]")}[Pt](){return this[zt]()}formDisabledCallback(t){this.disabled=t}}return e.formAssociated=!0,n([T({noAccessor:!0})],e.prototype,"name",null),n([T({type:Boolean,noAccessor:!0})],e.prototype,"disabled",null),e}((Bt=function(t){var e,i,o;class r extends t{constructor(){super(...arguments),this[e]=!0,this[i]=null,this[o]=!1}get[Ct](){return this[Et]}set[Ct](t){this[Ct]!==t&&(this[Et]=t,this[At]())}connectedCallback(){super.connectedCallback(),this[At]()}attributeChangedCallback(t,e,i){if("tabindex"===t){if(this.requestUpdate("tabIndex",Number(e??-1)),!this[jt])return this.hasAttribute("tabindex")?void(this[Ot]=this.tabIndex):(this[Ot]=null,void this[At]())}else super.attributeChangedCallback(t,e,i)}[(e=Et,i=Ot,o=jt,At)](){const t=this[Ct]?0:-1,e=this[Ot]??t;this[jt]=!0,this.tabIndex=e,this[jt]=!1}}return n([T({noAccessor:!0})],r.prototype,"tabIndex",void 0),r}(e),class extends Bt{get[mt](){return this[ft]||(this[ft]=this.attachInternals()),this[ft]}})));var Bt;class Dt extends Rt{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"+ ++Mt,this[Ft]=!1,this.required=!1,this.value="on",this.selectionController=new Lt(this),this.addController(this.selectionController),r||(this[mt].role="radio",this.addEventListener("click",this.handleClick.bind(this)),this.addEventListener("keydown",this.handleKeydown.bind(this)))}render(){const t={checked:this.checked};return i`
|
|
1585
1592
|
<div class="container ${s(t)}" aria-hidden="true">
|
|
1586
1593
|
<md-ripple
|
|
1587
1594
|
part="ripple"
|
|
@@ -1604,7 +1611,7 @@ class Pt{constructor(t){this.getCurrentState=t,this.currentValidity={validity:{}
|
|
|
1604
1611
|
|
|
1605
1612
|
<div class="touch-target"></div>
|
|
1606
1613
|
</div>
|
|
1607
|
-
`}updated(){this[mt].ariaChecked=String(this.checked)}async handleClick(t){this.disabled||(await 0,t.defaultPrevented||(yt(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()}[(_t
|
|
1614
|
+
`}updated(){this[mt].ariaChecked=String(this.checked)}async handleClick(t){this.disabled||(await 0,t.defaultPrevented||(yt(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()}[(Ft=_t,zt)](){return this.checked?this.value:null}[Pt](){return String(this.checked)}formResetCallback(){this.checked=this.hasAttribute("checked")}formStateRestoreCallback(t){this.checked="true"===t}[xt](){return new Tt((()=>this.selectionController?this.selectionController.controls:[this]))}[wt](){return this.container}}n([T({type:Boolean})],Dt.prototype,"checked",null),n([T({type:Boolean})],Dt.prototype,"required",void 0),n([T()],Dt.prototype,"value",void 0),n([F(".container")],Dt.prototype,"container",void 0);
|
|
1608
1615
|
/**
|
|
1609
1616
|
* @license
|
|
1610
1617
|
* Copyright 2024 Google LLC
|
|
@@ -1974,7 +1981,7 @@ const Ut=t`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
1974
1981
|
|
|
1975
1982
|
.optional {
|
|
1976
1983
|
color: var(--secondary-color-60);
|
|
1977
|
-
${
|
|
1984
|
+
${_}
|
|
1978
1985
|
}
|
|
1979
1986
|
|
|
1980
1987
|
/* Estilos por defecto del icon para mobile */
|
|
@@ -2120,7 +2127,7 @@ const Ut=t`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2120
2127
|
`:""}
|
|
2121
2128
|
</div>
|
|
2122
2129
|
</div>
|
|
2123
|
-
`}};n([T({type:Array}),a("design:type",Array)],Nt.prototype,"options",void 0),n([T({type:String}),a("design:type",Object)],Nt.prototype,"placeholder",void 0),n([T({type:String,attribute:"default-value"}),a("design:type",Object)],Nt.prototype,"defaultValue",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"disabled",void 0),n([T({type:Object}),a("design:type",Object)],Nt.prototype,"value",void 0),n([T({type:String}),a("design:type",Object)],Nt.prototype,"label",void 0),n([T({type:String}),a("design:type",Object)],Nt.prototype,"labelColor",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"filterable",void 0),n([T({type:Number}),a("design:type",Number)],Nt.prototype,"maxLength",void 0),n([T({type:Boolean,reflect:!0}),a("design:type",Boolean)],Nt.prototype,"error",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"required",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"optional",void 0),n([L(),a("design:type",Boolean)],Nt.prototype,"isMobile",void 0),n([L(),a("design:type",Array)],Nt.prototype,"filteredOptions",void 0),n([L(),a("design:type",Object)],Nt.prototype,"filterValue",void 0),n([L(),a("design:type",Object)],Nt.prototype,"isOpen",void 0),n([L(),a("design:type",Object)],Nt.prototype,"mobileFilterValue",void 0),n([L(),a("design:type",Object)],Nt.prototype,"highlightedIndex",void 0),n([L(),a("design:type",Boolean)],Nt.prototype,"_isCleared",void 0),Nt=n([l("filterable-select")],Nt);const Gt=new CSSStyleSheet;Gt.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");class Ht extends e{static{this.styles=[Gt,t`
|
|
2130
|
+
`}};n([T({type:Array}),a("design:type",Array)],Nt.prototype,"options",void 0),n([T({type:String}),a("design:type",Object)],Nt.prototype,"placeholder",void 0),n([T({type:String,attribute:"default-value"}),a("design:type",Object)],Nt.prototype,"defaultValue",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"disabled",void 0),n([T({type:Object}),a("design:type",Object)],Nt.prototype,"value",void 0),n([T({type:String}),a("design:type",Object)],Nt.prototype,"label",void 0),n([T({type:String}),a("design:type",Object)],Nt.prototype,"labelColor",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"filterable",void 0),n([T({type:Number}),a("design:type",Number)],Nt.prototype,"maxLength",void 0),n([T({type:Boolean,reflect:!0}),a("design:type",Boolean)],Nt.prototype,"error",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"required",void 0),n([T({type:Boolean}),a("design:type",Object)],Nt.prototype,"optional",void 0),n([L(),a("design:type",Boolean)],Nt.prototype,"isMobile",void 0),n([L(),a("design:type",Array)],Nt.prototype,"filteredOptions",void 0),n([L(),a("design:type",Object)],Nt.prototype,"filterValue",void 0),n([L(),a("design:type",Object)],Nt.prototype,"isOpen",void 0),n([L(),a("design:type",Object)],Nt.prototype,"mobileFilterValue",void 0),n([L(),a("design:type",Object)],Nt.prototype,"highlightedIndex",void 0),n([L(),a("design:type",Boolean)],Nt.prototype,"_isCleared",void 0),Nt=n([l("filterable-select")],Nt);const Gt=new CSSStyleSheet;Gt.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 Ht extends e{static{this.styles=[Gt,t`
|
|
2124
2131
|
:host {
|
|
2125
2132
|
display: flex;
|
|
2126
2133
|
position: fixed;
|
|
@@ -2537,21 +2544,21 @@ const Ut=t`@layer{:host{display:inline-flex;height:var(--md-radio-icon-size, 20p
|
|
|
2537
2544
|
}
|
|
2538
2545
|
|
|
2539
2546
|
.text-secondary {
|
|
2540
|
-
${
|
|
2547
|
+
${_};
|
|
2541
2548
|
text-align: center;
|
|
2542
2549
|
vertical-align: middle;
|
|
2543
2550
|
color: var(--secondary-color-60);
|
|
2544
2551
|
}
|
|
2545
2552
|
|
|
2546
2553
|
.text-tertiary {
|
|
2547
|
-
${
|
|
2554
|
+
${_};
|
|
2548
2555
|
text-align: center;
|
|
2549
2556
|
vertical-align: middle;
|
|
2550
2557
|
color: var(--secondary-color-40);
|
|
2551
2558
|
}
|
|
2552
2559
|
|
|
2553
2560
|
.button {
|
|
2554
|
-
${
|
|
2561
|
+
${_};
|
|
2555
2562
|
background-color: var(--primary-color);
|
|
2556
2563
|
border: none;
|
|
2557
2564
|
padding: 4px 16px;
|