Orange-OpenSource
diff --git a/‎app/assets/orange/functional/status-and-indicators/info.svg‎
Lines changed: 3 additions & 0 deletions b/‎app/assets/orange/functional/status-and-indicators/info.svg‎
Lines changed: 3 additions & 0 deletions
diff --git a/‎app/assets/sosh/functional/status-and-indicators/info.svg‎
Lines changed: 3 additions & 0 deletions b/‎app/assets/sosh/functional/status-and-indicators/info.svg‎
Lines changed: 3 additions & 0 deletions
diff --git a/‎app/assets/wireframe/functional/status-and-indicators/info.svg‎
Lines changed: 3 additions & 0 deletions b/‎app/assets/wireframe/functional/status-and-indicators/info.svg‎
Lines changed: 3 additions & 0 deletions
diff --git a/‎app/lib/ui/utilities/theme_colored_box.dart‎
Lines changed: 117 additions & 0 deletions b/‎app/lib/ui/utilities/theme_colored_box.dart‎
Lines changed: 117 additions & 0 deletions
diff --git a/‎ouds_core/assets/symbol_filter_chip_selected.svg‎
Lines changed: 3 additions & 0 deletions b/‎ouds_core/assets/symbol_filter_chip_selected.svg‎
Lines changed: 3 additions & 0 deletions
diff --git a/‎ouds_core/assets/symbol_switch_checked.svg‎
Lines changed: 3 additions & 0 deletions b/‎ouds_core/assets/symbol_switch_checked.svg‎
Lines changed: 3 additions & 0 deletions
diff --git a/‎ouds_core/lib/components/utilities/focus_container.dart‎
Lines changed: 145 additions & 0 deletions b/‎ouds_core/lib/components/utilities/focus_container.dart‎
Lines changed: 145 additions & 0 deletions
diff --git a/‎ouds_theme_contract/lib/ouds_theme.dart‎
Lines changed: 1 addition & 1 deletion b/‎ouds_theme_contract/lib/ouds_theme.dart‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎ouds_theme_contract/lib/theme/tokens/components/ouds_tagInput_tokens.dart‎
Lines changed: 33 additions & 0 deletions b/‎ouds_theme_contract/lib/theme/tokens/components/ouds_tagInput_tokens.dart‎
Lines changed: 33 additions & 0 deletions
diff --git a/‎ouds_theme_orange/assets/component/alert/important.svg‎
Lines changed: 3 additions & 0 deletions b/‎ouds_theme_orange/assets/component/alert/important.svg‎
Lines changed: 3 additions & 0 deletions
@@ -0,0 +1,117 @@
+/*
+ * // Software Name: OUDS Flutter
+ * // SPDX-FileCopyrightText: Copyright (c) Orange SA
+ * // SPDX-License-Identifier: MIT
+ * //
+ * // This software is distributed under the MIT license,
+ * // the text of which is available at https://opensource.org/license/MIT/
+ * // or see the "LICENSE" file for more details.
+ * //
+ * // Software description: Flutter library of reusable graphical components
+ * //
+ */
+import 'package:flutter/material.dart';
+import 'package:ouds_theme_contract/ouds_theme.dart';
+import 'package:ouds_theme_contract/ouds_theme_contract.dart';
+
+/// A widget that applies a specific theme to its child using [OudsTheme].
+///
+/// This widget allows setting a theme mode (`ThemeMode`) and a theme contract
+/// (`OudsThemeContract`). It wraps its child inside a background colored by a [ColoredBox].
+class ThemeBox extends StatelessWidget {
+  /// The widget to display inside the [ThemeBox].
+  final Widget child;
+
+  /// The theme mode to apply (light, dark, or system).
+  final ThemeMode themeMode;
+
+  /// The theme contract defining the theme's design tokens and styles.
+  final OudsThemeContract themeContract;
+
+  /// Constructor for [ThemeBox].
+  ///
+  /// Requires [child], [themeMode], and [themeContract].
+  const ThemeBox({
+    required this.child,
+    required this.themeMode,
+    required this.themeContract,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return OudsTheme(
+      themeContract: themeContract,
+      themeMode: themeMode,
+      onColoredSurface: false,
+      child: Builder(
+        builder: (context) {
+          return ColoredBox(
+            color: ColoredBoxColor.backgroundPrimary,
+            child: Column(
+              children: [
+                child,
+              ],
+            ),
+          );
+        },
+      ),
+    );
+  }
+}
+
+/// A demo colored box widget used to showcase `DARK` and `LIGHT` modes.
+/// It displays a background with centered content and a minimum height.
+class ColoredBox extends StatelessWidget {
+  /// The widget to display at the center of the box.
+  final Widget child;
+
+  /// The background color of the box, optional.
+  final ColoredBoxColor? color;
+
+  /// Constructor for [ColoredBox].
+  ///
+  /// Requires [child], [color] is optional.
+  const ColoredBox({
+    required this.child,
+    this.color,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      constraints: BoxConstraints(
+        minHeight: 80,
+      ),
+      width: double.infinity,
+      color: color?.getValue(context),
+      child: Padding(
+        padding: EdgeInsetsDirectional.symmetric(
+          vertical: OudsTheme.of(context).spaceScheme(context).fixedMedium,
+          horizontal: OudsTheme.of(context).spaceScheme(context).fixedNone,
+        ),
+        child: Container(
+          alignment: AlignmentDirectional.centerStart,
+          child: child,
+        ),
+      ),
+    );
+  }
+}
+
+/// Enumeration representing the possible background colors of a [ColoredBox].
+enum ColoredBoxColor {
+  /// Primary background color.
+  backgroundPrimary;
+
+  /// Retrieves the color value associated with this enum in the current context.
+  Color getValue(BuildContext context) {
+    final theme = OudsTheme.of(context);
+
+    switch (this) {
+      case ColoredBoxColor.backgroundPrimary:
+        return theme.colorScheme(context).bgPrimary;
+    }
+  }
+}
@@ -0,0 +1,145 @@
+/*
+ * // Software Name: OUDS Flutter
+ * // SPDX-FileCopyrightText: Copyright (c) Orange SA
+ * // SPDX-License-Identifier: MIT
+ * //
+ * // This software is distributed under the MIT license,
+ * // the text of which is available at https://opensource.org/license/MIT/
+ * // or see the "LICENSE" file for more details.
+ * //
+ * // Software description: Flutter library of reusable graphical components
+ * //
+ */
+/// @nodoc
+library;
+
+import 'package:flutter/material.dart';
+import 'package:ouds_theme_contract/ouds_theme.dart';
+
+/// Controls how the focus ring stroke is positioned relative to the widget bounds.
+enum FocusAlignment {
+  /// The stroke is fully inside the widget bounds.
+  inside,
+
+  /// The stroke is centered on the widget bounds (half inside, half outside).
+  center,
+
+  /// The stroke is fully outside the widget bounds.
+  outside,
+}
+
+/// A [CustomPainter] that draws a rounded-rectangle focus ring.
+///
+/// The ring is drawn using a stroke of [strokeWidth] and rounded corners
+/// defined by [borderRadius]. The ring position depends on [alignment]:
+/// - [FocusAlignment.inside] deflates the rect by half the stroke width.
+/// - [FocusAlignment.center] draws on the original rect.
+/// - [FocusAlignment.outside] inflates the rect by half the stroke width.
+class FocusContainerPainter extends CustomPainter {
+  final Color color;
+  final double strokeWidth;
+  final double borderRadius;
+  final FocusAlignment alignment;
+
+  FocusContainerPainter({
+    required this.color,
+    required this.strokeWidth,
+    required this.borderRadius,
+    this.alignment = FocusAlignment.center,
+  });
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    final paint = Paint()
+      ..style = PaintingStyle.stroke
+      ..strokeWidth = strokeWidth
+      ..color = color
+      ..isAntiAlias = true;
+
+    Rect baseRect = Offset.zero & size;
+    RRect rrect = RRect.fromRectAndRadius(baseRect, Radius.circular(borderRadius));
+
+    final half = strokeWidth / 2;
+    if (alignment == FocusAlignment.outside) {
+      rrect = rrect.inflate(half);
+    } else if (alignment == FocusAlignment.inside) {
+      rrect = rrect.deflate(half);
+    }
+    canvas.drawRRect(rrect, paint);
+  }
+
+  @override
+  bool shouldRepaint(covariant FocusContainerPainter oldDelegate) {
+    return oldDelegate.color != color || oldDelegate.strokeWidth != strokeWidth || oldDelegate.borderRadius != borderRadius || oldDelegate.alignment != alignment;
+  }
+}
+
+/// Wraps [child] with an optional focus ring and an optional inset border.
+///
+/// When [isFocused] is true, a focus ring is painted using [CustomPaint]
+/// inside a [Stack]. The ring uses theme tokens (focus border color/width)
+/// and can be visually aligned via [alignment].
+///
+/// This widget is designed to be used by interactive components to make
+/// keyboard focus visible (for example when navigating with Tab).
+class FocusContainer extends StatelessWidget {
+  /// The content widget.
+  final Widget child;
+
+  /// Optional ring color (defaults to transparent).
+  ///
+  /// Note: the current implementation uses theme colors for the painted ring.
+  final Color color;
+
+  /// The stroke width used for the focus ring.
+  ///
+  /// Note: the current implementation uses theme tokens for the painted ring.
+  final double strokeWidth;
+
+  /// Corner radius used for the focus ring and the inset border.
+  final double borderRadius;
+
+  /// Focus ring alignment relative to the widget bounds.
+  final FocusAlignment alignment;
+
+  /// Whether the focus ring should be visible.
+  final bool isFocused;
+
+  const FocusContainer({
+    super.key,
+    required this.child,
+    this.color = Colors.transparent,
+    this.strokeWidth = 5,
+    this.borderRadius = 8,
+    this.alignment = FocusAlignment.center,
+    this.isFocused = false,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final borderTokens = OudsTheme.of(context).borderTokens;
+
+    if (!isFocused) {
+      // Pas de focus - retourner le child directement sans wrapper
+      return child;
+    }
+
+    // Avec focus - dessiner les borders par-dessus avec CustomPaint
+    // Utiliser borderTokens au lieu des paramètres pour s'adapter au thème
+    return CustomPaint(
+      painter: FocusContainerPainter(
+        color: color,
+        strokeWidth: borderTokens.widthFocus,
+        borderRadius: borderRadius,
+        alignment: FocusAlignment.center,
+      ),
+      foregroundPainter: FocusContainerPainter(
+        color: OudsTheme.of(context).colorScheme(context).borderFocusInset,
+        strokeWidth: borderTokens.widthFocusInset,
+        borderRadius: borderRadius,
+        alignment: FocusAlignment.inside,
+      ),
+      child: child,
+    );
+  }
+}
@@ -131,4 +131,4 @@ class OudsTheme extends InheritedModel<OudsThemeAspect> {
     }
     return false;
   }
-}
+}
@@ -0,0 +1,33 @@
+//
+// Software Name: OUDS Flutter
+// SPDX-FileCopyrightText: Copyright (c) Orange SA
+// SPDX-License-Identifier: MIT
+//
+// This software is distributed under the MIT license,
+// the text of which is available at https://opensource.org/license/MIT/
+// or see the "LICENSE" file for more details.
+//
+// Software description: Flutter library of reusable graphical components
+//
+
+// Orange brand tokens version 1.5.0
+// Generated by Tokenator
+
+import 'package:flutter/material.dart';
+
+abstract class OudsTagInputTokens {
+  late double borderWidthDefault;
+  late double borderWidthDefaultInteraction;
+  late Color colorBgEnabled;
+  late Color colorBgFocus;
+  late Color colorBgHover;
+  late Color colorBgPressed;
+  late Color colorBorderEnabled;
+  late Color colorBorderFocus;
+  late Color colorBorderHover;
+  late Color colorBorderPressed;
+  late Color colorContentEnabled;
+  late Color colorContentFocus;
+  late Color colorContentHover;
+  late Color colorContentPressed;
+}
Original file line number	Diff line number	Diff line change
`@@ -131,4 +131,4 @@ class OudsTheme extends InheritedModel<OudsThemeAspect> {`
`131`	`131`	`}`
`132`	`132`	`return false;`
`133`	`133`	`}`
`134`		`-}`
	`134`	`+}`