@proximus/lavender 2.0.0-alpha.103 → 2.0.0-alpha.105
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/lavender.cjs.js +1 -1
- package/dist/lavender.es.js +5 -5
- package/dist/lavender.umd.js +1 -1
- package/package.json +1 -1
package/dist/lavender.es.js
CHANGED
|
@@ -4869,7 +4869,7 @@ let ButtonIcon = _ButtonIcon;
|
|
|
4869
4869
|
if (!customElements.get("px-button-icon")) {
|
|
4870
4870
|
customElements.define("px-button-icon", ButtonIcon);
|
|
4871
4871
|
}
|
|
4872
|
-
const styles$J = ':host{--card-background-color-default: var(--px-color-background-container-light-default);--card-media-left-size-s: 120px;--card-media-left-size-m: 250px;--card-media-left-size: var(--card-media-left-size-s);display:block}:host *{box-sizing:border-box}:host picture{display:none}:host([media-position="background"]) picture{display:none!important}:host(:not([media-position="background"])) picture:has(img[src]){display:block}.card{display:block;height:100%;position:relative;text-decoration:none;color:var(--px-color-text-neutral-default);--btn-transition: all .2s ease-in-out 0s;transition:var(--btn-transition);border-radius:var(--px-radius-main);outline-color:var(--px-color-border-focus-outline-default);outline-width:var(--px-focus-outline-mobile);overflow:hidden;border:var(--px-size-border-m) solid transparent}.card .contrast-helper{display:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}:host([contrast-helper-gradient]) :is(.card .contrast-helper){display:block;background-image:linear-gradient(90deg,#fff 23.43%,#fff0 81.69%)}:host([contrast-helper-overlay]) :is(.card .contrast-helper){display:block;background-color:#ffffffb3}.card .card__content{position:relative;flex-grow:1;z-index:2}.card .card__content>px-vstack{height:100%}.card px-container{background-color:var(--card-background-color-default)}.card:focus-visible{outline-offset:var(--px-focus-offset-mobile);outline-style:solid}.card:hover{border-color:var(--px-color-border-state-hover-default)}.card:hover px-container{background-color:var(--px-color-background-state-hover-bordered-default)}px-container{height:100%}::slotted([slot="title"]){font-family:var(--px-font-family);line-height:var(--px-line-height-ratio-l);font-size:var(--px-text-size-heading-xl-mobile);font-weight:var(--px-font-weight-title);color:var(--px-color-text-brand-default)
|
|
4872
|
+
const styles$J = ':host{--card-background-color-default: var( --px-color-background-container-light-default );--card-media-left-size-s: 120px;--card-media-left-size-m: 250px;--card-media-left-size: var(--card-media-left-size-s);display:block}:host *{box-sizing:border-box}:host picture{display:none}:host([media-position="background"]) picture{display:none!important}:host(:not([media-position="background"])) picture:has(img[src]){display:block}.card{display:block;height:100%;position:relative;text-decoration:none;color:var(--px-color-text-neutral-default);--btn-transition: all .2s ease-in-out 0s;transition:var(--btn-transition);border-radius:var(--px-radius-main);outline-color:var(--px-color-border-focus-outline-default);outline-width:var(--px-focus-outline-mobile);overflow:hidden;border:var(--px-size-border-m) solid transparent}.card .contrast-helper{display:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}:host([contrast-helper-gradient]) :is(.card .contrast-helper){display:block;background-image:linear-gradient(90deg,#fff 23.43%,#fff0 81.69%)}:host([contrast-helper-overlay]) :is(.card .contrast-helper){display:block;background-color:#ffffffb3}.card .card__content{position:relative;flex-grow:1;z-index:2}.card .card__content>px-vstack{height:100%}.card px-container{background-color:var(--card-background-color-default)}.card:focus-visible{outline-offset:var(--px-focus-offset-mobile);outline-style:solid}.card:hover{border-color:var(--px-color-border-state-hover-default)}.card:hover px-container{background-color:var(--px-color-background-state-hover-bordered-default)}px-container{height:100%}::slotted([slot="title"]){font-family:var(--px-font-family);line-height:var(--px-line-height-ratio-l);font-size:var(--px-text-size-heading-xl-mobile);font-weight:var(--px-font-weight-title);color:var(--px-color-text-brand-default)}::slotted([slot="content"]){font-family:var(--px-font-family);line-height:var(--px-font-line-height-m);font-size:var(--px-text-size-body-m-mobile);font-weight:var(--px-font-weight-body);color:var(--px-color-text-neutral-default)}:host([media-left-size="s"]) img{--card-media-left-size: var(--card-media-left-size-s)}:host([media-left-size="m"]) img{--card-media-left-size: var(--card-media-left-size-m)}@media screen and (max-width: 48rem){.hidden--mobile,.shown--tablet,.shown--laptop{display:none}.hidden--tablet,.hidden--laptop,.shown--mobile{display:block}:host([media-left-size--mobile="m"]) img{--card-media-left-size: var(--card-media-left-size-m)}:host([media-left-size--mobile="s"]) img{--card-media-left-size: var(--card-media-left-size-s)}:host([media-position--mobile="background"]) picture{display:none!important}:host(:not([media-position--mobile="background"],[media-position="background"])) picture:has(source:nth-child(1)[srcset]){display:block}:host([media-position="top"]) img,:host([media-position--mobile="top"]) img{display:block;height:100%;width:100%;aspect-ratio:initial;object-fit:initial}:host([media-position="left"]:not([media-position--mobile="top"])) img,:host([media-position--mobile="left"]) img{height:100%;aspect-ratio:1 / 1;width:var(--card-media-left-size);object-fit:cover}.media-position-background:not(.media-position-top--mobile,.media-position-left--mobile,.media-position-none--mobile) px-container,.media-position-background--mobile px-container{background-color:transparent}.media-position-background:not(.media-position-top--mobile,.media-position-left--mobile,.media-position-none--mobile):hover px-container,.media-position-background--mobile:hover px-container{background-color:transparent}}@media screen and (min-width: 48rem) and (max-width: 64rem){.hidden--tablet,.shown--mobile,.shown--laptop{display:none}.hidden--mobile,.hidden--laptop,.shown--tablet{display:block}:host([media-left-size--tablet="m"]) img{--card-media-left-size: var(--card-media-left-size-m)}:host([media-left-size--tablet="s"]) img{--card-media-left-size: var(--card-media-left-size-s)}:host([media-position--tablet="background"]) picture{display:none!important}:host(:not([media-position--mobile="background"],[media-position="background"])) picture:has(source:nth-child(2)[srcset]){display:block}:host([media-position="left"]:not([media-position--tablet="top"])) img,:host([media-position--tablet="left"]) img{height:100%;aspect-ratio:1 / 1;width:var(--card-media-left-size);object-fit:cover}:host([media-position="top"]) img,:host([media-position--tablet="top"]) img{display:block;height:100%;width:100%;aspect-ratio:initial;object-fit:initial}.media-position-background:not(.media-position-top--tablet,.media-position-left--tablet,.media-position-none--tablet) px-container,.media-position-background--tablet px-container{background-color:transparent}.media-position-background:not(.media-position-top--tablet,.media-position-left--tablet,.media-position-none--tablet):hover px-container,.media-position-background--tablet:hover px-container{background-color:transparent}}@media screen and (min-width: 48rem){.card{outline-width:var(--px-focus-outline-tablet)}.card:focus-visible{outline-offset:var(--px-focus-offset-tablet)}::slotted([slot="title"]){font-size:var(--px-text-size-heading-xl-tablet)}::slotted([slot="content"]){font-size:var(--px-text-size-body-m-tablet)}}@media screen and (min-width: 64.0625rem){.hidden--laptop,.shown--mobile,.shown--tablet{display:none}.hidden--mobile,.hidden--tablet,.shown--laptop{display:block}:host([media-left-size--laptop="m"]) img{--card-media-left-size: var(--card-media-left-size-m)}:host([media-left-size--laptop="s"]) img{--card-media-left-size: var(--card-media-left-size-s)}:host([media-position--laptop="background"]) picture{display:none!important}:host(:not([media-position--mobile="background"],[media-position="background"])) picture:has(source:nth-child(3)[srcset]){display:block}:host([media-position="left"]:not([media-position--laptop="top"])) img,:host([media-position--laptop="left"]) img{height:100%;aspect-ratio:1 / 1;width:var(--card-media-left-size);object-fit:cover}:host([media-position="top"]) img,:host([media-position--laptop="top"]) img{display:block;height:100%;width:100%;aspect-ratio:initial;object-fit:initial}.card{outline-width:var(--px-focus-outline-laptop)}.card:focus-visible{outline-offset:var(--px-focus-offset-laptop)}::slotted([slot="title"]){font-size:var(--px-text-size-heading-xl-laptop)}::slotted([slot="content"]){font-size:var(--px-text-size-body-m-laptop)}img[src=null]{display:none}.media-position-background:not(.media-position-top--laptop,.media-position-left--laptop,.media-position-none--laptop) px-container,.media-position-background--laptop px-container{background-color:transparent}.media-position-background:not(.media-position-top--laptop,.media-position-left--laptop,.media-position-none--laptop):hover px-container,.media-position-background--laptop:hover px-container{background-color:transparent}}:host([inverted]){--card-background-color-inverted: var( --px-color-background-container-light-inverted )}:host([inverted]) .card{color:var(--px-color-text-neutral-inverted);outline-color:var(--px-color-border-focus-outline-inverted)}:host([contrast-helper-gradient]) :is(:host([inverted]) .card .contrast-helper){background-image:linear-gradient(90deg,#000 23.43%,#0000 81.69%)}:host([contrast-helper-overlay]) :is(:host([inverted]) .card .contrast-helper){background-color:#0006}:host([inverted]) .card px-container{background-color:var(--card-background-color-inverted)}:host([inverted]) .card:hover{border-color:var(--px-color-border-state-hover-inverted)}:host([inverted]) .card:hover px-container{background-color:var( --px-color-background-state-hover-bordered-inverted )}:host([inverted]) ::slotted([slot="title"]){color:var(--px-color-text-brand-inverted)}:host([inverted]) ::slotted([slot="content"]){color:var(--px-color-text-neutral-inverted)}@media screen and (max-width: 47.938rem){:host([inverted]) .media-position-background:not(.media-position-top--mobile,.media-position-left--mobile,.media-position-none--mobile) px-container,:host([inverted]) .media-position-background--mobile px-container{background-color:transparent}:host([inverted]) .media-position-background:not(.media-position-top--mobile,.media-position-left--mobile,.media-position-none--mobile):hover px-container,:host([inverted]) .media-position-background--mobile:hover px-container{background-color:transparent}}@media screen and (min-width: 48rem) and (max-width: 64rem){:host([inverted]) .media-position-background:not(.media-position-top--tablet,.media-position-left--tablet,.media-position-none--tablet) px-container,:host([inverted]) .media-position-background--tablet px-container{background-color:transparent}:host([inverted]) .media-position-background:not(.media-position-top--tablet,.media-position-left--tablet,.media-position-none--tablet):hover px-container,:host([inverted]) .media-position-background--tablet:hover px-container{background-color:transparent}}@media screen and (min-width: 64.0625rem){:host([inverted]) .media-position-background:not(.media-position-top--laptop,.media-position-left--laptop,.media-position-none--laptop) px-container,:host([inverted]) .media-position-background--laptop px-container{background-color:transparent}:host([inverted]) .media-position-background:not(.media-position-top--laptop,.media-position-left--laptop,.media-position-none--laptop):hover px-container,:host([inverted]) .media-position-background--laptop:hover px-container{background-color:transparent}}';
|
|
4873
4873
|
const styleSheet$E = new CSSStyleSheet();
|
|
4874
4874
|
styleSheet$E.replaceSync(styles$J);
|
|
4875
4875
|
const cardBackgroundColorValues = [
|
|
@@ -11070,7 +11070,6 @@ class HeaderItem extends WithExtraAttributes {
|
|
|
11070
11070
|
this.shadowRoot.innerHTML = this.template();
|
|
11071
11071
|
this.shadowRoot.adoptedStyleSheets = [stylesheet$7];
|
|
11072
11072
|
this.internals = (_a = this.attachInternals) == null ? void 0 : _a.call(this);
|
|
11073
|
-
this.role = "listitem";
|
|
11074
11073
|
if (this.internals) {
|
|
11075
11074
|
this.internals.role = "listitem";
|
|
11076
11075
|
}
|
|
@@ -11079,6 +11078,7 @@ class HeaderItem extends WithExtraAttributes {
|
|
|
11079
11078
|
return ["for", "href", "current"];
|
|
11080
11079
|
}
|
|
11081
11080
|
connectedCallback() {
|
|
11081
|
+
this.role = "listitem";
|
|
11082
11082
|
this.setAttribute("slot", "header-entries");
|
|
11083
11083
|
if (this.$button) {
|
|
11084
11084
|
this.setupButtonA11y();
|
|
@@ -11229,12 +11229,12 @@ class Header extends WithExtraAttributes {
|
|
|
11229
11229
|
});
|
|
11230
11230
|
this.shadowRoot.innerHTML = this.template;
|
|
11231
11231
|
this.internals = (_a = this.attachInternals) == null ? void 0 : _a.call(this);
|
|
11232
|
-
this.role = "navigation";
|
|
11233
11232
|
if (this.internals) {
|
|
11234
11233
|
this.internals.role = "navigation";
|
|
11235
11234
|
}
|
|
11236
11235
|
}
|
|
11237
11236
|
connectedCallback() {
|
|
11237
|
+
this.role = "navigation";
|
|
11238
11238
|
this.addEventListener("click", (event) => {
|
|
11239
11239
|
const targetElement = event.target.closest(
|
|
11240
11240
|
"px-header-item"
|
|
@@ -12683,7 +12683,6 @@ class MegaDropDown extends HTMLElement {
|
|
|
12683
12683
|
this.shadowRoot.innerHTML = this.template;
|
|
12684
12684
|
this.shadowRoot.adoptedStyleSheets = [stylesheet$3];
|
|
12685
12685
|
this.internals = (_a = this.attachInternals) == null ? void 0 : _a.call(this);
|
|
12686
|
-
this.role = "menu";
|
|
12687
12686
|
if (this.internals) {
|
|
12688
12687
|
this.internals.role = "menu";
|
|
12689
12688
|
}
|
|
@@ -12693,6 +12692,7 @@ class MegaDropDown extends HTMLElement {
|
|
|
12693
12692
|
}
|
|
12694
12693
|
connectedCallback() {
|
|
12695
12694
|
var _a, _b;
|
|
12695
|
+
this.role = "menu";
|
|
12696
12696
|
if (this.querySelectorAll("px-mdd-section").length === 0) {
|
|
12697
12697
|
throw new Error("HeaderPanel must contain at least one MenuSection");
|
|
12698
12698
|
}
|
|
@@ -12962,7 +12962,6 @@ class MddSectionItem extends HTMLElement {
|
|
|
12962
12962
|
this.attachShadow({ mode: "open" });
|
|
12963
12963
|
this.shadowRoot.adoptedStyleSheets = [stylesheet$1];
|
|
12964
12964
|
this.internals = (_a = this.attachInternals) == null ? void 0 : _a.call(this);
|
|
12965
|
-
this.role = "listitem";
|
|
12966
12965
|
if (this.internals) {
|
|
12967
12966
|
this.internals.role = "listitem";
|
|
12968
12967
|
}
|
|
@@ -12987,6 +12986,7 @@ class MddSectionItem extends HTMLElement {
|
|
|
12987
12986
|
}
|
|
12988
12987
|
}
|
|
12989
12988
|
connectedCallback() {
|
|
12989
|
+
this.role = "listitem";
|
|
12990
12990
|
if (this.hasAttribute("href")) {
|
|
12991
12991
|
this.updateView("href", this.href);
|
|
12992
12992
|
this.$link.href = this.href;
|