@inseefr/lunatic 2.7.5 → 2.7.7

package/README.fr.md

@@ -13,7 +13,7 @@ Lunatic est une librairie front-end sous forme de hook react et de librairies de
 - [Storybook](https://inseefr.github.io/Lunatic/storybook), branche `main`
 - [Storybook v1](https://inseefr.github.io/Lunatic/storybook-v1), branche `v1-main`
 - [Storybook Beta](https://inseefr.github.io/Lunatic/storybook-beta), branche `develop`
-- [Documentation](https://inseefr.github.io/Lunatic/fr/)
+- [Documentation](https://inseefr.github.io/Lunatic/)
 
 ## Sommaire
 

package/README.md

@@ -13,7 +13,7 @@ Lunatic is a front-end library in the form of a React hook and component librari
 - [Storybook 2.7](https://inseefr.github.io/Lunatic/storybook-2.7), branch `2.7`
 - [Storybook 2.6](https://inseefr.github.io/Lunatic/storybook-2.6), branch `2.6`
 - [Storybook v1](https://inseefr.github.io/Lunatic/storybook-0.3.9), branch `v1-main`
-- [Documentation](https://inseefr.github.io/Lunatic/en/)
+- [Documentation](https://inseefr.github.io/Lunatic/)
 
 ## Table of Contents
 
@@ -22,12 +22,17 @@ Lunatic is a front-end library in the form of a React hook and component librari
   - [Usage](#usage)
     - [The useLunatic Hook](#the-uselunatic-hook)
     - [Components](#components)
+    - [Workers](#workers)
+      - [General](#general)
+      - [How it works](#how-it-works)
   - [Customization](#customization)
   - [Internal Working](#internal-working)
     - [General Functioning](#general-functioning)
     - [Pages and Pager](#pages-and-pager)
     - [VTL Execution](#vtl-execution)
   - [Convention and Best Practices](#convention-and-best-practices)
+    - [Stable Branchs](#stable-branchs)
+    - [Commits and feature branches](#commits-and-feature-branches)
 
 ## Usage
 

package/lib/components/loop/block-for-loop.js

@@ -12,6 +12,7 @@ var _commons = require("../commons");
 var _declarations = require("../declarations");
 var _lunaticComponents = require("../lunatic-components");
 var _loopButton = require("./loop-button");
+var _constant = require("./constant");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -80,6 +81,7 @@ var BlockForLoop = exports.BlockForLoop = (0, _commons.createCustomizableLunatic
       id: id
     }), (0, _array.times)(nbRows, function (n) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_lunaticComponents.LunaticComponents, {
+        blocklist: _constant.blockedInLoopComponents,
         components: getComponents(n),
         componentProps: function componentProps(c) {
           return _objectSpread(_objectSpread(_objectSpread({}, props), c), {}, {

package/lib/components/loop/constant.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.blockedInLoopComponents = void 0;
+/**
+ * List of components blocked in non-paginated loop
+ */
+var blockedInLoopComponents = exports.blockedInLoopComponents = ['RosterForLoop', 'Loop', 'PairwiseLinks', 'Roundabout', 'CheckboxGroup'];

package/lib/components/loop/roster-for-loop/roster-for-loop.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.RosterForLoop = void 0;
 var _react = require("react");
+require("./roster.scss");
 var _declarations = require("../../declarations");
 var _commons = require("../../commons");
 var _loopButton = require("../loop-button");
@@ -14,6 +15,8 @@ var _htmlTable = require("../../commons/components/html-table");
 var _tableHeader = require("../../table/table-header");
 var _array = require("../../../utils/array");
 var _lunaticComponents = require("../../lunatic-components");
+var _constant = require("../constant");
+var _errors = require("../../commons/components/errors/errors");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["value", "lines", "handleChange", "declarations", "label", "headers", "iterations", "id", "getComponents"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -80,6 +83,7 @@ var RosterForLoop = exports.RosterForLoop = (0, _commons.createCustomizableLunat
   if (nbRows === 0) {
     return null;
   }
+  var cols = 0;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_declarations.DeclarationsBeforeText, {
       declarations: declarations,
@@ -95,28 +99,46 @@ var RosterForLoop = exports.RosterForLoop = (0, _commons.createCustomizableLunat
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_htmlTable.Tbody, {
         id: id,
         children: (0, _array.times)(nbRows, function (n) {
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_htmlTable.Tr, {
-            id: props.id,
-            row: n,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_lunaticComponents.LunaticComponents, {
-              components: getComponents(n),
-              componentProps: function componentProps(c) {
-                return _objectSpread(_objectSpread(_objectSpread({}, otherProps), c), {}, {
-                  id: "".concat(c.id, "-").concat(n)
-                });
-              },
-              wrapper: function wrapper(_ref3) {
-                var id = _ref3.id,
-                  children = _ref3.children;
-                return /*#__PURE__*/(0, _jsxRuntime.jsx)(_htmlTable.Td, {
-                  id: "".concat(id, "-").concat(n),
-                  children: children
-                });
-              }
-            })
-          }, n);
+          var components = getComponents(n);
+          var lineErrors = (0, _errors.getComponentErrors)(props.errors, "".concat(id, "-").concat(n));
+          var hasLineErrors = !!(lineErrors !== null && lineErrors !== void 0 && lineErrors.length);
+          cols = components.length;
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_htmlTable.Tr, {
+              id: props.id,
+              row: n,
+              className: hasLineErrors ? 'lunatic-row-has-error' : undefined,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_lunaticComponents.LunaticComponents, {
+                blocklist: _constant.blockedInLoopComponents,
+                components: components,
+                componentProps: function componentProps(c) {
+                  return _objectSpread(_objectSpread(_objectSpread({}, otherProps), c), {}, {
+                    id: "".concat(c.id, "-").concat(n)
+                  });
+                },
+                wrapper: function wrapper(_ref3) {
+                  var id = _ref3.id,
+                    children = _ref3.children;
+                  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_htmlTable.Td, {
+                    id: "".concat(id, "-").concat(n),
+                    children: children
+                  });
+                }
+              })
+            }, n), hasLineErrors && /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {
+              className: "lunatic-errors",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
+                colSpan: cols,
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_commons.Errors, {
+                  errors: lineErrors
+                })
+              })
+            })]
+          });
         })
       })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_commons.Errors, {
+      errors: (0, _errors.getComponentErrors)(props.errors, id)
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_declarations.DeclarationsDetachable, {
       declarations: declarations,
       id: id

package/lib/components/lunatic-components.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LunaticComponents = LunaticComponents;
+exports.hasLabel = hasLabel;
 var _react = require("react");
 var lunaticComponents = _interopRequireWildcard(require("./index"));
 var _useAutoFocus = require("../hooks/use-auto-focus");
@@ -24,6 +25,7 @@ function LunaticComponents(_ref) {
   var components = _ref.components,
     autoFocusKey = _ref.autoFocusKey,
     componentProps = _ref.componentProps,
+    blocklist = _ref.blocklist,
     _ref$wrapper = _ref.wrapper,
     wrapper = _ref$wrapper === void 0 ? function (_ref2) {
       var children = _ref2.children;
@@ -40,21 +42,48 @@ function LunaticComponents(_ref) {
     ref: WrapperComponent === _react.Fragment ? undefined : wrapperRef,
     children: components.map(function (component, k) {
       if ((0, _component.hasComponentType)(component)) {
+        if (blocklist && blocklist.includes(component.componentType)) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
+            children: wrapper(_objectSpread({
+              children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+                style: {
+                  color: 'red'
+                },
+                children: ["Component \"", component.componentType, "\" is not allowed here"]
+              }),
+              index: k
+            }, component))
+          }, computeId(component, k));
+        }
         var _props = _objectSpread(_objectSpread({}, component), componentProps === null || componentProps === void 0 ? void 0 : componentProps(component));
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
           children: wrapper(_objectSpread({
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(LunaticComponent, _objectSpread({}, _props)),
             index: k
           }, _props))
-        }, 'id' in component ? component.id : "index-".concat(k));
+        }, computeId(component, k));
       }
+
       // In some case (table for instance) we have static component that only have a label (no componentType)
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
-        children: wrapper({
-          children: component,
-          index: k
-        })
-      }, "index-".concat(k));
+      if (hasLabel(component)) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
+          children: wrapper(_objectSpread(_objectSpread({}, component), {}, {
+            children: component.label,
+            index: k
+          }))
+        }, k);
+      }
+
+      // Component is a ReactNode
+      if ( /*#__PURE__*/(0, _react.isValidElement)(component)) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
+          children: wrapper({
+            children: component,
+            index: k
+          })
+        }, k);
+      }
+      return null;
     })
   });
 }
@@ -62,4 +91,13 @@ function LunaticComponent(props) {
   // Component is too dynamic to be typed
   var Component = lunaticComponents[props.componentType];
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread({}, props));
+}
+function computeId(component, fallback) {
+  if ('id' in component && typeof component.id === 'string') {
+    return component.id;
+  }
+  return fallback;
+}
+function hasLabel(component) {
+  return !!component && _typeof(component) === 'object' && 'label' in component && /*#__PURE__*/(0, _react.isValidElement)(component.label);
 }

package/lib/components/table/lunatic-table.js

@@ -48,11 +48,15 @@ function LunaticTable(props) {
               components: row,
               wrapper: function wrapper(_ref) {
                 var children = _ref.children,
-                  index = _ref.index;
+                  index = _ref.index,
+                  colspan = _ref.colspan,
+                  rowspan = _ref.rowspan;
                 return /*#__PURE__*/(0, _jsxRuntime.jsx)(_htmlTable.Td, {
                   id: id,
                   row: rowIndex,
                   index: index,
+                  colSpan: colspan,
+                  rowSpan: rowspan,
                   children: children
                 });
               }

package/lib/src/components/datepicker/lunatic-datepicker.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 declare const _default: import("react").ComponentType<import("../type").LunaticBaseProps<string | null> & {
-    dateFormat: "YYYY-MM-DD" | "YYYY-MM" | "YYYY";
+    dateFormat: "YYYY-MM-DD" | "YYYY" | "YYYY-MM";
     min?: string | undefined;
     max?: string | undefined;
     response: {

package/lib/src/components/loop/constant.d.ts

@@ -0,0 +1,4 @@
+/**
+ * List of components blocked in non-paginated loop
+ */
+export declare const blockedInLoopComponents: string[];

package/lib/src/components/loop/roster-for-loop/roster-for-loop.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import './roster.scss';
 /**
  * Loop displayed as a table
  */

package/lib/src/components/lunatic-components.d.ts

@@ -1,15 +1,22 @@
 import { type PropsWithChildren, type ReactElement, type ReactNode } from 'react';
 import type { FilledLunaticComponentProps } from '../use-lunatic/commons/fill-components/fill-components';
-type Props<T extends Record<string, unknown>> = {
-    components: (FilledLunaticComponentProps | ReactElement)[];
+type Props<T extends FilledLunaticComponentProps, V = undefined> = {
+    components: (FilledLunaticComponentProps | ReactElement | {
+        label: string;
+        [key: string]: unknown;
+    })[];
     autoFocusKey?: string;
-    componentProps?: (component: FilledLunaticComponentProps) => T;
-    wrapper?: (props: PropsWithChildren<FilledLunaticComponentProps & T & {
+    componentProps?: (component: FilledLunaticComponentProps) => V;
+    blocklist?: string[];
+    wrapper?: (props: PropsWithChildren<FilledLunaticComponentProps & T & V & {
         index: number;
     }>) => ReactNode;
 };
 /**
  * Entry point for orchestrators, this component display the list of fields
  */
-export declare function LunaticComponents<T extends Record<string, unknown>>({ components, autoFocusKey, componentProps, wrapper, }: Props<T>): import("react/jsx-runtime").JSX.Element;
+export declare function LunaticComponents<T extends FilledLunaticComponentProps, V = undefined>({ components, autoFocusKey, componentProps, blocklist, wrapper, }: Props<T, V>): import("react/jsx-runtime").JSX.Element;
+export declare function hasLabel(component: unknown): component is {
+    label: ReactNode;
+} & FilledLunaticComponentProps;
 export {};

package/lib/src/components/type.d.ts

@@ -124,7 +124,10 @@ type ComponentPropsByType = {
             rowspan?: number;
             colspan?: number;
         }>;
-        body: FilledLunaticComponentProps[][];
+        body: (FilledLunaticComponentProps & {
+            colspan?: number;
+            rowspan?: number;
+        })[][];
         executeExpression: LunaticState['executeExpression'];
         iteration: LunaticState['pager']['iteration'];
     };

package/lib/src/use-lunatic/commons/compile-controls.d.ts

@@ -1,8 +1,9 @@
 import type { LunaticError, LunaticState } from '../type';
 export type StateForControls = Pick<LunaticState, 'pager' | 'pages' | 'isInLoop' | 'executeExpression'>;
-type ControlsResult = {
+/**
+ * Check controls for currently visible components and output errors
+ */
+export declare function compileControls(state: StateForControls): {
     currentErrors: Record<string, LunaticError[]> | undefined;
     isCritical: boolean;
 };
-export declare function compileControls(state: StateForControls): ControlsResult;
-export {};