@everchron/ec-shards 14.4.0 → 14.4.2

package/dist/ec-shards.js

@@ -7033,9 +7033,9 @@ const I_ = /* @__PURE__ */ b(cd, [["render", dd], ["__scopeId", "data-v-08aaa823
       type: Boolean,
       default: !1
     },
-    /** Turns the card into a skeleton loader. Used when the card content is not yet available. */
+    /** Turns the card into a skeleton loader. Can be a boolean or string. If a string is provided and not empty, loading will be true. If the string is `ai`, skeleton loaders will have the ai prop set to true. */
     loading: {
-      type: Boolean,
+      type: [Boolean, String],
       default: !1
     },
     /** Adds a spinning animation to the `icon`. Note, this prop should only be used when the icon itself is set to `loading`. */
@@ -7079,6 +7079,14 @@ const I_ = /* @__PURE__ */ b(cd, [["render", dd], ["__scopeId", "data-v-08aaa823
       expandId: ""
     };
   },
+  computed: {
+    isLoading() {
+      return typeof this.loading == "string" ? !!this.loading : this.loading;
+    },
+    isAiLoading() {
+      return this.loading === "ai";
+    }
+  },
   methods: {
     skeletonWidth: function(e, s) {
       return Math.floor(Math.random() * (s - e + 1) + e);
@@ -7102,10 +7110,10 @@ function bd(e, s, t, a, n, i) {
       t.active ? "active" : "",
       t.shadow ? "shadow" : "",
       n.isExpanded ? "expanded" : "",
-      t.loading ? "loading" : ""
+      i.isLoading ? "loading" : ""
     ]]),
     role: "listitem",
-    "aria-busy": t.loading || null,
+    "aria-busy": i.isLoading || null,
     tabindex: t.hover ? "0" : "-1"
   }, [
     t.control && e.$slots.control ? (o(), r("div", gd, [
@@ -7118,12 +7126,13 @@ function bd(e, s, t, a, n, i) {
       spinning: t.spinning,
       size: "24"
     }, null, 8, ["type", "color", "spinning"])) : u("", !0),
-    t.icon && t.loading ? (o(), h(c, {
+    t.icon && i.isLoading ? (o(), h(c, {
       key: 2,
       type: "rect",
       width: 24,
-      height: 24
-    })) : u("", !0),
+      height: 24,
+      ai: i.isAiLoading
+    }, null, 8, ["ai"])) : u("", !0),
     f("div", md, [
       f("div", hd, [
         t.expandable && t.expandPosition === "left" ? (o(), h(d, {
@@ -7140,11 +7149,12 @@ function bd(e, s, t, a, n, i) {
           class: "expand-button-left"
         }, null, 8, ["aria-controls", "aria-expanded", "icon", "active", "aria-label"])) : u("", !0),
         p(e.$slots, "default", {}, void 0, !0),
-        t.loading ? (o(), h(c, {
+        i.isLoading ? (o(), h(c, {
           key: 1,
           type: "single",
-          width: i.skeletonWidth(30, 70)
-        }, null, 8, ["width"])) : u("", !0),
+          width: i.skeletonWidth(30, 70),
+          ai: i.isAiLoading
+        }, null, 8, ["width", "ai"])) : u("", !0),
         e.$slots.actions ? (o(), r("div", {
           key: 2,
           class: v(["ecs-data-card-actions", t.actionsOnHover ? "on-hover" : ""])
@@ -7167,11 +7177,12 @@ function bd(e, s, t, a, n, i) {
       ]),
       e.$slots.meta ? (o(), r("div", pd, [
         p(e.$slots, "meta", {}, void 0, !0),
-        t.loading ? (o(), h(c, {
+        i.isLoading ? (o(), h(c, {
           key: 0,
           type: "single",
-          width: i.skeletonWidth(15, 30)
-        }, null, 8, ["width"])) : u("", !0)
+          width: i.skeletonWidth(15, 30),
+          ai: i.isAiLoading
+        }, null, 8, ["width", "ai"])) : u("", !0)
       ])) : u("", !0),
       e.$slots.expand ? qe((o(), r("div", {
         key: 1,
@@ -7193,7 +7204,7 @@ function bd(e, s, t, a, n, i) {
     })) : u("", !0)
   ], 10, fd);
 }
-const E_ = /* @__PURE__ */ b(ud, [["render", bd], ["__scopeId", "data-v-ba0c6801"]]), _d = {
+const E_ = /* @__PURE__ */ b(ud, [["render", bd], ["__scopeId", "data-v-0b29bd50"]]), _d = {
   name: "ecs-data-card-list"
 }, kd = {
   class: "ecs-data-card-list",
@@ -10260,7 +10271,7 @@ const Jf = /* @__PURE__ */ b(Kf, [["render", Xf], ["__scopeId", "data-v-c1516cc2
     /** Indicator that shows the position of the sticker on the page. If not passed, no page position indicator will be shown. */
     pagePosition: {
       type: String,
-      validator: (e) => ["top-left", "top-right", "bottom-left", "bottom-right", "center-left", "center-right", "center-top", "center-bottom", null].includes(e),
+      validator: (e) => ["top-left", "top-right", "bottom-left", "bottom-right", "center-top", "center-bottom", null].includes(e),
       default: null
     }
   },
@@ -10323,12 +10334,6 @@ const Jf = /* @__PURE__ */ b(Kf, [["render", Xf], ["__scopeId", "data-v-c1516cc2
         case "bottom-right":
           e.bottom = "2px", e.right = "2px";
           break;
-        case "center-left":
-          e.left = "2px", e.top = "50%", e.transform = "translateY(-50%)";
-          break;
-        case "center-right":
-          e.right = "2px", e.top = "50%", e.transform = "translateY(-50%)";
-          break;
         case "center-top":
           e.top = "2px", e.left = "50%", e.transform = "translateX(-50%)";
           break;
@@ -10525,14 +10530,11 @@ function wg(e, s, t, a, n, i) {
     t.readOnly ? u("", !0) : (o(), h(c, {
       key: 0,
       direction: "column",
-      gap: 12,
+      gap: 4,
       align: "start"
     }, {
       default: S(() => [
-        _(l, {
-          preset: "label-1",
-          weight: "medium"
-        }, {
+        _(l, { preset: "label-1" }, {
           default: S(() => s[10] || (s[10] = [
             L("Sticker shape")
           ])),
@@ -10606,8 +10608,7 @@ function wg(e, s, t, a, n, i) {
     f("div", cg, [
       t.readOnly ? u("", !0) : (o(), h(l, {
         key: 0,
-        preset: "label-1",
-        weight: "medium"
+        preset: "label-1"
       }, {
         default: S(() => s[11] || (s[11] = [
           L("Change content and formatting")
@@ -10897,7 +10898,7 @@ function wg(e, s, t, a, n, i) {
     ])
   ]);
 }
-const K_ = /* @__PURE__ */ b(ig, [["render", wg], ["__scopeId", "data-v-531bd9a3"]]), Y_ = {
+const K_ = /* @__PURE__ */ b(ig, [["render", wg], ["__scopeId", "data-v-7578d00d"]]), Y_ = {
   __name: "fill-icon",
   props: {
     /** The identifier of the icon which should show up. */