@sincpro/mobile-ui 3.0.0 → 3.1.0

package/dist/Typography/Typography.SelectableText.js

@@ -1,12 +1,100 @@
-import { jsx as _jsx } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { cn } from "../theme/tw.js";
 import { appliedTextStyle } from "../theme/typography.js";
 import { TextInput } from "react-native";
-function SelectableText({ value, variant = "body", semibold = false, className, style, ...props }) {
-    return (_jsx(TextInput, { ...props, className: cn("text-text-primary", className), editable: false, multiline: true, readOnly: true, scrollEnabled: false, showSoftInputOnFocus: false, style: [
-            appliedTextStyle(variant, false, semibold),
-            { padding: 0, textAlignVertical: "top" },
-            style,
-        ], underlineColorAndroid: "transparent", value: value }));
+import { jsx as _jsx } from "nativewind/jsx-runtime";
+function SelectableText(t0) {
+  const $ = _c(21);
+  let className;
+  let props;
+  let style;
+  let t1;
+  let t2;
+  let value;
+  if ($[0] !== t0) {
+    ({
+      value,
+      variant: t1,
+      semibold: t2,
+      className,
+      style,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props;
+    $[3] = style;
+    $[4] = t1;
+    $[5] = t2;
+    $[6] = value;
+  } else {
+    className = $[1];
+    props = $[2];
+    style = $[3];
+    t1 = $[4];
+    t2 = $[5];
+    value = $[6];
+  }
+  const variant = t1 === undefined ? "body" : t1;
+  const semibold = t2 === undefined ? false : t2;
+  let t3;
+  if ($[7] !== className) {
+    t3 = cn("text-text-primary", className);
+    $[7] = className;
+    $[8] = t3;
+  } else {
+    t3 = $[8];
+  }
+  let t4;
+  if ($[9] !== semibold || $[10] !== variant) {
+    t4 = appliedTextStyle(variant, false, semibold);
+    $[9] = semibold;
+    $[10] = variant;
+    $[11] = t4;
+  } else {
+    t4 = $[11];
+  }
+  let t5;
+  if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
+    t5 = {
+      padding: 0,
+      textAlignVertical: "top"
+    };
+    $[12] = t5;
+  } else {
+    t5 = $[12];
+  }
+  let t6;
+  if ($[13] !== style || $[14] !== t4) {
+    t6 = [t4, t5, style];
+    $[13] = style;
+    $[14] = t4;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+  let t7;
+  if ($[16] !== props || $[17] !== t3 || $[18] !== t6 || $[19] !== value) {
+    t7 = _jsx(TextInput, {
+      ...props,
+      className: t3,
+      editable: false,
+      multiline: true,
+      readOnly: true,
+      scrollEnabled: false,
+      showSoftInputOnFocus: false,
+      style: t6,
+      underlineColorAndroid: "transparent",
+      value: value
+    });
+    $[16] = props;
+    $[17] = t3;
+    $[18] = t6;
+    $[19] = value;
+    $[20] = t7;
+  } else {
+    t7 = $[20];
+  }
+  return t7;
 }
 export default SelectableText;

package/dist/Typography/Typography.Text.d.ts

@@ -4,9 +4,11 @@ import { type TextProps } from "react-native";
 /**
  * Typography.Text - Hybrid component (NativeWind + Style)
  *
- * Uses NativeWind className for: spacing, colors, transforms, alignment
  * Uses style prop for: typography variants (fontFamily, fontSize, lineHeight)
- *
+ * Without `className` it renders through a plain StyleSheet path: the theme
+ * color and the modifiers go to `style`, so the most repeated component of the
+ * app never pays for class merging or the NativeWind interop. With `className`
+ * it keeps the class contract (spacing, colors, transforms, alignment).
  */
 interface AppTextProps extends TextProps {
     variant?: keyof typeof typographyVariants;

package/dist/Typography/Typography.Text.js

@@ -1,14 +1,224 @@
-import { jsx as _jsx } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
+import { useTheme } from "../theme/index.js";
 import { cn } from "../theme/tw.js";
 import { appliedTextStyle } from "../theme/typography.js";
 import { StyleSheet, Text } from "react-native";
-function AppText({ variant = "body", bold = false, italic = false, underline = false, align = "left", transform = "none", semibold = false, style, className, children, ...props }) {
-    const textClassName = cn("text-text-primary", align === "center" && "text-center", align === "right" && "text-right", align === "justify" && "text-justify", transform === "uppercase" && "uppercase", transform === "lowercase" && "lowercase", transform === "capitalize" && "capitalize", underline && "underline", italic && "italic", className);
-    const textStyle = {
-        ...appliedTextStyle(variant, bold, semibold),
-        ...StyleSheet.flatten(style),
+
+/**
+ * Typography.Text - Hybrid component (NativeWind + Style)
+ *
+ * Uses style prop for: typography variants (fontFamily, fontSize, lineHeight)
+ * Without `className` it renders through a plain StyleSheet path: the theme
+ * color and the modifiers go to `style`, so the most repeated component of the
+ * app never pays for class merging or the NativeWind interop. With `className`
+ * it keeps the class contract (spacing, colors, transforms, alignment).
+ */
+import { jsx as _jsx } from "nativewind/jsx-runtime";
+const modifiers = StyleSheet.create({
+  center: {
+    textAlign: "center"
+  },
+  right: {
+    textAlign: "right"
+  },
+  justify: {
+    textAlign: "justify"
+  },
+  uppercase: {
+    textTransform: "uppercase"
+  },
+  lowercase: {
+    textTransform: "lowercase"
+  },
+  capitalize: {
+    textTransform: "capitalize"
+  },
+  underline: {
+    textDecorationLine: "underline"
+  },
+  italic: {
+    fontStyle: "italic"
+  }
+});
+function AppText(t0) {
+  const $ = _c(50);
+  let children;
+  let className;
+  let props;
+  let style;
+  let t1;
+  let t2;
+  let t3;
+  let t4;
+  let t5;
+  let t6;
+  let t7;
+  if ($[0] !== t0) {
+    ({
+      variant: t1,
+      bold: t2,
+      italic: t3,
+      underline: t4,
+      align: t5,
+      transform: t6,
+      semibold: t7,
+      style,
+      className,
+      children,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = className;
+    $[3] = props;
+    $[4] = style;
+    $[5] = t1;
+    $[6] = t2;
+    $[7] = t3;
+    $[8] = t4;
+    $[9] = t5;
+    $[10] = t6;
+    $[11] = t7;
+  } else {
+    children = $[1];
+    className = $[2];
+    props = $[3];
+    style = $[4];
+    t1 = $[5];
+    t2 = $[6];
+    t3 = $[7];
+    t4 = $[8];
+    t5 = $[9];
+    t6 = $[10];
+    t7 = $[11];
+  }
+  const variant = t1 === undefined ? "body" : t1;
+  const bold = t2 === undefined ? false : t2;
+  const italic = t3 === undefined ? false : t3;
+  const underline = t4 === undefined ? false : t4;
+  const align = t5 === undefined ? "left" : t5;
+  const transform = t6 === undefined ? "none" : t6;
+  const semibold = t7 === undefined ? false : t7;
+  const theme = useTheme();
+  let t8;
+  if ($[12] !== bold || $[13] !== semibold || $[14] !== variant) {
+    t8 = appliedTextStyle(variant, bold, semibold);
+    $[12] = bold;
+    $[13] = semibold;
+    $[14] = variant;
+    $[15] = t8;
+  } else {
+    t8 = $[15];
+  }
+  const variantStyle = t8;
+  if (className) {
+    const t9 = align === "center" && "text-center";
+    const t10 = align === "right" && "text-right";
+    const t11 = align === "justify" && "text-justify";
+    const t12 = transform === "uppercase" && "uppercase";
+    const t13 = transform === "lowercase" && "lowercase";
+    const t14 = transform === "capitalize" && "capitalize";
+    const t15 = underline && "underline";
+    const t16 = italic && "italic";
+    let t17;
+    if ($[16] !== className || $[17] !== t10 || $[18] !== t11 || $[19] !== t12 || $[20] !== t13 || $[21] !== t14 || $[22] !== t15 || $[23] !== t16 || $[24] !== t9) {
+      t17 = cn("text-text-primary", t9, t10, t11, t12, t13, t14, t15, t16, className);
+      $[16] = className;
+      $[17] = t10;
+      $[18] = t11;
+      $[19] = t12;
+      $[20] = t13;
+      $[21] = t14;
+      $[22] = t15;
+      $[23] = t16;
+      $[24] = t9;
+      $[25] = t17;
+    } else {
+      t17 = $[25];
+    }
+    const textClassName = t17;
+    let t18;
+    if ($[26] !== style) {
+      t18 = StyleSheet.flatten(style);
+      $[26] = style;
+      $[27] = t18;
+    } else {
+      t18 = $[27];
+    }
+    let t19;
+    if ($[28] !== t18 || $[29] !== variantStyle) {
+      t19 = {
+        ...variantStyle,
+        ...t18
+      };
+      $[28] = t18;
+      $[29] = variantStyle;
+      $[30] = t19;
+    } else {
+      t19 = $[30];
+    }
+    const textStyle = t19;
+    let t20;
+    if ($[31] !== children || $[32] !== props || $[33] !== textClassName || $[34] !== textStyle) {
+      t20 = _jsx(Text, {
+        className: textClassName,
+        style: textStyle,
+        ...props,
+        children: children
+      });
+      $[31] = children;
+      $[32] = props;
+      $[33] = textClassName;
+      $[34] = textStyle;
+      $[35] = t20;
+    } else {
+      t20 = $[35];
+    }
+    return t20;
+  }
+  let t9;
+  if ($[36] !== theme.text.primary) {
+    t9 = {
+      color: theme.text.primary
     };
-    return (_jsx(Text, { className: textClassName, style: textStyle, ...props, children: children }));
+    $[36] = theme.text.primary;
+    $[37] = t9;
+  } else {
+    t9 = $[37];
+  }
+  const t10 = align !== "left" && modifiers[align];
+  const t11 = transform !== "none" && modifiers[transform];
+  const t12 = underline && modifiers.underline;
+  const t13 = italic && modifiers.italic;
+  let t14;
+  if ($[38] !== style || $[39] !== t10 || $[40] !== t11 || $[41] !== t12 || $[42] !== t13 || $[43] !== t9 || $[44] !== variantStyle) {
+    t14 = [variantStyle, t9, t10, t11, t12, t13, style];
+    $[38] = style;
+    $[39] = t10;
+    $[40] = t11;
+    $[41] = t12;
+    $[42] = t13;
+    $[43] = t9;
+    $[44] = variantStyle;
+    $[45] = t14;
+  } else {
+    t14 = $[45];
+  }
+  let t15;
+  if ($[46] !== children || $[47] !== props || $[48] !== t14) {
+    t15 = _jsx(Text, {
+      style: t14,
+      ...props,
+      children: children
+    });
+    $[46] = children;
+    $[47] = props;
+    $[48] = t14;
+    $[49] = t15;
+  } else {
+    t15 = $[49];
+  }
+  return t15;
 }
 export default AppText;
 export { AppText };

package/dist/Typography/index.js

@@ -2,9 +2,9 @@ import Heading from "./Typography.Heading.js";
 import SelectableText from "./Typography.SelectableText.js";
 import { AppText } from "./Typography.Text.js";
 export const Typography = {
-    Text: AppText,
-    Heading,
-    SelectableText,
+  Text: AppText,
+  Heading,
+  SelectableText
 };
 export { AppText };
 export { SelectableText };

package/dist/branding.js

@@ -1,24 +1,40 @@
-const state = { logo: undefined, mesh: undefined, meshSize: undefined };
+/**
+ * Centralized brand assets. Set once at app boot via `setBranding({ ... })`. Components
+ * that need the brand logo or mesh symbol read these getters — no need to thread an
+ * asset through every consumer.
+ *
+ * @example
+ *   // app boot (e.g. createAppShell / app entrypoint)
+ *   setBranding({
+ *     logo: require("./assets/logo.png"),
+ *     mesh: require("./assets/brand-mesh.png"),
+ *     meshSize: 56,
+ *   });
+ */
+
+const state = {
+  logo: undefined,
+  mesh: undefined,
+  meshSize: undefined
+};
 export function setBranding(config) {
-    if (config.logo !== undefined)
-        state.logo = config.logo;
-    if (config.mesh !== undefined)
-        state.mesh = config.mesh;
-    if (config.meshSize !== undefined)
-        state.meshSize = config.meshSize;
+  if (config.logo !== undefined) state.logo = config.logo;
+  if (config.mesh !== undefined) state.mesh = config.mesh;
+  if (config.meshSize !== undefined) state.meshSize = config.meshSize;
 }
 export function getBrandingLogo() {
-    return state.logo;
+  return state.logo;
 }
 export function getBrandingMesh() {
-    return state.mesh;
+  return state.mesh;
 }
 export function getBrandingMeshSize() {
-    return state.meshSize;
+  return state.meshSize;
 }
+
 /** Test-only — reset to initial empty state. Not part of the public API. */
 export function __resetBranding() {
-    state.logo = undefined;
-    state.mesh = undefined;
-    state.meshSize = undefined;
+  state.logo = undefined;
+  state.mesh = undefined;
+  state.meshSize = undefined;
 }

package/dist/icons/AddItemIcon.js

@@ -1,4 +1,78 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
+import React from "react";
 import Svg, { ClipPath, Defs, G, Path, Rect } from "react-native-svg";
-const AddItemIcon = ({ size = 25 }) => (_jsxs(Svg, { fill: "none", height: size, viewBox: "0 0 25 24", width: size, children: [_jsxs(G, { clipPath: "url(#clip0_9386_14684)", children: [_jsx(Path, { d: "M8.5 16H5.93C3.64 16 2.5 14.86 2.5 12.57V5.43C2.5 3.14 3.64 2 5.93 2H10.5C12.79 2 13.93 3.14 13.93 5.43", stroke: "#047DF9", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5" }), _jsx(Path, { d: "M19.0703 22H14.5003C12.2103 22 11.0703 20.86 11.0703 18.57V11.43C11.0703 9.14 12.2103 8 14.5003 8H19.0703C21.3603 8 22.5003 9.14 22.5003 11.43V18.57C22.5003 20.86 21.3603 22 19.0703 22Z", stroke: "#047DF9", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5" }), _jsx(Path, { d: "M15.3701 15H18.6301", stroke: "#047DF9", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5" }), _jsx(Path, { d: "M17 16.63V13.37", stroke: "#047DF9", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5" })] }), _jsx(Defs, { children: _jsx(ClipPath, { id: "clip0_9386_14684", children: _jsx(Rect, { fill: "white", height: "24", transform: "translate(0.5)", width: "24" }) }) })] }));
+import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+const AddItemIcon = t0 => {
+  const $ = _c(4);
+  const {
+    size: t1
+  } = t0;
+  const size = t1 === undefined ? 25 : t1;
+  let t2;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = _jsxs(G, {
+      clipPath: "url(#clip0_9386_14684)",
+      children: [_jsx(Path, {
+        d: "M8.5 16H5.93C3.64 16 2.5 14.86 2.5 12.57V5.43C2.5 3.14 3.64 2 5.93 2H10.5C12.79 2 13.93 3.14 13.93 5.43",
+        stroke: "#047DF9",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "1.5"
+      }), _jsx(Path, {
+        d: "M19.0703 22H14.5003C12.2103 22 11.0703 20.86 11.0703 18.57V11.43C11.0703 9.14 12.2103 8 14.5003 8H19.0703C21.3603 8 22.5003 9.14 22.5003 11.43V18.57C22.5003 20.86 21.3603 22 19.0703 22Z",
+        stroke: "#047DF9",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "1.5"
+      }), _jsx(Path, {
+        d: "M15.3701 15H18.6301",
+        stroke: "#047DF9",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "1.5"
+      }), _jsx(Path, {
+        d: "M17 16.63V13.37",
+        stroke: "#047DF9",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "1.5"
+      })]
+    });
+    $[0] = t2;
+  } else {
+    t2 = $[0];
+  }
+  let t3;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = _jsx(Defs, {
+      children: _jsx(ClipPath, {
+        id: "clip0_9386_14684",
+        children: _jsx(Rect, {
+          fill: "white",
+          height: "24",
+          transform: "translate(0.5)",
+          width: "24"
+        })
+      })
+    });
+    $[1] = t3;
+  } else {
+    t3 = $[1];
+  }
+  let t4;
+  if ($[2] !== size) {
+    t4 = _jsxs(Svg, {
+      fill: "none",
+      height: size,
+      viewBox: "0 0 25 24",
+      width: size,
+      children: [t2, t3]
+    });
+    $[2] = size;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  return t4;
+};
 export default AddItemIcon;

package/dist/icons/ArrangeCircle.js

@@ -1,4 +1,84 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
+import React from "react";
 import Svg, { Path } from "react-native-svg";
-const ArrangeCircleIcon = ({ size = 25 }) => (_jsxs(Svg, { fill: "none", height: size, viewBox: "0 0 24 24", width: size, children: [_jsx(Path, { d: "M17.1494 13.82L14.1094 16.86", stroke: "#232933", strokeLinecap: "round", strokeLinejoin: "round", strokeMiterlimit: "10", strokeWidth: "1.5" }), _jsx(Path, { d: "M6.84961 13.82H17.1496", stroke: "#232933", strokeLinecap: "round", strokeLinejoin: "round", strokeMiterlimit: "10", strokeWidth: "1.5" }), _jsx(Path, { d: "M6.84961 10.18L9.88962 7.14001", stroke: "#232933", strokeLinecap: "round", strokeLinejoin: "round", strokeMiterlimit: "10", strokeWidth: "1.5" }), _jsx(Path, { d: "M17.1496 10.18H6.84961", stroke: "#232933", strokeLinecap: "round", strokeLinejoin: "round", strokeMiterlimit: "10", strokeWidth: "1.5" }), _jsx(Path, { d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z", stroke: "black", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.5" })] }));
+import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+const ArrangeCircleIcon = t0 => {
+  const $ = _c(7);
+  const {
+    size: t1
+  } = t0;
+  const size = t1 === undefined ? 25 : t1;
+  let t2;
+  let t3;
+  let t4;
+  let t5;
+  let t6;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = _jsx(Path, {
+      d: "M17.1494 13.82L14.1094 16.86",
+      stroke: "#232933",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeMiterlimit: "10",
+      strokeWidth: "1.5"
+    });
+    t3 = _jsx(Path, {
+      d: "M6.84961 13.82H17.1496",
+      stroke: "#232933",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeMiterlimit: "10",
+      strokeWidth: "1.5"
+    });
+    t4 = _jsx(Path, {
+      d: "M6.84961 10.18L9.88962 7.14001",
+      stroke: "#232933",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeMiterlimit: "10",
+      strokeWidth: "1.5"
+    });
+    t5 = _jsx(Path, {
+      d: "M17.1496 10.18H6.84961",
+      stroke: "#232933",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeMiterlimit: "10",
+      strokeWidth: "1.5"
+    });
+    t6 = _jsx(Path, {
+      d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z",
+      stroke: "black",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: "1.5"
+    });
+    $[0] = t2;
+    $[1] = t3;
+    $[2] = t4;
+    $[3] = t5;
+    $[4] = t6;
+  } else {
+    t2 = $[0];
+    t3 = $[1];
+    t4 = $[2];
+    t5 = $[3];
+    t6 = $[4];
+  }
+  let t7;
+  if ($[5] !== size) {
+    t7 = _jsxs(Svg, {
+      fill: "none",
+      height: size,
+      viewBox: "0 0 24 24",
+      width: size,
+      children: [t2, t3, t4, t5, t6]
+    });
+    $[5] = size;
+    $[6] = t7;
+  } else {
+    t7 = $[6];
+  }
+  return t7;
+};
 export default ArrangeCircleIcon;

package/dist/icons/ArrowDownIcon.js

@@ -1,6 +1,66 @@
-import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
+import React from "react";
 import Svg, { Path } from "react-native-svg";
-function ArrowDownIcon({ size = 56, color = "#FFFFFF" }) {
-    return (_jsxs(Svg, { fill: "none", height: size, viewBox: "0 0 56 56", width: size, children: [_jsx(Path, { d: "M28.0003 51.3333C40.887 51.3333 51.3337 40.8866 51.3337 28C51.3337 15.1133 40.887 4.66663 28.0003 4.66663C15.1137 4.66663 4.66699 15.1133 4.66699 28C4.66699 40.8866 15.1137 51.3333 28.0003 51.3333Z", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "3" }), _jsx(Path, { d: "M28 19.8334V33.8334", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "3" }), _jsx(Path, { d: "M21 29.1666L28 36.1666L35 29.1666", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "3" })] }));
+import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
+function ArrowDownIcon(t0) {
+  const $ = _c(9);
+  const {
+    size: t1,
+    color: t2
+  } = t0;
+  const size = t1 === undefined ? 56 : t1;
+  const color = t2 === undefined ? "#FFFFFF" : t2;
+  let t3;
+  let t4;
+  let t5;
+  if ($[0] !== color) {
+    t3 = _jsx(Path, {
+      d: "M28.0003 51.3333C40.887 51.3333 51.3337 40.8866 51.3337 28C51.3337 15.1133 40.887 4.66663 28.0003 4.66663C15.1137 4.66663 4.66699 15.1133 4.66699 28C4.66699 40.8866 15.1137 51.3333 28.0003 51.3333Z",
+      stroke: color,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: "3"
+    });
+    t4 = _jsx(Path, {
+      d: "M28 19.8334V33.8334",
+      stroke: color,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: "3"
+    });
+    t5 = _jsx(Path, {
+      d: "M21 29.1666L28 36.1666L35 29.1666",
+      stroke: color,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      strokeWidth: "3"
+    });
+    $[0] = color;
+    $[1] = t3;
+    $[2] = t4;
+    $[3] = t5;
+  } else {
+    t3 = $[1];
+    t4 = $[2];
+    t5 = $[3];
+  }
+  let t6;
+  if ($[4] !== size || $[5] !== t3 || $[6] !== t4 || $[7] !== t5) {
+    t6 = _jsxs(Svg, {
+      fill: "none",
+      height: size,
+      viewBox: "0 0 56 56",
+      width: size,
+      children: [t3, t4, t5]
+    });
+    $[4] = size;
+    $[5] = t3;
+    $[6] = t4;
+    $[7] = t5;
+    $[8] = t6;
+  } else {
+    t6 = $[8];
+  }
+  return t6;
 }
 export default ArrowDownIcon;