@piveau/dpi 0.2.0-alpha.20 → 0.2.0-alpha.22

package/dist/packages/dpi/src/data-provider-interface/HappyFlowComponents/ui/ButtonV3.vue.js

@@ -1,25 +1,26 @@
-import { PhPlus as c, PhArrowSquareOut as C, PhCopySimple as k, PhPencilSimple as b, PhArrowCounterClockwise as g, PhPlusSquare as B, PhTrash as K, PhPlusCircle as D, PhCaretLeft as w, PhCaretRight as T, PhMagnifyingGlass as V, PhCheck as $, PhX as M } from "@phosphor-icons/vue";
-import { defineComponent as U, resolveComponent as o, createElementBlock as l, openBlock as s, mergeProps as q, createCommentVNode as a, withKeys as n, normalizeStyle as v, normalizeClass as p, withModifiers as m, createElementVNode as E, createBlock as t, toDisplayString as G } from "vue";
+import { PhCircleNotch as C, PhPlus as b, PhArrowSquareOut as k, PhCopySimple as B, PhPencilSimple as V, PhArrowCounterClockwise as D, PhPlusSquare as K, PhTrash as w, PhPlusCircle as $, PhCaretLeft as T, PhCaretRight as M, PhMagnifyingGlass as U, PhCheck as q, PhX as E } from "@phosphor-icons/vue";
+import { defineComponent as G, resolveComponent as n, createElementBlock as t, openBlock as a, mergeProps as N, createCommentVNode as s, withKeys as l, normalizeStyle as m, normalizeClass as d, withModifiers as F, createElementVNode as L, createBlock as o, toDisplayString as O, createVNode as h } from "vue";
 /* empty css                                */
 /* empty css                                 */
 /* empty css              */
-import L from "../../../../../../_virtual/_plugin-vue_export-helper.js";
-const O = U({
+import R from "../../../../../../_virtual/_plugin-vue_export-helper.js";
+const I = G({
   name: "ButtonV3",
   components: {
-    PhX: M,
-    PhCheck: $,
-    PhMagnifyingGlass: V,
-    PhCaretRight: T,
-    PhCaretLeft: w,
-    PhPlusCircle: D,
-    PhTrash: K,
-    PhPlusSquare: B,
-    PhArrowCounterClockwise: g,
-    PhPencilSimple: b,
-    PhCopySimple: k,
-    PhArrowSquareOut: C,
-    PhPlus: c
+    PhX: E,
+    PhCheck: q,
+    PhMagnifyingGlass: U,
+    PhCaretRight: M,
+    PhCaretLeft: T,
+    PhPlusCircle: $,
+    PhTrash: w,
+    PhPlusSquare: K,
+    PhArrowCounterClockwise: D,
+    PhPencilSimple: V,
+    PhCopySimple: B,
+    PhArrowSquareOut: k,
+    PhPlus: b,
+    PhCircleNotch: C
   },
   props: {
     buttonText: {
@@ -44,6 +45,10 @@ const O = U({
       type: Boolean,
       default: !1
     },
+    loading: {
+      type: Boolean,
+      default: !1
+    },
     variant: {
       type: String,
       default: "primary"
@@ -77,9 +82,12 @@ const O = U({
       return [
         `dpiV3_button-base-${this.variant}`,
         `dpiV3_button-${this.size}`,
-        { "dpiV3_button-disabled": this.disabled }
+        { "dpiV3_button-disabled": this.disabled || this.loading }
       ];
     },
+    isButtonDisabled() {
+      return this.disabled || this.loading;
+    },
     iconSizeClass() {
       return [
         `dpiV3_icon-${this.size}`,
@@ -104,158 +112,182 @@ const O = U({
       this.disabled || (this.variant === "primary" ? this.isPrimaryActive = !0 : this.variant === "secondary" ? this.isSecondaryActive = !0 : this.variant === "tertiary" && (this.isTertiaryActive = !0));
     }
   }
-}), R = ["disabled"], N = ["disabled"], I = {
-  key: 0,
+}), X = ["disabled"], j = ["disabled"], H = {
+  key: 1,
   class: "dpiV3_icon"
 };
-function X(e, i, j, H, J, Q) {
-  const F = o("PhArrowCounterClockwise"), A = o("PhPlusCircle"), d = o("PhTrash"), y = o("PhMagnifyingGlass"), u = o("PhCheck"), S = o("PhCaretLeft"), h = o("PhPlusSquare"), P = o("PhCaretRight"), f = o("PhArrowSquareOut"), z = o("PhPencilSimple");
-  return s(), l("div", q({
+function J(e, i, Q, W, Y, Z) {
+  const A = n("PhArrowCounterClockwise"), S = n("PhPlusCircle"), u = n("PhTrash"), p = n("PhMagnifyingGlass"), y = n("PhCheck"), P = n("PhCaretLeft"), z = n("PhPlusSquare"), v = n("PhCircleNotch"), f = n("PhCaretRight"), c = n("PhArrowSquareOut"), g = n("PhPencilSimple");
+  return a(), t("div", N({
     class: ["dpiV3_V3-typography", e.externalClass]
   }, e.$attrs), [
-    e.buttonText ? (s(), l("button", {
+    e.buttonText ? (a(), t("button", {
       key: 0,
       tabindex: "0",
       type: "button",
-      class: p([
+      class: d([
         e.dpiV3_buttonClass,
         { activeStatePrimary: e.isPrimaryActive && e.variant === "primary" },
         { activeStateSecondary: e.isSecondaryActive && e.variant === "secondary" },
-        { activeStateTertiary: e.isTertiaryActive && e.variant === "tertiary" }
+        { activeStateTertiary: e.isTertiaryActive && e.variant === "tertiary" },
+        { "dpiV3_button-loading": e.loading }
       ]),
-      disabled: e.disabled,
-      style: v(e.focusStyle),
+      disabled: e.isButtonDisabled,
+      style: m(e.focusStyle),
       onMousedown: i[0] || (i[0] = (...r) => e.removeFocus && e.removeFocus(...r)),
       onMouseup: i[1] || (i[1] = (...r) => e.removeActiveState && e.removeActiveState(...r)),
       onFocus: i[2] || (i[2] = (r) => e.isFocused = !0),
       onBlur: i[3] || (i[3] = (r) => e.isFocused = !1),
       onKeydown: [
-        i[4] || (i[4] = n((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["enter"])),
-        i[5] || (i[5] = n(m((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["prevent"]), ["space"]))
+        i[4] || (i[4] = l((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["enter"])),
+        i[5] || (i[5] = l(F((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["prevent"]), ["space"]))
       ],
       onKeyup: [
-        i[6] || (i[6] = n((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["enter"])),
-        i[7] || (i[7] = n((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["space"]))
+        i[6] || (i[6] = l((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["enter"])),
+        i[7] || (i[7] = l((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["space"]))
       ]
     }, [
-      e.iconStart ? (s(), l("span", {
+      e.iconStart ? (a(), t("span", {
         key: 0,
-        class: p(["dpiV3_icon", e.iconSizeClass])
+        class: d(["dpiV3_icon", e.iconSizeClass])
       }, [
-        e.iconStart === "reset" ? (s(), t(F, {
+        e.iconStart === "reset" ? (a(), o(A, {
           key: 0,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "plus" ? (s(), t(A, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "plus" ? (a(), o(S, {
           key: 1,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : e.disabled ? "#aedff8" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "trash" ? (s(), t(d, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "trash" ? (a(), o(u, {
           key: 2,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "MagnifyingGlass" ? (s(), t(y, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "MagnifyingGlass" ? (a(), o(p, {
           key: 3,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "Check" ? (s(), t(u, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "Check" ? (a(), o(y, {
           key: 4,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "CaretLeft" ? (s(), t(S, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "CaretLeft" ? (a(), o(P, {
           key: 5,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "PlusSquare" ? (s(), t(h, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "PlusSquare" ? (a(), o(z, {
           key: 6,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0)
-      ], 2)) : a("", !0),
-      E("span", null, G(e.buttonText), 1),
-      e.iconEnd ? (s(), l("span", {
+        }, null, 8, ["size", "color"])) : s("", !0)
+      ], 2)) : s("", !0),
+      L("span", null, O(e.buttonText), 1),
+      e.loading ? (a(), t("span", {
         key: 1,
-        class: p(["dpiV3_icon", e.iconSizeClass])
+        class: d(["dpiV3_loading-overlay", `dpiV3_loading-overlay-${e.variant}`])
       }, [
-        e.iconEnd === "MagnifyingGlass" ? (s(), t(y, {
+        h(v, {
+          size: e.size === "small" ? "16px" : "24px",
+          color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD",
+          weight: "bold",
+          class: "dpiV3_loading-spinner"
+        }, null, 8, ["size", "color"])
+      ], 2)) : s("", !0),
+      e.iconEnd ? (a(), t("span", {
+        key: 2,
+        class: d(["dpiV3_icon", e.iconSizeClass])
+      }, [
+        e.iconEnd === "MagnifyingGlass" ? (a(), o(p, {
           key: 0,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconEnd === "Check" ? (s(), t(u, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconEnd === "Check" ? (a(), o(y, {
           key: 1,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconEnd === "CaretRight" ? (s(), t(P, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconEnd === "CaretRight" ? (a(), o(f, {
           key: 2,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconEnd === "Out" ? (s(), t(f, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconEnd === "Out" ? (a(), o(c, {
           key: 3,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#0172AD" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0)
-      ], 2)) : a("", !0)
-    ], 46, R)) : a("", !0),
-    e.buttonText ? a("", !0) : (s(), l("div", {
+        }, null, 8, ["size", "color"])) : s("", !0)
+      ], 2)) : s("", !0)
+    ], 46, X)) : s("", !0),
+    e.buttonText ? s("", !0) : (a(), t("div", {
       key: 1,
       tabindex: "0",
-      class: p(["dpiV3_button-icon-only", [
+      class: d(["dpiV3_button-icon-only", [
         e.iconSizeClass,
         { "dpiV3_button-icon-only-large": e.size === "large" },
         { activeStatePrimary: e.isPrimaryActive && e.variant === "primary" },
         { activeStateSecondary: e.isSecondaryActive && e.variant === "secondary" },
-        { activeStateTertiary: e.isTertiaryActive && e.variant === "tertiary" }
+        { activeStateTertiary: e.isTertiaryActive && e.variant === "tertiary" },
+        { "dpiV3_button-loading": e.loading }
       ]]),
-      disabled: e.disabled,
-      style: v(e.focusStyle),
+      disabled: e.isButtonDisabled,
+      style: m(e.focusStyle),
       onMousedown: i[8] || (i[8] = (...r) => e.removeFocus && e.removeFocus(...r)),
       onMouseup: i[9] || (i[9] = (...r) => e.removeActiveState && e.removeActiveState(...r)),
       onFocus: i[10] || (i[10] = (r) => e.isFocused = !0),
       onBlur: i[11] || (i[11] = (r) => e.isFocused = !1),
       onKeydown: [
-        i[12] || (i[12] = n((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["enter"])),
-        i[13] || (i[13] = n(m((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["prevent"]), ["space"]))
+        i[12] || (i[12] = l((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["enter"])),
+        i[13] || (i[13] = l(F((...r) => e.handleKeyPress && e.handleKeyPress(...r), ["prevent"]), ["space"]))
       ],
       onKeyup: [
-        i[14] || (i[14] = n((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["enter"])),
-        i[15] || (i[15] = n((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["space"]))
+        i[14] || (i[14] = l((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["enter"])),
+        i[15] || (i[15] = l((...r) => e.removeActiveStateKeyUp && e.removeActiveStateKeyUp(...r), ["space"]))
       ]
     }, [
-      e.buttonText ? a("", !0) : (s(), l("span", I, [
-        e.iconStart === "MagnifyingGlass" ? (s(), t(y, {
+      e.loading ? (a(), t("span", {
+        key: 0,
+        class: d(["dpiV3_loading-overlay", `dpiV3_loading-overlay-${e.variant}`])
+      }, [
+        h(v, {
+          size: e.size === "small" ? "16px" : "24px",
+          color: e.variant === "primary" ? "#FFFFFF" : (e.variant === "secondary", "#0172AD"),
+          weight: "bold",
+          class: "dpiV3_loading-spinner"
+        }, null, 8, ["size", "color"])
+      ], 2)) : s("", !0),
+      e.buttonText ? s("", !0) : (a(), t("span", H, [
+        e.iconStart === "MagnifyingGlass" ? (a(), o(p, {
           key: 0,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "Check" ? (s(), t(u, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "Check" ? (a(), o(y, {
           key: 1,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "primary" ? "#FFFFFF" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "pen" ? (s(), t(z, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "pen" ? (a(), o(g, {
           key: 2,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "secondary" ? "#0172AD" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0),
-        e.iconStart === "Trash" ? (s(), t(d, {
+        }, null, 8, ["size", "color"])) : s("", !0),
+        e.iconStart === "Trash" ? (a(), o(u, {
           key: 3,
           size: e.size === "small" ? "16px" : "24px",
           color: e.variant === "secondary" ? "#0172AD" : e.variant === "secondary" ? "#0B1A25" : "#0172AD"
-        }, null, 8, ["size", "color"])) : a("", !0)
+        }, null, 8, ["size", "color"])) : s("", !0)
       ]))
-    ], 46, N))
+    ], 46, j))
   ], 16);
 }
-const ie = /* @__PURE__ */ L(O, [["render", X], ["__scopeId", "data-v-25e10506"]]);
+const se = /* @__PURE__ */ R(I, [["render", J], ["__scopeId", "data-v-720acf5f"]]);
 export {
-  ie as default
+  se as default
 };

package/dist/packages/dpi/src/data-provider-interface/HappyFlowComponents/ui/ProcessSteps/HardwareForm.vue.js

@@ -1,7 +1,7 @@
 import o from "./HardwareForm.vue2.js";
 /* empty css                  */
 import r from "../../../../../../../_virtual/_plugin-vue_export-helper.js";
-const f = /* @__PURE__ */ r(o, [["__scopeId", "data-v-b946f96b"]]);
+const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-6990414c"]]);
 export {
-  f as default
+  p as default
 };