@factorialco/f0-react-native 0.19.1

package/src/icons/modules/Projects.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgProjects = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M8 6a3 3 0 0 1 3-3h2a3 3 0 0 1 3 3h1a4 4 0 0 1 4 4v6a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4v-6a4 4 0 0 1 4-4zm-3 7v3a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-3h-5v.75c0 .69-.56 1.25-1.25 1.25h-1.5c-.69 0-1.25-.56-1.25-1.25V13zm5-7h4a1 1 0 0 0-1-1h-2a1 1 0 0 0-1 1m2 8a1 1 0 1 0 0-2 1 1 0 0 0 0 2"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgProjects);
+export default ForwardRef;

package/src/icons/modules/Recruitment.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgRecruitment = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M11.579 3.5a7.579 7.579 0 1 0 4.73 13.5l2.253 2.253a.842.842 0 0 0 1.191-1.19L17.5 15.81A7.579 7.579 0 0 0 11.578 3.5m2.32 5.65a2.15 2.15 0 1 1-4.298 0 2.15 2.15 0 0 1 4.298 0m-2.149 2.924c-1.206 0-2.27.569-3.09 1.215-.848.668-.283 1.83.798 1.83h4.584c1.081 0 1.646-1.162.797-1.83-.82-.646-1.883-1.215-3.089-1.215"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgRecruitment);
+export default ForwardRef;

package/src/icons/modules/Reports.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgReports = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M12 2.85c.36 0 .65.292.65.65v.85H20a.65.65 0 0 1 0 1.3h-.35V12A3.65 3.65 0 0 1 16 15.65h-2.43l3.89 3.89a.651.651 0 0 1-.92.92l-3.89-3.89V20a.651.651 0 0 1-1.3 0v-3.43l-3.89 3.89a.651.651 0 0 1-.92-.92l3.891-3.89h-2.43A3.65 3.65 0 0 1 4.35 12V5.65H4a.65.65 0 1 1 0-1.3h7.35V3.5a.65.65 0 0 1 .65-.65m3.96 5.69a.65.65 0 0 0-.817-.083l-.103.083L13 10.58l-1.54-1.54a.65.65 0 0 0-.817-.083l-.103.083-2 2a.65.65 0 0 0 .92.92L11 10.42l1.54 1.54a.65.65 0 0 0 .92 0l2.5-2.5.083-.102a.65.65 0 0 0-.083-.818"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgReports);
+export default ForwardRef;

package/src/icons/modules/Sales.tsx

@@ -0,0 +1,27 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgSales = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      d="m5.172 14.086.171.171 5-5 1.75 1.75a1.768 1.768 0 0 0 2.5-2.5L11.964 5.88a3 3 0 0 0-4.242 0l-2.55 2.55a4 4 0 0 0 0 5.657"
+    />
+    <Path
+      fill="currentColor"
+      d="M13.987 6.063a2.83 2.83 0 0 1 2.856.694l1.672 1.672a4 4 0 0 1 0 5.656l-4.258 4.258a2 2 0 0 1-2.828 0l-.586-.586-.086.086a2 2 0 0 1-2.828 0c-.323-.323-.857-.29-1.305-.2a1.41 1.41 0 0 1-1.28-.386l-.25-.25a1.77 1.77 0 0 1-.467-1.667c.504.335 1.19.281 1.635-.164l4.081-4.08.831.83.115.11a3.068 3.068 0 0 0 4.333-4.333l-.11-.115z"
+    />
+    <Path
+      fill="currentColor"
+      d="m14.593 8.507.121.134a1.768 1.768 0 0 1-2.62 2.366l-1.75-1.75 2.5-2.5z"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgSales);
+export default ForwardRef;

package/src/icons/modules/Settings.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgSettings = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M9.752 4.372c1.038-1.662 3.458-1.662 4.496 0l.74 1.185c.238.38.65.619 1.098.634l1.396.048c1.958.068 3.168 2.164 2.248 3.894l-.656 1.233a1.35 1.35 0 0 0 0 1.268l.656 1.233c.92 1.73-.29 3.826-2.248 3.893l-1.396.049a1.35 1.35 0 0 0-1.098.634l-.74 1.185c-1.038 1.662-3.458 1.662-4.496 0l-.74-1.185a1.35 1.35 0 0 0-1.098-.634l-1.396-.049c-1.958-.067-3.168-2.163-2.248-3.893l.656-1.233a1.35 1.35 0 0 0 0-1.268l-.656-1.233c-.92-1.73.29-3.826 2.248-3.894l1.396-.048a1.35 1.35 0 0 0 1.098-.634zM12 14.5a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgSettings);
+export default ForwardRef;

package/src/icons/modules/Shifts.tsx

@@ -0,0 +1,27 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgShifts = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M5.65 5A3.65 3.65 0 0 0 2 8.65V15a3.65 3.65 0 0 0 3.65 3.65h6.98a5.8 5.8 0 0 1 7.02-8.538V8.65A3.65 3.65 0 0 0 16 5zM5 9.65A.65.65 0 0 1 5.65 9h4a.65.65 0 1 1 0 1.3h-4A.65.65 0 0 1 5 9.65M5 14a.65.65 0 0 1 .65-.65h2a.65.65 0 1 1 0 1.3h-2A.65.65 0 0 1 5 14"
+      clipRule="evenodd"
+    />
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M17.5 11a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9m0 2.35a.65.65 0 0 1 .65.65v1.054c0 .061.03.118.082.152l1.128.753a.65.65 0 0 1-.72 1.082l-1.13-.753a1.48 1.48 0 0 1-.66-1.234V14a.65.65 0 0 1 .65-.65"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgShifts);
+export default ForwardRef;

package/src/icons/modules/Social.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgSocial = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M12 4.35A7.65 7.65 0 1 1 12 19.65 7.65 7.65 0 0 1 12 4.35m3.184 9.104a.876.876 0 0 0-1.23-.137 3.13 3.13 0 0 1-3.907 0 .876.876 0 0 0-1.094 1.366 4.88 4.88 0 0 0 6.094 0 .876.876 0 0 0 .137-1.23M10 9.125a.875.875 0 0 0-.875.875v1a.875.875 0 0 0 1.75 0v-1A.875.875 0 0 0 10 9.125m4 0a.875.875 0 0 0-.875.875v1a.875.875 0 0 0 1.75 0v-1A.875.875 0 0 0 14 9.125"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgSocial);
+export default ForwardRef;

package/src/icons/modules/Software.tsx

@@ -0,0 +1,19 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgSoftware = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      d="M3 7.5a3.6 3.6 0 0 1 3.6-3.6h10.8A3.6 3.6 0 0 1 21 7.5v5.4a3.6 3.6 0 0 1-3.6 3.6h-1.8v1.8h.9a.9.9 0 1 1 0 1.8h-9a.9.9 0 0 1 0-1.8h.9v-1.8H6.6A3.6 3.6 0 0 1 3 12.9zm3.6 7.2h10.8a1.8 1.8 0 0 0 1.8-1.8V7.5a1.8 1.8 0 0 0-1.8-1.8H6.6a1.8 1.8 0 0 0-1.8 1.8v5.4a1.8 1.8 0 0 0 1.8 1.8"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgSoftware);
+export default ForwardRef;

package/src/icons/modules/Spaces.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgSpaces = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M10.446 3.948a3.2 3.2 0 0 1 3.108 0l4.8 2.667A3.2 3.2 0 0 1 20 9.412v5.176a3.2 3.2 0 0 1-1.646 2.797l-4.8 2.667a3.2 3.2 0 0 1-3.108 0l-4.8-2.667A3.2 3.2 0 0 1 4 14.588V9.412a3.2 3.2 0 0 1 1.646-2.797zm2.331 1.399a1.6 1.6 0 0 0-1.554 0L6.447 8 12 11.085 17.553 8zm5.622 4.013L12.8 12.47v6.17l1.6-.889v-3.236a1.6 1.6 0 0 1 .823-1.399l.388-.215a.8.8 0 0 1 1.189.699v2.818l.777-.431a1.6 1.6 0 0 0 .823-1.4V9.36"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgSpaces);
+export default ForwardRef;

package/src/icons/modules/Spending.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgSpending = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M6.667 4.889A2.667 2.667 0 0 0 4 7.6v7.956a3.555 3.555 0 0 0 3.556 3.555h8.889A3.555 3.555 0 0 0 20 15.555V12a3.56 3.56 0 0 0-2.667-3.443V7.556a2.667 2.667 0 0 0-2.667-2.667zm-.889 2.692a.89.89 0 0 0 .889.864h8.888v-.89a.89.89 0 0 0-.889-.888h-8a.89.89 0 0 0-.888.889zm11.555 6.197a1.333 1.333 0 1 1-2.666 0 1.333 1.333 0 0 1 2.666 0"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgSpending);
+export default ForwardRef;

package/src/icons/modules/Tasks.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgTasks = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0m11.338-2.592a.8.8 0 0 1 .054 1.13l-4 4.4a.8.8 0 0 1-1.158.028l-1.6-1.6a.8.8 0 0 1 1.132-1.132l1.006 1.007 3.436-3.78a.8.8 0 0 1 1.13-.053"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgTasks);
+export default ForwardRef;

package/src/icons/modules/TimeOff.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgTimeOff = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M8.907 3.573c-1.102-.007-2.253.416-2.734 1.31a.89.89 0 0 0 .089.974l1.043 1.305C4.51 7.693 3.036 9.572 3 11.328c-.01.517.41.906.888.906h1.418a4.7 4.7 0 0 0-.244 3.477.888.888 0 0 0 1.244.524l3.222-1.61-.343 4.116H7.921a.843.843 0 0 0 0 1.686h8.158a.843.843 0 0 0 0-1.686h-1.264l-.343-4.117 3.222 1.611a.888.888 0 0 0 1.244-.524 4.7 4.7 0 0 0-.244-3.477h1.418a.89.89 0 0 0 .888-.906c-.036-1.757-1.51-3.635-4.305-4.166l1.043-1.305a.89.89 0 0 0 .09-.974c-.482-.894-1.633-1.317-2.735-1.31-.98.007-2.08.338-3.093 1.123-1.013-.785-2.112-1.116-3.093-1.123m3.8 10.169L12 13.388l-.707.354-.417 5h2.248z"
+      clipRule="evenodd"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgTimeOff);
+export default ForwardRef;

package/src/icons/modules/TimeTracking.tsx

@@ -0,0 +1,25 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgTimeTracking = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M8.85 2.05a.9.9 0 1 0 0 1.8h2.25v.95a8.101 8.101 0 1 0 1.8 0v-.95h2.25a.9.9 0 1 0 0-1.8zM12.9 9.7a.9.9 0 0 0-1.8 0v2.628a1.8 1.8 0 0 0 .907 1.563l2.697 1.54a.9.9 0 1 0 .893-1.562L12.9 12.328z"
+      clipRule="evenodd"
+    />
+    <Path
+      fill="currentColor"
+      d="M6.336 5.836a.9.9 0 1 0-1.272-1.272l-1.8 1.8a.9.9 0 0 0 1.272 1.272zM18.936 4.564a.9.9 0 0 0-1.272 1.272l1.8 1.8a.9.9 0 0 0 1.272-1.272z"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgTimeTracking);
+export default ForwardRef;

package/src/icons/modules/Trainings.tsx

@@ -0,0 +1,19 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgTrainings = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      d="M12 6.83C10.748 6.076 9.515 5.3 8.277 5.3c-1.414 0-2.715.547-3.943 1.53A.89.89 0 0 0 4 7.524v8.373c0 .765.464 1.328.998 1.615.524.282 1.198.35 1.81.094 1.354-.569 2.815-.38 4.698.88.299.199.689.199.988 0 1.883-1.26 3.344-1.449 4.699-.88.61.256 1.285.188 1.81-.094.533-.287.997-.85.997-1.615V7.524a.89.89 0 0 0-.334-.694c-1.228-.983-2.529-1.53-3.943-1.53-1.239 0-2.471.776-3.723 1.53"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgTrainings);
+export default ForwardRef;

package/src/icons/modules/Treasury.tsx

@@ -0,0 +1,19 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgTreasury = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      d="M11.77 3.054c.151-.036.309-.036.46 0l7.5 1.765a1 1 0 0 1 .77.973V8a1 1 0 0 1-1 1h-.85v7h.85a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-15a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1h.85V9H4.5a1 1 0 0 1-1-1V5.792a1 1 0 0 1 .77-.973zM10.65 16h2.7V9h-2.7zm4 0h2.7V9h-2.7zm-8 0h2.7V9h-2.7z"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgTreasury);
+export default ForwardRef;

package/src/icons/modules/Workflows.tsx

@@ -0,0 +1,19 @@
+import Svg, { Path } from "react-native-svg";
+import type { SvgProps } from "react-native-svg";
+import { Ref, forwardRef } from "react";
+const SvgWorkflows = (props: SvgProps, ref: Ref<Svg>) => (
+  <Svg
+    fill="none"
+    viewBox="0 0 24 24"
+    className={props.className}
+    ref={ref}
+    {...props}
+  >
+    <Path
+      fill="currentColor"
+      d="M17.42 4.455a1.125 1.125 0 0 0-1.59 1.59l.329.33h-3.85A4.5 4.5 0 0 0 8.491 8.49l-.83 1.328a2.25 2.25 0 0 1-1.908 1.057H3.125a1.125 1.125 0 0 0 0 2.25h2.63c.775 0 1.496.4 1.907 1.057l.83 1.328a4.5 4.5 0 0 0 3.816 2.115h3.851l-.33.33a1.125 1.125 0 0 0 1.592 1.59l2.25-2.25c.439-.439.439-1.151 0-1.59l-2.25-2.25a1.125 1.125 0 0 0-1.591 1.59l.329.33h-3.85a2.25 2.25 0 0 1-1.909-1.057l-.83-1.328a4.5 4.5 0 0 0-.839-.99c.322-.284.606-.616.84-.99l.83-1.328a2.25 2.25 0 0 1 1.907-1.057h3.851l-.33.33a1.125 1.125 0 0 0 1.592 1.59l2.25-2.25c.439-.439.439-1.151 0-1.59z"
+    />
+  </Svg>
+);
+const ForwardRef = forwardRef(SvgWorkflows);
+export default ForwardRef;

package/src/icons/modules/index.ts

@@ -0,0 +1,35 @@
+export { default as Benefits } from "./Benefits";
+export { default as Calendar } from "./Calendar";
+export { default as Cards } from "./Cards";
+export { default as ClockIn } from "./ClockIn";
+export { default as Discover } from "./Discover";
+export { default as Documents } from "./Documents";
+export { default as Engagement } from "./Engagement";
+export { default as Finance } from "./Finance";
+export { default as Goals } from "./Goals";
+export { default as Home } from "./Home";
+export { default as Hub } from "./Hub";
+export { default as Inbox } from "./Inbox";
+export { default as Kudos } from "./Kudos";
+export { default as MyDocuments } from "./MyDocuments";
+export { default as Organization } from "./Organization";
+export { default as Overviews } from "./Overviews";
+export { default as Payroll } from "./Payroll";
+export { default as Performance } from "./Performance";
+export { default as Profile } from "./Profile";
+export { default as Projects } from "./Projects";
+export { default as Recruitment } from "./Recruitment";
+export { default as Reports } from "./Reports";
+export { default as Sales } from "./Sales";
+export { default as Settings } from "./Settings";
+export { default as Shifts } from "./Shifts";
+export { default as Social } from "./Social";
+export { default as Software } from "./Software";
+export { default as Spaces } from "./Spaces";
+export { default as Spending } from "./Spending";
+export { default as Tasks } from "./Tasks";
+export { default as TimeOff } from "./TimeOff";
+export { default as TimeTracking } from "./TimeTracking";
+export { default as Trainings } from "./Trainings";
+export { default as Treasury } from "./Treasury";
+export { default as Workflows } from "./Workflows";

package/src/icons/types.ts

@@ -0,0 +1,9 @@
+import { ForwardRefExoticComponent, RefAttributes } from "react";
+import { SvgProps } from "react-native-svg";
+
+export type IconComponent = ForwardRefExoticComponent<
+  SvgProps &
+    RefAttributes<SVGSVGElement> & {
+      className?: string;
+    }
+>;

package/src/index.ts

@@ -0,0 +1,18 @@
+// Export components
+export * from "./components/Activity/ActivityItem";
+export * from "./components/Button";
+export * from "./components/ExampleComponent";
+export * from "./components/Icon";
+export * from "./components/Avatars/exports";
+export * from "./components/Counter";
+export * from "./components/OnePreset";
+export * from "./components/Tags/exports";
+export * from "./components/OneChip";
+export * from "./components/Navigation/PageHeader";
+export * from "./components/Tags/exports";
+export * from "./components/experimental/Lists/DataList";
+export * from "./components/experimental/Lists/DetailsItem";
+export * from "./components/experimental/Lists/DetailsItemsList";
+
+// Export icons
+export * from "./icons";

package/src/lib/date.ts

@@ -0,0 +1,102 @@
+import {
+  format,
+  formatDistanceToNowStrict,
+  differenceInDays,
+  isToday,
+  isYesterday,
+  startOfDay,
+  startOfMonth,
+  startOfWeek,
+  startOfYear,
+} from "date-fns";
+
+export function formatTime(date: Date) {
+  return format(date, "p");
+}
+
+export function formatTime24Hours(date: Date) {
+  return format(date, "HH:mm");
+}
+
+export function getAbbreviateMonth(date: Date) {
+  return format(date, "LLL");
+}
+
+export function getDayOfMonth(date: Date) {
+  return date.getDate();
+}
+
+export function getAgo(date: Date, addSuffix = true) {
+  return formatDistanceToNowStrict(date, { addSuffix });
+}
+
+type GetDisplayDateBasedOnDurationOptions = {
+  yesterdayRelative?: boolean;
+};
+
+export function getDisplayDateBasedOnDuration(
+  date: Date,
+  { yesterdayRelative = true }: GetDisplayDateBasedOnDurationOptions = {},
+) {
+  if (isToday(date)) {
+    return getAgo(date);
+  }
+
+  if (isYesterday(date)) {
+    return yesterdayRelative ? getAgo(date) : format(date, "p");
+  }
+
+  return format(date, "PPPp");
+}
+
+type DateGroup = "today" | "yesterday" | "lastWeek" | "lastMonth" | number;
+
+export const categorizeItemsByDate = <
+  T extends Record<D, Date>,
+  D extends keyof T,
+>(
+  items: T[],
+  dateField: D,
+) => {
+  const groups: Record<DateGroup, T[]> = {
+    today: [],
+    yesterday: [],
+    lastWeek: [],
+    lastMonth: [],
+  };
+
+  items.forEach((item) => {
+    const date = item[dateField];
+
+    const diffDays = Math.abs(differenceInDays(date, new Date()));
+
+    if (isToday(date)) {
+      groups.today.push(item);
+    } else if (isYesterday(date)) {
+      groups.yesterday.push(item);
+    } else if (diffDays <= 7) {
+      groups.lastWeek.push(item);
+    } else if (diffDays <= 30) {
+      groups.lastMonth.push(item);
+    } else {
+      groups[date.getFullYear()].push(item);
+    }
+  });
+
+  return groups;
+};
+
+export type DateGranularity = "day" | "week" | "month" | "year";
+const dateGranularityFunction: Record<DateGranularity, (date: Date) => Date> = {
+  day: startOfDay,
+  month: startOfMonth,
+  week: startOfWeek,
+  year: startOfYear,
+};
+
+export function setDateGranularity(date: Date, granularity: DateGranularity) {
+  return (
+    dateGranularityFunction[granularity]?.(date) ||
+    new Error(`Invalid date granularity ${granularity}`)
+  );
+}

package/src/lib/emojis.tsx

@@ -0,0 +1,47 @@
+import { Text, View } from "react-native";
+import { cn } from "./utils";
+import { parse } from "twemoji-parser";
+import { SvgUri } from "react-native-svg";
+import { useState } from "react";
+
+interface ParseObject {
+  url: string;
+  indices: [number, number];
+  text: string;
+}
+
+export interface EmojiImageProps {
+  size?: { icon: string; text: string };
+  className?: string;
+  emoji: string;
+}
+
+export function EmojiImage({ emoji, size, className }: EmojiImageProps) {
+  const emojiEntity = parseEmoji(emoji);
+
+  const [error, setError] = useState(false);
+
+  return emojiEntity && !error ? (
+    <View className={size?.icon}>
+      <SvgUri
+        onError={() => setError(true)}
+        width="100%"
+        height="100%"
+        uri={emojiEntity.url}
+      />
+    </View>
+  ) : (
+    <Text className={cn(size?.text, className)} key={emoji}>
+      {emoji}
+    </Text>
+  );
+}
+
+const parseEmoji = (emoji: string): ParseObject | null => {
+  const [entity] = parse(emoji, {
+    buildUrl: (codePoints: string) =>
+      `https://cdn.jsdelivr.net/gh/twitter/twemoji@latest/assets/svg/${codePoints}.svg`,
+  });
+
+  return entity || null;
+};

package/src/lib/iconWithClassName.ts

@@ -0,0 +1,17 @@
+import { cssInterop } from "nativewind";
+import { ForwardRefExoticComponent, RefAttributes } from "react";
+import { SvgProps } from "react-native-svg";
+
+export function iconWithClassName(
+  icon: ForwardRefExoticComponent<SvgProps & RefAttributes<SVGSVGElement>>,
+) {
+  cssInterop(icon, {
+    className: {
+      target: "style",
+      nativeStyleToProp: {
+        color: true,
+        opacity: true,
+      },
+    },
+  });
+}

package/src/lib/text.ts

@@ -0,0 +1,31 @@
+import { useEffect } from "react";
+
+type Rules = {
+  disallowEmpty?: boolean;
+  minLength?: number;
+  maxLength?: number;
+};
+
+const textFormatEnforcer = (text: string, rules: Rules) => {
+  if (rules.disallowEmpty && text.length === 0) {
+    throw Error("You need to provide some text that is not empty");
+  }
+
+  if (rules.maxLength !== undefined && text.length > rules.maxLength) {
+    throw Error(
+      `"${text}" should have no more than ${rules.maxLength} characters`,
+    );
+  }
+
+  if (rules.minLength !== undefined && text.length < rules.minLength) {
+    throw Error(`"${text}" should have at least ${rules.minLength} characters`);
+  }
+};
+
+export const useTextFormatEnforcer = (text?: string, rules?: Rules) => {
+  useEffect(() => {
+    if (text !== undefined && rules) {
+      textFormatEnforcer(text, rules);
+    }
+  }, [text, rules]);
+};

package/src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}