@ecohouse/ui 0.1.3 → 0.1.5

package/src/icons/Calendar/CalendarIcon.web.tsx

@@ -0,0 +1,27 @@
+import { CALENDAR_PATH } from "./calendarPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function CalendarIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={CALENDAR_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { CALENDAR_PATH } from "./calendarPath";

package/src/icons/Calendar/calendarPath.ts

@@ -0,0 +1,3 @@
+/** Calendar icon path — 16×16 viewBox. */
+export const CALENDAR_PATH =
+  "M14 6.66668H2M14 8.33334V5.86668C14 4.74657 14 4.18652 13.782 3.7587C13.5903 3.38237 13.2843 3.07641 12.908 2.88466C12.4802 2.66668 11.9201 2.66668 10.8 2.66668H5.2C4.0799 2.66668 3.51984 2.66668 3.09202 2.88466C2.71569 3.07641 2.40973 3.38237 2.21799 3.7587C2 4.18652 2 4.74657 2 5.86668V11.4667C2 12.5868 2 13.1468 2.21799 13.5747C2.40973 13.951 2.71569 14.2569 3.09202 14.4487C3.51984 14.6667 4.0799 14.6667 5.2 14.6667H8M10.6667 1.33334V4.00001M5.33333 1.33334V4.00001M9.66667 12.6667L11 14L14 11";

package/src/icons/Calendar/index.ts

@@ -0,0 +1 @@
+export { CalendarIcon, CALENDAR_PATH } from "./CalendarIcon";

package/src/icons/CalendarOutline/CalendarOutlineIcon.tsx

@@ -0,0 +1,25 @@
+import Svg, { Path } from "react-native-svg";
+import { CALENDAR_OUTLINE_PATH } from "./calendarOutlinePath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { CALENDAR_OUTLINE_PATH } from "./calendarOutlinePath";
+
+/** Native — react-native-svg (peer dependency). */
+export function CalendarOutlineIcon({
+  size = 20,
+  color = colors.primary,
+  strokeWidth = 1.5,
+}: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      <Path
+        d={CALENDAR_OUTLINE_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+}

package/src/icons/CalendarOutline/CalendarOutlineIcon.web.tsx

@@ -0,0 +1,31 @@
+import { CALENDAR_OUTLINE_PATH } from "./calendarOutlinePath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function CalendarOutlineIcon({
+  size = 20,
+  color = colors.primary,
+  strokeWidth = 1.5,
+}: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={CALENDAR_OUTLINE_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { CALENDAR_OUTLINE_PATH } from "./calendarOutlinePath";

package/src/icons/CalendarOutline/calendarOutlinePath.ts

@@ -0,0 +1,3 @@
+/** Plain calendar icon path (no checkmark badge) — 16×16 viewBox. */
+export const CALENDAR_OUTLINE_PATH =
+  "M10.6667 1.33334V4.00001M5.33333 1.33334V4.00001M2 6.66668H14M5.2 2.66668H10.8C11.9201 2.66668 12.4802 2.66668 12.908 2.88466C13.2843 3.07641 13.5903 3.38237 13.782 3.7587C14 4.18652 14 4.74657 14 5.86668V11.4667C14 12.5868 14 13.1468 13.782 13.5747C13.5903 13.951 13.2843 14.2569 12.908 14.4487C12.4802 14.6667 11.9201 14.6667 10.8 14.6667H5.2C4.0799 14.6667 3.51984 14.6667 3.09202 14.4487C2.71569 14.2569 2.40973 13.951 2.21799 13.5747C2 13.1468 2 12.5868 2 11.4667V5.86668C2 4.74657 2 4.18652 2.21799 3.7587C2.40973 3.38237 2.71569 3.07641 3.09202 2.88466C3.51984 2.66668 4.0799 2.66668 5.2 2.66668Z";

package/src/icons/CalendarOutline/index.ts

@@ -0,0 +1 @@
+export { CalendarOutlineIcon, CALENDAR_OUTLINE_PATH } from "./CalendarOutlineIcon";

package/src/icons/ChevronLeft/ChevronLeftIcon.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import { CHEVRON_LEFT_PATH } from "./chevronLeftPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { CHEVRON_LEFT_PATH } from "./chevronLeftPath";
+
+/** Native — react-native-svg (peer dependency). */
+export function ChevronLeftIcon({ size = 20, color = colors.primary, strokeWidth = 2 }: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 20 20" fill="none">
+      <Path
+        d={CHEVRON_LEFT_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+}

package/src/icons/ChevronLeft/ChevronLeftIcon.web.tsx

@@ -0,0 +1,27 @@
+import { CHEVRON_LEFT_PATH } from "./chevronLeftPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function ChevronLeftIcon({ size = 20, color = colors.primary, strokeWidth = 2 }: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 20 20"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={CHEVRON_LEFT_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { CHEVRON_LEFT_PATH } from "./chevronLeftPath";

package/src/icons/ChevronLeft/chevronLeftPath.ts

@@ -0,0 +1,2 @@
+/** Chevron left path — 20×20 viewBox. */
+export const CHEVRON_LEFT_PATH = "M12.5 15L7.5 10L12.5 5";

package/src/icons/ChevronLeft/index.ts

@@ -0,0 +1 @@
+export { ChevronLeftIcon, CHEVRON_LEFT_PATH } from "./ChevronLeftIcon";

package/src/icons/Heart/HeartIcon.tsx

@@ -0,0 +1,23 @@
+import Svg, { Path } from "react-native-svg";
+import { HEART_PATH } from "./heartPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { HEART_PATH } from "./heartPath";
+
+/** Native — react-native-svg (peer dependency). */
+export function HeartIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      <Path
+        d={HEART_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+      />
+    </Svg>
+  );
+}

package/src/icons/Heart/HeartIcon.web.tsx

@@ -0,0 +1,29 @@
+import { HEART_PATH } from "./heartPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function HeartIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={HEART_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        fillRule="evenodd"
+        clipRule="evenodd"
+      />
+    </svg>
+  );
+}
+
+export { HEART_PATH } from "./heartPath";

package/src/icons/Heart/heartPath.ts

@@ -0,0 +1,3 @@
+/** Heart icon path — 16×16 viewBox. */
+export const HEART_PATH =
+  "M7.99547 3.42388C6.66257 1.8656 4.43987 1.44643 2.76984 2.87334C1.0998 4.30026 0.864686 6.68598 2.17617 8.3736C3.26659 9.77674 6.56656 12.7361 7.64811 13.6939C7.76911 13.801 7.82961 13.8546 7.90018 13.8757C7.96178 13.8941 8.02917 13.8941 8.09077 13.8757C8.16134 13.8546 8.22184 13.801 8.34284 13.6939C9.42439 12.7361 12.7244 9.77674 13.8148 8.3736C15.1263 6.68598 14.9199 4.28525 13.2211 2.87334C11.5224 1.46144 9.32838 1.8656 7.99547 3.42388Z";

package/src/icons/Heart/index.ts

@@ -0,0 +1 @@
+export { HeartIcon, HEART_PATH } from "./HeartIcon";

package/src/icons/HelpCircle/HelpCircleIcon.tsx

@@ -0,0 +1,25 @@
+import Svg, { Path } from "react-native-svg";
+import { HELP_CIRCLE_PATH } from "./helpCirclePath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { HELP_CIRCLE_PATH } from "./helpCirclePath";
+
+/** Native — react-native-svg (peer dependency). */
+export function HelpCircleIcon({
+  size = 20,
+  color = colors.primary,
+  strokeWidth = 1.5,
+}: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      <Path
+        d={HELP_CIRCLE_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+}

package/src/icons/HelpCircle/HelpCircleIcon.web.tsx

@@ -0,0 +1,31 @@
+import { HELP_CIRCLE_PATH } from "./helpCirclePath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function HelpCircleIcon({
+  size = 20,
+  color = colors.primary,
+  strokeWidth = 1.5,
+}: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={HELP_CIRCLE_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { HELP_CIRCLE_PATH } from "./helpCirclePath";

package/src/icons/HelpCircle/helpCirclePath.ts

@@ -0,0 +1,3 @@
+/** HelpCircle icon path — 16×16 viewBox. */
+export const HELP_CIRCLE_PATH =
+  "M6.99971 6.00149C7.11717 5.66757 7.34902 5.386 7.6542 5.20665C7.95937 5.0273 8.31817 4.96174 8.66705 5.02158C9.01593 5.08142 9.33238 5.2628 9.56034 5.5336C9.7883 5.8044 9.91306 6.14714 9.91254 6.50112C9.91254 7.50037 8.41365 8 8.41365 8M8.43298 10H8.43964M8.33304 13.3333C11.4627 13.3333 13.9997 10.7963 13.9997 7.66667C13.9997 4.53705 11.4627 2 8.33304 2C5.20343 2 2.66638 4.53705 2.66638 7.66667C2.66638 8.3 2.77027 8.90906 2.96196 9.47774C3.03409 9.69175 3.07016 9.79875 3.07666 9.88095C3.08309 9.96213 3.07823 10.019 3.05814 10.098C3.03781 10.1779 2.99291 10.261 2.9031 10.4272L1.81267 12.4456C1.65713 12.7335 1.57936 12.8774 1.59676 12.9885C1.61192 13.0853 1.66887 13.1705 1.75249 13.2215C1.84849 13.2801 2.01124 13.2632 2.33674 13.2296L5.75075 12.8767C5.85414 12.866 5.90583 12.8606 5.95295 12.8624C5.99929 12.8642 6.03201 12.8686 6.0772 12.879C6.12315 12.8896 6.18092 12.9118 6.29648 12.9564C6.92851 13.1999 7.61519 13.3333 8.33304 13.3333Z";

package/src/icons/HelpCircle/index.ts

@@ -0,0 +1 @@
+export { HelpCircleIcon, HELP_CIRCLE_PATH } from "./HelpCircleIcon";

package/src/icons/LayoutGrid/LayoutGridIcon.tsx

@@ -0,0 +1,25 @@
+import Svg, { Path } from "react-native-svg";
+import { LAYOUT_GRID_PATH } from "./layoutGridPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { LAYOUT_GRID_PATH } from "./layoutGridPath";
+
+/** Native — react-native-svg (peer dependency). */
+export function LayoutGridIcon({
+  size = 20,
+  color = colors.primary,
+  strokeWidth = 1.5,
+}: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      <Path
+        d={LAYOUT_GRID_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+}

package/src/icons/LayoutGrid/LayoutGridIcon.web.tsx

@@ -0,0 +1,31 @@
+import { LAYOUT_GRID_PATH } from "./layoutGridPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function LayoutGridIcon({
+  size = 20,
+  color = colors.primary,
+  strokeWidth = 1.5,
+}: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={LAYOUT_GRID_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { LAYOUT_GRID_PATH } from "./layoutGridPath";

package/src/icons/LayoutGrid/index.ts

@@ -0,0 +1 @@
+export { LayoutGridIcon, LAYOUT_GRID_PATH } from "./LayoutGridIcon";

package/src/icons/LayoutGrid/layoutGridPath.ts

@@ -0,0 +1,3 @@
+/** LayoutGrid icon path — 16×16 viewBox. */
+export const LAYOUT_GRID_PATH =
+  "M4.33333 4.33333H4.34M11.6667 4.33333H11.6733M4.33333 11.6667H4.34M8.66667 8.66667H8.67333M11.6667 11.6667H11.6733M11.3333 14H14V11.3333M9.33333 11V14M14 9.33333H11M10.4 6.66667H12.9333C13.3067 6.66667 13.4934 6.66667 13.636 6.594C13.7614 6.53009 13.8634 6.4281 13.9273 6.30266C14 6.16005 14 5.97337 14 5.6V3.06667C14 2.6933 14 2.50661 13.9273 2.36401C13.8634 2.23856 13.7614 2.13658 13.636 2.07266C13.4934 2 13.3067 2 12.9333 2H10.4C10.0266 2 9.83995 2 9.69734 2.07266C9.5719 2.13658 9.46991 2.23856 9.406 2.36401C9.33333 2.50661 9.33333 2.6933 9.33333 3.06667V5.6C9.33333 5.97337 9.33333 6.16005 9.406 6.30266C9.46991 6.4281 9.5719 6.53009 9.69734 6.594C9.83995 6.66667 10.0266 6.66667 10.4 6.66667ZM3.06667 6.66667H5.6C5.97337 6.66667 6.16005 6.66667 6.30266 6.594C6.4281 6.53009 6.53009 6.4281 6.594 6.30266C6.66667 6.16005 6.66667 5.97337 6.66667 5.6V3.06667C6.66667 2.6933 6.66667 2.50661 6.594 2.36401C6.53009 2.23856 6.4281 2.13658 6.30266 2.07266C6.16005 2 5.97337 2 5.6 2H3.06667C2.6933 2 2.50661 2 2.36401 2.07266C2.23856 2.13658 2.13658 2.23856 2.07266 2.36401C2 2.50661 2 2.6933 2 3.06667V5.6C2 5.97337 2 6.16005 2.07266 6.30266C2.13658 6.4281 2.23856 6.53009 2.36401 6.594C2.50661 6.66667 2.6933 6.66667 3.06667 6.66667ZM3.06667 14H5.6C5.97337 14 6.16005 14 6.30266 13.9273C6.4281 13.8634 6.53009 13.7614 6.594 13.636C6.66667 13.4934 6.66667 13.3067 6.66667 12.9333V10.4C6.66667 10.0266 6.66667 9.83995 6.594 9.69734C6.53009 9.5719 6.4281 9.46991 6.30266 9.406C6.16005 9.33333 5.97337 9.33333 5.6 9.33333H3.06667C2.6933 9.33333 2.50661 9.33333 2.36401 9.406C2.23856 9.46991 2.13658 9.5719 2.07266 9.69734C2 9.83995 2 10.0266 2 10.4V12.9333C2 13.3067 2 13.4934 2.07266 13.636C2.13658 13.7614 2.23856 13.8634 2.36401 13.9273C2.50661 14 2.6933 14 3.06667 14Z";

package/src/icons/LogOut/LogOutIcon.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import { LOG_OUT_PATH } from "./logOutPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { LOG_OUT_PATH } from "./logOutPath";
+
+/** Native — react-native-svg (peer dependency). */
+export function LogOutIcon({ size = 20, color = colors.red, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      <Path
+        d={LOG_OUT_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+}

package/src/icons/LogOut/LogOutIcon.web.tsx

@@ -0,0 +1,27 @@
+import { LOG_OUT_PATH } from "./logOutPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function LogOutIcon({ size = 20, color = colors.red, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={LOG_OUT_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { LOG_OUT_PATH } from "./logOutPath";

package/src/icons/LogOut/index.ts

@@ -0,0 +1 @@
+export { LogOutIcon, LOG_OUT_PATH } from "./LogOutIcon";

package/src/icons/LogOut/logOutPath.ts

@@ -0,0 +1,3 @@
+/** LogOut icon path — 16×16 viewBox. */
+export const LOG_OUT_PATH =
+  "M10.6667 4.66667L14 8L10.6667 11.3333M14 8H6M8 11.3333C8 11.5304 8 11.6289 7.99268 11.7143C7.91655 12.6013 7.26324 13.3312 6.39002 13.5049C6.30602 13.5216 6.20801 13.5324 6.01223 13.5542L5.3313 13.6299C4.30832 13.7435 3.7968 13.8004 3.39044 13.6703C2.84862 13.4969 2.40628 13.101 2.17412 12.5817C2 12.1921 2 11.6775 2 10.6482V5.3518C2 4.32251 2 3.80787 2.17412 3.41835C2.40628 2.89899 2.84862 2.50307 3.39044 2.32969C3.79681 2.19965 4.3083 2.25648 5.33129 2.37015L6.01223 2.44581C6.20808 2.46757 6.306 2.47845 6.39002 2.49515C7.26324 2.66877 7.91655 3.39869 7.99268 4.28574C8 4.37109 8 4.46962 8 4.66667";

package/src/icons/Settings/SettingsIcon.tsx

@@ -0,0 +1,21 @@
+import Svg, { Path } from "react-native-svg";
+import { SETTINGS_PATH } from "./settingsPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { SETTINGS_PATH } from "./settingsPath";
+
+/** Native — react-native-svg (peer dependency). */
+export function SettingsIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      <Path
+        d={SETTINGS_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </Svg>
+  );
+}

package/src/icons/Settings/SettingsIcon.web.tsx

@@ -0,0 +1,27 @@
+import { SETTINGS_PATH } from "./settingsPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function SettingsIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      <path
+        d={SETTINGS_PATH}
+        stroke={color}
+        strokeWidth={strokeWidth}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export { SETTINGS_PATH } from "./settingsPath";

package/src/icons/Settings/index.ts

@@ -0,0 +1 @@
+export { SettingsIcon, SETTINGS_PATH } from "./SettingsIcon";

package/src/icons/Settings/settingsPath.ts

@@ -0,0 +1,3 @@
+/** Settings icon path — 16×16 viewBox. */
+export const SETTINGS_PATH =
+  "M8.00004 10C9.10461 10 10 9.10457 10 8C10 6.89543 9.10461 6 8.00004 6C6.89547 6 6.00004 6.89543 6.00004 8C6.00004 9.10457 6.89547 10 8.00004 10Z M12.4849 9.81818C12.4042 10.001 12.3801 10.2038 12.4158 10.4004C12.4514 10.597 12.5452 10.7784 12.6849 10.9212L12.7213 10.9576C12.834 11.0702 12.9234 11.2038 12.9844 11.351C13.0454 11.4981 13.0768 11.6559 13.0768 11.8152C13.0768 11.9744 13.0454 12.1322 12.9844 12.2793C12.9234 12.4265 12.834 12.5602 12.7213 12.6727C12.6087 12.7854 12.475 12.8748 12.3278 12.9358C12.1807 12.9968 12.023 13.0282 11.8637 13.0282C11.7044 13.0282 11.5467 12.9968 11.3995 12.9358C11.2524 12.8748 11.1187 12.7854 11.0061 12.6727L10.9697 12.6364C10.8269 12.4966 10.6455 12.4029 10.4489 12.3673C10.2523 12.3316 10.0495 12.3557 9.86671 12.4364C9.68745 12.5132 9.53458 12.6408 9.42689 12.8034C9.31921 12.966 9.26142 13.1565 9.26065 13.3515V13.4545C9.26065 13.776 9.13294 14.0843 8.90562 14.3116C8.67831 14.539 8.37 14.6667 8.04853 14.6667C7.72705 14.6667 7.41874 14.539 7.19143 14.3116C6.96411 14.0843 6.8364 13.776 6.8364 13.4545V13.4C6.83171 13.1994 6.76678 13.0048 6.65005 12.8416C6.53331 12.6784 6.37018 12.5541 6.18186 12.4848C5.99906 12.4042 5.79629 12.3801 5.59968 12.4158C5.40308 12.4514 5.22166 12.5451 5.07883 12.6849L5.04246 12.7212C4.92989 12.8339 4.79621 12.9233 4.64906 12.9843C4.50191 13.0453 4.34418 13.0767 4.18489 13.0767C4.0256 13.0767 3.86787 13.0453 3.72072 12.9843C3.57357 12.9233 3.43989 12.8339 3.32731 12.7212C3.21461 12.6086 3.12521 12.475 3.06421 12.3278C3.00321 12.1807 2.97181 12.0229 2.97181 11.8636C2.97181 11.7043 3.00321 11.5466 3.06421 11.3995C3.12521 11.2523 3.21461 11.1186 3.32731 11.0061L3.36368 10.9697C3.5034 10.8269 3.59712 10.6454 3.63277 10.4488C3.66842 10.2522 3.64435 10.0495 3.56368 9.86667C3.48685 9.68741 3.35929 9.53454 3.19669 9.42686C3.03409 9.31917 2.84355 9.26139 2.64853 9.26061H2.5455C2.22402 9.26061 1.91571 9.1329 1.6884 8.90559C1.46108 8.67827 1.33337 8.36996 1.33337 8.04849C1.33337 7.72701 1.46108 7.4187 1.6884 7.19139C1.91571 6.96407 2.22402 6.83637 2.5455 6.83637H2.60004C2.80064 6.83167 2.9952 6.76674 3.1584 6.65001C3.32161 6.53328 3.44593 6.37014 3.51519 6.18182C3.59587 5.99902 3.61993 5.79625 3.58429 5.59965C3.54864 5.40304 3.45491 5.22163 3.31519 5.07879L3.27883 5.04243C3.16613 4.92985 3.07672 4.79617 3.01573 4.64902C2.95473 4.50187 2.92333 4.34414 2.92333 4.18485C2.92333 4.02556 2.95473 3.86783 3.01573 3.72068C3.07672 3.57353 3.16613 3.43985 3.27883 3.32728C3.3914 3.21458 3.52509 3.12517 3.67223 3.06417C3.81938 3.00317 3.97711 2.97178 4.1364 2.97178C4.2957 2.97178 4.45343 3.00317 4.60057 3.06417C4.74772 3.12517 4.88141 3.21458 4.99398 3.32728L5.03034 3.36364C5.17318 3.50336 5.3546 3.59708 5.5512 3.63273C5.7478 3.66838 5.95058 3.64431 6.13337 3.56364H6.18186C6.36111 3.48681 6.51399 3.35925 6.62167 3.19665C6.72935 3.03405 6.78714 2.84351 6.78792 2.64849V2.54546C6.78792 2.22398 6.91562 1.91567 7.14294 1.68836C7.37026 1.46104 7.67857 1.33334 8.00004 1.33334C8.32151 1.33334 8.62982 1.46104 8.85714 1.68836C9.08446 1.91567 9.21216 2.22398 9.21216 2.54546V2.6C9.21294 2.79502 9.27073 2.98556 9.37841 3.14816C9.48609 3.31076 9.63897 3.43833 9.81822 3.51515C10.001 3.59583 10.2038 3.6199 10.4004 3.58425C10.597 3.5486 10.7784 3.45487 10.9213 3.31515L10.9576 3.27879C11.0702 3.16609 11.2039 3.07669 11.351 3.01569C11.4982 2.95469 11.6559 2.92329 11.8152 2.92329C11.9745 2.92329 12.1322 2.95469 12.2794 3.01569C12.4265 3.07669 12.5602 3.16609 12.6728 3.27879C12.7855 3.39136 12.8749 3.52505 12.9359 3.6722C12.9969 3.81935 13.0283 3.97707 13.0283 4.13637C13.0283 4.29566 12.9969 4.45339 12.9359 4.60054C12.8749 4.74769 12.7855 4.88137 12.6728 4.99394L12.6364 5.03031C12.4967 5.17314 12.403 5.35456 12.3673 5.55116C12.3317 5.74776 12.3557 5.95054 12.4364 6.13334V6.18182C12.5132 6.36107 12.6408 6.51395 12.8034 6.62163C12.966 6.72932 13.1565 6.7871 13.3516 6.78788H13.4546C13.7761 6.78788 14.0844 6.91559 14.3117 7.1429C14.539 7.37022 14.6667 7.67853 14.6667 8C14.6667 8.32148 14.539 8.62978 14.3117 8.8571C14.0844 9.08442 13.7761 9.21212 13.4546 9.21212H13.4C13.205 9.2129 13.0145 9.27069 12.8519 9.37837C12.6893 9.48605 12.5617 9.63893 12.4849 9.81818Z";

package/src/icons/Video/VideoIcon.tsx

@@ -0,0 +1,24 @@
+import Svg, { Path } from "react-native-svg";
+import { VIDEO_PATHS } from "./videoPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+export { VIDEO_PATHS } from "./videoPath";
+
+/** Native — react-native-svg (peer dependency). */
+export function VideoIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
+      {VIDEO_PATHS.map((path) => (
+        <Path
+          key={path}
+          d={path}
+          stroke={color}
+          strokeWidth={strokeWidth}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      ))}
+    </Svg>
+  );
+}

package/src/icons/Video/VideoIcon.web.tsx

@@ -0,0 +1,30 @@
+import { VIDEO_PATHS } from "./videoPath";
+import { colors } from "../../theme";
+import type { IconProps } from "../types";
+
+/** Web / Storybook — plain SVG (no react-native-svg). */
+export function VideoIcon({ size = 20, color = colors.primary, strokeWidth = 1.5 }: IconProps) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      viewBox="0 0 16 16"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      aria-hidden
+    >
+      {VIDEO_PATHS.map((path) => (
+        <path
+          key={path}
+          d={path}
+          stroke={color}
+          strokeWidth={strokeWidth}
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+      ))}
+    </svg>
+  );
+}
+
+export { VIDEO_PATHS } from "./videoPath";

package/src/icons/Video/index.ts

@@ -0,0 +1 @@
+export { VideoIcon, VIDEO_PATHS } from "./VideoIcon";

package/src/icons/Video/videoPath.ts

@@ -0,0 +1,5 @@
+/** Video icon paths — 16×16 viewBox. */
+export const VIDEO_PATHS = [
+  "M14.6667 5.95424C14.6667 5.55036 14.6667 5.34843 14.5868 5.25492C14.5175 5.17378 14.4136 5.13072 14.3072 5.13909C14.1846 5.14874 14.0418 5.29153 13.7563 5.57712L11.3334 7.99999L13.7563 10.4229C14.0418 10.7085 14.1846 10.8512 14.3072 10.8609C14.4136 10.8693 14.5175 10.8262 14.5868 10.7451C14.6667 10.6516 14.6667 10.4496 14.6667 10.0457V5.95424Z",
+  "M1.33337 6.53333C1.33337 5.41322 1.33337 4.85317 1.55136 4.42535C1.74311 4.04902 2.04907 3.74306 2.42539 3.55132C2.85322 3.33333 3.41327 3.33333 4.53337 3.33333H8.13337C9.25348 3.33333 9.81353 3.33333 10.2414 3.55132C10.6177 3.74306 10.9236 4.04902 11.1154 4.42535C11.3334 4.85317 11.3334 5.41322 11.3334 6.53333V9.46666C11.3334 10.5868 11.3334 11.1468 11.1154 11.5746C10.9236 11.951 10.6177 12.2569 10.2414 12.4487C9.81353 12.6667 9.25348 12.6667 8.13337 12.6667H4.53337C3.41327 12.6667 2.85322 12.6667 2.42539 12.4487C2.04907 12.2569 1.74311 11.951 1.55136 11.5746C1.33337 11.1468 1.33337 10.5868 1.33337 9.46666V6.53333Z",
+] as const;

package/src/icons/index.ts

@@ -9,19 +9,28 @@ export { ArrowRightIcon } from "./ArrowRight";
 export { BagIcon } from "./Bag";
 export { BellIcon } from "./Bell";
 export { BuildingIcon } from "./Building";
+export { CalendarIcon } from "./Calendar";
+export { CalendarOutlineIcon } from "./CalendarOutline";
 export { CameraIcon } from "./Camera";
 export { CheckIcon } from "./Check";
 export { CheckBadgeIcon } from "./CheckBadge";
 export { ChevronDownIcon } from "./ChevronDown";
+export { ChevronLeftIcon } from "./ChevronLeft";
 export { ClockIcon } from "./Clock";
 export { FacebookIcon } from "./Facebook";
+export { HeartIcon } from "./Heart";
+export { HelpCircleIcon } from "./HelpCircle";
 export { HomeIcon } from "./Home";
 export { InstagramIcon } from "./Instagram";
 export { KeyIcon } from "./Key";
+export { LayoutGridIcon } from "./LayoutGrid";
 export { LinkedInIcon } from "./LinkedIn";
+export { LogOutIcon } from "./LogOut";
 export { MailIcon } from "./Mail";
 export { NavigateIcon } from "./Navigate";
 export { PhoneIcon } from "./Phone";
 export { SearchIcon } from "./Search";
+export { SettingsIcon } from "./Settings";
 export { ShowIcon } from "./Show";
 export { UserIcon } from "./User";
+export { VideoIcon } from "./Video";