@proximus/lavender-banner 1.0.0-alpha.8 → 1.0.0-beta.0

package/dist/Banner.d.ts

@@ -0,0 +1,37 @@
+import { Container } from '@proximus/lavender-container';
+import { PxElement } from '@proximus/lavender-common';
+export declare class Banner extends PxElement<HTMLDivElement> {
+    static nativeName: string;
+    private template;
+    constructor();
+    static get observedAttributes(): string[];
+    connectedCallback(): void;
+    attributeChangedCallback(attrName: string, oldValue: string, newValue: string): void;
+    createGridTemplateAreas(): void;
+    get $container(): Container;
+    get $children(): NodeListOf<Element>;
+    get backgroundColor(): string;
+    set backgroundColor(value: string);
+    get gradient(): string;
+    set gradient(value: string);
+    get backgroundImage(): string;
+    set backgroundImage(value: string);
+    get backgroundImageMobile(): string;
+    set backgroundImageMobile(value: string);
+    get backgroundImageTablet(): string;
+    set backgroundImageTablet(value: string);
+    get backgroundImageLaptop(): string;
+    set backgroundImageLaptop(value: string);
+    get backgroundSize(): string;
+    set backgroundSize(value: string);
+    get backgroundPosition(): string;
+    set backgroundPosition(value: string);
+    get gradientContrastHelper(): boolean;
+    set gradientContrastHelper(value: boolean);
+    get overlayContrastHelper(): boolean;
+    set overlayContrastHelper(value: boolean);
+    get inverted(): boolean;
+    set inverted(value: boolean);
+    get reduced(): boolean;
+    set reduced(value: boolean);
+}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './Banner';

package/dist/{index.js → index.es.js}

@@ -1,5 +1,5 @@
 import { PxElement as d, backgroundSizeValues as c, gradientValues as g, backgroundColorValues as l } from "@proximus/lavender-common";
-const b = ':host{position:relative}:host,:host>*{display:block;box-sizing:border-box}.banner{position:relative;min-height:8em}.banner[reduced]{min-height:5em}px-container{height:100%}.banner-content{display:grid;grid-template-columns:1fr;grid-template-rows:minmax(0,auto);row-gap:var(--px-spacing-s-mobile);z-index:2;position:relative}[reduced] .banner-content{grid-template-columns:min-content minmax(0,1fr);column-gap:var(--px-spacing-default-mobile)}::slotted([slot="tag"]){grid-area:tag}::slotted([slot="media"]){grid-area:media;align-self:start}::slotted([slot="title"]){grid-area:title}::slotted([slot="description"]){grid-area:description}::slotted([slot="content"]){grid-area:content}:host(:not([reduced])) ::slotted([slot="action"]){grid-area:action;margin-top:calc(var(--px-spacing-default-mobile) - var(--px-spacing-s-mobile))}.contrast-helper{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;display:none;border-radius:var(--px-radius-main)}[contrast-helper-gradient] .contrast-helper{display:block;background-image:linear-gradient(90deg,#fff 23.43%,#fff0 81.69%)}[inverted] :is([contrast-helper-gradient] .contrast-helper){background-image:linear-gradient(90deg,#000 23.43%,#0000 81.69%)}[contrast-helper-overlay] .contrast-helper{display:block;background-color:#ffffffb3}[inverted] :is([contrast-helper-overlay] .contrast-helper){background-color:#0006}@media only screen and (min-width: 768px){.banner-content{row-gap:var(--px-spacing-s-desktop)}[reduced] .banner-content{column-gap:var(--px-spacing-default-desktop)}.banner-content :host(:not([reduced])) ::slotted([slot="action"]){margin-top:calc(var(--px-spacing-default-desktop) - var(--px-spacing-s-desktop))}}@media only screen and (min-width: 1025px){.banner-content{row-gap:var(--px-spacing-s-desktop)}[reduced] .banner-content{column-gap:var(--px-spacing-default-desktop)}.banner-content :host(:not([reduced])) ::slotted([slot="action"]){margin-top:calc(var(--px-spacing-default-desktop) - var(--px-spacing-s-desktop))}}', s = new CSSStyleSheet();
+const b = ':host{position:relative}:host,:host>*{display:block;box-sizing:border-box}.banner{position:relative;min-height:8em}.banner[reduced]{min-height:5em}px-container{height:100%}.banner-content{display:grid;grid-template-columns:1fr;grid-template-rows:minmax(0,auto);row-gap:var(--px-spacing-s-mobile);z-index:2;position:relative}[reduced] .banner-content{grid-template-columns:min-content minmax(0,1fr);column-gap:var(--px-spacing-default-mobile)}::slotted([slot="tag"]){grid-area:tag}::slotted([slot="media"]){grid-area:media;align-self:start}::slotted([slot="title"]){grid-area:title}::slotted([slot="description"]){grid-area:description}::slotted([slot="content"]){grid-area:content}:host(:not([reduced])) ::slotted([slot="action"]){grid-area:action;margin-top:calc(var(--px-spacing-default-mobile) - var(--px-spacing-s-mobile))}.contrast-helper{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;display:none;border-radius:var(--px-radius-main)}[contrast-helper-gradient] .contrast-helper{display:block;background-image:linear-gradient(90deg,#fff 23.43%,#fff0 81.69%)}[inverted] :is([contrast-helper-gradient] .contrast-helper){background-image:linear-gradient(90deg,#000 23.43%,#0000 81.69%)}[contrast-helper-overlay] .contrast-helper{display:block;background-color:#ffffffb3}[inverted] :is([contrast-helper-overlay] .contrast-helper){background-color:#0006}@media only screen and (min-width: 48em){.banner-content{row-gap:var(--px-spacing-s-desktop)}[reduced] .banner-content{column-gap:var(--px-spacing-default-desktop)}.banner-content :host(:not([reduced])) ::slotted([slot="action"]){margin-top:calc(var(--px-spacing-default-desktop) - var(--px-spacing-s-desktop))}}@media only screen and (min-width: 64.0625em){.banner-content{row-gap:var(--px-spacing-s-desktop)}[reduced] .banner-content{column-gap:var(--px-spacing-default-desktop)}.banner-content :host(:not([reduced])) ::slotted([slot="action"]){margin-top:calc(var(--px-spacing-default-desktop) - var(--px-spacing-s-desktop))}}', s = new CSSStyleSheet();
 s.replaceSync(b);
 const o = class o extends d {
   constructor() {
@@ -83,19 +83,19 @@ const o = class o extends d {
     ), a = ["tag", "media", "title", "description", "content", "action"];
     let e = "";
     this.reduced ? a.forEach((r) => {
-      const i = this.shadowRoot.querySelector(
+      const n = this.shadowRoot.querySelector(
         `slot[name="${r}"]`
       );
-      if (i && i.assignedElements().length > 0) {
+      if (n && n.assignedElements().length > 0) {
         if (r === "media") return;
         e += `'media ${r}'
 `;
       }
     }) : a.forEach((r) => {
-      const i = this.shadowRoot.querySelector(
+      const n = this.shadowRoot.querySelector(
         `slot[name="${r}"]`
       );
-      i && i.assignedElements().length > 0 && (e += `'${r}'
+      n && n.assignedElements().length > 0 && (e += `'${r}'
 `);
     }), e || (e = "'content'"), t.style.gridTemplateAreas = e;
   }
@@ -179,8 +179,8 @@ const o = class o extends d {
   }
 };
 o.nativeName = "div";
-let n = o;
-customElements.define("px-banner", n);
+let i = o;
+customElements.get("px-banner") || customElements.define("px-banner", i);
 export {
-  n as Banner
+  i as Banner
 };

package/package.json

@@ -1,46 +1,22 @@
 {
   "name": "@proximus/lavender-banner",
-  "version": "1.0.0-alpha.8",
+  "version": "1.0.0-beta.0",
   "description": "",
-  "main": "dist/index.js",
-  "exports": {
-    ".": {
-      "types": "./src/index.ts",
-      "development": "./src/index.ts",
-      "default": "./dist/index.js"
-    },
-    "./src/*.css": {
-      "development": "src/*.css"
-    }
-  },
   "files": [
     "dist"
   ],
   "type": "module",
   "scripts": {
-    "build": "tsc; vite build",
-    "test": "vitest run --coverage"
+    "transform-package-json": "node ../../../scripts/tranformPackageJson.js package.json dist/far/away",
+    "clean": "rm -rf dist",
+    "build": "npm run clean && NODE_ENV=development vite build &&  tsc && npm run transform-package-json && npm run wc-manifest",
+    "test": "vitest run --coverage",
+    "wc-manifest": "cem analyze --globs \"src/*\" --config ../custom-elements-manifest.config.js  --outdir dist"
   },
   "publishConfig": {
     "access": "public"
   },
-  "lerna": {
-    "command": {
-      "publish": {
-        "assets": [
-          "CHANGELOG.md",
-          "package.json",
-          "dist/*.js",
-          "dist/*.cjs",
-          "dist/css/**/*.css",
-          "dist/js/**/*.js",
-          "dist/*.svg",
-          "dist/*.ttf",
-          "dist/glyphmap.json",
-          "dist/*.d.ts"
-        ]
-      }
-    }
-  },
-  "gitHead": "7683b6952d1da07fe58b0f4ddef292e3954ab85d"
+  "customElements": "dist/custom-elements.json",
+  "web-types": "./dist/web-types.json",
+  "main": "dist/index.es.js"
 }