@proximus/lavender-autocomplete 1.4.15-alpha.7 → 1.4.15-beta.1
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/index.es.js +190 -196
- package/package.json +1 -1
package/dist/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { AttributeBreakpointHandlerDelegate as e, PxElement as t, WithExtraAttributes as n, backgroundColorValues as r, backgroundSizeValues as i, booleanPropertyToAttributeSetter as a, borderColorValues as o, borderRadiusValues as s, borderSideValues as c, borderValues as
|
|
1
|
+
import { AttributeBreakpointHandlerDelegate as e, PxElement as t, WithExtraAttributes as n, backgroundColorValues as r, backgroundSizeValues as i, booleanPropertyToAttributeSetter as a, borderColorValues as o, borderRadiusValues as s, borderSideValues as c, borderValues as ee, boxShadowValues as te, checkName as l, colorValues as ne, cssTokenBreakpoints as u, fontsizeValues as d, fontweightValues as f, gapValues as p, gradientValues as m, iconSizeValuesKC as re, log as h, noBorderRadiusValues as ie, paddingValues as g, propertyToAttributeSetter as _, transferAccessibilityAttributes as v } from "@proximus/lavender-common";
|
|
2
2
|
//#region src/autocomplete.css?inline
|
|
3
3
|
var y = ":host .dropdown-content{background-color:var(--px-color-background-surface-default);border-radius:var(--px-radius-main);margin-top:calc(var(--px-focus-offset-mobile) + var(--px-focus-outline-mobile));padding:0;overflow:auto;box-shadow:0 4px 6px -1px #25252514}@media screen and (width>=48rem){:host .dropdown-content{margin-top:calc(var(--px-focus-offset-tablet) + var(--px-focus-outline-tablet))}}@media screen and (width>=64.0625rem){:host .dropdown-content{margin-top:calc(var(--px-focus-offset-laptop) + var(--px-focus-outline-laptop))}}@media screen and (width>=90.0625rem){:host .dropdown-content{margin-top:calc(var(--px-focus-offset-desktop) + var(--px-focus-outline-desktop))}}:host([inverted]) .dropdown-content{background-color:var(--px-color-background-surface-dark)}", b = ":host{position:relative}::slotted([slot=popover]){border-radius:var(--px-radius-main,8px);background:var(--px-color-background-container-light-default,#fff);padding:var(--px-padding-xs-mobile) 0;width:auto;max-height:var(--px-popover-max-height);border:0;margin:0;position:fixed;right:0;box-shadow:0 20px 25px -5px #25252514}:host([grow]) ::slotted([slot=trigger]):after{padding-right:var(--px-padding-xs-mobile);right:0}:host([anchoralignment=top-left]) ::slotted([slot=popover]){top:auto}:host([anchoralignment=top-right]) ::slotted([slot=popover]){top:auto}:host([anchoralignment=bottom-right]) ::slotted([slot=popover]){left:auto}@media screen and (width<=47.938rem){::slotted([slot=trigger]){width:100%;display:block}:host([anchoralignment=top-left]) ::slotted([slot=popover]){left:var(--px-padding-s-mobile)}:host([anchoralignment=top-right]) ::slotted([slot=popover]){left:var(--px-padding-s-mobile)}}@media screen and (width>=48rem){::slotted([slot=popover]){padding-block:var(--px-padding-s-desktop);width:auto;right:auto}}", x = [
|
|
4
4
|
"top-left",
|
|
@@ -20,7 +20,7 @@ function S(e, t, n = "bottom-left", r, i = !1) {
|
|
|
20
20
|
//#region ../../components/Dropdown/src/Dropdown.ts
|
|
21
21
|
var C = new CSSStyleSheet();
|
|
22
22
|
C.replaceSync(b);
|
|
23
|
-
var w = "bottom-left",
|
|
23
|
+
var w = "bottom-left", ae = class extends n {
|
|
24
24
|
get css() {
|
|
25
25
|
return `::slotted([slot='trigger']) {
|
|
26
26
|
anchor-name: ${this.anchorName};
|
|
@@ -139,7 +139,7 @@ var w = "bottom-left", ie = class extends n {
|
|
|
139
139
|
return this.getAttribute("anchoralignment") || w;
|
|
140
140
|
}
|
|
141
141
|
set anchorAlignment(e) {
|
|
142
|
-
x.includes(e) ? this.setAttribute("anchoralignment", e) : (
|
|
142
|
+
x.includes(e) ? this.setAttribute("anchoralignment", e) : (h(`Invalid anchor alignment value: ${e}. Using default ${w}.`), this.setAttribute("anchoralignment", w));
|
|
143
143
|
}
|
|
144
144
|
get usePolyfill() {
|
|
145
145
|
return this.hasAttribute("use-polyfill");
|
|
@@ -157,14 +157,14 @@ var w = "bottom-left", ie = class extends n {
|
|
|
157
157
|
return this.getAttribute("popover-height");
|
|
158
158
|
}
|
|
159
159
|
set popoverHeight(e) {
|
|
160
|
-
|
|
160
|
+
_(this, "popover-height", e);
|
|
161
161
|
}
|
|
162
162
|
};
|
|
163
|
-
customElements.get("px-dropdown") || customElements.define("px-dropdown",
|
|
163
|
+
customElements.get("px-dropdown") || customElements.define("px-dropdown", ae);
|
|
164
164
|
//#endregion
|
|
165
165
|
//#region ../../components/Input/src/input.css?inline
|
|
166
|
-
var ae = ":host{--icon-error:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17' width='17' height='17'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23B30000;%7D%3C/style%3E%3C/defs%3E%3Cg id='forms-error'%3E%3Cpath id='Error' class='cls-1' d='M8.5,0A8.5,8.5,0,1,0,17,8.5,8.51,8.51,0,0,0,8.5,0ZM7.42,4.65a1.08,1.08,0,1,1,2.16,0V8.79a1.08,1.08,0,0,1-2.16,0Zm1.93,8.44a1.2,1.2,0,0,1-1.7-1.69,1.15,1.15,0,0,1,.85-.35,1.11,1.11,0,0,1,.84.35h0A1.21,1.21,0,0,1,9.35,13.09Z'/%3E%3C/g%3E%3C/svg%3E\");--icon-success:url(\"data:image/svg+xml,%3Csvg id='forms-success' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17' width='17' height='17'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23008000;%7D%3C/style%3E%3C/defs%3E%3Cpath id='Success' class='cls-1' d='M8.5,0A8.5,8.5,0,1,0,17,8.5,8.51,8.51,0,0,0,8.5,0Zm3.69,7.08-4.29,4a.81.81,0,0,1-.56.22.84.84,0,0,1-.59-.24L4.67,9A.81.81,0,0,1,5.81,7.85L7.35,9.4,11.1,5.91a.8.8,0,0,1,1.09,1.17Z'/%3E%3C/svg%3E\");--icon-search:url(data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M17.6451%2016.6649L12.5811%2011.7844C13.4371%2010.7503%2013.9122%209.46601%2013.9282%208.10498C13.9463%206.53112%2013.351%205.04391%2012.251%203.91824C11.1511%202.79211%209.67878%202.16202%208.10492%202.14352C8.081%202.14352%208.05753%202.14307%208.03406%202.14307C6.48637%202.14307%205.02715%202.7375%203.9182%203.82074C2.79208%204.92069%202.16199%206.393%202.14349%207.96687C2.12498%209.54118%202.72031%2011.0279%203.82026%2012.1536C4.97344%2013.3339%206.50442%2013.9261%208.03677%2013.9261C9.28408%2013.9261%2010.5303%2013.528%2011.5758%2012.7405L16.6828%2017.6633C16.8173%2017.7928%2016.9906%2017.8574%2017.164%2017.8574C17.3454%2017.8574%2017.5273%2017.7865%2017.6632%2017.6452C17.929%2017.3694%2017.9209%2016.9307%2017.6451%2016.6649ZM11.1849%2011.2595C10.3237%2012.1008%209.18546%2012.5707%207.98305%2012.5418C6.7793%2012.5278%205.65317%2012.0457%204.8123%2011.185C3.97101%2010.3238%203.5156%209.18687%203.53004%207.98312C3.54403%206.77981%204.02608%205.65369%204.88678%204.81282C5.73487%203.98413%206.85106%203.52962%208.03451%203.52962C8.05256%203.52962%208.07062%203.53007%208.08867%203.53007C9.29198%203.54406%2010.4181%204.02611%2011.2589%204.88684C12.1003%205.74802%2012.5557%206.88498%2012.5417%208.08873C12.5277%209.29249%2012.0456%2010.4186%2011.1849%2011.2595Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E);--icon-cancel:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 17 17' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.33333 0C12.9357 0 16.6667 3.73096 16.6667 8.33333C16.6667 12.9357 12.9357 16.6667 8.33333 16.6667C3.73096 16.6667 0 12.9357 0 8.33333C0 3.73096 3.73096 0 8.33333 0ZM12.3071 4.35954C12.0502 4.10263 11.6339 4.10262 11.377 4.35954L8.33333 7.40316L5.28971 4.35954C5.03279 4.10261 4.61646 4.10261 4.35954 4.35954C4.10261 4.61646 4.10261 5.03279 4.35954 5.28971L7.40316 8.33333L4.35954 11.377C4.10262 11.6339 4.10263 12.0502 4.35954 12.3071C4.61648 12.5639 5.03284 12.564 5.28971 12.3071L8.33333 9.26351L11.377 12.3071C11.6339 12.564 12.0502 12.564 12.3071 12.3071C12.564 12.0502 12.564 11.6339 12.3071 11.377L9.26351 8.33333L12.3071 5.28971C12.564 5.03284 12.5639 4.61648 12.3071 4.35954Z' fill='%235C2D91'/%3E%3C/svg%3E\");--icon-calendar:url(data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M14.7369%201.68408H12.779V0.42102C12.779%200.188549%2012.5904%200%2012.358%200C12.1255%200%2011.9369%200.188549%2011.9369%200.42102V1.68408H9.92439V0.42102C9.92439%200.188549%209.73584%200%209.50337%200C9.2709%200%209.08235%200.188549%209.08235%200.42102V1.68408H7.0698V0.42102C7.0698%200.188549%206.88126%200%206.64878%200C6.41631%200%206.22777%200.188549%206.22777%200.42102V1.68408H4.21082V0.42102C4.21051%200.188549%204.02196%200%203.78949%200C3.55702%200%203.36847%200.188549%203.36847%200.42102V1.68408H2.52643C1.13098%201.68408%200%202.81537%200%204.21051V14.7369C0%2015.4344%200.565647%2016%201.26306%2016H13.4736C14.8687%2016%2016%2014.869%2016%2013.4736V2.94745C16%202.24973%2015.4344%201.68408%2014.7369%201.68408ZM15.158%2013.4736C15.158%2014.4038%2014.4041%2015.1576%2013.4739%2015.1576H1.26306C1.03059%2015.1576%200.842039%2014.9691%200.842039%2014.7366V6.73663H15.158V13.4736ZM15.158%205.89459H0.842039V4.21051C0.842039%203.28031%201.59592%202.52643%202.52612%202.52643H3.36816V3.78949C3.36816%204.02196%203.55671%204.21051%203.78918%204.21051C4.02165%204.21051%204.2102%204.02196%204.2102%203.78949V2.52643H6.22714V3.78949C6.22714%204.02196%206.41569%204.21051%206.64816%204.21051C6.88063%204.21051%207.06918%204.02196%207.06918%203.78949V2.52643H9.08173V3.78949C9.08173%204.02196%209.27028%204.21051%209.50275%204.21051C9.73522%204.21051%209.92377%204.02196%209.92377%203.78949V2.52643H11.9363V3.78949C11.9363%204.02196%2012.1249%204.21051%2012.3573%204.21051C12.5898%204.21051%2012.7784%204.02196%2012.7784%203.78949V2.52643H14.7363C14.9688%202.52643%2015.1573%202.71498%2015.1573%202.94745V5.89459H15.158Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E);--icon-clock:url(data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M8%200C3.5818%200%200%203.5818%200%208C0%2012.4182%203.5818%2016%208%2016C12.4182%2016%2016%2012.4182%2016%208C16%203.5818%2012.4182%200%208%200ZM8%2015.158C4.04675%2015.158%200.842039%2011.9533%200.842039%208C0.842039%204.04675%204.04675%200.842039%208%200.842039C11.9533%200.842039%2015.158%204.04675%2015.158%208C15.158%2011.9533%2011.9533%2015.158%208%2015.158Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3Cpath%20d%3D%22M7.99929%202.81256C7.76682%202.81256%207.57827%203.00111%207.57827%203.23358V7.76818C7.57607%207.89963%207.46972%208.00599%207.33827%208.00818H2.78235C2.54988%208.00818%202.36133%208.19673%202.36133%208.4292C2.36133%208.66167%202.54988%208.85022%202.78235%208.85022H7.32133C7.92117%208.85713%208.41309%208.3765%208.42031%207.77665C8.42031%207.77383%208.42031%207.771%208.42031%207.76818V3.23358C8.42031%203.00111%208.23176%202.81256%207.99929%202.81256Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E%0A);--icon-select:url(data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M4%206.6665L8%2010.6665L12%206.6665%22%20stroke%3D%22%235C2D91%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E);--icon-upload:url(data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M18.7284%2020H6.54327C5.14071%2020%204%2018.816%204%2017.3603V16.102C4%2015.8589%204.18949%2015.6622%204.42374%2015.6622C4.65799%2015.6622%204.84748%2015.8589%204.84748%2016.102V17.3603C4.84748%2018.3311%205.60795%2019.1204%206.54327%2019.1204H18.7279C18.9618%2019.1204%2019.1517%2018.9233%2019.1517%2018.6806V16.0738C19.1517%2015.8307%2019.3412%2015.634%2019.5754%2015.634C19.8097%2015.634%2019.9992%2015.8307%2019.9992%2016.0738V18.6806C20%2019.4074%2019.4294%2020%2018.7284%2020Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3Cpath%20d%3D%22M12.4435%204.29306C12.0671%203.90231%2011.4576%203.90231%2011.0811%204.29306L11.0774%204.29697L7.39173%208.122C7.01526%208.51275%207.01526%209.14534%207.39173%209.53609C7.7682%209.92684%208.37766%209.92684%208.75413%209.53609L10.7929%207.41951H10.7967V15.0414C10.7967%2015.4799%2011.1397%2015.8354%2011.5622%2015.8354H11.9579C12.3808%2015.8354%2012.7234%2015.4799%2012.7234%2015.0414V7.41821H12.7292L14.7659%209.53218C15.1424%209.92293%2015.7523%209.92293%2016.1284%209.53218C16.5048%209.14186%2016.5048%208.50884%2016.1284%208.11853L12.4435%204.29306Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E);--cancel-icon-width:1em;--cancel-icon-height:1em;--search-icon-datalist-width:2em;--search-icon-focus-width:var(--search-icon-datalist-width);display:block}:host *{box-sizing:border-box}label{all:unset;font-size:var(--px-font-size-base);line-height:var(--px-line-height-ratio-l)}input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container{vertical-align:baseline;align-items:center;gap:var(--px-spacing-default-mobile);padding:var(--px-padding-xs-mobile) calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-s-mobile)) var(--px-padding-xs-mobile) var(--px-padding-s-mobile);background:var(--px-color-background-container-default-default) no-repeat;background-position:center right var(--px-padding-s-mobile);box-shadow:var(--px-color-border-neutral-default) 0 0 0px var(--px-size-border-m) inset;border-radius:var(--px-radius-main);color:var(--px-color-text-neutral-default);font-family:var(--px-font-family);font-weight:var(--px-font-weight-body);font-size:var(--px-text-size-label-l-mobile);line-height:var(--px-line-height-ratio-l);text-align:left;box-sizing:border-box;border:none;outline:0;margin:0;height:var(--px-size-l)!important}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended{width:100%}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).error:hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).success:hover{box-shadow:var(--px-color-border-state-hover-default) 0 0 0px var(--px-size-border-l) inset;background-color:var(--px-color-background-state-hover-bordered-default)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):focus-visible:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-mobile);outline:var(--px-focus-outline-mobile) solid var(--px-color-border-focus-outline-default)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):active{box-shadow:var(--px-color-border-state-active-default) 0 0 0px var(--px-size-border-m) inset;background-color:var(--px-color-background-container-default-default);outline:none}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):disabled,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):read-only:not(:is(select),#input-file-container){box-shadow:var(--px-color-border-neutral-default) 0 0 0px 0 inset;font-weight:var(--px-font-weight-title);text-align:left;background:0 0;padding:0}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).error{box-shadow:var(--px-color-border-purpose-error-default) 0 0 0px var(--px-size-border-m) inset;background-repeat:no-repeat;background-image:var(--icon-error)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).success{box-shadow:var(--px-color-border-purpose-success-default) 0 0 0px var(--px-size-border-m) inset;background-repeat:no-repeat;background-image:var(--icon-success)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile)), center right var(--px-padding-s-mobile)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time].success{background-image:var(--icon-success)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time].error{background-image:var(--icon-error)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile))}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-mobile) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile))}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).success{background-image:var(--icon-success)}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).error{background-image:var(--icon-error)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]{background-image:var(--icon-search);padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-s-mobile))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;background-image:var(--icon-cancel);height:var(--cancel-icon-height);width:var(--cancel-icon-width);margin-right:calc(( var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) ) * -1);margin-left:var(--px-spacing-s-mobile);background-position:50%;background-repeat:no-repeat}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{opacity:1;pointer-events:auto;margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{opacity:1;pointer-events:auto;margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:focus::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-mobile) + var(--px-spacing-xs-mobile) ) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-mobile) + var(--px-spacing-xs-mobile) ) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:focus::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-mobile);background-image:var(--icon-search)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success{background-image:var(--icon-success), var(--icon-search)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error{background-image:var(--icon-error), var(--icon-search)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select){text-overflow:ellipsis;background-image:var(--icon-select);-webkit-appearance:none;width:100%;padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-s-mobile))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).success{background-image:var(--icon-success), var(--icon-select)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).error{background-image:var(--icon-error), var(--icon-select)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(textarea){flex-grow:0;height:auto!important}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(textarea).success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(textarea).error{background-position:right 1rem top .5rem}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container{background-repeat:no-repeat;background-position:center right var(--px-padding-s-mobile);background-image:var(--icon-upload);align-items:center;max-width:100%;display:flex}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container span{text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.success{background-image:var(--icon-success), var(--icon-upload)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.error{background-image:var(--icon-error), var(--icon-upload)}:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-mobile) + 2 * var(--px-padding-xs-mobile) + var(--px-size-icon-s));background-image:var(--icon-search);padding-right:var(--autocomplete-search-icon-width);background-position:right 1rem center}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-mobile) + var(--px-padding-xs-mobile) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile)), center right var(--px-padding-s-mobile);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-mobile) + var(--px-padding-xs-mobile) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile)), center right var(--px-padding-s-mobile);background-image:var(--icon-error), var(--icon-search)!important}slot{font-family:var(--px-font-family);font-size:var(--px-text-size-label-m-mobile);font-weight:var(--px-font-weight-body);line-height:var(--px-line-height-ratio-l);text-align:left;color:var(--px-color-text-neutral-default)}slot.error{color:var(--px-color-text-purpose-error-default)}slot.success{color:var(--px-color-text-purpose-success-default)}slot[name=helper]{color:#0000008f;font-size:var(--px-text-size-label-s-mobile)}#container{gap:var(--px-spacing-2xs-mobile);flex-direction:column;display:inline-flex}#container:has(#input-file-container){max-width:100%}:host([extended]) #container{width:100%}#label-helper{gap:var(--px-spacing-2xs-mobile);flex-direction:column;display:flex}input[type=file]{-webkit-appearance:none;opacity:0;width:0;height:0}@media screen and (width<=47.938rem){:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended--mobile{width:100%}:host([extended--mobile]) #container{width:100%}}@media screen and (width>=48rem) and (width<=64rem){:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended--tablet{width:100%}:host([extended--tablet]) #container{width:100%}}@media screen and (width>=48rem){:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-tablet) + 2 * var(--px-padding-xs-tablet) + var(--px-size-icon-s))}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-tablet) + var(--px-padding-xs-tablet) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet)), center right var(--px-padding-s-tablet);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-tablet) + var(--px-padding-xs-tablet) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet)), center right var(--px-padding-s-tablet);background-image:var(--icon-error), var(--icon-search)!important}input:not([type=file]),textarea,select,#input-file-container{gap:var(--px-spacing-default-tablet);padding:var(--px-padding-xs-tablet) calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-s-tablet)) var(--px-padding-xs-tablet) var(--px-padding-s-tablet);font-size:var(--px-text-size-label-l-tablet);background-position:center right var(--px-padding-s-tablet);height:var(--px-size-l)!important}:is(input:not([type=file]),textarea,select,#input-file-container):focus-visible:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-tablet);outline-width:var(--px-focus-outline-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet)), center right var(--px-padding-s-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet))}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-tablet) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]{padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-s-tablet))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]::-webkit-search-cancel-button{margin-right:calc(( var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) ) * -1);margin-left:var(--px-spacing-s-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-tablet) + var(--px-spacing-xs-tablet) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-tablet) + var(--px-spacing-xs-tablet) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container):is(select){padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-s-tablet))}:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container{background-position:center right var(--px-padding-s-tablet)}slot{font-size:var(--px-text-size-label-m-tablet)}slot[name=helper]{font-size:var(--px-text-size-label-s-tablet)}#container,#label-helper{gap:var(--px-spacing-2xs-tablet)}}@media screen and (width>=64.0625rem) and (width<=90rem){:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended--laptop{width:100%}:host([extended--laptop]) #container{width:100%}}@media screen and (width>=64.0625rem){:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-laptop) + 2 * var(--px-padding-xs-laptop) + var(--px-size-icon-s))}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-error), var(--icon-search)!important}input:not([type=file]),textarea,select,#input-file-container{gap:var(--px-spacing-default-laptop);padding:var(--px-padding-xs-laptop) calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-s-laptop)) var(--px-padding-xs-laptop) var(--px-padding-s-laptop);font-size:var(--px-text-size-label-l-laptop);background-position:center right var(--px-padding-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container):focus-visble:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-laptop);outline-width:var(--px-focus-outline-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop))}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-laptop) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]{padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-s-laptop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]::-webkit-search-cancel-button{margin-right:calc(( var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) ) * -1);margin-left:var(--px-spacing-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus-visible::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-laptop) + var(--px-spacing-xs-laptop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-laptop) + var(--px-spacing-xs-laptop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container):is(select){padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-s-laptop))}:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container{background-position:center right var(--px-padding-s-laptop)}slot{font-size:var(--px-text-size-label-m-laptop)}slot[name=helper]{font-size:var(--px-text-size-label-s-laptop)}#container,#label-helper{gap:var(--px-spacing-2xs-laptop)}}@media screen and (width>=90.0625rem){:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-desktop) + 2 * var(--px-padding-xs-desktop) + var(--px-size-icon-s))}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-error), var(--icon-search)!important}input:not([type=file]),textarea,select,#input-file-container{gap:var(--px-spacing-default-desktop);padding:var(--px-padding-xs-desktop) calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-s-desktop)) var(--px-padding-xs-desktop) var(--px-padding-s-desktop);font-size:var(--px-text-size-label-l-desktop);background-position:center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container):focus-visble:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-desktop);outline-width:var(--px-focus-outline-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop)), center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop))}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-desktop) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]{padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-s-desktop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]::-webkit-search-cancel-button{margin-right:calc(( var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) ) * -1);margin-left:var(--px-spacing-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus-visible::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-desktop) + var(--px-spacing-xs-desktop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-desktop) + var(--px-spacing-xs-desktop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus-visible::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container):is(select){padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-s-desktop))}:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container{background-position:center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container).extended--desktop{width:100%}:host([extended--desktop]) #container{width:100%}slot{font-size:var(--px-text-size-label-m-desktop)}slot[name=helper]{font-size:var(--px-text-size-label-s-desktop)}#container{gap:var(--px-spacing-2xs-laptop)}#label-helper{gap:var(--px-spacing-2xs-desktop)}}", T = new CSSStyleSheet();
|
|
167
|
-
T.replaceSync(
|
|
166
|
+
var oe = ":host{--icon-error:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17' width='17' height='17'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23B30000;%7D%3C/style%3E%3C/defs%3E%3Cg id='forms-error'%3E%3Cpath id='Error' class='cls-1' d='M8.5,0A8.5,8.5,0,1,0,17,8.5,8.51,8.51,0,0,0,8.5,0ZM7.42,4.65a1.08,1.08,0,1,1,2.16,0V8.79a1.08,1.08,0,0,1-2.16,0Zm1.93,8.44a1.2,1.2,0,0,1-1.7-1.69,1.15,1.15,0,0,1,.85-.35,1.11,1.11,0,0,1,.84.35h0A1.21,1.21,0,0,1,9.35,13.09Z'/%3E%3C/g%3E%3C/svg%3E\");--icon-success:url(\"data:image/svg+xml,%3Csvg id='forms-success' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17' width='17' height='17'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23008000;%7D%3C/style%3E%3C/defs%3E%3Cpath id='Success' class='cls-1' d='M8.5,0A8.5,8.5,0,1,0,17,8.5,8.51,8.51,0,0,0,8.5,0Zm3.69,7.08-4.29,4a.81.81,0,0,1-.56.22.84.84,0,0,1-.59-.24L4.67,9A.81.81,0,0,1,5.81,7.85L7.35,9.4,11.1,5.91a.8.8,0,0,1,1.09,1.17Z'/%3E%3C/svg%3E\");--icon-search:url(data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M17.6451%2016.6649L12.5811%2011.7844C13.4371%2010.7503%2013.9122%209.46601%2013.9282%208.10498C13.9463%206.53112%2013.351%205.04391%2012.251%203.91824C11.1511%202.79211%209.67878%202.16202%208.10492%202.14352C8.081%202.14352%208.05753%202.14307%208.03406%202.14307C6.48637%202.14307%205.02715%202.7375%203.9182%203.82074C2.79208%204.92069%202.16199%206.393%202.14349%207.96687C2.12498%209.54118%202.72031%2011.0279%203.82026%2012.1536C4.97344%2013.3339%206.50442%2013.9261%208.03677%2013.9261C9.28408%2013.9261%2010.5303%2013.528%2011.5758%2012.7405L16.6828%2017.6633C16.8173%2017.7928%2016.9906%2017.8574%2017.164%2017.8574C17.3454%2017.8574%2017.5273%2017.7865%2017.6632%2017.6452C17.929%2017.3694%2017.9209%2016.9307%2017.6451%2016.6649ZM11.1849%2011.2595C10.3237%2012.1008%209.18546%2012.5707%207.98305%2012.5418C6.7793%2012.5278%205.65317%2012.0457%204.8123%2011.185C3.97101%2010.3238%203.5156%209.18687%203.53004%207.98312C3.54403%206.77981%204.02608%205.65369%204.88678%204.81282C5.73487%203.98413%206.85106%203.52962%208.03451%203.52962C8.05256%203.52962%208.07062%203.53007%208.08867%203.53007C9.29198%203.54406%2010.4181%204.02611%2011.2589%204.88684C12.1003%205.74802%2012.5557%206.88498%2012.5417%208.08873C12.5277%209.29249%2012.0456%2010.4186%2011.1849%2011.2595Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E);--icon-cancel:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 17 17' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.33333 0C12.9357 0 16.6667 3.73096 16.6667 8.33333C16.6667 12.9357 12.9357 16.6667 8.33333 16.6667C3.73096 16.6667 0 12.9357 0 8.33333C0 3.73096 3.73096 0 8.33333 0ZM12.3071 4.35954C12.0502 4.10263 11.6339 4.10262 11.377 4.35954L8.33333 7.40316L5.28971 4.35954C5.03279 4.10261 4.61646 4.10261 4.35954 4.35954C4.10261 4.61646 4.10261 5.03279 4.35954 5.28971L7.40316 8.33333L4.35954 11.377C4.10262 11.6339 4.10263 12.0502 4.35954 12.3071C4.61648 12.5639 5.03284 12.564 5.28971 12.3071L8.33333 9.26351L11.377 12.3071C11.6339 12.564 12.0502 12.564 12.3071 12.3071C12.564 12.0502 12.564 11.6339 12.3071 11.377L9.26351 8.33333L12.3071 5.28971C12.564 5.03284 12.5639 4.61648 12.3071 4.35954Z' fill='%235C2D91'/%3E%3C/svg%3E\");--icon-calendar:url(data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M14.7369%201.68408H12.779V0.42102C12.779%200.188549%2012.5904%200%2012.358%200C12.1255%200%2011.9369%200.188549%2011.9369%200.42102V1.68408H9.92439V0.42102C9.92439%200.188549%209.73584%200%209.50337%200C9.2709%200%209.08235%200.188549%209.08235%200.42102V1.68408H7.0698V0.42102C7.0698%200.188549%206.88126%200%206.64878%200C6.41631%200%206.22777%200.188549%206.22777%200.42102V1.68408H4.21082V0.42102C4.21051%200.188549%204.02196%200%203.78949%200C3.55702%200%203.36847%200.188549%203.36847%200.42102V1.68408H2.52643C1.13098%201.68408%200%202.81537%200%204.21051V14.7369C0%2015.4344%200.565647%2016%201.26306%2016H13.4736C14.8687%2016%2016%2014.869%2016%2013.4736V2.94745C16%202.24973%2015.4344%201.68408%2014.7369%201.68408ZM15.158%2013.4736C15.158%2014.4038%2014.4041%2015.1576%2013.4739%2015.1576H1.26306C1.03059%2015.1576%200.842039%2014.9691%200.842039%2014.7366V6.73663H15.158V13.4736ZM15.158%205.89459H0.842039V4.21051C0.842039%203.28031%201.59592%202.52643%202.52612%202.52643H3.36816V3.78949C3.36816%204.02196%203.55671%204.21051%203.78918%204.21051C4.02165%204.21051%204.2102%204.02196%204.2102%203.78949V2.52643H6.22714V3.78949C6.22714%204.02196%206.41569%204.21051%206.64816%204.21051C6.88063%204.21051%207.06918%204.02196%207.06918%203.78949V2.52643H9.08173V3.78949C9.08173%204.02196%209.27028%204.21051%209.50275%204.21051C9.73522%204.21051%209.92377%204.02196%209.92377%203.78949V2.52643H11.9363V3.78949C11.9363%204.02196%2012.1249%204.21051%2012.3573%204.21051C12.5898%204.21051%2012.7784%204.02196%2012.7784%203.78949V2.52643H14.7363C14.9688%202.52643%2015.1573%202.71498%2015.1573%202.94745V5.89459H15.158Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E);--icon-clock:url(data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M8%200C3.5818%200%200%203.5818%200%208C0%2012.4182%203.5818%2016%208%2016C12.4182%2016%2016%2012.4182%2016%208C16%203.5818%2012.4182%200%208%200ZM8%2015.158C4.04675%2015.158%200.842039%2011.9533%200.842039%208C0.842039%204.04675%204.04675%200.842039%208%200.842039C11.9533%200.842039%2015.158%204.04675%2015.158%208C15.158%2011.9533%2011.9533%2015.158%208%2015.158Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3Cpath%20d%3D%22M7.99929%202.81256C7.76682%202.81256%207.57827%203.00111%207.57827%203.23358V7.76818C7.57607%207.89963%207.46972%208.00599%207.33827%208.00818H2.78235C2.54988%208.00818%202.36133%208.19673%202.36133%208.4292C2.36133%208.66167%202.54988%208.85022%202.78235%208.85022H7.32133C7.92117%208.85713%208.41309%208.3765%208.42031%207.77665C8.42031%207.77383%208.42031%207.771%208.42031%207.76818V3.23358C8.42031%203.00111%208.23176%202.81256%207.99929%202.81256Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E%0A);--icon-select:url(data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M4%206.6665L8%2010.6665L12%206.6665%22%20stroke%3D%22%235C2D91%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E);--icon-upload:url(data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M18.7284%2020H6.54327C5.14071%2020%204%2018.816%204%2017.3603V16.102C4%2015.8589%204.18949%2015.6622%204.42374%2015.6622C4.65799%2015.6622%204.84748%2015.8589%204.84748%2016.102V17.3603C4.84748%2018.3311%205.60795%2019.1204%206.54327%2019.1204H18.7279C18.9618%2019.1204%2019.1517%2018.9233%2019.1517%2018.6806V16.0738C19.1517%2015.8307%2019.3412%2015.634%2019.5754%2015.634C19.8097%2015.634%2019.9992%2015.8307%2019.9992%2016.0738V18.6806C20%2019.4074%2019.4294%2020%2018.7284%2020Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3Cpath%20d%3D%22M12.4435%204.29306C12.0671%203.90231%2011.4576%203.90231%2011.0811%204.29306L11.0774%204.29697L7.39173%208.122C7.01526%208.51275%207.01526%209.14534%207.39173%209.53609C7.7682%209.92684%208.37766%209.92684%208.75413%209.53609L10.7929%207.41951H10.7967V15.0414C10.7967%2015.4799%2011.1397%2015.8354%2011.5622%2015.8354H11.9579C12.3808%2015.8354%2012.7234%2015.4799%2012.7234%2015.0414V7.41821H12.7292L14.7659%209.53218C15.1424%209.92293%2015.7523%209.92293%2016.1284%209.53218C16.5048%209.14186%2016.5048%208.50884%2016.1284%208.11853L12.4435%204.29306Z%22%20fill%3D%22%235C2D91%22%2F%3E%0A%3C%2Fsvg%3E);--cancel-icon-width:1em;--cancel-icon-height:1em;--search-icon-datalist-width:2em;--search-icon-focus-width:var(--search-icon-datalist-width);display:block}:host *{box-sizing:border-box}label{all:unset;font-size:var(--px-font-size-base);line-height:var(--px-line-height-ratio-l)}input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container{vertical-align:baseline;align-items:center;gap:var(--px-spacing-default-mobile);padding:var(--px-padding-xs-mobile) calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-s-mobile)) var(--px-padding-xs-mobile) var(--px-padding-s-mobile);background:var(--px-color-background-container-default-default) no-repeat;background-position:center right var(--px-padding-s-mobile);box-shadow:var(--px-color-border-neutral-default) 0 0 0px var(--px-size-border-m) inset;border-radius:var(--px-radius-main);color:var(--px-color-text-neutral-default);font-family:var(--px-font-family);font-weight:var(--px-font-weight-body);font-size:var(--px-text-size-label-l-mobile);line-height:var(--px-line-height-ratio-l);text-align:left;box-sizing:border-box;border:none;outline:0;margin:0;height:var(--px-size-l)!important}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended{width:100%}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).error:hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).success:hover{box-shadow:var(--px-color-border-state-hover-default) 0 0 0px var(--px-size-border-l) inset;background-color:var(--px-color-background-state-hover-bordered-default)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):focus-visible:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-mobile);outline:var(--px-focus-outline-mobile) solid var(--px-color-border-focus-outline-default)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):active{box-shadow:var(--px-color-border-state-active-default) 0 0 0px var(--px-size-border-m) inset;background-color:var(--px-color-background-container-default-default);outline:none}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):disabled,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):read-only:not(:is(select),#input-file-container){box-shadow:var(--px-color-border-neutral-default) 0 0 0px 0 inset;font-weight:var(--px-font-weight-title);text-align:left;background:0 0;padding:0}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).error{box-shadow:var(--px-color-border-purpose-error-default) 0 0 0px var(--px-size-border-m) inset;background-repeat:no-repeat;background-image:var(--icon-error)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).success{box-shadow:var(--px-color-border-purpose-success-default) 0 0 0px var(--px-size-border-m) inset;background-repeat:no-repeat;background-image:var(--icon-success)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile)), center right var(--px-padding-s-mobile)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time].success{background-image:var(--icon-success)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time].error{background-image:var(--icon-error)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile))}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-mobile) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile))}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).success{background-image:var(--icon-success)}:is(:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=time]).error{background-image:var(--icon-error)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]{background-image:var(--icon-search);padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-s-mobile))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;background-image:var(--icon-cancel);height:var(--cancel-icon-height);width:var(--cancel-icon-width);margin-right:calc(( var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) ) * -1);margin-left:var(--px-spacing-s-mobile);background-position:50%;background-repeat:no-repeat}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{opacity:1;pointer-events:auto;margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{opacity:1;pointer-events:auto;margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:focus::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-mobile) + var(--px-spacing-xs-mobile) ) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-mobile) + var(--px-spacing-xs-mobile) ) * -1)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:focus::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-mobile)) * -1))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-mobile);background-image:var(--icon-search)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].success{background-image:var(--icon-success), var(--icon-search)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)[type=search].error{background-image:var(--icon-error), var(--icon-search)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select){text-overflow:ellipsis;background-image:var(--icon-select);-webkit-appearance:none;width:100%;padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile) + var(--px-size-icon-s) + var(--px-spacing-s-mobile))}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).success{background-image:var(--icon-success), var(--icon-select)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(select).error{background-image:var(--icon-error), var(--icon-select)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(textarea){flex-grow:0;height:auto!important}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(textarea).success,:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container):is(textarea).error{background-position:right 1rem top .5rem}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container{background-repeat:no-repeat;background-position:center right var(--px-padding-s-mobile);background-image:var(--icon-upload);align-items:center;max-width:100%;display:flex}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container span{text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.success{background-image:var(--icon-success), var(--icon-upload)}:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container)#input-file-container.error{background-image:var(--icon-error), var(--icon-upload)}:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-mobile) + 2 * var(--px-padding-xs-mobile) + var(--px-size-icon-s));background-image:var(--icon-search);padding-right:var(--autocomplete-search-icon-width);background-position:right 1rem center}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-mobile) + var(--px-padding-xs-mobile) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile)), center right var(--px-padding-s-mobile);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-mobile) + var(--px-padding-xs-mobile) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-mobile) + var(--px-size-icon-s) + var(--px-spacing-xs-mobile)), center right var(--px-padding-s-mobile);background-image:var(--icon-error), var(--icon-search)!important}slot{font-family:var(--px-font-family);font-size:var(--px-text-size-label-m-mobile);font-weight:var(--px-font-weight-body);line-height:var(--px-line-height-ratio-l);text-align:left;color:var(--px-color-text-neutral-default)}slot.error{color:var(--px-color-text-purpose-error-default)}slot.success{color:var(--px-color-text-purpose-success-default)}slot[name=helper]{color:#0000008f;font-size:var(--px-text-size-label-s-mobile)}#container{gap:var(--px-spacing-2xs-mobile);flex-direction:column;display:inline-flex}#container:has(#input-file-container){max-width:100%}:host([extended]) #container{width:100%}#label-helper{gap:var(--px-spacing-2xs-mobile);flex-direction:column;display:flex}input[type=file]{-webkit-appearance:none;opacity:0;width:0;height:0}@media screen and (width<=47.938rem){:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended--mobile{width:100%}:host([extended--mobile]) #container{width:100%}}@media screen and (width>=48rem) and (width<=64rem){:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended--tablet{width:100%}:host([extended--tablet]) #container{width:100%}}@media screen and (width>=48rem){:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-tablet) + 2 * var(--px-padding-xs-tablet) + var(--px-size-icon-s))}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-tablet) + var(--px-padding-xs-tablet) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet)), center right var(--px-padding-s-tablet);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-tablet) + var(--px-padding-xs-tablet) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet)), center right var(--px-padding-s-tablet);background-image:var(--icon-error), var(--icon-search)!important}input:not([type=file]),textarea,select,#input-file-container{gap:var(--px-spacing-default-tablet);padding:var(--px-padding-xs-tablet) calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-s-tablet)) var(--px-padding-xs-tablet) var(--px-padding-s-tablet);font-size:var(--px-text-size-label-l-tablet);background-position:center right var(--px-padding-s-tablet);height:var(--px-size-l)!important}:is(input:not([type=file]),textarea,select,#input-file-container):focus-visible:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-tablet);outline-width:var(--px-focus-outline-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet)), center right var(--px-padding-s-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet))}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-tablet) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]{padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-s-tablet))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]::-webkit-search-cancel-button{margin-right:calc(( var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) ) * -1);margin-left:var(--px-spacing-s-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-tablet) + var(--px-spacing-xs-tablet) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-tablet) + var(--px-spacing-xs-tablet) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-tablet)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-tablet)}:is(input:not([type=file]),textarea,select,#input-file-container):is(select){padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-tablet) + var(--px-size-icon-s) + var(--px-spacing-xs-tablet) + var(--px-size-icon-s) + var(--px-spacing-s-tablet))}:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container{background-position:center right var(--px-padding-s-tablet)}slot{font-size:var(--px-text-size-label-m-tablet)}slot[name=helper]{font-size:var(--px-text-size-label-s-tablet)}#container,#label-helper{gap:var(--px-spacing-2xs-tablet)}}@media screen and (width>=64.0625rem) and (width<=90rem){:is(input:not([type=file]),textarea,select,:host([auto-complete]) input,#input-file-container).extended--laptop{width:100%}:host([extended--laptop]) #container{width:100%}}@media screen and (width>=64.0625rem){:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-laptop) + 2 * var(--px-padding-xs-laptop) + var(--px-size-icon-s))}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-error), var(--icon-search)!important}input:not([type=file]),textarea,select,#input-file-container{gap:var(--px-spacing-default-laptop);padding:var(--px-padding-xs-laptop) calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-s-laptop)) var(--px-padding-xs-laptop) var(--px-padding-s-laptop);font-size:var(--px-text-size-label-l-laptop);background-position:center right var(--px-padding-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container):focus-visble:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-laptop);outline-width:var(--px-focus-outline-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop))}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-laptop) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]{padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-s-laptop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]::-webkit-search-cancel-button{margin-right:calc(( var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) ) * -1);margin-left:var(--px-spacing-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus-visible::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-laptop) + var(--px-spacing-xs-laptop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-laptop) + var(--px-spacing-xs-laptop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-laptop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-laptop)}:is(input:not([type=file]),textarea,select,#input-file-container):is(select){padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop) + var(--px-size-icon-s) + var(--px-spacing-s-laptop))}:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container{background-position:center right var(--px-padding-s-laptop)}slot{font-size:var(--px-text-size-label-m-laptop)}slot[name=helper]{font-size:var(--px-text-size-label-s-laptop)}#container,#label-helper{gap:var(--px-spacing-2xs-laptop)}}@media screen and (width>=90.0625rem){:host([auto-complete]) input{--autocomplete-search-icon-width:calc(2 * var(--px-spacing-xs-desktop) + 2 * var(--px-padding-xs-desktop) + var(--px-size-icon-s))}:host([auto-complete]) input.success{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-success), var(--icon-search)!important}:host([auto-complete]) input.error{--autocomplete-search-icon-width:calc(2 * ( var(--px-spacing-xs-laptop) + var(--px-padding-xs-laptop) + var(--px-size-icon-s) ));background-position:center right calc(var(--px-padding-s-laptop) + var(--px-size-icon-s) + var(--px-spacing-xs-laptop)), center right var(--px-padding-s-laptop);background-image:var(--icon-error), var(--icon-search)!important}input:not([type=file]),textarea,select,#input-file-container{gap:var(--px-spacing-default-desktop);padding:var(--px-padding-xs-desktop) calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-s-desktop)) var(--px-padding-xs-desktop) var(--px-padding-s-desktop);font-size:var(--px-text-size-label-l-desktop);background-position:center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container):focus-visble:not([disabled],[aria-disabled=true]):not([readonly],[aria-readonly=true]){outline-offset:var(--px-focus-offset-desktop);outline-width:var(--px-focus-outline-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.success,:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container.error{background-position:center right calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop)), center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]{min-width:8.5rem;padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop))}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time])::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-desktop) + var(--px-size-icon-s) ) * -1)}:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).error,:is(:is(input:not([type=file]),textarea,select,#input-file-container)[type=date],:is(input:not([type=file]),textarea,select,#input-file-container)[type=datetime-local],:is(input:not([type=file]),textarea,select,#input-file-container)[type=month],:is(input:not([type=file]),textarea,select,#input-file-container)[type=week],:is(input:not([type=file]),textarea,select,#input-file-container)[type=time]).success{background-position:center right calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]{padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-s-desktop))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]::-webkit-search-cancel-button{margin-right:calc(( var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) ) * -1);margin-left:var(--px-spacing-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:focus::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search]:hover::-webkit-search-cancel-button{margin-right:calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus-visible::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-desktop) + var(--px-spacing-xs-desktop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-calendar-picker-indicator{margin-right:calc(( var(--px-size-icon-s) + var(--px-spacing-s-desktop) + var(--px-spacing-xs-desktop) ) * -1)}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:focus-visible::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search][list=suggestions]:hover::-webkit-search-cancel-button{margin-right:var(--search-cancel-datalist-margin-right,calc((var(--px-size-icon-s) + var(--px-spacing-s-desktop)) * -1))}:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].success:focus-visible,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:hover,:is(input:not([type=file]),textarea,select,#input-file-container)[type=search].error:focus-visible{background-position:center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container):is(select){padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s))}:is(input:not([type=file]),textarea,select,#input-file-container):is(select).success,:is(input:not([type=file]),textarea,select,#input-file-container):is(select).error{padding-right:calc(var(--px-padding-s-desktop) + var(--px-size-icon-s) + var(--px-spacing-xs-desktop) + var(--px-size-icon-s) + var(--px-spacing-s-desktop))}:is(input:not([type=file]),textarea,select,#input-file-container)#input-file-container{background-position:center right var(--px-padding-s-desktop)}:is(input:not([type=file]),textarea,select,#input-file-container).extended--desktop{width:100%}:host([extended--desktop]) #container{width:100%}slot{font-size:var(--px-text-size-label-m-desktop)}slot[name=helper]{font-size:var(--px-text-size-label-s-desktop)}#container{gap:var(--px-spacing-2xs-laptop)}#label-helper{gap:var(--px-spacing-2xs-desktop)}}:host([hidden-label]) #label-helper{position:absolute}:host([hidden-label]) #container,:host([hidden-label]) #label-helper{gap:0}", T = new CSSStyleSheet();
|
|
167
|
+
T.replaceSync(oe);
|
|
168
168
|
var E = class extends t {
|
|
169
169
|
constructor() {
|
|
170
170
|
super(T), this.containerTemplate = () => `
|
|
@@ -176,7 +176,7 @@ var E = class extends t {
|
|
|
176
176
|
</div>
|
|
177
177
|
${this.template()}
|
|
178
178
|
</div>
|
|
179
|
-
`, this.shadowRoot.innerHTML = this.containerTemplate(), this.internals = this.attachInternals?.();
|
|
179
|
+
`, this.onHelperSlotChange = () => this.setupAriaDescribedBy(this.$slotHelper, this.$helperSlot, "helper"), this.onStatusTextSlotChange = () => this.setupAriaDescribedBy(this.$slotStatusText, this.$statusTextSlot, "status-text"), this.shadowRoot.innerHTML = this.containerTemplate(), this.internals = this.attachInternals?.();
|
|
180
180
|
}
|
|
181
181
|
static get observedAttributes() {
|
|
182
182
|
return [
|
|
@@ -186,14 +186,15 @@ var E = class extends t {
|
|
|
186
186
|
"extended--mobile",
|
|
187
187
|
"extended--tablet",
|
|
188
188
|
"extended--laptop",
|
|
189
|
-
"extended--desktop"
|
|
189
|
+
"extended--desktop",
|
|
190
|
+
"aria-describedby"
|
|
190
191
|
];
|
|
191
192
|
}
|
|
192
193
|
attributeChangedCallback(e, t, n) {
|
|
193
|
-
e === "state" && t !== n ? this.stateChangeCallback(t, n) : (e === "extended" || e === "extended--mobile" || e === "extended--tablet" || e === "extended--laptop" || e === "extended--desktop") && t !== n ? this.$el.classList.toggle(e) : super.attributeChangedCallback(e, t, n);
|
|
194
|
+
e === "aria-describedby" && t !== n ? v(this, this.$el, !1) : e === "state" && t !== n ? this.stateChangeCallback(t, n) : (e === "extended" || e === "extended--mobile" || e === "extended--tablet" || e === "extended--laptop" || e === "extended--desktop") && t !== n ? this.$el.classList.toggle(e) : super.attributeChangedCallback(e, t, n);
|
|
194
195
|
}
|
|
195
196
|
stateChangeCallback(e, t) {
|
|
196
|
-
this.$el.classList.remove(e), this.$el.classList.toggle(t), t === "error" ? (this.$statusTextSlot.classList.toggle("error"), this.$el.
|
|
197
|
+
this.$el.classList.remove(e), this.$el.classList.toggle(t), t === "error" ? (this.$statusTextSlot.classList.toggle("error"), this.$el.setAttribute("aria-invalid", "true"), this.internals && (this.internals.ariaInvalid = "true"), this.$statusTextSlot.classList.remove("success")) : t === "success" ? (this.$statusTextSlot.classList.remove("error"), this.$statusTextSlot.classList.toggle("success")) : (this.$el.removeAttribute("aria-invalid"), this.internals && (this.internals.ariaInvalid = null), this.$statusTextSlot.classList.remove("error", "success"), this.$labelSlot.classList.remove("error", "success"), this.$el.style.backgroundImage = ""), this.setupAriaDescribedBy(this.$slotHelper, this.$helperSlot, "helper"), this.setupAriaDescribedBy(this.$slotStatusText, this.$statusTextSlot, "status-text");
|
|
197
198
|
}
|
|
198
199
|
formData() {
|
|
199
200
|
let e = new FormData(), t = this.getAttribute("name");
|
|
@@ -207,7 +208,10 @@ var E = class extends t {
|
|
|
207
208
|
composed: !0
|
|
208
209
|
}));
|
|
209
210
|
});
|
|
210
|
-
}), this.setupForId(), this.setupAriaDescribedBy(this.$slotHelper, this.$helperSlot, "helper"), this.setupAriaDescribedBy(this.$slotStatusText, this.$statusTextSlot, "status-text");
|
|
211
|
+
}), this.setupForId(), this.setupAriaDescribedBy(this.$slotHelper, this.$helperSlot, "helper"), this.setupAriaDescribedBy(this.$slotStatusText, this.$statusTextSlot, "status-text"), this.$helperSlot.addEventListener("slotchange", this.onHelperSlotChange), this.$statusTextSlot.addEventListener("slotchange", this.onStatusTextSlotChange);
|
|
212
|
+
}
|
|
213
|
+
disconnectedCallback() {
|
|
214
|
+
this.$helperSlot.removeEventListener("slotchange", this.onHelperSlotChange), this.$statusTextSlot.removeEventListener("slotchange", this.onStatusTextSlotChange);
|
|
211
215
|
}
|
|
212
216
|
static get formAssociated() {
|
|
213
217
|
return !0;
|
|
@@ -223,11 +227,12 @@ var E = class extends t {
|
|
|
223
227
|
this.$el.setAttribute("id", e), this.$label && this.$label.setAttribute("for", e);
|
|
224
228
|
}
|
|
225
229
|
setupAriaDescribedBy(e, t, n) {
|
|
226
|
-
if (
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
230
|
+
if (!this.$el?.hasAttribute("id")) return;
|
|
231
|
+
let r = `${this.$el.id}-${n}`, i = (this.$el.getAttribute("aria-describedby") ?? "").split(" ").filter((e) => e && e !== r);
|
|
232
|
+
e.length > 0 && (t.setAttribute("id", r), i.push(r)), i.sort((e, t) => this.ariaDescribedByRank(e) - this.ariaDescribedByRank(t)), i.length > 0 ? this.$el.setAttribute("aria-describedby", i.join(" ")) : this.$el.removeAttribute("aria-describedby");
|
|
233
|
+
}
|
|
234
|
+
ariaDescribedByRank(e) {
|
|
235
|
+
return e.endsWith("-status-text") ? 0 : e.endsWith("-helper") ? 1 : 2;
|
|
231
236
|
}
|
|
232
237
|
get state() {
|
|
233
238
|
return this.getAttribute("state");
|
|
@@ -286,7 +291,7 @@ var E = class extends t {
|
|
|
286
291
|
get $slotStatusText() {
|
|
287
292
|
return this.querySelectorAll("[slot=\"status-text\"]");
|
|
288
293
|
}
|
|
289
|
-
},
|
|
294
|
+
}, se = class extends E {
|
|
290
295
|
static {
|
|
291
296
|
this.nativeName = "input";
|
|
292
297
|
}
|
|
@@ -312,7 +317,7 @@ var E = class extends t {
|
|
|
312
317
|
}
|
|
313
318
|
}
|
|
314
319
|
disconnectedCallback() {
|
|
315
|
-
this.observer?.disconnect();
|
|
320
|
+
super.disconnectedCallback(), this.observer?.disconnect();
|
|
316
321
|
}
|
|
317
322
|
template() {
|
|
318
323
|
return "<div><input type=\"text\" /></div>";
|
|
@@ -327,10 +332,10 @@ var E = class extends t {
|
|
|
327
332
|
return this.shadowRoot.querySelector("div");
|
|
328
333
|
}
|
|
329
334
|
};
|
|
330
|
-
customElements.get("px-input") || customElements.define("px-input",
|
|
335
|
+
customElements.get("px-input") || customElements.define("px-input", se);
|
|
331
336
|
//#endregion
|
|
332
337
|
//#region ../../components/Input/src/TextArea.ts
|
|
333
|
-
var
|
|
338
|
+
var ce = class extends E {
|
|
334
339
|
static {
|
|
335
340
|
this.nativeName = "textarea";
|
|
336
341
|
}
|
|
@@ -341,10 +346,10 @@ var se = class extends E {
|
|
|
341
346
|
return "<textarea></textarea>";
|
|
342
347
|
}
|
|
343
348
|
};
|
|
344
|
-
customElements.get("px-textarea") || customElements.define("px-textarea",
|
|
349
|
+
customElements.get("px-textarea") || customElements.define("px-textarea", ce);
|
|
345
350
|
//#endregion
|
|
346
351
|
//#region ../../components/Input/src/Select.ts
|
|
347
|
-
var
|
|
352
|
+
var le = class extends E {
|
|
348
353
|
static {
|
|
349
354
|
this.nativeName = "select";
|
|
350
355
|
}
|
|
@@ -353,6 +358,7 @@ var ce = class extends E {
|
|
|
353
358
|
}
|
|
354
359
|
constructor() {
|
|
355
360
|
super(), this.observer = null, this.#e = () => {
|
|
361
|
+
if (!this.$el) return;
|
|
356
362
|
let e = Array.from(this.children).filter((e) => {
|
|
357
363
|
let t = e.tagName.toLowerCase();
|
|
358
364
|
return t === "option" || t === "optgroup";
|
|
@@ -371,13 +377,13 @@ var ce = class extends E {
|
|
|
371
377
|
}
|
|
372
378
|
#e;
|
|
373
379
|
disconnectedCallback() {
|
|
374
|
-
this.observer?.disconnect();
|
|
380
|
+
super.disconnectedCallback(), this.observer?.disconnect();
|
|
375
381
|
}
|
|
376
382
|
};
|
|
377
|
-
customElements.get("px-select") || customElements.define("px-select",
|
|
383
|
+
customElements.get("px-select") || customElements.define("px-select", le);
|
|
378
384
|
//#endregion
|
|
379
385
|
//#region ../../components/Input/src/Upload.ts
|
|
380
|
-
var
|
|
386
|
+
var ue = class extends E {
|
|
381
387
|
static {
|
|
382
388
|
this.nativeName = "input";
|
|
383
389
|
}
|
|
@@ -392,7 +398,7 @@ var le = class extends E {
|
|
|
392
398
|
});
|
|
393
399
|
}
|
|
394
400
|
template() {
|
|
395
|
-
return "<div id=\"input-file-container\"><span></span><input type=\"file\" /></
|
|
401
|
+
return "<div id=\"input-file-container\"><span></span><input type=\"file\" /></div>";
|
|
396
402
|
}
|
|
397
403
|
stateChangeCallback(e, t) {
|
|
398
404
|
super.stateChangeCallback(e, t), this.$container.classList.toggle(e), this.$container.classList.toggle(t);
|
|
@@ -407,7 +413,7 @@ var le = class extends E {
|
|
|
407
413
|
return this.shadowRoot.querySelector("input[type=\"file\"]");
|
|
408
414
|
}
|
|
409
415
|
};
|
|
410
|
-
customElements.get("px-fileupload") || customElements.define("px-fileupload",
|
|
416
|
+
customElements.get("px-fileupload") || customElements.define("px-fileupload", ue);
|
|
411
417
|
//#endregion
|
|
412
418
|
//#region src/Autocomplete.ts
|
|
413
419
|
var D = new CSSStyleSheet();
|
|
@@ -518,7 +524,7 @@ var O = class extends n {
|
|
|
518
524
|
return this.getAttribute("popover-height");
|
|
519
525
|
}
|
|
520
526
|
set popoverHeight(e) {
|
|
521
|
-
|
|
527
|
+
_(this, "popover-height", e);
|
|
522
528
|
}
|
|
523
529
|
};
|
|
524
530
|
customElements.get("px-autocomplete") || customElements.define("px-autocomplete", O);
|
|
@@ -600,7 +606,7 @@ var N = class extends n {
|
|
|
600
606
|
this.updateName(t, n);
|
|
601
607
|
break;
|
|
602
608
|
case "size":
|
|
603
|
-
this.updateAttribute(e, t, n,
|
|
609
|
+
this.updateAttribute(e, t, n, re);
|
|
604
610
|
break;
|
|
605
611
|
case "color":
|
|
606
612
|
this.updateAttribute(e, t, n, A);
|
|
@@ -627,7 +633,7 @@ var N = class extends n {
|
|
|
627
633
|
!this.ariaLabel && this.#t && (this.#t.ariaHidden = "true", this.ariaHidden = "true"), this.parentElement?.localName === "px-a" && this.slot !== "before" && this.slot !== "after" && (this.color || this.setAttribute("color", "inherit"));
|
|
628
634
|
}
|
|
629
635
|
updateAttribute(e, t, n, r) {
|
|
630
|
-
t !== null && t !== "" && (e === "size" ? this.$el.classList.toggle(`${e}-${t}`) : this.$el.classList.toggle(t)), n !== null && n !== "" && (e === "size" ? this.$el.classList.toggle(`${e}-${n}`) : this.$el.classList.toggle(n)), this.checkName(r, n) ||
|
|
636
|
+
t !== null && t !== "" && (e === "size" ? this.$el.classList.toggle(`${e}-${t}`) : this.$el.classList.toggle(t)), n !== null && n !== "" && (e === "size" ? this.$el.classList.toggle(`${e}-${n}`) : this.$el.classList.toggle(n)), this.checkName(r, n) || h(`${n} is not an allowed ${e} value for ${this.tagName.toLowerCase()}`);
|
|
631
637
|
}
|
|
632
638
|
updateName(e, t) {
|
|
633
639
|
this.#e && this.$el.firstElementChild?.setAttribute("href", `${this.#e}#icon-${t}`);
|
|
@@ -639,25 +645,25 @@ var N = class extends n {
|
|
|
639
645
|
return this.getAttribute("name");
|
|
640
646
|
}
|
|
641
647
|
set name(e) {
|
|
642
|
-
|
|
648
|
+
_(this, "name", e);
|
|
643
649
|
}
|
|
644
650
|
get size() {
|
|
645
651
|
return this.getAttribute("size");
|
|
646
652
|
}
|
|
647
653
|
set size(e) {
|
|
648
|
-
|
|
654
|
+
_(this, "size", e);
|
|
649
655
|
}
|
|
650
656
|
get color() {
|
|
651
657
|
return this.getAttribute("color");
|
|
652
658
|
}
|
|
653
659
|
set color(e) {
|
|
654
|
-
|
|
660
|
+
_(this, "color", e);
|
|
655
661
|
}
|
|
656
662
|
get arialabel() {
|
|
657
663
|
return this.getAttribute("aria-label");
|
|
658
664
|
}
|
|
659
665
|
set arialabel(e) {
|
|
660
|
-
|
|
666
|
+
_(this, "aria-label", e);
|
|
661
667
|
}
|
|
662
668
|
get inverted() {
|
|
663
669
|
return this.hasAttribute("inverted");
|
|
@@ -669,7 +675,7 @@ var N = class extends n {
|
|
|
669
675
|
return this.getAttribute("from");
|
|
670
676
|
}
|
|
671
677
|
set from(e) {
|
|
672
|
-
|
|
678
|
+
_(this, "from", e);
|
|
673
679
|
}
|
|
674
680
|
get disabled() {
|
|
675
681
|
return this.hasAttribute("disabled");
|
|
@@ -703,14 +709,14 @@ var I = [
|
|
|
703
709
|
"11",
|
|
704
710
|
"12"
|
|
705
711
|
], R = (e, t, n) => `:host([${e}${n ? `--${n}` : ""}='${t}']) .container`, z = "px-padding", B = [
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
712
|
+
u("padding", R, g, z, "--container-padding"),
|
|
713
|
+
u("padding-inline", R, g, z),
|
|
714
|
+
u("padding-block", R, g, z),
|
|
715
|
+
u("padding-top", R, g, z),
|
|
716
|
+
u("padding-right", R, g, z, "--container-padding-right"),
|
|
717
|
+
u("padding-bottom", R, g, z),
|
|
718
|
+
u("padding-left", R, g, z, "--container-padding-left"),
|
|
719
|
+
u("gap", R, p, "px-spacing", void 0, "subgrid-gap")
|
|
714
720
|
], V = class extends n {
|
|
715
721
|
static {
|
|
716
722
|
this.nativeName = "div";
|
|
@@ -772,7 +778,7 @@ var I = [
|
|
|
772
778
|
attributeChangedCallback(e, t, n) {
|
|
773
779
|
if (t !== n) switch (e) {
|
|
774
780
|
case "border":
|
|
775
|
-
this.updateAttribute(e, t, n,
|
|
781
|
+
this.updateAttribute(e, t, n, ee);
|
|
776
782
|
break;
|
|
777
783
|
case "border-color":
|
|
778
784
|
this.updateBorderColor(e, n);
|
|
@@ -790,7 +796,7 @@ var I = [
|
|
|
790
796
|
case "no-border-radius--mobile":
|
|
791
797
|
case "no-border-radius--tablet":
|
|
792
798
|
case "no-border-radius--laptop":
|
|
793
|
-
this.updateNoBorderRadius(e, t, n,
|
|
799
|
+
this.updateNoBorderRadius(e, t, n, ie);
|
|
794
800
|
break;
|
|
795
801
|
case "background-color":
|
|
796
802
|
case "background-color--mobile":
|
|
@@ -817,10 +823,10 @@ var I = [
|
|
|
817
823
|
n !== null && n !== "" && (this.$el.style.backgroundPosition = n);
|
|
818
824
|
break;
|
|
819
825
|
case "box-shadow":
|
|
820
|
-
this.updateAttribute(e, t, n,
|
|
826
|
+
this.updateAttribute(e, t, n, te);
|
|
821
827
|
break;
|
|
822
828
|
case "anchor-offset":
|
|
823
|
-
this.updateAnchorOffset(t, n,
|
|
829
|
+
this.updateAnchorOffset(t, n, g);
|
|
824
830
|
break;
|
|
825
831
|
case "anchor-spacing":
|
|
826
832
|
this.updateAnchorSpacing(t, n, I);
|
|
@@ -846,32 +852,32 @@ var I = [
|
|
|
846
852
|
this.$el.style.setProperty(`--${e}`, `url("${t}")`);
|
|
847
853
|
}
|
|
848
854
|
updateGradient(e, t) {
|
|
849
|
-
if (this.checkName(
|
|
855
|
+
if (this.checkName(m, t)) {
|
|
850
856
|
let n = this.splitAttrNameFromBreakpoint(e);
|
|
851
857
|
e = n.attrName;
|
|
852
858
|
let r = n.breakpoint;
|
|
853
859
|
this.$el.style.setProperty(`--${e}${r}`, `linear-gradient(var(--px-color-background-gradient-${t}))`);
|
|
854
|
-
} else
|
|
860
|
+
} else h(`"${t}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${m.join("\", \"")}".`);
|
|
855
861
|
}
|
|
856
862
|
updateBackgroundColor(e, t) {
|
|
857
863
|
let n = t.startsWith("surface-");
|
|
858
864
|
if (this.checkName(r, t)) {
|
|
859
865
|
let r = this.splitAttrNameFromBreakpoint(e), i = r.breakpoint;
|
|
860
866
|
this.$el.style.setProperty(`--${r.attrName}${i}`, `var(--px-color-background-${t}${n ? "" : "-default"})`), this.$el.style.setProperty(`--${r.attrName}-inverted${i}`, `var(--px-color-background-${t}${n ? "" : "-inverted"})`);
|
|
861
|
-
} else
|
|
867
|
+
} else h(`"${t}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${r.join("\", \"")}".`);
|
|
862
868
|
}
|
|
863
869
|
updateBorderColor(e, t) {
|
|
864
|
-
this.checkName(o, t) ? (this.$el.style.setProperty(`--${e}`, `var(--px-color-border-${t}-default)`), this.$el.style.setProperty(`--${e}-inverted`, `var(--px-color-border-${t}-inverted)`)) :
|
|
870
|
+
this.checkName(o, t) ? (this.$el.style.setProperty(`--${e}`, `var(--px-color-border-${t}-default)`), this.$el.style.setProperty(`--${e}-inverted`, `var(--px-color-border-${t}-inverted)`)) : h(`"${t}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${o.join("\", \"")}".`);
|
|
865
871
|
}
|
|
866
872
|
updateNoBorderRadius(e, t, n, r) {
|
|
867
|
-
if (!this.checkName(r, n))
|
|
873
|
+
if (!this.checkName(r, n)) h(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${r.join("\", \"")}".`);
|
|
868
874
|
else {
|
|
869
875
|
let r = this.splitAttrNameFromBreakpoint(e), i = r.breakpoint;
|
|
870
876
|
t !== null && t !== "" && this.$el.classList.toggle(`${r.attrName}-${t}${i}`), n !== null && n !== "" && this.$el.classList.toggle(`${r.attrName}-${n}${i}`);
|
|
871
877
|
}
|
|
872
878
|
}
|
|
873
879
|
updateAttribute(e, t, n, r) {
|
|
874
|
-
if (!this.checkName(r, n))
|
|
880
|
+
if (!this.checkName(r, n)) h(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${r.join("\", \"")}".`);
|
|
875
881
|
else {
|
|
876
882
|
let r = this.splitAttrNameFromBreakpoint(e), i = r.breakpoint;
|
|
877
883
|
t !== null && t !== "" && this.$el.classList.toggle(`${r.attrName}-${t}${i}`), n !== null && n !== "" && this.$el.classList.toggle(`${r.attrName}-${n}${i}`);
|
|
@@ -893,8 +899,8 @@ var I = [
|
|
|
893
899
|
};
|
|
894
900
|
}
|
|
895
901
|
updateAnchorOffset(e, t, n) {
|
|
896
|
-
if (!
|
|
897
|
-
|
|
902
|
+
if (!l(n, t)) {
|
|
903
|
+
h(`"${t}" is not a valid anchor-offset value for ${this.tagName.toLowerCase()}. Allowed values are: "${n.join("\", \"")}".`);
|
|
898
904
|
return;
|
|
899
905
|
}
|
|
900
906
|
let r = (e) => {
|
|
@@ -906,8 +912,8 @@ var I = [
|
|
|
906
912
|
this.$el.classList.contains("anchored") || this.$el.classList.add("anchored");
|
|
907
913
|
}
|
|
908
914
|
updateAnchorSpacing(e, t, n) {
|
|
909
|
-
if (!
|
|
910
|
-
|
|
915
|
+
if (!l(n, t)) {
|
|
916
|
+
h(`"${t}" is not a valid anchor-spacing value for ${this.tagName.toLowerCase()}. Allowed values are: "${n.join("\", \"")}".`);
|
|
911
917
|
return;
|
|
912
918
|
}
|
|
913
919
|
let r = (e) => {
|
|
@@ -916,7 +922,7 @@ var I = [
|
|
|
916
922
|
r(e), r(t);
|
|
917
923
|
}
|
|
918
924
|
updateSubgridRows(e, t, n, r) {
|
|
919
|
-
|
|
925
|
+
l(r, n) ? this.style.setProperty(`--${e}`, n) : h(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${r.join("\", \"")}".`);
|
|
920
926
|
}
|
|
921
927
|
get $el() {
|
|
922
928
|
return this?.shadowRoot?.querySelector(".container");
|
|
@@ -928,337 +934,337 @@ var I = [
|
|
|
928
934
|
return this.getAttribute("padding");
|
|
929
935
|
}
|
|
930
936
|
set padding(e) {
|
|
931
|
-
|
|
937
|
+
_(this, "padding", e);
|
|
932
938
|
}
|
|
933
939
|
get paddingBlock() {
|
|
934
940
|
return this.getAttribute("padding-block");
|
|
935
941
|
}
|
|
936
942
|
set paddingBlock(e) {
|
|
937
|
-
|
|
943
|
+
_(this, "padding-block", e);
|
|
938
944
|
}
|
|
939
945
|
get paddingInline() {
|
|
940
946
|
return this.getAttribute("padding-inline");
|
|
941
947
|
}
|
|
942
948
|
set paddingInline(e) {
|
|
943
|
-
|
|
949
|
+
_(this, "padding-inline", e);
|
|
944
950
|
}
|
|
945
951
|
get paddingTop() {
|
|
946
952
|
return this.getAttribute("padding-top");
|
|
947
953
|
}
|
|
948
954
|
set paddingTop(e) {
|
|
949
|
-
|
|
955
|
+
_(this, "padding-top", e);
|
|
950
956
|
}
|
|
951
957
|
get paddingRight() {
|
|
952
958
|
return this.getAttribute("padding-right");
|
|
953
959
|
}
|
|
954
960
|
set paddingRight(e) {
|
|
955
|
-
|
|
961
|
+
_(this, "padding-right", e);
|
|
956
962
|
}
|
|
957
963
|
get paddingBottom() {
|
|
958
964
|
return this.getAttribute("padding-bottom");
|
|
959
965
|
}
|
|
960
966
|
set paddingBottom(e) {
|
|
961
|
-
|
|
967
|
+
_(this, "padding-bottom", e);
|
|
962
968
|
}
|
|
963
969
|
get paddingLeft() {
|
|
964
970
|
return this.getAttribute("padding-left");
|
|
965
971
|
}
|
|
966
972
|
set paddingLeft(e) {
|
|
967
|
-
|
|
973
|
+
_(this, "padding-left", e);
|
|
968
974
|
}
|
|
969
975
|
get paddingMobile() {
|
|
970
976
|
return this.getAttribute("padding--mobile");
|
|
971
977
|
}
|
|
972
978
|
set paddingMobile(e) {
|
|
973
|
-
|
|
979
|
+
_(this, "padding--mobile", e);
|
|
974
980
|
}
|
|
975
981
|
get paddingBlockMobile() {
|
|
976
982
|
return this.getAttribute("padding-block--mobile");
|
|
977
983
|
}
|
|
978
984
|
set paddingBlockMobile(e) {
|
|
979
|
-
|
|
985
|
+
_(this, "padding-block--mobile", e);
|
|
980
986
|
}
|
|
981
987
|
get paddingInlineMobile() {
|
|
982
988
|
return this.getAttribute("padding-inline--mobile");
|
|
983
989
|
}
|
|
984
990
|
set paddingInlineMobile(e) {
|
|
985
|
-
|
|
991
|
+
_(this, "padding-inline--mobile", e);
|
|
986
992
|
}
|
|
987
993
|
get paddingTopMobile() {
|
|
988
994
|
return this.getAttribute("padding-top--mobile");
|
|
989
995
|
}
|
|
990
996
|
set paddingTopMobile(e) {
|
|
991
|
-
|
|
997
|
+
_(this, "padding-top--mobile", e);
|
|
992
998
|
}
|
|
993
999
|
get paddingRightMobile() {
|
|
994
1000
|
return this.getAttribute("padding-right--mobile");
|
|
995
1001
|
}
|
|
996
1002
|
set paddingRightMobile(e) {
|
|
997
|
-
|
|
1003
|
+
_(this, "padding-right--mobile", e);
|
|
998
1004
|
}
|
|
999
1005
|
get paddingBottomMobile() {
|
|
1000
1006
|
return this.getAttribute("padding-bottom--mobile");
|
|
1001
1007
|
}
|
|
1002
1008
|
set paddingBottomMobile(e) {
|
|
1003
|
-
|
|
1009
|
+
_(this, "padding-bottom--mobile", e);
|
|
1004
1010
|
}
|
|
1005
1011
|
get paddingLeftMobile() {
|
|
1006
1012
|
return this.getAttribute("padding-left--mobile");
|
|
1007
1013
|
}
|
|
1008
1014
|
set paddingLeftMobile(e) {
|
|
1009
|
-
|
|
1015
|
+
_(this, "padding-left--mobile", e);
|
|
1010
1016
|
}
|
|
1011
1017
|
get paddingTablet() {
|
|
1012
1018
|
return this.getAttribute("padding--tablet");
|
|
1013
1019
|
}
|
|
1014
1020
|
set paddingTablet(e) {
|
|
1015
|
-
|
|
1021
|
+
_(this, "padding--tablet", e);
|
|
1016
1022
|
}
|
|
1017
1023
|
get paddingBlockTablet() {
|
|
1018
1024
|
return this.getAttribute("padding-block--tablet");
|
|
1019
1025
|
}
|
|
1020
1026
|
set paddingBlockTablet(e) {
|
|
1021
|
-
|
|
1027
|
+
_(this, "padding-block--tablet", e);
|
|
1022
1028
|
}
|
|
1023
1029
|
get paddingInlineTablet() {
|
|
1024
1030
|
return this.getAttribute("padding-inline--tablet");
|
|
1025
1031
|
}
|
|
1026
1032
|
set paddingInlineTablet(e) {
|
|
1027
|
-
|
|
1033
|
+
_(this, "padding-inline--tablet", e);
|
|
1028
1034
|
}
|
|
1029
1035
|
get paddingTopTablet() {
|
|
1030
1036
|
return this.getAttribute("padding-top--tablet");
|
|
1031
1037
|
}
|
|
1032
1038
|
set paddingTopTablet(e) {
|
|
1033
|
-
|
|
1039
|
+
_(this, "padding-top--tablet", e);
|
|
1034
1040
|
}
|
|
1035
1041
|
get paddingRightTablet() {
|
|
1036
1042
|
return this.getAttribute("padding-right--tablet");
|
|
1037
1043
|
}
|
|
1038
1044
|
set paddingRightTablet(e) {
|
|
1039
|
-
|
|
1045
|
+
_(this, "padding-right--tablet", e);
|
|
1040
1046
|
}
|
|
1041
1047
|
get paddingBottomTablet() {
|
|
1042
1048
|
return this.getAttribute("padding-bottom--tablet");
|
|
1043
1049
|
}
|
|
1044
1050
|
set paddingBottomTablet(e) {
|
|
1045
|
-
|
|
1051
|
+
_(this, "padding-bottom--tablet", e);
|
|
1046
1052
|
}
|
|
1047
1053
|
get paddingLeftTablet() {
|
|
1048
1054
|
return this.getAttribute("padding-left--tablet");
|
|
1049
1055
|
}
|
|
1050
1056
|
set paddingLeftTablet(e) {
|
|
1051
|
-
|
|
1057
|
+
_(this, "padding-left--tablet", e);
|
|
1052
1058
|
}
|
|
1053
1059
|
get paddingLaptop() {
|
|
1054
1060
|
return this.getAttribute("padding--laptop");
|
|
1055
1061
|
}
|
|
1056
1062
|
set paddingLaptop(e) {
|
|
1057
|
-
|
|
1063
|
+
_(this, "padding--laptop", e);
|
|
1058
1064
|
}
|
|
1059
1065
|
get paddingBlockLaptop() {
|
|
1060
1066
|
return this.getAttribute("padding-block--laptop");
|
|
1061
1067
|
}
|
|
1062
1068
|
set paddingBlockLaptop(e) {
|
|
1063
|
-
|
|
1069
|
+
_(this, "padding-block--laptop", e);
|
|
1064
1070
|
}
|
|
1065
1071
|
get paddingInlineLaptop() {
|
|
1066
1072
|
return this.getAttribute("padding-inline--laptop");
|
|
1067
1073
|
}
|
|
1068
1074
|
set paddingInlineLaptop(e) {
|
|
1069
|
-
|
|
1075
|
+
_(this, "padding-inline--laptop", e);
|
|
1070
1076
|
}
|
|
1071
1077
|
get paddingTopLaptop() {
|
|
1072
1078
|
return this.getAttribute("padding-top--laptop");
|
|
1073
1079
|
}
|
|
1074
1080
|
set paddingTopLaptop(e) {
|
|
1075
|
-
|
|
1081
|
+
_(this, "padding-top--laptop", e);
|
|
1076
1082
|
}
|
|
1077
1083
|
get paddingRightLaptop() {
|
|
1078
1084
|
return this.getAttribute("padding-right--laptop");
|
|
1079
1085
|
}
|
|
1080
1086
|
set paddingRightLaptop(e) {
|
|
1081
|
-
|
|
1087
|
+
_(this, "padding-right--laptop", e);
|
|
1082
1088
|
}
|
|
1083
1089
|
get paddingBottomLaptop() {
|
|
1084
1090
|
return this.getAttribute("padding-bottom--laptop");
|
|
1085
1091
|
}
|
|
1086
1092
|
set paddingBottomLaptop(e) {
|
|
1087
|
-
|
|
1093
|
+
_(this, "padding-bottom--laptop", e);
|
|
1088
1094
|
}
|
|
1089
1095
|
get paddingLeftLaptop() {
|
|
1090
1096
|
return this.getAttribute("padding-left--laptop");
|
|
1091
1097
|
}
|
|
1092
1098
|
set paddingLeftLaptop(e) {
|
|
1093
|
-
|
|
1099
|
+
_(this, "padding-left--laptop", e);
|
|
1094
1100
|
}
|
|
1095
1101
|
get border() {
|
|
1096
1102
|
return this.getAttribute("border");
|
|
1097
1103
|
}
|
|
1098
1104
|
set border(e) {
|
|
1099
|
-
|
|
1105
|
+
_(this, "border", e);
|
|
1100
1106
|
}
|
|
1101
1107
|
get borderColor() {
|
|
1102
1108
|
return this.getAttribute("border-color");
|
|
1103
1109
|
}
|
|
1104
1110
|
set borderColor(e) {
|
|
1105
|
-
|
|
1111
|
+
_(this, "border-color", e);
|
|
1106
1112
|
}
|
|
1107
1113
|
get borderSide() {
|
|
1108
1114
|
return this.getAttribute("border-side");
|
|
1109
1115
|
}
|
|
1110
1116
|
set borderSide(e) {
|
|
1111
|
-
|
|
1117
|
+
_(this, "border-side", e);
|
|
1112
1118
|
}
|
|
1113
1119
|
get borderSideMobile() {
|
|
1114
1120
|
return this.getAttribute("border-side--mobile");
|
|
1115
1121
|
}
|
|
1116
1122
|
set borderSideMobile(e) {
|
|
1117
|
-
|
|
1123
|
+
_(this, "border-side--mobile", e);
|
|
1118
1124
|
}
|
|
1119
1125
|
get borderSideTablet() {
|
|
1120
1126
|
return this.getAttribute("border-side--tablet");
|
|
1121
1127
|
}
|
|
1122
1128
|
set borderSideTablet(e) {
|
|
1123
|
-
|
|
1129
|
+
_(this, "border-side--tablet", e);
|
|
1124
1130
|
}
|
|
1125
1131
|
get borderSideLaptop() {
|
|
1126
1132
|
return this.getAttribute("border-side--laptop");
|
|
1127
1133
|
}
|
|
1128
1134
|
set borderSideLaptop(e) {
|
|
1129
|
-
|
|
1135
|
+
_(this, "border-side--laptop", e);
|
|
1130
1136
|
}
|
|
1131
1137
|
get borderRadius() {
|
|
1132
1138
|
return this.getAttribute("border-radius");
|
|
1133
1139
|
}
|
|
1134
1140
|
set borderRadius(e) {
|
|
1135
|
-
|
|
1141
|
+
_(this, "border-radius", e);
|
|
1136
1142
|
}
|
|
1137
1143
|
get noBorderRadius() {
|
|
1138
1144
|
return this.getAttribute("no-border-radius");
|
|
1139
1145
|
}
|
|
1140
1146
|
set noBorderRadius(e) {
|
|
1141
|
-
|
|
1147
|
+
_(this, "no-border-radius", e);
|
|
1142
1148
|
}
|
|
1143
1149
|
get noBorderRadiusMobile() {
|
|
1144
1150
|
return this.getAttribute("no-border-radius--mobile");
|
|
1145
1151
|
}
|
|
1146
1152
|
set noBorderRadiusMobile(e) {
|
|
1147
|
-
|
|
1153
|
+
_(this, "no-border-radius--mobile", e);
|
|
1148
1154
|
}
|
|
1149
1155
|
get noBorderRadiusTablet() {
|
|
1150
1156
|
return this.getAttribute("no-border-radius--tablet");
|
|
1151
1157
|
}
|
|
1152
1158
|
set noBorderRadiusTablet(e) {
|
|
1153
|
-
|
|
1159
|
+
_(this, "no-border-radius--tablet", e);
|
|
1154
1160
|
}
|
|
1155
1161
|
get noBorderRadiusLaptop() {
|
|
1156
1162
|
return this.getAttribute("no-border-radius--laptop");
|
|
1157
1163
|
}
|
|
1158
1164
|
set noBorderRadiusLaptop(e) {
|
|
1159
|
-
|
|
1165
|
+
_(this, "no-border-radius--laptop", e);
|
|
1160
1166
|
}
|
|
1161
1167
|
get backgroundColor() {
|
|
1162
1168
|
return this.getAttribute("background-color");
|
|
1163
1169
|
}
|
|
1164
1170
|
set backgroundColor(e) {
|
|
1165
|
-
|
|
1171
|
+
_(this, "background-color", e);
|
|
1166
1172
|
}
|
|
1167
1173
|
get backgroundColorMobile() {
|
|
1168
1174
|
return this.getAttribute("background-color--mobile");
|
|
1169
1175
|
}
|
|
1170
1176
|
set backgroundColorMobile(e) {
|
|
1171
|
-
|
|
1177
|
+
_(this, "background-color--mobile", e);
|
|
1172
1178
|
}
|
|
1173
1179
|
get backgroundColorTablet() {
|
|
1174
1180
|
return this.getAttribute("background-color--tablet");
|
|
1175
1181
|
}
|
|
1176
1182
|
set backgroundColorTablet(e) {
|
|
1177
|
-
|
|
1183
|
+
_(this, "background-color--tablet", e);
|
|
1178
1184
|
}
|
|
1179
1185
|
get backgroundColorLaptop() {
|
|
1180
1186
|
return this.getAttribute("background-color--laptop");
|
|
1181
1187
|
}
|
|
1182
1188
|
set backgroundColorLaptop(e) {
|
|
1183
|
-
|
|
1189
|
+
_(this, "background-color--laptop", e);
|
|
1184
1190
|
}
|
|
1185
1191
|
get gradient() {
|
|
1186
1192
|
return this.getAttribute("background-gradient");
|
|
1187
1193
|
}
|
|
1188
1194
|
set gradient(e) {
|
|
1189
|
-
|
|
1195
|
+
_(this, "background-gradient", e);
|
|
1190
1196
|
}
|
|
1191
1197
|
get gradientMobile() {
|
|
1192
1198
|
return this.getAttribute("background-gradient--mobile");
|
|
1193
1199
|
}
|
|
1194
1200
|
set gradientMobile(e) {
|
|
1195
|
-
|
|
1201
|
+
_(this, "background-gradient--mobile", e);
|
|
1196
1202
|
}
|
|
1197
1203
|
get gradientTablet() {
|
|
1198
1204
|
return this.getAttribute("background-gradient--tablet");
|
|
1199
1205
|
}
|
|
1200
1206
|
set gradientTablet(e) {
|
|
1201
|
-
|
|
1207
|
+
_(this, "background-gradient--tablet", e);
|
|
1202
1208
|
}
|
|
1203
1209
|
get gradientLaptop() {
|
|
1204
1210
|
return this.getAttribute("background-gradient--laptop");
|
|
1205
1211
|
}
|
|
1206
1212
|
set gradientLaptop(e) {
|
|
1207
|
-
|
|
1213
|
+
_(this, "background-gradient--laptop", e);
|
|
1208
1214
|
}
|
|
1209
1215
|
get backgroundImage() {
|
|
1210
1216
|
return this.getAttribute("background-image");
|
|
1211
1217
|
}
|
|
1212
1218
|
set backgroundImage(e) {
|
|
1213
|
-
|
|
1219
|
+
_(this, "background-image", e);
|
|
1214
1220
|
}
|
|
1215
1221
|
get backgroundImageMobile() {
|
|
1216
1222
|
return this.getAttribute("background-image--mobile");
|
|
1217
1223
|
}
|
|
1218
1224
|
set backgroundImageMobile(e) {
|
|
1219
|
-
|
|
1225
|
+
_(this, "background-image--mobile", e);
|
|
1220
1226
|
}
|
|
1221
1227
|
get backgroundImageTablet() {
|
|
1222
1228
|
return this.getAttribute("background-image--tablet");
|
|
1223
1229
|
}
|
|
1224
1230
|
set backgroundImageTablet(e) {
|
|
1225
|
-
|
|
1231
|
+
_(this, "background-image--tablet", e);
|
|
1226
1232
|
}
|
|
1227
1233
|
get backgroundImageLaptop() {
|
|
1228
1234
|
return this.getAttribute("background-image--laptop");
|
|
1229
1235
|
}
|
|
1230
1236
|
set backgroundImageLaptop(e) {
|
|
1231
|
-
|
|
1237
|
+
_(this, "background-image--laptop", e);
|
|
1232
1238
|
}
|
|
1233
1239
|
get backgroundSize() {
|
|
1234
1240
|
return this.getAttribute("background-size");
|
|
1235
1241
|
}
|
|
1236
1242
|
set backgroundSize(e) {
|
|
1237
|
-
|
|
1243
|
+
_(this, "background-size", e);
|
|
1238
1244
|
}
|
|
1239
1245
|
get backgroundPosition() {
|
|
1240
1246
|
return this.getAttribute("background-position");
|
|
1241
1247
|
}
|
|
1242
1248
|
set backgroundPosition(e) {
|
|
1243
|
-
|
|
1249
|
+
_(this, "background-position", e);
|
|
1244
1250
|
}
|
|
1245
1251
|
get boxShadow() {
|
|
1246
1252
|
return this.getAttribute("box-shadow");
|
|
1247
1253
|
}
|
|
1248
1254
|
set boxShadow(e) {
|
|
1249
|
-
|
|
1255
|
+
_(this, "box-shadow", e);
|
|
1250
1256
|
}
|
|
1251
1257
|
get anchorOffset() {
|
|
1252
1258
|
return this.getAttribute("anchor-offset");
|
|
1253
1259
|
}
|
|
1254
1260
|
set anchorOffset(e) {
|
|
1255
|
-
|
|
1261
|
+
_(this, "anchor-offset", e);
|
|
1256
1262
|
}
|
|
1257
1263
|
get anchorSpacing() {
|
|
1258
1264
|
return this.getAttribute("anchor-spacing");
|
|
1259
1265
|
}
|
|
1260
1266
|
set anchorSpacing(e) {
|
|
1261
|
-
|
|
1267
|
+
_(this, "anchor-spacing", e);
|
|
1262
1268
|
}
|
|
1263
1269
|
get inverted() {
|
|
1264
1270
|
return this.hasAttribute("inverted");
|
|
@@ -1270,31 +1276,31 @@ var I = [
|
|
|
1270
1276
|
return this.getAttribute("subgrid-rows");
|
|
1271
1277
|
}
|
|
1272
1278
|
set subgridRows(e) {
|
|
1273
|
-
|
|
1279
|
+
_(this, "subgrid-rows", e);
|
|
1274
1280
|
}
|
|
1275
1281
|
get subgridGap() {
|
|
1276
1282
|
return this.getAttribute("subgrid-gap");
|
|
1277
1283
|
}
|
|
1278
1284
|
set subgridGap(e) {
|
|
1279
|
-
|
|
1285
|
+
_(this, "subgrid-gap", e);
|
|
1280
1286
|
}
|
|
1281
1287
|
get subgridGapMobile() {
|
|
1282
1288
|
return this.getAttribute("subgrid-gap--mobile");
|
|
1283
1289
|
}
|
|
1284
1290
|
set subgridGapMobile(e) {
|
|
1285
|
-
|
|
1291
|
+
_(this, "subgrid-gap--mobile", e);
|
|
1286
1292
|
}
|
|
1287
1293
|
get subgridGapTablet() {
|
|
1288
1294
|
return this.getAttribute("subgrid-gap--tablet");
|
|
1289
1295
|
}
|
|
1290
1296
|
set subgridGapTablet(e) {
|
|
1291
|
-
|
|
1297
|
+
_(this, "subgrid-gap--tablet", e);
|
|
1292
1298
|
}
|
|
1293
1299
|
get subgridGapLaptop() {
|
|
1294
1300
|
return this.getAttribute("subgrid-gap--laptop");
|
|
1295
1301
|
}
|
|
1296
1302
|
set subgridGapLaptop(e) {
|
|
1297
|
-
|
|
1303
|
+
_(this, "subgrid-gap--laptop", e);
|
|
1298
1304
|
}
|
|
1299
1305
|
};
|
|
1300
1306
|
customElements.get("px-container") || customElements.define("px-container", V);
|
|
@@ -1302,14 +1308,14 @@ customElements.get("px-container") || customElements.define("px-container", V);
|
|
|
1302
1308
|
//#region ../../components/Layout/src/Stack.css?inline
|
|
1303
1309
|
var H = ":host{display:block}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-mobile) - var(--host-gap--mobile))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-mobile) + var(--px-focus-offset-mobile)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-mobile) + var(--px-focus-offset-mobile))}.flex-container{box-sizing:border-box;flex-direction:var(--flex-direction--mobile-value);gap:var(--flex-gap--mobile-value);flex-wrap:var(--flex-wrap--mobile-value);justify-content:var(--flex-justify-content--mobile-value);align-items:var(--flex-align-items--mobile-value);width:100%;height:100%;overflow-x:var(--overflow-x-all);display:flex}@media screen and (width<=47.938rem){.flex-container{overflow-x:var(--overflow-x-all-mobile,var(--overflow-x-all));scrollbar-width:none}.flex-container::-webkit-scrollbar{display:none}}@media screen and (width>=48rem){.flex-container{flex-direction:var(--flex-direction--tablet-value);gap:var(--flex-gap--tablet-value);flex-wrap:var(--flex-wrap--tablet-value);justify-content:var(--flex-justify-content--tablet-value);align-items:var(--flex-align-items--tablet-value)}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-tablet) - var(--host-gap--tablet))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-tablet) + var(--px-focus-offset-tablet)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-tablet) + var(--px-focus-offset-tablet))}}@media screen and (width>=48rem) and (width<=64rem){.flex-container{overflow-x:var(--overflow-x-all-tablet,var(--overflow-x-all));scrollbar-width:none}.flex-container::-webkit-scrollbar{display:none}}@media screen and (width>=64.0625rem){.flex-container{flex-direction:var(--flex-direction--laptop-value);gap:var(--flex-gap--laptop-value);flex-wrap:var(--flex-wrap--laptop-value);justify-content:var(--flex-justify-content--laptop-value);align-items:var(--flex-align-items--laptop-value)}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-laptop) - var(--host-gap--laptop))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-laptop) + var(--px-focus-offset-laptop)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-laptop) + var(--px-focus-offset-laptop))}}@media screen and (width>=64.0625rem) and (width<=90rem){.flex-container{overflow-x:var(--overflow-x-all-laptop,var(--overflow-x-all))}}@media screen and (width>=90.0625rem){.flex-container{flex-direction:var(--flex-direction--desktop-value);gap:var(--flex-gap--desktop-value);flex-wrap:var(--flex-wrap--desktop-value);justify-content:var(--flex-justify-content--desktop-value);align-items:var(--flex-align-items--desktop-value);overflow-x:var(--overflow-x-all-desktop,var(--overflow-x-all))}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-desktop) - var(--host-gap--desktop))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-desktop) + var(--px-focus-offset-desktop)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-desktop) + var(--px-focus-offset-desktop))}}", U = new CSSStyleSheet();
|
|
1304
1310
|
U.replaceSync(H);
|
|
1305
|
-
var
|
|
1311
|
+
var de = [
|
|
1306
1312
|
"",
|
|
1307
1313
|
"default",
|
|
1308
1314
|
"row",
|
|
1309
1315
|
"row-reverse",
|
|
1310
1316
|
"column",
|
|
1311
1317
|
"column-reverse"
|
|
1312
|
-
],
|
|
1318
|
+
], fe = [
|
|
1313
1319
|
"",
|
|
1314
1320
|
"default",
|
|
1315
1321
|
"stretch",
|
|
@@ -1319,7 +1325,7 @@ var ue = [
|
|
|
1319
1325
|
"end",
|
|
1320
1326
|
"center",
|
|
1321
1327
|
"baseline"
|
|
1322
|
-
],
|
|
1328
|
+
], pe = [
|
|
1323
1329
|
"",
|
|
1324
1330
|
"default",
|
|
1325
1331
|
"flex-start",
|
|
@@ -1330,13 +1336,13 @@ var ue = [
|
|
|
1330
1336
|
"space-between",
|
|
1331
1337
|
"space-around",
|
|
1332
1338
|
"space-evenly"
|
|
1333
|
-
],
|
|
1339
|
+
], me = [
|
|
1334
1340
|
"",
|
|
1335
1341
|
"default",
|
|
1336
1342
|
"nowrap",
|
|
1337
1343
|
"wrap",
|
|
1338
1344
|
"wrap-reverse"
|
|
1339
|
-
],
|
|
1345
|
+
], he = [
|
|
1340
1346
|
"",
|
|
1341
1347
|
"visible",
|
|
1342
1348
|
"hidden",
|
|
@@ -1391,55 +1397,55 @@ var ue = [
|
|
|
1391
1397
|
case "gap--tablet":
|
|
1392
1398
|
case "gap--laptop":
|
|
1393
1399
|
case "gap--desktop":
|
|
1394
|
-
this.updateFlexProperties(e, t, n,
|
|
1400
|
+
this.updateFlexProperties(e, t, n, p);
|
|
1395
1401
|
break;
|
|
1396
1402
|
case "justify-content":
|
|
1397
1403
|
case "justify-content--mobile":
|
|
1398
1404
|
case "justify-content--tablet":
|
|
1399
1405
|
case "justify-content--laptop":
|
|
1400
1406
|
case "justify-content--desktop":
|
|
1401
|
-
this.updateFlexProperties(e, t, n,
|
|
1407
|
+
this.updateFlexProperties(e, t, n, pe);
|
|
1402
1408
|
break;
|
|
1403
1409
|
case "align-items":
|
|
1404
1410
|
case "align-items--mobile":
|
|
1405
1411
|
case "align-items--tablet":
|
|
1406
1412
|
case "align-items--laptop":
|
|
1407
1413
|
case "align-items--desktop":
|
|
1408
|
-
this.updateFlexProperties(e, t, n,
|
|
1414
|
+
this.updateFlexProperties(e, t, n, fe);
|
|
1409
1415
|
break;
|
|
1410
1416
|
case "wrap":
|
|
1411
1417
|
case "wrap--mobile":
|
|
1412
1418
|
case "wrap--tablet":
|
|
1413
1419
|
case "wrap--laptop":
|
|
1414
1420
|
case "wrap--desktop":
|
|
1415
|
-
this.updateFlexProperties(e, t, n,
|
|
1421
|
+
this.updateFlexProperties(e, t, n, me);
|
|
1416
1422
|
break;
|
|
1417
1423
|
case "direction":
|
|
1418
1424
|
case "direction--mobile":
|
|
1419
1425
|
case "direction--tablet":
|
|
1420
1426
|
case "direction--laptop":
|
|
1421
1427
|
case "direction--desktop":
|
|
1422
|
-
this.updateFlexProperties(e, t, n,
|
|
1428
|
+
this.updateFlexProperties(e, t, n, de);
|
|
1423
1429
|
break;
|
|
1424
1430
|
case "overflow-x":
|
|
1425
1431
|
case "overflow-x--mobile":
|
|
1426
1432
|
case "overflow-x--tablet":
|
|
1427
1433
|
case "overflow-x--laptop":
|
|
1428
1434
|
case "overflow-x--desktop":
|
|
1429
|
-
this.updateOverflowX(e, t, n,
|
|
1435
|
+
this.updateOverflowX(e, t, n, he);
|
|
1430
1436
|
break;
|
|
1431
1437
|
default: super.attributeChangedCallback(e, t, n);
|
|
1432
1438
|
}
|
|
1433
1439
|
}
|
|
1434
1440
|
updateOverflowX(e, t, n, r) {
|
|
1435
|
-
if (!
|
|
1436
|
-
|
|
1441
|
+
if (!l(r, n)) {
|
|
1442
|
+
h(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${r.join("\", \"")}".`);
|
|
1437
1443
|
return;
|
|
1438
1444
|
}
|
|
1439
1445
|
this.overflowXAttributeDelegate.attributeChangedCallback(e, t, n);
|
|
1440
1446
|
}
|
|
1441
1447
|
updateFlexProperties(e, t, n, r) {
|
|
1442
|
-
this.checkName(r, n) ||
|
|
1448
|
+
this.checkName(r, n) || h(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${r.join("\", \"")}".`);
|
|
1443
1449
|
let i = e.indexOf("--") > -1, a = i ? e.split("--")[0] : e, o = [];
|
|
1444
1450
|
if (!i) this.getAttribute(a + "--mobile") || o.push("mobile"), this.getAttribute(a + "--tablet") || o.push("tablet"), this.getAttribute(a + "--laptop") || o.push("laptop"), this.getAttribute(a + "--desktop") || o.push("desktop"), o.forEach((e) => {
|
|
1445
1451
|
this.updateStyle(a, e, t, r), this.updateStyle(a, e, n, r);
|
|
@@ -1456,188 +1462,188 @@ var ue = [
|
|
|
1456
1462
|
return this.getAttribute("direction");
|
|
1457
1463
|
}
|
|
1458
1464
|
set direction(e) {
|
|
1459
|
-
|
|
1465
|
+
_(this, "direction", e);
|
|
1460
1466
|
}
|
|
1461
1467
|
get directionMobile() {
|
|
1462
1468
|
return this.getAttribute("direction--mobile");
|
|
1463
1469
|
}
|
|
1464
1470
|
set directionMobile(e) {
|
|
1465
|
-
|
|
1471
|
+
_(this, "direction--mobile", e);
|
|
1466
1472
|
}
|
|
1467
1473
|
get directionTablet() {
|
|
1468
1474
|
return this.getAttribute("direction--tablet");
|
|
1469
1475
|
}
|
|
1470
1476
|
set directionTablet(e) {
|
|
1471
|
-
|
|
1477
|
+
_(this, "direction--tablet", e);
|
|
1472
1478
|
}
|
|
1473
1479
|
get directionLaptop() {
|
|
1474
1480
|
return this.getAttribute("direction--laptop");
|
|
1475
1481
|
}
|
|
1476
1482
|
set directionLaptop(e) {
|
|
1477
|
-
|
|
1483
|
+
_(this, "direction--laptop", e);
|
|
1478
1484
|
}
|
|
1479
1485
|
get directionDesktop() {
|
|
1480
1486
|
return this.getAttribute("direction--desktop");
|
|
1481
1487
|
}
|
|
1482
1488
|
set directionDesktop(e) {
|
|
1483
|
-
|
|
1489
|
+
_(this, "direction--desktop", e);
|
|
1484
1490
|
}
|
|
1485
1491
|
get gap() {
|
|
1486
1492
|
return this.getAttribute("gap");
|
|
1487
1493
|
}
|
|
1488
1494
|
set gap(e) {
|
|
1489
|
-
|
|
1495
|
+
_(this, "gap", e);
|
|
1490
1496
|
}
|
|
1491
1497
|
get gapMobile() {
|
|
1492
1498
|
return this.getAttribute("gap--mobile");
|
|
1493
1499
|
}
|
|
1494
1500
|
set gapMobile(e) {
|
|
1495
|
-
|
|
1501
|
+
_(this, "gap--mobile", e);
|
|
1496
1502
|
}
|
|
1497
1503
|
get gapTablet() {
|
|
1498
1504
|
return this.getAttribute("gap--tablet");
|
|
1499
1505
|
}
|
|
1500
1506
|
set gapTablet(e) {
|
|
1501
|
-
|
|
1507
|
+
_(this, "gap--tablet", e);
|
|
1502
1508
|
}
|
|
1503
1509
|
get gapLaptop() {
|
|
1504
1510
|
return this.getAttribute("gap--laptop");
|
|
1505
1511
|
}
|
|
1506
1512
|
set gapLaptop(e) {
|
|
1507
|
-
|
|
1513
|
+
_(this, "gap--laptop", e);
|
|
1508
1514
|
}
|
|
1509
1515
|
get gapDesktop() {
|
|
1510
1516
|
return this.getAttribute("gap--desktop");
|
|
1511
1517
|
}
|
|
1512
1518
|
set gapDesktop(e) {
|
|
1513
|
-
|
|
1519
|
+
_(this, "gap--desktop", e);
|
|
1514
1520
|
}
|
|
1515
1521
|
get justifyContent() {
|
|
1516
1522
|
return this.getAttribute("justify-content");
|
|
1517
1523
|
}
|
|
1518
1524
|
set justifyContent(e) {
|
|
1519
|
-
|
|
1525
|
+
_(this, "justify-content", e);
|
|
1520
1526
|
}
|
|
1521
1527
|
get justifyContentMobile() {
|
|
1522
1528
|
return this.getAttribute("justify-content--mobile");
|
|
1523
1529
|
}
|
|
1524
1530
|
set justifyContentMobile(e) {
|
|
1525
|
-
|
|
1531
|
+
_(this, "justify-content--mobile", e);
|
|
1526
1532
|
}
|
|
1527
1533
|
get justifyContentTablet() {
|
|
1528
1534
|
return this.getAttribute("justify-content--tablet");
|
|
1529
1535
|
}
|
|
1530
1536
|
set justifyContentTablet(e) {
|
|
1531
|
-
|
|
1537
|
+
_(this, "justify-content--tablet", e);
|
|
1532
1538
|
}
|
|
1533
1539
|
get justifyContentLaptop() {
|
|
1534
1540
|
return this.getAttribute("justify-content--laptop");
|
|
1535
1541
|
}
|
|
1536
1542
|
set justifyContentLaptop(e) {
|
|
1537
|
-
|
|
1543
|
+
_(this, "justify-content--laptop", e);
|
|
1538
1544
|
}
|
|
1539
1545
|
get justifyContentDesktop() {
|
|
1540
1546
|
return this.getAttribute("justify-content--desktop");
|
|
1541
1547
|
}
|
|
1542
1548
|
set justifyContentDesktop(e) {
|
|
1543
|
-
|
|
1549
|
+
_(this, "justify-content--desktop", e);
|
|
1544
1550
|
}
|
|
1545
1551
|
get alignItems() {
|
|
1546
1552
|
return this.getAttribute("align-items");
|
|
1547
1553
|
}
|
|
1548
1554
|
set alignItems(e) {
|
|
1549
|
-
|
|
1555
|
+
_(this, "align-items", e);
|
|
1550
1556
|
}
|
|
1551
1557
|
get alignItemsMobile() {
|
|
1552
1558
|
return this.getAttribute("align-items--mobile");
|
|
1553
1559
|
}
|
|
1554
1560
|
set alignItemsMobile(e) {
|
|
1555
|
-
|
|
1561
|
+
_(this, "align-items--mobile", e);
|
|
1556
1562
|
}
|
|
1557
1563
|
get alignItemsTablet() {
|
|
1558
1564
|
return this.getAttribute("align-items--tablet");
|
|
1559
1565
|
}
|
|
1560
1566
|
set alignItemsTablet(e) {
|
|
1561
|
-
|
|
1567
|
+
_(this, "align-items--tablet", e);
|
|
1562
1568
|
}
|
|
1563
1569
|
get alignItemsLaptop() {
|
|
1564
1570
|
return this.getAttribute("align-items--laptop");
|
|
1565
1571
|
}
|
|
1566
1572
|
set alignItemsLaptop(e) {
|
|
1567
|
-
|
|
1573
|
+
_(this, "align-items--laptop", e);
|
|
1568
1574
|
}
|
|
1569
1575
|
get alignItemsDesktop() {
|
|
1570
1576
|
return this.getAttribute("align-items--desktop");
|
|
1571
1577
|
}
|
|
1572
1578
|
set alignItemsDesktop(e) {
|
|
1573
|
-
|
|
1579
|
+
_(this, "align-items--desktop", e);
|
|
1574
1580
|
}
|
|
1575
1581
|
get wrap() {
|
|
1576
1582
|
return this.getAttribute("wrap");
|
|
1577
1583
|
}
|
|
1578
1584
|
set wrap(e) {
|
|
1579
|
-
|
|
1585
|
+
_(this, "wrap", e);
|
|
1580
1586
|
}
|
|
1581
1587
|
get wrapMobile() {
|
|
1582
1588
|
return this.getAttribute("wrap--mobile");
|
|
1583
1589
|
}
|
|
1584
1590
|
set wrapMobile(e) {
|
|
1585
|
-
|
|
1591
|
+
_(this, "wrap--mobile", e);
|
|
1586
1592
|
}
|
|
1587
1593
|
get wrapTablet() {
|
|
1588
1594
|
return this.getAttribute("wrap--tablet");
|
|
1589
1595
|
}
|
|
1590
1596
|
set wrapTablet(e) {
|
|
1591
|
-
|
|
1597
|
+
_(this, "wrap--tablet", e);
|
|
1592
1598
|
}
|
|
1593
1599
|
get wrapLaptop() {
|
|
1594
1600
|
return this.getAttribute("wrap--laptop");
|
|
1595
1601
|
}
|
|
1596
1602
|
set wrapLaptop(e) {
|
|
1597
|
-
|
|
1603
|
+
_(this, "wrap--laptop", e);
|
|
1598
1604
|
}
|
|
1599
1605
|
get wrapDesktop() {
|
|
1600
1606
|
return this.getAttribute("wrap--desktop");
|
|
1601
1607
|
}
|
|
1602
1608
|
set wrapDesktop(e) {
|
|
1603
|
-
|
|
1609
|
+
_(this, "wrap--desktop", e);
|
|
1604
1610
|
}
|
|
1605
1611
|
get overflowX() {
|
|
1606
1612
|
return this.getAttribute("overflow-x");
|
|
1607
1613
|
}
|
|
1608
1614
|
set overflowX(e) {
|
|
1609
|
-
|
|
1615
|
+
_(this, "overflow-x", e);
|
|
1610
1616
|
}
|
|
1611
1617
|
get overflowXMobile() {
|
|
1612
1618
|
return this.getAttribute("overflow-x--mobile");
|
|
1613
1619
|
}
|
|
1614
1620
|
set overflowXMobile(e) {
|
|
1615
|
-
|
|
1621
|
+
_(this, "overflow-x--mobile", e);
|
|
1616
1622
|
}
|
|
1617
1623
|
get overflowXTablet() {
|
|
1618
1624
|
return this.getAttribute("overflow-x--tablet");
|
|
1619
1625
|
}
|
|
1620
1626
|
set overflowXTablet(e) {
|
|
1621
|
-
|
|
1627
|
+
_(this, "overflow-x--tablet", e);
|
|
1622
1628
|
}
|
|
1623
1629
|
get overflowXLaptop() {
|
|
1624
1630
|
return this.getAttribute("overflow-x--laptop");
|
|
1625
1631
|
}
|
|
1626
1632
|
set overflowXLaptop(e) {
|
|
1627
|
-
|
|
1633
|
+
_(this, "overflow-x--laptop", e);
|
|
1628
1634
|
}
|
|
1629
1635
|
get overflowXDesktop() {
|
|
1630
1636
|
return this.getAttribute("overflow-x--desktop");
|
|
1631
1637
|
}
|
|
1632
1638
|
set overflowXDesktop(e) {
|
|
1633
|
-
|
|
1639
|
+
_(this, "overflow-x--desktop", e);
|
|
1634
1640
|
}
|
|
1635
1641
|
get $el() {
|
|
1636
1642
|
return this.shadowRoot.querySelector(".flex-container");
|
|
1637
1643
|
}
|
|
1638
1644
|
};
|
|
1639
1645
|
customElements.get("px-stack") || customElements.define("px-stack", W);
|
|
1640
|
-
var
|
|
1646
|
+
var ge = class extends W {
|
|
1641
1647
|
constructor() {
|
|
1642
1648
|
super();
|
|
1643
1649
|
}
|
|
@@ -1645,8 +1651,8 @@ var he = class extends W {
|
|
|
1645
1651
|
super.connectedCallback(), this.direction = "column", this.directionMobile = "column", this.directionTablet = "column", this.directionLaptop = "column", this.directionDesktop = "column";
|
|
1646
1652
|
}
|
|
1647
1653
|
};
|
|
1648
|
-
customElements.get("px-vstack") || customElements.define("px-vstack",
|
|
1649
|
-
var
|
|
1654
|
+
customElements.get("px-vstack") || customElements.define("px-vstack", ge);
|
|
1655
|
+
var _e = class extends W {
|
|
1650
1656
|
constructor() {
|
|
1651
1657
|
super();
|
|
1652
1658
|
}
|
|
@@ -1654,10 +1660,10 @@ var ge = class extends W {
|
|
|
1654
1660
|
super.connectedCallback(), this.direction = "row", this.directionMobile = "row", this.directionTablet = "row", this.directionLaptop = "row", this.directionDesktop = "row";
|
|
1655
1661
|
}
|
|
1656
1662
|
};
|
|
1657
|
-
customElements.get("px-hstack") || customElements.define("px-hstack",
|
|
1663
|
+
customElements.get("px-hstack") || customElements.define("px-hstack", _e);
|
|
1658
1664
|
//#endregion
|
|
1659
1665
|
//#region ../../components/Layout/src/Spacer.ts
|
|
1660
|
-
var
|
|
1666
|
+
var ve = class extends HTMLElement {
|
|
1661
1667
|
constructor() {
|
|
1662
1668
|
super(), this.isZeroSized = !1, this.growValue = "1", this.isVertical = !1;
|
|
1663
1669
|
}
|
|
@@ -1703,14 +1709,14 @@ var _e = class extends HTMLElement {
|
|
|
1703
1709
|
e ? this.setAttribute("nogap", "") : this.removeAttribute("nogap");
|
|
1704
1710
|
}
|
|
1705
1711
|
};
|
|
1706
|
-
customElements.get("px-spacer") || customElements.define("px-spacer",
|
|
1712
|
+
customElements.get("px-spacer") || customElements.define("px-spacer", ve);
|
|
1707
1713
|
//#endregion
|
|
1708
1714
|
//#region ../../components/Layout/src/Page.css?inline
|
|
1709
|
-
var
|
|
1710
|
-
G.replaceSync(
|
|
1711
|
-
var
|
|
1715
|
+
var ye = ":host{box-sizing:border-box;display:block}slot[name=body-container]{min-height:100vh}#image-sticky-box{margin-top:-2.5rem}", G = new CSSStyleSheet();
|
|
1716
|
+
G.replaceSync(ye);
|
|
1717
|
+
var be = class extends n {
|
|
1712
1718
|
constructor() {
|
|
1713
|
-
super(G), this.template = (
|
|
1719
|
+
super(G), this.template = () => `
|
|
1714
1720
|
<px-container border-radius="none" padding="none">
|
|
1715
1721
|
<px-vstack>
|
|
1716
1722
|
<px-container id="header-container" border-radius="none">
|
|
@@ -1747,15 +1753,6 @@ var ye = class extends n {
|
|
|
1747
1753
|
<px-spacer></px-spacer>
|
|
1748
1754
|
</px-hstack>
|
|
1749
1755
|
</px-container>
|
|
1750
|
-
${e ? ` <px-hstack>
|
|
1751
|
-
<px-spacer></px-spacer>
|
|
1752
|
-
<px-container border-radius="none" box-shadow="xl" id="image-sticky-box" border="s" grow="${this.grow}" basis="${this.basis}" border-radius="m">
|
|
1753
|
-
<px-vstack gap="s">
|
|
1754
|
-
<slot name="image-sticky-container"></slot>
|
|
1755
|
-
</px-vstack>
|
|
1756
|
-
</px-container>
|
|
1757
|
-
<px-spacer></px-spacer>
|
|
1758
|
-
</px-hstack>` : ""}
|
|
1759
1756
|
<px-container
|
|
1760
1757
|
id="body-container"
|
|
1761
1758
|
id="main"
|
|
@@ -1812,7 +1809,7 @@ var ye = class extends n {
|
|
|
1812
1809
|
</px-container>
|
|
1813
1810
|
</px-vstack>
|
|
1814
1811
|
</px-container>
|
|
1815
|
-
`, this.shadowRoot.innerHTML = this.template(
|
|
1812
|
+
`, this.shadowRoot.innerHTML = this.template();
|
|
1816
1813
|
}
|
|
1817
1814
|
static get observedAttributes() {
|
|
1818
1815
|
return [
|
|
@@ -1848,9 +1845,6 @@ var ye = class extends n {
|
|
|
1848
1845
|
get backgroundImage() {
|
|
1849
1846
|
return this.getAttribute("background-image");
|
|
1850
1847
|
}
|
|
1851
|
-
get $imageStickySlot() {
|
|
1852
|
-
return this.querySelector("*[slot=\"image-sticky-container\"]");
|
|
1853
|
-
}
|
|
1854
1848
|
get $main() {
|
|
1855
1849
|
return this.shadowRoot.querySelector("#main");
|
|
1856
1850
|
}
|
|
@@ -1902,12 +1896,12 @@ var ye = class extends n {
|
|
|
1902
1896
|
this.$headerContainer.paddingLeft = e, this.$headerContainer.paddingRight = e, this.$bodyContainer.paddingLeft = e, this.$bodyContainer.paddingRight = e, this.$contactContainer.paddingLeft = e, this.$contactContainer.paddingRight = e, this.$footerContainer.paddingLeft = e, this.$footerContainer.paddingRight = e, this.$imageContainer.paddingLeft = e, this.$imageContainer.paddingRight = e;
|
|
1903
1897
|
}
|
|
1904
1898
|
};
|
|
1905
|
-
customElements.get("px-page") === void 0 && customElements.define("px-page",
|
|
1899
|
+
customElements.get("px-page") === void 0 && customElements.define("px-page", be);
|
|
1906
1900
|
//#endregion
|
|
1907
1901
|
//#region ../../components/Span/src/span.css?inline
|
|
1908
|
-
var
|
|
1909
|
-
q.replaceSync(
|
|
1910
|
-
var
|
|
1902
|
+
var K = "span,::slotted(span){font-family:var(--px-font-family);color:var(--px-color-text-neutral-default);font-size:var(--px-text-size-body-m-mobile);line-height:var(--px-line-height-ratio-l)}:host([inverted]) span,:host([inverted]) ::slotted(span){color:var(--px-color-text-neutral-inverted)}:host([strikethrough]) span{text-decoration:line-through}span.link{text-decoration:underline}@media screen and (width>=48rem){span,::slotted(span){font-size:var(--px-text-size-body-m-tablet)}}@media screen and (width>=64.0625rem){span,::slotted(span){font-size:var(--px-text-size-body-m-laptop)}}", xe = ".color-inherit{color:inherit!important}.color-brand{color:var(--px-color-text-brand-default)!important}.color-neutral{color:var(--px-color-text-neutral-default)!important}.color-dimmed{color:var(--px-color-text-dimmed-default)!important}.color-purpose-success{color:var(--px-color-text-purpose-success-default)!important}.color-purpose-warning{color:var(--px-color-text-purpose-warning-default)!important}.color-purpose-error{color:var(--px-color-text-purpose-error-default)!important}.color-purpose-unlimited{color:var(--px-color-text-purpose-unlimited-default)!important}.color-purpose-promo{color:var(--px-color-text-purpose-promo-default)!important}.color-state-hover{color:var(--px-color-text-state-hover-default)!important}.color-state-active{color:var(--px-color-text-state-active-default)!important}.color-state-disabled{color:var(--px-color-text-state-disabled-default)!important}:host([inverted]) .color-inherit{color:inherit!important}:host([inverted]) .color-brand{color:var(--px-color-text-brand-inverted)!important}:host([inverted]) .color-neutral{color:var(--px-color-text-neutral-inverted)!important}:host([inverted]) .color-dimmed{color:var(--px-color-text-dimmed-inverted)!important}:host([inverted]) .color-purpose-success{color:var(--px-color-text-purpose-success-inverted)!important}:host([inverted]) .color-purpose-warning{color:var(--px-color-text-purpose-warning-inverted)!important}:host([inverted]) .color-purpose-error{color:var(--px-color-text-purpose-error-inverted)!important}:host([inverted]) .color-purpose-unlimited{color:var(--px-color-text-purpose-unlimited-inverted)!important}:host([inverted]) .color-purpose-promo{color:var(--px-color-text-purpose-promo-inverted)!important}:host([inverted]) .color-state-hover{color:var(--px-color-text-state-hover-inverted)!important}:host([inverted]) .color-state-active{color:var(--px-color-text-state-active-inverted)!important}:host([inverted]) .color-state-disabled{color:var(--px-color-text-state-disabled-inverted)!important}.font-size-inherit{font-size:inherit;line-height:inherit}.font-size-body-l{font-size:var(--px-text-size-body-l-mobile)}.font-size-body-m{font-size:var(--px-text-size-body-m-mobile)}.font-size-body-s{font-size:var(--px-text-size-body-s-mobile)}.font-size-body-xs{font-size:var(--px-text-size-body-xs-mobile)}.font-size-heading-5xl{font-size:var(--px-text-size-heading-5xl-mobile)}.font-size-heading-4xl{font-size:var(--px-text-size-heading-4xl-mobile)}.font-size-heading-3xl{font-size:var(--px-text-size-heading-3xl-mobile)}.font-size-heading-2xl{font-size:var(--px-text-size-heading-2xl-mobile)}.font-size-heading-xl{font-size:var(--px-text-size-heading-xl-mobile)}.font-size-heading-l{font-size:var(--px-text-size-heading-l-mobile)}.font-size-heading-m{font-size:var(--px-text-size-heading-m-mobile)}.font-size-heading-s{font-size:var(--px-text-size-heading-s-mobile)}.font-size-heading-3xl,.font-size-heading-4xl,.font-size-heading-5xl{line-height:var(--px-line-height-ratio-s)}.font-size-link-m{font-size:var(--px-text-size-link-m-mobile)}.font-size-link-s{font-size:var(--px-text-size-link-s-mobile)}@media screen and (width>=48rem){.font-size-body-l{font-size:var(--px-text-size-body-l-tablet)}.font-size-body-m{font-size:var(--px-text-size-body-m-tablet)}.font-size-body-s{font-size:var(--px-text-size-body-s-tablet)}.font-size-body-xs{font-size:var(--px-text-size-body-xs-tablet)}.font-size-heading-5xl{font-size:var(--px-text-size-heading-5xl-tablet)}.font-size-heading-4xl{font-size:var(--px-text-size-heading-4xl-tablet)}.font-size-heading-3xl{font-size:var(--px-text-size-heading-3xl-tablet)}.font-size-heading-2xl{font-size:var(--px-text-size-heading-2xl-tablet)}.font-size-heading-xl{font-size:var(--px-text-size-heading-xl-tablet)}.font-size-heading-l{font-size:var(--px-text-size-heading-l-tablet)}.font-size-heading-m{font-size:var(--px-text-size-heading-m-tablet)}.font-size-heading-s{font-size:var(--px-text-size-heading-s-tablet)}.font-size-link-m{font-size:var(--px-text-size-link-m-tablet)}.font-size-link-s{font-size:var(--px-text-size-link-s-tablet)}}@media screen and (width>=64.0625rem){.font-size-body-l{font-size:var(--px-text-size-body-l-laptop)}.font-size-body-m{font-size:var(--px-text-size-body-m-laptop)}.font-size-body-s{font-size:var(--px-text-size-body-s-laptop)}.font-size-body-xs{font-size:var(--px-text-size-body-xs-laptop)}.font-size-heading-5xl{font-size:var(--px-text-size-heading-5xl-laptop)}.font-size-heading-4xl{font-size:var(--px-text-size-heading-4xl-laptop)}.font-size-heading-3xl{font-size:var(--px-text-size-heading-3xl-laptop)}.font-size-heading-2xl{font-size:var(--px-text-size-heading-2xl-laptop)}.font-size-heading-xl{font-size:var(--px-text-size-heading-xl-laptop)}.font-size-heading-l{font-size:var(--px-text-size-heading-l-laptop)}.font-size-heading-m{font-size:var(--px-text-size-heading-m-laptop)}.font-size-heading-s{font-size:var(--px-text-size-heading-s-laptop)}.font-size-link-m{font-size:var(--px-text-size-link-m-laptop)}.font-size-link-s{font-size:var(--px-text-size-link-s-laptop)}}@media screen and (width>=90.0625rem){.font-size-body-l{font-size:var(--px-text-size-body-l-desktop)}.font-size-body-m{font-size:var(--px-text-size-body-m-desktop)}.font-size-body-s{font-size:var(--px-text-size-body-s-desktop)}.font-size-body-xs{font-size:var(--px-text-size-body-xs-desktop)}.font-size-heading-5xl{font-size:var(--px-text-size-heading-5xl-desktop)}.font-size-heading-4xl{font-size:var(--px-text-size-heading-4xl-desktop)}.font-size-heading-3xl{font-size:var(--px-text-size-heading-3xl-desktop)}.font-size-heading-2xl{font-size:var(--px-text-size-heading-2xl-desktop)}.font-size-heading-xl{font-size:var(--px-text-size-heading-xl-desktop)}.font-size-heading-l{font-size:var(--px-text-size-heading-l-desktop)}.font-size-heading-m{font-size:var(--px-text-size-heading-m-desktop)}.font-size-heading-s{font-size:var(--px-text-size-heading-s-desktop)}.font-size-link-m{font-size:var(--px-text-size-link-m-desktop)}.font-size-link-s{font-size:var(--px-text-size-link-s-desktop)}}.font-weight-inherit{font-weight:inherit}.font-weight-body{font-weight:var(--px-font-weight-body)}.font-weight-title{font-weight:var(--px-font-weight-title)}.font-weight-title-large{font-weight:var(--px-font-weight-title-large)}.font-weight-subtitle{font-weight:var(--px-font-weight-subtitle)}", q = new CSSStyleSheet(), J = new CSSStyleSheet();
|
|
1903
|
+
q.replaceSync(K), J.replaceSync(xe);
|
|
1904
|
+
var Se = class extends t {
|
|
1911
1905
|
static {
|
|
1912
1906
|
this.nativeName = "span";
|
|
1913
1907
|
}
|
|
@@ -1928,13 +1922,13 @@ var xe = class extends t {
|
|
|
1928
1922
|
attributeChangedCallback(e, t, n) {
|
|
1929
1923
|
if (t !== n) switch (e) {
|
|
1930
1924
|
case "color":
|
|
1931
|
-
this.updateTypography(e, t, n,
|
|
1925
|
+
this.updateTypography(e, t, n, ne);
|
|
1932
1926
|
break;
|
|
1933
1927
|
case "font-size":
|
|
1934
|
-
this.updateTypography(e, t, n,
|
|
1928
|
+
this.updateTypography(e, t, n, d);
|
|
1935
1929
|
break;
|
|
1936
1930
|
case "font-weight":
|
|
1937
|
-
this.updateTypography(e, t, n,
|
|
1931
|
+
this.updateTypography(e, t, n, f);
|
|
1938
1932
|
break;
|
|
1939
1933
|
case "disabled":
|
|
1940
1934
|
this.color = "state-disabled";
|
|
@@ -1943,7 +1937,7 @@ var xe = class extends t {
|
|
|
1943
1937
|
}
|
|
1944
1938
|
}
|
|
1945
1939
|
updateTypography(e, t, n, r) {
|
|
1946
|
-
t !== null && t !== "" && t !== "default" && this.$el.classList.toggle(`${e}-${t}`), n !== null && n !== "" && n !== "default" && this.$el.classList.toggle(`${e}-${n}`), this.checkName(r, n) ||
|
|
1940
|
+
t !== null && t !== "" && t !== "default" && this.$el.classList.toggle(`${e}-${t}`), n !== null && n !== "" && n !== "default" && this.$el.classList.toggle(`${e}-${n}`), this.checkName(r, n) || h(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${r.join("\", \"")}".`);
|
|
1947
1941
|
}
|
|
1948
1942
|
get color() {
|
|
1949
1943
|
return this.getAttribute("color");
|
|
@@ -1982,7 +1976,7 @@ var xe = class extends t {
|
|
|
1982
1976
|
this._updateBooleanAttribute("disabled", e);
|
|
1983
1977
|
}
|
|
1984
1978
|
};
|
|
1985
|
-
customElements.get("px-span") || customElements.define("px-span",
|
|
1979
|
+
customElements.get("px-span") || customElements.define("px-span", Se);
|
|
1986
1980
|
//#endregion
|
|
1987
1981
|
//#region src/autocomplete-option.css?inline
|
|
1988
1982
|
var Y = ":host{display:block}.container{min-height:var(--px-size-l);display:flex}.container>button{appearance:none;box-sizing:border-box;width:100%;min-height:100%;color:inherit;font:inherit;letter-spacing:0;text-align:left;cursor:pointer;padding:var(--px-padding-xs-mobile) var(--px-padding-s-mobile);background:0 0;border:0;align-items:center;margin:0;text-decoration:none;display:flex}.autocomplete-header{overflow:hidden}.autocomplete-header px-span{overflow-wrap:anywhere;min-width:0}:host([selected]) button,button:hover{background-color:var(--px-color-background-state-hover-default)}button:focus-visible{outline:var(--px-focus-outline-mobile) solid var(--px-color-border-focus-outline-default);outline-offset:calc(-1 * var(--px-focus-offset-mobile));position:relative}@media only screen and (width>=48rem){button{padding:var(--px-padding-xs-tablet) var(--px-padding-s-tablet)}button:focus-visible{outline-width:var(--px-focus-outline-tablet);outline-offset:calc(-1 * var(--px-focus-offset-tablet))}}@media only screen and (width>=64.0625rem){button{padding:var(--px-padding-xs-laptop) var(--px-padding-s-laptop)}button:focus-visible{outline-width:var(--px-focus-outline-laptop);outline-offset:calc(-1 * var(--px-focus-offset-laptop))}}@media only screen and (width>=90.0625rem){button{padding:var(--px-padding-xs-desktop) var(--px-padding-s-desktop)}button:focus-visible{outline-width:var(--px-focus-outline-desktop);outline-offset:calc(-1 * var(--px-focus-offset-desktop))}}", X = new CSSStyleSheet();
|