Skip to content

Commit 9c714c4

Browse files
Merge pull request #106 from KLEAK-Development/feat/css-place-content-place-self-isolation-blend-modes
feat: add CssPlaceContent, CssPlaceSelf, CssJustifySelf, CssIsolation, CssMixBlendMode, and CssBackgroundBlendMode
2 parents 4131a5e + e104f41 commit 9c714c4

15 files changed

Lines changed: 741 additions & 0 deletions

packages/spark_css/CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,12 @@
2525
- **Feat**: Added `CssTextOverflow` sealed class for `text-overflow` property with `.clip`, `.ellipsis` keywords, `.value()` for custom strings, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
2626
- **Feat**: Added `CssAspectRatio` sealed class for `aspect-ratio` property with `.auto` keyword, `.ratio()`, `.number()`, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
2727
- **Feat**: Added `CssPlaceItems` sealed class for `place-items` shorthand property with align and optional justify parameters, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
28+
- **Feat**: Added `CssPlaceContent` sealed class for `place-content` shorthand property with `CssAlignContent` and optional `CssJustifyContent` parameters, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
29+
- **Feat**: Added `CssPlaceSelf` sealed class for `place-self` shorthand property with `CssAlignSelf` and optional `CssJustifySelf` parameters, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
30+
- **Feat**: Added `CssJustifySelf` sealed class for `justify-self` property with `.auto`, `.normal`, `.stretch`, `.start`, `.end`, `.center`, `.left`, `.right`, `.baseline`, `.firstBaseline`, `.lastBaseline`, `.selfStart`, `.selfEnd` keywords, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
31+
- **Feat**: Added `CssIsolation` sealed class for `isolation` property with `.auto`, `.isolate` keywords, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
32+
- **Feat**: Added `CssMixBlendMode` sealed class for `mix-blend-mode` property with `.normal`, `.multiply`, `.screen`, `.overlay`, `.darken`, `.lighten`, `.colorDodge`, `.colorBurn`, `.hardLight`, `.softLight`, `.difference`, `.exclusion`, `.hue`, `.saturation`, `.color`, `.luminosity` keywords, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
33+
- **Feat**: Added `CssBackgroundBlendMode` sealed class for `background-blend-mode` property with `.normal`, `.multiply`, `.screen`, `.overlay`, `.darken`, `.lighten`, `.colorDodge`, `.colorBurn`, `.hardLight`, `.softLight`, `.difference`, `.exclusion`, `.hue`, `.saturation`, `.color`, `.luminosity` keywords, plus `.variable()`, `.raw()`, and `.global()` escape hatches.
2834

2935
### Changed
3036

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
import 'css_value.dart';
2+
3+
/// CSS background-blend-mode property values.
4+
sealed class CssBackgroundBlendMode implements CssValue {
5+
const CssBackgroundBlendMode._();
6+
7+
static const CssBackgroundBlendMode normal = _CssBackgroundBlendModeKeyword(
8+
'normal',
9+
);
10+
static const CssBackgroundBlendMode multiply = _CssBackgroundBlendModeKeyword(
11+
'multiply',
12+
);
13+
static const CssBackgroundBlendMode screen = _CssBackgroundBlendModeKeyword(
14+
'screen',
15+
);
16+
static const CssBackgroundBlendMode overlay = _CssBackgroundBlendModeKeyword(
17+
'overlay',
18+
);
19+
static const CssBackgroundBlendMode darken = _CssBackgroundBlendModeKeyword(
20+
'darken',
21+
);
22+
static const CssBackgroundBlendMode lighten = _CssBackgroundBlendModeKeyword(
23+
'lighten',
24+
);
25+
static const CssBackgroundBlendMode colorDodge =
26+
_CssBackgroundBlendModeKeyword('color-dodge');
27+
static const CssBackgroundBlendMode colorBurn =
28+
_CssBackgroundBlendModeKeyword('color-burn');
29+
static const CssBackgroundBlendMode hardLight =
30+
_CssBackgroundBlendModeKeyword('hard-light');
31+
static const CssBackgroundBlendMode softLight =
32+
_CssBackgroundBlendModeKeyword('soft-light');
33+
static const CssBackgroundBlendMode difference =
34+
_CssBackgroundBlendModeKeyword('difference');
35+
static const CssBackgroundBlendMode exclusion =
36+
_CssBackgroundBlendModeKeyword('exclusion');
37+
static const CssBackgroundBlendMode hue = _CssBackgroundBlendModeKeyword(
38+
'hue',
39+
);
40+
static const CssBackgroundBlendMode saturation =
41+
_CssBackgroundBlendModeKeyword('saturation');
42+
static const CssBackgroundBlendMode color = _CssBackgroundBlendModeKeyword(
43+
'color',
44+
);
45+
static const CssBackgroundBlendMode luminosity =
46+
_CssBackgroundBlendModeKeyword('luminosity');
47+
48+
/// CSS variable reference.
49+
factory CssBackgroundBlendMode.variable(String varName) =
50+
_CssBackgroundBlendModeVariable;
51+
52+
/// Raw CSS value escape hatch.
53+
factory CssBackgroundBlendMode.raw(String value) = _CssBackgroundBlendModeRaw;
54+
55+
/// Global keyword (inherit, initial, unset, revert).
56+
factory CssBackgroundBlendMode.global(CssGlobal global) =
57+
_CssBackgroundBlendModeGlobal;
58+
}
59+
60+
final class _CssBackgroundBlendModeKeyword extends CssBackgroundBlendMode {
61+
final String keyword;
62+
const _CssBackgroundBlendModeKeyword(this.keyword) : super._();
63+
64+
@override
65+
String toCss() => keyword;
66+
}
67+
68+
final class _CssBackgroundBlendModeVariable extends CssBackgroundBlendMode {
69+
final String varName;
70+
const _CssBackgroundBlendModeVariable(this.varName) : super._();
71+
72+
@override
73+
String toCss() => 'var(--$varName)';
74+
}
75+
76+
final class _CssBackgroundBlendModeRaw extends CssBackgroundBlendMode {
77+
final String value;
78+
const _CssBackgroundBlendModeRaw(this.value) : super._();
79+
80+
@override
81+
String toCss() => value;
82+
}
83+
84+
final class _CssBackgroundBlendModeGlobal extends CssBackgroundBlendMode {
85+
final CssGlobal global;
86+
const _CssBackgroundBlendModeGlobal(this.global) : super._();
87+
88+
@override
89+
String toCss() => global.toCss();
90+
}
Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import 'css_value.dart';
2+
3+
/// CSS isolation property values.
4+
sealed class CssIsolation implements CssValue {
5+
const CssIsolation._();
6+
7+
static const CssIsolation auto = _CssIsolationKeyword('auto');
8+
static const CssIsolation isolate = _CssIsolationKeyword('isolate');
9+
10+
/// CSS variable reference.
11+
factory CssIsolation.variable(String varName) = _CssIsolationVariable;
12+
13+
/// Raw CSS value escape hatch.
14+
factory CssIsolation.raw(String value) = _CssIsolationRaw;
15+
16+
/// Global keyword (inherit, initial, unset, revert).
17+
factory CssIsolation.global(CssGlobal global) = _CssIsolationGlobal;
18+
}
19+
20+
final class _CssIsolationKeyword extends CssIsolation {
21+
final String keyword;
22+
const _CssIsolationKeyword(this.keyword) : super._();
23+
24+
@override
25+
String toCss() => keyword;
26+
}
27+
28+
final class _CssIsolationVariable extends CssIsolation {
29+
final String varName;
30+
const _CssIsolationVariable(this.varName) : super._();
31+
32+
@override
33+
String toCss() => 'var(--$varName)';
34+
}
35+
36+
final class _CssIsolationRaw extends CssIsolation {
37+
final String value;
38+
const _CssIsolationRaw(this.value) : super._();
39+
40+
@override
41+
String toCss() => value;
42+
}
43+
44+
final class _CssIsolationGlobal extends CssIsolation {
45+
final CssGlobal global;
46+
const _CssIsolationGlobal(this.global) : super._();
47+
48+
@override
49+
String toCss() => global.toCss();
50+
}
Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
import 'css_value.dart';
2+
3+
/// CSS justify-self property values.
4+
sealed class CssJustifySelf implements CssValue {
5+
const CssJustifySelf._();
6+
7+
static const CssJustifySelf auto = _CssJustifySelfKeyword('auto');
8+
static const CssJustifySelf normal = _CssJustifySelfKeyword('normal');
9+
static const CssJustifySelf stretch = _CssJustifySelfKeyword('stretch');
10+
static const CssJustifySelf start = _CssJustifySelfKeyword('start');
11+
static const CssJustifySelf end = _CssJustifySelfKeyword('end');
12+
static const CssJustifySelf center = _CssJustifySelfKeyword('center');
13+
static const CssJustifySelf left = _CssJustifySelfKeyword('left');
14+
static const CssJustifySelf right = _CssJustifySelfKeyword('right');
15+
static const CssJustifySelf baseline = _CssJustifySelfKeyword('baseline');
16+
static const CssJustifySelf firstBaseline = _CssJustifySelfKeyword(
17+
'first baseline',
18+
);
19+
static const CssJustifySelf lastBaseline = _CssJustifySelfKeyword(
20+
'last baseline',
21+
);
22+
static const CssJustifySelf selfStart = _CssJustifySelfKeyword('self-start');
23+
static const CssJustifySelf selfEnd = _CssJustifySelfKeyword('self-end');
24+
25+
/// CSS variable reference.
26+
factory CssJustifySelf.variable(String varName) = _CssJustifySelfVariable;
27+
28+
/// Raw CSS value escape hatch.
29+
factory CssJustifySelf.raw(String value) = _CssJustifySelfRaw;
30+
31+
/// Global keyword (inherit, initial, unset, revert).
32+
factory CssJustifySelf.global(CssGlobal global) = _CssJustifySelfGlobal;
33+
}
34+
35+
final class _CssJustifySelfKeyword extends CssJustifySelf {
36+
final String keyword;
37+
const _CssJustifySelfKeyword(this.keyword) : super._();
38+
39+
@override
40+
String toCss() => keyword;
41+
}
42+
43+
final class _CssJustifySelfVariable extends CssJustifySelf {
44+
final String varName;
45+
const _CssJustifySelfVariable(this.varName) : super._();
46+
47+
@override
48+
String toCss() => 'var(--$varName)';
49+
}
50+
51+
final class _CssJustifySelfRaw extends CssJustifySelf {
52+
final String value;
53+
const _CssJustifySelfRaw(this.value) : super._();
54+
55+
@override
56+
String toCss() => value;
57+
}
58+
59+
final class _CssJustifySelfGlobal extends CssJustifySelf {
60+
final CssGlobal global;
61+
const _CssJustifySelfGlobal(this.global) : super._();
62+
63+
@override
64+
String toCss() => global.toCss();
65+
}
Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
import 'css_value.dart';
2+
3+
/// CSS mix-blend-mode property values.
4+
sealed class CssMixBlendMode implements CssValue {
5+
const CssMixBlendMode._();
6+
7+
static const CssMixBlendMode normal = _CssMixBlendModeKeyword('normal');
8+
static const CssMixBlendMode multiply = _CssMixBlendModeKeyword('multiply');
9+
static const CssMixBlendMode screen = _CssMixBlendModeKeyword('screen');
10+
static const CssMixBlendMode overlay = _CssMixBlendModeKeyword('overlay');
11+
static const CssMixBlendMode darken = _CssMixBlendModeKeyword('darken');
12+
static const CssMixBlendMode lighten = _CssMixBlendModeKeyword('lighten');
13+
static const CssMixBlendMode colorDodge = _CssMixBlendModeKeyword(
14+
'color-dodge',
15+
);
16+
static const CssMixBlendMode colorBurn = _CssMixBlendModeKeyword(
17+
'color-burn',
18+
);
19+
static const CssMixBlendMode hardLight = _CssMixBlendModeKeyword(
20+
'hard-light',
21+
);
22+
static const CssMixBlendMode softLight = _CssMixBlendModeKeyword(
23+
'soft-light',
24+
);
25+
static const CssMixBlendMode difference = _CssMixBlendModeKeyword(
26+
'difference',
27+
);
28+
static const CssMixBlendMode exclusion = _CssMixBlendModeKeyword('exclusion');
29+
static const CssMixBlendMode hue = _CssMixBlendModeKeyword('hue');
30+
static const CssMixBlendMode saturation = _CssMixBlendModeKeyword(
31+
'saturation',
32+
);
33+
static const CssMixBlendMode color = _CssMixBlendModeKeyword('color');
34+
static const CssMixBlendMode luminosity = _CssMixBlendModeKeyword(
35+
'luminosity',
36+
);
37+
38+
/// CSS variable reference.
39+
factory CssMixBlendMode.variable(String varName) = _CssMixBlendModeVariable;
40+
41+
/// Raw CSS value escape hatch.
42+
factory CssMixBlendMode.raw(String value) = _CssMixBlendModeRaw;
43+
44+
/// Global keyword (inherit, initial, unset, revert).
45+
factory CssMixBlendMode.global(CssGlobal global) = _CssMixBlendModeGlobal;
46+
}
47+
48+
final class _CssMixBlendModeKeyword extends CssMixBlendMode {
49+
final String keyword;
50+
const _CssMixBlendModeKeyword(this.keyword) : super._();
51+
52+
@override
53+
String toCss() => keyword;
54+
}
55+
56+
final class _CssMixBlendModeVariable extends CssMixBlendMode {
57+
final String varName;
58+
const _CssMixBlendModeVariable(this.varName) : super._();
59+
60+
@override
61+
String toCss() => 'var(--$varName)';
62+
}
63+
64+
final class _CssMixBlendModeRaw extends CssMixBlendMode {
65+
final String value;
66+
const _CssMixBlendModeRaw(this.value) : super._();
67+
68+
@override
69+
String toCss() => value;
70+
}
71+
72+
final class _CssMixBlendModeGlobal extends CssMixBlendMode {
73+
final CssGlobal global;
74+
const _CssMixBlendModeGlobal(this.global) : super._();
75+
76+
@override
77+
String toCss() => global.toCss();
78+
}
Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
import 'css_flex.dart';
2+
import 'css_value.dart';
3+
4+
/// CSS place-content shorthand property values.
5+
sealed class CssPlaceContent implements CssValue {
6+
const CssPlaceContent._();
7+
8+
/// Shorthand with align and optional justify.
9+
factory CssPlaceContent(CssAlignContent align, [CssJustifyContent? justify]) =
10+
_CssPlaceContentShorthand;
11+
12+
/// CSS variable reference.
13+
factory CssPlaceContent.variable(String varName) = _CssPlaceContentVariable;
14+
15+
/// Raw CSS value escape hatch.
16+
factory CssPlaceContent.raw(String value) = _CssPlaceContentRaw;
17+
18+
/// Global keyword (inherit, initial, unset, revert).
19+
factory CssPlaceContent.global(CssGlobal global) = _CssPlaceContentGlobal;
20+
}
21+
22+
final class _CssPlaceContentShorthand extends CssPlaceContent {
23+
final CssAlignContent align;
24+
final CssJustifyContent? justify;
25+
const _CssPlaceContentShorthand(this.align, [this.justify]) : super._();
26+
27+
@override
28+
String toCss() {
29+
if (justify == null) return align.toCss();
30+
return '${align.toCss()} ${justify!.toCss()}';
31+
}
32+
}
33+
34+
final class _CssPlaceContentVariable extends CssPlaceContent {
35+
final String varName;
36+
const _CssPlaceContentVariable(this.varName) : super._();
37+
38+
@override
39+
String toCss() => 'var(--$varName)';
40+
}
41+
42+
final class _CssPlaceContentRaw extends CssPlaceContent {
43+
final String value;
44+
const _CssPlaceContentRaw(this.value) : super._();
45+
46+
@override
47+
String toCss() => value;
48+
}
49+
50+
final class _CssPlaceContentGlobal extends CssPlaceContent {
51+
final CssGlobal global;
52+
const _CssPlaceContentGlobal(this.global) : super._();
53+
54+
@override
55+
String toCss() => global.toCss();
56+
}

0 commit comments

Comments
 (0)