@nordhealth/components - npm Package Compare versions

Comparing version 2.16.1-alpha.2 to 2.16.1-alpha.4

lib/Header.js

@@ -1,2 +0,2 @@
-import{i as e,_ as r,s as a,y as o,e as n}from"./query-assigned-elements-cf502539.js";import{S as t}from"./SlotController-d733c575.js";import{s}from"./Component-449e40fb.js";import"./EventController-d99ebeef.js";const d=e`:host{color:var(--n-color-text);--_n-header-gutter:var(--n-space-l);--_n-header-box-shadow:var(--n-box-shadow-header)}::slotted(*){margin:0!important}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}.n-header,.n-header-end{display:flex;flex-flow:row wrap;align-items:center;gap:var(--n-space-m)}.n-header{padding:var(--n-space-m) var(--n-space-l);padding-inline-start:var(--_n-header-gutter);background-color:var(--n-color-surface);border-block-end:1px solid var(--n-color-border);box-shadow:var(--_n-header-box-shadow);min-block-size:var(--n-space-xxl)}.n-header-end{margin-inline-start:auto;gap:var(--n-space-s)}`;let l=class extends a{constructor(){super(...arguments),this.endSlot=new t(this,"end")}render(){return o`<header class="n-header"><slot></slot><div class="n-header-end" ?hidden="${this.endSlot.isEmpty}"><slot name="end"></slot></div></header>`}};l.styles=[s,d],l=r([n("nord-header")],l);var i=l;export{i as default};
+import{i as e,_ as r,s as o,y as a,e as n}from"./query-assigned-elements-cf502539.js";import{S as t}from"./SlotController-d733c575.js";import{s}from"./Component-449e40fb.js";import"./EventController-d99ebeef.js";const d=e`:host{color:var(--n-color-text);--_n-header-gutter:var(--n-space-l);--_n-header-box-shadow:var(--n-box-shadow-header)}::slotted(*){margin:0!important}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}.n-header,.n-header-end{display:flex;flex-flow:row wrap;align-items:center;gap:var(--n-space-m)}.n-header{padding:var(--n-space-s) var(--n-space-l);padding-inline-start:var(--_n-header-gutter);background-color:var(--n-color-surface);border-block-end:1px solid var(--n-color-border);box-shadow:var(--_n-header-box-shadow);min-block-size:52px}.n-header-end{margin-inline-start:auto;gap:var(--n-space-s)}`;let l=class extends o{constructor(){super(...arguments),this.endSlot=new t(this,"end")}render(){return a`<header class="n-header"><slot></slot><div class="n-header-end" ?hidden="${this.endSlot.isEmpty}"><slot name="end"></slot></div></header>`}};l.styles=[s,d],l=r([n("nord-header")],l);var i=l;export{i as default};
 //# sourceMappingURL=Header.js.map

lib/NavItem.js

@@ -1,2 +0,2 @@
-import{i as e,_ as n,y as t,b as o,e as a,s as i}from"./query-assigned-elements-cf502539.js";import{e as r}from"./property-03f59dce.js";import{o as s}from"./class-map-21152cee.js";import{n as c}from"./ref-c44e9f3c.js";import{D as l}from"./DirectionController-8b298382.js";import{S as v}from"./SlotController-d733c575.js";import{c as d}from"./cond-2da54107.js";import{N as p}from"./events-5337a6d7.js";import{F as h}from"./FocusableMixin-32631bff.js";import"./directive-de55b00a.js";import"./EventController-d99ebeef.js";const m=e`:host{--_n-nav-item-box-shadow:none;all:unset;display:block;font-feature-settings:var(--n-font-features);font-family:var(--n-font-family)}*,::after,::before{box-sizing:border-box}.n-nav-item{-webkit-user-select:none;user-select:none;display:flex;align-items:center;font-family:inherit;font-size:inherit;line-height:var(--n-line-height-tight);-webkit-appearance:none;appearance:none;color:var(--n-color-text-weak);padding:var(--n-space-s);min-block-size:28px;margin-block-end:1px;border-radius:var(--n-border-radius-s);text-decoration:none;inline-size:100%;max-inline-size:100%;background:0 0;cursor:pointer;border:0;text-align:start;box-shadow:var(--_n-nav-item-box-shadow);position:relative}.n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent);outline:0;position:relative;z-index:var(--n-index-masked)}@supports selector(:focus-visible){.n-nav-item:focus{--_n-nav-item-box-shadow:none}.n-nav-item:focus-visible{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent)}}.n-nav-item:hover{background:var(--n-color-nav-hover);color:var(--n-color-text)}.n-nav-item:active{opacity:.7}.n-nav-content{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host([badge]) .n-nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-inline-size:calc(100% - calc(var(--n-space-m) + var(--n-space-m)));margin-block-end:-3px}:host([active]) .n-nav-item{--_n-nav-item-box-shadow:var(--n-box-shadow);background:var(--n-color-accent);color:var(--n-color-text-on-accent);font-weight:var(--n-font-weight-active)}:host([active]) .n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 1px var(--n-color-nav-surface),0 0 0 3px var(--n-color-accent)}:host([active]) nord-icon{color:currentColor}.n-toggle-icon{color:var(--n-color-icon);margin-inline-end:var(--n-space-s);margin-inline-start:var(--n-space-s)}.n-toggle-icon.n-rtl{transform:rotate(-180deg)}[aria-expanded=true] .n-toggle-icon{transform:rotate(90deg)}.n-nav-icon{margin-inline-end:calc(var(--n-space-s) * 1.4);flex-shrink:0}::slotted(nord-nav-group){margin-inline-start:calc(var(--n-space-m) + calc(var(--n-space-s) * 1.3))}.n-nav-badge{border-radius:var(--n-border-radius-pill);background:var(--n-color-status-warning);color:rgba(0,0,0,.8);font-weight:var(--n-font-weight);font-feature-settings:var(--n-font-features-reduced);padding:4px 6px;text-align:center;min-inline-size:20px;position:absolute;margin-block-start:-2px;margin-inline-start:calc(var(--n-space-s)/ 1.5);font-size:var(--n-font-size-xs);display:inline-block}`;let f=class extends(h(i)){constructor(){super(...arguments),this.subnavSlot=new v(this,"subnav"),this.direction=new l(this),this.active=!1,this.open=!1}get hasSubNav(){return this.subnavSlot.hasContent}connectedCallback(){super.connectedCallback(),this.querySelector("nord-nav-item[active]")&&(this.open=!0)}render(){const e=t`${this.icon?t`<nord-icon class="n-nav-icon" name="${this.icon}" size="m"></nord-icon>`:o}<div class="n-nav-content"><span class="n-nav-label"><slot></slot></span>${this.badge?t`<span class="n-nav-badge">${this.badge}</span>`:o}</div>`;let n;return n=this.subnavSlot.hasContent?this.renderToggle(e):this.href?this.renderLink(e):this.renderButton(e),t`<div role="listitem">${n}<slot name="${this.subnavSlot.slotName}" ?hidden="${!this.open}"></slot></div>`}renderLink(e){return t`<a class="n-nav-item" ${c(this.focusableRef)} aria-current="${d(this.active,"page")}" href="${this.href||""}">${e}</a>`}renderToggle(e){return t`<button class="n-nav-item" @click="${this.toggleOpen}" aria-expanded="${this.open?"true":"false"}" ${c(this.focusableRef)}>${e}<nord-icon size="xxs" class="${s({"n-toggle-icon":!0,"n-rtl":this.direction.isRTL})}" name="arrow-expand-right-small"></nord-icon></button>`}renderButton(e){return t`<button class="n-nav-item" ${c(this.focusableRef)}>${e}</button>`}toggleOpen(){this.open=!this.open,this.dispatchEvent(new p("toggle"))}};f.styles=m,n([r({type:Boolean,reflect:!0})],f.prototype,"active",void 0),n([r()],f.prototype,"icon",void 0),n([r()],f.prototype,"href",void 0),n([r()],f.prototype,"badge",void 0),n([r({type:Boolean})],f.prototype,"open",void 0),f=n([a("nord-nav-item")],f);var b=f;export{b as default};
+import{i as n,_ as e,y as o,b as t,e as a,s as r}from"./query-assigned-elements-cf502539.js";import{e as i}from"./property-03f59dce.js";import{o as s}from"./class-map-21152cee.js";import{n as c}from"./ref-c44e9f3c.js";import{D as l}from"./DirectionController-8b298382.js";import{S as v}from"./SlotController-d733c575.js";import{c as d}from"./cond-2da54107.js";import{N as p}from"./events-5337a6d7.js";import{F as h}from"./FocusableMixin-32631bff.js";import"./directive-de55b00a.js";import"./EventController-d99ebeef.js";const m=n`:host{--_n-nav-item-box-shadow:none;all:unset;display:block;font-feature-settings:var(--n-font-features);font-family:var(--n-font-family)}*,::after,::before{box-sizing:border-box}.n-nav-item{-webkit-user-select:none;user-select:none;display:flex;align-items:center;font-family:inherit;font-size:inherit;line-height:var(--n-line-height-tight);-webkit-appearance:none;appearance:none;color:var(--n-color-text-weak);padding:var(--n-space-s);min-block-size:28px;margin-block-end:1px;border-radius:var(--n-border-radius-s);text-decoration:none;inline-size:100%;max-inline-size:100%;background:0 0;cursor:pointer;border:0;text-align:start;box-shadow:var(--_n-nav-item-box-shadow);position:relative}.n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent);outline:0;position:relative;z-index:var(--n-index-masked)}@supports selector(:focus-visible){.n-nav-item:focus{--_n-nav-item-box-shadow:none}.n-nav-item:focus-visible{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent)}}.n-nav-item:hover{background:var(--n-color-nav-hover);color:var(--n-color-text)}.n-nav-item:active{opacity:.7}.n-nav-content{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host([badge]) .n-nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-inline-size:calc(100% - calc(var(--n-space-m) + var(--n-space-m)));margin-block-end:-3px}:host([open]) .n-nav-item{background:var(--n-color-nav-hover);color:var(--n-color-text)}:host([active]) .n-nav-item{--_n-nav-item-box-shadow:var(--n-box-shadow);background:var(--n-color-accent);color:var(--n-color-text-on-accent);font-weight:var(--n-font-weight-active)}:host([active]) .n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 1px var(--n-color-nav-surface),0 0 0 3px var(--n-color-accent)}:host([active]) nord-icon{color:currentColor}.n-toggle-icon{color:var(--n-color-icon);margin-inline-end:var(--n-space-s);margin-inline-start:var(--n-space-s)}.n-toggle-icon.n-rtl{transform:rotate(-180deg)}[aria-expanded=true] .n-toggle-icon{transform:rotate(90deg)}.n-nav-icon{margin-inline-end:calc(var(--n-space-s) * 1.4);flex-shrink:0}::slotted(nord-nav-group){margin-inline-start:calc(var(--n-space-m) + calc(var(--n-space-s) * 1.3))}.n-nav-badge{border-radius:var(--n-border-radius-pill);background:var(--n-color-status-warning);color:rgba(0,0,0,.8);font-weight:var(--n-font-weight);font-feature-settings:var(--n-font-features-reduced);padding:4px 6px;text-align:center;min-inline-size:20px;position:absolute;margin-block-start:-2px;margin-inline-start:calc(var(--n-space-s)/ 1.5);font-size:var(--n-font-size-xs);display:inline-block}`;let f=class extends(h(r)){constructor(){super(...arguments),this.subnavSlot=new v(this,"subnav"),this.direction=new l(this),this.active=!1,this.open=!1}get hasSubNav(){return this.subnavSlot.hasContent}connectedCallback(){super.connectedCallback(),this.querySelector("nord-nav-item[active]")&&(this.open=!0)}render(){const n=o`${this.icon?o`<nord-icon class="n-nav-icon" name="${this.icon}" size="m"></nord-icon>`:t}<div class="n-nav-content"><span class="n-nav-label"><slot></slot></span>${this.badge?o`<span class="n-nav-badge">${this.badge}</span>`:t}</div>`;let e;return e=this.subnavSlot.hasContent?this.renderToggle(n):this.href?this.renderLink(n):this.renderButton(n),o`<div role="listitem">${e}<slot name="${this.subnavSlot.slotName}" ?hidden="${!this.open}"></slot></div>`}renderLink(n){return o`<a class="n-nav-item" ${c(this.focusableRef)} aria-current="${d(this.active,"page")}" href="${this.href||""}">${n}</a>`}renderToggle(n){return o`<button class="n-nav-item" @click="${this.toggleOpen}" aria-expanded="${this.open?"true":"false"}" ${c(this.focusableRef)}>${n}<nord-icon size="xxs" class="${s({"n-toggle-icon":!0,"n-rtl":this.direction.isRTL})}" name="arrow-expand-right-small"></nord-icon></button>`}renderButton(n){return o`<button class="n-nav-item" ${c(this.focusableRef)}>${n}</button>`}toggleOpen(){this.open=!this.open,this.dispatchEvent(new p("toggle"))}};f.styles=m,e([i({type:Boolean,reflect:!0})],f.prototype,"active",void 0),e([i()],f.prototype,"icon",void 0),e([i()],f.prototype,"href",void 0),e([i()],f.prototype,"badge",void 0),e([i({type:Boolean})],f.prototype,"open",void 0),f=e([a("nord-nav-item")],f);var b=f;export{b as default};
 //# sourceMappingURL=NavItem.js.map

package.json

 {
   "name": "@nordhealth/components",
-  "version": "2.16.1-alpha.2",
+  "version": "2.16.1-alpha.4",
   "description": "This package includes Nord Design System web components",
@@ -42,6 +42,6 @@ "author": "Nordhealth <[e-mail]>",
     "@custom-elements-manifest/analyzer": "0.6.4",
-    "@nordhealth/css": "^2.4.1",
+    "@nordhealth/css": "^2.4.2-alpha.0",
     "@nordhealth/fonts": "^2.0.15",
-    "@nordhealth/themes": "^7.0.3",
-    "@nordhealth/tokens": "^6.3.0",
+    "@nordhealth/themes": "^7.0.4-alpha.0",
+    "@nordhealth/tokens": "^6.3.1-alpha.0",
     "@open-wc/eslint-config": "8.0.2",
@@ -184,3 +184,3 @@ "@open-wc/testing": "3.1.6",
   },
-  "gitHead": "83e780545becab535b193ace32cc99df3016ea8e"
+  "gitHead": "5738f4eb323516b4f971e0b94900b91cd2598a4d"
 }

No alert changes

Improved metrics

Total package byte prevSize

2518535

increased by0.01%

No dependency changes