From b27c6cee5306a229ce36ef92af2d22fd70d6f3c3 Mon Sep 17 00:00:00 2001 From: Dimitris - Rafail Katsampas Date: Sun, 29 Jun 2025 23:48:36 +0300 Subject: [PATCH] fix(core): Improved css clip-path parsing --- packages/core/ui/styling/style-properties.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/core/ui/styling/style-properties.ts b/packages/core/ui/styling/style-properties.ts index e82b0e696f..4326e41107 100644 --- a/packages/core/ui/styling/style-properties.ts +++ b/packages/core/ui/styling/style-properties.ts @@ -201,10 +201,11 @@ function isNonNegativeFiniteNumber(value: number): boolean { } function parseClipPath(value: string): string | ClipPathFunction { - const functionStartIndex = value.indexOf('('); + const funcStartIndex = value.indexOf('('); + const funcEndIndex = value.lastIndexOf(')'); - if (functionStartIndex > -1) { - const functionName = value.substring(0, functionStartIndex).trim(); + if (funcStartIndex > -1 && funcEndIndex > -1) { + const functionName = value.substring(0, funcStartIndex).trim(); switch (functionName) { case 'rect': @@ -212,8 +213,7 @@ function parseClipPath(value: string): string | ClipPathFunction { case 'ellipse': case 'polygon': case 'inset': { - const rule: string = value.replace(`${functionName}(`, '').replace(')', ''); - return new ClipPathFunction(functionName, rule); + return new ClipPathFunction(functionName, value.substring(funcStartIndex + 1, funcEndIndex)); } default: throw new Error(`Clip-path function ${functionName} is not valid.`);