feat(spark_css): add typed CssFlexShorthand class

- Added `CssFlexShorthand` class in `packages/spark_css/lib/src/css_types/css_flex_shorthand.dart` to support typed `flex` property values.
- Implemented support for keywords (`auto`, `initial`, `none`) and combinations of `flex-grow`, `flex-shrink`, and `flex-basis`.
- Added unit tests in `packages/spark_css/test/css_flex_shorthand_test.dart`.

Author: kevin-sakemaer

packages/spark_css/lib/src/css_types/css_flex_shorthand.dart

@@ -0,0 +1,99 @@
+import 'css_length.dart';
+import 'css_value.dart';
+
+/// CSS flex shorthand property values.
+sealed class CssFlexShorthand implements CssValue {
+  const CssFlexShorthand._();
+
+  static const CssFlexShorthand auto = _CssFlexShorthandKeyword('auto');
+  static const CssFlexShorthand initial = _CssFlexShorthandKeyword('initial');
+  static const CssFlexShorthand none = _CssFlexShorthandKeyword('none');
+
+  /// Creates a flex shorthand value.
+  ///
+  /// Supports the following combinations:
+  /// - [grow]: flex-grow (number)
+  /// - [basis]: flex-basis (length)
+  /// - [grow] and [basis]: flex-grow flex-basis
+  /// - [grow] and [shrink]: flex-grow flex-shrink
+  /// - [grow], [shrink], and [basis]: flex-grow flex-shrink flex-basis
+  ///
+  /// If [shrink] is provided, [grow] must also be provided.
+  factory CssFlexShorthand({num? grow, num? shrink, CssLength? basis}) {
+    if (grow != null) {
+      if (shrink != null) {
+        if (basis != null) {
+          return _CssFlexShorthandValues(grow, shrink, basis);
+        }
+        return _CssFlexShorthandValues(grow, shrink, null);
+      }
+      if (basis != null) {
+        return _CssFlexShorthandValues(grow, null, basis);
+      }
+      return _CssFlexShorthandValues(grow, null, null);
+    } else if (basis != null) {
+      if (shrink != null) {
+        throw ArgumentError('flex-shrink requires flex-grow to be specified.');
+      }
+      return _CssFlexShorthandValues(null, null, basis);
+    } else if (shrink != null) {
+      throw ArgumentError('flex-shrink requires flex-grow to be specified.');
+    }
+
+    throw ArgumentError('At least one of grow or basis must be provided.');
+  }
+
+  /// CSS variable reference.
+  factory CssFlexShorthand.variable(String varName) = _CssFlexShorthandVariable;
+
+  /// Raw CSS value escape hatch.
+  factory CssFlexShorthand.raw(String value) = _CssFlexShorthandRaw;
+
+  /// Global keyword (inherit, initial, unset, revert).
+  factory CssFlexShorthand.global(CssGlobal global) = _CssFlexShorthandGlobal;
+}
+
+final class _CssFlexShorthandKeyword extends CssFlexShorthand {
+  final String keyword;
+  const _CssFlexShorthandKeyword(this.keyword) : super._();
+  @override
+  String toCss() => keyword;
+}
+
+final class _CssFlexShorthandValues extends CssFlexShorthand {
+  final num? grow;
+  final num? shrink;
+  final CssLength? basis;
+
+  const _CssFlexShorthandValues(this.grow, this.shrink, this.basis) : super._();
+
+  @override
+  String toCss() {
+    final parts = <String>[];
+    if (grow != null) parts.add(grow.toString());
+    if (shrink != null) parts.add(shrink.toString());
+    if (basis != null) parts.add(basis!.toCss());
+    return parts.join(' ');
+  }
+}
+
+final class _CssFlexShorthandVariable extends CssFlexShorthand {
+  final String varName;
+  const _CssFlexShorthandVariable(this.varName) : super._();
+  @override
+  String toCss() => 'var(--$varName)';
+}
+
+final class _CssFlexShorthandRaw extends CssFlexShorthand {
+  final String value;
+  const _CssFlexShorthandRaw(this.value) : super._();
+  @override
+  String toCss() => value;
+}
+
+final class _CssFlexShorthandGlobal extends CssFlexShorthand {
+  final CssGlobal global;
+  const _CssFlexShorthandGlobal(this.global) : super._();
+  @override
+  String toCss() => global.toCss();
+}

packages/spark_css/test/css_flex_shorthand_test.dart

@@ -0,0 +1,74 @@
+import 'package:spark_css/spark_css.dart';
+import 'package:spark_css/src/css_types/css_flex_shorthand.dart';
+import 'package:test/test.dart';
+
+void main() {
+  group('CssFlexShorthand', () {
+    test('keywords output correct CSS', () {
+      expect(CssFlexShorthand.auto.toCss(), equals('auto'));
+      expect(CssFlexShorthand.initial.toCss(), equals('initial'));
+      expect(CssFlexShorthand.none.toCss(), equals('none'));
+    });
+
+    test('single value (grow) outputs correct CSS', () {
+      expect(CssFlexShorthand(grow: 1).toCss(), equals('1'));
+      expect(CssFlexShorthand(grow: 0.5).toCss(), equals('0.5'));
+    });
+
+    test('single value (basis) outputs correct CSS', () {
+      expect(
+        CssFlexShorthand(basis: CssLength.px(100)).toCss(),
+        equals('100px'),
+      );
+      expect(CssFlexShorthand(basis: CssLength.auto).toCss(), equals('auto'));
+    });
+
+    test('two values (grow + shrink) outputs correct CSS', () {
+      expect(CssFlexShorthand(grow: 1, shrink: 2).toCss(), equals('1 2'));
+    });
+
+    test('two values (grow + basis) outputs correct CSS', () {
+      expect(
+        CssFlexShorthand(grow: 1, basis: CssLength.percent(50)).toCss(),
+        equals('1 50%'),
+      );
+    });
+
+    test('three values (grow + shrink + basis) outputs correct CSS', () {
+      expect(
+        CssFlexShorthand(grow: 1, shrink: 0, basis: CssLength.auto).toCss(),
+        equals('1 0 auto'),
+      );
+    });
+
+    test('throws ArgumentError when shrink provided without grow', () {
+      expect(() => CssFlexShorthand(shrink: 1), throwsArgumentError);
+      expect(
+        () => CssFlexShorthand(shrink: 1, basis: CssLength.auto),
+        throwsArgumentError,
+      );
+    });
+
+    test('throws ArgumentError when neither grow nor basis provided', () {
+      expect(() => CssFlexShorthand(), throwsArgumentError);
+    });
+
+    test('variable outputs correct CSS', () {
+      expect(
+        CssFlexShorthand.variable('flex-val').toCss(),
+        equals('var(--flex-val)'),
+      );
+    });
+
+    test('raw outputs value as-is', () {
+      expect(CssFlexShorthand.raw('1 1 auto').toCss(), equals('1 1 auto'));
+    });
+
+    test('global outputs correct CSS', () {
+      expect(
+        CssFlexShorthand.global(CssGlobal.inherit).toCss(),
+        equals('inherit'),
+      );
+    });
+  });
+}