diff --git a/src/assets/icons/audio-file.svg b/src/assets/icons/audio-file.svg
index f635150..dad7952 100644
--- a/src/assets/icons/audio-file.svg
+++ b/src/assets/icons/audio-file.svg
@@ -1,12 +1,15 @@
diff --git a/src/assets/icons/doc-file.svg b/src/assets/icons/doc-file.svg
index b824141..672dab4 100644
--- a/src/assets/icons/doc-file.svg
+++ b/src/assets/icons/doc-file.svg
@@ -1,12 +1,15 @@
diff --git a/src/assets/icons/excel-file.svg b/src/assets/icons/excel-file.svg
index c14ad5c..8089acc 100644
--- a/src/assets/icons/excel-file.svg
+++ b/src/assets/icons/excel-file.svg
@@ -1,12 +1,15 @@
diff --git a/src/assets/icons/image-file.svg b/src/assets/icons/image-file.svg
index 7b1b236..87a7d15 100644
--- a/src/assets/icons/image-file.svg
+++ b/src/assets/icons/image-file.svg
@@ -1,12 +1,15 @@
diff --git a/src/assets/icons/pdf-file.svg b/src/assets/icons/pdf-file.svg
index ff2cc2a..3170bed 100644
--- a/src/assets/icons/pdf-file.svg
+++ b/src/assets/icons/pdf-file.svg
@@ -1,12 +1,15 @@
diff --git a/src/assets/icons/zip.svg b/src/assets/icons/zip.svg
index 075c4bc..7fe7a7f 100644
--- a/src/assets/icons/zip.svg
+++ b/src/assets/icons/zip.svg
@@ -2,21 +2,27 @@
xmlns="http://www.w3.org/2000/svg"
className="svg-icon"
fill="currentColor"
- viewBox="0 0 1024 1024">
+ viewBox="0 0 1024 1024"
+>
+ d="m594.944 0 335.124 341.32v563.2c0 65.996-52.5 119.48-117.294 119.48H209.546c-64.793 0-117.299-53.53-117.299-119.48V119.48C92.252 53.484 144.757 0 209.551 0h385.393z"
+ />
+ fill-opacity="0.4"
+ d="M930.068 341.32H718.152c-64.748 0-123.208-59.49-123.208-125.492V0l335.124 341.32z"
+ />
+ d="M516.838 438.042h-31.283c-2.227 0-3.348 1.162-4.464 2.278-1.117 1.116-1.117 3.4-1.117 5.683 2.233 4.557 3.354 10.24 3.354 14.797v147.917l3.348 22.763c0 2.284 2.233 3.4 3.354 4.516 1.116 0 2.232 1.162 2.232 1.162l5.581 3.4a45.148 45.148 0 0 1 29.051 42.122v51.2c0 2.284 1.116 4.516 3.349 4.516 1.116 0 1.116 1.162 2.237 1.162 1.116 0 2.232 0 3.348-1.162a32.63 32.63 0 0 0 13.405-27.274V472.156a31.652 31.652 0 0 0-32.395-34.114zM376.09 460.8 361.564 512a12.288 12.288 0 0 0 2.232 13.64c4.47 4.556 21.228 4.556 25.693 0a15.2 15.2 0 0 0 3.353-13.64l-14.525-51.2h-2.233z"
+ />
+ d="M366.029 453.96c1.121-3.4 3.353-4.516 5.586-4.516h11.172c2.237 0 4.47 1.116 5.585 4.516l6.708 26.204 8.929-19.364-13.41-31.836v-2.33h-30.151v2.33L349.276 460.8l8.935 21.596 7.818-28.39v-.051z"
+ />
+ d="m354.396 426.68-11.172 31.842v4.556l11.172 28.442a5.975 5.975 0 0 0 3.395 3.02l2.191.38-4.47 13.68a23.644 23.644 0 0 0 5.581 24.996c4.475 4.562 12.288 6.846 21.228 6.846s16.757-2.284 21.227-6.846a24.294 24.294 0 0 0 6.656-21.453l-5.586-18.345c.789 0 1.536-.512 1.956-1.162l.323-1.116 14.525-28.442a3.492 3.492 0 0 0 .742-3.118l-.742-1.392-14.525-31.888h35.747a33.05 33.05 0 0 1 33.234 29.374l.282 4.746v164.956c0 8.796 4.93 15.923 11.96 19.922l11.495 5.12a32.86 32.86 0 0 1 22.016 26.998l.327 4.884v51.2c0 17.69-12.195 31.652-28.856 33.844l-4.66.276H298.548a33.05 33.05 0 0 1-33.234-29.414l-.281-4.706V460.8c0-17.69 12.196-31.652 28.861-33.843l4.654-.277h55.854zm16.753 284.396h-11.162c-3.353 0-5.586 2.324-5.586 5.724 0 2.744 1.393 4.746 3.723 5.448l1.863.23h11.167c3.354 0 5.586-2.278 5.586-5.678 0-2.744-1.393-4.746-3.722-5.448l-1.864-.23v-.051zm33.515-11.356h-11.172c-3.348 0-5.58 2.324-5.58 5.724 0 2.698 1.392 4.7 3.717 5.396l1.863.282h11.172c3.349 0 5.581-2.33 5.581-5.683 0-2.79-1.393-4.741-3.717-5.443l-1.864-.276zm-33.515-11.362h-11.162c-3.353 0-5.586 2.284-5.586 5.684 0 2.744 1.393 4.746 3.723 5.442l1.863.236h11.167c3.354 0 5.586-2.284 5.586-5.684 0-2.744-1.393-4.746-3.722-5.396l-1.864-.282zm33.515-11.402h-11.172c-3.348 0-5.58 2.33-5.58 5.724 0 2.704 1.392 4.706 3.717 5.402l1.863.276h11.172c3.349 0 5.581-2.278 5.581-5.678 0-2.744-1.393-4.746-3.717-5.442l-1.864-.282zM371.15 665.6h-11.162c-3.353 0-5.586 2.278-5.586 5.683 0 2.74 1.393 4.741 3.723 5.443l1.863.23h11.167c3.354 0 5.586-2.232 5.586-5.678 0-2.698-1.393-4.7-3.722-5.396l-1.87-.282zm33.515-11.356h-11.172c-3.348 0-5.58 2.232-5.58 5.678 0 2.698 1.392 4.7 3.717 5.396l1.863.282h11.172c3.349 0 5.581-2.278 5.581-5.683 0-2.74-1.393-4.741-3.717-5.443l-1.864-.23zm-33.515-11.402h-11.162c-3.353 0-5.586 2.278-5.586 5.678 0 2.744 1.393 4.746 3.723 5.442l1.863.282h11.167c3.354 0 5.586-2.33 5.586-5.724 0-2.704-1.393-4.706-3.722-5.402l-1.864-.276zm33.515-11.362h-11.172c-3.348 0-5.58 2.284-5.58 5.684 0 2.744 1.392 4.746 3.717 5.396l1.863.282h11.172c3.349 0 5.581-2.284 5.581-5.684 0-2.744-1.393-4.746-3.717-5.442l-1.864-.236zm-33.515-11.402h-11.162c-3.353 0-5.586 2.33-5.586 5.683 0 2.79 1.393 4.741 3.723 5.443l1.863.276h11.167c3.354 0 5.586-2.324 5.586-5.724 0-2.698-1.393-4.7-3.722-5.396l-1.864-.282zm33.515-11.356h-11.172c-3.348 0-5.58 2.278-5.58 5.678 0 2.744 1.392 4.746 3.717 5.448l1.863.23h11.172c3.349 0 5.581-2.278 5.581-5.678 0-2.744-1.393-4.746-3.717-5.448l-1.864-.23zM371.15 597.32h-11.162c-3.353 0-5.586 2.324-5.586 5.724 0 2.698 1.393 4.7 3.723 5.396l1.863.282h11.167c3.354 0 5.586-2.33 5.586-5.683 0-2.79-1.393-4.741-3.722-5.443l-1.864-.276zm33.515-11.362h-11.172c-3.348 0-5.58 2.284-5.58 5.684 0 2.744 1.392 4.746 3.717 5.442l1.863.236h11.172c3.349 0 5.581-2.284 5.581-5.684 0-2.744-1.393-4.746-3.717-5.396l-1.864-.282zm-33.515-11.402h-11.162c-3.353 0-5.586 2.33-5.586 5.724 0 2.704 1.393 4.706 3.723 5.402l1.863.276h11.167c3.354 0 5.586-2.278 5.586-5.678 0-2.744-1.393-4.746-3.722-5.442l-1.864-.282zm33.515-11.356h-11.172c-3.348 0-5.58 2.278-5.58 5.683 0 2.74 1.392 4.741 3.717 5.443l1.863.23h11.172c3.349 0 5.581-2.232 5.581-5.678 0-2.698-1.393-4.7-3.717-5.396l-1.864-.282zm-33.515-11.356h-11.162c-3.353 0-5.586 2.232-5.586 5.678 0 2.698 1.393 4.7 3.723 5.396l1.863.282h11.167c3.354 0 5.586-2.278 5.586-5.683 0-2.74-1.393-4.741-3.722-5.443l-1.864-.23z"
+ />
diff --git a/stories/Dropdown.stories.tsx b/stories/Dropdown.stories.tsx
index 8610c16..fcb726d 100644
--- a/stories/Dropdown.stories.tsx
+++ b/stories/Dropdown.stories.tsx
@@ -1,9 +1,8 @@
import type { Meta, StoryObj } from "@storybook/react";
import { Dropdown, DropdownOption } from "../src/components/Dropdown/Dropdown";
-import PdfIcon from "../../assets/icons/pdf-file.svg?react";
-import ImageIcon from "../../assets/icons/image-file.svg?react";
import { ChangeEvent, useState } from "react";
import { fn } from "@storybook/test";
+import { WebFileIcon } from "../src/components/WebFileIcon/WebFileIcon";
const meta = {
title: "Forms/Dropdown",
@@ -63,12 +62,12 @@ const Template = (p: Props) => {
options={[
{
title: "File1.pdf",
- Icon: PdfIcon,
+ Icon: () => ,
subtitle: "cid1",
},
{
title: "File2.jpg",
- Icon: ImageIcon,
+ Icon: () => ,
subtitle: "cid2",
},
]}
diff --git a/vite-storybook.config.ts b/vite-storybook.config.ts
index 73e52dc..4308f97 100644
--- a/vite-storybook.config.ts
+++ b/vite-storybook.config.ts
@@ -1,9 +1,18 @@
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
+import svgr from "vite-plugin-svgr";
// https://vitejs.dev/config/
export default defineConfig({
- plugins: [react({ jsxRuntime: "automatic" })],
+ plugins: [react({ jsxRuntime: "automatic" }), svgr({
+ svgrOptions: {
+ plugins: ["@svgr/plugin-svgo", "@svgr/plugin-jsx"],
+ svgoConfig: {
+ floatPrecision: 2,
+ },
+ },
+ // ...
+ })],
worker: {
rollupOptions: {
external: ["@codex-storage/sdk-js"],