aloha-vue 1.0.209 → 1.0.211

package/docs/src/views/PageTable/PageTable.js

@@ -201,13 +201,30 @@ export default {
           id: "aloha_2"
         },
         {
-          label: "Aloha link",
+          label: "Aloha link to",
           title: "Aloha link Title",
           disabled: false,
           class: "a_btn a_btn_secondary",
           type: "link",
           to: "/spinner",
         },
+        {
+          label: "Aloha link href",
+          title: "Aloha link Title",
+          disabled: false,
+          class: "a_btn a_btn_secondary",
+          type: "link",
+          href: "/spinner",
+          icon: "Plus",
+        },
+        {
+          title: "Aloha link Title",
+          disabled: false,
+          class: "a_btn a_btn_secondary",
+          type: "link",
+          href: "/spinner",
+          icon: "Plus",
+        },
         {
           label: "Aloha3",
           title: "Aloha3 Title",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "aloha-vue",
   "description": "Project aloha",
-  "version": "1.0.209",
+  "version": "1.0.211",
   "author": "Ilia Brykin",
   "scripts": {
     "build-icons": "node scriptsNode/iconsSvgToJs.js bootstrap3 && node scriptsNode/iconsSvgToJs.js bootstrap-1-9-1"

package/src/ATable/ATableActionItem/ATableActionItem.js

@@ -42,52 +42,56 @@ export default {
     };
   },
   render() {
+    const CHILDREN = [
+      this.action.title && h("span", {
+        class: "a_position_absolute_all",
+        title: this.action.title,
+        ariaHidden: true,
+      }),
+      this.action.icon && h(AIcon, {
+        class: "a_table__action__icon",
+        icon: this.action.icon,
+      }),
+      this.action.label && withDirectives(h("span", {
+        class: "a_table__action__text",
+      }), [
+        [ASafeHtml, this.action.label],
+      ]),
+    ];
+
     if (this.type === "button") {
       return h("button", {
         id: this.action.id,
         class: ["a_table__action", this.action.class],
         disabled: this.action.disabled || this.disabled,
         onClick: this.callbackLocal,
-      }, [
-        this.action.title && h("span", {
-          class: "a_position_absolute_all",
-          title: this.action.title,
-          ariaHidden: true,
-        }),
-        this.action.icon && h(AIcon, {
-          class: "a_table__action__icon",
-          icon: this.action.icon,
-        }),
-        withDirectives(h("span"), [
-          [ASafeHtml, this.action.label],
-        ]),
-      ]);
+      }, CHILDREN);
     }
     if (this.type === "link") {
-      const LINK_TAG = this.action.to ?
-        resolveComponent("RouterLink") :
-        "a";
-
-      return h(LINK_TAG, {
+      if (this.action.to) {
+        return h(resolveComponent("RouterLink"), {
+          id: this.action.id,
+          class: [
+            "a_table__action",
+            this.action.class,
+            {
+              disabled: this.action.disabled,
+            },
+          ],
+          to: this.action.to,
+        }, () => CHILDREN);
+      }
+      return h("a", {
         id: this.action.id,
-        class: ["a_table__action", this.action.class],
-        to: this.action.to,
+        class: [
+          "a_table__action",
+          this.action.class,
+          {
+            disabled: this.action.disabled,
+          },
+        ],
         href: this.action.href,
-        disabled: this.action.disabled,
-      }, () => [
-        this.action.title && h("span", {
-          class: "a_position_absolute_all",
-          title: this.action.title,
-          ariaHidden: true,
-        }),
-        this.action.icon && h(AIcon, {
-          class: "a_table__action__icon",
-          icon: this.action.icon,
-        }),
-        withDirectives(h("span"), [
-          [ASafeHtml, this.action.label],
-        ]),
-      ]);
+      }, CHILDREN);
     }
     if (this.type === "dropdown") {
       return h("span", "muster dropdown");

package/src/styles/components/ATable.scss

@@ -310,8 +310,8 @@
   position: relative;
   margin-left: var(--a_table_between_actions_margin);
 }
-.a_table__action__icon {
-  margin-right: var(--a_table_between_actions_margin, .5rem);
+.a_table__action__icon + .a_table__action__text{
+  margin-left: var(--a_table_between_actions_margin, .5rem);
 }
 
 .a_table__row_action {