@postal-music/icons 0.1.0

package/src/icons/general/Dataflow03Icon.native.tsx

@@ -0,0 +1,35 @@
+import * as React from "react";
+import Svg, { Path, G, Defs, ClipPath, Rect } from "react-native-svg";
+
+interface DataflowIconProps {
+  size?: number;
+}
+
+const Dataflow03Icon: React.FC<DataflowIconProps> = ({ size = 18 }) => {
+  return (
+    <Svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+    >
+      <G clipPath="url(#dataflow03-clip)">
+        <Path
+          d="M8.25 3.375H13.725C14.5651 3.375 14.9851 3.375 15.306 3.53849C15.5882 3.6823 15.8177 3.91177 15.9615 4.19401C16.125 4.51488 16.125 4.93492 16.125 5.775V6.75C16.125 7.44891 16.125 7.79837 16.0108 8.07403C15.8586 8.44157 15.5666 8.73358 15.199 8.88582C14.9234 9 14.5739 9 13.875 9M9.75 14.625H4.275C3.43492 14.625 3.01488 14.625 2.69401 14.4615C2.41177 14.3177 2.1823 14.0882 2.03849 13.806C1.875 13.4851 1.875 13.0651 1.875 12.225V11.25C1.875 10.5511 1.875 10.2016 1.98918 9.92598C2.14142 9.55843 2.43343 9.26642 2.80097 9.11418C3.07663 9 3.42609 9 4.125 9M7.725 10.875H10.275C10.485 10.875 10.59 10.875 10.6702 10.8341C10.7408 10.7982 10.7982 10.7408 10.8341 10.6702C10.875 10.59 10.875 10.485 10.875 10.275V7.725C10.875 7.51498 10.875 7.40997 10.8341 7.32975C10.7982 7.25919 10.7408 7.20183 10.6702 7.16587C10.59 7.125 10.485 7.125 10.275 7.125H7.725C7.51498 7.125 7.40997 7.125 7.32975 7.16587C7.25919 7.20183 7.20183 7.25919 7.16587 7.32975C7.125 7.40997 7.125 7.51498 7.125 7.725V10.275C7.125 10.485 7.125 10.59 7.16587 10.6702C7.20183 10.7408 7.25919 10.7982 7.32975 10.8341C7.40997 10.875 7.51498 10.875 7.725 10.875ZM13.35 16.5H15.9C16.11 16.5 16.215 16.5 16.2952 16.4591C16.3658 16.4232 16.4232 16.3658 16.4591 16.2952C16.5 16.215 16.5 16.11 16.5 15.9V13.35C16.5 13.14 16.5 13.035 16.4591 12.9548C16.4232 12.8842 16.3658 12.8268 16.2952 12.7909C16.215 12.75 16.11 12.75 15.9 12.75H13.35C13.14 12.75 13.035 12.75 12.9548 12.7909C12.8842 12.8268 12.8268 12.8842 12.7909 12.9548C12.75 13.035 12.75 13.14 12.75 13.35V15.9C12.75 16.11 12.75 16.215 12.7909 16.2952C12.8268 16.3658 12.8842 16.4232 12.9548 16.4591C13.035 16.5 13.14 16.5 13.35 16.5ZM2.1 5.25H4.65C4.86002 5.25 4.96503 5.25 5.04525 5.20913C5.11581 5.17317 5.17317 5.11581 5.20913 5.04525C5.25 4.96503 5.25 4.86002 5.25 4.65V2.1C5.25 1.88998 5.25 1.78497 5.20913 1.70475C5.17317 1.63419 5.11581 1.57683 5.04525 1.54087C4.96503 1.5 4.86002 1.5 4.65 1.5H2.1C1.88998 1.5 1.78497 1.5 1.70475 1.54087C1.63419 1.57683 1.57683 1.63419 1.54087 1.70475C1.5 1.78497 1.5 1.88998 1.5 2.1V4.65C1.5 4.86002 1.5 4.96503 1.54087 5.04525C1.57683 5.11581 1.63419 5.17317 1.70475 5.20913C1.78497 5.25 1.88998 5.25 2.1 5.25Z"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </G>
+      <Defs>
+        <ClipPath id="dataflow03-clip">
+          <Rect width="18" height="18" fill="white" />
+        </ClipPath>
+      </Defs>
+    </Svg>
+  );
+};
+
+export { Dataflow03Icon };
+export default Dataflow03Icon;

package/src/icons/general/Dataflow03Icon.web.tsx

@@ -0,0 +1,53 @@
+import * as React from "react";
+import { SVGProps } from "react";
+
+interface DataflowIconProps extends SVGProps<SVGSVGElement> {
+  /**
+   * Size of the icon (width and height). Default is 18.
+   */
+  size?: number;
+}
+
+/**
+ * A reusable "Dataflow" icon component.
+ *
+ * @param size - width and height of the SVG in pixels.
+ * @param props - additional SVG props such as className or style.
+ */
+const Dataflow03Icon: React.FC<DataflowIconProps> = ({
+  size = 18,
+  ...props
+}) => {
+  const clipId = React.useMemo(
+    () => `dataflow03-clip-${Math.random().toString(36).substr(2, 9)}`,
+    [],
+  );
+
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <g clipPath={`url(#${clipId})`}>
+        <path
+          d="M8.25 3.375H13.725C14.5651 3.375 14.9851 3.375 15.306 3.53849C15.5882 3.6823 15.8177 3.91177 15.9615 4.19401C16.125 4.51488 16.125 4.93492 16.125 5.775V6.75C16.125 7.44891 16.125 7.79837 16.0108 8.07403C15.8586 8.44157 15.5666 8.73358 15.199 8.88582C14.9234 9 14.5739 9 13.875 9M9.75 14.625H4.275C3.43492 14.625 3.01488 14.625 2.69401 14.4615C2.41177 14.3177 2.1823 14.0882 2.03849 13.806C1.875 13.4851 1.875 13.0651 1.875 12.225V11.25C1.875 10.5511 1.875 10.2016 1.98918 9.92598C2.14142 9.55843 2.43343 9.26642 2.80097 9.11418C3.07663 9 3.42609 9 4.125 9M7.725 10.875H10.275C10.485 10.875 10.59 10.875 10.6702 10.8341C10.7408 10.7982 10.7982 10.7408 10.8341 10.6702C10.875 10.59 10.875 10.485 10.875 10.275V7.725C10.875 7.51498 10.875 7.40997 10.8341 7.32975C10.7982 7.25919 10.7408 7.20183 10.6702 7.16587C10.59 7.125 10.485 7.125 10.275 7.125H7.725C7.51498 7.125 7.40997 7.125 7.32975 7.16587C7.25919 7.20183 7.20183 7.25919 7.16587 7.32975C7.125 7.40997 7.125 7.51498 7.125 7.725V10.275C7.125 10.485 7.125 10.59 7.16587 10.6702C7.20183 10.7408 7.25919 10.7982 7.32975 10.8341C7.40997 10.875 7.51498 10.875 7.725 10.875ZM13.35 16.5H15.9C16.11 16.5 16.215 16.5 16.2952 16.4591C16.3658 16.4232 16.4232 16.3658 16.4591 16.2952C16.5 16.215 16.5 16.11 16.5 15.9V13.35C16.5 13.14 16.5 13.035 16.4591 12.9548C16.4232 12.8842 16.3658 12.8268 16.2952 12.7909C16.215 12.75 16.11 12.75 15.9 12.75H13.35C13.14 12.75 13.035 12.75 12.9548 12.7909C12.8842 12.8268 12.8268 12.8842 12.7909 12.9548C12.75 13.035 12.75 13.14 12.75 13.35V15.9C12.75 16.11 12.75 16.215 12.7909 16.2952C12.8268 16.3658 12.8842 16.4232 12.9548 16.4591C13.035 16.5 13.14 16.5 13.35 16.5ZM2.1 5.25H4.65C4.86002 5.25 4.96503 5.25 5.04525 5.20913C5.11581 5.17317 5.17317 5.11581 5.20913 5.04525C5.25 4.96503 5.25 4.86002 5.25 4.65V2.1C5.25 1.88998 5.25 1.78497 5.20913 1.70475C5.17317 1.63419 5.11581 1.57683 5.04525 1.54087C4.96503 1.5 4.86002 1.5 4.65 1.5H2.1C1.88998 1.5 1.78497 1.5 1.70475 1.54087C1.63419 1.57683 1.57683 1.63419 1.54087 1.70475C1.5 1.78497 1.5 1.88998 1.5 2.1V4.65C1.5 4.86002 1.5 4.96503 1.54087 5.04525C1.57683 5.11581 1.63419 5.17317 1.70475 5.20913C1.78497 5.25 1.88998 5.25 2.1 5.25Z"
+          stroke="currentColor"
+          strokeWidth={1.5}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </g>
+      <defs>
+        <clipPath id={clipId}>
+          <rect width="18" height="18" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+};
+
+export default Dataflow03Icon;

package/src/icons/general/Datapoints01Icon.native.tsx

@@ -0,0 +1,44 @@
+import * as React from "react";
+import Svg, { Path } from "react-native-svg";
+
+type Datapoints01IconProps = {
+  size?: number;
+  color?: string;
+};
+
+const Datapoints01Icon: React.FC<Datapoints01IconProps> = ({
+  size = 18,
+  color = '#000000',
+}) => {
+  return (
+    <Svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+    >
+      <Path
+        d="M3 9.75C3.41421 9.75 3.75 9.41421 3.75 9C3.75 8.58579 3.41421 8.25 3 8.25C2.58579 8.25 2.25 8.58579 2.25 9C2.25 9.41421 2.58579 9.75 3 9.75Z"
+        fill={color}
+      />
+      <Path
+        d="M3 5.25C3.41421 5.25 3.75 4.91421 3.75 4.5C3.75 4.08579 3.41421 3.75 3 3.75C2.58579 3.75 2.25 4.08579 2.25 4.5C2.25 4.91421 2.58579 5.25 3 5.25Z"
+        fill={color}
+      />
+      <Path
+        d="M3 14.25C3.41421 14.25 3.75 13.9142 3.75 13.5C3.75 13.0858 3.41421 12.75 3 12.75C2.58579 12.75 2.25 13.0858 2.25 13.5C2.25 13.9142 2.58579 14.25 3 14.25Z"
+        fill={color}
+      />
+      <Path
+        d="M15.75 9L6.75 9M15.75 4.5L6.75 4.5M15.75 13.5L6.75 13.5M3.75 9C3.75 9.41421 3.41421 9.75 3 9.75C2.58579 9.75 2.25 9.41421 2.25 9C2.25 8.58579 2.58579 8.25 3 8.25C3.41421 8.25 3.75 8.58579 3.75 9ZM3.75 4.5C3.75 4.91421 3.41421 5.25 3 5.25C2.58579 5.25 2.25 4.91421 2.25 4.5C2.25 4.08579 2.58579 3.75 3 3.75C3.41421 3.75 3.75 4.08579 3.75 4.5ZM3.75 13.5C3.75 13.9142 3.41421 14.25 3 14.25C2.58579 14.25 2.25 13.9142 2.25 13.5C2.25 13.0858 2.58579 12.75 3 12.75C3.41421 12.75 3.75 13.0858 3.75 13.5Z"
+        stroke={color}
+        strokeWidth={2}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+};
+
+export { Datapoints01Icon };
+export default Datapoints01Icon;

package/src/icons/general/Datapoints01Icon.web.tsx

@@ -0,0 +1,44 @@
+import * as React from "react";
+
+type Datapoints01IconProps = {
+  size?: number;
+  color?: string;
+} & React.SVGProps<SVGSVGElement>;
+
+export const Datapoints01Icon: React.FC<Datapoints01IconProps> = ({
+  size = 18,
+  color = "currentColor",
+  ...props
+}) => {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 18 18"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden="true"
+      {...props}
+    >
+      <path
+        d="M3 9.75C3.41421 9.75 3.75 9.41421 3.75 9C3.75 8.58579 3.41421 8.25 3 8.25C2.58579 8.25 2.25 8.58579 2.25 9C2.25 9.41421 2.58579 9.75 3 9.75Z"
+        fill={color}
+      />
+      <path
+        d="M3 5.25C3.41421 5.25 3.75 4.91421 3.75 4.5C3.75 4.08579 3.41421 3.75 3 3.75C2.58579 3.75 2.25 4.08579 2.25 4.5C2.25 4.91421 2.58579 5.25 3 5.25Z"
+        fill={color}
+      />
+      <path
+        d="M3 14.25C3.41421 14.25 3.75 13.9142 3.75 13.5C3.75 13.0858 3.41421 12.75 3 12.75C2.58579 12.75 2.25 13.0858 2.25 13.5C2.25 13.9142 2.58579 14.25 3 14.25Z"
+        fill={color}
+      />
+      <path
+        d="M15.75 9L6.75 9M15.75 4.5L6.75 4.5M15.75 13.5L6.75 13.5M3.75 9C3.75 9.41421 3.41421 9.75 3 9.75C2.58579 9.75 2.25 9.41421 2.25 9C2.25 8.58579 2.58579 8.25 3 8.25C3.41421 8.25 3.75 8.58579 3.75 9ZM3.75 4.5C3.75 4.91421 3.41421 5.25 3 5.25C2.58579 5.25 2.25 4.91421 2.25 4.5C2.25 4.08579 2.58579 3.75 3 3.75C3.41421 3.75 3.75 4.08579 3.75 4.5ZM3.75 13.5C3.75 13.9142 3.41421 14.25 3 14.25C2.58579 14.25 2.25 13.9142 2.25 13.5C2.25 13.0858 2.58579 12.75 3 12.75C3.41421 12.75 3.75 13.0858 3.75 13.5Z"
+        stroke={color}
+        strokeWidth={2}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+};

package/src/icons/general/DropBoxIcon.native.tsx

@@ -0,0 +1,42 @@
+import * as React from "react";
+import Svg, { Path } from "react-native-svg";
+
+type DropboxIconProps = {
+  size?: number;
+  color?: string;
+};
+
+const DropBoxIcon: React.FC<DropboxIconProps> = ({ size = 24, color = '#000000' }) => {
+  return (
+    <Svg
+      width={size}
+      height={(size * 744) / 800}
+      viewBox="0 0 800 744"
+      fill="none"
+    >
+      <Path
+        d="M0 414.063L235.313 567.5L400 430.313L162.813 283.75L0 414.063Z"
+        fill={color}
+      />
+      <Path
+        d="M235.313 0L0 153.438L162.813 283.75L400 137.187L235.313 0Z"
+        fill={color}
+      />
+      <Path
+        d="M800 153.438L564.687 0L400 137.187L637.188 283.75L800 153.438Z"
+        fill={color}
+      />
+      <Path
+        d="M400 430.313L564.687 567.5L800 414.063L637.188 283.75L400 430.313Z"
+        fill={color}
+      />
+      <Path
+        d="M400.625 459.688L235.313 596.875L164.688 550.625V602.5L400.625 743.75L636.25 602.5V550.625L565.625 596.875L400.625 459.688Z"
+        fill={color}
+      />
+    </Svg>
+  );
+};
+
+export { DropBoxIcon };
+export default DropBoxIcon;

package/src/icons/general/DropBoxIcon.web.tsx

@@ -0,0 +1,55 @@
+import * as React from "react";
+
+type DropboxIconProps = Omit<
+  React.SVGProps<SVGSVGElement>,
+  "width" | "height" | "viewBox" | "children"
+> & {
+  size?: number;
+  title?: string;
+};
+
+export const DropboxIcon = React.forwardRef<SVGSVGElement, DropboxIconProps>(
+  ({ size = 24, title = "Dropbox", className, ...props }, ref) => {
+    const ariaLabel = props["aria-label"] ?? title;
+
+    return (
+      <svg
+        ref={ref}
+        width={size}
+        height={(size * 744) / 800}
+        viewBox="0 0 800 744"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        role="img"
+        aria-label={ariaLabel}
+        className={className}
+        {...props}
+      >
+        {title ? <title>{title}</title> : null}
+
+        <path
+          d="M0 414.063L235.313 567.5L400 430.313L162.813 283.75L0 414.063Z"
+          fill="currentColor"
+        />
+        <path
+          d="M235.313 0L0 153.438L162.813 283.75L400 137.187L235.313 0Z"
+          fill="currentColor"
+        />
+        <path
+          d="M800 153.438L564.687 0L400 137.187L637.188 283.75L800 153.438Z"
+          fill="currentColor"
+        />
+        <path
+          d="M400 430.313L564.687 567.5L800 414.063L637.188 283.75L400 430.313Z"
+          fill="currentColor"
+        />
+        <path
+          d="M400.625 459.688L235.313 596.875L164.688 550.625V602.5L400.625 743.75L636.25 602.5V550.625L565.625 596.875L400.625 459.688Z"
+          fill="currentColor"
+        />
+      </svg>
+    );
+  },
+);
+
+DropboxIcon.displayName = "DropboxIcon";

package/src/icons/general/FaceSmileIcon.native.tsx

@@ -0,0 +1,39 @@
+import * as React from "react";
+import Svg, { Path, G, Defs, ClipPath, Rect } from "react-native-svg";
+
+type FaceSmileIconProps = {
+  size?: number | string;
+  stroke?: string;
+  strokeWidth?: number | string;
+};
+
+const FaceSmileIcon: React.FC<FaceSmileIconProps> = ({
+  size = 16,
+  stroke = '#000000',
+  strokeWidth = 1.25,
+}) => {
+  return (
+    <Svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      stroke={stroke}
+      strokeWidth={strokeWidth}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    >
+      <G clipPath="url(#facesmile-clip)">
+        <Path d="M5.33334 9.33337C5.33334 9.33337 6.33334 10.6667 8.00001 10.6667C9.66668 10.6667 10.6667 9.33337 10.6667 9.33337M10 6.00004H10.0067M6.00001 6.00004H6.00668M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00001 14.6667C4.31811 14.6667 1.33334 11.6819 1.33334 8.00004C1.33334 4.31814 4.31811 1.33337 8.00001 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004ZM10.3333 6.00004C10.3333 6.18414 10.1841 6.33337 10 6.33337C9.81592 6.33337 9.66668 6.18414 9.66668 6.00004C9.66668 5.81595 9.81592 5.66671 10 5.66671C10.1841 5.66671 10.3333 5.81595 10.3333 6.00004ZM6.33334 6.00004C6.33334 6.18414 6.18411 6.33337 6.00001 6.33337C5.81592 6.33337 5.66668 6.18414 5.66668 6.00004C5.66668 5.81595 5.81592 5.66671 6.00001 5.66671C6.18411 5.66671 6.33334 5.81595 6.33334 6.00004Z" />
+      </G>
+      <Defs>
+        <ClipPath id="facesmile-clip">
+          <Rect width="16" height="16" fill="white" />
+        </ClipPath>
+      </Defs>
+    </Svg>
+  );
+};
+
+export { FaceSmileIcon };
+export default FaceSmileIcon;

package/src/icons/general/FaceSmileIcon.web.tsx

@@ -0,0 +1,65 @@
+import * as React from "react";
+
+type FaceSmileIconProps = React.SVGProps<SVGSVGElement> & {
+  /** Width/height in px or any CSS unit */
+  size?: number | string;
+  /** Stroke color. Defaults to currentColor for easy theming */
+  stroke?: string;
+  /** Stroke width */
+  strokeWidth?: number | string;
+  /** Accessible title for screen readers */
+  title?: string;
+};
+
+const FaceSmileIcon = React.forwardRef<SVGSVGElement, FaceSmileIconProps>(
+  (
+    {
+      size = 16,
+      stroke = "currentColor",
+      strokeWidth = 1.25,
+      className,
+      title,
+      ...rest
+    },
+    ref,
+  ) => {
+    const clipId = React.useId();
+
+    return (
+      <svg
+        ref={ref}
+        width={size}
+        height={size}
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+        stroke={stroke}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        role={title ? "img" : "presentation"}
+        aria-label={title}
+        className={className}
+        {...rest}
+      >
+        {title ? <title>{title}</title> : null}
+        <g clipPath={`url(#${clipId})`}>
+          <path d="M5.33334 9.33337C5.33334 9.33337 6.33334 10.6667 8.00001 10.6667C9.66668 10.6667 10.6667 9.33337 10.6667 9.33337M10 6.00004H10.0067M6.00001 6.00004H6.00668M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00001 14.6667C4.31811 14.6667 1.33334 11.6819 1.33334 8.00004C1.33334 4.31814 4.31811 1.33337 8.00001 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004ZM10.3333 6.00004C10.3333 6.18414 10.1841 6.33337 10 6.33337C9.81592 6.33337 9.66668 6.18414 9.66668 6.00004C9.66668 5.81595 9.81592 5.66671 10 5.66671C10.1841 5.66671 10.3333 5.81595 10.3333 6.00004ZM6.33334 6.00004C6.33334 6.18414 6.18411 6.33337 6.00001 6.33337C5.81592 6.33337 5.66668 6.18414 5.66668 6.00004C5.66668 5.81595 5.81592 5.66671 6.00001 5.66671C6.18411 5.66671 6.33334 5.81595 6.33334 6.00004Z" />
+        </g>
+        <defs>
+          <clipPath id={clipId}>
+            <rect width="16" height="16" fill="white" />
+          </clipPath>
+        </defs>
+      </svg>
+    );
+  },
+);
+
+FaceSmileIcon.displayName = "FaceSmileIcon";
+
+export default FaceSmileIcon;
+
+// Example usage:
+// <FaceSmileIcon className="text-gray-700" size={20} />
+// <FaceSmileIcon stroke="#111827" strokeWidth={1.5} title="Smiling face icon" />

package/src/icons/general/Flag01Icon.native.tsx

@@ -0,0 +1,30 @@
+import React from "react";
+import Svg, { Path } from "react-native-svg";
+
+interface IconProps {
+  size?: number;
+  color?: string;
+}
+
+const Flag01Icon: React.FC<IconProps> = ({
+  size = 18,
+  color = '#000000',
+}) => (
+  <Svg
+    width={size}
+    height={size}
+    viewBox="0 0 18 18"
+    fill="none"
+  >
+    <Path
+      d="M3 11.25C3 11.25 3.75 10.5 6 10.5C8.25 10.5 9.75 12 12 12C14.25 12 15 11.25 15 11.25V2.25C15 2.25 14.25 3 12 3C9.75 3 8.25 1.5 6 1.5C3.75 1.5 3 2.25 3 2.25L3 16.5"
+      stroke={color}
+      strokeWidth="1.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </Svg>
+);
+
+export { Flag01Icon };
+export default Flag01Icon;

package/src/icons/general/Flag01Icon.web.tsx

@@ -0,0 +1,32 @@
+import React from "react";
+
+interface IconProps {
+  size?: number;
+  color?: string;
+  className?: string;
+}
+
+const Flag01Icon: React.FC<IconProps> = ({
+  size = 18,
+  color = "currentColor",
+  className,
+}) => (
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 18 18"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    className={className}
+  >
+    <path
+      d="M3 11.25C3 11.25 3.75 10.5 6 10.5C8.25 10.5 9.75 12 12 12C14.25 12 15 11.25 15 11.25V2.25C15 2.25 14.25 3 12 3C9.75 3 8.25 1.5 6 1.5C3.75 1.5 3 2.25 3 2.25L3 16.5"
+      stroke={color}
+      strokeWidth="1.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </svg>
+);
+
+export default Flag01Icon;

package/src/icons/general/Globe02Icon.native.tsx

@@ -0,0 +1,37 @@
+import React from "react";
+import Svg, { Path, G, Defs, ClipPath, Rect } from "react-native-svg";
+
+interface Globe02IconProps {
+  size?: number | string;
+  strokeColor?: string;
+}
+
+const Globe02Icon: React.FC<Globe02IconProps> = ({
+  size = 16,
+  strokeColor = '#000000',
+}) => (
+  <Svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+  >
+    <G clipPath="url(#globe02-clip)">
+      <Path
+        d="M7.9987 1.33301C9.66622 3.15858 10.6139 5.5277 10.6654 7.99967C10.6139 10.4717 9.66622 12.8408 7.9987 14.6663M7.9987 1.33301C6.33118 3.15858 5.38353 5.5277 5.33203 7.99967C5.38353 10.4717 6.33118 12.8408 7.9987 14.6663M7.9987 1.33301C4.3168 1.33301 1.33203 4.31778 1.33203 7.99967C1.33203 11.6816 4.3168 14.6663 7.9987 14.6663M7.9987 1.33301C11.6806 1.33301 14.6654 4.31778 14.6654 7.99967C14.6654 11.6816 11.6806 14.6663 7.9987 14.6663M1.66538 5.99967H14.332M1.66536 9.99967H14.332"
+        stroke={strokeColor}
+        strokeWidth={1.5}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </G>
+    <Defs>
+      <ClipPath id="globe02-clip">
+        <Rect width="16" height="16" fill="white" />
+      </ClipPath>
+    </Defs>
+  </Svg>
+);
+
+export { Globe02Icon };
+export default Globe02Icon;

package/src/icons/general/Globe02Icon.web.tsx

@@ -0,0 +1,38 @@
+import React from "react";
+
+interface Globe02IconProps extends React.SVGProps<SVGSVGElement> {
+  size?: number | string;
+  strokeColor?: string;
+}
+
+const Globe02Icon: React.FC<Globe02IconProps> = ({
+  size = 16,
+  strokeColor = "currentColor",
+  ...props
+}) => (
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g clipPath="url(#clip0_globe02icon)">
+      <path
+        d="M7.9987 1.33301C9.66622 3.15858 10.6139 5.5277 10.6654 7.99967C10.6139 10.4717 9.66622 12.8408 7.9987 14.6663M7.9987 1.33301C6.33118 3.15858 5.38353 5.5277 5.33203 7.99967C5.38353 10.4717 6.33118 12.8408 7.9987 14.6663M7.9987 1.33301C4.3168 1.33301 1.33203 4.31778 1.33203 7.99967C1.33203 11.6816 4.3168 14.6663 7.9987 14.6663M7.9987 1.33301C11.6806 1.33301 14.6654 4.31778 14.6654 7.99967C14.6654 11.6816 11.6806 14.6663 7.9987 14.6663M1.66538 5.99967H14.332M1.66536 9.99967H14.332"
+        stroke={strokeColor}
+        strokeWidth={1.5}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </g>
+    <defs>
+      <clipPath id="clip0_globe02icon">
+        <rect width="16" height="16" fill="white" />
+      </clipPath>
+    </defs>
+  </svg>
+);
+
+export default Globe02Icon;

package/src/icons/general/Globe05Icon.native.tsx

@@ -0,0 +1,32 @@
+import React from "react";
+import Svg, { Path } from "react-native-svg";
+
+interface Globe05IconProps {
+  size?: number | string;
+  strokeColor?: string;
+  currentColor?: string;
+}
+
+const Globe05Icon: React.FC<Globe05IconProps> = ({
+  size = 24,
+  strokeColor = "black",
+  currentColor,
+}) => (
+  <Svg
+    width={size}
+    height={size}
+    viewBox="0 0 24 24"
+    fill="none"
+  >
+    <Path
+      d="M15 2.4578C14.053 2.16035 13.0452 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 10.2847 21.5681 8.67022 20.8071 7.25945M17 5.75H17.005M10.5001 21.8883L10.5002 19.6849C10.5002 19.5656 10.5429 19.4502 10.6205 19.3596L13.1063 16.4594C13.3106 16.2211 13.2473 15.8556 12.9748 15.6999L10.1185 14.0677C10.0409 14.0234 9.97663 13.9591 9.93234 13.8814L8.07046 10.6186C7.97356 10.4488 7.78657 10.3511 7.59183 10.3684L2.06418 10.8607M21 6C21 8.20914 19 10 17 12C15 10 13 8.20914 13 6C13 3.79086 14.7909 2 17 2C19.2091 2 21 3.79086 21 6ZM17.25 5.75C17.25 5.88807 17.1381 6 17 6C16.8619 6 16.75 5.88807 16.75 5.75C16.75 5.61193 16.8619 5.5 17 5.5C17.1381 5.5 17.25 5.61193 17.25 5.75Z"
+      stroke={currentColor ? currentColor : strokeColor}
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </Svg>
+);
+
+export { Globe05Icon };
+export default Globe05Icon;

package/src/icons/general/Globe05Icon.web.tsx

@@ -0,0 +1,36 @@
+import React from "react";
+
+interface Globe05IconProps extends React.SVGProps<SVGSVGElement> {
+  /** The size of the icon (width and height) */
+  size?: number | string;
+  /** Stroke color */
+  strokeColor?: string;
+  /** Use currentColor for stroke */
+  currentColor?: string;
+}
+
+const Globe05Icon: React.FC<Globe05IconProps> = ({
+  size = 24,
+  strokeColor = "black",
+  currentColor,
+  ...props
+}) => (
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 24 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M15 2.4578C14.053 2.16035 13.0452 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 10.2847 21.5681 8.67022 20.8071 7.25945M17 5.75H17.005M10.5001 21.8883L10.5002 19.6849C10.5002 19.5656 10.5429 19.4502 10.6205 19.3596L13.1063 16.4594C13.3106 16.2211 13.2473 15.8556 12.9748 15.6999L10.1185 14.0677C10.0409 14.0234 9.97663 13.9591 9.93234 13.8814L8.07046 10.6186C7.97356 10.4488 7.78657 10.3511 7.59183 10.3684L2.06418 10.8607M21 6C21 8.20914 19 10 17 12C15 10 13 8.20914 13 6C13 3.79086 14.7909 2 17 2C19.2091 2 21 3.79086 21 6ZM17.25 5.75C17.25 5.88807 17.1381 6 17 6C16.8619 6 16.75 5.88807 16.75 5.75C16.75 5.61193 16.8619 5.5 17 5.5C17.1381 5.5 17.25 5.61193 17.25 5.75Z"
+      stroke={currentColor ? currentColor : strokeColor}
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </svg>
+);
+
+export default Globe05Icon;

package/src/icons/general/GlobeIcon.native.tsx

@@ -0,0 +1,47 @@
+import React from "react";
+import Svg, { Path, G, Defs, ClipPath, Rect } from "react-native-svg";
+
+interface GlobeIconProps {
+  width?: number;
+  height?: number;
+  stroke?: string;
+  strokeWidth?: number;
+}
+
+const GlobeIcon: React.FC<GlobeIconProps> = ({
+  width = 16,
+  height = 16,
+  stroke = '#000000',
+  strokeWidth = 1.5,
+}) => {
+  return (
+    <Svg
+      width={width}
+      height={height}
+      viewBox="0 0 16 16"
+      fill="none"
+    >
+      <G clipPath="url(#globe-clip)">
+        <Path
+          d="M7.9987 1.33203C9.66622 3.1576 10.6139 5.52672 10.6654 7.9987C10.6139 10.4707 9.66622 12.8398 7.9987 14.6654
+             M7.9987 1.33203C6.33118 3.1576 5.38353 5.52672 5.33203 7.9987C5.38353 10.4707 6.33118 12.8398 7.9987 14.6654
+             M7.9987 1.33203C4.3168 1.33203 1.33203 4.3168 1.33203 7.9987C1.33203 11.6806 4.3168 14.6654 7.9987 14.6654
+             M7.9987 1.33203C11.6806 1.33203 14.6654 4.3168 14.6654 7.9987C14.6654 11.6806 11.6806 14.6654 7.9987 14.6654
+             M1.66538 5.9987H14.332M1.66536 9.9987H14.332"
+          stroke={stroke}
+          strokeWidth={strokeWidth}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      </G>
+      <Defs>
+        <ClipPath id="globe-clip">
+          <Rect width="16" height="16" fill="white" />
+        </ClipPath>
+      </Defs>
+    </Svg>
+  );
+};
+
+export { GlobeIcon };
+export default GlobeIcon;