@umbraco-ui/uui-card-content-node 1.4.0-rc.1 → 1.4.0

package/custom-elements.json

@@ -23,6 +23,18 @@
           "type": "boolean",
           "default": "\"false\""
         },
+        {
+          "name": "href",
+          "description": "Set an href, this will turns the name of the card into an anchor tag.",
+          "type": "string",
+          "default": "\"undefined\""
+        },
+        {
+          "name": "target",
+          "description": "Set an anchor tag target, only used when using href.",
+          "type": "string",
+          "default": "\"undefined\""
+        },
         {
           "name": "select-only",
           "description": "Enforce selection interaction and prevent all other interactions, set this when the UI is turned into Selection-Mode.",
@@ -67,6 +79,20 @@
           "type": "boolean",
           "default": "\"false\""
         },
+        {
+          "name": "href",
+          "attribute": "href",
+          "description": "Set an href, this will turns the name of the card into an anchor tag.",
+          "type": "string",
+          "default": "\"undefined\""
+        },
+        {
+          "name": "target",
+          "attribute": "target",
+          "description": "Set an anchor tag target, only used when using href.",
+          "type": "string",
+          "default": "\"undefined\""
+        },
         {
           "name": "selectOnly",
           "attribute": "select-only",
@@ -90,7 +116,7 @@
       "events": [
         {
           "name": "open",
-          "description": "fires when the card title is clicked"
+          "description": "fires when the card title is clicked."
         },
         {
           "name": "selected",

package/lib/index.js

@@ -3,6 +3,7 @@ import { demandCustomElement } from '@umbraco-ui/uui-base/lib/utils';
 import { UUICardElement } from '@umbraco-ui/uui-card/lib';
 import { css, html, nothing } from 'lit';
 import { property, state } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -15,9 +16,25 @@ var __decorateClass = (decorators, target, key, kind) => {
     __defProp(target, key, result);
   return result;
 };
+var __accessCheck = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateAdd = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateMethod = (obj, member, method) => {
+  __accessCheck(obj, member, "access private method");
+  return method;
+};
+var _renderButton, renderButton_fn, _renderLink, renderLink_fn;
 let UUICardContentNodeElement = class extends UUICardElement {
   constructor() {
     super(...arguments);
+    __privateAdd(this, _renderButton);
+    __privateAdd(this, _renderLink);
     this.name = "";
     this._iconSlotHasContent = false;
     this.fallbackIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M396.441 138.878l-83.997-83.993-7.331-7.333H105.702v416.701h298.071V146.214l-7.332-7.336zM130.74 439.217V72.591h141.613c37.201 0 19.274 88.18 19.274 88.18s86-20.901 87.104 18.534v259.912H130.74z"></path></svg>';
@@ -31,17 +48,7 @@ let UUICardContentNodeElement = class extends UUICardElement {
   }
   render() {
     return html`
-      <div
-        id="open-part"
-        tabindex=${this.disabled ? nothing : 0}
-        @click=${this.handleOpenClick}
-        @keydown=${this.handleOpenKeydown}>
-        <span id="icon">
-          <slot name="icon" @slotchange=${this._onSlotIconChange}></slot>
-          ${this._iconSlotHasContent === false ? this._renderFallbackIcon() : ""}
-        </span>
-        <span id="name"> ${this.name} </span>
-      </div>
+      ${this.href ? __privateMethod(this, _renderLink, renderLink_fn).call(this) : __privateMethod(this, _renderButton, renderButton_fn).call(this)}
       <!-- Select border must be right after #open-part -->
       <div id="select-border"></div>
 
@@ -51,6 +58,37 @@ let UUICardContentNodeElement = class extends UUICardElement {
     `;
   }
 };
+_renderButton = new WeakSet();
+renderButton_fn = function() {
+  return html`<div
+      id="open-part"
+      tabindex=${this.disabled ? nothing : 0}
+      @click=${this.handleOpenClick}
+      @keydown=${this.handleOpenKeydown}>
+      <span id="icon">
+        <slot name="icon" @slotchange=${this._onSlotIconChange}></slot>
+        ${this._iconSlotHasContent === false ? this._renderFallbackIcon() : ""}
+      </span>
+      <span id="name"> ${this.name} </span>
+    </div>`;
+};
+_renderLink = new WeakSet();
+renderLink_fn = function() {
+  return html`<a
+      id="open-part"
+      tabindex=${this.disabled ? nothing : 0}
+      href=${ifDefined(!this.disabled ? this.href : void 0)}
+      target=${ifDefined(this.target || void 0)}
+      rel=${ifDefined(
+    this.target === "_blank" ? "noopener noreferrer" : void 0
+  )}>
+      <span id="icon">
+        <slot name="icon" @slotchange=${this._onSlotIconChange}></slot>
+        ${this._iconSlotHasContent === false ? this._renderFallbackIcon() : ""}
+      </span>
+      <span id="name"> ${this.name} </span>
+    </a>`;
+};
 UUICardContentNodeElement.styles = [
   ...UUICardElement.styles,
   css`

package/lib/uui-card-content-node.element.d.ts

@@ -8,6 +8,7 @@ import { UUICardElement } from '@umbraco-ui/uui-card/lib';
  *  @slot actions - slot for the actions with support for the `<uui-action-bar>` element
  */
 export declare class UUICardContentNodeElement extends UUICardElement {
+    #private;
     static styles: import("lit").CSSResult[];
     /**
      * Node name

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umbraco-ui/uui-card-content-node",
-  "version": "1.4.0-rc.1",
+  "version": "1.4.0",
   "license": "MIT",
   "keywords": [
     "Umbraco",
@@ -30,9 +30,9 @@
     "custom-elements.json"
   ],
   "dependencies": {
-    "@umbraco-ui/uui-base": "1.4.0-rc.1",
-    "@umbraco-ui/uui-card": "1.4.0-rc.1",
-    "@umbraco-ui/uui-icon": "1.4.0-rc.1"
+    "@umbraco-ui/uui-base": "1.4.0",
+    "@umbraco-ui/uui-card": "1.4.0",
+    "@umbraco-ui/uui-icon": "1.4.0"
   },
   "scripts": {
     "build": "npm run analyze && tsc --build --force && rollup -c rollup.config.js",
@@ -43,5 +43,5 @@
     "access": "public"
   },
   "homepage": "https://uui.umbraco.com/?path=/story/uui-card-content-node",
-  "gitHead": "2ecc805ac912c25d89bc96eaf7f50b97aa85fff0"
+  "gitHead": "09437426b75b875ea93d7ab61b489d3817d81d96"
 }