@proximus/lavender-header-minimal 1.4.9-alpha.10

package/dist/HeaderMinimal.d.ts

@@ -0,0 +1,13 @@
+import { WithExtraAttributes } from '@proximus/lavender-common';
+import type { Section } from '@proximus/lavender-section';
+export declare const styleSheet: CSSStyleSheet;
+export declare class HeaderMinimal extends WithExtraAttributes {
+    internals: ElementInternals;
+    template: () => string;
+    constructor();
+    static get observedAttributes(): string[];
+    attributeChangedCallback(attrName: string, oldValue: string, newValue: string): void;
+    get $navigationContainer(): Section;
+    get inverted(): boolean;
+    set inverted(value: boolean);
+}

package/dist/index.d.ts

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

package/dist/index.es.js

@@ -0,0 +1,59 @@
+import { WithExtraAttributes as n } from "@proximus/lavender-common";
+const r = ":host{display:block}:host *{box-sizing:border-box}", a = new CSSStyleSheet();
+a.replaceSync(r);
+class s extends n {
+  constructor() {
+    var e;
+    super(a), this.template = () => `
+    <div class="header-minimal">
+      <header>
+        <slot name="skip"></slot>
+        <px-section 
+          id="navigation-container" 
+          padding-inline="none"
+          padding-block="s"
+          background-color="surface-light"
+          border="m"
+          border-side="bottom"
+        >
+          <px-hstack gap="default" wrap="wrap" align-items="center">
+            <slot name="header-logo"></slot>
+            <px-spacer></px-spacer>
+            <slot name="user-language"></slot>
+          </px-hstack>
+        </px-section>
+      </header>
+      <slot name="main"></slot>
+    </div>
+  `, this.shadowRoot.innerHTML = this.template(), this.internals = (e = this.attachInternals) == null ? void 0 : e.call(this), this.role = "navigation", this.internals && (this.internals.role = "navigation");
+  }
+  static get observedAttributes() {
+    return [...super.observedAttributes, "inverted"];
+  }
+  attributeChangedCallback(e, t, i) {
+    if (t !== i)
+      switch (e) {
+        case "inverted":
+          this.inverted ? this.$navigationContainer.backgroundColor = "surface-dark" : this.$navigationContainer.backgroundColor = "surface-light";
+          break;
+        default:
+          super.attributeChangedCallback(e, t, i);
+          break;
+      }
+  }
+  get $navigationContainer() {
+    var e;
+    return (e = this.shadowRoot) == null ? void 0 : e.querySelector("#navigation-container");
+  }
+  get inverted() {
+    return this.hasAttribute("inverted");
+  }
+  set inverted(e) {
+    e ? this.setAttribute("inverted", "") : this.removeAttribute("inverted");
+  }
+}
+customElements.get("px-header-minimal") || customElements.define("px-header-minimal", s);
+export {
+  s as HeaderMinimal,
+  a as styleSheet
+};

package/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@proximus/lavender-header-minimal",
+  "version": "1.4.9-alpha.10",
+  "description": "",
+  "main": "dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "type": "module",
+  "scripts": {
+    "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"
+  },
+  "customElements": "dist/custom-elements.json",
+  "web-types": "./dist/web-types.json"
+}