value property

String? get value

Returns the CSS value of the border radius.

If no corner is set, it returns null. Otherwise, it returns a space-separated string of the corner values in the order: top-left, top-right, bottom-right, bottom-left.

Example:

final borderRadius = BorderRadiusData(
  topLeft: Dim.px(10),
  topRight: Dim.px(20),
  bottomLeft: Dim.px(30),
  bottomRight: Dim.px(40),
);
print(borderRadius.value);
// Output: '10px 20px 40px 30px'

Implementation

String? get value {
  if (props.isEmpty) return null;
  if (props['border-radius'] != null) return props['border-radius'];

  String value = '';
  final topLeft = props['border-top-left-radius'];
  final topRight = props['border-top-right-radius'];
  final bottomRight = props['border-bottom-right-radius'];
  final bottomLeft = props['border-bottom-left-radius'];

  if (topLeft != null) value += '$topLeft ';
  if (topRight != null) value += '$topRight ';
  if (bottomRight != null) value += '$bottomRight ';
  if (bottomLeft != null) value += '$bottomLeft ';

  return value.trim();
}