Skip to content

Commit dd7de07

Browse files
nouha06nouha06
committed
Merge branch 'prepare-new-version-2.0.0' into 690-for-phone-number-input-component-update-to-v13
# Conflicts: # app/CHANGELOG.md # ouds_core/CHANGELOG.md
2 parents 764cd45 + 0baf4cc commit dd7de07

4 files changed

Lines changed: 502 additions & 276 deletions

File tree

‎app/CHANGELOG.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
88
### Added
99
### Changed
1010
- [Library] update `Phone number input` component to v1.3 ([#690](https://github.com/Orange-OpenSource/ouds-flutter/issues/690))
11+
- [Library] update `tag` component to v1.5 ([#694](https://github.com/Orange-OpenSource/ouds-flutter/issues/694))
12+
- [Library] update `input tag` component to v1.2 ([#695](https://github.com/Orange-OpenSource/ouds-flutter/issues/695))
1113
- [DemoApp][Library] update tokens 2.5.0 ([#778](https://github.com/Orange-OpenSource/ouds-flutter/issues/778))
1214
- [DemoApp][Library] update tokens 2.4.0 ([#726](https://github.com/Orange-OpenSource/ouds-flutter/issues/726))
1315

1416
### Fixed
1517
- [Library] `Phone number input` Add a hint to explain how to interact with fields ([#571](https://github.com/Orange-OpenSource/ouds-flutter/issues/571))
18+
- [Library] `input tag` the whole component should have the role button ([#481](https://github.com/Orange-OpenSource/ouds-flutter/issues/481))
1619

1720
## [1.3.1](https://github.com/Orange-OpenSource/ouds-flutter/compare/1.3.0...1.3.1) - 2026-05-14
1821
### Added

‎ouds_core/CHANGELOG.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
88
### Added
99
### Changed
1010
- [Library] update `Phone number input` component to v1.3 ([#690](https://github.com/Orange-OpenSource/ouds-flutter/issues/690))
11+
- [Library] update `tag` component to v1.5 ([#694](https://github.com/Orange-OpenSource/ouds-flutter/issues/694))
12+
- [Library] update `input tag` component to v1.2 ([#695](https://github.com/Orange-OpenSource/ouds-flutter/issues/695))
1113
- [Library] update tokens 2.5.0 ([#778](https://github.com/Orange-OpenSource/ouds-flutter/issues/778))
1214
- [Library] update tokens 2.4.0 ([#726](https://github.com/Orange-OpenSource/ouds-flutter/issues/726))
1315

1416
### Fixed
1517
- [Library] `Phone number input` Add a hint to explain how to interact with fields ([#571](https://github.com/Orange-OpenSource/ouds-flutter/issues/571))
18+
- [Library] `input tag` the whole component should have the role button ([#481](https://github.com/Orange-OpenSource/ouds-flutter/issues/481))
1619

1720
## [1.3.1](https://github.com/Orange-OpenSource/ouds-flutter/compare/1.3.0...1.3.1) - 2026-05-14
1821
### Added

‎ouds_core/lib/components/tag/ouds_input_tag.dart‎

Lines changed: 151 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -58,11 +58,7 @@ class OudsInputTag extends StatefulWidget {
5858
final String label;
5959
final VoidCallback? onPressed;
6060

61-
const OudsInputTag({
62-
super.key,
63-
required this.label,
64-
this.onPressed,
65-
});
61+
const OudsInputTag({super.key, required this.label, this.onPressed});
6662

6763
@override
6864
State<OudsInputTag> createState() => _OudsInputTagState();
@@ -93,126 +89,173 @@ class _OudsInputTagState extends State<OudsInputTag> {
9389
}
9490

9591
void _handleFocusChange(bool focus) {
96-
if (widget.onPressed == null) _isFocused = false; // Ignore focus changes if disabled
92+
if (widget.onPressed == null)
93+
_isFocused = false; // Ignore focus changes if disabled
9794
setState(() => _isFocused = focus);
9895
}
9996

10097
@override
10198
Widget build(BuildContext context) {
10299
final isDisabled = widget.onPressed == null;
103-
final interactionModelHover = OudsInheritedInteractionModel.of(context, InteractionAspect.hover);
104-
final interactionModelPressed = OudsInheritedInteractionModel.of(context, InteractionAspect.pressed);
100+
final interactionModelHover = OudsInheritedInteractionModel.of(
101+
context,
102+
InteractionAspect.hover,
103+
);
104+
final interactionModelPressed = OudsInheritedInteractionModel.of(
105+
context,
106+
InteractionAspect.pressed,
107+
);
105108
final isHovered = interactionModelHover?.state.isHovered ?? false;
106109
final isPressed = interactionModelPressed?.state.isPressed ?? false;
107-
final tagStateDeterminer = OudsTagControlStateDeterminer(enabled: !isDisabled, isPressed: isPressed || _isPressed, isHovered: isHovered || _isHovered, isFocused: _isFocused);
110+
final tagStateDeterminer = OudsTagControlStateDeterminer(
111+
enabled: !isDisabled,
112+
isPressed: isPressed || _isPressed,
113+
isHovered: isHovered || _isHovered,
114+
isFocused: _isFocused,
115+
);
108116
final tagState = tagStateDeterminer.determineControlState();
109117
final tagBorderModifier = OudsInputTagControlBorderModifier(context);
110118
final tagTextColorModifier = OudsTagStyleModifier(context);
111-
final tagBackgroundColorModifier = OudsInputTagControlBackgroundColorModifier(context);
119+
final tagBackgroundColorModifier =
120+
OudsInputTagControlBackgroundColorModifier(context);
112121

113-
return Visibility(visible: isVisible, child: _buildInputTag(context, tagBorderModifier, tagTextColorModifier, tagBackgroundColorModifier, tagState, isDisabled));
122+
return Visibility(
123+
visible: isVisible,
124+
child: _buildInputTag(
125+
context,
126+
tagBorderModifier,
127+
tagTextColorModifier,
128+
tagBackgroundColorModifier,
129+
tagState,
130+
isDisabled,
131+
),
132+
);
114133
}
115134

116-
Widget _buildInputTag(BuildContext context, OudsInputTagControlBorderModifier tagBorderModifier, OudsTagStyleModifier tagTextColorModifier,
117-
OudsInputTagControlBackgroundColorModifier tagBgColorModifier, OudsTagControlState tagState, bool isDisabled) {
135+
Widget _buildInputTag(
136+
BuildContext context,
137+
OudsInputTagControlBorderModifier tagBorderModifier,
138+
OudsTagStyleModifier tagTextColorModifier,
139+
OudsInputTagControlBackgroundColorModifier tagBgColorModifier,
140+
OudsTagControlState tagState,
141+
bool isDisabled,
142+
) {
118143
final tagToken = OudsTheme.of(context).componentsTokens(context).tag;
119-
final inputTagToken = OudsTheme.of(context).componentsTokens(context).inputTag;
144+
final inputTagToken = OudsTheme.of(
145+
context,
146+
).componentsTokens(context).inputTag;
120147
final borderTokens = OudsTheme.of(context).borderTokens;
121148
final l10n = OudsLocalizations.of(context);
122149

123-
return Semantics(
124-
enabled: !isDisabled,
125-
label: l10n?.core_tag_tag_input_role_a11y,
126-
container: true,
127-
button: true,
128-
child: Material(
129-
color: Colors.transparent,
130-
child: Container(
131-
constraints: BoxConstraints(
132-
minHeight: tagToken.sizeMinHeightInteractiveArea,
133-
),
134-
child: InkWell(
135-
onTap: () {
136-
if (widget.onPressed != null) {
137-
widget.onPressed!.call();
138-
SemanticsService.announce(l10n?.core_tag_tag_input_removed_a11y(widget.label) ?? '', TextDirection.ltr);
139-
}
140-
},
141-
focusNode: _focusNode,
142-
canRequestFocus: !isDisabled,
143-
splashColor: Colors.transparent,
144-
highlightColor: Colors.transparent,
145-
focusColor: Colors.transparent,
146-
hoverColor: Colors.transparent,
147-
onHover: (hovering) {
148-
setState(() {
149-
if (!isDisabled) {
150-
_isHovered = hovering;
151-
}
152-
});
153-
},
154-
onHighlightChanged: (highlighted) {
155-
setState(() {
156-
if (!isDisabled) {
157-
_isPressed = highlighted;
150+
return MergeSemantics(
151+
child: Semantics(
152+
enabled: !isDisabled,
153+
container: true,
154+
button: true,
155+
child: Material(
156+
color: Colors.transparent,
157+
child: Container(
158+
constraints: BoxConstraints(
159+
minHeight: tagToken.sizeMinHeightInteractiveArea,
160+
),
161+
child: InkWell(
162+
onTap: () {
163+
if (widget.onPressed != null) {
164+
widget.onPressed!.call();
165+
SemanticsService.announce(
166+
l10n?.core_tag_tag_input_removed_a11y(widget.label) ?? '',
167+
TextDirection.ltr,
168+
);
158169
}
159-
});
160-
},
161-
child: Stack(
162-
clipBehavior: Clip.none,
163-
alignment: Alignment.center,
164-
children: [
165-
if (_isFocused)
166-
Positioned(
167-
top: borderTokens.widthFocus / 2,
168-
bottom: borderTokens.widthFocus / 2,
169-
left: -borderTokens.widthFocus / 2,
170+
},
171+
focusNode: _focusNode,
172+
canRequestFocus: !isDisabled,
173+
splashColor: Colors.transparent,
174+
highlightColor: Colors.transparent,
175+
focusColor: Colors.transparent,
176+
hoverColor: Colors.transparent,
177+
onHover: (hovering) {
178+
setState(() {
179+
if (!isDisabled) {
180+
_isHovered = hovering;
181+
}
182+
});
183+
},
184+
onHighlightChanged: (highlighted) {
185+
setState(() {
186+
if (!isDisabled) {
187+
_isPressed = highlighted;
188+
}
189+
});
190+
},
191+
child: Stack(
192+
clipBehavior: Clip.none,
193+
alignment: Alignment.center,
194+
children: [
195+
if (_isFocused)
196+
Positioned(
197+
top: borderTokens.widthFocus / 2,
198+
bottom: borderTokens.widthFocus / 2,
199+
left: -borderTokens.widthFocus / 2,
170200

171-
/// to be changed to enhancement the focus.
172-
right: -borderTokens.widthFocus / 2,
201+
/// to be changed to enhancement the focus.
202+
right: -borderTokens.widthFocus / 2,
173203

174-
/// to be changed to enhancement the focus.
175-
child: Container(
176-
decoration: BoxDecoration(
177-
border: OudsBorder().borderAll(
178-
color: OudsTheme.of(context).colorScheme(context).borderFocus,
179-
width: borderTokens.widthFocus,
180-
),
181-
borderRadius: BorderRadius.circular(
182-
tagToken.borderRadius + borderTokens.widthFocus,
204+
/// to be changed to enhancement the focus.
205+
child: Container(
206+
decoration: BoxDecoration(
207+
border: OudsBorder().borderAll(
208+
color: OudsTheme.of(
209+
context,
210+
).colorScheme(context).borderFocus,
211+
width: borderTokens.widthFocus,
212+
),
213+
borderRadius: BorderRadius.circular(
214+
tagToken.borderRadius + borderTokens.widthFocus,
215+
),
183216
),
184217
),
185218
),
186-
),
187-
Container(
188-
decoration: BoxDecoration(
189-
border: OudsBorder().borderAll(
190-
color: _isFocused ? OudsTheme.of(context).colorScheme(context).borderFocusInset : Colors.transparent,
191-
width: inputTagToken.borderWidthDefaultInteraction,
219+
Container(
220+
decoration: BoxDecoration(
221+
border: OudsBorder().borderAll(
222+
color: _isFocused
223+
? OudsTheme.of(
224+
context,
225+
).colorScheme(context).borderFocusInset
226+
: Colors.transparent,
227+
width: inputTagToken.borderWidthDefaultInteraction,
228+
),
229+
borderRadius: BorderRadius.circular(
230+
tagToken.borderRadius,
231+
),
192232
),
193-
borderRadius: BorderRadius.circular(
194-
tagToken.borderRadius,
233+
child: _buildLayout(
234+
context,
235+
tagBorderModifier,
236+
tagTextColorModifier,
237+
tagBgColorModifier,
238+
tagState,
239+
isDisabled,
195240
),
196241
),
197-
child: _buildLayout(
198-
context,
199-
tagBorderModifier,
200-
tagTextColorModifier,
201-
tagBgColorModifier,
202-
tagState,
203-
isDisabled,
204-
),
205-
),
206-
],
242+
],
243+
),
207244
),
208245
),
209246
),
210247
),
211248
);
212249
}
213250

214-
Widget _buildLayout(BuildContext context, OudsInputTagControlBorderModifier tagBorderModifier, OudsTagStyleModifier tagTextColorModifier,
215-
OudsInputTagControlBackgroundColorModifier tagBgColorModifier, OudsTagControlState tagState, bool isDisabled) {
251+
Widget _buildLayout(
252+
BuildContext context,
253+
OudsInputTagControlBorderModifier tagBorderModifier,
254+
OudsTagStyleModifier tagTextColorModifier,
255+
OudsInputTagControlBackgroundColorModifier tagBgColorModifier,
256+
OudsTagControlState tagState,
257+
bool isDisabled,
258+
) {
216259
final tagToken = OudsTheme.of(context).componentsTokens(context).tag;
217260
final typographyTokens = OudsTheme.of(context).typographyTokens;
218261

@@ -222,18 +265,14 @@ class _OudsInputTagState extends State<OudsInputTag> {
222265
child: Container(
223266
decoration: BoxDecoration(
224267
border: tagBorderModifier.getBorder(tagState),
225-
borderRadius: BorderRadius.circular(
226-
tagToken.borderRadius,
227-
),
268+
borderRadius: BorderRadius.circular(tagToken.borderRadius),
228269
),
229270
),
230271
),
231272

232273
// Content (e.g., Row with icon and label)...
233274
ClipRRect(
234-
borderRadius: BorderRadius.circular(
235-
tagToken.borderRadius,
236-
),
275+
borderRadius: BorderRadius.circular(tagToken.borderRadius),
237276
child: Container(
238277
color: tagBgColorModifier.getBackgroundColor(tagState),
239278
padding: EdgeInsetsDirectional.only(
@@ -248,16 +287,22 @@ class _OudsInputTagState extends State<OudsInputTag> {
248287
crossAxisAlignment: CrossAxisAlignment.center,
249288
children: [
250289
Flexible(
251-
child: Text(widget.label,
252-
textAlign: TextAlign.center,
253-
style: typographyTokens.typeLabelStrongMedium(context).copyWith(
254-
color: tagTextColorModifier.getTextColor(tagState),
255-
)),
290+
child: Text(
291+
widget.label,
292+
textAlign: TextAlign.center,
293+
style: typographyTokens
294+
.typeLabelModerateMedium(context)
295+
.copyWith(
296+
color: tagTextColorModifier.getTextColor(tagState),
297+
),
298+
),
256299
),
257300
SizedBox(width: tagToken.spaceColumnGapDefault),
258301
Semantics(
259302
container: true,
260-
label: OudsLocalizations.of(context)?.core_inputTag_delete_a11y,
303+
label: OudsLocalizations.of(
304+
context,
305+
)?.core_inputTag_delete_a11y,
261306
button: true,
262307
child: SvgPicture.asset(
263308
excludeFromSemantics: true,
@@ -267,7 +312,9 @@ class _OudsInputTagState extends State<OudsInputTag> {
267312
package: OudsTheme.of(context).packageName,
268313
fit: BoxFit.contain,
269314
colorFilter: ColorFilter.mode(
270-
OudsInputTagControlIconColorModifier(context).getIconColor(tagState)!,
315+
OudsInputTagControlIconColorModifier(
316+
context,
317+
).getIconColor(tagState)!,
271318
BlendMode.srcIn,
272319
),
273320
),

0 commit comments

Comments
 (0)