feat(progress-indicator): create Circular progress indicator in lib and demo app

Author: nouha06

app/lib/l10n/gen/ouds_flutter_app_localizations.dart

@@ -271,6 +271,12 @@ abstract class AppLocalizations {
   /// **'Rounded corner alert message'**
   String get app_themeSettingsDialog_roundedCornerAlertMessage_label;
 
+  /// No description provided for @app_themeSettingsDialog_roundedCornerProgressIndicators_label.
+  ///
+  /// In en, this message translates to:
+  /// **'Rounded corner progress indicators'**
+  String get app_themeSettingsDialog_roundedCornerProgressIndicators_label;
+
   /// No description provided for @app_tokens_viewCodeExample_label.
   ///
   /// In en, this message translates to:
@@ -601,6 +607,12 @@ abstract class AppLocalizations {
   /// **'Description'**
   String get app_components_common_description_tech;
 
+  /// No description provided for @app_components_common_type_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Type'**
+  String get app_components_common_type_tech;
+
   /// No description provided for @app_components_alert_tech.
   ///
   /// In en, this message translates to:
@@ -948,12 +960,6 @@ abstract class AppLocalizations {
   /// **'Badge is a UI element that emphasizes system notifications, status, or the categorization of an information, throughout colour only.'**
   String get app_components_badge_description_text;
 
-  /// No description provided for @app_components_badge_type_label.
-  ///
-  /// In en, this message translates to:
-  /// **'Type'**
-  String get app_components_badge_type_label;
-
   /// No description provided for @app_components_badge_standardType_label.
   ///
   /// In en, this message translates to:
@@ -1290,6 +1296,67 @@ abstract class AppLocalizations {
   /// **'Alphanumeric'**
   String get app_components_pinCodeInput_keyboardType_alphanumeric_label;
 
+  /// No description provided for @app_components_progressIndicator_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Progress indicator'**
+  String get app_components_progressIndicator_tech;
+
+  /// No description provided for @app_components_progressIndicator_description_text.
+  ///
+  /// In en, this message translates to:
+  /// **'Progress indicator shows the progress of a task providing visual feedback. It can show a specific value (determinate) or just that something is in progress (indeterminate).'**
+  String get app_components_progressIndicator_description_text;
+
+  /// No description provided for @app_components_progressIndicator_circularProgressIndicator_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Circular progress indicator'**
+  String get app_components_progressIndicator_circularProgressIndicator_tech;
+
+  /// No description provided for @app_components_progressIndicator_circularProgressIndicator_description_text.
+  ///
+  /// In en, this message translates to:
+  /// **'A circular progress indicator shows the progress of a task using a circle. Useful when you need more visual focus or when space is limited.'**
+  String
+  get app_components_progressIndicator_circularProgressIndicator_description_text;
+
+  /// No description provided for @app_components_progressIndicator_animated_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Animated'**
+  String get app_components_progressIndicator_animated_tech;
+
+  /// No description provided for @app_components_progressIndicator_determinate_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Determinate'**
+  String get app_components_progressIndicator_determinate_tech;
+
+  /// No description provided for @app_components_progressIndicator_indeterminate_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Indeterminate'**
+  String get app_components_progressIndicator_indeterminate_tech;
+
+  /// No description provided for @app_components_progressIndicator_progress_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Progress'**
+  String get app_components_progressIndicator_progress_tech;
+
+  /// No description provided for @app_components_progressIndicator_track_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Track'**
+  String get app_components_progressIndicator_track_tech;
+
+  /// No description provided for @app_components_progressIndicator_gapSize_tech.
+  ///
+  /// In en, this message translates to:
+  /// **'Gap size'**
+  String get app_components_progressIndicator_gapSize_tech;
+
   /// No description provided for @app_components_navigationBar_label.
   ///
   /// In en, this message translates to:

app/lib/l10n/gen/ouds_flutter_app_localizations_ar.dart

@@ -99,6 +99,10 @@ class AppLocalizationsAr extends AppLocalizations {
   String get app_themeSettingsDialog_roundedCornerAlertMessage_label =>
       'رسالة تنبيه بزوايا مستديرة';
 
+  @override
+  String get app_themeSettingsDialog_roundedCornerProgressIndicators_label =>
+      'مؤشرات التقدم ذات الزوايا المستديرة';
+
   @override
   String get app_tokens_viewCodeExample_label => 'عرض مثال على كود الرمز';
 
@@ -272,6 +276,9 @@ class AppLocalizationsAr extends AppLocalizations {
   @override
   String get app_components_common_description_tech => 'Description';
 
+  @override
+  String get app_components_common_type_tech => 'Type';
+
   @override
   String get app_components_alert_tech => 'Alert';
 
@@ -481,9 +488,6 @@ class AppLocalizationsAr extends AppLocalizations {
   String get app_components_badge_description_text =>
       'Badge هي عنصر صغير في واجهة المستخدم يُستخدم لتسليط الضوء على الحالة أو الإشعارات أو التصنيف داخل الواجهة. غالبًا ما يتم عرضها كعلامة أو مؤشر بلون خلفية مميز ونص.';
 
-  @override
-  String get app_components_badge_type_label => 'Type';
-
   @override
   String get app_components_badge_standardType_label => 'Standard';
 
@@ -675,6 +679,41 @@ class AppLocalizationsAr extends AppLocalizations {
   String get app_components_pinCodeInput_keyboardType_alphanumeric_label =>
       'Alphanumeric';
 
+  @override
+  String get app_components_progressIndicator_tech => 'Progress indicator';
+
+  @override
+  String get app_components_progressIndicator_description_text =>
+      'Progress indicator يُظهر تقدم مهمة ما ويقدم تغذية بصرية. يمكن أن يُظهر قيمة محددة (محدد) أو فقط أن شيئًا ما قيد التقدم (غير محدد).';
+
+  @override
+  String get app_components_progressIndicator_circularProgressIndicator_tech =>
+      'Circular progress indicator';
+
+  @override
+  String
+  get app_components_progressIndicator_circularProgressIndicator_description_text =>
+      'Circular progress indicator يُظهر تقدم مهمة باستخدام دائرة. مفيد عندما تحتاج إلى تركيز بصري أكثر أو عندما يكون المساحة محدودة.';
+
+  @override
+  String get app_components_progressIndicator_animated_tech => 'Animated';
+
+  @override
+  String get app_components_progressIndicator_determinate_tech => 'Determinate';
+
+  @override
+  String get app_components_progressIndicator_indeterminate_tech =>
+      'Indeterminate';
+
+  @override
+  String get app_components_progressIndicator_progress_tech => 'Progress';
+
+  @override
+  String get app_components_progressIndicator_track_tech => 'Track';
+
+  @override
+  String get app_components_progressIndicator_gapSize_tech => 'Gap size';
+
   @override
   String get app_components_navigationBar_label => 'Bottom Bar';
 

app/lib/l10n/gen/ouds_flutter_app_localizations_en.dart

@@ -99,6 +99,10 @@ class AppLocalizationsEn extends AppLocalizations {
   String get app_themeSettingsDialog_roundedCornerAlertMessage_label =>
       'Rounded corner alert message';
 
+  @override
+  String get app_themeSettingsDialog_roundedCornerProgressIndicators_label =>
+      'Rounded corner progress indicators';
+
   @override
   String get app_tokens_viewCodeExample_label => 'View token code example';
 
@@ -272,6 +276,9 @@ class AppLocalizationsEn extends AppLocalizations {
   @override
   String get app_components_common_description_tech => 'Description';
 
+  @override
+  String get app_components_common_type_tech => 'Type';
+
   @override
   String get app_components_alert_tech => 'Alert';
 
@@ -481,9 +488,6 @@ class AppLocalizationsEn extends AppLocalizations {
   String get app_components_badge_description_text =>
       'Badge is a UI element that emphasizes system notifications, status, or the categorization of an information, throughout colour only.';
 
-  @override
-  String get app_components_badge_type_label => 'Type';
-
   @override
   String get app_components_badge_standardType_label => 'Standard';
 
@@ -675,6 +679,41 @@ class AppLocalizationsEn extends AppLocalizations {
   String get app_components_pinCodeInput_keyboardType_alphanumeric_label =>
       'Alphanumeric';
 
+  @override
+  String get app_components_progressIndicator_tech => 'Progress indicator';
+
+  @override
+  String get app_components_progressIndicator_description_text =>
+      'Progress indicator shows the progress of a task providing visual feedback. It can show a specific value (determinate) or just that something is in progress (indeterminate).';
+
+  @override
+  String get app_components_progressIndicator_circularProgressIndicator_tech =>
+      'Circular progress indicator';
+
+  @override
+  String
+  get app_components_progressIndicator_circularProgressIndicator_description_text =>
+      'A circular progress indicator shows the progress of a task using a circle. Useful when you need more visual focus or when space is limited.';
+
+  @override
+  String get app_components_progressIndicator_animated_tech => 'Animated';
+
+  @override
+  String get app_components_progressIndicator_determinate_tech => 'Determinate';
+
+  @override
+  String get app_components_progressIndicator_indeterminate_tech =>
+      'Indeterminate';
+
+  @override
+  String get app_components_progressIndicator_progress_tech => 'Progress';
+
+  @override
+  String get app_components_progressIndicator_track_tech => 'Track';
+
+  @override
+  String get app_components_progressIndicator_gapSize_tech => 'Gap size';
+
   @override
   String get app_components_navigationBar_label => 'Bottom Bar';
 

app/lib/l10n/gen/ouds_flutter_app_localizations_fr.dart

@@ -100,6 +100,10 @@ class AppLocalizationsFr extends AppLocalizations {
   String get app_themeSettingsDialog_roundedCornerAlertMessage_label =>
       'Message d’alerte à coins arrondis';
 
+  @override
+  String get app_themeSettingsDialog_roundedCornerProgressIndicators_label =>
+      'Progress indicators avec coins arrondis';
+
   @override
   String get app_tokens_viewCodeExample_label =>
       'Voir l\'exemple de code du token';
@@ -274,6 +278,9 @@ class AppLocalizationsFr extends AppLocalizations {
   @override
   String get app_components_common_description_tech => 'Description';
 
+  @override
+  String get app_components_common_type_tech => 'Type';
+
   @override
   String get app_components_alert_tech => 'Alert';
 
@@ -485,9 +492,6 @@ class AppLocalizationsFr extends AppLocalizations {
   String get app_components_badge_description_text =>
       'Un Badge est un élément d\'interface utilisateur qui met en évidence les notifications système, l\'état ou la catégorisation d\'une information, uniquement par le biais de la couleur.';
 
-  @override
-  String get app_components_badge_type_label => 'Type';
-
   @override
   String get app_components_badge_standardType_label => 'Standard';
 
@@ -679,6 +683,41 @@ class AppLocalizationsFr extends AppLocalizations {
   String get app_components_pinCodeInput_keyboardType_alphanumeric_label =>
       'Alphanumeric';
 
+  @override
+  String get app_components_progressIndicator_tech => 'Progress indicator';
+
+  @override
+  String get app_components_progressIndicator_description_text =>
+      'Un Progress indicator affiche l\'avancement d\'une tâche et fournit un retour visuel. Il peut afficher une valeur précise (déterminée) ou simplement indiquer qu\'une action est en cours (indéterminée).';
+
+  @override
+  String get app_components_progressIndicator_circularProgressIndicator_tech =>
+      'Circular progress indicator';
+
+  @override
+  String
+  get app_components_progressIndicator_circularProgressIndicator_description_text =>
+      'Un Circular progress indicator permet de visualiser la progression d\'une tâche à l\'aide d\'un cercle. Il est particulièrement utile lorsque la concentration visuelle est nécessaire ou lorsque l\'espace est limité.';
+
+  @override
+  String get app_components_progressIndicator_animated_tech => 'Animated';
+
+  @override
+  String get app_components_progressIndicator_determinate_tech => 'Determinate';
+
+  @override
+  String get app_components_progressIndicator_indeterminate_tech =>
+      'Indeterminate';
+
+  @override
+  String get app_components_progressIndicator_progress_tech => 'Progress';
+
+  @override
+  String get app_components_progressIndicator_track_tech => 'Track';
+
+  @override
+  String get app_components_progressIndicator_gapSize_tech => 'Gap size';
+
   @override
   String get app_components_navigationBar_label => 'Bottom Bar';
 

app/lib/l10n/ouds_flutter_ar.arb

@@ -35,6 +35,7 @@
   "app_themeSettingsDialog_roundedCornerButtons_label" :"زر بزوايا مستديرة",
   "app_themeSettingsDialog_roundedCornerTextInputs_label" :"حقول إدخال نص بزوايا مستديرة",
   "app_themeSettingsDialog_roundedCornerAlertMessage_label" :"رسالة تنبيه بزوايا مستديرة",
+  "app_themeSettingsDialog_roundedCornerProgressIndicators_label" :"مؤشرات التقدم ذات الزوايا المستديرة",
 
   "@_tokens": {},
   "app_tokens_viewCodeExample_label": "عرض مثال على كود الرمز",
@@ -123,6 +124,10 @@
   "@_components_pin_code_input": {},
   "app_components_pinCodeInput_description_text": "PIN Code Input هو عنصر واجهة مستخدم يسمح بالتقاط رموز رقمية قصيرة ذات طول ثابت، عادةً لأغراض المصادقة أو التأكيد، مثل رقم التعريف الشخصي (PIN) المكون من أربعة أو ستة أو ثمانية أرقام.",
 
+  "@_components_progress_indicator": {},
+  "app_components_progressIndicator_description_text": "Progress indicator يُظهر تقدم مهمة ما ويقدم تغذية بصرية. يمكن أن يُظهر قيمة محددة (محدد) أو فقط أن شيئًا ما قيد التقدم (غير محدد).",
+  "app_components_progressIndicator_circularProgressIndicator_description_text": "Circular progress indicator يُظهر تقدم مهمة باستخدام دائرة. مفيد عندما تحتاج إلى تركيز بصري أكثر أو عندما يكون المساحة محدودة.",
+
   "@_components_navigation_bar": {},
   "app_components_navigationBar_description_text": "Bottom bars يوفر الوصول إلى الوجهات الرئيسية للتطبيق باستخدام 3 إلى 5 علامات تبويب دائمة. يتم تمثيل كل وجهة بواسطة أيقونة وعلامة نصية اختيارية.",
   "app_components_navigationBar_badge_count_a11y": "{count, plural, zero {لا توجد إشعارات غير مقروءة} one {إشعار واحد غير مقروء} two {إشعاران غير مقروءين} few {{count} إشعارات غير مقروءة} many {{count} إشعارًا غير مقروء} other {{count} إشعار غير مقروء}}",

app/lib/l10n/ouds_flutter_en.arb

@@ -37,6 +37,7 @@
   "app_themeSettingsDialog_roundedCornerButtons_label" :"Rounded corner button",
   "app_themeSettingsDialog_roundedCornerTextInputs_label" :"Rounded corner text inputs",
   "app_themeSettingsDialog_roundedCornerAlertMessage_label" :"Rounded corner alert message",
+  "app_themeSettingsDialog_roundedCornerProgressIndicators_label" :"Rounded corner progress indicators",
 
   "@_tokens": {},
   "app_tokens_viewCodeExample_label": "View token code example",
@@ -133,6 +134,7 @@
   "app_components_common_action_a11y": "Action",
   "app_components_common_trailingActionCount_label": "Trailing action count",
   "app_components_common_description_tech": "Description",
+  "app_components_common_type_tech" : "Type",
 
   "@_components_alert": {},
   "app_components_alert_tech": "Alert",
@@ -216,7 +218,6 @@
   "@_components_badge": {},
   "app_components_badge_label": "Badge",
   "app_components_badge_description_text":"Badge is a UI element that emphasizes system notifications, status, or the categorization of an information, throughout colour only.",
-  "app_components_badge_type_label" : "Type",
   "app_components_badge_standardType_label": "Standard",
   "app_components_badge_countType_label" : "Count",
   "app_components_badge_iconType_label" : "Icon",
@@ -289,6 +290,18 @@
   "app_components_pinCodeInput_keyboardType_numeric_label": "Numeric",
   "app_components_pinCodeInput_keyboardType_alphanumeric_label": "Alphanumeric",
 
+  "@_components_progress_indicator": {},
+  "app_components_progressIndicator_tech": "Progress indicator",
+  "app_components_progressIndicator_description_text": "Progress indicator shows the progress of a task providing visual feedback. It can show a specific value (determinate) or just that something is in progress (indeterminate).",
+  "app_components_progressIndicator_circularProgressIndicator_tech": "Circular progress indicator",
+  "app_components_progressIndicator_circularProgressIndicator_description_text": "A circular progress indicator shows the progress of a task using a circle. Useful when you need more visual focus or when space is limited.",
+  "app_components_progressIndicator_animated_tech": "Animated",
+  "app_components_progressIndicator_determinate_tech": "Determinate",
+  "app_components_progressIndicator_indeterminate_tech": "Indeterminate",
+  "app_components_progressIndicator_progress_tech": "Progress",
+  "app_components_progressIndicator_track_tech": "Track",
+  "app_components_progressIndicator_gapSize_tech": "Gap size",
+
   "@_components_navigation_bar": {},
   "app_components_navigationBar_label": "Bottom Bar",
   "app_components_navigationBar_description_text": "The Bottom bar provides access to an app’s primary destinations using 3 to 5 persistent tabs. Each destination is represented by an icon and optionally a text label.",