@solid-design-system/components 7.0.0-next.6 → 7.0.0-next.7

package/cdn/chunks/chunk.NB6QF25Q.js

@@ -0,0 +1,2 @@
+import{a as l}from"./chunk.MHWW3RZB.js";import{a as n,b as a,d,h as r}from"./chunk.4SDWX3GC.js";import{b as o,e as s}from"./chunk.OBAEIKIV.js";import{e as t}from"./chunk.6EV4YU6C.js";var e=class extends r{constructor(){super(...arguments);this.fixed=!1;this.shadow=!1}connectedCallback(){super.connectedCallback(),this.updateCalculatedHeight=this.updateCalculatedHeight.bind(this),this.addResizeObserver=this.addResizeObserver.bind(this),window.addEventListener("resize",this.updateCalculatedHeight)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this.updateCalculatedHeight)}firstUpdated(){this.updateCalculatedHeight(),this.addResizeObserver()}updated(i){super.updated(i),i.has("fixed")&&this.updateCalculatedHeight()}addResizeObserver(){this.resizeObserver=new ResizeObserver(this.updateCalculatedHeight),this.header&&this.resizeObserver.observe(this.header)}updateCalculatedHeight(){let i=parseFloat(getComputedStyle(document.documentElement).fontSize),h=window.innerHeight/i;this.header&&this.fixed&&h>=32?document.documentElement.style.setProperty("--sd-header-calculated-height",`${this.header.clientHeight}px`):document.documentElement.style.removeProperty("--sd-header-calculated-height")}render(){return s`<header class="w-full sd-header-color-background sd-header-padding-bottom relative" role="banner"><div part="main" class="relative mx-auto my-0 box-border"><slot></slot></div></header>`}};e.styles=[...r.styles,o`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{position:relative;z-index:var(--sd-z-index-header,600);display:block}@media (min-height:32rem){:host([fixed]){padding-bottom:var(--sd-header-calculated-height)!important}:host([fixed]) header{position:fixed;top:0;left:0;width:100%}}:host([shadow]) header::after{position:absolute;top:100%;right:0;left:0;height:var(--sd-header__shadow-height,var(--sd-spacing-1));--tw-gradient-position:to bottom in oklab;background-image:linear-gradient(var(--tw-gradient-stops));--tw-gradient-from:color-mix(in oklab, var(--color-black, #000) 40%, transparent);--tw-gradient-to:color-mix(in oklab, var(--color-black, #000) var(--sd-opacity-0), transparent);--tw-gradient-stops:var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));--tw-content:'';content:var(--tw-content)}[part=main]{width:var(--sd-header-inner-width);max-width:var(--sd-header-inner-max-width);padding:var(--sd-header-padding,12px 16px)}:host([shadow]) header::before{position:absolute;bottom:0;left:0;display:block;width:100%;--tw-content:'';content:var(--tw-content);background-color:rgb(var(--sd-header__underline-color-background));height:var(--sd-header__underline-height,var(--sd-spacing-2))}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`],t([a({reflect:!0,type:Boolean})],e.prototype,"fixed",2),t([a({reflect:!0,type:Boolean})],e.prototype,"shadow",2),t([d("header")],e.prototype,"header",2),t([l(100)],e.prototype,"updateCalculatedHeight",1),e=t([n("sd-header")],e);export{e as a};

package/cdn/components/header/header.d.ts

@@ -2,6 +2,7 @@ import SolidElement from '../../internal/solid-element';
 import type { PropertyValues } from 'lit';
 export default class SdHeader extends SolidElement {
     fixed: boolean;
+    shadow: boolean;
     header: HTMLElement;
     private resizeObserver?;
     connectedCallback(): void;

package/cdn/components/header/header.js

@@ -1 +1 @@
-import{a}from"../../chunks/chunk.YQHNJLIR.js";import"../../chunks/chunk.MHWW3RZB.js";import"../../chunks/chunk.4SDWX3GC.js";import"../../chunks/chunk.OBAEIKIV.js";import"../../chunks/chunk.W4QBFD6E.js";import"../../chunks/chunk.6EV4YU6C.js";export{a as default};
+import{a}from"../../chunks/chunk.NB6QF25Q.js";import"../../chunks/chunk.MHWW3RZB.js";import"../../chunks/chunk.4SDWX3GC.js";import"../../chunks/chunk.OBAEIKIV.js";import"../../chunks/chunk.W4QBFD6E.js";import"../../chunks/chunk.6EV4YU6C.js";export{a as default};

package/cdn/custom-elements.json

@@ -9338,7 +9338,7 @@
               "name": "--sd-header__underline-height"
             },
             {
-              "description": "height of the shadow when the header is fixed",
+              "description": "height of the shadow",
               "name": "--sd-header__shadow-height"
             }
           ],
@@ -9362,10 +9362,21 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Determines whether the header is fixed or not. If the header is fixed at the top of the page, a shadow is shown underneath.",
+              "description": "Determines whether the header is fixed or not. If the header is fixed, it stays at the top of the page while scrolling.",
               "attribute": "fixed",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "shadow",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Determines whether a drop shadow is shown underneath the header.",
+              "attribute": "shadow",
+              "reflects": true
+            },
             {
               "kind": "field",
               "name": "dir",
@@ -9452,9 +9463,18 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Determines whether the header is fixed or not. If the header is fixed at the top of the page, a shadow is shown underneath.",
+              "description": "Determines whether the header is fixed or not. If the header is fixed, it stays at the top of the page while scrolling.",
               "fieldName": "fixed"
             },
+            {
+              "name": "shadow",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Determines whether a drop shadow is shown underneath the header.",
+              "fieldName": "shadow"
+            },
             {
               "name": "dir",
               "type": {
@@ -23534,7 +23554,7 @@
   "package": {
     "name": "@solid-design-system/components",
     "description": "Solid Design System: Components",
-    "version": "7.0.0-next.6",
+    "version": "7.0.0-next.7",
     "author": "Union Investment",
     "homepage": "https://solid-design-system.fe.union-investment.de/docs/",
     "license": "MIT"