@inseefr/lunatic 3.0.0-rc.9 → 3.0.0

package/README.md

@@ -22,9 +22,6 @@ 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)
@@ -85,7 +82,7 @@ And it returns an object that allows you to control the questionnaire:
 - `getData()`, returns the collected data in the questionnaire.
 - `loopVariables`, is an array containing the list of variables used for the current loop.
 
-For more information on the types of this return, you can refer to the available types in the [source code](https://github.com/InseeFr/Lunatic/blob/2.7/src/use-lunatic/type.ts). You can also find an example of using the hook in the [Storybook section](https://github.com/InseeFr/Lunatic/blob/2.7/src/stories/utils/orchestrator.jsx#L121-L152).
+For more information on the types of this return, you can refer to the available types in the [source code](https://github.com/InseeFr/Lunatic/blob/3.0/src/use-lunatic/type.ts). You can also find an example of using the hook in the [Storybook section](https://github.com/InseeFr/Lunatic/blob/3.0/src/stories/utils/orchestrator.jsx#L121-L152).
 
 ### Components
 
@@ -96,19 +93,19 @@ Lunatic offers a library of pre-designed components to cover the different types
 ```jsx
 import * as lunatic from '@inseefr/lunatic';
 
-function App({ source, data }) {
-	const { getComponents, getCurrentErrors, getModalErrors } =
-		lunatic.useLunatic(source, data, {});
-	const components = getComponents();
-	const currentErrors = getCurrentErrors();
-	const modalErrors = getModalErrors();
-
-	return (
-		<div className="container">
-			<LunaticComponents components={components} />
-			<lunatic.Modal errors={modalErrors} goNext={goNextPage} />
-		</div>
-	);
+function App({source, data}) {
+    const {getComponents, getCurrentErrors, getModalErrors} =
+        lunatic.useLunatic(source, data, {});
+    const components = getComponents();
+    const currentErrors = getCurrentErrors();
+    const modalErrors = getModalErrors();
+
+    return (
+        <div className="container">
+            <LunaticComponents components={components}/>
+            <lunatic.Modal errors={modalErrors} goNext={goNextPageAction}/>
+        </div>
+    );
 }
 ```
 
@@ -116,43 +113,6 @@ All the components offered by Lunatic are available in the [src/components](http
 
 To activate the **autofocus**, you need to pass a key in the `autoFocusKey` property of `LunaticComponents`. As soon as this value changes, the first field is focused (a good solution is to pass the `pageTag` provided by `useLunatic`).
 
-### Workers
-
-#### General
-
-Lunatic uses webWorkers to take the load off the main execution frame (e.g. list search).
-
-Workers are normally installed when the library is installed (postinstall scripts). If this is not the case, you can always manually run the command `npx @inseefr/lunatic workers` at the root of your project to add Lunatic workers to your project.
-
-By default: Lunatic workers are added to the `public/workers` folder of the current project when the library is installed.
-If you want to install inside another folder, just run `npx @inseefr/lunatic workers my-custom-folder`. Workers will be available to the `my-custom-folder/workers` folder of the current project.
-
-If a new version of Lunatic offers new workers, they will be automatically updated.
-This ensures that you always have the right version of workers for the version of Lunatic you're using.
-
-A good practice is to add the `public/workers` folder to your `.gitignore.`
-
-#### How it works
-
-Workers are loaded into the latest version (version `workersVersion` of package.json) of the public `workers` folder.
-
-It's up to you if you want to load them at runtime from another location.
-Simply specify the base url of the workers folder to useLunatic.
-
-For example, if your workers are hosted on the server `http://localhost:9090/static/final-workers`.
-We would then have the workers available at the addresses :
-
-- `http://localhost:9090/static/final-workers/lunatic-append-worker-0.3.0.js`
-- `http://localhost:9090/static/final-workers/lunatic-label-worker-0.3.0.js`
-- `http://localhost:9090/static/final-workers/lunatic-search-worker-0.3.0.js`
-
-You'll need to specify the `workersBasePath` props in the useLunatic:
-
-```js
-const { getComponents } = useLunatic(source, data,
- { features, preferences, ..., workersBasePath: 'http://localhost:9090/static/final-workers' })
-```
-
 ## Customization
 
 By default, the components offered by Lunatic are quite simple with a minimal style. You can customize the fields with your own CSS, but for more complex cases, you can also replace the basic components using the `custom` property that you can pass when calling `useLunatic`.
@@ -176,13 +136,13 @@ This section covers the internal working of the `useLunatic()` hook. The goal is
 
 ### General Functioning
 
-The hook is based on an [internal state](https://github.com/InseeFr/Lunatic/blob/2.7/src/use-lunatic/type.ts#L79-L187) that is updated through a [reducer](https://reactjs.org/docs/hooks-reference.html#usereducer) system. The [actions](https://github.com/InseeFr/Lunatic/blob/2.7/src/use-lunatic/actions.ts) affecting this state are limited:
+The hook is based on an [internal state](https://github.com/InseeFr/Lunatic/blob/3.0/src/use-lunatic/type.ts#L79-L187) that is updated through a [reducer](https://reactjs.org/docs/hooks-reference.html#usereducer) system. The [actions](https://github.com/InseeFr/Lunatic/blob/3.0/src/use-lunatic/actions.ts) affecting this state are limited:
 
 - An action `'use-lunatic/on-init'` allows initialization of the state from the data received as a parameter of the hook.
 - The actions `'use-lunatic/go-previous'`, `'use-lunatic/go-next'`, and `'use-lunatic/go-to-page'` are called during navigation using the methods returned by the hook.
 - The action `use-lunatic/handle-change` is the most important action and is called whenever data is changed in the questionnaire.
 
-All the [reducers corresponding to these actions are available here](https://github.com/InseeFr/Lunatic/blob/2.7/src/use-lunatic/reducer/reducer.ts). Generally, they are broken down into several methods depending on the part of the state they modify.
+All the [reducers corresponding to these actions are available here](https://github.com/InseeFr/Lunatic/blob/3.0/src/use-lunatic/reducer/reducer.ts). Generally, they are broken down into several methods depending on the part of the state they modify.
 
 ### Pages and Pager
 
@@ -190,7 +150,7 @@ At initialization, the questionnaire scenario is modeled as an object which is s
 
 ### VTL Execution
 
-Another important point of Lunatic is the execution of VTL expressions which allow making certain properties dynamic (labels, errors, etc.). This filling is done [when the state changes](https://github.com/InseeFr/Lunatic/blob/2.7/src/use-lunatic/commons/use-components-from-state.ts).
+Another important point of Lunatic is the execution of VTL expressions which allow making certain properties dynamic (labels, errors, etc.). This filling is done [when the state changes](https://github.com/InseeFr/Lunatic/blob/3.0/src/use-lunatic/use-lunatic.ts#L162).
 
 To facilitate expression execution, an `executeExpression()` method is exposed in the Lunatic state. This method is accompanied by an `updateBindings()` method which allows updating internal values. This expression execution system uses a memoization system to not re-execute the same expression multiple times. When the `use-lunatic/handle-change` action is executed, the values ("bindings") are updated to memorize the values associated with the different VTL variables. Similarly, the values of calculated variables on which the modified variable depends are forgotten to refresh the value during the next execution.
 
@@ -198,9 +158,9 @@ To facilitate expression execution, an `executeExpression()` method is exposed i
 
 ### Stable Branchs
 
-- Stable branches follow the glob pattern `'2.*'`, like `2.6` or `2.7`.
+- Stable branches follow the glob pattern `'2.*'` or `'3.*'`, like `2.7` or `3.0`.
 - We can maintain if needs, the old stable branches
-- `2.7` branch is currently the most advanced branch
+- `3.0` branch is currently the most advanced branch
 
 ### Commits and feature branches
 

package/lib/components/CheckboxBoolean/CheckboxBoolean.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import type { LunaticComponentProps } from '../type';
+import type { LunaticError } from '../../use-lunatic/type';
+export declare function CheckboxBoolean({ handleChanges, response, errors, value, ...props }: LunaticComponentProps<'CheckboxBoolean'>): import("react/jsx-runtime").JSX.Element;
+type CustomProps = Omit<LunaticComponentProps<'CheckboxBoolean'>, 'response' | 'handleChanges' | 'errors' | 'value'> & {
+    onChange: () => void;
+    errors?: LunaticError[];
+    checked?: boolean;
+};
+export declare const CustomCheckboxBoolean: import("react").ComponentType<CustomProps>;
+export {};

package/lib/components/CheckboxBoolean/CheckboxBoolean.js

@@ -1,65 +1,19 @@
-"use strict";
-
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CheckboxBoolean = CheckboxBoolean;
-exports.CustomCheckboxBoolean = void 0;
-var _ComponentErrors = require("../shared/ComponentErrors/ComponentErrors");
-var _CheckboxOption = require("../shared/Checkbox/CheckboxOption");
-var _slottableComponent = require("../shared/HOC/slottableComponent");
-var _Declarations = require("../shared/Declarations/Declarations");
-var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["handleChange", "response", "errors", "value"];
-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; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-function CheckboxBoolean(_ref) {
-  var handleChange = _ref.handleChange,
-    response = _ref.response,
-    errors = _ref.errors,
-    value = _ref.value,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var checked = !!value;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomCheckboxBoolean, _objectSpread(_objectSpread({}, props), {}, {
-    checked: checked,
-    onChange: function onChange() {
-      return handleChange(response, !checked);
-    },
-    errors: (0, _ComponentErrors.getComponentErrors)(errors, props.id)
-  }));
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { ComponentErrors, getComponentErrors, } from '../shared/ComponentErrors/ComponentErrors';
+import { CheckboxOption } from '../shared/Checkbox/CheckboxOption';
+import { slottableComponent } from '../shared/HOC/slottableComponent';
+import { Declarations } from '../shared/Declarations/Declarations';
+export function CheckboxBoolean({ handleChanges, response, errors, value, ...props }) {
+    const checked = !!value;
+    return (_jsx(CustomCheckboxBoolean, { ...props, checked: checked, onChange: () => handleChanges([
+            {
+                name: response.name,
+                value: !checked,
+            },
+        ]), errors: getComponentErrors(errors, props.id) }));
 }
-var CustomCheckboxBoolean = exports.CustomCheckboxBoolean = (0, _slottableComponent.slottableComponent)('CheckboxBoolean', function (props) {
-  var disabled = props.disabled,
-    checked = props.checked,
-    id = props.id,
-    onChange = props.onChange,
-    label = props.label,
-    declarations = props.declarations,
-    description = props.description,
-    errors = props.errors;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: "lunatic-checkbox-boolean",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxOption.CheckboxOption, {
-      disabled: disabled,
-      checked: checked,
-      id: id,
-      onClick: onChange,
-      label: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [label, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Declarations.Declarations, {
-          type: "AFTER_QUESTION_TEXT",
-          declarations: declarations
-        })]
-      }),
-      description: description,
-      invalid: !!errors
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ComponentErrors.ComponentErrors, {
-      errors: errors
-    })]
-  });
-});
+export const CustomCheckboxBoolean = slottableComponent('CheckboxBoolean', (props) => {
+    const { disabled, checked, id, onChange, label, declarations, description, errors, } = props;
+    return (_jsxs("div", { className: "lunatic-checkbox-boolean", children: [_jsx(CheckboxOption, { disabled: disabled, checked: checked, id: id, onClick: onChange, label: _jsxs(_Fragment, { children: [label, _jsx(Declarations, { type: "AFTER_QUESTION_TEXT", declarations: declarations })] }), description: description, invalid: !!errors }), _jsx(ComponentErrors, { errors: errors })] }));
+});
+//# sourceMappingURL=CheckboxBoolean.js.map

package/lib/components/CheckboxBoolean/CheckboxBoolean.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxBoolean.js","sourceRoot":"","sources":["../../../src/components/CheckboxBoolean/CheckboxBoolean.tsx"],"names":[],"mappings":";AACA,OAAO,EACN,eAAe,EACf,kBAAkB,GAClB,MAAM,2CAA2C,CAAC;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAGnE,MAAM,UAAU,eAAe,CAAC,EAC/B,aAAa,EACb,QAAQ,EACR,MAAM,EACN,KAAK,EACL,GAAG,KAAK,EACkC;IAC1C,MAAM,OAAO,GAAG,CAAC,CAAC,KAAK,CAAC;IACxB,OAAO,CACN,KAAC,qBAAqB,OACjB,KAAK,EACT,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,EAAE,CACd,aAAa,CAAC;YACb;gBACC,IAAI,EAAE,QAAQ,CAAC,IAAI;gBACnB,KAAK,EAAE,CAAC,OAAO;aACf;SACD,CAAC,EAEH,MAAM,EAAE,kBAAkB,CAAC,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,GAC3C,CACF,CAAC;AACH,CAAC;AAWD,MAAM,CAAC,MAAM,qBAAqB,GAAG,kBAAkB,CACtD,iBAAiB,EACjB,CAAC,KAAK,EAAE,EAAE;IACT,MAAM,EACL,QAAQ,EACR,OAAO,EACP,EAAE,EACF,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,WAAW,EACX,MAAM,GACN,GAAG,KAAK,CAAC;IACV,OAAO,CACN,eAAK,SAAS,EAAC,0BAA0B,aACxC,KAAC,cAAc,IACd,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,EAAE,EACN,OAAO,EAAE,QAAQ,EACjB,KAAK,EACJ,8BACE,KAAK,EACN,KAAC,YAAY,IACZ,IAAI,EAAC,qBAAqB,EAC1B,YAAY,EAAE,YAAY,GACzB,IACA,EAEJ,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,CAAC,CAAC,MAAM,GAChB,EACF,KAAC,eAAe,IAAC,MAAM,EAAE,MAAM,GAAI,IAC9B,CACN,CAAC;AACH,CAAC,CACD,CAAC"}

package/lib/components/CheckboxBoolean/CheckboxBoolean.spec.js

@@ -1,71 +1,37 @@
-"use strict";
-
-var _react = require("@testing-library/react");
-var _CheckboxBoolean = require("./CheckboxBoolean");
-var _vitest = require("vitest");
-var _jsxRuntime = require("react/jsx-runtime");
-(0, _vitest.describe)('CheckboxBoolean', function () {
-  var label = 'I accept the terms and conditions';
-  var description = 'You must accept the terms and conditions to continue.';
-  var handleChange = _vitest.vi.fn();
-  var response = {
-    name: 'demo'
-  };
-  (0, _vitest.afterEach)(function () {
-    _vitest.vi.resetAllMocks();
-  });
-  (0, _vitest.it)('renders label ', function () {
-    var _render = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxBoolean.CheckboxBoolean, {
-        id: "checkbox",
-        label: label,
-        value: true,
-        handleChange: handleChange,
-        response: response
-      })),
-      getByText = _render.getByText;
-    (0, _vitest.expect)(getByText(label)).toBeInTheDocument();
-  });
-  (0, _vitest.it)('renders unchecked checkbox', function () {
-    var _render2 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxBoolean.CheckboxBoolean, {
-        id: "checkbox",
-        label: label,
-        description: description,
-        value: false,
-        handleChange: handleChange,
-        response: response
-      })),
-      getByRole = _render2.getByRole;
-    var checkbox = getByRole('checkbox');
-    (0, _vitest.expect)(checkbox).not.toBeChecked();
-    (0, _vitest.expect)(checkbox).toBeEnabled();
-  });
-  (0, _vitest.it)('renders checked checkbox', function () {
-    var _render3 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxBoolean.CheckboxBoolean, {
-        id: 'checkbox',
-        label: label,
-        description: description,
-        value: true,
-        handleChange: handleChange,
-        response: response
-      })),
-      getByRole = _render3.getByRole;
-    var checkbox = getByRole('checkbox');
-    (0, _vitest.expect)(checkbox).toBeChecked();
-    (0, _vitest.expect)(checkbox).toBeEnabled();
-  });
-  (0, _vitest.it)('calls onClick when checkbox is clicked', function () {
-    var _render4 = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxBoolean.CheckboxBoolean, {
-        id: "checkbox",
-        label: label,
-        description: description,
-        value: false,
-        handleChange: handleChange,
-        response: response
-      })),
-      getByRole = _render4.getByRole;
-    var checkbox = getByRole('checkbox');
-    _react.fireEvent.click(checkbox);
-    (0, _vitest.expect)(handleChange).toHaveBeenCalledTimes(1);
-    (0, _vitest.expect)(handleChange).toHaveBeenCalledWith(response, true);
-  });
-});
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, fireEvent } from '@testing-library/react';
+import { CheckboxBoolean } from './CheckboxBoolean';
+import { describe, it, expect, vi, afterEach } from 'vitest';
+describe('CheckboxBoolean', () => {
+    const label = 'I accept the terms and conditions';
+    const description = 'You must accept the terms and conditions to continue.';
+    const handleChanges = vi.fn();
+    const response = { name: 'demo' };
+    afterEach(() => {
+        vi.resetAllMocks();
+    });
+    it('renders label ', () => {
+        const { getByText } = render(_jsx(CheckboxBoolean, { id: "checkbox", label: label, value: true, handleChanges: handleChanges, response: response }));
+        expect(getByText(label)).toBeInTheDocument();
+    });
+    it('renders unchecked checkbox', () => {
+        const { getByRole } = render(_jsx(CheckboxBoolean, { id: "checkbox", label: label, description: description, value: false, handleChanges: handleChanges, response: response }));
+        const checkbox = getByRole('checkbox');
+        expect(checkbox).not.toBeChecked();
+        expect(checkbox).toBeEnabled();
+    });
+    it('renders checked checkbox', () => {
+        const { getByRole } = render(_jsx(CheckboxBoolean, { id: 'checkbox', label: label, description: description, value: true, handleChanges: handleChanges, response: response }));
+        const checkbox = getByRole('checkbox');
+        expect(checkbox).toBeChecked();
+        expect(checkbox).toBeEnabled();
+    });
+    it('calls onClick when checkbox is clicked', () => {
+        const { getByRole } = render(_jsx(CheckboxBoolean, { id: "checkbox", label: label, description: description, value: false, handleChanges: handleChanges, response: response }));
+        const checkbox = getByRole('checkbox');
+        fireEvent.click(checkbox);
+        expect(handleChanges).toHaveBeenCalledTimes(1);
+        expect(handleChanges).toHaveBeenCalledWith([{ ...response, value: true }]);
+    });
+});
+//# sourceMappingURL=CheckboxBoolean.spec.js.map

package/lib/components/CheckboxBoolean/CheckboxBoolean.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxBoolean.spec.js","sourceRoot":"","sources":["../../../src/components/CheckboxBoolean/CheckboxBoolean.spec.tsx"],"names":[],"mappings":"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"}

package/lib/components/CheckboxGroup/CheckboxGroup.d.ts

@@ -0,0 +1,11 @@
+import { type ReactNode } from 'react';
+import type { LunaticComponentProps } from '../type';
+export type CheckboxGroupOption = {
+    id: string;
+    label: ReactNode;
+    name: string;
+    checked: boolean;
+    description?: ReactNode;
+    onClick: (b: boolean) => void;
+};
+export declare function CheckboxGroup({ id, value, responses, shortcut, readOnly, disabled, handleChanges, errors, label, description, declarations, }: LunaticComponentProps<'CheckboxGroup'>): import("react/jsx-runtime").JSX.Element;

package/lib/components/CheckboxGroup/CheckboxGroup.js

@@ -1,51 +1,27 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CheckboxGroup = CheckboxGroup;
-var _CustomCheckboxGroup = require("./CustomCheckboxGroup");
-var _ComponentErrors = require("../shared/ComponentErrors/ComponentErrors");
-var _jsxRuntime = require("react/jsx-runtime");
-function CheckboxGroup(_ref) {
-  var id = _ref.id,
-    value = _ref.value,
-    responses = _ref.responses,
-    shortcut = _ref.shortcut,
-    handleChange = _ref.handleChange,
-    errors = _ref.errors,
-    label = _ref.label,
-    description = _ref.description;
-  var options = responses.map(function (_ref2) {
-    var label = _ref2.label,
-      response = _ref2.response,
-      description = _ref2.description,
-      id = _ref2.id;
-    var name = response.name;
-    return {
-      label: label,
-      name: name,
-      id: id,
-      checked: castValueToBoolean(value, name),
-      description: description,
-      onClick: function onClick(checked) {
-        handleChange(response, checked);
-      }
-    };
-  });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CustomCheckboxGroup.CustomCheckboxGroup, {
-    id: id,
-    description: description,
-    options: options,
-    label: label,
-    errors: (0, _ComponentErrors.getComponentErrors)(errors, id),
-    shortcut: shortcut
-  });
+import { jsx as _jsx } from "react/jsx-runtime";
+import {} from 'react';
+import { CustomCheckboxGroup } from './CustomCheckboxGroup';
+import { getComponentErrors } from '../shared/ComponentErrors/ComponentErrors';
+export function CheckboxGroup({ id, value, responses, shortcut, readOnly, disabled, handleChanges, errors, label, description, declarations, }) {
+    const options = responses.map(({ label, response, description, id }) => {
+        const { name } = response;
+        return {
+            label,
+            name,
+            id,
+            checked: castValueToBoolean(value, name),
+            description,
+            onClick: function (checked) {
+                handleChanges([{ name: response.name, value: checked }]);
+            },
+        };
+    });
+    return (_jsx(CustomCheckboxGroup, { id: id, description: description, options: options, label: label, errors: getComponentErrors(errors, id), shortcut: shortcut, disabled: disabled, readOnly: readOnly, declarations: declarations }));
 }
 function castValueToBoolean(value, name) {
-  if (value && name in value) {
-    var _value$name;
-    return (_value$name = value[name]) !== null && _value$name !== void 0 ? _value$name : false;
-  }
-  return false;
-}
+    if (value && name in value) {
+        return value[name] ?? false;
+    }
+    return false;
+}
+//# sourceMappingURL=CheckboxGroup.js.map

package/lib/components/CheckboxGroup/CheckboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxGroup.js","sourceRoot":"","sources":["../../../src/components/CheckboxGroup/CheckboxGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAC;AAW/E,MAAM,UAAU,aAAa,CAAC,EAC7B,EAAE,EACF,KAAK,EACL,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,MAAM,EACN,KAAK,EACL,WAAW,EACX,YAAY,GAC4B;IACxC,MAAM,OAAO,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE,EAAE,EAAE,EAAE;QACtE,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,CAAC;QAE1B,OAAO;YACN,KAAK;YACL,IAAI;YACJ,EAAE;YACF,OAAO,EAAE,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC;YACxC,WAAW;YACX,OAAO,EAAE,UAAU,OAAgB;gBAClC,aAAa,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC;YAC1D,CAAC;SACD,CAAC;IACH,CAAC,CAAiC,CAAC;IAEnC,OAAO,CACN,KAAC,mBAAmB,IACnB,EAAE,EAAE,EAAE,EACN,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,kBAAkB,CAAC,MAAM,EAAE,EAAE,CAAC,EACtC,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,GACzB,CACF,CAAC;AACH,CAAC;AAED,SAAS,kBAAkB,CAC1B,KAAsD,EACtD,IAAY;IAEZ,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE,CAAC;QAC5B,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,KAAK,CAAC;IAC7B,CAAC;IACD,OAAO,KAAK,CAAC;AACd,CAAC"}

package/lib/components/CheckboxGroup/CustomCheckboxGroup.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { LunaticError } from '../../use-lunatic/type';
+import { type CheckboxGroupOption } from './CheckboxGroup';
+import type { LunaticComponentProps } from '../type';
+type Props = Pick<LunaticComponentProps<'CheckboxGroup'>, 'id' | 'label' | 'description' | 'declarations' | 'shortcut' | 'readOnly' | 'disabled'> & {
+    options: CheckboxGroupOption[];
+    errors?: LunaticError[];
+};
+export declare const CustomCheckboxGroup: import("react").ComponentType<Props>;
+export {};

package/lib/components/CheckboxGroup/CustomCheckboxGroup.js

@@ -1,44 +1,14 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import {} from './CheckboxGroup';
+import { slottableComponent } from '../shared/HOC/slottableComponent';
+import { ComponentErrors } from '../shared/ComponentErrors/ComponentErrors';
+import { Fieldset } from '../shared/Fieldset/Fieldset';
+import { CheckboxOption } from '../shared/Checkbox/CheckboxOption';
+import { getShortcutKey } from '../shared/Checkbox/getShortcutKey';
+import { Declarations } from '../shared/Declarations/Declarations';
+export const CustomCheckboxGroup = slottableComponent('CheckboxGroup', ({ options, label, description, errors, shortcut, disabled, readOnly, declarations, }) => {
+    return (_jsxs(Fieldset, { className: "lunatic-checkbox-group", legend: label, description: description, children: [_jsx(Declarations, { type: "AFTER_QUESTION_TEXT", declarations: declarations }), options.map((option, index) => {
+                return (_jsx("div", { className: "lunatic-checkbox-group-option", children: _jsx(CheckboxOption, { ...option, disabled: disabled, readOnly: readOnly, shortcut: shortcut, invalid: !!errors, id: option.id, codeModality: shortcut ? getShortcutKey(index, options.length) : undefined }) }, option.id));
+            }), _jsx(ComponentErrors, { errors: errors })] }));
 });
-exports.CustomCheckboxGroup = void 0;
-var _slottableComponent = require("../shared/HOC/slottableComponent");
-var _ComponentErrors = require("../shared/ComponentErrors/ComponentErrors");
-var _Fieldset = require("../shared/Fieldset/Fieldset");
-var _CheckboxOption = require("../shared/Checkbox/CheckboxOption");
-var _getShortcutKey = require("../shared/Checkbox/getShortcutKey");
-var _jsxRuntime = require("react/jsx-runtime");
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-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; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-var CustomCheckboxGroup = exports.CustomCheckboxGroup = (0, _slottableComponent.slottableComponent)('CheckboxGroup', function (_ref) {
-  var options = _ref.options,
-    id = _ref.id,
-    label = _ref.label,
-    description = _ref.description,
-    errors = _ref.errors,
-    shortcut = _ref.shortcut;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Fieldset.Fieldset, {
-    className: "lunatic-checkbox-group",
-    legend: label,
-    description: description,
-    children: [options.map(function (option, index) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "lunatic-checkbox-group-option",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckboxOption.CheckboxOption, _objectSpread(_objectSpread({}, option), {}, {
-          shortcut: shortcut,
-          invalid: !!errors,
-          id: option.id,
-          codeModality: shortcut ? (0, _getShortcutKey.getShortcutKey)(index, options.length) : undefined
-        }))
-      }, option.id);
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ComponentErrors.ComponentErrors, {
-      errors: errors
-    })]
-  });
-});
+//# sourceMappingURL=CustomCheckboxGroup.js.map

package/lib/components/CheckboxGroup/CustomCheckboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomCheckboxGroup.js","sourceRoot":"","sources":["../../../src/components/CheckboxGroup/CustomCheckboxGroup.tsx"],"names":[],"mappings":";AACA,OAAO,EAA4B,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AAC5E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAEnE,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAgBnE,MAAM,CAAC,MAAM,mBAAmB,GAAG,kBAAkB,CACpD,eAAe,EACf,CAAC,EACA,OAAO,EACP,KAAK,EACL,WAAW,EACX,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,YAAY,GACL,EAAE,EAAE;IACX,OAAO,CACN,MAAC,QAAQ,IACR,SAAS,EAAC,wBAAwB,EAClC,MAAM,EAAE,KAAK,EACb,WAAW,EAAE,WAAW,aAExB,KAAC,YAAY,IAAC,IAAI,EAAC,qBAAqB,EAAC,YAAY,EAAE,YAAY,GAAI,EACtE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;gBAC9B,OAAO,CACN,cAAK,SAAS,EAAC,+BAA+B,YAC7C,KAAC,cAAc,OACV,MAAM,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,CAAC,MAAM,EACjB,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,YAAY,EACX,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,GAE5D,IAXiD,MAAM,CAAC,EAAE,CAYvD,CACN,CAAC;YACH,CAAC,CAAC,EACF,KAAC,eAAe,IAAC,MAAM,EAAE,MAAM,GAAI,IACzB,CACX,CAAC;AACH,CAAC,CACD,CAAC"}

package/lib/components/CheckboxGroup/CustomCheckboxGroup.spec.js

@@ -1,46 +1,45 @@
-"use strict";
-
-var _react = require("@testing-library/react");
-var _vitest = require("vitest");
-var _CustomCheckboxGroup = require("./CustomCheckboxGroup");
-var _jsxRuntime = require("react/jsx-runtime");
-(0, _vitest.describe)('CheckboxGroupContent', function () {
-  var options = [{
-    id: '1',
-    label: 'Option 1',
-    checked: false,
-    name: 'option1',
-    onClick: _vitest.vi.fn()
-  }, {
-    id: '2',
-    label: 'Option 2',
-    checked: true,
-    name: 'option2',
-    onClick: _vitest.vi.fn()
-  }, {
-    id: '3',
-    label: 'Option 3',
-    checked: false,
-    name: 'option3',
-    onClick: _vitest.vi.fn()
-  }];
-  (0, _vitest.it)('calls onClick callback when an option is clicked', function () {
-    var _render = (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_CustomCheckboxGroup.CustomCheckboxGroup, {
-        options: options,
-        id: "test-checkbox-group"
-      })),
-      getByLabelText = _render.getByLabelText;
-    var option1 = getByLabelText('Option 1');
-    var option2 = getByLabelText('Option 2');
-    var option3 = getByLabelText('Option 3');
-    _react.fireEvent.click(option1);
-    (0, _vitest.expect)(options[0].onClick).toHaveBeenCalledTimes(1);
-    (0, _vitest.expect)(options[0].onClick).toHaveBeenCalledWith(true);
-    _react.fireEvent.click(option2);
-    (0, _vitest.expect)(options[1].onClick).toHaveBeenCalledTimes(1);
-    (0, _vitest.expect)(options[1].onClick).toHaveBeenCalledWith(false);
-    _react.fireEvent.click(option3);
-    (0, _vitest.expect)(options[2].onClick).toHaveBeenCalledTimes(1);
-    (0, _vitest.expect)(options[2].onClick).toHaveBeenCalledWith(true);
-  });
-});
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, fireEvent } from '@testing-library/react';
+import { describe, it, expect, vi } from 'vitest';
+import { CustomCheckboxGroup } from './CustomCheckboxGroup';
+describe('CheckboxGroupContent', () => {
+    const options = [
+        {
+            id: '1',
+            label: 'Option 1',
+            checked: false,
+            name: 'option1',
+            onClick: vi.fn(),
+        },
+        {
+            id: '2',
+            label: 'Option 2',
+            checked: true,
+            name: 'option2',
+            onClick: vi.fn(),
+        },
+        {
+            id: '3',
+            label: 'Option 3',
+            checked: false,
+            name: 'option3',
+            onClick: vi.fn(),
+        },
+    ];
+    it('calls onClick callback when an option is clicked', () => {
+        const { getByLabelText } = render(_jsx(CustomCheckboxGroup, { options: options, id: "test-checkbox-group" }));
+        const option1 = getByLabelText('Option 1');
+        const option2 = getByLabelText('Option 2');
+        const option3 = getByLabelText('Option 3');
+        fireEvent.click(option1);
+        expect(options[0].onClick).toHaveBeenCalledTimes(1);
+        expect(options[0].onClick).toHaveBeenCalledWith(true);
+        fireEvent.click(option2);
+        expect(options[1].onClick).toHaveBeenCalledTimes(1);
+        expect(options[1].onClick).toHaveBeenCalledWith(false);
+        fireEvent.click(option3);
+        expect(options[2].onClick).toHaveBeenCalledTimes(1);
+        expect(options[2].onClick).toHaveBeenCalledWith(true);
+    });
+});
+//# sourceMappingURL=CustomCheckboxGroup.spec.js.map