jamespot-react-components 1.3.46 → 1.3.48

package/dist/src/translation/lang.json.d.ts

@@ -110,6 +110,8 @@ declare const _default: {
         "CRPT_Report_Description_Required": "La description est obligatoire",
         "CRPT_Report_Sent": "Report sent",
         "DND_ADD_SECTION": "+ Add section",
+        "DND_LIST_TITLE": "Items",
+        "DND_EMPTY_STATE": "No items to display",
         "DND_NEW_SECTION_LABEL": "New Section",
         "DND_SECTIONS_TITLE": "Sections",
         "DND_STACK_TITLE": "Active Buttons",
@@ -168,6 +170,7 @@ declare const _default: {
         "GLOBAL_Confirm": "Confirm",
         "GLOBAL_Continue": "Continue",
         "GLOBAL_Creation_Date": "Creation date",
+        "Global_Create": "Créer",
         "GLOBAL_Creator": "Creator",
         "GLOBAL_DateTime_Placeholder": "Date and time",
         "GLOBAL_Date_Placeholder": "Date",
@@ -208,6 +211,7 @@ declare const _default: {
         "GLOBAL_Login": "Login",
         "GLOBAL_Move": "Move",
         "GLOBAL_Next": "Next",
+        "GLOBAL_New": "Nouveau",
         "GLOBAL_No_Result": "No result",
         "GLOBAL_Object_Link": "Objet lié",
         "GLOBAL_Ok": "OK",
@@ -381,6 +385,9 @@ declare const _default: {
         "WIDGET_Prompt_Logout": "Se déconnecter",
         "WIDGET_Quick_Survey": "Add a survey to collect feedback",
         "WIDGET_Quick_Survey_Text": "Add a survey to collect feedback",
+        "WIDGET_Quick_Survey_isStarted": "The survey has already some answers, you can't make any change to it, if you need to, please reset the survey.",
+        "WIDGET_Quick_Survey_Reset": "Reset the survey answers",
+        "WIDGET_Quick_Survey_isStarted_no_modification": "The survey has already some answers, some modifications are not possible, if needed, please start a new survey.",
         "WIDGET_Set_Widget": "Configurer",
         "WIDGET_Survey_After_Help": "Respondents will only see the results once after they respond. They will no longer be able to edit their answer.",
         "WIDGET_Survey_Anonymize_Help": "Les réponses de ce sondage seront anonymes : personne ne pourra savoir qui a répondu quoi, seulement les pourcentages.",
@@ -406,6 +413,16 @@ declare const _default: {
         "WIDGET_Welcome_Text": "Rendez vos pages plus personnelles en accueillant chaleureusement vos utilisateurs.",
         "WIDGET_Welcome_Default_Message": "Bienvenue",
         "WIDGET_Welcome_Linebreak_Label": "Saut de ligne (après le message)",
+        "WIDGET_Survey_Date_Add_Event": "Ajouter",
+        "WIDGET_Survey_Date_Label": "{label} {day} à {time}",
+        "WIDGET_Survey_Date_Participant_At": "Participants le {date}",
+        "WIDGET_Survey_Date_Revive": "Relancer les participants",
+        "WIDGET_Survey_Date_Revive_All": "Tous les participants",
+        "WIDGET_Survey_Date_Revive_Message": "Message de relance",
+        "WIDGET_Survey_Date_Revive_Confirm": "Relancer",
+        "WIDGET_Survey_Date_Revive_User_With_No_Response": "Les participants sans réponse",
+        "WIDGET_Survey_Date_Stats": "{totalResponse}/{totalRespondents} personnes ont répondu ({percent}%)",
+        "WIDGET_Survey_Date_End_At": "Fin le {dateEnd}",
         "PANEL_Widget_Extension_Name": "Nom de l'extension"
     }
 }

package/dist/src/types.d.ts

@@ -44,7 +44,7 @@ export type { JRCColumnRightProps } from './components/JRCColumnRight/JRCColumnR
 export type { Area } from './components/JRCCropImage/JRCCropImage';
 export type { JRCDateProps } from './components/JRCDate/JRCDate';
 export type { JRCDisplayCardProps } from './components/JRCDisplayCard/JRCDisplayCard';
-export type { BaseDndItem, DndData, DndDragItem, DndEmptyStateComponentProps, DndItemComponentProps, DndSection, DndSectionComponentProps, ItemTypes, JRCDndTwoLevelWithStackProps, } from './components/JRCDragNDrop/types';
+export type { BaseDndItem, DndData, DndDragItem, DndEmptyStateComponentProps, DndItemComponentProps, DndSection, DndSectionComponentProps, ItemTypes, JRCDndOneLevelProps, JRCDndTwoLevelWithStackProps, } from './components/JRCDragNDrop/types';
 export type { JRCDropDownProps } from './components/JRCDropDown/JRCDropDown';
 export type { JRCFileOpenProps } from './components/JRCFileOpen/JRCFileOpen';
 export type { JRCFileViewerOpenWithOptionsType } from './components/JRCFileViewer/types';

package/dist/src/utils/index.d.ts

@@ -2,9 +2,10 @@ import * as array from './utils.array';
 import * as color from './utils.color';
 import * as date from './utils.date';
 import * as document from './utils.document';
+import * as file from './utils.files';
+import * as form from './utils.form';
 import * as icons from './utils.icons';
 import * as image from './utils.image';
-import * as file from './utils.files';
 import * as misc from './utils.misc';
 import * as object from './utils.object';
 import * as regexp from './utils.regexp';
@@ -16,6 +17,7 @@ export declare const Utils: {
     date: typeof date;
     document: typeof document;
     file: typeof file;
+    form: typeof form;
     icons: typeof icons;
     image: typeof image;
     misc: typeof misc;

package/dist/src/utils/utils.color.d.ts

@@ -52,6 +52,38 @@ export declare const colorimetry: {
 export declare const getContrast50: (hexcolor: string) => "black" | "white";
 export declare const getContrastYIQ: (hexcolor: string) => "black" | "white";
 export declare function isValidHexColor(color: string): boolean;
+export declare const hexToRgb: (hex: string) => {
+    r: number;
+    g: number;
+    b: number;
+};
+/**
+ * @param hexColor a color in the format #XXX or #XXXXXX
+ * @param adjustPercent a number between -1 and 1, <0 for darkening, >0 for lightening
+ * @returns a string of the form #XXXXXX representing the modified color. Returns undefined if parameters are invalid.
+ */
+export declare const modifyColorBrightness: (hexColor: string, adjustPercent: number) => string | undefined;
+export declare const HSBToRGB: (hue: number, saturation: number, brightness: number) => number[];
+export declare const RGBToHSB: (r: number, g: number, b: number) => number[];
+export declare const hexToHSL: (H: any) => number[];
+export declare function hlsToHex(h: number, s: number, l: number): string[];
+export declare const colorContrast: (color: string) => string;
+export declare const brightness: (color: string) => number;
+export declare const rgbToHex: (r: number, g: number, b: number) => string;
+/**
+ * Darkens the color following a linear distorsion
+ * @param hex Color in hexadecimal format, beginning with the # character
+ * @param darkPercentage dark percentage (bewteen 0 and 1, 0 beeing the same color, 1 beeing black)
+ * @returns hexadecimal color
+ */
+export declare const getDarkShade: (hex: string, darkPercentage: number) => string;
+/**
+ * Lightens the color following a linear distorsion
+ * @param hex Color in hexadecimal format, beginning with the # character
+ * @param lightPercentage light percentage (bewteen 0 and 1, 0 beeing the same color, 1 beeing white)
+ * @returns hexadecimal color
+ */
+export declare const getLightShade: (hex: string, lightPercentage: number) => string;
 export type MessageType = 'success' | 'error' | 'warning';
 export declare const MessageColor: {
     readonly success: "green";

package/dist/src/utils/utils.date.d.ts

@@ -8,6 +8,7 @@ export interface extractDateProps {
 }
 export type DateFormat = 'date' | 'date-time' | 'date-time-sec' | 'time' | 'time-sec';
 type DateArgs = number | string | Date;
+export declare const padDate: (n: number) => string;
 export declare const extractDate: (str?: DateArgs) => extractDateProps;
 /**
  * Format date to YYYY-MM-DD

package/dist/src/utils/utils.files.d.ts

@@ -5,7 +5,7 @@ export declare function fileAvatar(mimetype: string): {
         light: string;
         dark: string;
     };
-    ext: "jpeg" | "png" | "jpg";
+    ext: "jpg" | "jpeg" | "png";
 } | {
     ext: "gif";
     path: string;

package/dist/src/utils/utils.form.d.ts

@@ -1,2 +1,4 @@
+import { Audience, AudienceAutocomplete, jFolderLittle } from 'jamespot-user-api';
 import { ValidationRule } from 'react-hook-form';
 export declare const formRuleMaxLength: (rule: ValidationRule<number> | undefined) => number | undefined;
+export declare const audienceToAutocomplete: (audience: Array<Audience | jFolderLittle>) => AudienceAutocomplete[];

package/dist/src/utils/utils.image.d.ts

@@ -1,3 +1,4 @@
+import { Model } from 'jamespot-user-api';
 export declare const getExtensionFromName: (name: string) => string;
 export declare function getIconExtensionFile(fileName: string, basePath: string): {
     path: string;
@@ -7,3 +8,5 @@ export declare function getIconExtensionFile(fileName: string, basePath: string)
         dark: string;
     };
 };
+export declare const imgCache: (type: string, id: number, date: string | null, size?: string) => string;
+export declare const imgStatic: (model: Model | undefined, date: string | null, size?: string) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jamespot-react-components",
-  "version": "1.3.46",
+  "version": "1.3.48",
   "description": "",
   "main": "dist/jamespot-react-components.js",
   "module": "dist/jamespot-react-components.mjs",
@@ -78,7 +78,7 @@
     "globals": "^16.5.0",
     "html2canvas": "^1.4.1",
     "husky": "^9.1.7",
-    "jamespot-user-api": "^1.3.46",
+    "jamespot-user-api": "^1.3.48",
     "jest": "^30.2.0",
     "jest-environment-jsdom": "^30.2.0",
     "knip": "^5.82.1",

package/scripts/generate.ts

@@ -0,0 +1,121 @@
+/* eslint-disable no-console */
+import fs from 'fs';
+import path from 'path';
+
+// Lightweight arg parsing
+const args = process.argv.slice(2);
+if (args.length < 2) {
+    console.error('Usage: npx tsx generate.ts <stories> <path-to-component>');
+    process.exit(1);
+}
+
+const mode = args[0];
+const targetPath = args[1];
+
+const OPENAI_API_KEY = process.env.OPENAI_API_KEY;
+if (!OPENAI_API_KEY) {
+    console.error('Please set OPENAI_API_KEY in environment.');
+    process.exit(1);
+}
+
+const MODEL = process.env.OPENAI_MODEL ?? 'gpt-4o-mini';
+
+function readFileOrThrow(p: string) {
+    try {
+        return fs.readFileSync(p, 'utf8');
+    } catch (err) {
+        console.error(`Cannot read file ${p}`, err);
+        process.exit(1);
+    }
+}
+
+async function callOpenAI(prompt: string) {
+    const body = {
+        model: MODEL,
+        messages: [{ role: 'user', content: prompt }],
+        temperature: 0.0,
+        max_tokens: 2000,
+    };
+
+    const res = await fetch('https://api.openai.com/v1/chat/completions', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+            Authorization: `Bearer ${OPENAI_API_KEY}`,
+        },
+        body: JSON.stringify(body),
+    });
+
+    if (!res.ok) {
+        const text = await res.text();
+        throw new Error(`OpenAI API error: ${res.status} ${text}`);
+    }
+    const json = await res.json();
+    return json.choices[0].message.content as string;
+}
+
+async function generateStoriesForComponent(componentFilePath: string, storiesFilePath?: string) {
+    const compText = readFileOrThrow(componentFilePath);
+    let prompt;
+    if (storiesFilePath && fs.existsSync(storiesFilePath)) {
+        const storiesText = readFileOrThrow(storiesFilePath);
+        prompt = `Tu es un assistant qui transforme des fichiers Storybook (.stories.tsx) et qui y ajoute des tests (play) pour un composant React.\n\n
+                    Composant:\n\n
+                    ${compText}\n\n
+                    Storybook Stories:\n\n
+                    ${storiesText}\n\n
+                    Part du fichier de stories :\n
+                    - Change les meta (pour rajouter le tags: ['testing'] et aussi changer le title basé sur le chemin avec comme prefix generate/),\n
+                    - complete les stories s'il manque de la couverture de props clés,\n
+                    - pour chaque story une fonction 'play' qui teste le comportement (getByRole/getByText, userEvent, expect),\n
+                    - imports nécessaires (storybook/test, action, etc.),\n
+                    - parameters: { mode: 'test' } pour les stories de test.\n\n
+                    - le code/commentaire doivent être en anglais.\n\n
+                    Fournis uniquement le contenu du fichier .stories.tsx sans explications sans zone de code "\`\`\`tsx" ton résultat doit pouvoir être sauvegarder dans le fichier directement sans transformation.`;
+    } else {
+        prompt = `Tu es un assistant qui génère des fichiers Storybook (.stories.tsx) avec tests (play) pour un composant React.\n\n
+                    Composant:\n\n
+                    ${compText}\n\n
+                    Génère un fichier .stories.tsx complet qui expose :\n
+                    - un export default meta (title basé sur le chemin),\n
+                    - au moins 2-4 stories pertinentes couvrant props clés (args),\n
+                    - pour chaque story une fonction 'play' qui teste le comportement (getByRole/getByText, userEvent, expect),\n
+                    - imports nécessaires (storybook/test, action, etc.),\n
+                    - parameters: { mode: 'test' } pour les stories de test.\n\n
+                    - le code/commentaire doivent être en anglais.\n\n
+                    Fournis uniquement le contenu du fichier .stories.tsx sans explications sans zone de code "\`\`\`tsx" ton résultat doit pouvoir être sauvegarder dans le fichier directement sans transformation.`;
+    }
+    const storiesSampleText = readFileOrThrow('../src/components/JRCButton/JRCButton.stories.tsx');
+    prompt += `\n\n
+                    Le fichier de stories doit être compatible avec Storybook 7.0 et React 18\n\n
+                    Voici un exemple de fichier de stories qu'on souhaite:\n\n
+                    ${storiesSampleText}
+                `;
+    return await callOpenAI(prompt);
+}
+
+async function modeStories(componentFilePath: string) {
+    const abs = path.resolve(componentFilePath);
+    const dir = path.dirname(abs);
+    const base = path.basename(abs).replace(/\.tsx?$/, '');
+    const storiesFilePath = path.join(dir, `${base}.stories.tsx`);
+
+    console.log('Generating .stories.tsx for', abs);
+    const storiesText = await generateStoriesForComponent(componentFilePath, storiesFilePath);
+
+    fs.writeFileSync(storiesFilePath, storiesText, 'utf8');
+    console.log(`Wrote story file to ${storiesFilePath}`);
+}
+
+(async () => {
+    try {
+        if (mode === 'stories') await modeStories(targetPath);
+        else {
+            console.error('Unknown mode. Use `stories`');
+            process.exit(1);
+        }
+    } catch (err: any) {
+        console.error('Error:', err.message ?? err);
+        process.exit(1);
+    }
+})();

package/dist/src/styles/utils.d.ts

@@ -1,32 +0,0 @@
-export declare const hexToRgb: (hex: string) => {
-    r: number;
-    g: number;
-    b: number;
-};
-/**
- * Darkens the color following a linear distorsion
- * @param hex Color in hexadecimal format, beginning with the # character
- * @param darkPercentage dark percentage (bewteen 0 and 1, 0 beeing the same color, 1 beeing black)
- * @returns hexadecimal color
- */
-export declare const getDarkShade: (hex: string, darkPercentage: number) => string;
-/**
- * Lightens the color following a linear distorsion
- * @param hex Color in hexadecimal format, beginning with the # character
- * @param lightPercentage light percentage (bewteen 0 and 1, 0 beeing the same color, 1 beeing white)
- * @returns hexadecimal color
- */
-export declare const getLightShade: (hex: string, lightPercentage: number) => string;
-/**
- * @param hexColor a color in the format #XXX or #XXXXXX
- * @param adjustPercent a number between -1 and 1, <0 for darkening, >0 for lightening
- * @returns a string of the form #XXXXXX representing the modified color. Returns undefined if parameters are invalid.
- */
-export declare const modifyColorBrightness: (hexColor: string, adjustPercent: number) => string | undefined;
-export declare const HSBToRGB: (hue: number, saturation: number, brightness: number) => number[];
-export declare const RGBToHSB: (r: number, g: number, b: number) => number[];
-export declare const hexToHSL: (H: any) => number[];
-export declare function hlsToHex(h: number, s: number, l: number): string[];
-export declare const colorContrast: (color: string) => string;
-export declare const brightness: (color: string) => number;
-export declare const rgbToHex: (r: number, g: number, b: number) => string;