@ecohouse/ui 0.1.41 → 0.1.43

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecohouse/ui",
-  "version": "0.1.41",
+  "version": "0.1.43",
   "type": "module",
   "private": false,
   "description": "Cross-platform presentation-only UI components for EcoHouse (React Native + React Native Web)",

package/src/components/RadioButton/RadioButton.stories.tsx

@@ -0,0 +1,64 @@
+import { useState } from "react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { fn } from "storybook/test";
+import { StyleSheet, Text, View } from "react-native";
+import { colors } from "../../theme";
+import { RadioButton } from "./RadioButton";
+
+const meta = {
+  title: "Components/RadioButton",
+  component: RadioButton,
+  args: {
+    defaultValue: false,
+    disabled: false,
+    variant: "default",
+    onValueChange: fn(),
+  },
+  parameters: {
+    backgrounds: { default: "black" },
+  },
+} satisfies Meta<typeof RadioButton>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};
+
+export const Active: Story = {
+  args: { defaultValue: true },
+};
+
+export const Disabled: Story = {
+  args: { disabled: true },
+};
+
+export const WithLabel: Story = {
+  args: { defaultValue: true, label: "Option" },
+};
+
+function ControlledGroup() {
+  const [value, setValue] = useState("first");
+
+  return (
+    <View style={styles.group} accessibilityRole="radiogroup">
+      {["first", "second", "third"].map((option) => (
+        <RadioButton key={option} value={value === option} onValueChange={() => setValue(option)}>
+          <Text style={styles.label}>{option}</Text>
+        </RadioButton>
+      ))}
+    </View>
+  );
+}
+
+export const Group: Story = {
+  render: () => <ControlledGroup />,
+};
+
+const styles = StyleSheet.create({
+  group: {
+    gap: 12,
+  },
+  label: {
+    color: colors.white,
+  },
+});

package/src/components/RadioButton/RadioButton.tsx

@@ -0,0 +1,135 @@
+import { forwardRef, useMemo, useRef, useState, type ComponentRef, type ReactNode } from "react";
+import {
+  Pressable,
+  StyleSheet,
+  Text,
+  View,
+  type PressableProps,
+  type StyleProp,
+  type TextStyle,
+  type ViewStyle,
+} from "react-native";
+import { colors, fonts } from "../../theme";
+import { mergeRefs } from "../../utils/mergeRefs";
+import { useApplyWebClassName } from "../../utils/useApplyWebClassName";
+
+export type RadioButtonVariant = "default";
+
+export interface RadioButtonProps extends Omit<
+  PressableProps,
+  "onPress" | "disabled" | "style" | "children" | "hitSlop"
+> {
+  value?: boolean;
+  defaultValue?: boolean;
+  onValueChange?: (value: true) => void;
+  disabled?: boolean;
+  variant?: RadioButtonVariant;
+  label?: string;
+  children?: ReactNode;
+  style?: StyleProp<ViewStyle>;
+  labelStyle?: StyleProp<TextStyle>;
+  className?: string;
+  hitSlop?: PressableProps["hitSlop"];
+}
+
+const CONTROL_SIZE = 16;
+const DOT_SIZE = 8;
+
+export const RadioButton = forwardRef<ComponentRef<typeof Pressable>, RadioButtonProps>(
+  function RadioButton(
+    {
+      value,
+      defaultValue = false,
+      onValueChange,
+      disabled = false,
+      variant: _variant = "default",
+      label,
+      children,
+      style,
+      labelStyle,
+      className,
+      hitSlop = 8,
+      accessibilityLabel,
+      ...rest
+    },
+    forwardedRef,
+  ) {
+    const containerRef = useRef<ComponentRef<typeof Pressable>>(null);
+    const isControlled = typeof value === "boolean";
+    const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);
+    const isActive = isControlled ? value : uncontrolledValue;
+    const labelContent = children ?? label;
+    const resolvedAccessibilityLabel =
+      accessibilityLabel ?? (typeof labelContent === "string" ? labelContent : undefined);
+    const setContainerRef = useMemo(() => mergeRefs(containerRef, forwardedRef), [forwardedRef]);
+
+    useApplyWebClassName(containerRef, className);
+
+    const handlePress = () => {
+      if (disabled || isActive) return;
+      if (!isControlled) setUncontrolledValue(true);
+      onValueChange?.(true);
+    };
+
+    return (
+      <Pressable
+        {...rest}
+        ref={setContainerRef}
+        onPress={handlePress}
+        disabled={disabled}
+        hitSlop={hitSlop}
+        accessibilityRole="radio"
+        accessibilityLabel={resolvedAccessibilityLabel}
+        accessibilityState={{ selected: isActive, disabled }}
+        style={[styles.root, disabled && styles.disabled, style]}
+      >
+        <View style={styles.control}>{isActive ? <View style={styles.dot} /> : null}</View>
+
+        {labelContent != null && labelContent !== false ? (
+          typeof labelContent === "string" || typeof labelContent === "number" ? (
+            <Text style={[styles.label, labelStyle]}>{labelContent}</Text>
+          ) : (
+            labelContent
+          )
+        ) : null}
+      </Pressable>
+    );
+  },
+);
+
+const styles = StyleSheet.create({
+  root: {
+    flexDirection: "row",
+    alignItems: "center",
+    alignSelf: "flex-start",
+    gap: 6,
+  },
+  disabled: {
+    opacity: 0.5,
+  },
+  control: {
+    width: CONTROL_SIZE,
+    height: CONTROL_SIZE,
+    borderRadius: 20,
+    borderWidth: 1,
+    borderColor: colors.grey700,
+    backgroundColor: colors.dark,
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0,
+  },
+  dot: {
+    width: DOT_SIZE,
+    height: DOT_SIZE,
+    borderRadius: 43,
+    backgroundColor: colors.primary,
+  },
+  label: {
+    flexShrink: 1,
+    textAlign: "center",
+    fontFamily: fonts.sans,
+    fontSize: 12,
+    fontWeight: "400",
+    color: colors.white,
+  },
+});

package/src/components/RadioButton/index.ts

@@ -0,0 +1,2 @@
+export { RadioButton } from "./RadioButton";
+export type { RadioButtonProps, RadioButtonVariant } from "./RadioButton";

package/src/components/index.ts

@@ -118,3 +118,6 @@ export type { CommentCardProps } from "./CommentCard";
 
 export { Range } from "./Range";
 export type { RangeProps, RangeValue } from "./Range";
+
+export { RadioButton } from "./RadioButton";
+export type { RadioButtonProps, RadioButtonVariant } from "./RadioButton";

package/src/icons/Amenity/AmenityIcon.tsx

@@ -20,6 +20,7 @@ export function AmenityIcon({ name, size = 20, color = colors.primary }: Amenity
           strokeWidth={path.strokeWidth}
           strokeLinecap={path.rounded ? "round" : undefined}
           strokeLinejoin={path.rounded ? "round" : undefined}
+          transform={path.transform}
         />
       ))}
     </Svg>

package/src/icons/Amenity/AmenityIcon.web.tsx

@@ -19,6 +19,7 @@ export function AmenityIcon({ name, size = 20, color = colors.primary }: Amenity
           strokeWidth={path.strokeWidth}
           strokeLinecap={path.rounded ? "round" : undefined}
           strokeLinejoin={path.rounded ? "round" : undefined}
+          transform={path.transform}
         />
       ))}
     </svg>

package/src/icons/Amenity/amenityPaths.test.ts

@@ -0,0 +1,67 @@
+import { describe, expect, it } from "vitest";
+import { AMENITY_PATHS, amenityNames } from "./amenityPaths";
+
+const cottageAmenityIcons = [
+  "wifi",
+  "parking",
+  "ac",
+  "heating",
+  "tv",
+  "refrigerator",
+  "kitchen",
+  "tableware",
+  "washer",
+  "bbq",
+  "forestView",
+  "jacuzzi",
+  "fireplace",
+  "firePit",
+] as const;
+
+describe("amenity icon paths", () => {
+  it("provides path data for every cottage form amenity", () => {
+    expect(amenityNames).toEqual(expect.arrayContaining([...cottageAmenityIcons]));
+
+    for (const name of cottageAmenityIcons) {
+      expect(AMENITY_PATHS[name].length).toBeGreaterThan(0);
+      expect(AMENITY_PATHS[name].every(({ d }) => d.length > 0)).toBe(true);
+    }
+  });
+
+  it("uses the supplied 20px car artwork for parking", () => {
+    expect(AMENITY_PATHS.parking).toEqual([
+      expect.objectContaining({
+        d: expect.stringContaining("M7.20801 4.25H12.209"),
+        strokeWidth: 1,
+      }),
+    ]);
+  });
+
+  it("uses the supplied 20px glass artwork for tableware", () => {
+    expect(AMENITY_PATHS.tableware).toEqual([
+      expect.objectContaining({
+        d: expect.stringContaining("M3.92969 3.19043"),
+        strokeWidth: 1,
+      }),
+    ]);
+  });
+
+  it("uses the supplied fireplace artwork", () => {
+    expect(AMENITY_PATHS.fireplace).toEqual([
+      expect.objectContaining({
+        d: expect.stringContaining("M0.265153 0.0833307"),
+        strokeWidth: 1,
+        transform: "translate(1 1)",
+      }),
+    ]);
+  });
+
+  it("uses the supplied 20px fire-pit artwork", () => {
+    expect(AMENITY_PATHS.firePit).toEqual([
+      expect.objectContaining({
+        d: expect.stringContaining("M8.86523 1.33301"),
+        strokeWidth: 1,
+      }),
+    ]);
+  });
+});

package/src/icons/Amenity/amenityPaths.ts

@@ -6,6 +6,13 @@ export const amenityNames = [
   "ac",
   "bbq",
   "forestView",
+  "parking",
+  "heating",
+  "refrigerator",
+  "tableware",
+  "jacuzzi",
+  "fireplace",
+  "firePit",
   "pets",
 ] as const;
 
@@ -16,6 +23,7 @@ export interface AmenityPathDefinition {
   fill?: boolean;
   rounded?: boolean;
   strokeWidth?: number;
+  transform?: string;
 }
 
 export const AMENITY_PATHS: Record<AmenityName, readonly AmenityPathDefinition[]> = {
@@ -67,6 +75,52 @@ export const AMENITY_PATHS: Record<AmenityName, readonly AmenityPathDefinition[]
       d: "M13.75 5.3335C12.9544 5.3335 12.1905 5.64979 11.6279 6.2124C11.0656 6.77497 10.75 7.53803 10.75 8.3335V11.6685C10.7518 12.2873 10.9448 12.8903 11.3027 13.395C11.6608 13.8999 12.1665 14.2815 12.75 14.4878L13.416 14.7241V10.8335C13.416 10.7453 13.4514 10.6606 13.5137 10.5981C13.5762 10.5356 13.6616 10.5005 13.75 10.5005C13.8383 10.5006 13.9229 10.5357 13.9854 10.5981C14.0477 10.6606 14.083 10.7452 14.083 10.8335V14.7241L14.75 14.4878C15.3333 14.2815 15.8383 13.8997 16.1963 13.395C16.5543 12.8902 16.7482 12.2873 16.75 11.6685V8.3335C16.75 7.53795 16.4336 6.77499 15.8711 6.2124C15.3086 5.64987 14.5455 5.33358 13.75 5.3335ZM7.8291 2.896C7.08436 2.7482 6.31242 2.82426 5.61133 3.11572C4.91011 3.4073 4.31107 3.90128 3.89062 4.53369C3.52286 5.08695 3.30559 5.72481 3.25879 6.38428L3.25 6.6665V10.0015C3.25275 10.8492 3.53644 11.672 4.05664 12.3413C4.57684 13.0106 5.30421 13.4888 6.125 13.7007L6.75 13.8618V10.8335C6.75 10.7451 6.78518 10.6607 6.84766 10.5981C6.91017 10.5356 6.9946 10.5005 7.08301 10.5005C7.17141 10.5005 7.25585 10.5356 7.31836 10.5981C7.38083 10.6607 7.41602 10.7451 7.41602 10.8335V13.8716L8.04199 13.7095C8.81342 13.5095 9.50314 13.0736 10.0156 12.4634L10.1631 12.2876L10.127 12.062C10.1052 11.9268 10.0903 11.7906 10.083 11.6538V8.33447C10.0841 7.59016 10.3115 6.86331 10.7354 6.25146L10.8564 6.07764L10.8154 5.86963C10.6713 5.14369 10.3167 4.47555 9.79688 3.94873L9.79492 3.94678L9.58691 3.75342C9.08624 3.32147 8.48085 3.02537 7.8291 2.896ZM6.75 14.5024L6.33301 14.4321C5.2853 14.255 4.3338 13.713 3.64746 12.9019C3.00409 12.1414 2.63281 11.1901 2.58789 10.1987L2.58301 9.99951V6.67432C2.59783 5.64591 2.96462 4.65276 3.62207 3.86182C4.2795 3.07106 5.18807 2.52918 6.19629 2.32666C7.20464 2.12413 8.2522 2.27381 9.16406 2.74951C10.0758 3.22524 10.7973 3.9991 11.208 4.94189L11.4355 5.4624L11.9229 5.17041C12.4746 4.84014 13.106 4.66604 13.749 4.6665H13.75C14.7223 4.66659 15.6552 5.05317 16.3428 5.74072C17.0303 6.42833 17.416 7.36114 17.416 8.3335V11.6665C17.4162 12.5117 17.1243 13.3311 16.5898 13.9858C16.0554 14.6406 15.3115 15.0911 14.4834 15.2603L14.083 15.3413V17.5005C14.0829 17.5887 14.0478 17.6734 13.9854 17.7358C13.9229 17.7982 13.8383 17.8334 13.75 17.8335C13.6616 17.8335 13.5762 17.7984 13.5137 17.7358C13.4513 17.6734 13.4161 17.5887 13.416 17.5005V15.3442L13.0186 15.2603C12.534 15.1589 12.0747 14.9608 11.6689 14.6772C11.2632 14.3937 10.919 14.0309 10.6572 13.6108L10.3584 13.1313L9.91895 13.4858C9.31479 13.9737 8.59613 14.2993 7.83105 14.4321L7.41602 14.5044V17.5005C7.4159 17.5887 7.38077 17.6734 7.31836 17.7358C7.25587 17.7982 7.17131 17.8335 7.08301 17.8335C6.99471 17.8335 6.91015 17.7982 6.84766 17.7358C6.78525 17.6734 6.75012 17.5887 6.75 17.5005V14.5024Z",
     },
   ],
+  parking: [
+    {
+      d: "M7.20801 4.25H12.209C12.6076 4.25041 12.9969 4.37043 13.3271 4.59375C13.6161 4.78917 13.8487 5.05569 14.002 5.36719L14.0625 5.50293L15.1035 8.10254L15.2295 8.41699H15.835C16.3653 8.41708 16.874 8.62793 17.249 9.00293C17.6239 9.37797 17.835 9.88671 17.835 10.417V12.917C17.8349 13.0052 17.7996 13.0899 17.7373 13.1523C17.6748 13.2149 17.5894 13.25 17.501 13.25H16.168V13.75C16.168 14.2804 15.9571 14.789 15.582 15.1641C15.207 15.5391 14.6984 15.75 14.168 15.75C13.6375 15.75 13.129 15.5391 12.7539 15.1641C12.3788 14.789 12.168 14.2804 12.168 13.75V13.25H7.83496V13.75C7.83496 14.2804 7.62399 14.789 7.24902 15.1641C6.87403 15.5391 6.36528 15.7499 5.83496 15.75C5.3046 15.75 4.79596 15.539 4.4209 15.1641C4.04583 14.789 3.83496 14.2804 3.83496 13.75V13.25H2.50098C2.41269 13.2499 2.32806 13.2148 2.26562 13.1523C2.20319 13.0899 2.16805 13.0053 2.16797 12.917V10.417C2.16797 9.88663 2.37893 9.37799 2.75391 9.00293C3.12898 8.62786 3.63754 8.41699 4.16797 8.41699H4.72754L4.80859 8.01465L5.24121 5.85645C5.33232 5.40241 5.57887 4.99415 5.9375 4.70117C6.29609 4.4083 6.74502 4.24872 7.20801 4.25ZM5.57422 12.4424C5.31569 12.4939 5.078 12.6212 4.8916 12.8076C4.70531 12.994 4.57876 13.2317 4.52734 13.4902C4.47596 13.7488 4.50165 14.0172 4.60254 14.2607C4.70344 14.5042 4.87468 14.712 5.09375 14.8584C5.31302 15.0049 5.57125 15.083 5.83496 15.083C6.18846 15.0829 6.52737 14.9424 6.77734 14.6924C7.02729 14.4424 7.16797 14.1035 7.16797 13.75C7.16797 13.4863 7.08987 13.2281 6.94336 13.0088C6.79686 12.7897 6.58826 12.6194 6.34473 12.5186C6.10109 12.4176 5.83286 12.3909 5.57422 12.4424ZM13.9082 12.4424C13.6496 12.4938 13.4121 12.6212 13.2256 12.8076C13.0391 12.9941 12.9118 13.2316 12.8604 13.4902C12.809 13.7488 12.8356 14.0172 12.9365 14.2607C13.0374 14.504 13.2079 14.712 13.4268 14.8584C13.646 15.0049 13.9043 15.083 14.168 15.083C14.5216 15.083 14.8603 14.9424 15.1104 14.6924C15.3604 14.4423 15.501 14.1036 15.501 13.75C15.501 13.4863 15.4229 13.2281 15.2764 13.0088C15.1299 12.7897 14.9212 12.6194 14.6777 12.5186C14.4343 12.4178 14.1666 12.391 13.9082 12.4424ZM4.16797 9.08301C3.8145 9.08301 3.4756 9.22379 3.22559 9.47363C2.97554 9.72368 2.83496 10.0634 2.83496 10.417V12.583H4.20605L4.35449 12.4199C4.54195 12.2137 4.77052 12.0483 5.02539 11.9355C5.28024 11.8228 5.55629 11.7646 5.83496 11.7646C6.11342 11.7647 6.38888 11.8229 6.64355 11.9355C6.89842 12.0483 7.127 12.2137 7.31445 12.4199L7.46387 12.583H12.5391L12.6875 12.4199C12.8749 12.2137 13.1036 12.0483 13.3584 11.9355C13.6133 11.8228 13.8893 11.7646 14.168 11.7646C14.4467 11.7646 14.7227 11.8228 14.9775 11.9355C15.2323 12.0483 15.461 12.2137 15.6484 12.4199L15.7969 12.583H17.168V10.417C17.168 10.0634 17.0274 9.72368 16.7773 9.47363C16.5274 9.22377 16.1884 9.08309 15.835 9.08301H4.16797ZM7.21777 4.91699C6.90944 4.91315 6.60911 5.01622 6.36816 5.20898C6.12465 5.40387 5.95685 5.67778 5.89453 5.9834V5.98535L5.52734 7.81836L5.4082 8.41699H9.66797V4.91699H7.21777ZM10.335 8.41699H14.5068L14.2324 7.73047L13.4404 5.75586C13.3424 5.51024 13.1733 5.29884 12.9551 5.14941C12.7367 5.00001 12.4784 4.91939 12.2139 4.91699H10.335V8.41699Z",
+      strokeWidth: 1,
+    },
+  ],
+  heating: [
+    {
+      d: "M10 12.5a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5ZM10 1.667v1.666M10 16.667v1.666M1.667 10h1.666M16.667 10h1.666M4.107 4.107l1.179 1.179M14.714 14.714l1.179 1.179M15.893 4.107l-1.179 1.179M5.286 14.714l-1.179 1.179",
+      rounded: true,
+      strokeWidth: 1.5,
+    },
+  ],
+  refrigerator: [
+    {
+      d: "M5 1.667h10c.92 0 1.667.746 1.667 1.666v13.334c0 .92-.747 1.666-1.667 1.666H5c-.92 0-1.667-.746-1.667-1.666V3.333c0-.92.747-1.666 1.667-1.666ZM3.333 8.333h13.334M6.667 5v1.667M6.667 10.833v2.5",
+      rounded: true,
+      strokeWidth: 1.5,
+    },
+  ],
+  tableware: [
+    {
+      d: "M3.92969 3.19043C3.77587 3.70449 3.68914 4.23585 3.6709 4.77148L3.66699 5C3.66699 6.67959 4.33391 8.29081 5.52148 9.47852C6.70917 10.6662 8.32036 11.3339 10 11.334C11.6797 11.334 13.2908 10.6662 14.4785 9.47852C15.592 8.36504 16.2485 6.87976 16.3262 5.31445L16.334 5C16.3355 4.38725 16.2469 3.77748 16.0713 3.19043L15.9639 2.83398H4.03613L3.92969 3.19043ZM3 4.99707C2.99364 4.09726 3.16722 3.20507 3.50977 2.37305C3.52473 2.3384 3.54572 2.30695 3.57129 2.2793L3.63379 2.2334L3.63477 2.23242C3.66071 2.2128 3.68846 2.19529 3.71582 2.17773C3.73328 2.17322 3.75051 2.16811 3.76855 2.16699H16.2109C16.2352 2.17121 16.2589 2.17718 16.2812 2.1875L16.2881 2.19043C16.3098 2.20012 16.3302 2.21246 16.3486 2.22754L16.3604 2.2373L16.373 2.24609L16.4219 2.28223C16.4466 2.30939 16.4678 2.33927 16.4824 2.37305C16.828 3.20487 17.0039 4.09728 17 4.99805V5C16.9992 6.72127 16.3646 8.38235 15.2168 9.66504C14.0691 10.9476 12.4887 11.7618 10.7783 11.9531L10.334 12.0029V17.167H15C15.0884 17.167 15.1738 17.2021 15.2363 17.2646C15.2986 17.3271 15.3339 17.4118 15.334 17.5C15.334 17.5884 15.2988 17.6738 15.2363 17.7363C15.1738 17.7988 15.0884 17.834 15 17.834H5C4.91177 17.8339 4.82709 17.7987 4.76465 17.7363C4.70214 17.6738 4.66699 17.5884 4.66699 17.5C4.66708 17.4117 4.70221 17.3271 4.76465 17.2646C4.82711 17.2022 4.91169 17.167 5 17.167H9.66699V12.0029L9.22266 11.9531C7.51222 11.7619 5.93197 10.9475 4.78418 9.66504C3.63636 8.38235 3.00082 6.72127 3 5V4.99707Z",
+      strokeWidth: 1,
+    },
+  ],
+  jacuzzi: [
+    {
+      d: "M2.5 10.833h15v1.667a5 5 0 0 1-5 5h-5a5 5 0 0 1-5-5v-1.667ZM5 17.5v.833M15 17.5v.833M6.667 6.667a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5ZM10.833 4.167a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5ZM14.167 7.5a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Z",
+      rounded: true,
+      strokeWidth: 1.5,
+    },
+  ],
+  fireplace: [
+    {
+      d: "M0.265153 0.0833307C0.00211679 0.242871 0.00183607 0.244488 0.000186827 1.66239C-0.00118169 2.83011 0.00348531 2.93003 0.0652792 3.05135C0.160654 3.23867 0.35723 3.33971 0.626337 3.33971H0.840878V10.4603C0.840878 17.3824 0.842738 17.5846 0.907445 17.7116C0.9465 17.7884 1.03184 17.8749 1.11399 17.9212L1.25396 18H8.97921C16.4951 18 16.708 17.9982 16.8349 17.9333C16.9115 17.8942 16.9979 17.8087 17.0441 17.7264L17.1227 17.5861V10.4629V3.33971H17.3321C17.6141 3.33971 17.7666 3.26156 17.8961 3.05076L18 2.88162V1.61443C18 0.917491 17.9873 0.355126 17.9717 0.364759C17.9562 0.374392 17.9135 0.326544 17.8769 0.258446C17.8395 0.188765 17.7527 0.105163 17.6785 0.067229C17.5496 0.00134559 17.3542 -0.000166143 8.97444 9.63968e-06L0.402251 0.000185423L0.265153 0.0833307ZM0.0146089 1.66977C0.0146089 2.38521 0.0192759 2.67289 0.0249956 2.30909C0.0307153 1.94526 0.0306802 1.3599 0.0249605 1.0083C0.0192408 0.656664 0.0145738 0.954335 0.0146089 1.66977ZM1.05142 1.66977V2.28501H8.98181H16.9122V1.66977V1.05453H8.98181H1.05142V1.66977ZM1.89359 10.1425V16.9453H2.50766H3.12174V15.731C3.12174 14.6081 3.12676 14.5068 3.18831 14.386C3.2834 14.1993 3.4804 14.0976 3.7473 14.0976H3.9598L3.97265 11.7861L3.98552 9.47453L4.07844 9.11832C4.41415 7.83135 5.26849 6.77637 6.49251 6.13729C8.26344 5.21264 10.4745 5.35963 12.0843 6.50897C12.8581 7.06145 13.4911 7.89568 13.7715 8.73248C13.9795 9.35338 13.9746 9.28377 13.9898 11.7861L14.0038 14.0976H14.2137C14.4835 14.0976 14.6586 14.1848 14.7632 14.3712C14.8405 14.509 14.8419 14.5328 14.8419 15.7284V16.9453H15.456H16.07V10.1425V3.33971H8.98181H1.89359V10.1425ZM8.61336 6.5944C8.11652 6.66376 7.9383 6.7004 7.64838 6.79282C6.3112 7.21906 5.3378 8.23632 5.08287 9.4739C5.02335 9.76274 5.01749 9.98254 5.01707 11.9443L5.01662 14.0976H6.03357H7.05052L6.9311 13.8779C6.72214 13.4934 6.64792 13.1882 6.65112 12.7265L6.65396 12.3222L7.00693 11.282C7.20109 10.71 7.3857 10.192 7.41714 10.131C7.483 10.0034 7.70126 9.87883 7.85892 9.87883C8.02458 9.87883 8.21555 9.99509 8.3438 10.174C8.40759 10.263 8.47167 10.3359 8.4862 10.3359C8.50069 10.3359 8.6287 9.94433 8.77064 9.46574C8.91258 8.98715 9.05785 8.53652 9.09347 8.46424C9.16667 8.31573 9.3717 8.19132 9.54325 8.19132C9.69983 8.19132 9.91904 8.31563 9.98385 8.44121C10.079 8.62564 11.2156 11.7832 11.2606 11.9882C11.2839 12.0946 11.3119 12.3635 11.3227 12.5859C11.3494 13.1357 11.2758 13.4325 10.9543 14.0713C10.947 14.0858 11.393 14.0976 11.9455 14.0976H12.9499L12.9388 11.8388C12.9279 9.62356 12.9262 9.57459 12.8491 9.29875C12.4772 7.96867 11.2989 6.94442 9.81647 6.66267C9.5269 6.60762 8.81004 6.56698 8.61336 6.5944ZM9.57834 10.412C9.57834 10.4704 9.18825 11.7184 9.14196 11.8081C9.07733 11.9333 8.85819 12.0585 8.70369 12.0585C8.52567 12.0585 8.35433 11.9494 8.19484 11.7344L8.04381 11.5307L7.87559 12.0143C7.67049 12.6039 7.65 12.7793 7.74825 13.1034C7.99051 13.9025 8.81752 14.3087 9.5222 13.9747C9.75762 13.8631 10.044 13.563 10.168 13.2979C10.2556 13.1106 10.2624 13.0633 10.2597 12.6562L10.2567 12.2167L9.93125 11.3203C9.63537 10.5054 9.57834 10.3586 9.57834 10.412ZM4.17445 16.0488V16.9453H8.98181H13.7892V16.0488V15.1523H8.98181H4.17445V16.0488Z",
+      strokeWidth: 1,
+      transform: "translate(1 1)",
+    },
+  ],
+  firePit: [
+    {
+      d: "M8.86523 1.33301C8.92124 1.33358 8.97656 1.3476 9.02539 1.375V1.37598C10.0635 1.96743 10.9266 2.82314 11.5264 3.85645C12.1261 4.8898 12.4408 6.06401 12.4395 7.25879V7.25977C12.4392 7.65228 12.4055 8.04419 12.3369 8.43066L12.0928 9.80566L13.1533 8.89746C13.6854 8.44247 14.1226 7.88697 14.4395 7.2627L14.4404 7.26172C14.4609 7.2212 14.4895 7.18531 14.5244 7.15625C14.5594 7.12714 14.5999 7.10561 14.6436 7.09277C14.6872 7.07994 14.7331 7.07644 14.7783 7.08203C14.8009 7.08484 14.8233 7.08937 14.8447 7.09668L14.9062 7.125C14.941 7.14551 14.9728 7.17043 15.002 7.19824C15.834 8.04782 16.4364 9.09528 16.751 10.2422C17.0665 11.3925 17.0826 12.6044 16.7979 13.7627C16.5131 14.921 15.9369 15.9874 15.124 16.8604C14.3111 17.7332 13.2884 18.3836 12.1533 18.75H12.1523C12.0744 18.7753 11.9899 18.7708 11.915 18.7373H11.9131C10.4762 18.1017 9.29458 17.0005 8.55859 15.6123L7.80273 14.1865L7.62012 15.791C7.53133 16.5733 7.58964 17.3652 7.79199 18.126L7.79492 18.1387L7.79883 18.1504C7.80455 18.1683 7.80954 18.1865 7.8125 18.2051L7.81641 18.2617C7.81594 18.3153 7.80252 18.3677 7.77734 18.415C7.75172 18.4632 7.71515 18.5047 7.66992 18.5352C7.62459 18.5656 7.57191 18.5843 7.51758 18.5898C7.46348 18.5954 7.40877 18.5879 7.3584 18.5674L7.35742 18.5664L6.98535 18.4023C6.13037 17.9956 5.36516 17.4194 4.73828 16.7061C4.02191 15.8909 3.50539 14.9197 3.22949 13.8701C2.95362 12.8204 2.92639 11.7204 3.14941 10.6582C3.37246 9.59609 3.83991 8.60004 4.51465 7.75L4.51855 7.74512C4.95085 7.18488 5.47054 6.69781 6.05762 6.30273L6.07715 6.29004L6.09473 6.27539L6.28613 6.11914L6.29395 6.11328C6.94962 5.55826 7.48589 4.87575 7.87012 4.10742C8.25402 3.33961 8.47841 2.50145 8.5293 1.64453C8.533 1.58832 8.55066 1.53376 8.58105 1.48633C8.61149 1.43887 8.65354 1.39987 8.70312 1.37305C8.75282 1.3462 8.80876 1.33243 8.86523 1.33301ZM8.98535 3.0127C8.62781 4.4159 7.84261 5.67295 6.73828 6.60938C6.73517 6.61182 6.73212 6.61411 6.72949 6.61621C6.72002 6.62377 6.70785 6.63335 6.69531 6.64355C6.66991 6.66424 6.63707 6.69079 6.60547 6.7168C6.57391 6.74276 6.54291 6.76878 6.51953 6.78809C6.50799 6.79762 6.49803 6.80589 6.49121 6.81152C6.48796 6.81421 6.48523 6.81685 6.4834 6.81836C6.48248 6.81912 6.48095 6.81992 6.48047 6.82031V6.82129L6.47754 6.82227C6.47377 6.82542 6.46994 6.82839 6.46582 6.83105L6.45996 6.83496C5.9192 7.19488 5.44087 7.64111 5.04395 8.15527C4.52278 8.80936 4.13704 9.56082 3.9082 10.3652C3.67941 11.1696 3.61207 12.0114 3.71094 12.8418C3.80986 13.6724 4.07294 14.4758 4.48438 15.2041C4.89574 15.9322 5.44727 16.5716 6.10742 17.085L6.94141 17.7324L6.91504 16.6777C6.88283 15.3921 7.20661 14.1224 7.85156 13.0098L7.85254 13.0078C7.88172 12.9571 7.92397 12.915 7.97461 12.8857C8.0253 12.8564 8.08305 12.8408 8.1416 12.8408H8.14258C8.16321 12.8408 8.18386 12.8427 8.2041 12.8467L8.20508 12.8477C8.27326 12.861 8.33602 12.8949 8.38379 12.9453C8.43154 12.9958 8.46213 13.0601 8.47168 13.1289V13.1279C8.50916 13.4154 8.56212 13.7008 8.63086 13.9824L8.63379 13.9941C8.86362 14.8481 9.27148 15.6437 9.8291 16.3301C10.3868 17.0165 11.0822 17.5787 11.8711 17.9785L12.0449 17.6348L12.2773 17.999C13.1666 17.6563 13.9671 17.117 14.6191 16.4219C15.2711 15.7268 15.7578 14.8937 16.043 13.9844C16.3281 13.0751 16.4049 12.1128 16.2666 11.1699C16.1283 10.2269 15.7784 9.32729 15.2441 8.53809L14.8574 7.9668L14.4346 8.51172C13.6785 9.48854 12.6415 10.2104 11.4629 10.5801C11.4001 10.5995 11.3326 10.6006 11.2695 10.582C11.2065 10.5634 11.1505 10.526 11.1084 10.4756C11.0663 10.4251 11.0403 10.3632 11.0332 10.2979C11.0262 10.2331 11.0377 10.1673 11.0674 10.1094C11.6954 8.91816 11.913 7.55284 11.6855 6.22559C11.4581 4.89839 10.7983 3.68363 9.80957 2.76953L9.19336 2.19922L8.98535 3.0127Z",
+      strokeWidth: 1,
+    },
+  ],
   pets: [
     {
       d: "M12.2491 11.2498C11.3324 9.58317 11.0482 9.1665 9.99907 9.1665C8.94991 9.1665 8.55241 9.79567 7.63574 11.4557C6.85074 12.8748 5.26407 12.9932 4.86824 14.1982C4.78741 14.419 4.74741 14.7623 4.74907 14.9998C4.74907 15.9798 5.40491 16.6665 6.24907 16.6665C7.29824 16.6665 8.74907 15.8332 9.99907 15.8332C11.2491 15.8332 12.6999 16.6665 13.7491 16.6665C14.5932 16.6665 15.2491 15.9807 15.2491 14.9998C15.2491 14.7623 15.2082 14.419 15.1274 14.1982C14.7316 12.989 13.0341 12.669 12.2491 11.2498ZM16.8232 6.73484C16.7161 6.68958 16.601 6.66634 16.4848 6.6665H16.4723C15.8598 6.6765 15.1723 7.2915 14.8115 8.2215C14.379 9.334 14.5782 10.4715 15.2598 10.7648C15.3673 10.8107 15.4823 10.8332 15.5982 10.8332C16.214 10.8332 16.9107 10.2148 17.274 9.27817C17.704 8.16567 17.5007 7.02817 16.8232 6.73484ZM7.89628 7.50016C7.94211 7.50016 7.98711 7.50016 8.03211 7.491C8.81878 7.38433 9.30961 6.36933 9.13211 5.22266C8.96295 4.14183 8.25961 3.3335 7.52211 3.3335C7.47628 3.3335 7.43128 3.3335 7.38628 3.34266C6.59961 3.44933 6.10878 4.46433 6.28628 5.611C6.45628 6.6885 7.15961 7.50016 7.89711 7.50016H7.89628ZM13.7129 5.611C13.8913 4.46433 13.4004 3.44933 12.6129 3.34266C12.5682 3.33647 12.5231 3.33341 12.4779 3.3335C11.7404 3.3335 11.0379 4.14183 10.8696 5.22267C10.6913 6.36933 11.1821 7.38433 11.9696 7.491C12.0146 7.49683 12.0596 7.50016 12.1046 7.50016C12.8421 7.50016 13.5463 6.6885 13.7129 5.611ZM4.74152 10.7648C5.42152 10.4715 5.61985 9.33234 5.18819 8.2215C4.82485 7.28484 4.12902 6.6665 3.51402 6.6665C3.39735 6.6665 3.28319 6.689 3.17485 6.73484C2.49485 7.02817 2.29652 8.16734 2.72819 9.27817C3.09152 10.2148 3.78735 10.8332 4.40235 10.8332C4.51902 10.8332 4.63319 10.8107 4.74152 10.7648Z",

package/src/icons/CloudUpload/CloudUploadIcon.tsx

@@ -0,0 +1,20 @@
+import Svg, { Path } from "react-native-svg";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { CLOUD_UPLOAD_PATH } from "./cloudUploadPath";
+
+export function CloudUploadIcon({ size = 36, color = colors.primary, strokeWidth = 2 }: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 36 36" fill="none">
+      <Path
+        d={CLOUD_UPLOAD_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+}
+
+export { CLOUD_UPLOAD_PATH } from "./cloudUploadPath";

package/src/icons/CloudUpload/CloudUploadIcon.web.tsx

@@ -0,0 +1,19 @@
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { CLOUD_UPLOAD_PATH } from "./cloudUploadPath";
+
+export function CloudUploadIcon({ size = 36, color = colors.primary, strokeWidth = 2 }: IconProps) {
+  return (
+    <svg width={size} height={size} viewBox="0 0 36 36" fill="none" aria-hidden>
+      <path
+        d={CLOUD_UPLOAD_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { CLOUD_UPLOAD_PATH } from "./cloudUploadPath";

package/src/icons/CloudUpload/cloudUploadPath.ts

@@ -0,0 +1,2 @@
+export const CLOUD_UPLOAD_PATH =
+  "M6 24.3633C4.19102 23.1524 3 21.0903 3 18.75C3 15.2346 5.68726 12.3469 9.11961 12.0291C9.82172 7.7582 13.5304 4.5 18 4.5C22.4696 4.5 26.1783 7.7582 26.8804 12.0291C30.3127 12.3469 33 15.2346 33 18.75C33 21.0903 31.809 23.1524 30 24.3633M24 24L18 18L12 24M18 18V31.5";

package/src/icons/CloudUpload/index.ts

@@ -0,0 +1 @@
+export { CloudUploadIcon, CLOUD_UPLOAD_PATH } from "./CloudUploadIcon";

package/src/icons/Cutlery/CutleryIcon.tsx

@@ -0,0 +1,14 @@
+import Svg, { Path } from "react-native-svg";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { CUTLERY_PATH } from "./cutleryPath";
+
+export function CutleryIcon({ size = 16, color = colors.grey0 }: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      <Path d={CUTLERY_PATH} fill={color} />
+    </Svg>
+  );
+}
+
+export { CUTLERY_PATH } from "./cutleryPath";

package/src/icons/Cutlery/CutleryIcon.web.tsx

@@ -0,0 +1,13 @@
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { CUTLERY_PATH } from "./cutleryPath";
+
+export function CutleryIcon({ size = 16, color = colors.grey0 }: IconProps) {
+  return (
+    <svg width={size} height={size} viewBox="0 0 16 16" fill="none" aria-hidden>
+      <path d={CUTLERY_PATH} fill={color} />
+    </svg>
+  );
+}
+
+export { CUTLERY_PATH } from "./cutleryPath";

package/src/icons/Cutlery/cutleryPath.ts

@@ -0,0 +1,2 @@
+export const CUTLERY_PATH =
+  "M12.668 1.33301C12.4912 1.33301 12.3216 1.40325 12.1966 1.52827C12.0715 1.65329 12.0013 1.82286 12.0013 1.99967V5.63967L11.3346 6.08634V1.99967C11.3346 1.82286 11.2644 1.65329 11.1394 1.52827C11.0143 1.40325 10.8448 1.33301 10.668 1.33301C10.4912 1.33301 10.3216 1.40325 10.1966 1.52827C10.0715 1.65329 10.0013 1.82286 10.0013 1.99967V6.08634L9.33464 5.63967V1.99967C9.33464 1.82286 9.2644 1.65329 9.13937 1.52827C9.01435 1.40325 8.84478 1.33301 8.66797 1.33301C8.49116 1.33301 8.32159 1.40325 8.19656 1.52827C8.07154 1.65329 8.0013 1.82286 8.0013 1.99967V5.99967C8.00187 6.10948 8.02955 6.21744 8.08189 6.31397C8.13422 6.41051 8.20959 6.49262 8.3013 6.55301L10.0013 7.69301V13.9997C10.0013 14.1765 10.0715 14.3461 10.1966 14.4711C10.3216 14.5961 10.4912 14.6663 10.668 14.6663C10.8448 14.6663 11.0143 14.5961 11.1394 14.4711C11.2644 14.3461 11.3346 14.1765 11.3346 13.9997V7.69301L13.0346 6.55301C13.1263 6.49262 13.2017 6.41051 13.254 6.31397C13.3064 6.21744 13.3341 6.10948 13.3346 5.99967V1.99967C13.3346 1.82286 13.2644 1.65329 13.1394 1.52827C13.0143 1.40325 12.8448 1.33301 12.668 1.33301ZM6.0013 1.33301C5.11725 1.33301 4.2694 1.6842 3.64428 2.30932C3.01916 2.93444 2.66797 3.78229 2.66797 4.66634V8.66634C2.66797 8.84315 2.73821 9.01272 2.86323 9.13774C2.98826 9.26277 3.15782 9.33301 3.33464 9.33301H5.33464V13.9997C5.33464 14.1765 5.40487 14.3461 5.5299 14.4711C5.65492 14.5961 5.82449 14.6663 6.0013 14.6663C6.17811 14.6663 6.34768 14.5961 6.47271 14.4711C6.59773 14.3461 6.66797 14.1765 6.66797 13.9997V1.99967C6.66797 1.82286 6.59773 1.65329 6.47271 1.52827C6.34768 1.40325 6.17811 1.33301 6.0013 1.33301ZM5.33464 7.99967H4.0013V4.66634C4.00109 4.25257 4.12921 3.84892 4.36801 3.51102C4.60681 3.17312 4.94453 2.9176 5.33464 2.77967V7.99967Z";

package/src/icons/Cutlery/index.ts

@@ -0,0 +1 @@
+export { CutleryIcon, CUTLERY_PATH } from "./CutleryIcon";

package/src/icons/Dollar/DollarIcon.tsx

@@ -0,0 +1,14 @@
+import Svg, { Path } from "react-native-svg";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { DOLLAR_PATH } from "./dollarPath";
+
+export function DollarIcon({ size = 14, color = colors.grey0 }: IconProps) {
+  return (
+    <Svg width={(size * 8) / 14} height={size} viewBox="0 0 8 14" fill="none">
+      <Path d={DOLLAR_PATH} fill={color} />
+    </Svg>
+  );
+}
+
+export { DOLLAR_PATH } from "./dollarPath";

package/src/icons/Dollar/DollarIcon.web.tsx

@@ -0,0 +1,13 @@
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { DOLLAR_PATH } from "./dollarPath";
+
+export function DollarIcon({ size = 14, color = colors.grey0 }: IconProps) {
+  return (
+    <svg width={(size * 8) / 14} height={size} viewBox="0 0 8 14" fill="none" aria-hidden>
+      <path d={DOLLAR_PATH} fill={color} />
+    </svg>
+  );
+}
+
+export { DOLLAR_PATH } from "./dollarPath";

package/src/icons/Dollar/dollarPath.ts

@@ -0,0 +1,2 @@
+export const DOLLAR_PATH =
+  "M5.33333 6H4.66667V3.33333H6C6.17681 3.33333 6.34638 3.40357 6.4714 3.5286C6.59643 3.65362 6.66667 3.82319 6.66667 4C6.66667 4.17681 6.7369 4.34638 6.86193 4.4714C6.98695 4.59643 7.15652 4.66667 7.33333 4.66667C7.51014 4.66667 7.67971 4.59643 7.80474 4.4714C7.92976 4.34638 8 4.17681 8 4C8 3.46957 7.78929 2.96086 7.41421 2.58579C7.03914 2.21071 6.53043 2 6 2H4.66667V0.666667C4.66667 0.489856 4.59643 0.320286 4.4714 0.195262C4.34638 0.0702379 4.17681 0 4 0C3.82319 0 3.65362 0.0702379 3.5286 0.195262C3.40357 0.320286 3.33333 0.489856 3.33333 0.666667V2H2.66667C1.95942 2 1.28115 2.28095 0.781048 2.78105C0.280951 3.28115 0 3.95942 0 4.66667C0 5.37391 0.280951 6.05219 0.781048 6.55228C1.28115 7.05238 1.95942 7.33333 2.66667 7.33333H3.33333V10H2C1.82319 10 1.65362 9.92976 1.5286 9.80474C1.40357 9.67971 1.33333 9.51014 1.33333 9.33333C1.33333 9.15652 1.2631 8.98695 1.13807 8.86193C1.01305 8.7369 0.843478 8.66667 0.666667 8.66667C0.489856 8.66667 0.320287 8.7369 0.195262 8.86193C0.070238 8.98695 0 9.15652 0 9.33333C0 9.86377 0.210714 10.3725 0.585787 10.7475C0.960859 11.1226 1.46957 11.3333 2 11.3333H3.33333V12.6667C3.33333 12.8435 3.40357 13.013 3.5286 13.1381C3.65362 13.2631 3.82319 13.3333 4 13.3333C4.17681 13.3333 4.34638 13.2631 4.4714 13.1381C4.59643 13.013 4.66667 12.8435 4.66667 12.6667V11.3333H5.33333C6.04058 11.3333 6.71885 11.0524 7.21895 10.5523C7.71905 10.0522 8 9.37391 8 8.66667C8 7.95942 7.71905 7.28115 7.21895 6.78105C6.71885 6.28095 6.04058 6 5.33333 6V6ZM3.33333 6H2.66667C2.31304 6 1.97391 5.85952 1.72386 5.60948C1.47381 5.35943 1.33333 5.02029 1.33333 4.66667C1.33333 4.31304 1.47381 3.97391 1.72386 3.72386C1.97391 3.47381 2.31304 3.33333 2.66667 3.33333H3.33333V6ZM5.33333 10H4.66667V7.33333H5.33333C5.68696 7.33333 6.02609 7.47381 6.27614 7.72386C6.52619 7.97391 6.66667 8.31304 6.66667 8.66667C6.66667 9.02029 6.52619 9.35943 6.27614 9.60947C6.02609 9.85952 5.68696 10 5.33333 10Z";

package/src/icons/Dollar/index.ts

@@ -0,0 +1 @@
+export { DollarIcon, DOLLAR_PATH } from "./DollarIcon";

package/src/icons/DragHandle/DragHandleIcon.tsx

@@ -0,0 +1,14 @@
+import Svg, { Path } from "react-native-svg";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { DRAG_HANDLE_PATH } from "./dragHandlePath";
+
+export function DragHandleIcon({ size = 9, color = colors.white }: IconProps) {
+  return (
+    <Svg width={(size * 6) / 9} height={size} viewBox="0 0 6 9" fill="none">
+      <Path d={DRAG_HANDLE_PATH} fill={color} />
+    </Svg>
+  );
+}
+
+export { DRAG_HANDLE_PATH } from "./dragHandlePath";

package/src/icons/DragHandle/DragHandleIcon.web.tsx

@@ -0,0 +1,13 @@
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { DRAG_HANDLE_PATH } from "./dragHandlePath";
+
+export function DragHandleIcon({ size = 9, color = colors.white }: IconProps) {
+  return (
+    <svg width={(size * 6) / 9} height={size} viewBox="0 0 6 9" fill="none" aria-hidden>
+      <path d={DRAG_HANDLE_PATH} fill={color} />
+    </svg>
+  );
+}
+
+export { DRAG_HANDLE_PATH } from "./dragHandlePath";

package/src/icons/DragHandle/dragHandlePath.ts

@@ -0,0 +1,2 @@
+export const DRAG_HANDLE_PATH =
+  "M1 3.5C0.802219 3.5 0.60888 3.55865 0.44443 3.66853C0.279981 3.77841 0.151809 3.93459 0.0761209 4.11732C0.000433281 4.30004 -0.0193701 4.50111 0.0192152 4.69509C0.0578004 4.88907 0.153041 5.06725 0.292894 5.20711C0.432746 5.34696 0.610929 5.4422 0.80491 5.48079C0.998891 5.51937 1.19996 5.49957 1.38268 5.42388C1.56541 5.34819 1.72159 5.22002 1.83147 5.05557C1.94135 4.89112 2 4.69778 2 4.5C2 4.23478 1.89464 3.98043 1.70711 3.79289C1.51957 3.60536 1.26522 3.5 1 3.5ZM1 7C0.802219 7 0.60888 7.05865 0.44443 7.16853C0.279981 7.27841 0.151809 7.43459 0.0761209 7.61732C0.000433281 7.80004 -0.0193701 8.00111 0.0192152 8.19509C0.0578004 8.38907 0.153041 8.56725 0.292894 8.70711C0.432746 8.84696 0.610929 8.9422 0.80491 8.98079C0.998891 9.01937 1.19996 8.99957 1.38268 8.92388C1.56541 8.84819 1.72159 8.72002 1.83147 8.55557C1.94135 8.39112 2 8.19778 2 8C2 7.73478 1.89464 7.48043 1.70711 7.29289C1.51957 7.10536 1.26522 7 1 7ZM4.5 2C4.69778 2 4.89112 1.94135 5.05557 1.83147C5.22002 1.72159 5.34819 1.56541 5.42388 1.38268C5.49957 1.19996 5.51937 0.998891 5.48079 0.80491C5.4422 0.610929 5.34696 0.432746 5.20711 0.292894C5.06725 0.153041 4.88907 0.0578004 4.69509 0.0192152C4.50111 -0.0193701 4.30004 0.000433281 4.11732 0.0761209C3.93459 0.151809 3.77841 0.279981 3.66853 0.44443C3.55865 0.608879 3.5 0.802219 3.5 1C3.5 1.26522 3.60536 1.51957 3.79289 1.70711C3.98043 1.89464 4.23478 2 4.5 2ZM1 4.19685e-07C0.802219 4.19685e-07 0.60888 0.0586494 0.44443 0.168531C0.279981 0.278412 0.151809 0.434591 0.0761209 0.617317C0.000433281 0.800043 -0.0193701 1.00111 0.0192152 1.19509C0.0578004 1.38907 0.153041 1.56725 0.292894 1.70711C0.432746 1.84696 0.610929 1.9422 0.80491 1.98079C0.998891 2.01937 1.19996 1.99957 1.38268 1.92388C1.56541 1.84819 1.72159 1.72002 1.83147 1.55557C1.94135 1.39112 2 1.19778 2 1C2 0.734784 1.89464 0.48043 1.70711 0.292894C1.51957 0.105357 1.26522 4.19685e-07 1 4.19685e-07ZM4.5 7C4.30222 7 4.10888 7.05865 3.94443 7.16853C3.77998 7.27841 3.65181 7.43459 3.57612 7.61732C3.50043 7.80004 3.48063 8.00111 3.51922 8.19509C3.5578 8.38907 3.65304 8.56725 3.79289 8.70711C3.93275 8.84696 4.11093 8.9422 4.30491 8.98079C4.49889 9.01937 4.69996 8.99957 4.88268 8.92388C5.06541 8.84819 5.22159 8.72002 5.33147 8.55557C5.44135 8.39112 5.5 8.19778 5.5 8C5.5 7.73478 5.39464 7.48043 5.20711 7.29289C5.01957 7.10536 4.76522 7 4.5 7V7ZM4.5 3.5C4.30222 3.5 4.10888 3.55865 3.94443 3.66853C3.77998 3.77841 3.65181 3.93459 3.57612 4.11732C3.50043 4.30004 3.48063 4.50111 3.51922 4.69509C3.5578 4.88907 3.65304 5.06725 3.79289 5.20711C3.93275 5.34696 4.11093 5.4422 4.30491 5.48079C4.49889 5.51937 4.69996 5.49957 4.88268 5.42388C5.06541 5.34819 5.22159 5.22002 5.33147 5.05557C5.44135 4.89112 5.5 4.69778 5.5 4.5C5.5 4.23478 5.39464 3.98043 5.20711 3.79289C5.01957 3.60536 4.76522 3.5 4.5 3.5V3.5Z";

package/src/icons/DragHandle/index.ts

@@ -0,0 +1 @@
+export { DragHandleIcon, DRAG_HANDLE_PATH } from "./DragHandleIcon";

package/src/icons/Eye/EyeIcon.tsx

@@ -0,0 +1,23 @@
+import Svg, { Path } from "react-native-svg";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { EYE_PATHS } from "./eyePaths";
+
+export function EyeIcon({ size = 11, color = colors.grey0, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <Svg width={(size * 15) / 11} height={size} viewBox="0 0 15 11" fill="none">
+      {EYE_PATHS.map((path) => (
+        <Path
+          key={path}
+          d={path}
+          stroke={color}
+          strokeWidth={strokeWidth}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      ))}
+    </Svg>
+  );
+}
+
+export { EYE_PATHS } from "./eyePaths";

package/src/icons/Eye/EyeIcon.web.tsx

@@ -0,0 +1,22 @@
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+import { EYE_PATHS } from "./eyePaths";
+
+export function EyeIcon({ size = 11, color = colors.grey0, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <svg width={(size * 15) / 11} height={size} viewBox="0 0 15 11" fill="none" aria-hidden>
+      {EYE_PATHS.map((path) => (
+        <path
+          key={path}
+          d={path}
+          stroke={color}
+          strokeWidth={strokeWidth}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      ))}
+    </svg>
+  );
+}
+
+export { EYE_PATHS } from "./eyePaths";

package/src/icons/Eye/eyePaths.ts

@@ -0,0 +1,4 @@
+export const EYE_PATHS = [
+  "M0.925915 5.89212C0.835124 5.74836 0.789728 5.67648 0.764316 5.56561C0.745228 5.48233 0.745228 5.351 0.764316 5.26772C0.789728 5.15685 0.835124 5.08497 0.925915 4.94121C1.67619 3.75323 3.90943 0.75 7.31277 0.75C10.7161 0.75 12.9494 3.75323 13.6996 4.94121C13.7904 5.08497 13.8358 5.15685 13.8612 5.26772C13.8803 5.351 13.8803 5.48233 13.8612 5.56561C13.8358 5.67648 13.7904 5.74836 13.6996 5.89212C12.9494 7.08011 10.7161 10.0833 7.31277 10.0833C3.90943 10.0833 1.67619 7.08011 0.925915 5.89212Z",
+  "M7.31277 7.41667C8.41734 7.41667 9.31277 6.52124 9.31277 5.41667C9.31277 4.3121 8.41734 3.41667 7.31277 3.41667C6.2082 3.41667 5.31277 4.3121 5.31277 5.41667C5.31277 6.52124 6.2082 7.41667 7.31277 7.41667Z",
+] as const;

package/src/icons/Eye/index.ts

@@ -0,0 +1 @@
+export { EyeIcon, EYE_PATHS } from "./EyeIcon";