@nordhealth/components 1.0.0-alpha.33 → 1.0.0-alpha.37

package/custom-elements.json

@@ -216,7 +216,7 @@
               "kind": "field",
               "name": "variant",
               "type": {
-                "text": "\"default\" | \"primary\" | \"dashed\" | \"plain\""
+                "text": "\"default\" | \"primary\" | \"dashed\" | \"plain\" | \"danger\""
               },
               "default": "\"default\"",
               "description": "The style variant of the button.",
@@ -238,7 +238,7 @@
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "\"s\" | \"m\""
+                "text": "\"s\" | \"m\" | \"l\""
               },
               "default": "\"m\"",
               "description": "The size of the button.\nThis affects font-size and padding.",
@@ -350,6 +350,7 @@
             {
               "kind": "field",
               "name": "form",
+              "privacy": "protected",
               "description": "Gets the form, if any, associated with the input element.",
               "inheritedFrom": {
                 "name": "InputMixin",
@@ -421,7 +422,7 @@
             {
               "name": "variant",
               "type": {
-                "text": "\"default\" | \"primary\" | \"dashed\" | \"plain\""
+                "text": "\"default\" | \"primary\" | \"dashed\" | \"plain\" | \"danger\""
               },
               "default": "\"default\"",
               "description": "The style variant of the button.",
@@ -439,7 +440,7 @@
             {
               "name": "size",
               "type": {
-                "text": "\"s\" | \"m\""
+                "text": "\"s\" | \"m\" | \"l\""
               },
               "default": "\"m\"",
               "description": "The size of the button.\nThis affects font-size and padding.",
@@ -674,184 +675,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/common/collection.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "groupBy",
-          "parameters": [
-            {
-              "name": "array",
-              "type": {
-                "text": "Array<TObject>"
-              },
-              "description": "the collection of objects to group"
-            },
-            {
-              "name": "key",
-              "type": {
-                "text": "TKey"
-              },
-              "description": "the property to group by"
-            }
-          ],
-          "description": "Groups an array objects by property value",
-          "return": {
-            "type": {
-              "text": ""
-            }
-          }
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "groupBy",
-          "declaration": {
-            "name": "groupBy",
-            "module": "src/common/collection.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/common/events.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "A base class for events which defaults to bubbling and composed",
-          "name": "NordEvent",
-          "superclass": {
-            "name": "Event",
-            "module": "src/common/events.ts"
-          },
-          "status": null,
-          "category": null
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "NordEvent",
-          "declaration": {
-            "name": "NordEvent",
-            "module": "src/common/events.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/common/focus.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "getFocusedElement",
-          "return": {
-            "type": {
-              "text": "Element | undefined"
-            }
-          },
-          "parameters": [
-            {
-              "name": "root",
-              "type": {
-                "text": "Document | ShadowRoot"
-              }
-            }
-          ],
-          "description": "Gets the currently focused element, taking shadow roots into account."
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "getFocusedElement",
-          "declaration": {
-            "name": "getFocusedElement",
-            "module": "src/common/focus.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/common/number.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "wrap",
-          "parameters": [
-            {
-              "name": "val",
-              "type": {
-                "text": "number"
-              }
-            },
-            {
-              "name": "min",
-              "type": {
-                "text": "number"
-              }
-            },
-            {
-              "name": "max",
-              "type": {
-                "text": "number"
-              }
-            }
-          ],
-          "description": "Wraps a value so that it always falls within min/max,\nwhere a value greater than max gets set to min, and vice versa"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "wrap",
-          "declaration": {
-            "name": "wrap",
-            "module": "src/common/number.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/common/ref.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "mergeRefs",
-          "return": {
-            "type": {
-              "text": "RefCallback"
-            }
-          },
-          "parameters": [
-            {
-              "name": "refs",
-              "type": {
-                "text": "Ref[]"
-              }
-            }
-          ],
-          "description": "Creates a ref callback which will assign the element to every given ref"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "mergeRefs",
-          "declaration": {
-            "name": "mergeRefs",
-            "module": "src/common/ref.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/command-menu/CommandMenu.ts",
@@ -872,6 +695,11 @@
               "name": "inputRef",
               "privacy": "private"
             },
+            {
+              "kind": "field",
+              "name": "listRef",
+              "privacy": "private"
+            },
             {
               "kind": "field",
               "name": "previousFocus",
@@ -884,7 +712,7 @@
               "kind": "field",
               "name": "dismissController",
               "privacy": "private",
-              "default": "new LightDismissController(this, () => this.close())"
+              "default": "new LightDismissController(this, {\n    isOpen: () => this.open,\n    onDismiss: () => this.close(),\n  })"
             },
             {
               "kind": "field",
@@ -899,7 +727,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Show or hide element.",
+              "description": "Show or hide the command menu.",
               "attribute": "open"
             },
             {
@@ -919,15 +747,15 @@
                 "text": "Array<ICommandMenuAction>"
               },
               "default": "[]",
-              "description": "Array of commands to be included in the menu.",
-              "attribute": "commands"
+              "description": "Array of commands to be included in the menu."
             },
             {
               "kind": "field",
               "name": "parent",
               "type": {
                 "text": "string | undefined"
-              }
+              },
+              "privacy": "private"
             },
             {
               "kind": "field",
@@ -935,6 +763,7 @@
               "type": {
                 "text": "string"
               },
+              "privacy": "private",
               "default": "\"\""
             },
             {
@@ -981,7 +810,8 @@
                   "default": "{}",
                   "type": {
                     "text": "{ parent?: string }"
-                  }
+                  },
+                  "description": "allows you to open the menu filtered to a specific parent command."
                 }
               ],
               "description": "Show the command menu programmatically."
@@ -1001,6 +831,11 @@
               "name": "focus",
               "description": "Focus the command menu's input."
             },
+            {
+              "kind": "method",
+              "name": "renderNoResults",
+              "privacy": "private"
+            },
             {
               "kind": "method",
               "name": "renderSection",
@@ -1025,6 +860,11 @@
               "name": "handleAnimationEnd",
               "privacy": "private"
             },
+            {
+              "kind": "method",
+              "name": "handleBlur",
+              "privacy": "private"
+            },
             {
               "kind": "method",
               "name": "handleInput",
@@ -1130,21 +970,21 @@
               "type": {
                 "text": "NordEvent"
               },
-              "description": "The command menu was opened."
+              "description": "The command menu was opened foo."
             },
             {
               "name": "close",
               "type": {
                 "text": "NordEvent"
               },
-              "description": "The command menu was closed."
+              "description": "The command menu was closed bar."
             },
             {
-              "name": "command",
               "type": {
                 "text": "SelectEvent"
               },
-              "description": "User selected a command from the menu."
+              "description": "User selected a command from the menu.",
+              "name": "n-select"
             }
           ],
           "attributes": [
@@ -1154,7 +994,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Show or hide element.",
+              "description": "Show or hide the command menu.",
               "fieldName": "open"
             },
             {
@@ -1165,15 +1005,6 @@
               "default": "\"Type a command or search...\"",
               "description": "Hint text to display in the search field.",
               "fieldName": "placeholder"
-            },
-            {
-              "name": "commands",
-              "type": {
-                "text": "Array<ICommandMenuAction>"
-              },
-              "default": "[]",
-              "description": "Array of commands to be included in the menu.",
-              "fieldName": "commands"
             }
           ],
           "mixins": [
@@ -1326,7 +1157,7 @@
                 "text": "ShortcutController"
               },
               "privacy": "private",
-              "default": "new ShortcutController(host, { \"$mod+k\": actions.toggleOpen })"
+              "default": "new ShortcutController(host, { \"$mod+k\": preventDefault(actions.toggleOpen) })"
             },
             {
               "kind": "field",
@@ -1453,7 +1284,8 @@
                   "name": "icon",
                   "type": {
                     "text": "{ title: string; default: string }"
-                  }
+                  },
+                  "description": "An object representing the icon to be registered, where \"title\" is the icon's name, and \"default\" is the SVG string.\nThis is intended to be used in cases where you import an icon's entire ES module and register it directly."
                 }
               ],
               "description": "Register an individual icon so it can be rendered synchronously, to avoid loading over the network."
@@ -1472,13 +1304,15 @@
                   "name": "name",
                   "type": {
                     "text": "string"
-                  }
+                  },
+                  "description": "The name of the icon to be registered."
                 },
                 {
                   "name": "icon",
                   "type": {
                     "text": "string"
-                  }
+                  },
+                  "description": "The SVG string for the icon."
                 }
               ],
               "description": "Register an individual icon so it can be rendered synchronously, to avoid loading over the network."
@@ -1551,6 +1385,7 @@
               "type": {
                 "text": "string"
               },
+              "privacy": "private",
               "default": "\"\""
             },
             {
@@ -1649,6 +1484,184 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/common/collection.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "groupBy",
+          "parameters": [
+            {
+              "name": "array",
+              "type": {
+                "text": "Array<TObject>"
+              },
+              "description": "the collection of objects to group"
+            },
+            {
+              "name": "key",
+              "type": {
+                "text": "TKey"
+              },
+              "description": "the property to group by"
+            }
+          ],
+          "description": "Groups an array objects by property value",
+          "return": {
+            "type": {
+              "text": ""
+            }
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "groupBy",
+          "declaration": {
+            "name": "groupBy",
+            "module": "src/common/collection.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/common/events.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "A base class for events which defaults to bubbling and composed",
+          "name": "NordEvent",
+          "superclass": {
+            "name": "Event",
+            "module": "src/common/events.ts"
+          },
+          "status": null,
+          "category": null
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "NordEvent",
+          "declaration": {
+            "name": "NordEvent",
+            "module": "src/common/events.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/common/focus.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "getFocusedElement",
+          "return": {
+            "type": {
+              "text": "Element | undefined"
+            }
+          },
+          "parameters": [
+            {
+              "name": "root",
+              "type": {
+                "text": "Document | ShadowRoot"
+              }
+            }
+          ],
+          "description": "Gets the currently focused element, taking shadow roots into account."
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "getFocusedElement",
+          "declaration": {
+            "name": "getFocusedElement",
+            "module": "src/common/focus.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/common/number.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "wrap",
+          "parameters": [
+            {
+              "name": "val",
+              "type": {
+                "text": "number"
+              }
+            },
+            {
+              "name": "min",
+              "type": {
+                "text": "number"
+              }
+            },
+            {
+              "name": "max",
+              "type": {
+                "text": "number"
+              }
+            }
+          ],
+          "description": "Wraps a value so that it always falls within min/max,\nwhere a value greater than max gets set to min, and vice versa"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "wrap",
+          "declaration": {
+            "name": "wrap",
+            "module": "src/common/number.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/common/ref.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "mergeRefs",
+          "return": {
+            "type": {
+              "text": "RefCallback"
+            }
+          },
+          "parameters": [
+            {
+              "name": "refs",
+              "type": {
+                "text": "Ref[]"
+              }
+            }
+          ],
+          "description": "Creates a ref callback which will assign the element to every given ref"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "mergeRefs",
+          "declaration": {
+            "name": "mergeRefs",
+            "module": "src/common/ref.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/input/Input.ts",
@@ -1872,6 +1885,7 @@
             {
               "kind": "field",
               "name": "form",
+              "privacy": "protected",
               "description": "Gets the form, if any, associated with the input element.",
               "inheritedFrom": {
                 "name": "InputMixin",
@@ -2364,6 +2378,7 @@
             {
               "kind": "field",
               "name": "form",
+              "privacy": "protected",
               "description": "Gets the form, if any, associated with the input element.",
               "inheritedFrom": {
                 "name": "InputMixin",
@@ -2912,15 +2927,15 @@
                 "text": "ShortcutController"
               },
               "privacy": "private",
-              "default": "new ShortcutController(this.host, { Escape: onDismiss })"
+              "default": "new ShortcutController(this.host, { Escape: this.handleEsc })"
             },
             {
               "kind": "field",
-              "name": "onDismiss",
+              "name": "options",
               "type": {
-                "text": "EventListener"
+                "text": "LightDismissOptions"
               },
-              "default": "onDismiss"
+              "default": "options"
             },
             {
               "kind": "method",
@@ -2932,7 +2947,12 @@
             },
             {
               "kind": "field",
-              "name": "handleFocusOut",
+              "name": "handleEsc",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "handleClickOut",
               "privacy": "private"
             }
           ]
@@ -3431,6 +3451,7 @@
             {
               "kind": "field",
               "name": "form",
+              "privacy": "protected",
               "description": "Gets the form, if any, associated with the input element."
             }
           ],

package/lib/Button.js

@@ -1,2 +1,2 @@
-import{r as t,D as o,p as n,_ as e,n as r,s as a}from"./DraftComponentMixin-4bb26f5d.js";import{e as s}from"./property-03f59dce.js";import{l as i}from"./if-defined-617ae549.js";import{n as l}from"./ref-65ef7607.js";import{I as c,F as d}from"./InputMixin-6c108de4.js";import"./directive-e9ce14b4.js";const b=t`:host{all:initial;display:inline-block}*,::after,::before{box-sizing:border-box;margin:0;padding:0}.n-button{-webkit-appearance:none;align-items:center;appearance:none;background:var(--n-button-background-color,var(--n-color-button));border-radius:var(--n-button-border-radius,var(--n-border-radius-s));border:1px var(--n-button-border-style,solid) var(--n-button-border-color,var(--n-color-border-strong));box-shadow:var(--n-button-box-shadow,var(--n-box-shadow));color:var(--n-button-color,var(--n-color-text));cursor:pointer;display:flex;gap:var(--n-button-gap,var(--n-space-s));font-family:var(--n-font-family);font-feature-settings:var(--n-font-features);font-size:var(--n-button-font-size,var(--n-font-size-m));font-weight:var(--n-button-font-weight,var(--n-font-weight));line-height:var(--n-line-height-form);margin:0;min-block-size:var(--n-button-min-height,var(--n-space-xl));padding:var(--n-button-padding-y,calc(var(--n-space-s)/ 1.6)) var(--n-button-padding-x,calc(var(--n-space-m)/ 1.2));text-align:var(--n-button-text-align,center);text-decoration:none;transition:all .1s ease;-webkit-user-select:none;user-select:none;inline-size:var(--n-button-width,fit-content)}:host([expand]){--n-button-width:100%;display:block}.n-content{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover){--n-button-background-color:var(--n-color-button-hover);--n-button-border-color:var(--n-color-border-hover)}:host([disabled]){--n-button-background-color:var(--n-color-border);--n-button-box-shadow:none;--n-button-border-color:var(--n-button-background-color);--n-button-color:var(--n-color-text-weaker);opacity:.5;pointer-events:none}.n-button:focus{--n-button-border-color:var(--n-color-primary);--n-button-border-style:solid;--n-button-box-shadow:0 0 0 1px var(--n-button-border-color);outline:0}.n-button:active{opacity:.8;transform:translateY(1px);transition:none}:host([variant=primary]){--n-button-background-color:var(--n-color-primary);--n-button-border-color:transparent;--n-button-box-shadow:none;--n-button-color:var(--n-color-text-inverse);--n-button-font-weight:var(--n-font-weight-active)}:host([variant=primary]:hover){--n-button-background-color:var(--n-color-primary-strong)}:host([variant=dashed]){--n-button-color:var(--n-color-text-weaker);--n-button-border-color:var(--n-color-border-hover);--n-button-border-style:dashed;--n-button-box-shadow:none}:host([variant=dashed]:hover){--n-button-color:var(--n-color-text)}:host([variant=plain]){--n-button-border-color:transparent;--n-button-box-shadow:none}:host([size="s"]){--n-button-font-size:var(--n-font-size-s);--n-button-min-height:var(--n-space-l);--n-button-padding-y:calc(var(--n-space-s) / 1.5);--n-button-padding-x:var(--n-space-s);--n-button-gap:calc(var(--n-space-s) / 2)}:host([size="s"]) .n-button{line-height:var(--n-line-height-tight)}::slotted(button[slot=proxy]){display:none}::slotted(svg){color:var(--n-color-icon)}:host(:hover) ::slotted(svg){color:var(--n-color-icon-hover)}`;let u=class extends(c(d(o(a)))){constructor(){super(...arguments),this._proxyButton=document.createElement("button"),this.variant="default",this.type="submit",this.size="m",this.download=!1,this.target="_self",this.expand=!1}connectedCallback(){super.connectedCallback(),this.syncProxyButton()}disconnectedCallback(){super.disconnectedCallback(),this.cleanupProxyButton()}updated(){this.syncProxyButton()}render(){const t=n`<slot name="before"></slot><div class="n-content"><slot></slot></div><slot name="after"></slot>`;return this.href?n`<a ${l(this.focusableRef)} class="n-button" target="${this.target}" ?download="${this.download}" href="${this.href}">${t}</a>`:n`<slot name="proxy"></slot><button ${l(this.focusableRef)} class="n-button" ?disabled="${this.disabled}" name="${i(this.name)}" value="${i(this.value)}" @click="${this.handleClick}">${t}</button>`}handleClick(){this._proxyButton.click()}get isFormAssociated(){return!this.href&&this.form}syncProxyButton(){const t=this._proxyButton;t.slot="proxy",t.className="n-button-proxy",t.disabled=this.disabled,t.type=this.type,this.name?t.name=this.name:t.removeAttribute("name"),this.value?t.value=this.value:t.removeAttribute("value"),this.isFormAssociated?this.appendChild(t):this.cleanupProxyButton()}cleanupProxyButton(){this._proxyButton.remove()}};u.styles=b,e([s({reflect:!0})],u.prototype,"variant",void 0),e([s({reflect:!0})],u.prototype,"type",void 0),e([s({reflect:!0})],u.prototype,"size",void 0),e([s({reflect:!0})],u.prototype,"href",void 0),e([s({type:Boolean})],u.prototype,"download",void 0),e([s({reflect:!0})],u.prototype,"target",void 0),e([s({reflect:!0,type:Boolean})],u.prototype,"expand",void 0),u=e([r("nord-button")],u);var h=u;export{h as default};
+import{r as t,D as o,p as n,_ as r,n as e,s as a}from"./DraftComponentMixin-4bb26f5d.js";import{e as s}from"./property-03f59dce.js";import{l as i}from"./directive-40a31ee2.js";import{n as l}from"./ref-857246ae.js";import{I as c,F as d}from"./InputMixin-3e737480.js";const b=t`:host{all:initial;display:inline-block}*,::after,::before{box-sizing:border-box;margin:0;padding:0}.n-button{-webkit-appearance:none;align-items:center;appearance:none;background:var(--n-button-background-color,var(--n-color-button));border-radius:var(--n-button-border-radius,var(--n-border-radius-s));border:1px var(--n-button-border-style,solid) var(--n-button-border-color,var(--n-color-border-strong));box-shadow:var(--n-button-box-shadow,var(--n-box-shadow));color:var(--n-button-color,var(--n-color-text));cursor:pointer;display:flex;gap:var(--n-button-gap,var(--n-space-s));font-family:var(--n-font-family);font-feature-settings:var(--n-font-features);font-size:var(--n-button-font-size,var(--n-font-size-m));font-weight:var(--n-button-font-weight,var(--n-font-weight));line-height:var(--n-line-height-form);margin:0;min-block-size:var(--n-button-min-height,var(--n-space-xl));padding:var(--n-button-padding-y,calc(var(--n-space-s)/ 1.6)) var(--n-button-padding-x,calc(var(--n-space-m)/ 1.2));text-align:var(--n-button-text-align,center);text-decoration:none;transition:all .1s ease;-webkit-user-select:none;user-select:none;inline-size:var(--n-button-width,fit-content)}:host([expand]){--n-button-width:100%;display:block}.n-content{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover){--n-button-background-color:var(--n-color-button-hover);--n-button-border-color:var(--n-color-border-hover)}:host([disabled]){--n-button-background-color:var(--n-color-border);--n-button-box-shadow:none;--n-button-border-color:var(--n-button-background-color);--n-button-color:var(--n-color-text-weaker);opacity:.5;pointer-events:none}.n-button:focus{--n-button-border-color:var(--n-color-primary);--n-button-border-style:solid;--n-button-box-shadow:0 0 0 1px var(--n-button-border-color);outline:0}.n-button:active{opacity:.8;transform:translateY(1px);transition:none}:host([variant=primary]){--n-button-background-color:var(--n-color-primary);--n-button-border-color:transparent;--n-button-box-shadow:none;--n-button-color:var(--n-color-text-inverse);--n-button-font-weight:var(--n-font-weight-active)}:host([variant=primary]:hover){--n-button-background-color:var(--n-color-primary-strong)}:host([variant=dashed]){--n-button-color:var(--n-color-text-weaker);--n-button-border-color:var(--n-color-border-hover);--n-button-border-style:dashed;--n-button-box-shadow:none}:host([variant=dashed]:hover){--n-button-color:var(--n-color-text)}:host([variant=plain]){--n-button-border-color:transparent;--n-button-box-shadow:none}:host([variant=danger]){--n-button-border-color:var(--n-color-status-danger);--n-button-color:var(--n-color-text-error);--n-button-font-weight:var(--n-font-weight-active)}:host([size="s"]){--n-button-font-size:var(--n-font-size-s);--n-button-min-height:var(--n-space-l);--n-button-padding-y:calc(var(--n-space-s) / 1.5);--n-button-padding-x:var(--n-space-s);--n-button-gap:calc(var(--n-space-s) / 2)}:host([size="s"]) .n-button{line-height:var(--n-line-height-tight)}:host([size="l"]){--n-button-border-radius:var(--n-border-radius);--n-button-font-size:var(--n-font-size-l);--n-button-min-height:calc(var(--n-space-xxl) - var(--n-space-l));--n-button-padding-x:calc(var(--n-space-l) / 1.3);--n-button-font-weight:var(--n-font-weight-active)}::slotted(*){color:inherit;pointer-events:none}::slotted(svg){color:var(--n-color-icon)}::slotted(button[slot=proxy]){display:none}:host(:hover) ::slotted(*){color:var(--n-color-icon-hover)}`;let u=class extends(c(d(o(a)))){constructor(){super(...arguments),this._proxyButton=document.createElement("button"),this.variant="default",this.type="submit",this.size="m",this.download=!1,this.target="_self",this.expand=!1}connectedCallback(){super.connectedCallback(),this.syncProxyButton()}disconnectedCallback(){super.disconnectedCallback(),this.cleanupProxyButton()}updated(){this.syncProxyButton()}render(){const t=n`<slot name="before"></slot><div class="n-content"><slot></slot></div><slot name="after"></slot>`;return this.href?n`<a ${l(this.focusableRef)} class="n-button" target="${this.target}" ?download="${this.download}" href="${this.href}">${t}</a>`:n`<slot name="proxy"></slot><button ${l(this.focusableRef)} class="n-button" ?disabled="${this.disabled}" name="${i(this.name)}" value="${i(this.value)}" @click="${this.handleClick}">${t}</button>`}handleClick(){this._proxyButton.click()}get isFormAssociated(){return!this.href&&this.form}syncProxyButton(){const t=this._proxyButton;t.slot="proxy",t.className="n-button-proxy",t.disabled=this.disabled,t.type=this.type,this.name?t.name=this.name:t.removeAttribute("name"),this.value?t.value=this.value:t.removeAttribute("value"),this.isFormAssociated?this.appendChild(t):this.cleanupProxyButton()}cleanupProxyButton(){this._proxyButton.remove()}};u.styles=b,r([s({reflect:!0})],u.prototype,"variant",void 0),r([s({reflect:!0})],u.prototype,"type",void 0),r([s({reflect:!0})],u.prototype,"size",void 0),r([s({reflect:!0})],u.prototype,"href",void 0),r([s({type:Boolean})],u.prototype,"download",void 0),r([s({reflect:!0})],u.prototype,"target",void 0),r([s({reflect:!0,type:Boolean})],u.prototype,"expand",void 0),u=r([e("nord-button")],u);var v=u;export{v as default};
 //# sourceMappingURL=Button.js.map