@startinblox/components-ds4go 2.2.4 → 3.0.0

package/src/helpers/datas/filterObjectByDateInterval.ts

@@ -0,0 +1,44 @@
+import type { UnknownResource } from "@src/component";
+import checkValueInIntervalRecursive from "@src/helpers/datas/checkValueInIntervalRecursive";
+
+/**
+ * Filters an array of Resource objects based on whether a specific date/number property
+ * falls within a given interval string (e.g., "2023-01-01/2023-01-31" or "3/6").
+ * Checks the property recursively within nested objects and arrays.
+ */
+const filterObjectByDateInterval = (
+  array: UnknownResource[],
+  propName: string,
+  interval: string,
+): UnknownResource[] => {
+  if (!propName || !interval || typeof interval !== "string") {
+    return array;
+  }
+
+  const [startStr, endStr] = interval.split("/");
+  if (!startStr) {
+    return array;
+  }
+
+  const startDate = new Date(startStr);
+
+  const endDate = new Date(endStr ?? startStr);
+
+  if (Number.isNaN(startDate.getTime()) || Number.isNaN(endDate.getTime())) {
+    console.warn(`Invalid date interval provided: ${interval}`);
+    return array;
+  }
+
+  endDate.setHours(23, 59, 59, 999);
+
+  if (startDate > endDate) {
+    console.warn(`Start date is after end date in interval: ${interval}`);
+    return array;
+  }
+
+  return array.filter((obj) =>
+    checkValueInIntervalRecursive(obj, propName, startDate, endDate),
+  );
+};
+
+export default filterObjectByDateInterval;

package/src/helpers/datas/filterObjectById.ts

@@ -1,17 +1,18 @@
-import type { Resource } from "@src/component";
+import type { UnknownResource } from "@src/component";
 
 const filterObjectById = (
-  array: Resource[],
+  array: UnknownResource[],
   propName: string,
-  targetId: string
-): Resource[] => {
+  targetId: string,
+): UnknownResource[] => {
   if (!propName || !targetId) {
     return array;
   }
 
+  const propPath = propName.split(".");
+
   return array.filter((obj) => {
     let current = obj;
-    const propPath = propName.split(".");
 
     for (const segment of propPath) {
       if (current && typeof current === "object" && segment in current) {
@@ -43,7 +44,7 @@ const filterObjectById = (
           typeof item === "object" &&
           item !== null &&
           "@id" in item &&
-          item["@id"] === targetId
+          item["@id"] === targetId,
       );
     }
 

package/src/helpers/datas/filterObjectByInterval.ts

@@ -1,115 +1,11 @@
-import type { Resource } from "@src/component";
-
-
-function isValidDateValue(value: unknown): value is string | number | Date {
- if (
-   typeof value !== "string" &&
-   typeof value !== "number" &&
-   !(value instanceof Date)
- ) {
-   return false;
- }
-
- return !Number.isNaN(new Date(value).getTime());
-}
-const checkValueInIntervalRecursive = (
-  data: any,
-  propName: string,
-  startValue: number | Date,
-  endValue: number | Date
-): boolean => {
-  if (data === null || data === undefined) {
-    return false;
-  }
-
-  const propPath = propName.split(".");
-  let current = data;
-
-  for (const segment of propPath) {
-    if (current && typeof current === "object" && segment in current) {
-      current = current[segment];
-    } else {
-      return false;
-    }
-  }
-
-  if (typeof current === "number") {
-    if (typeof startValue === "number" && typeof endValue === "number") {
-      if (startValue <= current && current <= endValue) {
-        return true;
-      }
-    }
-  } else if (isValidDateValue(current)) {
-    const date = new Date(current);
-    if (startValue instanceof Date && endValue instanceof Date) {
-      if (startValue <= date && date <= endValue) {
-        return true;
-      }
-    }
-  } else {
-    return false;
-  }
-
-  if (Array.isArray(data)) {
-    return data.some((item) =>
-      checkValueInIntervalRecursive(item, propName, startValue, endValue)
-    );
-  }
-
-  if (typeof data === "object") {
-    return Object.entries(data).some(([key, value]) =>
-      checkValueInIntervalRecursive(value, propName, startValue, endValue)
-    );
-  }
-
-  return false;
-};
-
-/**
- * Filters an array of Resource objects based on whether a specific date/number property
- * falls within a given interval string (e.g., "2023-01-01/2023-01-31" or "3/6").
- * Checks the property recursively within nested objects and arrays.
- */
-const filterObjectByDateInterval = (
-  array: Resource[],
-  propName: string,
-  interval: string
-): Resource[] => {
-  if (!propName || !interval || typeof interval !== "string") {
-    return array;
-  }
-
-  const [startStr, endStr] = interval.split("/");
-  if (!startStr) {
-    return array;
-  }
-
-  const startDate = new Date(startStr);
-
-  const endDate = new Date(endStr ?? startStr);
-
-  if (Number.isNaN(startDate.getTime()) || Number.isNaN(endDate.getTime())) {
-    console.warn(`Invalid date interval provided: ${interval}`);
-    return array;
-  }
-
-  endDate.setHours(23, 59, 59, 999);
-
-  if (startDate > endDate) {
-    console.warn(`Start date is after end date in interval: ${interval}`);
-    return array;
-  }
-
-  return array.filter((obj) =>
-    checkValueInIntervalRecursive(obj, propName, startDate, endDate)
-  );
-};
+import type { UnknownResource } from "@src/component";
+import checkValueInIntervalRecursive from "@src/helpers/datas/checkValueInIntervalRecursive";
 
 const filterObjectByInterval = (
-  array: Resource[],
+  array: UnknownResource[],
   propName: string,
-  interval: string
-): Resource[] => {
+  interval: string,
+): UnknownResource[] => {
   if (!propName || !interval || typeof interval !== "string") {
     return array;
   }
@@ -126,7 +22,7 @@ const filterObjectByInterval = (
   }
 
   return array.filter((obj) =>
-    checkValueInIntervalRecursive(obj, propName, startStr, endStr)
+    checkValueInIntervalRecursive(obj, propName, startStr, endStr),
   );
 };
 

package/src/helpers/datas/filterObjectByNamedValue.ts

@@ -1,9 +1,9 @@
-import type { Resource } from "@src/component";
+import type { UnknownResource } from "@src/component";
 
 const calculatePertinenceScoreRecursive = (
   data: any,
   lowerCaseString: string,
-  isTargetProperty: boolean
+  isTargetProperty: boolean,
 ): number => {
   if (data === null || data === undefined) {
     return 0;
@@ -18,7 +18,7 @@ const calculatePertinenceScoreRecursive = (
 
     const escapedString = lowerCaseString.replace(
       /[.*+?^${}()|[\]\\]/g,
-      "\\$&"
+      "\\$&",
     );
 
     const wholeWordRegex = new RegExp(`\\b${escapedString}\\b`);
@@ -40,8 +40,8 @@ const calculatePertinenceScoreRecursive = (
         calculatePertinenceScoreRecursive(
           item,
           lowerCaseString,
-          isTargetProperty
-        )
+          isTargetProperty,
+        ),
       );
       if (maxScore === 2) break;
     }
@@ -55,8 +55,8 @@ const calculatePertinenceScoreRecursive = (
       calculatePertinenceScoreRecursive(
         value,
         lowerCaseString,
-        isTargetProperty
-      )
+        isTargetProperty,
+      ),
     );
     if (maxScore === 2) break;
   }
@@ -64,40 +64,42 @@ const calculatePertinenceScoreRecursive = (
 };
 
 const filterObjectByNamedValue = (
-  array: Resource[],
+  array: UnknownResource[],
   propName: string,
-  searchString: string
-): Resource[] => {
+  searchString: string,
+): UnknownResource[] => {
   if (!propName || !searchString || searchString.trim() === "") {
     return array;
   }
 
   const lowerCaseString = searchString.toLowerCase();
-
-  const scoredObjects = array.map((obj) => {
-    let current: any = obj;
-    const propPath = propName.split(".");
-    for (const segment of propPath) {
-      if (current && typeof current === "object" && segment in current) {
-        current = current[segment];
-      } else {
-        current = null;
-        break;
+  const propPath = propName.split(".");
+
+  return array
+    .map((obj) => {
+      let current: any = obj;
+      for (const segment of propPath) {
+        if (current && typeof current === "object" && segment in current) {
+          current = current[segment];
+        } else {
+          current = null;
+          break;
+        }
       }
-    }
-
-    let score = 0;
-    if (current) {
-      score = calculatePertinenceScoreRecursive(current, lowerCaseString, true);
-    }
-    return { obj, score };
-  });
 
-  const filteredObjects = scoredObjects.filter((item) => item.score > 0);
-
-  filteredObjects.sort((a, b) => b.score - a.score);
-
-  return filteredObjects.map((item) => item.obj);
+      let score = 0;
+      if (current) {
+        score = calculatePertinenceScoreRecursive(
+          current,
+          lowerCaseString,
+          true,
+        );
+      }
+      return { obj, score };
+    })
+    .filter((item) => item.score > 0)
+    .sort((a, b) => b.score - a.score)
+    .map((item) => item.obj);
 };
 
 export default filterObjectByNamedValue;

package/src/helpers/datas/filterObjectByType.ts

@@ -1,9 +1,9 @@
-import type { Resource } from "@src/component";
+import type { UnknownResource } from "@src/component";
 
 const filterObjectByType = (
-  array: Resource[],
+  array: UnknownResource[],
   targetType: string
-): Resource[] => {
+): UnknownResource[] => {
   if (!targetType) {
     return array;
   }

package/src/helpers/datas/filterObjectByValue.ts

@@ -1,9 +1,9 @@
-import type { Resource } from "@src/component";
+import type { UnknownResource } from "@src/component";
 
 const calculatePertinenceScore = (
   data: any,
   lowerCaseString: string,
-  key?: string
+  key?: string,
 ): number => {
   if (data === null || data === undefined) {
     return 0;
@@ -14,7 +14,7 @@ const calculatePertinenceScore = (
 
     const escapedString = lowerCaseString.replace(
       /[.*+?^${}()|[\]\\]/g,
-      "\\$&"
+      "\\$&",
     );
 
     const wholeWordRegex = new RegExp(`\\b${escapedString}\\b`);
@@ -41,7 +41,7 @@ const calculatePertinenceScore = (
     for (const item of data) {
       maxScore = Math.max(
         maxScore,
-        calculatePertinenceScore(item, lowerCaseString)
+        calculatePertinenceScore(item, lowerCaseString),
       );
       if (maxScore === 4) break;
     }
@@ -52,30 +52,31 @@ const calculatePertinenceScore = (
   for (const [currentKey, value] of Object.entries(data)) {
     maxScore = Math.max(
       maxScore,
-      calculatePertinenceScore(value, lowerCaseString, currentKey)
+      calculatePertinenceScore(value, lowerCaseString, currentKey),
     );
     if (maxScore === 4) break;
   }
   return maxScore;
 };
 
-const filterObjectByValue = (array: Resource[], searchString: string): any[] => {
+const filterObjectByValue = (
+  array: UnknownResource[],
+  searchString: string,
+): UnknownResource[] => {
   if (!searchString || searchString.trim() === "") {
     return array;
   }
 
   const lowerCaseString = searchString.toLowerCase();
 
-  const scoredObjects = array.map((obj) => ({
-    obj,
-    score: calculatePertinenceScore(obj, lowerCaseString),
-  }));
-
-  const filteredObjects = scoredObjects.filter((item) => item.score > 0);
-
-  filteredObjects.sort((a, b) => b.score - a.score);
-
-  return filteredObjects.map((item) => item.obj);
+  return array
+    .map((obj) => ({
+      obj,
+      score: calculatePertinenceScore(obj, lowerCaseString),
+    }))
+    .filter((item) => item.score > 0)
+    .sort((a, b) => b.score - a.score)
+    .map((item) => item.obj);
 };
 
 export default filterObjectByValue;

package/src/helpers/datas/sort.ts

@@ -1,10 +1,10 @@
 const getValueFromAnyKey = (obj: any, keys: string[]): any => {
   let value = obj;
-  for (let i = 0; i < keys.length; i++) {
-    if (value && keys[i] in value) {
-      value = value[keys[i]];
+  for (const key of keys) {
+    if (value && key in value) {
+      value = value[key];
     } else {
-      break;
+      return undefined;
     }
   }
   return value;
@@ -13,28 +13,55 @@ const getValueFromAnyKey = (obj: any, keys: string[]): any => {
 type Sort = (arr: any[], k: string | string[], order?: "asc" | "desc") => any[];
 
 const sort: Sort = (arr, k, order = "asc") => {
-  return arr.sort((a, b) => {
-    let aN = a;
-    let bN = b;
-    if (Array.isArray(k)) {
-      aN = getValueFromAnyKey(a, k);
-      bN = getValueFromAnyKey(b, k);
-    } else {
-      aN = a[k];
-      bN = b[k];
+  const keys = Array.isArray(k) ? k : [k];
+  const shouldReverse = order !== "asc";
+
+  const result = [...arr];
+
+  const getComparator = () => {
+    const sampleValue = getValueFromAnyKey(result[0], keys);
+
+    if (typeof sampleValue === "number") {
+      return (a: any, b: any) => {
+        const aN = getValueFromAnyKey(a, keys);
+        const bN = getValueFromAnyKey(b, keys);
+        if (aN == null) return bN == null ? 0 : 1;
+        if (bN == null) return -1;
+        return (aN as number) - (bN as number);
+      };
     }
-    let c = 0;
-    if (typeof aN === "number" && typeof bN === "number") {
-      c = aN - bN;
-    } else if (typeof aN === "string" && typeof bN === "string") {
-      c = aN.localeCompare(bN);
-    } else if (aN instanceof Date && bN instanceof Date) {
-      c = aN.getTime() - bN.getTime();
-    } else {
-      throw new TypeError(`Unsupported data type for key "${k}"`);
+
+    if (typeof sampleValue === "string") {
+      return (a: any, b: any) => {
+        const aN = getValueFromAnyKey(a, keys);
+        const bN = getValueFromAnyKey(b, keys);
+        if (aN == null) return bN == null ? 0 : 1;
+        if (bN == null) return -1;
+        return (aN as string).localeCompare(bN as string);
+      };
     }
-    return order === "asc" ? c : -c;
+
+    if (sampleValue instanceof Date) {
+      return (a: any, b: any) => {
+        const aN = getValueFromAnyKey(a, keys);
+        const bN = getValueFromAnyKey(b, keys);
+        if (aN == null) return bN == null ? 0 : 1;
+        if (bN == null) return -1;
+        return (aN as Date).getTime() - (bN as Date).getTime();
+      };
+    }
+
+    throw new TypeError(`Unsupported data type for key "${k}"`);
+  };
+
+  const comparator = getComparator();
+
+  result.sort((a, b) => {
+    const comparison = comparator(a, b);
+    return shouldReverse ? -comparison : comparison;
   });
+
+  return result;
 };
 
 export default sort;

package/src/helpers/index.ts

@@ -8,6 +8,7 @@ import setupComponentSubscriptions from "@helpers/components/setupComponentSubsc
 import setupOnSaveReset from "@helpers/components/setupOnSaveReset";
 import filterGenerator from "@helpers/datas/filterGenerator";
 import filterObjectByDateAfter from "@helpers/datas/filterObjectByDateAfter";
+import filterObjectByDateInterval from "@helpers/datas/filterObjectByDateInterval";
 import filterObjectById from "@helpers/datas/filterObjectById";
 import filterObjectByInterval from "@helpers/datas/filterObjectByInterval";
 import filterObjectByNamedValue from "@helpers/datas/filterObjectByNamedValue";
@@ -29,6 +30,7 @@ export {
   filterObjectByNamedValue,
   filterObjectByValue,
   filterObjectByType,
+  filterObjectByDateInterval,
   formatDate,
   ComponentObjectHandler,
   ComponentObjectsHandler,

package/src/helpers/ui/formatDate.ts

@@ -1,3 +1,15 @@
+const formatters = new Map<string, Intl.DateTimeFormat>();
+
+const getFormatter = (format: Intl.DateTimeFormatOptions): Intl.DateTimeFormat => {
+  const key = JSON.stringify(format);
+  let formatter = formatters.get(key);
+  if (!formatter) {
+    formatter = new Intl.DateTimeFormat(undefined, format);
+    formatters.set(key, formatter);
+  }
+  return formatter;
+};
+
 const formatDate = (
   originalDate: string | Date | undefined,
   format: Intl.DateTimeFormatOptions = {
@@ -9,7 +21,8 @@ const formatDate = (
   if (!originalDate) return "";
   const date =
     typeof originalDate === "string" ? new Date(originalDate) : originalDate;
-  const formattedDate = date.toLocaleString(undefined, format);
+  const formatter = getFormatter(format);
+  const formattedDate = formatter.format(date);
   if (typeof originalDate === "string" && formattedDate === "Invalid Date")
     return originalDate;
   return formattedDate;

package/src/helpers/utils/requestNavigation.ts

@@ -1,8 +1,11 @@
-const requestNavigation = (route: string, resource: string | boolean = false) => {
+const requestNavigation = (
+  route: string,
+  resource: string | boolean = false,
+) => {
   window.dispatchEvent(
     new CustomEvent("requestNavigation", {
       detail: {
-        route: route,
+        route,
         resource: typeof resource === "string" ? { "@id": resource } : resource,
       },
     }),

package/src/helpers/utils/uniq.ts

@@ -2,5 +2,5 @@
  * Generates a unique random string using the Math.random() method.
  */
 export default function uniq(): string {
-  return Math.random().toString(16).slice(2);
+  return `${Date.now()}-${Math.random().toString(16).slice(2)}`;
 }

package/src/styles/fact-bundle-creation.scss

@@ -0,0 +1,102 @@
+@use "sass:meta";
+
+@include meta.load-css("./_helpers/flex");
+
+[slot="content"] {
+  height: 100%;
+}
+
+section {
+  gap: var(--scale-400);
+  padding: var(--scale-900) 0;
+  height: calc(100% - var(--scale-900) * 2);
+
+  > div {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: var(--scale-400);
+    flex: 1;
+
+    &:first-child {
+      max-width: 400px;
+    }
+  }
+}
+
+.card-grid {
+  flex: 1;
+  overflow-y: scroll;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  gap: 20px;
+  align-content: flex-start;
+}
+
+.card-grid-vertical {
+  justify-content: stretch;
+
+  tems-card-catalog {
+    width: 354px;
+    height: fit-content;
+  }
+}
+
+tems-card-catalog {
+  cursor: pointer;
+
+  &[selected] {
+    --color-border-primary: var(--color-surface-action-solid);
+  }
+}
+
+tems-search-bar {
+  --scale-900: 0;
+}
+
+.gap-400 {
+  gap: var(--scale-400);
+}
+
+div.select {
+  align-items: flex-start;
+  display: flex;
+  flex-direction: column;
+  gap: var(--scale-200);
+  width: 100%;
+}
+
+select {
+  width: 100%;
+  background-color: var(--color-surface-primary);
+  border: var(--border-width-sm) solid var(--color-border-primary);
+  border-radius: var(--border-radius-md);
+  color: var(--color-text-body);
+  font-family: var(--font-family-body);
+  font-size: var(--typography-size-body-sm);
+  font-style: normal;
+  font-weight: var(--font-weight-regular);
+  line-height: var(--line-height-body-sm);
+  letter-spacing: var(--font-letter-spacing-default);
+  padding: var(--scale-100) var(--scale-300);
+  appearance: none;
+  cursor: pointer;
+
+  &:hover {
+    border: var(--border-width-sm) solid var(--color-border-action);
+  }
+
+  option {
+    background-color: var(--color-surface-primary);
+    color: var(--color-text-body);
+    font-family: var(--font-family-body);
+    font-size: var(--typography-size-body-sm);
+    font-style: normal;
+    font-weight: var(--font-weight-regular);
+    line-height: var(--line-height-body-sm);
+    letter-spacing: var(--font-letter-spacing-default);
+    padding: var(--scale-100) var(--scale-300);
+    cursor: pointer;
+  }
+}

package/cypress/component/solid-boilerplate.cy.ts

@@ -1,9 +0,0 @@
-import { html } from "lit";
-
-describe("<solid-boilerplate>", () => {
-  it("should mount", () => {
-    cy.mount(html`<solid-boilerplate></solid-boilerplate>`);
-
-    cy.get("solid-boilerplate").should("exist");
-  });
-});