@coopdigital/react 0.16.0 → 0.17.0

package/dist/components/Icon/AddIcon.d.ts

@@ -0,0 +1 @@
+export declare const AddIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ArrowDownIcon.d.ts

@@ -0,0 +1 @@
+export declare const ArrowDownIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ArrowLeftIcon.d.ts

@@ -0,0 +1 @@
+export declare const ArrowLeftIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ArrowRightIcon.d.ts

@@ -0,0 +1 @@
+export declare const ArrowRightIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ArrowUpIcon.d.ts

@@ -0,0 +1 @@
+export declare const ArrowUpIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/AvatarAltIcon.d.ts

@@ -0,0 +1 @@
+export declare const AvatarAltIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/AvatarIcon.d.ts

@@ -0,0 +1 @@
+export declare const AvatarIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/BasketIcon.d.ts

@@ -0,0 +1 @@
+export declare const BasketIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CalendarIcon.d.ts

@@ -0,0 +1 @@
+export declare const CalendarIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ChevronDownIcon.d.ts

@@ -0,0 +1 @@
+export declare const ChevronDownIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ChevronLeftIcon.d.ts

@@ -0,0 +1 @@
+export declare const ChevronLeftIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ChevronRightIcon.d.ts

@@ -0,0 +1 @@
+export declare const ChevronRightIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ChevronUpIcon.d.ts

@@ -0,0 +1 @@
+export declare const ChevronUpIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ClockIcon.d.ts

@@ -0,0 +1 @@
+export declare const ClockIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CloseAltIcon.d.ts

@@ -0,0 +1 @@
+export declare const CloseAltIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CloseIcon.d.ts

@@ -0,0 +1 @@
+export declare const CloseIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CoopCardIcon.d.ts

@@ -0,0 +1 @@
+export declare const CoopCardIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CoopIcon.d.ts

@@ -0,0 +1 @@
+export declare const CoopIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/CoopLocationIcon.d.ts

@@ -0,0 +1 @@
+export declare const CoopLocationIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/DownloadIcon.d.ts

@@ -0,0 +1 @@
+export declare const DownloadIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/HomeIcon.d.ts

@@ -0,0 +1 @@
+export declare const HomeIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/InformationIcon.d.ts

@@ -0,0 +1 @@
+export declare const InformationIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/LocationIcon.d.ts

@@ -0,0 +1 @@
+export declare const LocationIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/MailIcon.d.ts

@@ -0,0 +1 @@
+export declare const MailIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/MenuIcon.d.ts

@@ -0,0 +1 @@
+export declare const MenuIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/MessageIcon.d.ts

@@ -0,0 +1 @@
+export declare const MessageIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/MinusIcon.d.ts

@@ -0,0 +1 @@
+export declare const MinusIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/OpenNewIcon.d.ts

@@ -0,0 +1 @@
+export declare const OpenNewIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/PencilIcon.d.ts

@@ -0,0 +1 @@
+export declare const PencilIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/PhoneIcon.d.ts

@@ -0,0 +1 @@
+export declare const PhoneIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/QuestionIcon.d.ts

@@ -0,0 +1 @@
+export declare const QuestionIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/ScooterIcon.d.ts

@@ -0,0 +1 @@
+export declare const ScooterIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/SearchIcon.d.ts

@@ -0,0 +1 @@
+export declare const SearchIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/SettingsIcon.d.ts

@@ -0,0 +1 @@
+export declare const SettingsIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/TickAltIcon.d.ts

@@ -0,0 +1 @@
+export declare const TickAltIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/TickIcon.d.ts

@@ -0,0 +1 @@
+export declare const TickIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/VanIcon.d.ts

@@ -0,0 +1 @@
+export declare const VanIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/WarningIcon.d.ts

@@ -0,0 +1 @@
+export declare const WarningIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/WriteIcon.d.ts

@@ -0,0 +1 @@
+export declare const WriteIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/index.d.ts

@@ -1,13 +1,39 @@
-import { type SVGProps } from "react";
-export interface IconProps extends SVGProps<SVGSVGElement> {
-    /** **(Optional)** Alt text for the Icon. Will be rendered in a title tag in the SVG. */
-    alt?: string;
-    /** **(Optional)** Additional class names to forward to the Icon. */
-    className?: string;
-    /** The name of the icon to render. See the readme for how to add new icons. */
-    icon?: IconName;
-}
-export declare const Icon: ({ alt, className, icon, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export default Icon;
-export declare const iconNames: readonly ["arrow-right", "chevron", "search"];
-export type IconName = (typeof iconNames)[number];
+export { AddIcon } from "./AddIcon";
+export { ArrowDownIcon } from "./ArrowDownIcon";
+export { ArrowLeftIcon } from "./ArrowLeftIcon";
+export { ArrowRightIcon } from "./ArrowRightIcon";
+export { ArrowUpIcon } from "./ArrowUpIcon";
+export { AvatarAltIcon } from "./AvatarAltIcon";
+export { AvatarIcon } from "./AvatarIcon";
+export { BasketIcon } from "./BasketIcon";
+export { CalendarIcon } from "./CalendarIcon";
+export { ChevronDownIcon } from "./ChevronDownIcon";
+export { ChevronLeftIcon } from "./ChevronLeftIcon";
+export { ChevronRightIcon } from "./ChevronRightIcon";
+export { ChevronUpIcon } from "./ChevronUpIcon";
+export { ClockIcon } from "./ClockIcon";
+export { CloseAltIcon } from "./CloseAltIcon";
+export { CloseIcon } from "./CloseIcon";
+export { CoopCardIcon } from "./CoopCardIcon";
+export { CoopIcon } from "./CoopIcon";
+export { CoopLocationIcon } from "./CoopLocationIcon";
+export { DownloadIcon } from "./DownloadIcon";
+export { HomeIcon } from "./HomeIcon";
+export { InformationIcon } from "./InformationIcon";
+export { LocationIcon } from "./LocationIcon";
+export { MailIcon } from "./MailIcon";
+export { MenuIcon } from "./MenuIcon";
+export { MessageIcon } from "./MessageIcon";
+export { MinusIcon } from "./MinusIcon";
+export { OpenNewIcon } from "./OpenNewIcon";
+export { PencilIcon } from "./PencilIcon";
+export { PhoneIcon } from "./PhoneIcon";
+export { QuestionIcon } from "./QuestionIcon";
+export { ScooterIcon } from "./ScooterIcon";
+export { SearchIcon } from "./SearchIcon";
+export { SettingsIcon } from "./SettingsIcon";
+export { TickAltIcon } from "./TickAltIcon";
+export { TickIcon } from "./TickIcon";
+export { VanIcon } from "./VanIcon";
+export { WarningIcon } from "./WarningIcon";
+export { WriteIcon } from "./WriteIcon";

package/dist/components/RootSVG/RootSVG.d.ts

@@ -1,3 +1,2 @@
-import { JSX } from "react";
-export declare const RootSVG: () => JSX.Element;
+export declare const RootSVG: () => import("react/jsx-runtime").JSX.Element;
 export default RootSVG;

package/dist/components/RootSVG/RootSVG.js

@@ -1,7 +1,7 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsx } from 'react/jsx-runtime';
 
 const RootSVG = () => {
-    return (jsxs("svg", { height: "0", width: "0", xmlns: "http://www.w3.org/2000/svg", children: [jsx("symbol", { fill: "currentColor", id: "arrow-right", viewBox: "0 0 22 20", children: jsx("path", { clipRule: "evenodd", d: "M11.127 1.65a.9.9 0 0 1 1.246-1.3l8.812 8.46a1.65 1.65 0 0 1 0 2.38l-8.812 8.46a.9.9 0 0 1-1.246-1.3l7.76-7.45H1.25a.9.9 0 1 1 0-1.8h17.638z", fill: "currentColor", fillRule: "evenodd" }) }), jsx("symbol", { id: "chevron", viewBox: "0 0 16 29", children: jsx("path", { d: "M2 28.1a1.6 1.6 0 0 1-1.2-2.7l11-10.9-11-11a1.6 1.6 0 1 1 2.2-2l12 12a1.6 1.6 0 0 1 0 2.2l-12 12c-.3.4-.7.5-1 .5z" }) }), jsx("symbol", { fill: "currentColor", id: "search", viewBox: "0 0 24 24", children: jsx("path", { clipRule: "evenodd", d: "M4.65 10.5a5.85 5.85 0 1 1 11.7 0 5.85 5.85 0 0 1-11.7 0m5.85-7.65a7.65 7.65 0 1 0 4.736 13.658l4.378 4.378a.9.9 0 1 0 1.273-1.273l-4.378-4.378A7.65 7.65 0 0 0 10.5 2.85", fill: "currentColor", fillRule: "evenodd" }) }), jsx("defs", { children: jsx("clipPath", { clipPathUnits: "objectBoundingBox", id: "squircle", children: jsx("path", { d: "M0,0.5 C0,0.165,0.165,0,0.5,0 S1,0.165,1,0.5 S0.835,1,0.5,1 S0,0.835,0,0.5" }) }) })] }));
+    return (jsx("svg", { height: "0", width: "0", xmlns: "http://www.w3.org/2000/svg", children: jsx("defs", { children: jsx("clipPath", { clipPathUnits: "objectBoundingBox", id: "squircle", children: jsx("path", { d: "M0,0.5 C0,0.165,0.165,0,0.5,0 S1,0.165,1,0.5 S0.835,1,0.5,1 S0,0.835,0,0.5" }) }) }) }));
 };
 
 export { RootSVG, RootSVG as default };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@coopdigital/react",
   "type": "module",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "private": false,
   "publishConfig": {
     "access": "public"
@@ -44,7 +44,7 @@
   "description": "",
   "devDependencies": {
     "@axe-core/playwright": "^4.10.1",
-    "@coopdigital/styles": "^0.15.0",
+    "@coopdigital/styles": "^0.15.1",
     "@playwright/test": "^1.51.1",
     "@storybook/addon-a11y": "^8.6.12",
     "@storybook/addon-essentials": "^8.6.12",
@@ -66,5 +66,5 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
-  "gitHead": "802023453505543e6b360e7e390bed6f983abf1a"
+  "gitHead": "4a24650f72c010d21c1fccac53e6de59ec7c3e6e"
 }

package/src/components/Icon/AddIcon.tsx

@@ -0,0 +1,14 @@
+export const AddIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M24.7 16.72a1 1 0 0 1-.7.28H8a1 1 0 1 1 0-2h16a1 1 0 0 1 1 1 1 1 0 0 1-.3.72"
+        fill="currentColor"
+      />
+      <path
+        d="M16.72 24.7a1 1 0 0 1-.72.3 1 1 0 0 1-1-1V8a1 1 0 0 1 2 0v16a1 1 0 0 1-.28.7"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ArrowDownIcon.tsx

@@ -0,0 +1,11 @@
+export const ArrowDownIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path d="M15 28.66V3a1 1 0 0 1 2 0v25.66a1 1 0 0 1-2 0" fill="currentColor" />
+      <path
+        d="M3 17a1 1 0 0 1 .29-.71 1 1 0 0 1 1.42 0L16 27.58l11.29-11.29a1 1 0 0 1 1.42 0 1 1 0 0 1 0 1.41l-12 12a1 1 0 0 1-1.41 0l-12-12A1 1 0 0 1 3 17"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ArrowLeftIcon.tsx

@@ -0,0 +1,11 @@
+export const ArrowLeftIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path d="M3.34 17H29a1 1 0 0 0 0-2H3.34a1 1 0 0 0 0 2" fill="currentColor" />
+      <path
+        d="M15 29a1 1 0 0 0 .71-.29 1 1 0 0 0 0-1.42L5.12 16.71a1 1 0 0 1 0-1.42L15.71 4.71a1 1 0 0 0 0-1.42 1 1 0 0 0-1.41 0l-12 12a1 1 0 0 0 0 1.42l12 12a1 1 0 0 0 .7.29"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ArrowRightIcon.tsx

@@ -0,0 +1,11 @@
+export const ArrowRightIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path d="M28.7 15H3a1 1 0 0 0 0 2h25.7a1 1 0 0 0 0-2" fill="currentColor" />
+      <path
+        d="M17 3a1 1 0 0 0-.7.3 1 1 0 0 0 0 1.4l10.6 10.6a1 1 0 0 1 0 1.4L16.3 27.3a1 1 0 0 0 0 1.4 1 1 0 0 0 1.4 0l12-12a1 1 0 0 0 0-1.4l-12-12A1 1 0 0 0 17 3"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ArrowUpIcon.tsx

@@ -0,0 +1,11 @@
+export const ArrowUpIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path d="M17 3.34V29a1 1 0 0 1-2 0V3.34a1 1 0 0 1 2 0" fill="currentColor" />
+      <path
+        d="M29 15a1 1 0 0 1-.29.71 1 1 0 0 1-1.42 0L16 4.42 4.71 15.71a1 1 0 0 1-1.42 0 1 1 0 0 1 0-1.41l12-12a1 1 0 0 1 1.41 0l12 12a1 1 0 0 1 .3.7"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/AvatarAltIcon.tsx

@@ -0,0 +1,18 @@
+export const AvatarAltIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M16 32a16 16 0 1 1 16-16 16 16 0 0 1-16 16m0-30a14 14 0 1 0 14 14A14 14 0 0 0 16 2"
+        fill="currentColor"
+      />
+      <path
+        d="M16 8a5 5 0 1 1-5 5 5 5 0 0 1 5-5m0-2a7 7 0 1 0 7 7 7 7 0 0 0-7-7"
+        fill="currentColor"
+      />
+      <path
+        d="M5.64 27.85a.7.7 0 0 1-.19 0 1 1 0 0 1-.79-1.17A10.7 10.7 0 0 1 15.16 18h1.68a10.7 10.7 0 0 1 10.5 8.67 1 1 0 0 1-.79 1.17 1 1 0 0 1-1.17-.84 8.72 8.72 0 0 0-8.54-7h-1.68a8.72 8.72 0 0 0-8.54 7 1 1 0 0 1-.98.85"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/AvatarIcon.tsx

@@ -0,0 +1,14 @@
+export const AvatarIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M16 31a18.24 18.24 0 0 1-12.64-5.1A1.19 1.19 0 0 1 3 24.86a12.31 12.31 0 0 1 12-10h2a12.31 12.31 0 0 1 12 10 1.19 1.19 0 0 1-.34 1.06A18.24 18.24 0 0 1 16 31M5.42 24.68a15.9 15.9 0 0 0 21.16 0A10 10 0 0 0 17 17.17h-2a10 10 0 0 0-9.58 7.51"
+        fill="currentColor"
+      />
+      <path
+        d="M15.94 3.33a5.77 5.77 0 1 1-5.72 5.77 5.75 5.75 0 0 1 5.72-5.77m0-2.31a8.08 8.08 0 1 0 8 8.08 8 8 0 0 0-8-8.08"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/BasketIcon.tsx

@@ -0,0 +1,14 @@
+export const BasketIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M16.07 26a1 1 0 0 0 1-1v-4.08a1 1 0 1 0-2 0V25a1 1 0 0 0 1 1M21.5 26h.17a1 1 0 0 0 1-.85l.68-4.07a1 1 0 0 0-.82-1.18 1 1 0 0 0-1.16.84l-.67 4.07a1 1 0 0 0 .8 1.19M10.43 26h.17a1 1 0 0 0 .82-1.18l-.68-4.07a1 1 0 0 0-1.15-.84 1 1 0 0 0-.82 1.18l.67 4.07a1 1 0 0 0 .99.84"
+        fill="currentColor"
+      />
+      <path
+        d="M31 10.7h-3.11l-8.25-8.4a1 1 0 0 0-1.41 0 1 1 0 0 0 0 1.44l6.83 7H6.85l6.8-6.93a1 1 0 0 0 0-1.44 1 1 0 0 0-1.42 0l-8.14 8.25a1 1 0 0 0 0 .08H1a1 1 0 0 0-1 1v5.1a1 1 0 0 0 1 1h1.23l1.88 11.36a1 1 0 0 0 1 .84H27a1 1 0 0 0 1-.84l1.88-11.34H31a1 1 0 0 0 1-1v-5.1a1 1 0 0 0-1-1.02M26.15 28H5.94L4.28 18h23.53ZM30 15.79H2v-3.06h28Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/CalendarIcon.tsx

@@ -0,0 +1,14 @@
+export const CalendarIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M31 2h-4V1a1 1 0 0 0-2 0v1H7V1a1 1 0 0 0-2 0v1H1a1 1 0 0 0-1 1v28a1 1 0 0 0 1 1h30a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1m-1 28H2V10h28Zm0-22H2V4h3v1a1 1 0 0 0 2 0V4h18v1a1 1 0 0 0 2 0V4h3Z"
+        fill="currentColor"
+      />
+      <path
+        d="M6 23v2a1 1 0 0 0 2 0v-1h7v1a1 1 0 0 0 2 0v-1h7v1a1 1 0 0 0 2 0V15a1 1 0 0 0-2 0v1h-7v-1a1 1 0 0 0-2 0v1H8v-1a1 1 0 0 0-2 0v8m18-1h-7v-4h7Zm-9-4v4H8v-4Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ChevronDownIcon.tsx

@@ -0,0 +1,10 @@
+export const ChevronDownIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M31 9a1 1 0 0 0-.29-.71 1 1 0 0 0-1.42 0L16 21.59 2.71 8.3a1 1 0 0 0-1.42 0 1 1 0 0 0 0 1.41l14 14a1 1 0 0 0 1.41 0l14-14A1 1 0 0 0 31 9"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ChevronLeftIcon.tsx

@@ -0,0 +1,10 @@
+export const ChevronLeftIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M22.5 30a1 1 0 0 0 .71-.29 1 1 0 0 0 0-1.42L10.91 16 23.2 3.71a1 1 0 0 0 0-1.41 1 1 0 0 0-1.41 0l-13 13a1 1 0 0 0 0 1.41l13 13a1 1 0 0 0 .71.29"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ChevronRightIcon.tsx

@@ -0,0 +1,10 @@
+export const ChevronRightIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M9.49 2a1 1 0 0 0-.71 1.71L21.07 16 8.79 28.3a1 1 0 1 0 1.41 1.41l13-13a1 1 0 0 0 0-1.42l-13-13A1 1 0 0 0 9.49 2"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ChevronUpIcon.tsx

@@ -0,0 +1,10 @@
+export const ChevronUpIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M1 23a1 1 0 0 0 .29.71 1 1 0 0 0 1.42 0L16 10.41 29.29 23.7a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.41l-14-14a1 1 0 0 0-1.41 0l-14 14A1 1 0 0 0 1 23"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ClockIcon.tsx

@@ -0,0 +1,14 @@
+export const ClockIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M23 21.05a.93.93 0 0 1-.5-.14L15 16.58v-9.5a1 1 0 0 1 1-1 1 1 0 0 1 1 1v8.35l6.47 3.77a1 1 0 0 1 .36 1.36 1 1 0 0 1-.83.49"
+        fill="currentColor"
+      />
+      <path
+        d="M16 2A14 14 0 1 1 2 16 14 14 0 0 1 16 2m0-2a16 16 0 1 0 16 16A16 16 0 0 0 16 0"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/CloseAltIcon.tsx

@@ -0,0 +1,18 @@
+export const CloseAltIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M21.55 22.51a1 1 0 0 1-.7-.3l-11-11a1 1 0 0 1 1.41-1.41l11 11a1 1 0 0 1 0 1.41 1 1 0 0 1-.71.3"
+        fill="currentColor"
+      />
+      <path
+        d="M10.55 22.51a1 1 0 0 1-.7-.3 1 1 0 0 1 0-1.41l11-11a1 1 0 0 1 1.41 1.41l-11 11a1 1 0 0 1-.71.3"
+        fill="currentColor"
+      />
+      <path
+        d="M16 2A14 14 0 1 1 2 16 14 14 0 0 1 16 2m0-2a16 16 0 1 0 16 16A16 16 0 0 0 16 0"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/CloseIcon.tsx

@@ -0,0 +1,14 @@
+export const CloseIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M27 28a1 1 0 0 1-.71-.29l-22-22a1 1 0 0 1 1.42-1.42l22 22a1 1 0 0 1 0 1.42A1 1 0 0 1 27 28"
+        fill="currentColor"
+      />
+      <path
+        d="M5 28a1 1 0 0 1-.71-.29 1 1 0 0 1 0-1.42l22-22a1 1 0 1 1 1.42 1.42l-22 22A1 1 0 0 1 5 28"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/CoopCardIcon.tsx

@@ -0,0 +1,10 @@
+export const CoopCardIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M6.67 0a1.34 1.34 0 0 0-1.34 1.33v29.34A1.34 1.34 0 0 0 6.67 32h18.66a1.34 1.34 0 0 0 1.34-1.33V1.33A1.34 1.34 0 0 0 25.33 0ZM23 4.77a6.4 6.4 0 0 1 .21 1.62A6.8 6.8 0 0 1 22.94 8a2.1 2.1 0 0 1-.48.85 2.3 2.3 0 0 1-.82.55 6.3 6.3 0 0 1-1.93.31 5.3 5.3 0 0 1-1.94-.31 2.2 2.2 0 0 1-.8-.55 2.3 2.3 0 0 1-.49-.85 5.94 5.94 0 0 1 0-3.24 2.2 2.2 0 0 1 .52-.84 2.1 2.1 0 0 1 .82-.54 5.84 5.84 0 0 1 3.87 0 2.24 2.24 0 0 1 .81.55 2.3 2.3 0 0 1 .5.84m-2 2.4a2.5 2.5 0 0 0 .12-.78 2.4 2.4 0 0 0-.13-.8 1 1 0 0 0-.28-.45 1.15 1.15 0 0 0-.47-.23 2.8 2.8 0 0 0-1 0 1 1 0 0 0-.47.24.9.9 0 0 0-.29.44 2.66 2.66 0 0 0 0 1.58 1 1 0 0 0 .28.45 1.1 1.1 0 0 0 .48.23 2.8 2.8 0 0 0 1 0 1.1 1.1 0 0 0 .47-.24 1 1 0 0 0 .23-.44Zm-5.5 4.75a5.9 5.9 0 0 1 0 3.23 2.07 2.07 0 0 1-1.3 1.4 5.84 5.84 0 0 1-3.87 0 2.16 2.16 0 0 1-.81-.55 2.1 2.1 0 0 1-.52-.85 5.9 5.9 0 0 1 0-3.23 2.1 2.1 0 0 1 .48-.85 2.16 2.16 0 0 1 .82-.55 5.84 5.84 0 0 1 3.87 0 2.19 2.19 0 0 1 1.3 1.4Zm-2 2.41a2.5 2.5 0 0 0 .12-.77 2.7 2.7 0 0 0-.12-.8 1 1 0 0 0-.28-.45 1 1 0 0 0-.48-.23 2.8 2.8 0 0 0-1 0 1 1 0 0 0-.47.24 1 1 0 0 0-.28.44 2.63 2.63 0 0 0 0 1.57.9.9 0 0 0 .28.45 1 1 0 0 0 .47.23 2.8 2.8 0 0 0 1 0 1 1 0 0 0 .47-.23 1 1 0 0 0 .29-.45m2.22-8h-2.1a3.3 3.3 0 0 0-.1-.78 1 1 0 0 0-.29-.45 1.1 1.1 0 0 0-.47-.23 2.8 2.8 0 0 0-1 0 1.05 1.05 0 0 0-.47.24 1.1 1.1 0 0 0-.29.44 2.66 2.66 0 0 0 0 1.58 1 1 0 0 0 .28.45 1.1 1.1 0 0 0 .48.23 2.8 2.8 0 0 0 1 0 1.1 1.1 0 0 0 .47-.24 1.1 1.1 0 0 0 .29-.44 2.3 2.3 0 0 0 .07-.36l2 .92a3 3 0 0 0-.09.31 2.1 2.1 0 0 1-.49.85 2.16 2.16 0 0 1-.81.55 6.4 6.4 0 0 1-1.94.31 5.7 5.7 0 0 1-1.93-.31 2.1 2.1 0 0 1-.8-.55A2.16 2.16 0 0 1 9 8a5.94 5.94 0 0 1 0-3.23 2.06 2.06 0 0 1 .48-.85 2 2 0 0 1 .82-.54 5.84 5.84 0 0 1 3.87 0 2.2 2.2 0 0 1 .8.55 2 2 0 0 1 .49.84 6.7 6.7 0 0 1 .26 1.6Zm.5 7.18a6.2 6.2 0 0 1 .21-1.61 2.06 2.06 0 0 1 .51-.85 2 2 0 0 1 .85-.5 5.84 5.84 0 0 1 3.87 0 2.16 2.16 0 0 1 .81.55 2.1 2.1 0 0 1 .53.9 5.9 5.9 0 0 1 0 3.23 2.1 2.1 0 0 1-.48.85 2.16 2.16 0 0 1-.82.55 6.7 6.7 0 0 1-1.93.32L19 15h.2a2.8 2.8 0 0 0 1 0 1 1 0 0 0 .46-.24 1.05 1.05 0 0 0 .27-.44 2.66 2.66 0 0 0 0-1.58 1 1 0 0 0-.28-.44 1 1 0 0 0-.47-.23 2.4 2.4 0 0 0-1 0 .9.9 0 0 0-.47.23.9.9 0 0 0-.29.44 2.3 2.3 0 0 0-.11.78v4.73h-2.1Z"
+        fillRule="evenodd"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/CoopIcon.tsx

@@ -0,0 +1,10 @@
+export const CoopIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M28.77 5.17a11.33 11.33 0 0 1 0 5.93 4 4 0 0 1-.88 1.57 4.1 4.1 0 0 1-1.5 1 12 12 0 0 1-3.56.58 9.8 9.8 0 0 1-3.56-.58 4.2 4.2 0 0 1-1.47-1 4.1 4.1 0 0 1-.9-1.55 10.9 10.9 0 0 1 0-5.94 3.8 3.8 0 0 1 .89-1.56 3.8 3.8 0 0 1 1.49-1 10.73 10.73 0 0 1 7.12 0 3.9 3.9 0 0 1 1.48 1 3.9 3.9 0 0 1 .89 1.55m-3.67 4.4a4.9 4.9 0 0 0 .21-1.43 4.9 4.9 0 0 0-.23-1.47 1.8 1.8 0 0 0-.53-.82 1.77 1.77 0 0 0-.87-.42 5.1 5.1 0 0 0-1.83 0 2 2 0 0 0-.87.43 1.9 1.9 0 0 0-.53.81 4.94 4.94 0 0 0 0 2.9 1.86 1.86 0 0 0 .52.82 1.8 1.8 0 0 0 .88.43 5.1 5.1 0 0 0 1.83 0 1.88 1.88 0 0 0 1.4-1.25Zm-10 8.73a10.9 10.9 0 0 1 0 5.94 3.75 3.75 0 0 1-.88 1.58 3.8 3.8 0 0 1-1.5 1 10.7 10.7 0 0 1-7.11 0 4 4 0 0 1-1.49-1 4.1 4.1 0 0 1-.9-1.56 10.9 10.9 0 0 1 0-5.94 3.9 3.9 0 0 1 .89-1.57 3.8 3.8 0 0 1 1.5-1 10.7 10.7 0 0 1 7.11 0 4 4 0 0 1 1.48 1 3.9 3.9 0 0 1 .88 1.55Zm-3.66 4.44a5 5 0 0 0 .22-1.43 5.2 5.2 0 0 0-.22-1.47 1.9 1.9 0 0 0-.54-.84 1.8 1.8 0 0 0-.88-.43 5.6 5.6 0 0 0-1.83 0 2 2 0 0 0-.87.44 1.9 1.9 0 0 0-.52.81 4.8 4.8 0 0 0 0 2.9 1.7 1.7 0 0 0 .52.82 1.65 1.65 0 0 0 .87.42A4.7 4.7 0 0 0 10 24a1.83 1.83 0 0 0 .87-.43 2 2 0 0 0 .55-.83Zm4.05-14.63h-3.85a6.3 6.3 0 0 0-.19-1.43 1.8 1.8 0 0 0-.52-.82 1.8 1.8 0 0 0-.88-.42 5.1 5.1 0 0 0-1.83 0 1.93 1.93 0 0 0-.87.43 1.9 1.9 0 0 0-.53.81 4.94 4.94 0 0 0 0 2.9 1.86 1.86 0 0 0 .52.82 1.8 1.8 0 0 0 .88.43 5.1 5.1 0 0 0 1.83 0 2 2 0 0 0 .87-.44 2 2 0 0 0 .53-.81 4.5 4.5 0 0 0 .14-.66l3.63 1.69c-.05.16-.1.33-.14.5a4 4 0 0 1-.88 1.57 4.1 4.1 0 0 1-1.5 1 12 12 0 0 1-3.56.58 10.7 10.7 0 0 1-3.55-.58 4.2 4.2 0 0 1-1.48-1 4 4 0 0 1-.89-1.55 10.9 10.9 0 0 1 0-5.94A3.9 3.9 0 0 1 4.1 3.6a4 4 0 0 1 1.5-1 10.7 10.7 0 0 1 7.11 0 3.9 3.9 0 0 1 1.49 1 4 4 0 0 1 .9 1.55 11.3 11.3 0 0 1 .39 2.96m.93 13.19a11 11 0 0 1 .39-3 3.6 3.6 0 0 1 .93-1.55 3.7 3.7 0 0 1 1.56-.92 10.7 10.7 0 0 1 7.11 0 3.9 3.9 0 0 1 1.49 1 4 4 0 0 1 .9 1.55 10.93 10.93 0 0 1 0 5.95 3.8 3.8 0 0 1-.89 1.56 3.74 3.74 0 0 1-1.5 1 11.5 11.5 0 0 1-3.55.59l-1.32-3.59h.15l.21.06a5.2 5.2 0 0 0 1.84 0 1.84 1.84 0 0 0 .84-.44 1.9 1.9 0 0 0 .52-.8 4.94 4.94 0 0 0 0-2.9 1.83 1.83 0 0 0-1.4-1.25 5.1 5.1 0 0 0-1.83 0A2 2 0 0 0 21 19a1.9 1.9 0 0 0-.53.81 4.6 4.6 0 0 0-.2 1.42V30h-3.85Z"
+        fillRule="evenodd"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/CoopLocationIcon.tsx

@@ -0,0 +1,18 @@
+export const CoopLocationIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M20.48 6.51a2.4 2.4 0 0 0-.54 0 2.3 2.3 0 0 0-.53 0 1 1 0 0 0-.8.71 2.75 2.75 0 0 0 0 1.67 1.07 1.07 0 0 0 .8.71 3 3 0 0 0 .53.05 3.3 3.3 0 0 0 .54-.05 1.07 1.07 0 0 0 .8-.71 3 3 0 0 0 0-1.67 1 1 0 0 0-.8-.71"
+        fill="currentColor"
+      />
+      <path
+        d="M16 0C13 0 3-.25 3 11c0 13.71 12 21 13 21s13-7.29 13-21C29-.25 19 0 16 0m-.5 17.36a2.25 2.25 0 0 1-1.39 1.49 6.2 6.2 0 0 1-4.11 0 2.27 2.27 0 0 1-1.39-1.49 6.2 6.2 0 0 1 0-3.42A2.27 2.27 0 0 1 10 12.45a6.2 6.2 0 0 1 2.06-.35 6.3 6.3 0 0 1 2.06.35 2.26 2.26 0 0 1 1.38 1.49 6.2 6.2 0 0 1 0 3.42M13.52 8a3.2 3.2 0 0 0-.13-.82 1 1 0 0 0-.8-.71 2.3 2.3 0 0 0-.53 0 2.5 2.5 0 0 0-.54 0 1.05 1.05 0 0 0-.8.71 3 3 0 0 0 0 1.67 1.09 1.09 0 0 0 .8.71 3.3 3.3 0 0 0 .54.05 3 3 0 0 0 .53-.05 1.07 1.07 0 0 0 .8-.71 3 3 0 0 0 .09-.39l2.1 1c0 .09-.05.19-.08.28a2.26 2.26 0 0 1-1.38 1.49 6.1 6.1 0 0 1-2.06.35 6 6 0 0 1-2.06-.33 2.27 2.27 0 0 1-1.39-1.49 6.2 6.2 0 0 1 0-3.42A2.29 2.29 0 0 1 10 4.85a6.2 6.2 0 0 1 2.06-.35 6.3 6.3 0 0 1 2.06.35 2.28 2.28 0 0 1 1.38 1.49A6 6 0 0 1 15.74 8Zm9.87 9.32A2.27 2.27 0 0 1 22 18.85a6.2 6.2 0 0 1-2 .35l-.75-2.07.21.07a3 3 0 0 0 .53.05 3.3 3.3 0 0 0 .54-.05 1.09 1.09 0 0 0 .8-.71 3 3 0 0 0 0-1.67 1 1 0 0 0-.8-.71 2.4 2.4 0 0 0-.54-.06 2.3 2.3 0 0 0-.53.06 1 1 0 0 0-.8.71 2.9 2.9 0 0 0-.13.83v5h-2.27v-5a6.2 6.2 0 0 1 .24-1.71 2.25 2.25 0 0 1 1.39-1.49 6.2 6.2 0 0 1 4.11 0 2.27 2.27 0 0 1 1.39 1.49 6.2 6.2 0 0 1 0 3.42Zm0-7.6A2.26 2.26 0 0 1 22 11.25a6.1 6.1 0 0 1-2 .35 6 6 0 0 1-2.06-.35 2.25 2.25 0 0 1-1.44-1.49 6.2 6.2 0 0 1 0-3.42 2.27 2.27 0 0 1 1.39-1.49 6.2 6.2 0 0 1 4.11 0 2.29 2.29 0 0 1 1.39 1.49 6.2 6.2 0 0 1 0 3.42Z"
+        fill="currentColor"
+      />
+      <path
+        d="M12.59 14.11a2.3 2.3 0 0 0-.53 0 2.5 2.5 0 0 0-.54 0 1.05 1.05 0 0 0-.8.71 3 3 0 0 0 0 1.67 1.07 1.07 0 0 0 .8.71 3.3 3.3 0 0 0 .54.05 3 3 0 0 0 .53-.05 1.07 1.07 0 0 0 .8-.71 2.75 2.75 0 0 0 0-1.67 1 1 0 0 0-.8-.71"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/DownloadIcon.tsx

@@ -0,0 +1,15 @@
+export const DownloadIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path d="M16 22.56a1 1 0 0 1-1-1V1a1 1 0 0 1 2 0v20.56a1 1 0 0 1-1 1" fill="currentColor" />
+      <path
+        d="M16 23a1 1 0 0 1-.7-.3l-9.76-9.77A1 1 0 0 1 7 11.52l9 9 9-9a1 1 0 0 1 1.41 0 1 1 0 0 1 0 1.42l-9.73 9.72A1 1 0 0 1 16 23"
+        fill="currentColor"
+      />
+      <path
+        d="M30 32H2a2 2 0 0 1-2-2v-7.49a1 1 0 0 1 2 0V30h28v-7.49a1 1 0 0 1 2 0V30a2 2 0 0 1-2 2"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/HomeIcon.tsx

@@ -0,0 +1,18 @@
+export const HomeIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M29 31H3a1 1 0 0 1-1-1V15a1 1 0 0 1 2 0v14h24V15a1 1 0 0 1 2 0v15a1 1 0 0 1-1 1"
+        fill="currentColor"
+      />
+      <path
+        d="M31 17a1 1 0 0 1-.68-.27L15.92 3.37 1.68 16.73a1 1 0 0 1-1.41-.05 1 1 0 0 1 0-1.41l14.91-14a1 1 0 0 1 1.36 0l15.09 14a1 1 0 0 1 .05 1.42A1 1 0 0 1 31 17"
+        fill="currentColor"
+      />
+      <path
+        d="M22.86 31h-8a1 1 0 0 1-1-1V18a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1m-7-2h6V19h-6Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/InformationIcon.tsx

@@ -0,0 +1,14 @@
+export const InformationIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M14.46 10.19a1.4 1.4 0 0 1 .43-1A1.5 1.5 0 0 1 16 8.75a1.6 1.6 0 0 1 1.11.41 1.35 1.35 0 0 1 .45 1 1.32 1.32 0 0 1-.45 1 1.56 1.56 0 0 1-1.11.41 1.47 1.47 0 0 1-1.09-.43 1.35 1.35 0 0 1-.45-.95m.34 3.26h2.4v9.6h-2.4Z"
+        fill="currentColor"
+      />
+      <path
+        d="M16 2A14 14 0 1 1 2 16 14 14 0 0 1 16 2m0-2a16 16 0 1 0 16 16A16 16 0 0 0 16 0"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/LocationIcon.tsx

@@ -0,0 +1,14 @@
+export const LocationIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M28 6.3a8 8 0 0 0-4.92-5.1 22.68 22.68 0 0 0-14.56 0A7.39 7.39 0 0 0 3.9 6.3a17.8 17.8 0 0 0-.9 5.9c0 4.1 1.51 12.2 11.74 19.3l.41.3a1.45 1.45 0 0 0 .7.2 1.9 1.9 0 0 0 .7-.2h.1l.5-.3C27.39 24.4 29 16.3 29 12.2a21.5 21.5 0 0 0-1-5.9m-5.53-3.1a6.16 6.16 0 0 1 3.72 3.7 20 20 0 0 1 .8 5.3c0 4.6-2 9.1-5.82 13.2a31 31 0 0 1-4.72 4.1l-.1.1c-.1 0-.1.1-.2.1l-.2.2h-.1c-.1 0-.1-.1-.2-.1a.1.1 0 0 1-.1-.1 37.5 37.5 0 0 1-4.72-4.1C6.91 21.5 4.91 17 4.91 12.3a20.7 20.7 0 0 1 .8-5.3 5.72 5.72 0 0 1 3.61-3.8 21.1 21.1 0 0 1 13.15 0"
+        fill="currentColor"
+      />
+      <path
+        d="M16 18.9a7.11 7.11 0 0 0 7-7 7 7 0 1 0-7 7m0-12a5 5 0 0 1 5 5 5.09 5.09 0 0 1-5 5 5 5 0 1 1 0-10"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/MailIcon.tsx

@@ -0,0 +1,10 @@
+export const MailIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M32 25.61V6.39a1.4 1.4 0 0 0 0-.2.6.6 0 0 0-.15-.19s0-.08-.05-.11 0 0-.05 0a1 1 0 0 0-.15-.14 1 1 0 0 0-.16-.11l-.17-.05H.73l-.17.07a.5.5 0 0 0-.16.1 1 1 0 0 0-.15.14s-.08.1-.1.1l-.09.18a1.4 1.4 0 0 0 0 .2V25.6a1.4 1.4 0 0 0 0 .2c0 .07.06.12.09.18a1 1 0 0 0 .05.11 1 1 0 0 0 .24.2.5.5 0 0 0 .09.06 1 1 0 0 0 .42.1H31a1 1 0 0 0 .42-.1.5.5 0 0 0 .09-.06 1 1 0 0 0 .24-.2h.05s0-.07.05-.1a.7.7 0 0 0 .09-.19 1 1 0 0 0 .06-.19M2 8.49 12.06 16 2 23.51Zm14 8L4 7.5h24Zm-2.26.81 1.66 1.24.11.06.1.05a1.1 1.1 0 0 0 .39.09 1.1 1.1 0 0 0 .39-.09l.1-.05.11-.06 1.66-1.24L28 24.5H4Zm6.19-1.3L30 8.49v15Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/MenuIcon.tsx

@@ -0,0 +1,10 @@
+export const MenuIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M28 5H4a1 1 0 0 1 0-2h24a1 1 0 0 1 0 2M28 17H4a1 1 0 0 1 0-2h24a1 1 0 0 1 0 2M28 29H4a1 1 0 0 1 0-2h24a1 1 0 0 1 0 2"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/MessageIcon.tsx

@@ -0,0 +1,10 @@
+export const MessageIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M30 31a1 1 0 0 1-.75-.34l-7.64-8.6H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h28a1 1 0 0 1 .71.29A1 1 0 0 1 31 2v28a1 1 0 0 1-.65.93.8.8 0 0 1-.35.07M3 20.06h19.06a1 1 0 0 1 .75.33l6.19 7V3H3Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/MinusIcon.tsx

@@ -0,0 +1,10 @@
+export const MinusIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M24.7 16.71a1 1 0 0 1-.7.29H8a1 1 0 1 1 0-2h16a1 1 0 0 1 1 1 1 1 0 0 1-.3.71"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/OpenNewIcon.tsx

@@ -0,0 +1,14 @@
+export const OpenNewIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M14.16 18.84a1 1 0 0 1-.71-.29 1 1 0 0 1 0-1.42L30 .59a1 1 0 0 1 1.41 0 1 1 0 0 1 0 1.42L14.87 18.55a1 1 0 0 1-.71.29"
+        fill="currentColor"
+      />
+      <path
+        d="M31 14a1 1 0 0 1-1-1V2H19a1 1 0 0 1 0-2h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1M24 32H2a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h11.21a1 1 0 0 1 0 2H2v22h22V18.7a1 1 0 0 1 2 0V30a2 2 0 0 1-2 2"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/PencilIcon.tsx

@@ -0,0 +1,10 @@
+export const PencilIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M31.7 6.12 25.88.3a1 1 0 0 0-1.4 0L1.3 23.47a.86.86 0 0 0-.3.6L0 30.9a1.14 1.14 0 0 0 .3.8.91.91 0 0 0 .7.3h.1l6.82-1a.61.61 0 0 0 .61-.3L31.7 7.52a1 1 0 0 0 0-1.4M7.22 29l-3.57.56L5.08 28a1 1 0 0 0 0-1.42 1 1 0 0 0-1.41.05L2.39 28l.52-3.29 1.91-1.91 4.12 4.52Zm3.14-3.11-4.12-4.54L25.18 2.41l4.41 4.41Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/PhoneIcon.tsx

@@ -0,0 +1,10 @@
+export const PhoneIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M28.88 21.26c-2.26-1.72-5.46-2.84-7-1.42-.51.51-1.65 1.52-5.15-1.42-5.73-5.37-5.47-7.29-4.44-8.42 1.44-1.52.41-4.66-1.34-6.89C8.78.38 6.21-.63 4.14.38a6.53 6.53 0 0 0-4 4.67c-.94 4.66 3.49 10.64 7.3 14.89.72.81 1.45 1.52 2.17 2.33l.41.41C14.45 27 20.53 32 25.58 32a4.4 4.4 0 0 0 1.14-.1 6.64 6.64 0 0 0 5-3.95c.87-2.03-.16-4.56-2.84-6.69m-13.6-1.32c2.06 1.72 5.25 3.75 7.93 1.42.42-.3 2.37 0 4.44 1.52 1.44 1.12 2.78 2.84 2.06 4.12a4.45 4.45 0 0 1-3.4 2.84c-3.3.51-8.77-2.63-14.85-8.71l-.31-.31c-.72-.71-1.44-1.41-2.16-2.23H9C4 13.15 1.57 8.49 2.19 5.45a4.69 4.69 0 0 1 2.88-3.24c1.34-.71 3.09.71 4.13 2.13 1.54 2 1.85 3.95 1.44 4.35-2.89 3 .1 6.89 3.92 10.64"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/QuestionIcon.tsx

@@ -0,0 +1,14 @@
+export const QuestionIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M16 0a16 16 0 1 0 16 16A16 16 0 0 0 16 0m0 30a14 14 0 1 1 14-14 14 14 0 0 1-14 14"
+        fill="currentColor"
+      />
+      <path
+        d="M15.89 20.32a1.58 1.58 0 0 0-1.14.46 1.5 1.5 0 0 0-.47 1.1 1.3 1.3 0 0 0 .13.6 1.6 1.6 0 0 0 .35.48 1.7 1.7 0 0 0 .51.33 1.6 1.6 0 0 0 .62.12 1.55 1.55 0 0 0 1.11-.47 1.48 1.48 0 0 0 .47-1.1 1.4 1.4 0 0 0-.47-1.08 1.6 1.6 0 0 0-1.11-.44M19.11 9.71A4.3 4.3 0 0 0 17.74 9a5.2 5.2 0 0 0-1.63-.25 5.4 5.4 0 0 0-1.73.25 4.5 4.5 0 0 0-1.38.78 4.3 4.3 0 0 0-1 1.28 5 5 0 0 0-.51 1.71l2.41.23a2.7 2.7 0 0 1 .16-.78 1.9 1.9 0 0 1 .41-.67 2.1 2.1 0 0 1 .64-.46 1.9 1.9 0 0 1 .84-.17 1.78 1.78 0 0 1 1.39.53 1.84 1.84 0 0 1 .49 1.31 1.9 1.9 0 0 1-.27 1 4 4 0 0 1-.65.76l-.9.86a5.4 5.4 0 0 0-.63.68 3.05 3.05 0 0 0-.63 1.39 5.4 5.4 0 0 0-.07.86v.76h2.37v-.52a4 4 0 0 1 .06-.74 1.8 1.8 0 0 1 .21-.56 2.7 2.7 0 0 1 .4-.52c.17-.18.39-.38.65-.61s.59-.52.84-.77a5 5 0 0 0 .63-.77 3.4 3.4 0 0 0 .4-.88 4.2 4.2 0 0 0 .14-1.13 3.8 3.8 0 0 0-.38-1.64 3.6 3.6 0 0 0-.89-1.22"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/ScooterIcon.tsx

@@ -0,0 +1,26 @@
+export const ScooterIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <g clipPath="url(#a)" clipRule="evenodd" fill="currentColor" fillRule="evenodd">
+        <path d="M41.292 18.293a1 1 0 0 1 1.414 0C43.88 19.465 44.6 21.014 44.6 22.8c0 3.452-2.747 6.2-6.2 6.2-3.333 0-6.08-2.622-6.2-5.964a1 1 0 1 1 2-.072 4.19 4.19 0 0 0 4.2 4.036c2.348 0 4.2-1.852 4.2-4.2 0-1.214-.48-2.265-1.307-3.093a1 1 0 0 1 0-1.414M1.1 23a9.28 9.28 0 0 1 9.3-9.3 9.28 9.28 0 0 1 9.3 9.3 1 1 0 0 1-1 1H2.1a1 1 0 0 1-1-1m2.067-1h14.466a7.28 7.28 0 0 0-7.233-6.3A7.28 7.28 0 0 0 3.167 22" />
+        <path
+          d="M34.754 13.161c3.98-1.476 8.72.438 10.545 4.203a1 1 0 1 1-1.8.872c-1.374-2.834-5.032-4.32-8.052-3.199l-.006.003c-.933.339-1.796.939-2.494 1.724a1 1 0 0 1-1.495-1.328c.9-1.014 2.036-1.813 3.302-2.275M10.4 29.3a6.164 6.164 0 0 1-6.2-6.2h2c0 2.348 1.852 4.2 4.2 4.2s4.2-1.852 4.2-4.2h2c0 3.452-2.749 6.2-6.2 6.2"
+          fill="currentColor"
+        />
+        <path
+          d="M21.3 1a1 1 0 0 1 1-1h5.1a1 1 0 0 1 .869.503l7.1 12.4a1 1 0 1 1-1.736.994L26.821 2h-4.52a1 1 0 0 1-1-1M8.585 9.2c3.42-.1 6.556-.012 9.806 1.829 2.713 1.52 4.878 4.116 5.858 7.055a1 1 0 0 1-1.898.632c-.82-2.46-2.654-4.663-4.94-5.943l-.004-.003c-2.745-1.555-5.404-1.67-8.778-1.57H8a1 1 0 1 1 0-2z"
+          fill="currentColor"
+        />
+        <path
+          d="M45.33 17.434a1 1 0 0 1-.564 1.297l-12.2 4.8-.05.018c-.966.322-1.976.551-3.116.551H2.1a1 1 0 1 1 0-2h27.3c.851 0 1.634-.167 2.459-.44l12.174-4.79a1 1 0 0 1 1.297.564M0 5.7a1 1 0 0 1 1-1h9.9a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1M1.8 10.2a1 1 0 0 1 1-1h2a1 1 0 1 1 0 2h-2a1 1 0 0 1-1-1M3.2 1a1 1 0 0 1 1-1h7.1a1 1 0 1 1 0 2H4.2a1 1 0 0 1-1-1"
+          fill="currentColor"
+        />
+      </g>
+      <defs>
+        <clipPath id="a">
+          <path d="M0 0h45.4v29.3H0z" fill="currentColor" />
+        </clipPath>
+      </defs>
+    </svg>
+  )
+}

package/src/components/Icon/SearchIcon.tsx

@@ -0,0 +1,14 @@
+export const SearchIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M13.25 25.49a12.25 12.25 0 1 1 12.24-12.24 12.25 12.25 0 0 1-12.24 12.24m0-22.61a10.37 10.37 0 1 0 10.36 10.37A10.38 10.38 0 0 0 13.25 2.88"
+        fill="currentColor"
+      />
+      <path
+        d="M30.06 31a.94.94 0 0 1-.67-.28l-8.81-8.81a.94.94 0 1 1 1.33-1.33l8.81 8.81a.94.94 0 0 1 0 1.33.9.9 0 0 1-.66.28"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/SettingsIcon.tsx

@@ -0,0 +1,10 @@
+export const SettingsIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M16 2a14 14 0 0 1 2.13.16v3.57l1.34.47a10.2 10.2 0 0 1 3.27 1.89l1.08.91 1.23-.71 1.86-1.08a14 14 0 0 1 2.14 3.69L27.18 12l-1.18.7.26 1.39a10.6 10.6 0 0 1 0 3.8L26 19.28l1.23.71 1.88 1.09a14.2 14.2 0 0 1-2.14 3.69l-1.86-1.08-1.28-.69-1.07.92a10.6 10.6 0 0 1-3.3 1.9l-1.33.47v3.57A14 14 0 0 1 16 30a14 14 0 0 1-2.13-.16v-3.57l-1.34-.47a10.2 10.2 0 0 1-3.27-1.9L8.18 23 7 23.69l-1.91 1.08A14.1 14.1 0 0 1 3 21.08L4.82 20l1.23-.71-.26-1.39a10.6 10.6 0 0 1 0-3.8l.26-1.39L4.82 12 3 10.92a14.5 14.5 0 0 1 2.08-3.69l1.86 1.08L8.16 9l1.08-.9a10.6 10.6 0 0 1 3.3-1.9l1.33-.47V2.16A14 14 0 0 1 16 2m0 21a7 7 0 1 0-7-7 7 7 0 0 0 7 7m0-23a16 16 0 0 0-3.53.39.76.76 0 0 0-.6.75v3.18a12.7 12.7 0 0 0-3.93 2.26L5.2 5a.75.75 0 0 0-.38-.1.77.77 0 0 0-.57.25 15.9 15.9 0 0 0-3.53 6.1.78.78 0 0 0 .35.91l2.75 1.59a12.3 12.3 0 0 0 0 4.52l-2.75 1.58a.79.79 0 0 0-.35.9 16 16 0 0 0 3.53 6.11.8.8 0 0 0 .57.25.7.7 0 0 0 .38-.11L8 25.42a12.3 12.3 0 0 0 3.92 2.26v3.18a.77.77 0 0 0 .61.75A16.2 16.2 0 0 0 16 32a16 16 0 0 0 3.53-.39.76.76 0 0 0 .6-.75v-3.18a12.5 12.5 0 0 0 3.92-2.26L26.8 27a.79.79 0 0 0 1-.15 16 16 0 0 0 3.53-6.11.8.8 0 0 0-.36-.9l-2.75-1.59a12.8 12.8 0 0 0 0-4.53l2.75-1.59a.78.78 0 0 0 .35-.9 16.1 16.1 0 0 0-3.53-6.1.76.76 0 0 0-.57-.26.73.73 0 0 0-.42.13l-2.75 1.57a12.3 12.3 0 0 0-3.92-2.26V1.14a.77.77 0 0 0-.61-.75A16.2 16.2 0 0 0 16 0m0 21a5 5 0 1 1 5-5 5 5 0 0 1-5 5"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/TickAltIcon.tsx

@@ -0,0 +1,14 @@
+export const TickAltIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M12.7 22a1 1 0 0 1-.71-.29L8.3 18a1 1 0 0 1 0-1.42 1 1 0 0 1 1.41 0l3 3 9.41-9.38a1 1 0 0 1 1.42 0 1 1 0 0 1 0 1.41L13.4 21.69a1 1 0 0 1-.7.31"
+        fill="currentColor"
+      />
+      <path
+        d="M16 2A14 14 0 1 1 2 16 14 14 0 0 1 16 2m0-2a16 16 0 1 0 16 16A16 16 0 0 0 16 0"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/TickIcon.tsx

@@ -0,0 +1,10 @@
+export const TickIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M10.41 26a1 1 0 0 1-.71-.3l-6.42-6.59a1 1 0 0 1 1.44-1.39l5.69 5.85L27.28 6.3a1 1 0 1 1 1.44 1.4l-17.59 18a1 1 0 0 1-.72.3"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/VanIcon.tsx

@@ -0,0 +1,10 @@
+export const VanIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M31.05 3H9.8a1 1 0 0 0-1 1v.2H3.06a1 1 0 0 0-1 .86L.89 12.64a1 1 0 0 0-.89 1v10a1 1 0 0 0 1 1h3a5 5 0 0 0 9.9 0H18a5 5 0 0 0 9.89 0h3.21a1 1 0 0 0 .72-.3 1 1 0 0 0 .18-.72V4a1 1 0 0 0-.95-1M3.91 6.24H8.8v6.38H2.93ZM8.92 27A3 3 0 0 1 6 24.71a2.9 2.9 0 0 1-.12-.83 3.1 3.1 0 0 1 .25-1.22 3 3 0 0 1 5.53 0 3.3 3.3 0 0 1 .24 1.22 3.3 3.3 0 0 1-.11.83A3 3 0 0 1 8.92 27M23 27a3 3 0 0 1-2.89-2.24 2.9 2.9 0 0 1-.12-.83 3.1 3.1 0 0 1 .25-1.22 3 3 0 0 1 5.53 0 3.3 3.3 0 0 1 .23 1.17 3.3 3.3 0 0 1-.11.83A3 3 0 0 1 23 27m4.87-4.29a5 5 0 0 0-9.74 0H13.8a5 5 0 0 0-9.75 0H2v-8h7.8a1 1 0 0 0 1-1V5.05H30v17.61Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/WarningIcon.tsx

@@ -0,0 +1,14 @@
+export const WarningIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M2.35 28.08 16.06 4.46l13.71 23.62Zm29.32-.7L17.56 3.07A1.73 1.73 0 0 0 16.06 2a1.94 1.94 0 0 0-1.5 1.1L.35 27.38C-.45 28.77.15 30 1.85 30h28.32a1.6 1.6 0 0 0 1.5-2.62"
+        fill="currentColor"
+      />
+      <path
+        d="M14.52 24.19A1.44 1.44 0 0 1 15 23.1a1.54 1.54 0 0 1 1.13-.46 1.63 1.63 0 0 1 1.12.44 1.39 1.39 0 0 1 .48 1.07 1.48 1.48 0 0 1-.47 1.1 1.62 1.62 0 0 1-1.74.34 1.6 1.6 0 0 1-.51-.32 1.3 1.3 0 0 1-.35-.48 1.3 1.3 0 0 1-.14-.6m2.8-3h-2.4v-9.71h2.4Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/WriteIcon.tsx

@@ -0,0 +1,22 @@
+export const WriteIcon = () => {
+  return (
+    <svg className="coop-icon" fill="none" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+      <path
+        d="M19.67 10.13 17.9 11.9H7a1 1 0 0 1 0-2h12a1 1 0 0 1 .67.23M14.9 14.9l-2 2H7a1 1 0 0 1 0-2ZM20 15.9a1 1 0 0 1-1 1h-1.87l2-2a1 1 0 0 1 .82.59.85.85 0 0 1 .05.41M19 21.9H7a1 1 0 0 1 0-2h12a1 1 0 1 1 0 2"
+        fill="currentColor"
+      />
+      <path
+        d="M24.08 10v20h-22V6h21.73l1.54-1.54a1.9 1.9 0 0 0-1-.44H2.07a2 2 0 0 0-2 2V30a2 2 0 0 0 2 2h22a2 2 0 0 0 2-2V8Z"
+        fill="currentColor"
+      />
+      <path
+        d="M30.62 3.41 28.5 1.29a1 1 0 0 0-1.42 0L22.38 6l-3.9 3.9-5 5-1.33 1.33a1 1 0 0 0-.27.48v.19l-.6 2.57a.8.8 0 0 0 0 .43 1 1 0 0 0 1.19.77l2.74-.67a.64.64 0 0 0 .29-.13.6.6 0 0 0 .19-.14l2.85-2.86 1.4-1.39L30.62 4.82a1 1 0 0 0 0-1.41M15 19.06l-2.75.63.62-2.75 6.82-6.81L23.81 6l1.54-1.54L27.79 2l2.13 2.12Z"
+        fill="currentColor"
+      />
+      <path
+        d="M31.33 2.7 29.21.58a2.06 2.06 0 0 0-2.83 0L11.44 15.52a2.1 2.1 0 0 0-.54 1l-.09.41-.54 2.34a2.18 2.18 0 0 0 .54 1.87 2 2 0 0 0 1.4.58 1.8 1.8 0 0 0 .46-.05l2.75-.67a2.1 2.1 0 0 0 1-.54L31.33 5.53a2 2 0 0 0 0-2.83M15 19.06l-2.75.63.62-2.75 6.82-6.81L23.81 6l1.54-1.54L27.79 2l2.13 2.12Z"
+        fill="currentColor"
+      />
+    </svg>
+  )
+}

package/src/components/Icon/index.tsx

@@ -1,36 +1,39 @@
-/* eslint-disable react-refresh/only-export-components */
-
-/* DO NOT EDIT THIS FILE DIRECTLY */
-/* If you need to make changes, edit template.tsx */
-
-import { type SVGProps, useId } from "react"
-
-export interface IconProps extends SVGProps<SVGSVGElement> {
-  /** **(Optional)** Alt text for the Icon. Will be rendered in a title tag in the SVG. */
-  alt?: string
-  /** **(Optional)** Additional class names to forward to the Icon. */
-  className?: string
-  /** The name of the icon to render. See the readme for how to add new icons. */
-  icon?: IconName
-}
-
-export const Icon = ({ alt, className = "", icon, ...props }: IconProps) => {
-  const id = useId()
-
-  const componentProps = {
-    className: `coop-icon ${className}`.trim(),
-    ...props,
-  }
-
-  return (
-    <svg aria-labelledby={alt ? id : undefined} role={alt ? "img" : undefined} {...componentProps}>
-      {alt ? <title id={id}>{alt}</title> : null}
-      <use href={`#${icon}`} />
-    </svg>
-  )
-}
-
-export default Icon
-
-export const iconNames = ["arrow-right", "chevron", "search"] as const
-export type IconName = (typeof iconNames)[number]
+export { AddIcon } from "./AddIcon"
+export { ArrowDownIcon } from "./ArrowDownIcon"
+export { ArrowLeftIcon } from "./ArrowLeftIcon"
+export { ArrowRightIcon } from "./ArrowRightIcon"
+export { ArrowUpIcon } from "./ArrowUpIcon"
+export { AvatarAltIcon } from "./AvatarAltIcon"
+export { AvatarIcon } from "./AvatarIcon"
+export { BasketIcon } from "./BasketIcon"
+export { CalendarIcon } from "./CalendarIcon"
+export { ChevronDownIcon } from "./ChevronDownIcon"
+export { ChevronLeftIcon } from "./ChevronLeftIcon"
+export { ChevronRightIcon } from "./ChevronRightIcon"
+export { ChevronUpIcon } from "./ChevronUpIcon"
+export { ClockIcon } from "./ClockIcon"
+export { CloseAltIcon } from "./CloseAltIcon"
+export { CloseIcon } from "./CloseIcon"
+export { CoopCardIcon } from "./CoopCardIcon"
+export { CoopIcon } from "./CoopIcon"
+export { CoopLocationIcon } from "./CoopLocationIcon"
+export { DownloadIcon } from "./DownloadIcon"
+export { HomeIcon } from "./HomeIcon"
+export { InformationIcon } from "./InformationIcon"
+export { LocationIcon } from "./LocationIcon"
+export { MailIcon } from "./MailIcon"
+export { MenuIcon } from "./MenuIcon"
+export { MessageIcon } from "./MessageIcon"
+export { MinusIcon } from "./MinusIcon"
+export { OpenNewIcon } from "./OpenNewIcon"
+export { PencilIcon } from "./PencilIcon"
+export { PhoneIcon } from "./PhoneIcon"
+export { QuestionIcon } from "./QuestionIcon"
+export { ScooterIcon } from "./ScooterIcon"
+export { SearchIcon } from "./SearchIcon"
+export { SettingsIcon } from "./SettingsIcon"
+export { TickAltIcon } from "./TickAltIcon"
+export { TickIcon } from "./TickIcon"
+export { VanIcon } from "./VanIcon"
+export { WarningIcon } from "./WarningIcon"
+export { WriteIcon } from "./WriteIcon"

package/src/components/RootSVG/RootSVG.tsx

@@ -1,27 +1,6 @@
-import { JSX } from "react"
-export const RootSVG = (): JSX.Element => {
+export const RootSVG = () => {
   return (
     <svg height="0" width="0" xmlns="http://www.w3.org/2000/svg">
-      <symbol fill="currentColor" id="arrow-right" viewBox="0 0 22 20">
-        <path
-          clipRule="evenodd"
-          d="M11.127 1.65a.9.9 0 0 1 1.246-1.3l8.812 8.46a1.65 1.65 0 0 1 0 2.38l-8.812 8.46a.9.9 0 0 1-1.246-1.3l7.76-7.45H1.25a.9.9 0 1 1 0-1.8h17.638z"
-          fill="currentColor"
-          fillRule="evenodd"
-        />
-      </symbol>
-      <symbol id="chevron" viewBox="0 0 16 29">
-        <path d="M2 28.1a1.6 1.6 0 0 1-1.2-2.7l11-10.9-11-11a1.6 1.6 0 1 1 2.2-2l12 12a1.6 1.6 0 0 1 0 2.2l-12 12c-.3.4-.7.5-1 .5z" />
-      </symbol>
-      <symbol fill="currentColor" id="search" viewBox="0 0 24 24">
-        <path
-          clipRule="evenodd"
-          d="M4.65 10.5a5.85 5.85 0 1 1 11.7 0 5.85 5.85 0 0 1-11.7 0m5.85-7.65a7.65 7.65 0 1 0 4.736 13.658l4.378 4.378a.9.9 0 1 0 1.273-1.273l-4.378-4.378A7.65 7.65 0 0 0 10.5 2.85"
-          fill="currentColor"
-          fillRule="evenodd"
-        />
-      </symbol>
-
       <defs>
         <clipPath clipPathUnits="objectBoundingBox" id="squircle">
           <path d="M0,0.5 C0,0.165,0.165,0,0.5,0 S1,0.165,1,0.5 S0.835,1,0.5,1 S0,0.835,0,0.5"></path>
@@ -30,4 +9,5 @@ export const RootSVG = (): JSX.Element => {
     </svg>
   )
 }
+
 export default RootSVG

package/dist/components/Icon/template.d.ts

@@ -1,11 +0,0 @@
-import { type SVGProps } from "react";
-export interface IconProps extends SVGProps<SVGSVGElement> {
-    /** **(Optional)** Alt text for the Icon. Will be rendered in a title tag in the SVG. */
-    alt?: string;
-    /** **(Optional)** Additional class names to forward to the Icon. */
-    className?: string;
-    /** The name of the icon to render. See the readme for how to add new icons. */
-    icon?: IconName;
-}
-export declare const Icon: ({ alt, className, icon, ...props }: IconProps) => import("react/jsx-runtime").JSX.Element;
-export default Icon;

package/src/components/Icon/template.tsx

@@ -1,29 +0,0 @@
-import { type SVGProps, useId } from "react"
-
-export interface IconProps extends SVGProps<SVGSVGElement> {
-  /** **(Optional)** Alt text for the Icon. Will be rendered in a title tag in the SVG. */
-  alt?: string
-  /** **(Optional)** Additional class names to forward to the Icon. */
-  className?: string
-  /** The name of the icon to render. See the readme for how to add new icons. */
-  ///@ts-expect-error IconName does not exist yet
-  icon?: IconName
-}
-
-export const Icon = ({ alt, className = "", icon, ...props }: IconProps) => {
-  const id = useId()
-
-  const componentProps = {
-    className: `coop-icon ${className}`.trim(),
-    ...props,
-  }
-
-  return (
-    <svg aria-labelledby={alt ? id : undefined} role={alt ? "img" : undefined} {...componentProps}>
-      {alt ? <title id={id}>{alt}</title> : null}
-      <use href={`#${icon}`} />
-    </svg>
-  )
-}
-
-export default Icon