feat: add Upload icon with multiple sizes (16, 24, 32) and update index export

src/components/Icons/index.ts

@@ -2,4 +2,5 @@ export { default as Arrow2Icon } from './Arrow2/Arrow2.astro';
 export { default as ProfileIcon } from './profile/profile.astro';
 export { default as ShareIcon } from './share/share.astro';
 export { default as SearchIcon } from './search/search.astro';
-export { default as CloseIcon } from './close/close.astro';
+export { default as CloseIcon } from './close/close.astro';
+export { default as UploadIcon } from './upload/upload.astro';

src/components/Icons/upload/svgs/upload-16.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 6.66667V12.6667M6 8.66667L8 6.66667L10 8.66667M11.6667 10C12.6793 10 13.3333 9.17933 13.3333 8.16667C13.3333 7.76575 13.2018 7.37589 12.9591 7.05681C12.7164 6.73772 12.3757 6.50701 11.9893 6.4C11.9299 5.65231 11.62 4.94651 11.1098 4.39673C10.5996 3.84695 9.91885 3.48531 9.17767 3.37029C8.43649 3.25526 7.67817 3.39357 7.02533 3.76286C6.37248 4.13215 5.86326 4.71082 5.58 5.40533C4.98362 5.24002 4.34599 5.31838 3.80738 5.62319C3.26878 5.928 2.87332 6.43428 2.708 7.03067C2.54268 7.62705 2.62105 8.26468 2.92586 8.80328C3.23067 9.34189 3.73695 9.73735 4.33333 9.90267" stroke="#F4F2EF" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/components/Icons/upload/svgs/upload-24.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 10V19M9 13L12 10L15 13M17.5 15C19.019 15 20 13.769 20 12.25C19.9999 11.6486 19.8028 11.0638 19.4387 10.5852C19.0745 10.1066 18.5636 9.76051 17.984 9.6C17.8948 8.47846 17.43 7.41977 16.6647 6.59509C15.8994 5.77042 14.8783 5.22796 13.7665 5.05543C12.6547 4.88289 11.5173 5.09036 10.538 5.64429C9.55872 6.19822 8.79489 7.06624 8.37 8.108C7.47543 7.86002 6.51898 7.97757 5.71107 8.43478C4.90317 8.892 4.30998 9.65143 4.062 10.546C3.81402 11.4406 3.93157 12.397 4.38878 13.2049C4.846 14.0128 5.60543 14.606 6.5 14.854" stroke="#F4F2EF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/components/Icons/upload/svgs/upload-32.svg

@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 13.3333V25.3333M12 17.3333L16 13.3333L20 17.3333M23.3333 20C25.3587 20 26.6667 18.3587 26.6667 16.3333C26.6666 15.5315 26.4037 14.7518 25.9182 14.1136C25.4327 13.4754 24.7514 13.014 23.9787 12.8C23.8598 11.3046 23.24 9.89302 22.2196 8.79346C21.1992 7.69389 19.8377 6.97062 18.3553 6.74057C16.873 6.51052 15.3563 6.78714 14.0507 7.52572C12.745 8.26429 11.7265 9.42165 11.16 10.8107C9.96723 10.48 8.69197 10.6368 7.61477 11.2464C6.53756 11.856 5.74664 12.8686 5.416 14.0613C5.08536 15.2541 5.24209 16.5294 5.85171 17.6066C6.46133 18.6838 7.4739 19.4747 8.66667 19.8053" stroke="#F4F2EF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/components/Icons/upload/upload.astro

@@ -0,0 +1,27 @@
+---
+import upload16  from './svgs/upload-16.svg?raw';
+import upload24  from './svgs/upload-24.svg?raw';
+import upload32  from './svgs/upload-32.svg?raw';
+
+export interface Props {
+  size:        16 | 24 | 32;
+  label?:       string;
+  class?:       string;
+}
+
+const { size = 24, label, class: className } = Astro.props;
+
+let raw: string;
+if      (size === 16 )  raw = upload16;
+else if (size === 24 )  raw = upload24;
+else if (size === 32 )  raw = upload32;
+else                   raw = ''; // Fallback to a blank string if no match is found, though this should not happen due to the type constraints on size.
+
+
+const classes = ['nds-icon-upload', className].filter(Boolean).join(' ');
+const svg = raw
+  .replace(/fill="#[A-Fa-f0-9]{3,8}"/g, 'fill="currentColor"')
+  .replace('<svg ', `<svg class="${classes}" aria-hidden="${label ? 'false' : 'true'}" ${label ? `aria-label="${label}" role="img"` : ''} `);
+---
+
+<Fragment set:html={svg} />

src/pages/index.astro

@@ -1,6 +1,6 @@
 ---
 import Layout from '../layouts/Layout.astro';
-import { Arrow2Icon, ProfileIcon, ShareIcon, SearchIcon, CloseIcon } from '../components/Icons/index.ts';
+import { Arrow2Icon, ProfileIcon, ShareIcon, SearchIcon, CloseIcon, UploadIcon } from '../components/Icons/index.ts';
 ---
 
 <Layout>
@@ -47,6 +47,11 @@ import { Arrow2Icon, ProfileIcon, ShareIcon, SearchIcon, CloseIcon } from '../co
           <CloseIcon size={24} />
           <CloseIcon size={32} />
         </div>
+        <div class="icon-row">
+          <UploadIcon size={16} />
+          <UploadIcon size={24} />
+          <UploadIcon size={32} />
+        </div>
       </div>
     </section>
   </main>