@nordhealth/components - npm Package Compare versions

Comparing version 1.0.0-alpha.27 to 1.0.0-alpha.28

custom-elements.json

@@ -117,2 +117,12 @@ {
               "kind": "field",
+              "name": "download",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "When provided together with a href property, the button will\ntrigger a file download instead of a page visit.",
+              "attribute": "download"
+            },
+            {
+              "kind": "field",
               "name": "expand",
@@ -280,2 +290,11 @@ "type": {
             {
+              "name": "download",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "When provided together with a href property, the button will\ntrigger a file download instead of a page visit.",
+              "fieldName": "download"
+            },
+            {
               "name": "expand",
@@ -282,0 +301,0 @@ "type": {

lib/Button.js

@@ -1,2 +0,2 @@
-import"./custom-element-a6d824b8.js";import"./property-03f59dce.js";export{B as default}from"./Button-8b37c282.js";
+import"./custom-element-a6d824b8.js";import"./property-03f59dce.js";export{B as default}from"./Button-8283bc7d.js";
 //# sourceMappingURL=Button.js.map

lib/index.js

@@ -1,2 +0,2 @@
-export{default as VisuallyHidden}from"./VisuallyHidden.js";export{B as Button}from"./Button-8b37c282.js";export{default as Stack}from"./Stack.js";export{default as Select}from"./Select.js";import"./custom-element-a6d824b8.js";import"./property-03f59dce.js";import"./events.js";
+export{default as VisuallyHidden}from"./VisuallyHidden.js";export{B as Button}from"./Button-8283bc7d.js";export{default as Stack}from"./Stack.js";export{default as Select}from"./Select.js";import"./custom-element-a6d824b8.js";import"./property-03f59dce.js";import"./events.js";
 //# sourceMappingURL=index.js.map

lib/Select.js

@@ -1,2 +0,2 @@
-import{r as e,_ as t,y as o,a as n,n as a}from"./custom-element-a6d824b8.js";import{e as l}from"./property-03f59dce.js";import{I as s,n as i,l as r,F as d}from"./Button-8b37c282.js";import"./VisuallyHidden.js";import{NordEvent as c}from"./events.js";const h=e`:host{display:block}*,::after,::before{box-sizing:border-box}.n-select-container{position:relative;inline-size:fit-content}:host([expand]) .n-select-container{inline-size:100%}select{-webkit-appearance:none;appearance:none;position:absolute;font-size:var(--n-font-size-m);font-family:var(--n-font-family);color:var(--n-color-text);inline-size:100%;opacity:.0001;cursor:pointer;background:0 0;border:0;block-size:var(--n-space-xl);inset-block-end:0;inset-inline-start:0;z-index:2}nord-button{--n-button-text-align:start}select:not(:disabled):hover+nord-button{--n-button-background-color:var(--n-color-button-hover);--n-button-border-color:var(--n-color-border-hover)}select:not(:disabled):hover+nord-button svg{fill:var(--n-color-icon-hover)}select:focus+nord-button{outline:1px auto Highlight;outline:1px auto -webkit-focus-ring-color}:host([disabled]) select{cursor:auto}label{display:block;padding-block-end:var(--n-space-s)}::slotted(:not([slot])){display:none}svg[slot=after]{fill:var(--n-color-icon);margin-inline-start:var(--n-space-m);margin-inline-end:calc(var(--n-space-s)/ -2);inline-size:calc(var(--n-space-l)/ 2)}::slotted([slot=before]){margin-inline-start:calc(var(--n-space-s) * -1);margin-inline-end:var(--n-space-s)}`;let p=class extends(function(e){class o extends e{constructor(){super(...arguments),this.label="",this.required=!1,this.handleFormData=e=>{var t;this.name&&e.formData.append(this.name,null!==(t=this.value)&&void 0!==t?t:"")}}connectedCallback(){var e;super.connectedCallback(),null===(e=this.form)||void 0===e||e.addEventListener("formdata",this.handleFormData)}disconnectedCallback(){var e;super.disconnectedCallback(),null===(e=this.form)||void 0===e||e.removeEventListener("formdata",this.handleFormData)}handleChange(e){const t=e.target;this.value=t.value,this.dispatchEvent(new c("change"))}}return t([l()],o.prototype,"label",void 0),t([l({type:Boolean})],o.prototype,"required",void 0),o}(s(d(a)))){constructor(){super(...arguments),this.hideLabel=!1,this.expand=!1}render(){const e=this.options,t=this.getButtonText(e);return o`<slot @slotchange="${this.handleSlotChange}"></slot>${this.renderLabel()}<div class="n-select-container"><select ${i(this.focusableRef)} id="select" ?disabled="${this.disabled}" ?required="${this.required}" name="${r(this.name)}" @change="${this.handleChange}">${this.placeholder&&o`<option value="" disabled="disabled" ?selected="${!this.value}">${this.placeholder}</option>`} ${e.map((e=>this.renderOption(e)))}</select><nord-button tabindex="-1" ?disabled="${this.disabled}" ?expand="${this.expand}" aria-hidden="true" type="button"><slot slot="before" name="before"></slot>${t} <svg slot="after" height="12" width="10" viewBox="0 0 10 12" xmlns="http://www.w3.org/2000/svg"><path d="m4.43391.234315c.31242-.3124199.81895-.3124199 1.13137 0l3.53554 3.535535c.31242.31242.31242.81895 0 1.13137s-.81896.31242-1.13137 0l-2.96985-2.96985-2.96985 2.96985c-.31242.31242-.81895.31242-1.131373 0-.312419-.31242-.312419-.81895 0-1.13137z"/><path d="m.898377 7.09857c.312423-.31242.818953-.31242 1.131373 0l2.96985 2.96983 2.96985-2.96983c.31241-.31242.81895-.31242 1.13137 0s.31242.81895 0 1.13137l-3.53554 3.53556c-.31242.3124-.81895.3124-1.13137 0l-3.535533-3.53556c-.312419-.31242-.312419-.81895 0-1.13137z"/></svg></nord-button></div>`}handleSlotChange(){this.requestUpdate()}get options(){return Array.from(this.querySelectorAll("option"))}getButtonText(e){const t=e.find((e=>e.value===this.value));return t?t.text:this.placeholder?this.placeholder:e[0]?e[0].text:""}renderLabel(){const e=o`<label for="select"><slot name="label">${this.label}</slot></label>`;return this.hideLabel?o`<nord-visually-hidden>${e}</nord-visually-hidden>`:e}renderOption(e){return o`<option value="${r(e.value)}" ?disabled="${e.disabled}" ?selected="${e.value===this.value}">${e.text}</option>`}};p.styles=[h],t([l({type:Boolean,attribute:"hide-label"})],p.prototype,"hideLabel",void 0),t([l()],p.prototype,"placeholder",void 0),t([l({reflect:!0,type:Boolean})],p.prototype,"expand",void 0),p=t([n("nord-select")],p);var u=p;export{u as default};
+import{r as e,_ as t,y as o,a as n,n as a}from"./custom-element-a6d824b8.js";import{e as l}from"./property-03f59dce.js";import{I as r,n as s,l as i,F as d}from"./Button-8283bc7d.js";import"./VisuallyHidden.js";import{NordEvent as c}from"./events.js";const h=e`:host{display:block}*,::after,::before{box-sizing:border-box}.n-select-container{position:relative;inline-size:fit-content}:host([expand]) .n-select-container{inline-size:100%}select{-webkit-appearance:none;appearance:none;position:absolute;font-size:var(--n-font-size-m);font-family:var(--n-font-family);color:var(--n-color-text);inline-size:100%;opacity:.0001;cursor:pointer;background:0 0;border:0;block-size:var(--n-space-xl);inset-block-end:0;inset-inline-start:0;z-index:2}nord-button{--n-button-text-align:start}select:not(:disabled):hover+nord-button{--n-button-background-color:var(--n-color-button-hover);--n-button-border-color:var(--n-color-border-hover)}select:not(:disabled):hover+nord-button svg{color:var(--n-color-icon-hover)}select:focus+nord-button{outline:1px auto Highlight;outline:1px auto -webkit-focus-ring-color}:host([disabled]) select{cursor:auto}label{display:block;padding-block-end:var(--n-space-s)}::slotted(:not([slot])){display:none}svg[slot=after]{color:var(--n-color-icon);margin-inline-start:var(--n-space-m);margin-inline-end:calc(var(--n-space-s)/ -2);inline-size:calc(var(--n-space-l)/ 2)}::slotted([slot=before]){margin-inline-start:calc(var(--n-space-s) * -1);margin-inline-end:var(--n-space-s)}`;let p=class extends(function(e){class o extends e{constructor(){super(...arguments),this.label="",this.required=!1,this.handleFormData=e=>{var t;this.name&&e.formData.append(this.name,null!==(t=this.value)&&void 0!==t?t:"")}}connectedCallback(){var e;super.connectedCallback(),null===(e=this.form)||void 0===e||e.addEventListener("formdata",this.handleFormData)}disconnectedCallback(){var e;super.disconnectedCallback(),null===(e=this.form)||void 0===e||e.removeEventListener("formdata",this.handleFormData)}handleChange(e){const t=e.target;this.value=t.value,this.dispatchEvent(new c("change"))}}return t([l()],o.prototype,"label",void 0),t([l({type:Boolean})],o.prototype,"required",void 0),o}(r(d(a)))){constructor(){super(...arguments),this.hideLabel=!1,this.expand=!1}render(){const e=this.options,t=this.getButtonText(e);return o`<slot @slotchange="${this.handleSlotChange}"></slot>${this.renderLabel()}<div class="n-select-container"><select ${s(this.focusableRef)} id="select" ?disabled="${this.disabled}" ?required="${this.required}" name="${i(this.name)}" @change="${this.handleChange}">${this.placeholder&&o`<option value="" disabled="disabled" ?selected="${!this.value}">${this.placeholder}</option>`} ${e.map((e=>this.renderOption(e)))}</select><nord-button tabindex="-1" ?disabled="${this.disabled}" ?expand="${this.expand}" aria-hidden="true" type="button"><slot slot="before" name="before"></slot>${t} <svg slot="after" viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M105 56a10.416 10.416 0 0 1-7.42-3.08L72.478 27.818a3.528 3.528 0 0 0-4.956 0L42.42 52.92a10.5 10.5 0 0 1-14.84-14.84l35-35a10.486 10.486 0 0 1 14.84 0l35 35A10.5 10.5 0 0 1 105 56zm-35 84a10.416 10.416 0 0 1-7.42-3.08l-35-35a10.5 10.5 0 0 1 14.84-14.84l25.102 25.102a3.528 3.528 0 0 0 4.956 0L97.58 87.08a10.5 10.5 0 1 1 14.84 14.84l-35 35A10.416 10.416 0 0 1 70 140z"></path></svg></nord-button></div>`}handleSlotChange(){this.requestUpdate()}get options(){return Array.from(this.querySelectorAll("option"))}getButtonText(e){const t=e.find((e=>e.value===this.value));return t?t.text:this.placeholder?this.placeholder:e[0]?e[0].text:""}renderLabel(){const e=o`<label for="select"><slot name="label">${this.label}</slot></label>`;return this.hideLabel?o`<nord-visually-hidden>${e}</nord-visually-hidden>`:e}renderOption(e){return o`<option value="${i(e.value)}" ?disabled="${e.disabled}" ?selected="${e.value===this.value}">${e.text}</option>`}};p.styles=[h],t([l({type:Boolean,attribute:"hide-label"})],p.prototype,"hideLabel",void 0),t([l()],p.prototype,"placeholder",void 0),t([l({reflect:!0,type:Boolean})],p.prototype,"expand",void 0),p=t([n("nord-select")],p);var u=p;export{u as default};
 //# sourceMappingURL=Select.js.map

lib/src/button/Button.d.ts

@@ -33,2 +33,7 @@ import { LitElement } from "lit";
     /**
+     * When provided together with a href property, the button will
+     * trigger a file download instead of a page visit.
+     */
+    download: boolean;
+    /**
      * Controls whether the button expands to fill the width of its container.
@@ -35,0 +40,0 @@ */

package.json

 {
   "name": "@nordhealth/components",
-  "version": "1.0.0-alpha.27",
+  "version": "1.0.0-alpha.28",
   "description": "This package includes Nord Design System web components",
@@ -34,5 +34,5 @@ "author": "Nordhealth <[e-mail]>",
     "@custom-elements-manifest/analyzer": "^0.5.5",
-    "@nordhealth/fonts": "^2.0.4",
-    "@nordhealth/themes": "^2.0.4",
-    "@nordhealth/tokens": "^1.0.4",
+    "@nordhealth/fonts": "^2.0.5",
+    "@nordhealth/themes": "^2.0.5",
+    "@nordhealth/tokens": "^1.0.5",
     "@open-wc/eslint-config": "^4.3.0",
@@ -115,3 +115,3 @@ "@open-wc/testing": "^2.5.33",
   },
-  "gitHead": "248066bc39839a537c1a8e262a9b9d121e920a00"
+  "gitHead": "02831e904869acc633ac6dddd66db8ad08bb0a78"
 }

No alert changes

Improved metrics

Total package byte prevSize

171496

increased by0.49%

Lines of code

1744

increased by1.34%

No dependency changes