Skip to content

Commit 02c9060

Browse files
authored
feat: border-inline-*-width & border-block-*-width (#72)
1 parent d2ed55a commit 02c9060

File tree

1 file changed

+38
-4
lines changed

1 file changed

+38
-4
lines changed

src/compiler/declarations.ts

Lines changed: 38 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -114,9 +114,11 @@ const parsers: {
114114
"border-inline-end": parseBorderInlineEnd,
115115
"border-inline-end-color": parseColorDeclaration,
116116
"border-inline-end-width": parseBorderSideWidthDeclaration,
117+
"border-inline-end-style": parseBorderInlineStyle,
117118
"border-inline-start": parseBorderInlineStart,
118119
"border-inline-start-color": parseColorDeclaration,
119120
"border-inline-start-width": parseBorderSideWidthDeclaration,
121+
"border-inline-start-style": parseBorderInlineStyle,
120122
"border-inline-width": parseBorderInlineWidth,
121123
"border-inline-style": parseBorderInlineStyle,
122124
"border-left": parseBorderSide,
@@ -493,10 +495,19 @@ export function parseBorderInlineWidth(
493495
}
494496

495497
export function parseBorderInlineStyle(
496-
declaration: DeclarationType<"border-inline-style">,
498+
declaration: DeclarationType<
499+
| "border-inline-style"
500+
| "border-inline-start-style"
501+
| "border-inline-end-style"
502+
>,
497503
builder: StylesheetBuilder,
498504
) {
499-
if (declaration.value.start === declaration.value.end) {
505+
if (typeof declaration.value === "string") {
506+
builder.addDescriptor(
507+
"border-style",
508+
parseBorderStyle(declaration.value, builder),
509+
);
510+
} else if (declaration.value.start === declaration.value.end) {
500511
builder.addDescriptor(
501512
"border-style",
502513
parseBorderStyle(declaration.value.start, builder),
@@ -1965,10 +1976,33 @@ function parseBorderBlockStyle(
19651976
}
19661977

19671978
export function parseBorderSideWidthDeclaration(
1968-
declaration: { value: BorderSideWidth },
1979+
declaration: DeclarationType<
1980+
| "border-block-end-width"
1981+
| "border-block-start-width"
1982+
| "border-bottom-width"
1983+
| "border-inline-end-width"
1984+
| "border-inline-start-width"
1985+
| "border-left-width"
1986+
| "border-right-width"
1987+
| "border-top-width"
1988+
>,
19691989
builder: StylesheetBuilder,
19701990
) {
1971-
return parseBorderSideWidth(declaration.value, builder);
1991+
if (declaration.property.includes("block")) {
1992+
builder.addDescriptor(
1993+
`border-${declaration.property.includes("start") ? "top" : "bottom"}-width`,
1994+
parseBorderSideWidth(declaration.value, builder),
1995+
);
1996+
return;
1997+
} else if (declaration.property.includes("inline")) {
1998+
builder.addDescriptor(
1999+
`border-${declaration.property.includes("start") ? "left" : "right"}-width`,
2000+
parseBorderSideWidth(declaration.value, builder),
2001+
);
2002+
return;
2003+
} else {
2004+
return parseBorderSideWidth(declaration.value, builder);
2005+
}
19722006
}
19732007

19742008
export function parseBorderSideWidth(

0 commit comments

Comments
 (0)