Fix test error

site/source/components/EngineValue.tsx

@@ -20,7 +20,7 @@ export type ValueProps<Names extends string> = {
 	precision?: number
 	linkToRule?: boolean
 	flashOnChange?: boolean
-} & React.HTMLProps<HTMLSpanElement>
+} & React.HTMLAttributes<HTMLSpanElement>
 
 export default function Value<Names extends string>({
 	expression,
@@ -48,7 +48,8 @@ export default function Value<Names extends string>({
 		displayedUnit,
 		language,
 		precision,
-	})
+	}) as string
+
 	if (isRule && linkToRule) {
 		return (
 			<RuleLink dottedName={expression as DottedName}>

site/source/components/conversation/ChoicesInput.tsx

@@ -1,6 +1,5 @@
 import { useDebounce } from '@/components/utils'
 import Emoji from '@/components/utils/Emoji'
-import { Markdown } from '@/components/utils/markdown'
 import {
 	Radio,
 	RadioCard,
@@ -8,7 +7,6 @@ import {
 	RadioGroup,
 	ToggleGroup,
 } from '@/design-system'
-import ButtonHelp from '@/design-system/buttons/ButtonHelp'
 import { Item, Select } from '@/design-system/field/Select'
 import { Spacing } from '@/design-system/layout'
 import { H4 } from '@/design-system/typography/heading'
@@ -17,6 +15,7 @@ import { EvaluatedNode, RuleNode, serializeEvaluation } from 'publicodes'
 import {
 	createContext,
 	Fragment,
+	Key,
 	useCallback,
 	useContext,
 	useEffect,
@@ -24,7 +23,6 @@ import {
 } from 'react'
 import { Trans } from 'react-i18next'
 import styled from 'styled-components'
-import { useEngine } from '../utils/EngineContext'
 import { ExplicableRule } from './Explicable'
 import { InputProps } from './RuleInput'
 
@@ -121,7 +119,7 @@ export function MultipleAnswerInput<Names extends string = DottedName>({
 	return (
 		<Component onChange={handleChange} value={currentSelection ?? undefined}>
 			<RadioChoice
-				autoFocus={defaultValue && props.autoFocus}
+				autoFocus={props.autoFocus ? defaultValue : undefined}
 				choice={choice}
 				rootDottedName={props.dottedName}
 			/>
@@ -240,8 +238,8 @@ export function useSelection<Names extends string = DottedName>({
 		missing ? null : defaultValue
 	)
 	const handleChange = useCallback(
-		(value: string) => {
-			setCurrentSelection(value)
+		(value: Key) => {
+			setCurrentSelection(value.toString())
 		},
 		[setCurrentSelection]
 	)

site/source/pages/gerer/declaration-revenu-independants/declaration.tsx

@@ -14,21 +14,29 @@ import { H2, H3, H4 } from '@/design-system/typography/heading'
 import { Link } from '@/design-system/typography/link'
 import { Li, Ol } from '@/design-system/typography/list'
 import { Body, Intro, SmallBody } from '@/design-system/typography/paragraphs'
+import { getMeta } from '@/utils'
 import { Grid } from '@mui/material'
 import { Item } from '@react-stately/collections'
-import { RuleNode } from 'publicodes'
+import { Rule, RuleNode } from 'publicodes'
 import { useContext, useMemo } from 'react'
 import { Trans } from 'react-i18next'
 import styled, { css } from 'styled-components'
 import { SimpleField } from '../_components/Fields'
 import { useProgress } from './_components/hooks'
 
+interface Meta {
+	facultatif?: 'oui' | 'non'
+	section?: 'oui' | 'non'
+	affichage?: string
+	cases?: string[] | { défaut: string[] }
+}
+
 export function useObjectifs(): Array<DottedName> {
 	return useLiasseFiscaleFields()
 		.filter(
 			([, rule]) =>
-				rule.rawNode.meta?.facultatif !== 'oui' &&
-				rule.rawNode.meta?.section !== 'oui'
+				getMeta<Meta>(rule.rawNode, {})?.facultatif !== 'oui' &&
+				getMeta<Meta>(rule.rawNode, {})?.section !== 'oui'
 		)
 		.map(([dottedName]) => dottedName)
 }
@@ -202,7 +210,7 @@ function LiasseFiscale() {
 	return (
 		<>
 			{fields.map(([dottedName, rule]) =>
-				rule.rawNode.meta?.section === 'oui' ? (
+				getMeta<Meta>(rule.rawNode, {})?.section === 'oui' ? (
 					<Grid xs={12}>
 						<H3
 							css={`
@@ -227,7 +235,9 @@ function useDéclarationRevenuFields() {
 	const fields = useMemo(
 		() =>
 			Object.entries(engine.getParsedRules())
-				.filter(([, rule]) => rule.rawNode.meta?.affichage !== 'non')
+				.filter(
+					([, rule]) => getMeta<Meta>(rule.rawNode, {})?.affichage !== 'non'
+				)
 				.filter(([dottedName]) =>
 					dottedName.startsWith('DRI . déclaration revenus')
 				)
@@ -250,6 +260,16 @@ function ResultSection() {
 		return null
 	}
 
+	const getCases = (rule: Rule): string[] => {
+		const meta = getMeta<Meta>(rule, {})
+
+		return (
+			(Array.isArray(meta.cases) && meta.cases) ||
+			(typeof meta.cases === 'object' && meta.cases.défaut) ||
+			[]
+		)
+	}
+
 	return (
 		<Container
 			darkMode
@@ -271,7 +291,7 @@ function ResultSection() {
 								justifyContent={'space-between'}
 							>
 								{fields.map(([dottedName, rule]) =>
-									rule.rawNode.meta?.section === 'oui' ? (
+									getMeta<Meta>(rule.rawNode, {})?.section === 'oui' ? (
 										<Grid xs={12}>
 											{rule.dottedName.split(' . ').length === 3 ? (
 												<H3>{rule.title}</H3>
@@ -294,13 +314,7 @@ function ResultSection() {
 											</Grid>
 											<Grid item xs="auto">
 												<Body>
-													<Strong>
-														{
-															(rule.rawNode.meta?.cases.défaut ??
-																rule.rawNode.meta?.cases ??
-																[])[0]
-														}
-													</Strong>
+													<Strong>{getCases(rule.rawNode)[0]}</Strong>
 													<StyledCase>
 														<Value expression={dottedName} linkToRule={false} />
 													</StyledCase>

site/source/pages/gerer/declaration-revenu-independants/imposition.tsx

@@ -13,6 +13,7 @@ import { Strong } from '@/design-system/typography'
 import { H2, H3 } from '@/design-system/typography/heading'
 import { Link } from '@/design-system/typography/link'
 import { Body, Intro, SmallBody } from '@/design-system/typography/paragraphs'
+import { getMeta } from '@/utils'
 import { Grid } from '@mui/material'
 import { Item } from '@react-stately/collections'
 import { formatValue } from 'publicodes'
@@ -371,7 +372,11 @@ function LiasseFiscaleTitle() {
 	const liasse = engine.getRule(liasseDottedName)
 
 	return (
-		<FormulaireTitle formulaire={liasse.rawNode.meta?.formulaire ?? ''}>
+		<FormulaireTitle
+			formulaire={
+				getMeta<{ formulaire?: string }>(liasse.rawNode, {}).formulaire ?? ''
+			}
+		>
 			<H3>{liasse.title}</H3>
 		</FormulaireTitle>
 	)

site/source/pages/gerer/declaration-revenu-independants/index.tsx

@@ -1,4 +1,3 @@
-import { DottedName } from '@/../../modele-social'
 import { Condition } from '@/components/EngineValue'
 import PageHeader from '@/components/PageHeader'
 import { useEngine } from '@/components/utils/EngineContext'
@@ -81,7 +80,8 @@ function useSteps() {
 	const step2Progress = useProgress(Step2Objectifs)
 	const step3Progress = useProgress(useStep3Objectifs())
 	const step4Progress = useSimulationProgress()
-	const casExclu = useEngine().evaluate('DRI . cas exclus ').nodeValue
+	const casExclu = useEngine().evaluate('DRI . cas exclus ')
+		.nodeValue as boolean
 
 	return [
 		{

site/source/sitePaths.ts

@@ -120,6 +120,8 @@ const rawSitePathsEn = {
 		index: '/manage',
 		embaucher: '/hiring',
 		sécuritéSociale: '/social-security',
+		'déclaration-charges-sociales-indépendant':
+			'/declaration-social-charges-independent',
 		déclarationIndépendant: {
 			index: '/declaration-aid-independent',
 			imposition: '/taxation',