@cnamts/synapse 1.0.26 → 1.0.27

package/src/composables/useFilterable/useFilterable.ts

@@ -98,16 +98,20 @@ export default function useFilterable(model: Ref<FilterProp>, emits) {
 				= typedValue.from !== undefined && typedValue.to !== undefined
 
 			if (isPeriodField) {
-				if (typedValue.from === null || typedValue.to === null) {
+				const hasFrom = typedValue.from !== null
+				const hasTo = typedValue.to !== null
+
+				if (!hasFrom && !hasTo) {
 					return []
 				}
 
-				return [
-					{
-						text: `${typedValue.from} – ${typedValue.to}`,
-						value: typedValue,
-					},
-				]
+				const text = hasFrom && hasTo
+					? `${typedValue.from} – ${typedValue.to}`
+					: hasFrom
+						? `${typedValue.from} –`
+						: `– ${typedValue.to}`
+
+				return [{ text, value: typedValue }]
 			}
 
 			// Handle single select objects (VSelect with return-object but without multiple)

package/src/composables/useFormFieldErrorHandling.ts

@@ -84,8 +84,8 @@ export const useFormFieldErrorHandling = (
 
 		const result = await validation.validateField(
 			value,
-			[...defaultRules.value, ...props.customRules!],
-			props.customWarningRules!,
+			[...defaultRules.value, ...(props.customRules ?? [])],
+			props.customWarningRules ?? [],
 		)
 
 		return !result.hasError

package/src/composantsVuetify/VBtn/VBtn.mdx

@@ -12,55 +12,25 @@ Pour l'API complète du composant, consulter la [documentation Vuetify](https://
 ## Primary
 
 <div style={{ display: 'flex', flexWrap: 'wrap', gap: '12px', alignItems: 'center', padding: '24px' }}>
-  <Canvas of={VBtnStories.PrimaryElevated} />
-  <Canvas of={VBtnStories.PrimaryOutlined} />
-  <Canvas of={VBtnStories.PrimaryTonal} />
-  <Canvas of={VBtnStories.PrimaryText} />
-</div>
-
-## Primary – Désactivé
-
-<div style={{ display: 'flex', flexWrap: 'wrap', gap: '12px', alignItems: 'center', padding: '24px' }}>
-  <Canvas of={VBtnStories.PrimaryElevatedDisabled} />
-  <Canvas of={VBtnStories.PrimaryOutlinedDisabled} />
-  <Canvas of={VBtnStories.PrimaryTonalDisabled} />
-  <Canvas of={VBtnStories.PrimaryTextDisabled} />
+  <Canvas of={VBtnStories.Primary} />
+  <Canvas of={VBtnStories.PrimaryLoading} />
+  <Canvas of={VBtnStories.PrimaryDisabled} />
 </div>
 
 ## Secondary
 
 <div style={{ display: 'flex', flexWrap: 'wrap', gap: '12px', alignItems: 'center', padding: '24px' }}>
-  <Canvas of={VBtnStories.SecondaryElevated} />
-  <Canvas of={VBtnStories.SecondaryOutlined} />
-  <Canvas of={VBtnStories.SecondaryTonal} />
-  <Canvas of={VBtnStories.SecondaryText} />
-</div>
-
-## Secondary – Désactivé
-
-<div style={{ display: 'flex', flexWrap: 'wrap', gap: '12px', alignItems: 'center', padding: '24px' }}>
-  <Canvas of={VBtnStories.SecondaryElevatedDisabled} />
-  <Canvas of={VBtnStories.SecondaryOutlinedDisabled} />
-  <Canvas of={VBtnStories.SecondaryTonalDisabled} />
-  <Canvas of={VBtnStories.SecondaryTextDisabled} />
+  <Canvas of={VBtnStories.Secondary} />
+  <Canvas of={VBtnStories.SecondaryLoading} />
+  <Canvas of={VBtnStories.SecondaryDisabled} />
 </div>
 
 ## Tertiary
 
 <div style={{ display: 'flex', flexWrap: 'wrap', gap: '12px', alignItems: 'center', padding: '24px' }}>
-  <Canvas of={VBtnStories.TertiaryElevated} />
-  <Canvas of={VBtnStories.TertiaryOutlined} />
-  <Canvas of={VBtnStories.TertiaryTonal} />
-  <Canvas of={VBtnStories.TertiaryText} />
-</div>
-
-## Tertiary – Désactivé
-
-<div style={{ display: 'flex', flexWrap: 'wrap', gap: '12px', alignItems: 'center', padding: '24px' }}>
-  <Canvas of={VBtnStories.TertiaryElevatedDisabled} />
-  <Canvas of={VBtnStories.TertiaryOutlinedDisabled} />
-  <Canvas of={VBtnStories.TertiaryTonalDisabled} />
-  <Canvas of={VBtnStories.TertiaryTextDisabled} />
+  <Canvas of={VBtnStories.Tertiary} />
+  <Canvas of={VBtnStories.TertiaryLoading} />
+  <Canvas of={VBtnStories.TertiaryDisabled} />
 </div>
 
 ## Variants disponibles

package/src/composantsVuetify/VBtn/v-btn.stories.ts

@@ -8,7 +8,7 @@ const meta: Meta = {
 			return { args }
 		},
 		template: `
-      <v-btn :color="args.color" :variant="args.variant" :disabled="args.disabled">
+      <v-btn :color="args.color" :variant="args.variant" :disabled="args.disabled" :loading="args.loading">
         {{ args.label }}
       </v-btn>
     `,
@@ -19,103 +19,43 @@ export default meta
 type Story = StoryObj<typeof meta>
 
 // --- Primary ---
-export const PrimaryElevated: Story = {
-	args: { label: 'Button primary elevated', color: 'primary', variant: 'elevated', disabled: false },
+export const Primary: Story = {
+	args: { label: 'Button primary', color: 'primary', variant: 'elevated', disabled: false },
 	parameters: { docs: { source: { code: `<v-btn color="primary" variant="elevated">Button</v-btn>` } } },
 }
-export const PrimaryOutlined: Story = {
-	args: { label: 'Button primary outlined', color: 'primary', variant: 'outlined', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="primary" variant="outlined">Button</v-btn>` } } },
-}
-export const PrimaryTonal: Story = {
-	args: { label: 'Button primary tonal', color: 'primary', variant: 'tonal', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="primary" variant="tonal">Button</v-btn>` } } },
-}
-export const PrimaryText: Story = {
-	args: { label: 'Button primary text', color: 'primary', variant: 'text', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="primary" variant="text">Button</v-btn>` } } },
+export const PrimaryLoading: Story = {
+	args: { label: 'Button primary loading', color: 'primary', variant: 'elevated', disabled: false, loading: true },
+	parameters: { docs: { source: { code: `<v-btn color="primary" variant="elevated" loading>Button</v-btn>` } } },
 }
-export const PrimaryElevatedDisabled: Story = {
-	args: { label: 'Button primary elevated disabled', color: 'primary', variant: 'elevated', disabled: true },
+export const PrimaryDisabled: Story = {
+	args: { label: 'Button primary disabled', color: 'primary', variant: 'elevated', disabled: true },
 	parameters: { docs: { source: { code: `<v-btn color="primary" variant="elevated" disabled>Button</v-btn>` } } },
 }
-export const PrimaryOutlinedDisabled: Story = {
-	args: { label: 'Button primary outlined disabled', color: 'primary', variant: 'outlined', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="primary" variant="outlined" disabled>Button</v-btn>` } } },
-}
-export const PrimaryTonalDisabled: Story = {
-	args: { label: 'Button primary tonal disabled', color: 'primary', variant: 'tonal', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="primary" variant="tonal" disabled>Button</v-btn>` } } },
-}
-export const PrimaryTextDisabled: Story = {
-	args: { label: 'Button primary text disabled', color: 'primary', variant: 'text', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="primary" variant="text" disabled>Button</v-btn>` } } },
-}
 
 // --- Secondary ---
-export const SecondaryElevated: Story = {
-	args: { label: 'Button secondary elevated', color: 'secondary', variant: 'elevated', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="elevated">Button</v-btn>` } } },
-}
-export const SecondaryOutlined: Story = {
-	args: { label: 'Button secondary outlined', color: 'secondary', variant: 'outlined', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="outlined">Button</v-btn>` } } },
-}
-export const SecondaryTonal: Story = {
-	args: { label: 'Button secondary tonal', color: 'secondary', variant: 'tonal', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="tonal">Button</v-btn>` } } },
-}
-export const SecondaryText: Story = {
-	args: { label: 'Button secondary text', color: 'secondary', variant: 'text', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="text">Button</v-btn>` } } },
-}
-export const SecondaryElevatedDisabled: Story = {
-	args: { label: 'Button secondary elevated disabled', color: 'secondary', variant: 'elevated', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="elevated" disabled>Button</v-btn>` } } },
-}
-export const SecondaryOutlinedDisabled: Story = {
-	args: { label: 'Button secondary outlined disabled', color: 'secondary', variant: 'outlined', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="outlined" disabled>Button</v-btn>` } } },
+export const Secondary: Story = {
+	args: { label: 'Button secondary ', color: 'primary', variant: 'outlined', disabled: false },
+	parameters: { docs: { source: { code: `<v-btn color="primary" variant="outlined">Button</v-btn>` } } },
 }
-export const SecondaryTonalDisabled: Story = {
-	args: { label: 'Button secondary tonal disabled', color: 'secondary', variant: 'tonal', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="tonal" disabled>Button</v-btn>` } } },
+export const SecondaryLoading: Story = {
+	args: { label: 'Button secondary loading', color: 'primary', variant: 'outlined', disabled: false, loading: true },
+	parameters: { docs: { source: { code: `<v-btn color="primary" variant="outlined" loading>Button</v-btn>` } } },
 }
-export const SecondaryTextDisabled: Story = {
-	args: { label: 'Button secondary text disabled', color: 'secondary', variant: 'text', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="secondary" variant="text" disabled>Button</v-btn>` } } },
+export const SecondaryDisabled: Story = {
+	args: { label: 'Button secondary disabled', color: 'primary', variant: 'outlined', disabled: true },
+	parameters: { docs: { source: { code: `<v-btn color="primary" variant="outlined" disabled>Button</v-btn>` } } },
 }
 
 // --- Tertiary ---
-export const TertiaryElevated: Story = {
-	args: { label: 'Button tertiary elevated', color: 'tertiary', variant: 'elevated', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="elevated">Button</v-btn>` } } },
-}
-export const TertiaryOutlined: Story = {
-	args: { label: 'Button tertiary outlined', color: 'tertiary', variant: 'outlined', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="outlined">Button</v-btn>` } } },
-}
-export const TertiaryTonal: Story = {
-	args: { label: 'Button tertiary tonal', color: 'tertiary', variant: 'tonal', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="tonal">Button</v-btn>` } } },
-}
-export const TertiaryText: Story = {
-	args: { label: 'Button tertiary text', color: 'tertiary', variant: 'text', disabled: false },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="text">Button</v-btn>` } } },
-}
-export const TertiaryElevatedDisabled: Story = {
-	args: { label: 'Button tertiary elevated disabled', color: 'tertiary', variant: 'elevated', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="elevated" disabled>Button</v-btn>` } } },
-}
-export const TertiaryOutlinedDisabled: Story = {
-	args: { label: 'Button tertiary outlined disabled', color: 'tertiary', variant: 'outlined', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="outlined" disabled>Button</v-btn>` } } },
+export const Tertiary: Story = {
+	args: { label: 'Button tertiary', color: 'primary', variant: 'text', disabled: false },
+	parameters: { docs: { source: { code: `<v-btn color="primary" variant="text">Button</v-btn>` } } },
 }
-export const TertiaryTonalDisabled: Story = {
-	args: { label: 'Button tertiary tonal disabled', color: 'tertiary', variant: 'tonal', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="tonal" disabled>Button</v-btn>` } } },
+export const TertiaryLoading: Story = {
+	args: { label: 'Button tertiary loading', color: 'primary', variant: 'text', disabled: false, loading: true },
+	parameters: { docs: { source: { code: `<v-btn color="primary" variant="text" loading>Button</v-btn>` } } },
 }
-export const TertiaryTextDisabled: Story = {
-	args: { label: 'Button tertiary text disabled', color: 'tertiary', variant: 'text', disabled: true },
-	parameters: { docs: { source: { code: `<v-btn color="tertiary" variant="text" disabled>Button</v-btn>` } } },
+export const TertiaryDisabled: Story = {
+	args: { label: 'Button tertiary disabled', color: 'primary', variant: 'text', disabled: true },
+	parameters: { docs: { source: { code: `<v-btn color="primary" variant="text" disabled>Button</v-btn>` } } },
 }

package/src/designTokens/tokens/amelipro/apContextual.ts

@@ -63,4 +63,10 @@ export const apContextualTokens = {
 		switchWidth: '3.5rem',
 		switchTrackOpacity: '1',
 	},
+	radius: {
+		rounded0: '0',
+		rounded: '12px',
+		roundedLg: '24px',
+		roundedPill: '64px',
+	},
 }

package/src/designTokens/tokens/amelipro/apDarkTheme.ts

@@ -1,5 +1,5 @@
-// import { apColorsTokens } from '../amelipro/apColors'
+import { baseTokens } from '@/designTokens/tokens/baseTokens'
 
 export const apDarkTheme = {
-	// backgroundSurface: apColorsTokens.parma.darken60,
+	backgroundSurface: baseTokens.color.parma.darken60,
 }

package/src/designTokens/tokens/amelipro/apLightTheme.ts

@@ -1,106 +1,75 @@
-import { apSemanticTokens } from './apSemantic'
-import { apColorsTokens } from './apColors'
-import { baseColors } from '../baseColors'
+import { baseTokens } from '../baseTokens'
 
 export const apLightTheme = {
-	primary: apColorsTokens.cyan.darken20,
-	secondary: apColorsTokens.cyan.darken60,
-	accentPrimaryLight: apColorsTokens.blue.lighten20,
-	accentPrimary: apColorsTokens.cyan.darken20,
-	accentPrimaryContrasted: apColorsTokens.cyan.darken40,
-	accentSecondaryLight: apColorsTokens.cyan.base,
-	accentSecondary: apColorsTokens.cyan.darken60,
-	accentSecondaryContrasted: apColorsTokens.cyan.darken80,
-	accentAlt: apColorsTokens.grey.base,
-	error: apColorsTokens.red.darken20,
-	info: apColorsTokens.parma.darken40,
-	avatar: apColorsTokens.cyan.darken20,
-	success: apColorsTokens.turquoise.darken20,
-	warning: apColorsTokens.yellow.darken60,
-	risquePro: apColorsTokens.red.base,
-	light: apColorsTokens.grey.lighten60,
-	dark: apColorsTokens.grey.darken80,
-	onBackground: apSemanticTokens.colors.background.surface,
-	onSurfaceAlt: apSemanticTokens.colors.background.surfaceAlt,
-	onSurface: apSemanticTokens.colors.background.surface,
-	onWarning: apSemanticTokens.colors.background.warning,
-	overlayFullpage: apSemanticTokens.colors.overlay.fullpage,
-	overlayOnDark: apSemanticTokens.colors.overlay.onDark,
-	overlayOnLight: apSemanticTokens.colors.overlay.onLight,
-	interactiveSelectionEnabled: apSemanticTokens.colors.interactive.selectionEnabled,
-	interactiveSelectionHover: apSemanticTokens.colors.interactive.selectionHover,
-	interactiveSelectionPressed: apSemanticTokens.colors.interactive.selectionPressed,
-	interactiveSelectionSelected: apSemanticTokens.colors.interactive.selectionSelected,
-	interactiveSelectionHoverOnSelected: apSemanticTokens.colors.interactive.selectionHoverOnSelected,
-	interactiveSelectionSelectedAccent: apSemanticTokens.colors.interactive.selectionSelectedAccent,
-	interactiveSelectionHoverOnSelectedAccent: apSemanticTokens.colors.interactive.selectionHoverOnSelectedAccent,
-	interactiveSelectionDisabled: apSemanticTokens.colors.interactive.selectionDisabled,
-	backgroundMain: apSemanticTokens.colors.background.main,
-	backgroundSurface: apSemanticTokens.colors.background.surface,
-	backgroundSurfaceAlt: apSemanticTokens.colors.background.surfaceAlt,
-	backgroundMainAlt: apSemanticTokens.colors.background.mainAlt,
-	backgroundRaised: apSemanticTokens.colors.background.raised,
-	backgroundAccent: apSemanticTokens.colors.background.accent,
-	backgroundAccentContrasted: apSemanticTokens.colors.background.accentContrasted,
-	backgroundAccentAlt: apSemanticTokens.colors.background.accentAlt,
-	backgroundInfo: apSemanticTokens.colors.background.info,
-	backgroundInfoSubdued: apSemanticTokens.colors.background.infoSubdued,
-	backgroundInfoContrasted: apSemanticTokens.colors.background.infoContrasted,
-	backgroundSuccess: apSemanticTokens.colors.background.success,
-	backgroundSuccessSubdued: apSemanticTokens.colors.background.successSubdued,
-	backgroundSuccessContrasted: apSemanticTokens.colors.background.successContrasted,
-	backgroundWarning: apSemanticTokens.colors.background.warning,
-	backgroundWarningSubdued: apSemanticTokens.colors.background.warningSubdued,
-	backgroundWarningContrasted: apSemanticTokens.colors.background.warningContrasted,
-	backgroundError: apSemanticTokens.colors.background.error,
-	backgroundErrorSubdued: apSemanticTokens.colors.background.errorSubdued,
-	backgroundErrorContrasted: apSemanticTokens.colors.background.errorContrasted,
-	backgroundDisabled: apSemanticTokens.colors.background.disabled,
-	backgroundDisabledOnDark: apSemanticTokens.colors.background.disabledOnDark,
-	backgroundAssure: apSemanticTokens.colors.background.assure,
-	backgroundProfessionnel: apSemanticTokens.colors.background.professionnel,
-	backgroundEntreprise: apSemanticTokens.colors.background.entreprise,
-	borderDarker: apSemanticTokens.colors.border.darker,
-	borderBase: apSemanticTokens.colors.border.base,
-	borderSubdued: apSemanticTokens.colors.border.subdued,
-	borderAccentPrimary: apSemanticTokens.colors.border.accentPrimary,
-	borderAccentPrimaryContrasted: apSemanticTokens.colors.border.accentPrimaryContrasted,
-	borderAccentPrimaryOnDark: apSemanticTokens.colors.border.accentPrimaryOnDark,
-	borderAccentSecondary: apSemanticTokens.colors.border.accentSecondary,
-	borderAccentSecondaryContrasted: apSemanticTokens.colors.border.accentSecondaryContrasted,
-	borderInfo: apSemanticTokens.colors.border.info,
-	borderSuccess: apSemanticTokens.colors.border.success,
-	borderWarning: apSemanticTokens.colors.border.warning,
-	borderError: apSemanticTokens.colors.border.error,
-	borderOnDark: apSemanticTokens.colors.border.onDark,
-	borderDisabled: apSemanticTokens.colors.border.disabled,
-	borderDisabledOnDark: apSemanticTokens.colors.border.disabledOnDark,
-	textBase: apSemanticTokens.colors.text.base,
-	textAccentPrimary: apSemanticTokens.colors.text.accentPrimary,
-	textAccentPrimaryContrasted: apSemanticTokens.colors.text.accentPrimaryContrasted,
-	textAccentSecondary: apSemanticTokens.colors.text.accentSecondary,
-	textSubdued: apSemanticTokens.colors.text.subdued,
-	textInfo: apSemanticTokens.colors.text.info,
-	textSuccess: apSemanticTokens.colors.text.success,
-	textWarning: apSemanticTokens.colors.text.warning,
-	textError: apSemanticTokens.colors.text.error,
-	textDisabled: apSemanticTokens.colors.text.disabled,
-	textOnDark: apSemanticTokens.colors.text.onDark,
-	textSubduedOnDark: apSemanticTokens.colors.text.subduedOnDark,
-	textDisabledOnDark: apSemanticTokens.colors.text.disabledOnDark,
-	iconBase: apSemanticTokens.colors.icon.base,
-	iconSubdued: apSemanticTokens.colors.icon.subdued,
-	iconSubduedOnDark: apSemanticTokens.colors.icon.subduedOnDark,
-	iconAccentPrimary: apSemanticTokens.colors.icon.accentPrimary,
-	iconAccentPrimaryContrasted: apSemanticTokens.colors.icon.accentPrimaryContrasted,
-	iconAccentSecondary: apSemanticTokens.colors.icon.accentSecondary,
-	iconInfo: apSemanticTokens.colors.icon.info,
-	iconSuccess: apSemanticTokens.colors.icon.success,
-	iconWarning: apSemanticTokens.colors.icon.warning,
-	iconError: apSemanticTokens.colors.icon.error,
-	iconOnDark: apSemanticTokens.colors.icon.onDark,
-	iconDisabled: apSemanticTokens.colors.icon.disabled,
-	iconDisabledOnDark: apSemanticTokens.colors.icon.disabledOnDark,
-	feedbackOnSuccess: baseColors.white.base,
-	colorPrimary: baseColors.cyan.base,
+	risquePro: baseTokens.color.red.base,
+
+	// Border
+	border: baseTokens.color.cyan.darken20,
+	borderVariant: baseTokens.color.grey.lighten40,
+	borderBright: baseTokens.color.white.base,
+	borderDim: baseTokens.color.white.alpha40,
+
+	// Disabled
+	disabled: baseTokens.color.grey.lighten80,
+	inverseSurface: baseTokens.color.grey.base,
+	onDisabled: baseTokens.color.grey.lighten40,
+	onDisabledVariant: baseTokens.color.white.alpha40,
+
+	// Primary
+	primary: baseTokens.color.cyan.darken20,
+	onPrimary: baseTokens.color.white.base,
+	primaryVariant: baseTokens.color.cyan.darken40,
+	onPrimaryVariant: baseTokens.color.white.base,
+
+	// Secondary
+	secondary: baseTokens.color.cyan.darken60,
+	onSecondary: baseTokens.color.white.base,
+	secondaryVariant: baseTokens.color.cyan.darken80,
+	onSecondaryVariant: baseTokens.color.white.base,
+
+	// Overlay
+	overlay: baseTokens.color.grey.alpha40,
+
+	// Surface
+	surface: baseTokens.color.white.base,
+	surfaceBright: baseTokens.color.cyan.lighten97,
+	surfaceDim: baseTokens.color.cyan.lighten80,
+	onSurface: baseTokens.color.grey.darken60,
+	onSurfaceVariant: baseTokens.color.grey.base,
+
+	// Background
+	background: baseTokens.color.cyan.lighten97,
+	backgroundVariant: baseTokens.color.white.base,
+	onBackground: baseTokens.color.grey.darken60,
+	onBackgroundVariant: baseTokens.color.grey.lighten40,
+
+	// Feedback
+	info: baseTokens.color.parma.darken40,
+	infoVariant: baseTokens.color.parma.lighten80,
+	onInfo: baseTokens.color.white.base,
+	onInfoVariant: baseTokens.color.parma.darken60,
+	error: baseTokens.color.red.darken20,
+	onError: baseTokens.color.white.base,
+	errorVariant: baseTokens.color.red.lighten90,
+	onErrorVariant: baseTokens.color.red.darken60,
+	success: baseTokens.color.forestGreen.base,
+	onSuccess: baseTokens.color.white.base,
+	successVariant: baseTokens.color.forestGreen.lighten90,
+	onSuccessVariant: baseTokens.color.forestGreen.darken60,
+	warning: baseTokens.color.yellow.base,
+	onWarning: baseTokens.color.grey.darken60,
+	warningVariant: baseTokens.color.yellow.lighten80,
+	onWarningVariant: baseTokens.color.yellow.darken60,
+
+	// Interaction
+	interactionLightenEnabled: baseTokens.color.none,
+	interactionLightenHover: baseTokens.color.white.alpha20,
+	interactionLightenSelected: baseTokens.color.white.alpha20,
+	interactionLightenPressed: baseTokens.color.white.alpha38,
+	interactionDarkEnabled: baseTokens.color.transparentCyan.alpha00,
+	interactionDarkHover: baseTokens.color.transparentCyan.alpha08,
+	interactionDarkPressed: baseTokens.color.transparentCyan.alpha18,
+	interactionDarkenEnabled: baseTokens.color.transparentBlack.alpha00,
+	interactionDarkenHover: baseTokens.color.transparentBlack.alpha20,
+	interactionDarkenPressed: baseTokens.color.transparentBlack.alpha40,
 }

package/src/designTokens/tokens/amelipro/apSemantic.ts

@@ -79,7 +79,7 @@ export const apSemanticTokens = {
 		overlay: {
 			fullpage: apColorsTokens.grey.darken60,
 			onDark: apColorsTokens.cyan.darken40,
-			onLight: apColorsTokens.white.base,
+			onLight: apColorsTokens.cyan.darken20,
 		},
 		interactive: {
 			selectionEnabled: apColorsTokens.white.base,

package/src/designTokens/tokens/baseContextualTokens.ts

@@ -26,12 +26,6 @@ export const baseContextualTokens = {
 		default: '24px',
 		large: '32px',
 	},
-	radius: {
-		rounded0: '0',
-		rounded: '4px',
-		roundedLg: '8px',
-		roundedPill: '64px',
-	},
 	padding: {
 		0: '0',
 		2: '8px',
@@ -43,6 +37,7 @@ export const baseContextualTokens = {
 		14: '56px',
 		16: '64px',
 	},
+
 	fontSize: {
 		titres: '24px',
 		titresAlternatifs: '20px',