@sphereon/ui-components.ssi-react 0.4.1-next.145 → 0.4.1-next.146

package/dist/components/views/FormView/index.js

@@ -4,19 +4,19 @@ import { JsonForms } from '@jsonforms/react';
 import { materialCells } from '@jsonforms/material-renderers';
 import { jsonFormsMaterialRenderers } from '../../../renders/jsonFormsRenders';
 import Ajv from 'ajv';
-import addFormats from "ajv-formats";
+import addFormats from 'ajv-formats';
 import { formatDate } from '../../../helpers';
 const defaultAjv = new Ajv({ useDefaults: true });
 addFormats(defaultAjv);
 defaultAjv.addKeyword({
-    keyword: 'isoDateFormat',
+    keyword: 'dateFormat',
     modifying: true,
-    validate: (schema, data, parentSchema, dataCxt) => {
+    validate: (dateFormat, data, parentSchema, dataCxt) => {
         if (typeof data === 'string') {
             if (!dataCxt?.parentData || dataCxt.parentDataProperty === undefined) {
                 return true;
             }
-            const formatted = formatDate(data, schema);
+            const formatted = formatDate(data, dateFormat);
             if (formatted && formatted !== 'Invalid date') {
                 dataCxt.parentData[dataCxt.parentDataProperty] = formatted;
             }

package/dist/helpers/DateHelper/index.d.ts

@@ -1,3 +1,2 @@
-export type DateFormat = 'date-time' | 'date' | 'time' | undefined;
-export declare const formatDate: (dateString?: string, format?: DateFormat) => string;
-export declare const formatDateToISO: (dateString?: string, format?: DateFormat) => string;
+export type DateFormat = 'date-time' | 'date' | 'time' | 'iso-date-time' | 'iso-date' | 'iso-time' | undefined;
+export declare const formatDate: (dateString?: string, format?: DateFormat | string) => string;

package/dist/helpers/DateHelper/index.js

@@ -1,45 +1,86 @@
+const KNOWN_FORMATS = new Set(['date-time', 'date', 'time', 'iso-date-time', 'iso-date', 'iso-time']);
+const customFormatTokens = {
+    yyyy: (date) => date.getFullYear().toString().padStart(4, '0'),
+    yy: (date) => date.getFullYear().toString().slice(-2).padStart(2, '0'),
+    MM: (date) => (date.getMonth() + 1).toString().padStart(2, '0'),
+    M: (date) => (date.getMonth() + 1).toString(),
+    dd: (date) => date.getDate().toString().padStart(2, '0'),
+    d: (date) => date.getDate().toString(),
+    HH: (date) => date.getHours().toString().padStart(2, '0'),
+    H: (date) => date.getHours().toString(),
+    mm: (date) => date.getMinutes().toString().padStart(2, '0'),
+    m: (date) => date.getMinutes().toString(),
+    ss: (date) => date.getSeconds().toString().padStart(2, '0'),
+    s: (date) => date.getSeconds().toString(),
+};
+const orderedTokens = ['yyyy', 'yy', 'MM', 'dd', 'HH', 'mm', 'ss', 'M', 'd', 'H', 'm', 's'];
+const applyCustomFormat = (date, format) => {
+    let result = '';
+    let i = 0;
+    while (i < format.length) {
+        const char = format[i];
+        if (char === '[') {
+            const closeIdx = format.indexOf(']', i + 1);
+            if (closeIdx !== -1) {
+                result += format.slice(i + 1, closeIdx);
+                i = closeIdx + 1;
+                continue;
+            }
+        }
+        const token = orderedTokens.find((t) => format.startsWith(t, i));
+        if (token) {
+            result += customFormatTokens[token](date);
+            i += token.length;
+        }
+        else {
+            result += char;
+            i += 1;
+        }
+    }
+    return result;
+};
 export const formatDate = (dateString, format = 'date-time') => {
-    const userDateTimeOpts = Intl.DateTimeFormat().resolvedOptions();
     if (!dateString) {
         return '';
     }
-    const date = dateString === 'now' ? new Date() : new Date(dateString);
+    let dateToParse = dateString;
+    if (/^\d{4}-\d{2}-\d{2}$/.test(dateString)) {
+        dateToParse += 'T00:00:00';
+    }
+    const date = dateString === 'now' ? new Date() : new Date(dateToParse);
     if (isNaN(date.getTime())) {
         console.error('Invalid date:', dateString);
         return 'Invalid date';
     }
+    const effectiveFormat = format ?? 'date-time';
+    if (effectiveFormat === 'iso-date-time')
+        return applyCustomFormat(date, 'yyyy-MM-ddTHH:mm:ss');
+    if (effectiveFormat === 'iso-date')
+        return applyCustomFormat(date, 'yyyy-MM-dd');
+    if (effectiveFormat === 'iso-time')
+        return applyCustomFormat(date, 'HH:mm:ss');
+    if (!KNOWN_FORMATS.has(effectiveFormat)) {
+        return applyCustomFormat(date, effectiveFormat);
+    }
+    const userDateTimeOpts = Intl.DateTimeFormat().resolvedOptions();
     const formatOptions = {
         timeZone: userDateTimeOpts.timeZone,
     };
-    if (format === 'date-time') {
+    if (effectiveFormat === 'date-time') {
         formatOptions.dateStyle = 'short';
         formatOptions.timeStyle = 'short';
     }
-    else if (format === 'date') {
+    else if (effectiveFormat === 'date') {
         formatOptions.dateStyle = 'short';
     }
-    else if (format === 'time') {
+    else if (effectiveFormat === 'time') {
         formatOptions.timeStyle = 'short';
     }
-    return new Intl.DateTimeFormat(userDateTimeOpts.locale, formatOptions).format(date);
-};
-export const formatDateToISO = (dateString, format = 'date-time') => {
-    if (!dateString) {
-        return '';
-    }
-    const date = dateString === 'now' ? new Date() : new Date(dateString);
-    if (isNaN(date.getTime())) {
-        console.error('Invalid date:', dateString);
-        return 'Invalid date';
-    }
-    const isoString = date.toISOString();
-    if (format === 'date-time') {
-        return isoString.slice(0, 19).replace('T', ' ');
-    }
-    else if (format === 'date') {
-        return isoString.slice(0, 10);
+    try {
+        return new Intl.DateTimeFormat(userDateTimeOpts.locale, formatOptions).format(date);
     }
-    else {
-        return isoString.slice(11, 19);
+    catch (error) {
+        console.error('Intl formatting error', error);
+        return date.toString();
     }
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sphereon/ui-components.ssi-react",
   "private": false,
-  "version": "0.4.1-next.145+8f2e862",
+  "version": "0.4.1-next.146+7771557",
   "description": "SSI UI components for React",
   "repository": "git@github.com:Sphereon-Opensource/UI-Components.git",
   "author": "Sphereon <dev@sphereon.com>",
@@ -50,7 +50,7 @@
     "@mui/x-date-pickers": "^8.18.0",
     "@sphereon/ssi-sdk.data-store": "0.34.1-feature.SSISDK.45.94",
     "@sphereon/ssi-types": "0.34.1-feature.SSISDK.45.94",
-    "@sphereon/ui-components.core": "0.4.1-next.145+8f2e862",
+    "@sphereon/ui-components.core": "0.4.1-next.146+7771557",
     "@tanstack/react-table": "^8.9.3",
     "ajv": "^8.17.1",
     "ajv-formats": "^3.0.1",
@@ -72,5 +72,5 @@
   "peerDependencies": {
     "react": ">= 18"
   },
-  "gitHead": "8f2e8625e34a132edb2a28f6ce318d89c27a0147"
+  "gitHead": "7771557388b35167616e95a1614f1d7a7cf280f1"
 }