@startinblox/components-ds4go 2.1.0 → 2.1.1

package/dist/index.js

@@ -249,7 +249,7 @@ let R = class extends HTMLElement {
 R.elementStyles = [], R.shadowRootOptions = { mode: "open" }, R[L("elementProperties")] = /* @__PURE__ */ new Map(), R[L("finalized")] = /* @__PURE__ */ new Map(), ct?.({ ReactiveElement: R }), (te.reactiveElementVersions ??= []).push("2.1.2");
 const ye = globalThis, Ce = (t) => t, Z = ye.trustedTypes, Ee = Z ? Z.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, qe = "$lit$", w = `lit$${Math.random().toFixed(9).slice(2)}$`, ze = "?" + w, dt = `<${ze}>`, P = document, F = () => P.createComment(""), B = (t) => t === null || typeof t != "object" && typeof t != "function", ve = Array.isArray, ht = (t) => ve(t) || typeof t?.[Symbol.iterator] == "function", oe = `[ 	
 \f\r]`, M = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, Pe = /-->/g, je = />/g, S = RegExp(`>|${oe}(?:([^\\s"'>=/]+)(${oe}*=${oe}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), Re = /'/g, Oe = /"/g, Ie = /^(?:script|style|textarea|title)$/i, ut = (t) => (e, ...s) => ({ _$litType$: t, strings: e, values: s }), p = ut(1), T = /* @__PURE__ */ Symbol.for("lit-noChange"), c = /* @__PURE__ */ Symbol.for("lit-nothing"), ke = /* @__PURE__ */ new WeakMap(), E = P.createTreeWalker(P, 129);
+\f\r"'\`<>=]|("|')|))|$)`, "g"), Re = /'/g, Oe = /"/g, Ie = /^(?:script|style|textarea|title)$/i, ut = (t) => (e, ...s) => ({ _$litType$: t, strings: e, values: s }), p = ut(1), k = /* @__PURE__ */ Symbol.for("lit-noChange"), c = /* @__PURE__ */ Symbol.for("lit-nothing"), Te = /* @__PURE__ */ new WeakMap(), E = P.createTreeWalker(P, 129);
 function Ve(t, e) {
   if (!ve(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
   return Ee !== void 0 ? Ee.createHTML(e) : e;
@@ -259,8 +259,8 @@ const ft = (t, e) => {
   let i, o = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = M;
   for (let a = 0; a < s; a++) {
     const l = t[a];
-    let d, u, h = -1, $ = 0;
-    for (; $ < l.length && (n.lastIndex = $, u = n.exec(l), u !== null); ) $ = n.lastIndex, n === M ? u[1] === "!--" ? n = Pe : u[1] !== void 0 ? n = je : u[2] !== void 0 ? (Ie.test(u[2]) && (i = RegExp("</" + u[2], "g")), n = S) : u[3] !== void 0 && (n = S) : n === S ? u[0] === ">" ? (n = i ?? M, h = -1) : u[1] === void 0 ? h = -2 : (h = n.lastIndex - u[2].length, d = u[1], n = u[3] === void 0 ? S : u[3] === '"' ? Oe : Re) : n === Oe || n === Re ? n = S : n === Pe || n === je ? n = M : (n = S, i = void 0);
+    let d, f, h = -1, $ = 0;
+    for (; $ < l.length && (n.lastIndex = $, f = n.exec(l), f !== null); ) $ = n.lastIndex, n === M ? f[1] === "!--" ? n = Pe : f[1] !== void 0 ? n = je : f[2] !== void 0 ? (Ie.test(f[2]) && (i = RegExp("</" + f[2], "g")), n = S) : f[3] !== void 0 && (n = S) : n === S ? f[0] === ">" ? (n = i ?? M, h = -1) : f[1] === void 0 ? h = -2 : (h = n.lastIndex - f[2].length, d = f[1], n = f[3] === void 0 ? S : f[3] === '"' ? Oe : Re) : n === Oe || n === Re ? n = S : n === Pe || n === je ? n = M : (n = S, i = void 0);
     const _ = n === S && t[a + 1].startsWith("/>") ? " " : "";
     o += n === M ? l + dt : h >= 0 ? (r.push(d), l.slice(0, h) + qe + l.slice(h) + w + _) : l + w + (h === -2 ? a : _);
   }
@@ -271,7 +271,7 @@ class H {
     let i;
     this.parts = [];
     let o = 0, n = 0;
-    const a = e.length - 1, l = this.parts, [d, u] = ft(e, s);
+    const a = e.length - 1, l = this.parts, [d, f] = ft(e, s);
     if (this.el = H.createElement(d, r), E.currentNode = this.el.content, s === 2 || s === 3) {
       const h = this.el.content.firstChild;
       h.replaceWith(...h.childNodes);
@@ -279,7 +279,7 @@ class H {
     for (; (i = E.nextNode()) !== null && l.length < a; ) {
       if (i.nodeType === 1) {
         if (i.hasAttributes()) for (const h of i.getAttributeNames()) if (h.endsWith(qe)) {
-          const $ = u[n++], _ = i.getAttribute(h).split(w), V = /([.?@])?(.*)/.exec($);
+          const $ = f[n++], _ = i.getAttribute(h).split(w), V = /([.?@])?(.*)/.exec($);
           l.push({ type: 1, index: o, name: V[2], strings: _, ctor: V[1] === "." ? mt : V[1] === "?" ? gt : V[1] === "@" ? yt : ie }), i.removeAttribute(h);
         } else h.startsWith(w) && (l.push({ type: 6, index: o }), i.removeAttribute(h));
         if (Ie.test(i.tagName)) {
@@ -304,7 +304,7 @@ class H {
   }
 }
 function D(t, e, s = t, r) {
-  if (e === T) return e;
+  if (e === k) return e;
   let i = r !== void 0 ? s._$Co?.[r] : s._$Cl;
   const o = B(e) ? void 0 : e._$litDirective$;
   return i?.constructor !== o && (i?._$AO?.(!1), o === void 0 ? i = void 0 : (i = new o(t), i._$AT(t, s, r)), r !== void 0 ? (s._$Co ??= [])[r] = i : s._$Cl = i), i !== void 0 && (e = D(t, i._$AS(t, e.values), i, r)), e;
@@ -356,7 +356,7 @@ class z {
     return this._$AB;
   }
   _$AI(e, s = this) {
-    e = D(this, e, s), B(e) ? e === c || e == null || e === "" ? (this._$AH !== c && this._$AR(), this._$AH = c) : e !== this._$AH && e !== T && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : ht(e) ? this.k(e) : this._(e);
+    e = D(this, e, s), B(e) ? e === c || e == null || e === "" ? (this._$AH !== c && this._$AR(), this._$AH = c) : e !== this._$AH && e !== k && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : ht(e) ? this.k(e) : this._(e);
   }
   O(e) {
     return this._$AA.parentNode.insertBefore(e, this._$AB);
@@ -376,8 +376,8 @@ class z {
     }
   }
   _$AC(e) {
-    let s = ke.get(e.strings);
-    return s === void 0 && ke.set(e.strings, s = new H(e)), s;
+    let s = Te.get(e.strings);
+    return s === void 0 && Te.set(e.strings, s = new H(e)), s;
   }
   k(e) {
     ve(this._$AH) || (this._$AH = [], this._$AR());
@@ -409,11 +409,11 @@ class ie {
   _$AI(e, s = this, r, i) {
     const o = this.strings;
     let n = !1;
-    if (o === void 0) e = D(this, e, s, 0), n = !B(e) || e !== this._$AH && e !== T, n && (this._$AH = e);
+    if (o === void 0) e = D(this, e, s, 0), n = !B(e) || e !== this._$AH && e !== k, n && (this._$AH = e);
     else {
       const a = e;
       let l, d;
-      for (e = o[0], l = 0; l < o.length - 1; l++) d = D(this, a[r + l], s, l), d === T && (d = this._$AH[l]), n ||= !B(d) || d !== this._$AH[l], d === c ? e = c : e !== c && (e += (d ?? "") + o[l + 1]), this._$AH[l] = d;
+      for (e = o[0], l = 0; l < o.length - 1; l++) d = D(this, a[r + l], s, l), d === k && (d = this._$AH[l]), n ||= !B(d) || d !== this._$AH[l], d === c ? e = c : e !== c && (e += (d ?? "") + o[l + 1]), this._$AH[l] = d;
     }
     n && !i && this.j(e);
   }
@@ -442,7 +442,7 @@ class yt extends ie {
     super(e, s, r, i, o), this.type = 5;
   }
   _$AI(e, s = this) {
-    if ((e = D(this, e, s, 0) ?? c) === T) return;
+    if ((e = D(this, e, s, 0) ?? c) === k) return;
     const r = this._$AH, i = e === c && r !== c || e.capture !== r.capture || e.once !== r.once || e.passive !== r.passive, o = e !== c && (r === c || i);
     i && this.element.removeEventListener(this.name, this, r), o && this.element.addEventListener(this.name, this, e), this._$AH = e;
   }
@@ -473,7 +473,7 @@ const bt = (t, e, s) => {
   return i._$AI(t), i;
 };
 const $e = globalThis;
-let k = class extends R {
+let T = class extends R {
   constructor() {
     super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
   }
@@ -492,14 +492,14 @@ let k = class extends R {
     super.disconnectedCallback(), this._$Do?.setConnected(!1);
   }
   render() {
-    return T;
+    return k;
   }
 };
-k._$litElement$ = !0, k.finalized = !0, $e.litElementHydrateSupport?.({ LitElement: k });
+T._$litElement$ = !0, T.finalized = !0, $e.litElementHydrateSupport?.({ LitElement: T });
 const _t = $e.litElementPolyfillSupport;
-_t?.({ LitElement: k });
+_t?.({ LitElement: T });
 ($e.litElementVersions ??= []).push("4.2.2");
-class wt extends k {
+class wt extends T {
   constructor() {
     super(...arguments), this.object = {
       "@id": ""
@@ -549,7 +549,7 @@ var St = Object.defineProperty, Ct = (t, e, s, r) => {
     (n = t[o]) && (i = n(e, s, i) || i);
   return i && St(e, s, i), i;
 };
-class be extends k {
+class be extends T {
   constructor() {
     super(...arguments), this.objects = [], this.hasType = (e, s = this.objects) => new Set(s.flatMap((i) => i["@type"])).has(e);
   }
@@ -738,7 +738,7 @@ const jt = ({
       document.removeEventListener(r[0], r[1]);
   }, t._subscribe();
 };
-function Te(t) {
+function ke(t) {
   return !Number.isNaN(new Date(t).getTime());
 }
 const le = (t, e, s) => {
@@ -751,14 +751,14 @@ const le = (t, e, s) => {
       i = i[o];
     else
       return !1;
-  if (Te(i)) {
+  if (ke(i)) {
     if (new Date(i) > s)
       return !0;
   } else
     return !1;
   return Array.isArray(t) ? t.some(
     (o) => le(o, e, s)
-  ) : typeof t == "object" ? Object.entries(t).some(([o, n]) => o === e && Te(n) ? !1 : le(n, e, s)) : !1;
+  ) : typeof t == "object" ? Object.entries(t).some(([o, n]) => o === e && ke(n) ? !1 : le(n, e, s)) : !1;
 }, Rt = (t, e, s) => {
   if (!e || !s || typeof s != "string")
     return t;
@@ -779,7 +779,7 @@ const le = (t, e, s) => {
     (a) => typeof a == "object" && a !== null && "@id" in a && a["@id"] === s
   ) : !1 : !1;
 });
-function kt(t) {
+function Tt(t) {
   return typeof t != "string" && typeof t != "number" && !(t instanceof Date) ? !1 : !Number.isNaN(new Date(t).getTime());
 }
 const ce = (t, e, s, r) => {
@@ -795,7 +795,7 @@ const ce = (t, e, s, r) => {
   if (typeof o == "number") {
     if (typeof s == "number" && typeof r == "number" && s <= o && o <= r)
       return !0;
-  } else if (kt(o)) {
+  } else if (Tt(o)) {
     const n = new Date(o);
     if (s instanceof Date && r instanceof Date && s <= n && n <= r)
       return !0;
@@ -806,7 +806,7 @@ const ce = (t, e, s, r) => {
   ) : typeof t == "object" ? Object.entries(t).some(
     ([n, a]) => ce(a, e, s, r)
   ) : !1;
-}, Tt = (t, e, s) => {
+}, kt = (t, e, s) => {
   if (!e || !s || typeof s != "string")
     return t;
   const [r, i] = s.split("/").map(Number);
@@ -852,9 +852,9 @@ const ce = (t, e, s, r) => {
   const r = s.toLowerCase(), o = t.map((n) => {
     let a = n;
     const l = e.split(".");
-    for (const u of l)
-      if (a && typeof a == "object" && u in a)
-        a = a[u];
+    for (const f of l)
+      if (a && typeof a == "object" && f in a)
+        a = a[f];
       else {
         a = null;
         break;
@@ -906,7 +906,7 @@ const ce = (t, e, s, r) => {
   for (let r = 0; r < e.length && (s && e[r] in s); r++)
     s = s[e[r]];
   return s;
-}, U = (t, e, s = "asc") => t.sort((r, i) => {
+}, N = (t, e, s = "asc") => t.sort((r, i) => {
   let o = r, n = i;
   Array.isArray(e) ? (o = De(r, e), n = De(i, e)) : (o = r[e], n = i[e]);
   let a = 0;
@@ -919,7 +919,7 @@ const ce = (t, e, s, r) => {
   else
     throw new TypeError(`Unsupported data type for key "${e}"`);
   return s === "asc" ? a : -a;
-}), N = (t, e = {
+}), U = (t, e = {
   day: "2-digit",
   month: "2-digit",
   year: "2-digit"
@@ -936,10 +936,10 @@ const ce = (t, e, s, r) => {
       }
     })
   );
-}, Lt = "https://cdn.startinblox.com/owl/ds4go.jsonld#", Ut = { "@id": "ds4go:link", "@type": "@id" }, Nt = { "@id": "ds4go:enclosure", "@type": "@id" }, Ft = { "@id": "ds4go:url", "@type": "@id" }, Me = {
+}, Lt = "https://cdn.startinblox.com/owl/ds4go.jsonld#", Nt = { "@id": "ds4go:link", "@type": "@id" }, Ut = { "@id": "ds4go:enclosure", "@type": "@id" }, Ft = { "@id": "ds4go:url", "@type": "@id" }, Me = {
   ds4go: Lt,
-  link: Ut,
-  enclosure: Nt,
+  link: Nt,
+  enclosure: Ut,
   url: Ft
 };
 const ue = "lit-localize-status";
@@ -954,11 +954,11 @@ const Bt = (t, ...e) => ({
   return r;
 };
 const Ge = ((t) => Ht(t) ? Ke(t.strings, t.values) : t);
-let f = Ge, Le = !1;
+let u = Ge, Le = !1;
 function qt(t) {
   if (Le)
     throw new Error("lit-localize can only be configured once");
-  f = t, Le = !0;
+  u = t, Le = !0;
 }
 class zt {
   constructor(e) {
@@ -1001,7 +1001,7 @@ const Gt = "", Zt = "h", Jt = "s";
 function Xt(t, e) {
   return (e ? Zt : Jt) + Kt(typeof t == "string" ? t : t.join(Gt));
 }
-const Ue = /* @__PURE__ */ new WeakMap(), Ne = /* @__PURE__ */ new Map();
+const Ne = /* @__PURE__ */ new WeakMap(), Ue = /* @__PURE__ */ new Map();
 function Qt(t, e, s) {
   if (t) {
     const r = s?.id ?? Yt(e), i = t[r];
@@ -1017,8 +1017,8 @@ function Qt(t, e, s) {
           i.values
         );
       {
-        let o = Ue.get(i);
-        return o === void 0 && (o = i.values, Ue.set(i, o)), {
+        let o = Ne.get(i);
+        return o === void 0 && (o = i.values, Ne.set(i, o)), {
           ...i,
           values: o.map((n) => e.values[n])
         };
@@ -1029,8 +1029,8 @@ function Qt(t, e, s) {
 }
 function Yt(t) {
   const e = typeof t == "string" ? t : t.strings;
-  let s = Ne.get(e);
-  return s === void 0 && (s = Xt(e, typeof t != "string" && !("strTag" in t)), Ne.set(e, s)), s;
+  let s = Ue.get(e);
+  return s === void 0 && (s = Xt(e, typeof t != "string" && !("strTag" in t)), Ue.set(e, s)), s;
 }
 function ne(t) {
   window.dispatchEvent(new CustomEvent(ue, { detail: t }));
@@ -1088,7 +1088,7 @@ let q = class extends be {
         switch (n.type) {
           case "interval":
             o.push(
-              Tt(
+              kt(
                 r,
                 n.name,
                 n.value
@@ -1151,7 +1151,7 @@ let q = class extends be {
       ${this._displayObjects.map((t) => {
       const e = [
         {
-          name: `${t.facts.length} ${t.facts.length > 1 ? f("facts") : f("fact")}`,
+          name: `${t.facts.length} ${t.facts.length > 1 ? u("facts") : u("fact")}`,
           type: "information"
         }
       ];
@@ -1227,7 +1227,7 @@ let Y = class extends wt {
               ><div>${String(this.object.description)}</div></tems-division
             >
             <tems-division type="h4"
-              ><div>${f("All facts in this bundle")}</div></tems-division
+              ><div>${u("All facts in this bundle")}</div></tems-division
             >
             <div class="card-grid card-grid-vertical">
               ${this.object.facts.map((t) => {
@@ -1238,7 +1238,7 @@ let Y = class extends wt {
       if (e.length > 3) {
         const s = e.length - 3;
         e.splice(3, s), e.push({
-          name: `+${s} ${f("more")}`,
+          name: `+${s} ${u("more")}`,
           type: "information"
         });
       }
@@ -1254,10 +1254,10 @@ let Y = class extends wt {
             <tems-division type="body-sm"
               ><div>
                 <div>
-                  ${f("Bundle created on")} ${String(this.object.created_at)}
+                  ${u("Bundle created on")} ${String(this.object.created_at)}
                 </div>
                 <div>
-                  ${f("Bundle updated on")} ${String(this.object.updated_at)}
+                  ${u("Bundle updated on")} ${String(this.object.updated_at)}
                 </div>
               </div></tems-division
             >
@@ -1373,8 +1373,8 @@ var hs = Object.defineProperty, us = Object.getOwnPropertyDescriptor, A = (t, e,
 let y = class extends v {
   constructor() {
     super(...arguments), this.header = "DS4GO Fact Bundling Creation", this.selectedFacts = [], this.bundleName = "", this.bundleDescription = "", this.filterFactText = "", this.spliceLength = 0, this.cherryPickedProperties = [
-      { key: "created_at", value: "created_at", cast: N },
-      { key: "updated_at", value: "updated_at", cast: N },
+      { key: "created_at", value: "created_at", cast: U },
+      { key: "updated_at", value: "updated_at", cast: U },
       { key: "name", value: "name" },
       { key: "description", value: "description" },
       { key: "author", value: "author" },
@@ -1382,7 +1382,7 @@ let y = class extends v {
         key: "categories",
         value: "categories",
         expand: !0,
-        cast: (e) => U(e, "name")
+        cast: (e) => N(e, "name")
       }
     ], this._getResource = new Ye(this, {
       task: async ([e, s, r]) => {
@@ -1391,7 +1391,7 @@ let y = class extends v {
             if (!e) return;
             this.facts = await this._getProxyValue(e), this.hasCachedDatas = !0;
           }
-          return this.oldDataSrc !== e && (this.oldDataSrc = e), Array.isArray(this.facts) || (this.facts = []), s ? U(
+          return this.oldDataSrc !== e && (this.oldDataSrc = e), Array.isArray(this.facts) || (this.facts = []), s ? N(
             We(
               this.facts.filter(
                 (i) => !r.includes(i)
@@ -1400,7 +1400,7 @@ let y = class extends v {
             ),
             "name",
             "asc"
-          ) : (r.length === 0 && (this.spliceLength = Math.floor((window.innerWidth - 800) / 354) * Math.floor((window.innerHeight - 255) / 500)), U(
+          ) : (r.length === 0 && (this.spliceLength = Math.floor((window.innerWidth - 800) / 354) * Math.floor((window.innerHeight - 255) / 500)), N(
             this.facts.filter(
               (i) => !this.selectedFacts.includes(i)
             ),
@@ -1477,7 +1477,7 @@ let y = class extends v {
                 <tems-button
                   type="primary"
                   disabled=${!i || c}
-                  label=${f("Create bundle")}
+                  label=${u("Create bundle")}
                   @click=${this._createFactBundle}
                 ></tems-button>
               </div>
@@ -1488,8 +1488,8 @@ let y = class extends v {
                   <div>
                     <tems-input
                       type="text"
-                      label=${f("Bundle name")}
-                      placeholder=${f("Bundle name")}
+                      label=${u("Bundle name")}
+                      placeholder=${u("Bundle name")}
                       required=""
                       .value=${this.bundleName}
                       @change=${this._updateBundleName}
@@ -1498,15 +1498,15 @@ let y = class extends v {
                   <div>
                     <tems-textarea
                       rows="4"
-                      label=${f("Bundle description")}
-                      placeholder=${f("Bundle description")}
+                      label=${u("Bundle description")}
+                      placeholder=${u("Bundle description")}
                       .value=${this.bundleDescription}
                       @change=${this._updateBundleDescription}
                     ></tems-textarea>
                   </div>
                   ${r > 0 ? p`<tems-division type="h4">
                           <div>
-                            ${f(
+                            ${u(
           J`${r} selected fact${r > 1 ? "s" : ""}`
         )}
                           </div></tems-division
@@ -1520,7 +1520,7 @@ let y = class extends v {
           if (n.length > 3) {
             const a = n.length - 3;
             n.splice(3, a), n.push({
-              name: `+${a} ${f("more")}`,
+              name: `+${a} ${u("more")}`,
               type: "information"
             });
           }
@@ -1537,7 +1537,7 @@ let y = class extends v {
         })}
                         </div>` : c}
                 </div>
-                ̂${s.length > 0 ? p`<div>
+                ${s.length > 0 || this.filterFactText ? p`<div>
                       <div>
                         <tems-search-bar
                           .displayFilters=${!1}
@@ -1552,52 +1552,57 @@ let y = class extends v {
                           @search=${this._searchFacts}
                         ></tems-search-bar>
                       </div>
-                      <div class="card-grid card-grid-vertical">
-                        ${s.map((o) => {
-          const n = o.categories.map((a) => ({
-            name: a.name,
-            type: "information"
-          }));
+                      ${s.length > 0 ? p` <div class="card-grid card-grid-vertical">
+                              ${s.map((o) => {
+          const n = o.categories.map(
+            (a) => ({
+              name: a.name,
+              type: "information"
+            })
+          );
           if (n.length > 3) {
             const a = n.length - 3;
             n.splice(3, a), n.push({
-              name: `+${a} ${f("more")}`,
+              name: `+${a} ${u("more")}`,
               type: "information"
             });
           }
           return p`<tems-card-catalog
-                            .object=${c}
-                            .tags=${n}
-                            .header=${o.name || c}
-                            .content=${o.description || c}
-                            date=${o.updated_at || c}
-                            @click=${this._toggleFactSelection.bind(this, o)}
-                          ></tems-card-catalog>`;
+                                  .object=${c}
+                                  .tags=${n}
+                                  .header=${o.name || c}
+                                  .content=${o.description || c}
+                                  date=${o.updated_at || c}
+                                  @click=${this._toggleFactSelection.bind(
+            this,
+            o
+          )}
+                                ></tems-card-catalog>`;
         })}
-                      </div>
-                      ${s.length < e.length ? p`<div
-                            class="flex flex-row justify-content-space-between align-items-flex-end"
-                          >
-                            <div>
-                              ${f(
+                            </div>
+                            ${s.length < e.length ? p`<div
+                                  class="flex flex-row justify-content-space-between align-items-flex-end"
+                                >
+                                  <div>
+                                    ${u(
           J`Displaying ${s.length} of ${e.length} result${e.length > 1 ? "s" : ""}`
         )}
-                            </div>
-                            <div class="flex flex-row gap-400">
-                              <tems-button
-                                @click=${this._showMoreResults}
-                                type="primary"
-                                size="sm"
-                                label=${f("Show more results")}
-                              ></tems-button>
-                              <tems-button
-                                @click=${this._showAllResults}
-                                type="primary"
-                                size="sm"
-                                label=${f("Show all results")}
-                              ></tems-button>
-                            </div>
-                          </div>` : c}
+                                  </div>
+                                  <div class="flex flex-row gap-400">
+                                    <tems-button
+                                      @click=${this._showMoreResults}
+                                      type="primary"
+                                      size="sm"
+                                      label=${u("Show more results")}
+                                    ></tems-button>
+                                    <tems-button
+                                      @click=${this._showAllResults}
+                                      type="primary"
+                                      size="sm"
+                                      label=${u("Show all results")}
+                                    ></tems-button>
+                                  </div>
+                                </div>` : c}` : p`${u("No results found")} ${this.filterFactText ? `for "${this.filterFactText}".` : ""}`}
                     </div>` : c}
               </section>
             </div>
@@ -1689,8 +1694,8 @@ var fs = Object.defineProperty, ps = Object.getOwnPropertyDescriptor, I = (t, e,
 let j = class extends v {
   constructor() {
     super(...arguments), this.header = "DS4GO Fact Bundling", this.search = [], this.resultCount = this.objects?.length || 0, this.cherryPickedProperties = [
-      { key: "created_at", value: "created_at", cast: N },
-      { key: "updated_at", value: "updated_at", cast: N },
+      { key: "created_at", value: "created_at", cast: U },
+      { key: "updated_at", value: "updated_at", cast: U },
       { key: "name", value: "name" },
       { key: "description", value: "description" }
     ], this._getResource = new Ye(this, {
@@ -1704,7 +1709,7 @@ let j = class extends v {
             if (!t) return;
             this.objects = await this._getProxyValue(t), this.hasCachedDatas = !0;
           }
-          return this.oldDataSrc !== t && (this.oldDataSrc = t), Array.isArray(this.objects) || (this.objects = []), this.object = this.objects.find((s) => s["@id"] === e), U(this.objects, "name", "asc");
+          return this.oldDataSrc !== t && (this.oldDataSrc = t), Array.isArray(this.objects) || (this.objects = []), this.object = this.objects.find((s) => s["@id"] === e), N(this.objects, "name", "asc");
         }
       },
       args: () => [
@@ -1719,14 +1724,14 @@ let j = class extends v {
     return t?._originalResource?.hasType("ds4go:FactBundle") && (t.facts = await Promise.all(
       (await t._originalResource["ldp:contains"]).map(
         (e) => this._getProxyValue(e["@id"], !1, [
-          { key: "updated_at", value: "updated_at", cast: N },
+          { key: "updated_at", value: "updated_at", cast: U },
           { key: "name", value: "name" },
           { key: "description", value: "description" },
           {
             key: "categories",
             value: "categories",
             expand: !0,
-            cast: (s) => U(s, "name")
+            cast: (s) => N(s, "name")
           },
           { key: "author", value: "author" },
           { key: "link", value: "link" },
@@ -1789,7 +1794,7 @@ let j = class extends v {
                 <tems-button
                   type="primary"
                   disabled=${!this.bundleCreationComponent?.route || c}
-                  label=${f("Create a bundle")}
+                  label=${u("Create a bundle")}
                   @click=${this._goToBundleCreation}
                 ></tems-button>
               </div>
@@ -1861,6 +1866,7 @@ const ms = {
   s8272d3578b7c78d5: J`Displaying ${0} of ${1} result${2}`,
   sa40e7f4f2a43e2f7: "Show more results",
   sacf246e0fa11730d: "Show all results",
+  s9094c0cde8fb5058: "No results found",
   sf5509a9f253b9836: "Create a bundle",
   sefa717c1620c4ae4: "facts",
   sef234a791696afff: "fact",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startinblox/components-ds4go",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Startin'blox DS4GO",
   "main": "dist/index.js",
   "type": "module",

package/src/components/solid-fact-bundle-creation.ts

@@ -312,7 +312,7 @@ export class SolidFactBundle extends OrbitComponent {
                         </div>`
                     : nothing}
                 </div>
-                ̂${splicedDatas.length > 0
+                ${splicedDatas.length > 0 || this.filterFactText
                   ? html`<div>
                       <div>
                         <tems-search-bar
@@ -328,56 +328,65 @@ export class SolidFactBundle extends OrbitComponent {
                           @search=${this._searchFacts}
                         ></tems-search-bar>
                       </div>
-                      <div class="card-grid card-grid-vertical">
-                        ${splicedDatas.map((fact: Resource) => {
-                          const tags = fact.categories.map((c: Resource) => ({
-                            name: c.name,
-                            type: "information",
-                          }));
-                          if (tags.length > 3) {
-                            const overflowTags = tags.length - 3;
-                            tags.splice(3, overflowTags);
-                            tags.push({
-                              name: `+${overflowTags} ${msg("more")}`,
-                              type: "information",
-                            });
-                          }
-
-                          return html`<tems-card-catalog
-                            .object=${import.meta.env.DEV ? fact : nothing}
-                            .tags=${tags}
-                            .header=${fact.name || nothing}
-                            .content=${fact.description || nothing}
-                            date=${fact.updated_at || nothing}
-                            @click=${this._toggleFactSelection.bind(this, fact)}
-                          ></tems-card-catalog>`;
-                        })}
-                      </div>
-                      ${splicedDatas.length < datas.length
-                        ? html`<div
-                            class="flex flex-row justify-content-space-between align-items-flex-end"
-                          >
-                            <div>
-                              ${msg(
-                                str`Displaying ${splicedDatas.length} of ${datas.length} result${datas.length > 1 ? "s" : ""}`,
-                              )}
-                            </div>
-                            <div class="flex flex-row gap-400">
-                              <tems-button
-                                @click=${this._showMoreResults}
-                                type="primary"
-                                size="sm"
-                                label=${msg("Show more results")}
-                              ></tems-button>
-                              <tems-button
-                                @click=${this._showAllResults}
-                                type="primary"
-                                size="sm"
-                                label=${msg("Show all results")}
-                              ></tems-button>
+                      ${splicedDatas.length > 0
+                        ? html` <div class="card-grid card-grid-vertical">
+                              ${splicedDatas.map((fact: Resource) => {
+                                const tags = fact.categories.map(
+                                  (c: Resource) => ({
+                                    name: c.name,
+                                    type: "information",
+                                  }),
+                                );
+                                if (tags.length > 3) {
+                                  const overflowTags = tags.length - 3;
+                                  tags.splice(3, overflowTags);
+                                  tags.push({
+                                    name: `+${overflowTags} ${msg("more")}`,
+                                    type: "information",
+                                  });
+                                }
+
+                                return html`<tems-card-catalog
+                                  .object=${import.meta.env.DEV
+                                    ? fact
+                                    : nothing}
+                                  .tags=${tags}
+                                  .header=${fact.name || nothing}
+                                  .content=${fact.description || nothing}
+                                  date=${fact.updated_at || nothing}
+                                  @click=${this._toggleFactSelection.bind(
+                                    this,
+                                    fact,
+                                  )}
+                                ></tems-card-catalog>`;
+                              })}
                             </div>
-                          </div>`
-                        : nothing}
+                            ${splicedDatas.length < datas.length
+                              ? html`<div
+                                  class="flex flex-row justify-content-space-between align-items-flex-end"
+                                >
+                                  <div>
+                                    ${msg(
+                                      str`Displaying ${splicedDatas.length} of ${datas.length} result${datas.length > 1 ? "s" : ""}`,
+                                    )}
+                                  </div>
+                                  <div class="flex flex-row gap-400">
+                                    <tems-button
+                                      @click=${this._showMoreResults}
+                                      type="primary"
+                                      size="sm"
+                                      label=${msg("Show more results")}
+                                    ></tems-button>
+                                    <tems-button
+                                      @click=${this._showAllResults}
+                                      type="primary"
+                                      size="sm"
+                                      label=${msg("Show all results")}
+                                    ></tems-button>
+                                  </div>
+                                </div>`
+                              : nothing}`
+                        : html`${msg("No results found")} ${this.filterFactText ? `for "${this.filterFactText}".` : ""}`}
                     </div>`
                   : nothing}
               </section>