Skip to content

Commit 21d6626

Browse files
Merge pull request #104 from KLEAK-Development/feat/css-object-fit-pointer-events-resize
feat: add CssObjectFit, CssPointerEvents, and CssResize properties
2 parents 000f0ad + bf713a7 commit 21d6626

9 files changed

Lines changed: 275 additions & 0 deletions

File tree

packages/spark_css/CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,9 @@
1818
- **Feat**: Added `CssListStyle` sealed class for `list-style` shorthand property with `.none` keyword, shorthand constructor with optional `type`, `position`, and `image` parameters, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
1919
- **Feat**: Added `CssListStyleType` sealed class with `.disc`, `.circle`, `.square`, `.decimal`, `.none` keywords.
2020
- **Feat**: Added `CssListStylePosition` sealed class with `.inside`, `.outside` keywords.
21+
- **Feat**: Added `CssObjectFit` sealed class for `object-fit` property with `.fill`, `.contain`, `.cover`, `.none`, `.scaleDown` keywords, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
22+
- **Feat**: Added `CssPointerEvents` sealed class for `pointer-events` property with `.auto`, `.none`, `.visiblePainted`, `.visibleFill`, `.visibleStroke`, `.visible`, `.painted`, `.fill`, `.stroke`, `.all` keywords, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
23+
- **Feat**: Added `CssResize` sealed class for `resize` property with `.none`, `.both`, `.horizontal`, `.vertical`, `.block`, `.inline` keywords, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
2124

2225
### Changed
2326

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import 'css_value.dart';
2+
3+
/// CSS object-fit property values.
4+
sealed class CssObjectFit implements CssValue {
5+
const CssObjectFit._();
6+
7+
static const CssObjectFit fill = _CssObjectFitKeyword('fill');
8+
static const CssObjectFit contain = _CssObjectFitKeyword('contain');
9+
static const CssObjectFit cover = _CssObjectFitKeyword('cover');
10+
static const CssObjectFit none = _CssObjectFitKeyword('none');
11+
static const CssObjectFit scaleDown = _CssObjectFitKeyword('scale-down');
12+
13+
/// CSS variable reference.
14+
factory CssObjectFit.variable(String varName) = _CssObjectFitVariable;
15+
16+
/// Raw CSS value escape hatch.
17+
factory CssObjectFit.raw(String value) = _CssObjectFitRaw;
18+
19+
/// Global keyword (inherit, initial, unset, revert).
20+
factory CssObjectFit.global(CssGlobal global) = _CssObjectFitGlobal;
21+
}
22+
23+
final class _CssObjectFitKeyword extends CssObjectFit {
24+
final String keyword;
25+
const _CssObjectFitKeyword(this.keyword) : super._();
26+
27+
@override
28+
String toCss() => keyword;
29+
}
30+
31+
final class _CssObjectFitVariable extends CssObjectFit {
32+
final String varName;
33+
const _CssObjectFitVariable(this.varName) : super._();
34+
35+
@override
36+
String toCss() => 'var(--$varName)';
37+
}
38+
39+
final class _CssObjectFitRaw extends CssObjectFit {
40+
final String value;
41+
const _CssObjectFitRaw(this.value) : super._();
42+
43+
@override
44+
String toCss() => value;
45+
}
46+
47+
final class _CssObjectFitGlobal extends CssObjectFit {
48+
final CssGlobal global;
49+
const _CssObjectFitGlobal(this.global) : super._();
50+
51+
@override
52+
String toCss() => global.toCss();
53+
}
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
import 'css_value.dart';
2+
3+
/// CSS pointer-events property values.
4+
sealed class CssPointerEvents implements CssValue {
5+
const CssPointerEvents._();
6+
7+
static const CssPointerEvents auto = _CssPointerEventsKeyword('auto');
8+
static const CssPointerEvents none = _CssPointerEventsKeyword('none');
9+
static const CssPointerEvents visiblePainted = _CssPointerEventsKeyword(
10+
'visiblePainted',
11+
);
12+
static const CssPointerEvents visibleFill = _CssPointerEventsKeyword(
13+
'visibleFill',
14+
);
15+
static const CssPointerEvents visibleStroke = _CssPointerEventsKeyword(
16+
'visibleStroke',
17+
);
18+
static const CssPointerEvents visible = _CssPointerEventsKeyword('visible');
19+
static const CssPointerEvents painted = _CssPointerEventsKeyword('painted');
20+
static const CssPointerEvents fill = _CssPointerEventsKeyword('fill');
21+
static const CssPointerEvents stroke = _CssPointerEventsKeyword('stroke');
22+
static const CssPointerEvents all = _CssPointerEventsKeyword('all');
23+
24+
/// CSS variable reference.
25+
factory CssPointerEvents.variable(String varName) = _CssPointerEventsVariable;
26+
27+
/// Raw CSS value escape hatch.
28+
factory CssPointerEvents.raw(String value) = _CssPointerEventsRaw;
29+
30+
/// Global keyword (inherit, initial, unset, revert).
31+
factory CssPointerEvents.global(CssGlobal global) = _CssPointerEventsGlobal;
32+
}
33+
34+
final class _CssPointerEventsKeyword extends CssPointerEvents {
35+
final String keyword;
36+
const _CssPointerEventsKeyword(this.keyword) : super._();
37+
38+
@override
39+
String toCss() => keyword;
40+
}
41+
42+
final class _CssPointerEventsVariable extends CssPointerEvents {
43+
final String varName;
44+
const _CssPointerEventsVariable(this.varName) : super._();
45+
46+
@override
47+
String toCss() => 'var(--$varName)';
48+
}
49+
50+
final class _CssPointerEventsRaw extends CssPointerEvents {
51+
final String value;
52+
const _CssPointerEventsRaw(this.value) : super._();
53+
54+
@override
55+
String toCss() => value;
56+
}
57+
58+
final class _CssPointerEventsGlobal extends CssPointerEvents {
59+
final CssGlobal global;
60+
const _CssPointerEventsGlobal(this.global) : super._();
61+
62+
@override
63+
String toCss() => global.toCss();
64+
}
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
import 'css_value.dart';
2+
3+
/// CSS resize property values.
4+
sealed class CssResize implements CssValue {
5+
const CssResize._();
6+
7+
static const CssResize none = _CssResizeKeyword('none');
8+
static const CssResize both = _CssResizeKeyword('both');
9+
static const CssResize horizontal = _CssResizeKeyword('horizontal');
10+
static const CssResize vertical = _CssResizeKeyword('vertical');
11+
static const CssResize block = _CssResizeKeyword('block');
12+
static const CssResize inline = _CssResizeKeyword('inline');
13+
14+
/// CSS variable reference.
15+
factory CssResize.variable(String varName) = _CssResizeVariable;
16+
17+
/// Raw CSS value escape hatch.
18+
factory CssResize.raw(String value) = _CssResizeRaw;
19+
20+
/// Global keyword (inherit, initial, unset, revert).
21+
factory CssResize.global(CssGlobal global) = _CssResizeGlobal;
22+
}
23+
24+
final class _CssResizeKeyword extends CssResize {
25+
final String keyword;
26+
const _CssResizeKeyword(this.keyword) : super._();
27+
28+
@override
29+
String toCss() => keyword;
30+
}
31+
32+
final class _CssResizeVariable extends CssResize {
33+
final String varName;
34+
const _CssResizeVariable(this.varName) : super._();
35+
36+
@override
37+
String toCss() => 'var(--$varName)';
38+
}
39+
40+
final class _CssResizeRaw extends CssResize {
41+
final String value;
42+
const _CssResizeRaw(this.value) : super._();
43+
44+
@override
45+
String toCss() => value;
46+
}
47+
48+
final class _CssResizeGlobal extends CssResize {
49+
final CssGlobal global;
50+
const _CssResizeGlobal(this.global) : super._();
51+
52+
@override
53+
String toCss() => global.toCss();
54+
}

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

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,14 @@ export 'css_justify_items.dart';
3030
export 'css_length.dart';
3131
export 'css_list_style.dart';
3232
export 'css_number.dart';
33+
export 'css_object_fit.dart';
3334
export 'css_outline.dart';
3435
export 'css_overflow.dart';
36+
export 'css_pointer_events.dart';
3537
export 'css_position.dart';
3638
export 'css_radial_shape.dart';
3739
export 'css_radial_size.dart';
40+
export 'css_resize.dart';
3841
export 'css_spacing.dart';
3942
export 'css_text.dart';
4043
export 'css_text_shadow.dart';

packages/spark_css/lib/src/style.dart

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -307,6 +307,9 @@ class Style implements CssStyle {
307307
CssCursor? cursor,
308308
CssBoxShadow? boxShadow,
309309
CssBoxSizing? boxSizing,
310+
CssObjectFit? objectFit,
311+
CssPointerEvents? pointerEvents,
312+
CssResize? resize,
310313
CssFilter? filter,
311314
CssFilter? backdropFilter,
312315
// Backgrounds
@@ -456,6 +459,11 @@ class Style implements CssStyle {
456459
if (cursor != null) _properties['cursor'] = cursor.toCss();
457460
if (boxShadow != null) _properties['box-shadow'] = boxShadow.toCss();
458461
if (boxSizing != null) _properties['box-sizing'] = boxSizing.toCss();
462+
if (objectFit != null) _properties['object-fit'] = objectFit.toCss();
463+
if (pointerEvents != null) {
464+
_properties['pointer-events'] = pointerEvents.toCss();
465+
}
466+
if (resize != null) _properties['resize'] = resize.toCss();
459467
if (filter != null) _properties['filter'] = filter.toCss();
460468
if (backdropFilter != null) {
461469
_properties['backdrop-filter'] = backdropFilter.toCss();
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import 'package:spark_css/spark_css.dart';
2+
import 'package:test/test.dart';
3+
4+
void main() {
5+
group('CssObjectFit', () {
6+
test('keywords output correct CSS', () {
7+
expect(CssObjectFit.fill.toCss(), equals('fill'));
8+
expect(CssObjectFit.contain.toCss(), equals('contain'));
9+
expect(CssObjectFit.cover.toCss(), equals('cover'));
10+
expect(CssObjectFit.none.toCss(), equals('none'));
11+
expect(CssObjectFit.scaleDown.toCss(), equals('scale-down'));
12+
});
13+
test('variable outputs correct CSS', () {
14+
expect(CssObjectFit.variable('of').toCss(), equals('var(--of)'));
15+
});
16+
test('raw outputs value as-is', () {
17+
expect(CssObjectFit.raw('cover').toCss(), equals('cover'));
18+
});
19+
test('global outputs correct CSS', () {
20+
expect(CssObjectFit.global(CssGlobal.inherit).toCss(), equals('inherit'));
21+
});
22+
test('Style.typed integration', () {
23+
final style = Style.typed(objectFit: CssObjectFit.cover);
24+
expect(style.toCss(), contains('object-fit: cover;'));
25+
});
26+
});
27+
}
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import 'package:spark_css/spark_css.dart';
2+
import 'package:test/test.dart';
3+
4+
void main() {
5+
group('CssPointerEvents', () {
6+
test('keywords output correct CSS', () {
7+
expect(CssPointerEvents.auto.toCss(), equals('auto'));
8+
expect(CssPointerEvents.none.toCss(), equals('none'));
9+
expect(CssPointerEvents.visiblePainted.toCss(), equals('visiblePainted'));
10+
expect(CssPointerEvents.visibleFill.toCss(), equals('visibleFill'));
11+
expect(CssPointerEvents.visibleStroke.toCss(), equals('visibleStroke'));
12+
expect(CssPointerEvents.visible.toCss(), equals('visible'));
13+
expect(CssPointerEvents.painted.toCss(), equals('painted'));
14+
expect(CssPointerEvents.fill.toCss(), equals('fill'));
15+
expect(CssPointerEvents.stroke.toCss(), equals('stroke'));
16+
expect(CssPointerEvents.all.toCss(), equals('all'));
17+
});
18+
test('variable outputs correct CSS', () {
19+
expect(CssPointerEvents.variable('pe').toCss(), equals('var(--pe)'));
20+
});
21+
test('raw outputs value as-is', () {
22+
expect(CssPointerEvents.raw('none').toCss(), equals('none'));
23+
});
24+
test('global outputs correct CSS', () {
25+
expect(
26+
CssPointerEvents.global(CssGlobal.inherit).toCss(),
27+
equals('inherit'),
28+
);
29+
});
30+
test('Style.typed integration', () {
31+
final style = Style.typed(pointerEvents: CssPointerEvents.none);
32+
expect(style.toCss(), contains('pointer-events: none;'));
33+
});
34+
});
35+
}
Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import 'package:spark_css/spark_css.dart';
2+
import 'package:test/test.dart';
3+
4+
void main() {
5+
group('CssResize', () {
6+
test('keywords output correct CSS', () {
7+
expect(CssResize.none.toCss(), equals('none'));
8+
expect(CssResize.both.toCss(), equals('both'));
9+
expect(CssResize.horizontal.toCss(), equals('horizontal'));
10+
expect(CssResize.vertical.toCss(), equals('vertical'));
11+
expect(CssResize.block.toCss(), equals('block'));
12+
expect(CssResize.inline.toCss(), equals('inline'));
13+
});
14+
test('variable outputs correct CSS', () {
15+
expect(CssResize.variable('r').toCss(), equals('var(--r)'));
16+
});
17+
test('raw outputs value as-is', () {
18+
expect(CssResize.raw('both').toCss(), equals('both'));
19+
});
20+
test('global outputs correct CSS', () {
21+
expect(CssResize.global(CssGlobal.inherit).toCss(), equals('inherit'));
22+
});
23+
test('Style.typed integration', () {
24+
final style = Style.typed(resize: CssResize.both);
25+
expect(style.toCss(), contains('resize: both;'));
26+
});
27+
});
28+
}

0 commit comments

Comments
 (0)