lerelais-front-library 0.1.0

package/src/App.tsx

@@ -0,0 +1,366 @@
+import { useState } from 'react';
+import { Accordion } from '@/components/Accordion';
+import { Alert } from '@/components/Alert';
+import { Avatar } from '@/components/Avatar';
+import { Badge } from '@/components/Badge';
+import { BarChart } from '@/components/BarChart';
+import { BottomNavItem } from '@/components/BottomNavItem';
+import { Breadcrumb } from '@/components/Breadcrumb';
+import { Button } from '@/components/Button';
+import { Checkbox } from '@/components/Checkbox';
+import { ActionCard } from '@/components/ActionCard';
+import { BenefitsCard } from '@/components/BenefitsCard';
+import { ConfirmModal } from '@/components/ConfirmModal';
+import { CoreButton } from '@/components/CoreButton';
+import { CoreField } from '@/components/CoreField';
+import { CoreSelect } from '@/components/CoreSelect';
+import { CoreTabs } from '@/components/CoreTabs';
+import { DashboardParcelRow } from '@/components/DashboardParcelRow';
+import { DataFiltersToolbar } from '@/components/DataFiltersToolbar';
+import { DataSearchBar } from '@/components/DataSearchBar';
+import { DataTable } from '@/components/DataTable';
+import { Divider } from '@/components/Divider';
+import { DropdownMenu } from '@/components/DropdownMenu';
+import { EmptyState } from '@/components/EmptyState';
+import { FaqItem } from '@/components/FaqItem';
+import { FavoriteRelayCard } from '@/components/FavoriteRelayCard';
+import { FeatureCard } from '@/components/FeatureCard';
+import { FilterPill } from '@/components/FilterPill';
+import { FileUpload } from '@/components/FileUpload';
+import { Footer } from '@/components/Footer';
+import { InfoRow } from '@/components/InfoRow';
+import { LinkButton } from '@/components/LinkButton';
+import { LocationCard } from '@/components/LocationCard';
+import { MetricCard } from '@/components/MetricCard';
+import { Navbar } from '@/components/Navbar';
+import { NotificationItem } from '@/components/NotificationItem';
+import { OutcomeModal } from '@/components/OutcomeModal';
+import { NotificationRow } from '@/components/NotificationRow';
+import { Pagination } from '@/components/Pagination';
+import { ParcelCard } from '@/components/ParcelCard';
+import { PhotoUpload } from '@/components/PhotoUpload';
+import { ProcessBadge } from '@/components/ProcessBadge';
+import { ParcelRow } from '@/components/ParcelRow';
+import { ParcelTimeline } from '@/components/ParcelTimeline';
+import { ProgressBar } from '@/components/ProgressBar';
+import { QuestionSearch } from '@/components/QuestionSearch';
+import { QrScanner } from '@/components/QrScanner';
+import { RelayResultCard } from '@/components/RelayResultCard';
+import { ResetPasswordCard } from '@/components/ResetPasswordCard';
+import { QuickActionCard } from '@/components/QuickActionCard';
+import { Radio } from '@/components/Radio';
+import { RelayCard } from '@/components/RelayCard';
+import { SearchBar } from '@/components/SearchBar';
+import { Select } from '@/components/Select';
+import { ShipmentStatus } from '@/components/ShipmentStatus';
+import { Sidebar } from '@/components/Sidebar';
+import { SidebarNavItem } from '@/components/SidebarNavItem';
+import { Skeleton } from '@/components/Skeleton';
+import { StatCard } from '@/components/StatCard';
+import { StatusSummary } from '@/components/StatusSummary';
+import { StepCard } from '@/components/StepCard';
+import { StepsList } from '@/components/StepsList';
+import { SuccessFeedback } from '@/components/SuccessFeedback';
+import { Stepper } from '@/components/Stepper';
+import { Switch } from '@/components/Switch';
+import { Tabs } from '@/components/Tabs';
+import { Tag } from '@/components/Tag';
+import { TextField } from '@/components/TextField';
+import { Toast } from '@/components/Toast';
+import { Tooltip } from '@/components/Tooltip';
+import { TrackingBadge } from '@/components/TrackingBadge';
+import { TrackingCard } from '@/components/TrackingCard';
+import { TrackingSearch } from '@/components/TrackingSearch';
+import { ValueCard } from '@/components/ValueCard';
+import './App.css';
+
+export function App() {
+  const [page, setPage] = useState(1);
+  const [tab, setTab] = useState('all');
+
+  return (
+    <div className="catalog">
+      <header className="catalog-hero">
+        <p>LeRelais</p>
+        <h1>Bibliothèque UI</h1>
+      </header>
+
+      <Navbar />
+      <Navbar variant="particulier" />
+
+      <section>
+        <h2>Boutons</h2>
+        <div className="row">
+          <Button>Continuer</Button>
+          <Button variant="secondary">Continuer</Button>
+          <Button variant="ghost">Continuer</Button>
+          <Button disabled>Continuer</Button>
+        </div>
+      </section>
+
+      <section>
+        <h2>Formulaires</h2>
+        <div className="row">
+          <TextField label="Libellé" placeholder="Saisir une valeur" />
+          <TextField label="Libellé" defaultValue="Abidjan, Cocody" />
+          <TextField label="Libellé" error="Valeur incorrecte" defaultValue="Valeur incorrecte" />
+          <Select
+            label="Mode de livraison"
+            options={[
+              { value: 'relay', label: 'Point relais' },
+              { value: 'home', label: 'Domicile' },
+            ]}
+          />
+        </div>
+        <div className="row">
+          <Checkbox label="Recevoir les notifications" />
+          <Radio name="delivery" label="Point relais" defaultChecked />
+          <Radio name="delivery" label="Domicile" />
+          <Switch label="Alertes" defaultChecked />
+          <SearchBar placeholder="Rechercher un colis, un relais…" />
+        </div>
+      </section>
+
+      <section>
+        <h2>Statuts</h2>
+        <div className="row">
+          <Badge status="pending" />
+          <Badge status="transit" />
+          <Badge status="available" />
+          <Badge status="delivered" />
+          <Badge status="error" />
+        </div>
+        <div className="row">
+          <ShipmentStatus status="preparing" />
+          <ShipmentStatus status="dropped" />
+          <ShipmentStatus status="transit" />
+          <ShipmentStatus status="delivered" />
+          <ShipmentStatus status="anomaly" />
+        </div>
+        <div className="row">
+          <Tag>Standard</Tag>
+          <Tag type="active">Actif</Tag>
+          <Tag type="removable">Filtre</Tag>
+          <Tag type="success">Disponible</Tag>
+          <Tag type="warning">En attente</Tag>
+          <Tag type="error">Anomalie</Tag>
+        </div>
+      </section>
+
+      <section>
+        <h2>Navigation</h2>
+        <Tabs
+          value={tab}
+          onChange={setTab}
+          items={[
+            { id: 'all', label: 'Tous' },
+            { id: 'transit', label: 'En transit' },
+          ]}
+        />
+        <Stepper
+          steps={[
+            { label: 'Je prépare mon colis', state: 'done' },
+            { label: 'Expéditeur', state: 'done' },
+            { label: 'Récapitulatif', state: 'active' },
+            { label: 'Paiement', state: 'upcoming' },
+          ]}
+        />
+        <Breadcrumb
+          items={[
+            { label: 'Accueil', href: '#accueil' },
+            { label: 'Mes colis', href: '#colis' },
+            { label: 'LR-2026-000123' },
+          ]}
+        />
+        <Pagination page={page} pageCount={3} onChange={setPage} />
+        <div className="row">
+          <BottomNavItem label="Accueil" />
+          <BottomNavItem label="Accueil" active />
+        </div>
+        <LinkButton href="#relais">Voir tous les relais partenaires</LinkButton>
+      </section>
+
+      <section className="split">
+        <Sidebar />
+        <div>
+          <div className="row dark">
+            <SidebarNavItem label="Tableau de bord" />
+            <SidebarNavItem label="Tableau de bord" active />
+          </div>
+          <NotificationRow
+            title="Colis disponible en point relais"
+            description="Votre colis LR-2026-084215 est arrivé au relais Cocody Centre."
+            time="Il y a 2h"
+          />
+          <DashboardParcelRow
+            trackingId="LR-2026-084215"
+            route="Abidjan → Bouaké"
+            recipient="À l'attention de Marie Konan"
+            status="En transit"
+            date="13 août 2026 · 08:42"
+          />
+        </div>
+      </section>
+
+      <section>
+        <h2>Cartes</h2>
+        <div className="row">
+          <MetricCard label="Colis en cours" value="128" hint="+8 cette semaine" />
+          <StatCard label="Colis en cours" value="0" hint="En transit ou en préparation" />
+          <ParcelCard
+            trackingId="LR-2026-084215"
+            route="Abidjan → Bouaké"
+            recipient="Destinataire · Aminata K."
+            status="En transit"
+          />
+          <RelayCard name="Carrefour Cocody" location="Cocody · 1,2 km" hours="Ouvert · ferme à 20:00" />
+        </div>
+        <FavoriteRelayCard
+          name="Épicerie Centrale"
+          address="12 rue de Charenton, Abidjan 12e"
+          distance="350m"
+          hours="Lun-Sam 08:00-21:00"
+          services={['Dépôt', 'Retrait', 'Scan QR']}
+        />
+        <QuickActionCard title="Envoyer un colis" description="Préparez un nouvel envoi" />
+        <ParcelRow trackingId="LR-084215" recipient="Aminata K." location="Cocody" status="En transit" date="20 août 2026" />
+      </section>
+
+      <section>
+        <h2>Feedback</h2>
+        <div className="row">
+          <Alert>Information utile pour continuer.</Alert>
+          <Alert type="success">L’opération a été enregistrée.</Alert>
+          <Alert type="warning">Une vérification est nécessaire.</Alert>
+          <Alert type="error">Une erreur empêche de continuer.</Alert>
+        </div>
+        <div className="row">
+          <Toast>Colis envoyé avec succès.</Toast>
+          <Toast type="error">Une erreur est survenue.</Toast>
+        </div>
+        <ProgressBar label="En cours de traitement" value={65} />
+        <Accordion title="Quels sont les délais de livraison en point relais ?">
+          Les délais de livraison varient de 24h à 72h ouvrées selon la destination.
+        </Accordion>
+        <Divider label="ou" caption="Avec label central" />
+        <div className="row">
+          <Avatar initials="JD" size="sm" />
+          <Avatar initials="JD" size="md" />
+          <Avatar initials="JD" size="lg" />
+          <Avatar initials="JD" size="xl" />
+          <Skeleton />
+          <Skeleton type="rectangle" />
+          <Skeleton type="circle" />
+          <Tooltip label="Tooltip text">
+            <Button variant="ghost">Survoler</Button>
+          </Tooltip>
+          <DropdownMenu />
+        </div>
+        <NotificationItem
+          unread
+          title="Colis LR-2026-000123 disponible"
+          description="Votre colis est prêt à être retiré au relais Tabac du Centre."
+          time="Il y a 2 heures"
+        />
+      </section>
+
+      <section className="row">
+        <ParcelTimeline
+          events={[
+            { title: 'Colis créé', time: '18 août · 09:12', done: true },
+            { title: 'Pris en charge', time: '18 août · 14:40', done: true },
+            { title: 'En transit', time: '19 août · 08:15', done: true },
+            { title: 'Disponible au relais', time: 'À venir' },
+          ]}
+        />
+        <QrScanner />
+        <EmptyState
+          title="Aucun colis"
+          description={'Les nouveaux colis apparaîtront ici.\nCommencez par envoyer votre premier colis.'}
+        />
+        <ConfirmModal
+          title="Confirmer la remise du colis ?"
+          description="Cette action marque le colis comme remis au destinataire et enregistre l'opération."
+        />
+      </section>
+
+      <section>
+        <FileUpload />
+        <BarChart
+          title="Colis par jour"
+          items={[
+            { label: 'Lun', value: 60 },
+            { label: 'Mar', value: 110 },
+            { label: 'Mer', value: 140 },
+            { label: 'Jeu', value: 80 },
+            { label: 'Ven', value: 145 },
+          ]}
+        />
+      </section>
+
+      <section>
+        <h2>Core</h2>
+        <div className="row">
+          <CoreButton>Se connecter</CoreButton>
+          <CoreButton variant="secondary">Créer un compte</CoreButton>
+          <CoreButton variant="icon">Voir sur la carte</CoreButton>
+          <CoreButton variant="compact">Ouvert maintenant</CoreButton>
+          <CoreButton variant="filter">Filtres</CoreButton>
+        </div>
+        <div className="row">
+          <CoreField placeholder="vous@email.fr" />
+          <CoreField type="password" placeholder="Mot de passe" />
+          <CoreSelect
+            options={[
+              { value: 'abidjan', label: 'Abidjan' },
+              { value: 'bouake', label: 'Bouaké' },
+            ]}
+          />
+        </div>
+        <CoreTabs />
+        <div className="row">
+          <FilterPill active>Ouvert maintenant</FilterPill>
+          <FilterPill>24h/24</FilterPill>
+        </div>
+        <QuestionSearch />
+        <PhotoUpload />
+        <div className="row">
+          <TrackingCard />
+          <RelayResultCard />
+          <FeatureCard />
+          <StepCard />
+          <LocationCard />
+          <ActionCard />
+          <ValueCard />
+          <BenefitsCard />
+        </div>
+        <ResetPasswordCard />
+        <div className="row">
+          <ProcessBadge />
+          <ProcessBadge state="success" />
+          <ProcessBadge state="error" />
+          <TrackingBadge />
+        </div>
+        <StatusSummary />
+        <TrackingSearch />
+        <InfoRow />
+        <StepsList />
+        <FaqItem />
+        <SuccessFeedback />
+        <div className="row">
+          <OutcomeModal />
+          <OutcomeModal type="error" />
+        </div>
+      </section>
+
+      <section>
+        <h2>Données</h2>
+        <DataFiltersToolbar aria-label="Recherche et filtres" />
+        <DataSearchBar aria-label="Recherche utilisateurs" />
+        <DataTable />
+      </section>
+
+      <Footer />
+    </div>
+  );
+}

package/src/assets/icons/alert-triangle.svg

@@ -0,0 +1,7 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="icon-alert-triangle">
+<path id="Vector" d="M21.73 18L13.73 4C13.5556 3.6922 13.3026 3.43619 12.9969 3.25807C12.6912 3.07995 12.3438 2.9861 11.99 2.9861C11.6362 2.9861 11.2888 3.07995 10.9831 3.25807C10.6774 3.43619 10.4244 3.6922 10.25 4L2.25 18C2.07368 18.3054 1.98123 18.6519 1.98201 19.0045C1.98279 19.3571 2.07678 19.7032 2.25445 20.0078C2.43211 20.3124 2.68715 20.5646 2.9937 20.7388C3.30024 20.9131 3.64741 21.0032 4 21H20C20.3509 20.9996 20.6955 20.907 20.9993 20.7313C21.303 20.5556 21.5552 20.3031 21.7305 19.9991C21.9058 19.6951 21.998 19.3504 21.9979 18.9995C21.9979 18.6486 21.9054 18.3039 21.73 18Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_2" d="M12 9V13" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_3" d="M12 17H12.01" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/arrow-right.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="arrow-right">
+<path id="Vector" d="M3.3328 8H12.6672M8 12.6672L12.6672 8L8 3.3328" stroke="#D34860" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/bell.svg

@@ -0,0 +1,6 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="icon-bell">
+<path id="Vector" d="M4 5.33333C4 4.27247 4.42143 3.25505 5.17157 2.50491C5.92172 1.75476 6.93913 1.33333 8 1.33333C9.06087 1.33333 10.0783 1.75476 10.8284 2.50491C11.5786 3.25505 12 4.27247 12 5.33333C12 10 14 11.3333 14 11.3333H2C2 11.3333 4 10 4 5.33333Z" stroke="#606978" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_2" d="M6.86667 14C6.97826 14.203 7.1423 14.3722 7.34166 14.4901C7.54102 14.608 7.76839 14.6702 8 14.6702C8.23161 14.6702 8.45898 14.608 8.65834 14.4901C8.8577 14.3722 9.02174 14.203 9.13333 14" stroke="#606978" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/chevron-down.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="chevron-down">
+<path id="Vector" d="M4 6L8 10L12 6" stroke="#D34860" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/chevron-right.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="chevron-right">
+<path id="Vector" d="M6 12L10 8L6 4" stroke="#606978" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/clock-muted.svg

@@ -0,0 +1,10 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="clock" clip-path="url(#clip0_0_5)">
+<path id="Vector" d="M7 3.49972V7L9.33352 8.16676M12.8338 7C12.8338 10.2219 10.2219 12.8338 7 12.8338C3.77808 12.8338 1.1662 10.2219 1.1662 7C1.1662 3.77808 3.77808 1.1662 7 1.1662C10.2219 1.1662 12.8338 3.77808 12.8338 7Z" stroke="#606978" stroke-width="2" stroke-linecap="round"/>
+</g>
+<defs>
+<clipPath id="clip0_0_5">
+<rect width="14" height="14" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/icons/clock.svg

@@ -0,0 +1,11 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="icon-clock" clip-path="url(#clip0_0_10)">
+<path id="Vector" d="M6 11C8.76142 11 11 8.76142 11 6C11 3.23858 8.76142 1 6 1C3.23858 1 1 3.23858 1 6C1 8.76142 3.23858 11 6 11Z" stroke="#9CA3AF" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_2" d="M6 3V6L8 7" stroke="#9CA3AF" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_0_10">
+<rect width="12" height="12" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/icons/close.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="x">
+<path id="Vector" d="M9 3L3 9M3 3L9 9" stroke="#3E4652" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/core-camera.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="camera">
+<path id="Vector" d="M15.022 4.28321C14.7121 4.09838 14.358 4.0008 13.9972 4.0008H10.0038C9.64339 4.00078 9.28963 4.09815 8.97998 4.28261C8.67032 4.46706 8.41627 4.73176 8.2447 5.0487L7.75566 5.95261C7.58409 6.26954 7.33004 6.53424 7.02038 6.71869C6.71073 6.90315 6.35697 7.00052 5.99652 7.0005H3.99936C3.46888 7.0005 2.96014 7.21119 2.58503 7.58623C2.20993 7.96126 1.9992 8.46992 1.9992 9.0003V17.9994C1.9992 18.5298 2.20993 19.0384 2.58503 19.4135C2.96014 19.7885 3.46888 19.9992 3.99936 19.9992H20.0006C20.5311 19.9992 21.0399 19.7885 21.415 19.4135C21.7901 19.0384 22.0008 18.5298 22.0008 17.9994V9.0003C22.0008 8.46992 21.7901 7.96126 21.415 7.58623C21.0399 7.21119 20.5311 7.0005 20.0006 7.0005H18.0035C17.6427 7.00051 17.2886 6.90292 16.9787 6.71809C16.6688 6.53326 16.4147 6.26807 16.2433 5.9506L15.7573 5.0507C15.5859 4.73323 15.3318 4.46804 15.022 4.28321Z" stroke="#D34860" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/core-check-sm.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="check">
+<path id="Vector" d="M11.6662 3.5L5.25017 9.9162L2.3338 6.99975" stroke="#D34860" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/core-check-white.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="check">
+<path id="Vector" d="M16.666 5L7.50025 14.166L3.334 9.99964" stroke="white" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/core-check.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="check">
+<path id="Vector" d="M13.3328 4L6.0002 11.3328L2.6672 7.99971" stroke="#16A34A" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/core-chevron.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="chevron-down">
+<path id="Vector" d="M4 6L8 10L12 6" stroke="#D34860" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/core-dot.svg

@@ -0,0 +1,3 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle id="Ellipse" cx="4" cy="4" r="4" fill="#16A34A"/>
+</svg>

package/src/assets/icons/core-lock-form.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="lock">
+<path id="Vector" d="M7 10.9999V6.9996C7 5.67341 7.52678 4.40154 8.46447 3.46378C9.40215 2.52603 10.6739 1.9992 12 1.9992C13.3261 1.9992 14.5979 2.52603 15.5355 3.46378C16.4732 4.40154 17 5.67341 17 6.9996V10.9999M5 10.9999H19C20.1046 10.9999 21 11.8954 21 13.0001V20.0006C21 21.1053 20.1046 22.0008 19 22.0008H5C3.89543 22.0008 3 21.1053 3 20.0006V13.0001C3 11.8954 3.89543 10.9999 5 10.9999Z" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-lock.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="lock">
+<path id="Vector" d="M5.25 8.24994V5.2497C5.25 4.25506 5.64509 3.30116 6.34835 2.59784C7.05161 1.89452 8.00544 1.4994 9 1.4994C9.99456 1.4994 10.9484 1.89452 11.6517 2.59784C12.3549 3.30116 12.75 4.25506 12.75 5.2497V8.24994M3.75 8.24994H14.25C15.0784 8.24994 15.75 8.92157 15.75 9.75006V15.0005C15.75 15.829 15.0784 16.5006 14.25 16.5006H3.75C2.92157 16.5006 2.25 15.829 2.25 15.0005V9.75006C2.25 8.92157 2.92157 8.24994 3.75 8.24994Z" stroke="#606978" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-map-pin.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="map-pin">
+<path id="Vector" d="M9.4507 16.35C10.8456 15.1454 14.9994 11.2451 14.9994 7.49996C14.9994 5.90851 14.3673 4.38224 13.2422 3.25692C12.1171 2.1316 10.5911 1.4994 9 1.4994C7.40886 1.4994 5.88289 2.1316 4.75778 3.25692C3.63268 4.38224 3.0006 5.90851 3.0006 7.49996C3.0006 11.2451 7.15443 15.1454 8.5493 16.35C8.67924 16.4478 8.83742 16.5006 9 16.5006C9.16258 16.5006 9.32076 16.4478 9.4507 16.35Z" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-package-lg.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="package">
+<path id="Vector" d="M28 51.3352V28.0005M28 28.0005L7.67676 16.3332M28 28.0005L48.3234 16.3332M17.5 9.96172L38.5 21.9791M25.6667 50.7049C26.3761 51.1145 27.1808 51.3302 28 51.3302C28.8192 51.3302 29.6239 51.1145 30.3333 50.7049L46.6667 41.3711C47.3754 40.9619 47.964 40.3735 48.3736 39.6649C48.7831 38.9564 48.9992 38.1526 49 37.3342V18.6664C48.9992 17.848 48.7831 17.0442 48.3736 16.3357C47.964 15.6271 47.3754 15.0387 46.6667 14.6295L30.3333 5.29565C29.6239 4.88604 28.8192 4.6704 28 4.6704C27.1808 4.6704 26.3761 4.88604 25.6667 5.29565L9.33333 14.6295C8.62461 15.0387 8.03595 15.6271 7.62641 16.3357C7.21687 17.0442 7.00084 17.848 7 18.6664V37.3342C7.00084 38.1526 7.21687 38.9564 7.62641 39.6649C8.03595 40.3735 8.62461 40.9619 9.33333 41.3711L25.6667 50.7049Z" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-package.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="package">
+<path id="Vector" d="M14 25.6676V14.0003M14 14.0003L3.83838 8.16659M14 14.0003L24.1617 8.16659M8.75 4.98086L19.25 10.9895M12.8333 25.3525C13.188 25.5573 13.5904 25.6651 14 25.6651C14.4096 25.6651 14.812 25.5573 15.1667 25.3525L23.3333 20.6855C23.6877 20.4809 23.982 20.1867 24.1868 19.8325C24.3916 19.4782 24.4996 19.0763 24.5 18.6671V9.33321C24.4996 8.92401 24.3916 8.52211 24.1868 8.16783C23.982 7.81356 23.6877 7.51936 23.3333 7.31476L15.1667 2.64783C14.812 2.44302 14.4096 2.3352 14 2.3352C13.5904 2.3352 13.188 2.44302 12.8333 2.64783L4.66667 7.31476C4.31231 7.51936 4.01798 7.81356 3.81321 8.16783C3.60843 8.52211 3.50042 8.92401 3.5 9.33321V18.6671C3.50042 19.0763 3.60843 19.4782 3.81321 19.8325C4.01798 20.1867 4.31231 20.4809 4.66667 20.6855L12.8333 25.3525Z" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-pin-info.svg

@@ -0,0 +1,6 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="map-pin">
+<path id="Vector" d="M8.40067 14.5327C9.64067 13.462 13.3333 9.99533 13.3333 6.66667C13.3333 5.25218 12.7714 3.89562 11.7712 2.89543C10.771 1.89524 9.41449 1.33333 8 1.33333C6.58551 1.33333 5.22896 1.89524 4.22876 2.89543C3.22857 3.89562 2.66667 5.25218 2.66667 6.66667C2.66667 9.99533 6.35933 13.462 7.59933 14.5327C7.71485 14.6195 7.85547 14.6665 8 14.6665C8.14453 14.6665 8.28515 14.6195 8.40067 14.5327Z" stroke="#6B7280" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_2" d="M8 8.66667C9.10457 8.66667 10 7.77124 10 6.66667C10 5.5621 9.10457 4.66667 8 4.66667C6.89543 4.66667 6 5.5621 6 6.66667C6 7.77124 6.89543 8.66667 8 8.66667Z" stroke="#6B7280" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-pin-value.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="map-pin">
+<path id="Vector" d="M9.4507 16.35C10.8456 15.1454 14.9994 11.2451 14.9994 7.49996C14.9994 5.90851 14.3673 4.38224 13.2422 3.25692C12.1171 2.1316 10.5911 1.4994 9 1.4994C7.40886 1.4994 5.88289 2.1316 4.75778 3.25692C3.63268 4.38224 3.0006 5.90851 3.0006 7.49996C3.0006 11.2451 7.15443 15.1454 8.5493 16.35C8.67924 16.4478 8.83742 16.5006 9 16.5006C9.16258 16.5006 9.32076 16.4478 9.4507 16.35Z" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-pin-white.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="map-pin">
+<path id="Vector" d="M9.4507 16.35C10.8456 15.1454 14.9994 11.2451 14.9994 7.49996C14.9994 5.90851 14.3673 4.38224 13.2422 3.25692C12.1171 2.1316 10.5911 1.4994 9 1.4994C7.40886 1.4994 5.88289 2.1316 4.75778 3.25692C3.63268 4.38224 3.0006 5.90851 3.0006 7.49996C3.0006 11.2451 7.15443 15.1454 8.5493 16.35C8.67924 16.4478 8.83742 16.5006 9 16.5006C9.16258 16.5006 9.32076 16.4478 9.4507 16.35Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-plus.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="plus">
+<path id="Vector" d="M3.7494 9H14.2506M9 3.7494V14.2506" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-search-dark.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="search">
+<path id="Vector" d="M15.7501 15.7501L12.4951 12.4951M14.25 8.25C14.25 11.5637 11.5637 14.25 8.25 14.25C4.93629 14.25 2.25 11.5637 2.25 8.25C2.25 4.93629 4.93629 2.25 8.25 2.25C11.5637 2.25 14.25 4.93629 14.25 8.25Z" stroke="#606978" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-search.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="search">
+<path id="Vector" d="M15.7501 15.7501L12.4951 12.4951M14.25 8.25C14.25 11.5637 11.5637 14.25 8.25 14.25C4.93629 14.25 2.25 11.5637 2.25 8.25C2.25 4.93629 4.93629 2.25 8.25 2.25C11.5637 2.25 14.25 4.93629 14.25 8.25Z" stroke="#606978" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-store.svg

@@ -0,0 +1,9 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="store">
+<path id="Vector" d="M2 7L6.41 2.59C6.59606 2.40283 6.81732 2.25434 7.06103 2.15308C7.30474 2.05182 7.56609 1.99979 7.83 2H16.17C16.4339 1.99979 16.6953 2.05182 16.939 2.15308C17.1827 2.25434 17.4039 2.40283 17.59 2.59L22 7" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_2" d="M4 12V20C4 20.5304 4.21071 21.0391 4.58579 21.4142C4.96086 21.7893 5.46957 22 6 22H18C18.5304 22 19.0391 21.7893 19.4142 21.4142C19.7893 21.0391 20 20.5304 20 20V12" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_3" d="M15 22V18C15 17.4696 14.7893 16.9609 14.4142 16.5858C14.0391 16.2107 13.5304 16 13 16H11C10.4696 16 9.96086 16.2107 9.58579 16.5858C9.21071 16.9609 9 17.4696 9 18V22" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_4" d="M2 7H22" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_5" d="M22 7V10C22 10.5304 21.7893 11.0391 21.4142 11.4142C21.0391 11.7893 20.5304 12 20 12C19.4157 11.9678 18.8577 11.7467 18.41 11.37C18.2907 11.2838 18.1472 11.2374 18 11.2374C17.8528 11.2374 17.7093 11.2838 17.59 11.37C17.1423 11.7467 16.5843 11.9678 16 12C15.4157 11.9678 14.8577 11.7467 14.41 11.37C14.2907 11.2838 14.1472 11.2374 14 11.2374C13.8528 11.2374 13.7093 11.2838 13.59 11.37C13.1423 11.7467 12.5843 11.9678 12 12C11.4157 11.9678 10.8577 11.7467 10.41 11.37C10.2907 11.2838 10.1472 11.2374 10 11.2374C9.85279 11.2374 9.70932 11.2838 9.59 11.37C9.14227 11.7467 8.58426 11.9678 8 12C7.41574 11.9678 6.85773 11.7467 6.41 11.37C6.29068 11.2838 6.14721 11.2374 6 11.2374C5.85279 11.2374 5.70932 11.2838 5.59 11.37C5.14227 11.7467 4.58426 11.9678 4 12C3.46957 12 2.96086 11.7893 2.58579 11.4142C2.21071 11.0391 2 10.5304 2 10V7" stroke="#D34860" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/core-x.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="x">
+<path id="Vector" d="M12 4L4 12M4 4L12 12" stroke="white" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/heart.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="heart">
+<path id="Vector" d="M2.47284 5.31987C1.94735 6.08397 1.66602 6.9895 1.666 7.91684C1.666 9.83352 2.9161 11.2502 4.16619 12.5002L8.75654 16.9436C8.91408 17.12 9.10734 17.2608 9.32349 17.3567C9.53964 17.4526 9.77374 17.5015 10.0102 17.5C10.2467 17.4985 10.4801 17.4467 10.6951 17.348C10.91 17.2494 11.1014 17.1061 11.2567 16.9278L15.8338 12.5002C17.0839 11.2502 18.3339 9.82519 18.3339 7.91684C18.3384 6.98746 18.0596 6.07878 17.5348 5.31173C17.01 4.54468 16.264 3.95565 15.3961 3.62303C14.5282 3.29042 13.5796 3.22999 12.6765 3.4498C11.7735 3.6696 10.9587 4.15922 10.3408 4.85348C10.2972 4.90015 10.2444 4.93737 10.1858 4.96281C10.1271 4.98825 10.0639 5.00138 9.99997 5.00138C9.93606 5.00138 9.87282 4.98825 9.81419 4.96281C9.75556 4.93737 9.70277 4.90015 9.65911 4.85348C9.03925 4.1637 8.22473 3.67817 7.32311 3.461C6.4215 3.24383 5.47521 3.30524 4.60923 3.63713C3.74326 3.96902 2.99833 4.55576 2.47284 5.31987Z" stroke="#D34860" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/logout.svg

@@ -0,0 +1,7 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="icon-logOut">
+<path id="Vector" d="M6 14H3.33333C2.97971 14 2.64057 13.8595 2.39052 13.6095C2.14048 13.3594 2 13.0203 2 12.6667V3.33333C2 2.97971 2.14048 2.64057 2.39052 2.39052C2.64057 2.14048 2.97971 2 3.33333 2H6" stroke="#D34860" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_2" d="M10.6667 11.3333L14 8L10.6667 4.66667" stroke="#D34860" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_3" d="M14 8H6" stroke="#D34860" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/src/assets/icons/map-pin.svg

@@ -0,0 +1,5 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="map-pin">
+<path id="Vector" d="M7.35055 12.7167C8.43544 11.7798 11.6662 8.74615 11.6662 5.8333C11.6662 4.59551 11.1746 3.40841 10.2995 2.53316C9.42442 1.65791 8.23755 1.1662 7 1.1662C5.76245 1.1662 4.57558 1.65791 3.7005 2.53316C2.82542 3.40841 2.3338 4.59551 2.3338 5.8333C2.3338 8.74615 5.56456 11.7798 6.64945 12.7167C6.75052 12.7927 6.87355 12.8338 7 12.8338C7.12645 12.8338 7.24948 12.7927 7.35055 12.7167Z" stroke="#606978" stroke-width="2" stroke-linecap="round"/>
+</g>
+</svg>

package/src/assets/icons/package-read.svg

@@ -0,0 +1,8 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="icon-package">
+<path id="Vector" d="M5.625 3.2025L12.375 7.065" stroke="#606978" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_2" d="M15.75 6C15.7497 5.73696 15.6803 5.47861 15.5487 5.25087C15.417 5.02314 15.2278 4.83402 15 4.7025L9.75 1.7025C9.52197 1.57085 9.2633 1.50154 9 1.50154C8.7367 1.50154 8.47803 1.57085 8.25 1.7025L3 4.7025C2.7722 4.83402 2.58299 5.02314 2.45135 5.25087C2.31971 5.47861 2.25027 5.73696 2.25 6V12C2.25027 12.263 2.31971 12.5214 2.45135 12.7491C2.58299 12.9769 2.7722 13.166 3 13.2975L8.25 16.2975C8.47803 16.4292 8.7367 16.4985 9 16.4985C9.2633 16.4985 9.52197 16.4292 9.75 16.2975L15 13.2975C15.2278 13.166 15.417 12.9769 15.5487 12.7491C15.6803 12.5214 15.7497 12.263 15.75 12V6Z" stroke="#606978" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_3" d="M2.475 5.25L9 9L15.525 5.25" stroke="#606978" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector_4" d="M9 16.5V9" stroke="#606978" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>