@bashem/rn-charts 0.0.3 → 0.0.5

package/src/skia/PieChart/usePieChart.ts

@@ -1,18 +1,175 @@
-import { useState } from "react";
-import type { PieChartProps, PieChartStyles, PieSlice, PopupData } from "./PieChart";
-import { rect, Skia } from "@shopify/react-native-skia";
+import { useMemo, useState } from "react";
+import type { PieChartProps, PopupData } from "./PieChart";
+import { rect, Skia, type SkPath } from "@shopify/react-native-skia";
 import { getRandomRGBColor } from "../common";
 
-function deegreesToRadians(degrees: number): number {
+function degreesToRadians(degrees: number): number {
 	return (degrees * Math.PI) / 180;
 }
 
 function ypoint(angle: number, radius: number, cy: number): number {
-	return cy - radius * Math.sin(deegreesToRadians(angle));
+	return cy - radius * Math.sin(degreesToRadians(angle));
 }
 
 function xpoint(angle: number, radius: number, cx: number): number {
-	return cx - radius * Math.cos(deegreesToRadians(angle));
+	return cx - radius * Math.cos(degreesToRadians(angle));
+}
+
+type Point = { x: number; y: number; };
+
+function euclideanDistance(dx: number, dy: number) {
+	return Math.hypot(dx, dy);
+}
+
+function getProportionPoint(
+	point: Point,
+	segment: number,
+	length: number,
+	dx: number,
+	dy: number
+): Point {
+	const factor = segment / length;
+
+	return {
+		x: point.x - dx * factor,
+		y: point.y - dy * factor,
+	};
+}
+
+function angle(cx: number, cy: number, x: number, y: number) {
+	return (Math.atan2(y - cy, x - cx) * (180 / Math.PI) + 360) % 360;
+}
+
+// https://stackoverflow.com/a/24780108/13509919
+function drawRoundedCorner(
+	path: SkPath,
+	angularPoint: Point,
+	p1: Point,
+	p2: Point,
+	radius: number
+) {
+	// Vector 1
+	const dx1 = angularPoint.x - p1.x;
+	const dy1 = angularPoint.y - p1.y;
+
+	// Vector 2
+	const dx2 = angularPoint.x - p2.x;
+	const dy2 = angularPoint.y - p2.y;
+
+	// Angle / 2
+	let angleHalf =
+		(Math.atan2(dy1, dx1) - Math.atan2(dy2, dx2)) / 2;
+
+	const tan = Math.abs(Math.tan(angleHalf));
+	if (tan === 0) return;
+
+	let segment = radius / tan;
+
+	// Lengths
+	const length1 = euclideanDistance(dx1, dy1);
+	const length2 = euclideanDistance(dx2, dy2);
+
+	const length = Math.min(length1, length2);
+
+	// Clamp
+	if (segment > length) {
+		segment = length;
+		radius = length * tan;
+	}
+
+	// Trimmed points
+	const p1Cross = getProportionPoint(
+		angularPoint,
+		segment,
+		length1,
+		dx1,
+		dy1
+	);
+
+	const p2Cross = getProportionPoint(
+		angularPoint,
+		segment,
+		length2,
+		dx2,
+		dy2
+	);
+
+	// Circle center
+	const dx = angularPoint.x * 2 - p1Cross.x - p2Cross.x;
+	const dy = angularPoint.y * 2 - p1Cross.y - p2Cross.y;
+
+	const L = euclideanDistance(dx, dy);
+	const d = Math.hypot(segment, radius);
+
+	const circlePoint = getProportionPoint(
+		angularPoint,
+		d,
+		L,
+		dx,
+		dy
+	);
+
+	// Angles (degrees for Skia)
+	let startAngle = angle(
+		circlePoint.x,
+		circlePoint.y,
+		p1Cross.x,
+		p1Cross.y
+	);
+
+	let endAngle = angle(
+		circlePoint.x,
+		circlePoint.y,
+		p2Cross.x,
+		p2Cross.y
+	);
+
+	let sweepAngle = endAngle - startAngle;
+
+	// Normalize
+	if (sweepAngle < 0) {
+		const temp = startAngle;
+		startAngle = endAngle;
+		sweepAngle = temp - endAngle;
+	}
+
+	if (sweepAngle > 180) {
+		sweepAngle = 180 - sweepAngle;
+	}
+
+	path.moveTo(p1Cross.x, p1Cross.y);
+
+	// arc
+	path.addArc(
+		rect(
+			circlePoint.x - radius,
+			circlePoint.y - radius,
+			radius * 2,
+			radius * 2
+		),
+		startAngle,
+		sweepAngle
+	);
+	path.lineTo(p1Cross.x, p1Cross.y);
+	path.close();
+
+	drawLines(path, [
+		{ x: p1.x, y: p1.y },
+		{ x: p1Cross.x, y: p1Cross.y },
+		{ x: p2Cross.x, y: p2Cross.y },
+		{ x: p2.x, y: p2.y },
+		{ x: p1.x, y: p1.y },
+	]);
+}
+
+function drawLines(path: SkPath, points: Point[]) {
+	if (points.length === 0) return;
+
+	path.moveTo(points[0]!.x, points[0]!.y);
+	for (let i = 1; i < points.length; i++) {
+		path.lineTo(points[i]!.x, points[i]!.y);
+	}
+	path.close();
 }
 
 function getCircularPoints(
@@ -30,6 +187,9 @@ function getCircularPoints(
 	return [x1, y1, x2, y2];
 }
 
+// FIXME: Doesn't work innerradius is set to 0, need to investigate why. If it is set to a very small number, it works fine. COPILOT: This is a known issue in Skia when the path has self-intersection. Issue also occurs when rounding is set and innerRadius is small.
+// QUICKFIX: If innerRadius is 0, we can set it to a very small number like 0.001 to avoid the issue.
+// TODO: Verify the rounding of corners throughly
 export function usePieChart({
 	slices,
 	style,
@@ -40,64 +200,151 @@ export function usePieChart({
 
 	const radius = style.radius ?? 150;
 	const diameter = radius * 2;
-	const innerRadius = style.innerRadius ?? 100;
-	const cx = radius;
-	const cy = radius;
-
-	const total = slices.reduce((sum, slice) => sum + slice.value, 0);
-
-	let startAngle = 0;
-
-	const paths = slices.map(({ value, color }, index) => {
-		const sweepAngle = (value / total) * 360;
-
-		let [x1, y1, x2, y2] = getCircularPoints(
-			startAngle,
-			radius,
-			sweepAngle,
-			cx,
-			cy
-		);
-		let [cx1, cy1, cx2, cy2] = getCircularPoints(
-			startAngle,
-			innerRadius,
-			sweepAngle,
-			cx,
-			cy
-		);
-
-		const path = Skia.Path.Make();
-		path.moveTo(cx1, cy1);
-		path.lineTo(x1, y1);
-		path.addArc(
-			rect(
-				cx - radius,
-				cy - radius,
-				radius * 2,
-				radius * 2
-			),
-			startAngle + 180,
-			sweepAngle
-		);
-		path.lineTo(cx2, cy2);
-
-		path.addArc(
-			rect(
-				cx - innerRadius,
-				cy - innerRadius,
-				innerRadius * 2,
-				innerRadius * 2
-			),
-			startAngle + 180 + sweepAngle,
-			-sweepAngle
-		);
-		path.lineTo(x1, y1);
-		path.close();
-
-		startAngle += sweepAngle;
-
-		return { path, color: color ?? getRandomRGBColor() };
-	});
+	const width = diameter + 30;
+	const height = width;
+	const innerRadius = Math.max(0.0001, style.innerRadius ?? 100);
+	const interSliceGap = style.interSliceGap ?? 20;
+	const cx = width / 2;
+	const cy = height / 2;
+
+	const { paths, total } = useMemo(() => {
+		const total = slices.reduce((sum, slice) => sum + slice.value, 0);
+		let startAngle = style.startAngle ?? 0;
+
+		const paths = slices.map(({ value, color, radius: givenRoundRadius = 0 }, index) => {
+			const sweepAngleTobeAdded = (value / total) * 360;
+			let currentStartAngle = startAngle;
+			let sweepAngle = sweepAngleTobeAdded;
+			startAngle += sweepAngleTobeAdded;
+
+			const outerCircleLength = 2 * Math.PI * radius;
+			const innerCircleLength = 2 * Math.PI * innerRadius;
+			const roundRadius = Math.min(givenRoundRadius, (radius - innerRadius) / 2, innerCircleLength / 2);
+
+			let angleReductionForGap = !interSliceGap ? 0 : (interSliceGap / outerCircleLength) * 360;
+			let angleReductionForRounding = (roundRadius / outerCircleLength) * 360 * 2;
+			let angleReductionForInnerCircle = (roundRadius / innerCircleLength) * 360 * 2;
+
+			currentStartAngle += angleReductionForGap / 2;
+			sweepAngle -= angleReductionForGap;
+
+			let innerCircleStartAngle = currentStartAngle;
+			let innerCircleSweepAngle = sweepAngle;
+
+			const boundaryCircleStartingAngle = currentStartAngle + angleReductionForRounding / 2;
+			const boundaryCircleSweepAngle = sweepAngle - angleReductionForRounding;
+
+			const innerCircleBoundaryStartingAngle = innerCircleStartAngle + angleReductionForInnerCircle / 2;
+			const innerCircleBoundarySweepAngle = innerCircleSweepAngle - angleReductionForInnerCircle;
+			// Outer Circle
+			let [x1, y1, x2, y2] = getCircularPoints(
+				boundaryCircleStartingAngle,
+				radius,
+				boundaryCircleSweepAngle,
+				cx,
+				cy
+			);
+
+			let [cx1, cy1, cx2, cy2] = getCircularPoints(
+				currentStartAngle,
+				radius,
+				sweepAngle,
+				cx,
+				cy
+			);
+
+			let [rx1, ry1, rx2, ry2] = getCircularPoints(
+				currentStartAngle,
+				radius - roundRadius,
+				sweepAngle,
+				cx,
+				cy
+			);
+
+			// Inner circle
+			let [ix1, iy1, ix2, iy2] = getCircularPoints(
+				innerCircleBoundaryStartingAngle,
+				innerRadius,
+				innerCircleBoundarySweepAngle,
+				cx,
+				cy
+			);
+
+			let [cix1, ciy1, cix2, ciy2] = getCircularPoints(
+				innerCircleStartAngle,
+				innerRadius,
+				innerCircleSweepAngle,
+				cx,
+				cy
+			);
+			let [rix1, riy1, rix2, riy2] = getCircularPoints(
+				innerCircleStartAngle,
+				innerRadius + roundRadius,
+				innerCircleSweepAngle,
+				cx,
+				cy
+			);
+
+			let path = Skia.Path.Make();
+			drawRoundedCorner(path, { x: cx2, y: cy2 }, { x: x2, y: y2 }, { x: rx2, y: ry2 }, roundRadius);
+			drawRoundedCorner(path, { x: cix2, y: ciy2 }, { x: rix2, y: riy2 }, { x: ix2, y: iy2 }, roundRadius);
+			drawLines(path, [
+				{ x: x2, y: y2 },
+				{ x: rx2, y: ry2 },
+				{ x: rix2, y: riy2 },
+				{ x: ix2, y: iy2 },
+				{ x: x2, y: y2 },
+			]);
+
+			path.moveTo(x1, y1);
+			path.addArc(
+				rect(
+					cx - radius,
+					cy - radius,
+					radius * 2,
+					radius * 2
+				),
+				boundaryCircleStartingAngle + 180,
+				boundaryCircleSweepAngle
+			);
+
+			path.lineTo(ix2, iy2);
+
+			path.addArc(
+				rect(
+					cx - innerRadius,
+					cy - innerRadius,
+					innerRadius * 2,
+					innerRadius * 2
+				),
+				innerCircleBoundaryStartingAngle + 180 + innerCircleBoundarySweepAngle,
+				-innerCircleBoundarySweepAngle
+			);
+			path.lineTo(x1, y1);
+			path.close();
+
+			drawRoundedCorner(path, { x: cix1, y: ciy1 }, { x: ix1, y: iy1 }, { x: rix1, y: riy1 }, roundRadius);
+			drawRoundedCorner(path, { x: cx1, y: cy1 }, { x: rx1, y: ry1 }, { x: x1, y: y1 }, roundRadius);
+			drawLines(path, [
+				{ x: ix1, y: iy1 },
+				{ x: rix1, y: riy1 },
+				{ x: rx1, y: ry1 },
+				{ x: x1, y: y1 },
+				{ x: ix1, y: iy1 },
+			]);
+
+			return { path, color: color ?? getRandomRGBColor() };
+		});
+		return { paths, total };
+	}, [
+		slices,
+		radius,
+		innerRadius,
+		interSliceGap,
+		cx,
+		cy,
+		style.startAngle
+	]);
 
 	const touchHandler = (locationX: number, locationY: number) => {
 		if (!onSliceTouch || locationX < 0 || locationY < 0 || locationX >= diameter || locationY >= diameter) {
@@ -114,8 +361,6 @@ export function usePieChart({
 
 			let lastAngle = (slice.value / total) * 360;
 			if (path.contains(locationX, locationY)) {
-				const label = slice.label || 'Slice';
-
 				const outerX = xpoint(angles + lastAngle / 2, radius, cx);
 				const innerX = xpoint(angles + lastAngle / 2, innerRadius, cx);
 
@@ -145,12 +390,17 @@ export function usePieChart({
 			setPopupData(undefined);
 		}
 	};
+
 	return {
 		paths,
+		height,
+		width,
 		diameter,
 		innerRadius,
 		radius,
 		popupData,
 		touchHandler,
+		cx,
+		cy
 	};
 }

package/src/skia/Popup.tsx

@@ -2,9 +2,9 @@ import React from 'react';
 import { Modal, View } from 'react-native';
 
 export interface PopupStyle<T> {
-	width?: number;
-	height?: number;
-	renderPopup?: (data: T) => React.ReactNode;
+  width?: number;
+  height?: number;
+  renderPopup?: (data: T) => React.ReactNode;
 }
 
 interface PopupData<T> {
@@ -19,7 +19,7 @@ interface PopupProps<T> {
   totalHeight: number;
   touchHandler?: (x: number, y: number) => void;
   onTouchOutside?: () => void;
-	popupStyle?: PopupStyle<T>;
+  popupStyle?: PopupStyle<T>;
   viewOffset: {
     x: number;
     y: number;
@@ -63,13 +63,13 @@ export default function Popup<T>({
           >
             {popupData && !Array.isArray(popupData) && (
               <View
-                style={[
+                style={
                   {
                     position: 'absolute',
                     left: Math.max(
                       0,
                       Math.min(popupData.x, totalWidth - (popupStyle?.width ?? 0)) +
-                        viewOffset.x
+                      viewOffset.x
                     ),
                     top: Math.max(
                       0,
@@ -78,8 +78,10 @@ export default function Popup<T>({
                         totalHeight - (popupStyle?.height ?? 0)
                       ) + viewOffset.y
                     ),
-                  },
-                ]}
+                    width: popupStyle.width,
+                    height: popupStyle.height
+                  }
+                }
                 onTouchStart={(e) => e.stopPropagation()}
               >
                 {popupStyle?.renderPopup(popupData.data)}
@@ -88,34 +90,34 @@ export default function Popup<T>({
 
             {popupData &&
               Array.isArray(popupData) &&
-              popupData.map((popupItem, index) => 
-               (
-                  <View
-                    key={index}
-                    style={[
-                      {
-                        position: 'absolute',
-                        left: Math.max(
-                          0,
-                          Math.min(
-                            popupItem.x,
-                            totalWidth - (popupStyle?.width ?? 0)
-                          ) + viewOffset.x
-                        ),
-                        top: Math.max(
-                          0,
-                          Math.min(
-                            popupItem.y,
-                            totalHeight - (popupStyle?.height ?? 0)
-                          ) + viewOffset.y
-                        ),
-                      },
-                    ]}
-                    onTouchStart={(e) => e.stopPropagation()}
-                  >
-                    {popupStyle?.renderPopup?.(popupItem.data)}
-                  </View>
-                )
+              popupData.map((popupItem, index) =>
+              (
+                <View
+                  key={index}
+                  style={
+                    {
+                      position: 'absolute',
+                      left: Math.max(
+                        0,
+                        Math.min(
+                          popupItem.x,
+                          totalWidth - (popupStyle?.width ?? 0)
+                        ) + viewOffset.x
+                      ),
+                      top: Math.max(
+                        0,
+                        Math.min(
+                          popupItem.y,
+                          totalHeight - (popupStyle?.height ?? 0)
+                        ) + viewOffset.y
+                      ),
+                    }
+                  }
+                  onTouchStart={(e) => e.stopPropagation()}
+                >
+                  {popupStyle?.renderPopup?.(popupItem.data)}
+                </View>
+              )
               )}
           </View>
         </Modal>

package/src/skia/common.ts

@@ -1,5 +1,4 @@
-import { listFontFamilies, matchFont, Skia, TextAlign, type SkFont, type SkParagraph, type SkTextStyle } from "@shopify/react-native-skia";
-import { Platform } from "react-native";
+import { I18nManager } from "react-native";
 
 export interface CommonStyle {
 	padding?: number;
@@ -11,21 +10,15 @@ export interface CommonStyle {
 	paddingRight?: number;
 	backgroundColor?: string;
 	disableRTL?: boolean;
-	font?: SkFont;
-	fontSize?: number;
-}
-
-export function getCommonStyleFont(style?: CommonStyle) {
-	const fontSize = style?.font?.getSize() ?? style?.fontSize ?? 12;
-	const font = style?.font ?? getFont(fontSize);
-	return { font, fontSize };
 }
 
 export function getPaddings(style?: CommonStyle) {
 	const paddingTop = style?.paddingTop ?? style?.padding ?? 0;
 	const paddingBottom = style?.paddingBottom ?? style?.padding ?? 0;
-	const paddingLeft = style?.paddingLeft ?? style?.paddingStart ?? style?.padding ?? 0;
-	const paddingRight = style?.paddingRight ?? style?.paddingEnd ?? style?.padding ?? 0;
+	const isRTL = I18nManager.isRTL && !(style?.disableRTL ?? false)
+
+	const paddingLeft = style?.paddingLeft ?? (isRTL ? style?.paddingEnd : style?.paddingStart) ?? style?.padding ?? 0;
+	const paddingRight = style?.paddingRight ?? (isRTL ? style?.paddingStart : style?.paddingEnd) ?? style?.padding ?? 0;
 	const paddingHorizontal = paddingLeft + paddingRight;
 	const paddingVertical = paddingTop + paddingBottom;
 
@@ -46,37 +39,6 @@ export function getRandomRGBColor() {
 	return `rgb(${r},${g},${b})`;
 };
 
-export const systemFontFamilies = Platform.select({
-	ios: ["Helvetica", "Arial", "Courier"],
-	android: ["roboto-flex", "sans-serif", "Roboto", "serif", "monospace"],
-	default: ["sans-serif", "serif"],
-});
-
-export function getFont(size: number = 14): SkFont {
-	const fontFamily = systemFontFamilies[0];
-	// console.log("Available system font families:", listFontFamilies());
-	// console.log("Using font family:", fontFamily, systemFontFamilies);
-	const font = matchFont({
-		fontFamily,
-		fontSize: size,
-		fontStyle: "normal",
-		fontWeight: "normal",
-	});
-	return font;
-}
-
-export const font = getFont();
-
-function createParagraph(text: string): SkParagraph {
-	const paragraphStyle = {
-		textAlign: TextAlign.Center,
-	};
-
-	const fontStyle: SkTextStyle = {
-		fontFamilies: systemFontFamilies,
-		fontSize: 14,
-	};
-	const paragraph = Skia.ParagraphBuilder.Make(paragraphStyle).pushStyle(fontStyle).addText(text).pop().build();
-
-	return paragraph;
-}
+export interface HandleOutSideTouch {
+  touchedOutside: () => void;
+}

package/lib/module/skia/Common/VerticalLabel.js

@@ -1,73 +0,0 @@
-"use strict";
-
-import { Canvas, Line, Text, Skia } from '@shopify/react-native-skia';
-import { getFont } from "../common.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function VerticalLabel({
-  minValue,
-  maxValue,
-  labelCount,
-  styles
-}) {
-  const {
-    width,
-    height,
-    strokeWidth = 2,
-    strokeColor = 'white',
-    textColor = 'white',
-    paddingTop = 0,
-    paddingRight = 0,
-    paddingBottom = 0,
-    paddingLeft = 0,
-    fontSize = 12,
-    backgroundColor
-  } = styles;
-
-  // Generate evenly spaced values
-  const stepValue = labelCount > 1 ? (maxValue - minValue) / (labelCount - 1) : 0;
-  const labels = Array.from({
-    length: labelCount
-  }, (_, i) => minValue + i * stepValue);
-  const font = getFont(fontSize);
-  const usableHeight = height - paddingTop - paddingBottom - fontSize;
-  const stepY = labelCount > 1 ? usableHeight / (labelCount - 1) : 0;
-
-  // Precompute text paint
-  const paint = Skia.Paint();
-  paint.setColor(Skia.Color(textColor));
-  return /*#__PURE__*/_jsxs(Canvas, {
-    style: {
-      width,
-      height,
-      backgroundColor
-    },
-    children: [/*#__PURE__*/_jsx(Line, {
-      p1: {
-        x: width - paddingRight - strokeWidth / 2,
-        y: paddingTop
-      },
-      p2: {
-        x: width - paddingRight - strokeWidth / 2,
-        y: height - paddingBottom
-      },
-      color: strokeColor,
-      strokeWidth: strokeWidth
-    }), labels.map((label, i) => {
-      const y = height - paddingBottom - stepY * i;
-      const text = label.toFixed(0);
-
-      // measure text width for right-align
-      const textWidth = font.measureText(text).width;
-      const x = width - paddingRight - strokeWidth - 4 - textWidth;
-      return /*#__PURE__*/_jsx(Text, {
-        x: x,
-        y: y,
-        text: text,
-        font: font,
-        color: textColor
-      }, i);
-    })]
-  });
-}
-export default VerticalLabel;
-//# sourceMappingURL=VerticalLabel.js.map

package/lib/module/skia/Common/VerticalLabel.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Canvas","Line","Text","Skia","getFont","jsx","_jsx","jsxs","_jsxs","VerticalLabel","minValue","maxValue","labelCount","styles","width","height","strokeWidth","strokeColor","textColor","paddingTop","paddingRight","paddingBottom","paddingLeft","fontSize","backgroundColor","stepValue","labels","Array","from","length","_","i","font","usableHeight","stepY","paint","Paint","setColor","Color","style","children","p1","x","y","p2","color","map","label","text","toFixed","textWidth","measureText"],"sourceRoot":"../../../../src","sources":["skia/Common/VerticalLabel.tsx"],"mappings":";;AAAA,SAASA,MAAM,EAAEC,IAAI,EAAEC,IAAI,EAAEC,IAAI,QAAQ,4BAA4B;AACrE,SAASC,OAAO,QAA0B,cAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiBtD,SAASC,aAAaA,CAAC;EACrBC,QAAQ;EACRC,QAAQ;EACRC,UAAU;EACVC;AACkB,CAAC,EAAE;EACrB,MAAM;IACJC,KAAK;IACLC,MAAM;IACNC,WAAW,GAAG,CAAC;IACfC,WAAW,GAAG,OAAO;IACrBC,SAAS,GAAG,OAAO;IACnBC,UAAU,GAAG,CAAC;IACdC,YAAY,GAAG,CAAC;IAChBC,aAAa,GAAG,CAAC;IACjBC,WAAW,GAAG,CAAC;IACfC,QAAQ,GAAG,EAAE;IACbC;EACF,CAAC,GAAGX,MAAM;;EAEV;EACA,MAAMY,SAAS,GACbb,UAAU,GAAG,CAAC,GAAG,CAACD,QAAQ,GAAGD,QAAQ,KAAKE,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC;EAC/D,MAAMc,MAAM,GAAGC,KAAK,CAACC,IAAI,CACvB;IAAEC,MAAM,EAAEjB;EAAW,CAAC,EACtB,CAACkB,CAAC,EAAEC,CAAC,KAAKrB,QAAQ,GAAGqB,CAAC,GAAGN,SAC3B,CAAC;EAED,MAAMO,IAAI,GAAG5B,OAAO,CAACmB,QAAQ,CAAC;EAE9B,MAAMU,YAAY,GAAGlB,MAAM,GAAGI,UAAU,GAAGE,aAAa,GAAGE,QAAQ;EACnE,MAAMW,KAAK,GAAGtB,UAAU,GAAG,CAAC,GAAGqB,YAAY,IAAIrB,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC;;EAElE;EACA,MAAMuB,KAAK,GAAGhC,IAAI,CAACiC,KAAK,CAAC,CAAC;EAC1BD,KAAK,CAACE,QAAQ,CAAClC,IAAI,CAACmC,KAAK,CAACpB,SAAS,CAAC,CAAC;EAErC,oBACEV,KAAA,CAACR,MAAM;IAACuC,KAAK,EAAE;MAAEzB,KAAK;MAAEC,MAAM;MAAES;IAAgB,CAAE;IAAAgB,QAAA,gBAChDlC,IAAA,CAACL,IAAI;MACHwC,EAAE,EAAE;QAAEC,CAAC,EAAE5B,KAAK,GAAGM,YAAY,GAAGJ,WAAW,GAAG,CAAC;QAAE2B,CAAC,EAAExB;MAAW,CAAE;MACjEyB,EAAE,EAAE;QACFF,CAAC,EAAE5B,KAAK,GAAGM,YAAY,GAAGJ,WAAW,GAAG,CAAC;QACzC2B,CAAC,EAAE5B,MAAM,GAAGM;MACd,CAAE;MACFwB,KAAK,EAAE5B,WAAY;MACnBD,WAAW,EAAEA;IAAY,CAC1B,CAAC,EAEDU,MAAM,CAACoB,GAAG,CAAC,CAACC,KAAK,EAAEhB,CAAC,KAAK;MACxB,MAAMY,CAAC,GAAG5B,MAAM,GAAGM,aAAa,GAAGa,KAAK,GAAGH,CAAC;MAC5C,MAAMiB,IAAI,GAAGD,KAAK,CAACE,OAAO,CAAC,CAAC,CAAC;;MAE7B;MACA,MAAMC,SAAS,GAAGlB,IAAI,CAACmB,WAAW,CAACH,IAAI,CAAC,CAAClC,KAAK;MAC9C,MAAM4B,CAAC,GAAG5B,KAAK,GAAGM,YAAY,GAAGJ,WAAW,GAAG,CAAC,GAAGkC,SAAS;MAE5D,oBACE5C,IAAA,CAACJ,IAAI;QAEHwC,CAAC,EAAEA,CAAE;QACLC,CAAC,EAAEA,CAAE;QACLK,IAAI,EAAEA,IAAK;QACXhB,IAAI,EAAEA,IAAK;QACXa,KAAK,EAAE3B;MAAU,GALZa,CAMN,CAAC;IAEN,CAAC,CAAC;EAAA,CACI,CAAC;AAEb;AAEA,eAAetB,aAAa","ignoreList":[]}