From 94c29ed8a60f864b56259bfb4b19936fc5e6c68a Mon Sep 17 00:00:00 2001 From: Arnaud Date: Wed, 6 Nov 2024 19:56:37 +0100 Subject: [PATCH] Fix storybook config --- src/assets/icons/audio-file.svg | 11 +++++++---- src/assets/icons/doc-file.svg | 11 +++++++---- src/assets/icons/excel-file.svg | 11 +++++++---- src/assets/icons/image-file.svg | 9 ++++++--- src/assets/icons/pdf-file.svg | 9 ++++++--- src/assets/icons/zip.svg | 20 +++++++++++++------- stories/Dropdown.stories.tsx | 7 +++---- vite-storybook.config.ts | 11 ++++++++++- 8 files changed, 59 insertions(+), 30 deletions(-) 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 @@ + 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="M568.78 446.464V675.84a27.238 27.238 0 0 1-6.793 18.248 45.66 45.66 0 0 1-17.316 12.38 112.64 112.64 0 0 1-20.803 6.518c-6.937 1.438-13.404 2.186-19.41 2.186-6.052 0-12.523-.748-19.41-2.14a112.456 112.456 0 0 1-20.807-6.564 45.706 45.706 0 0 1-17.316-12.38 27.228 27.228 0 0 1-6.84-18.248c0-6.84 2.33-12.892 6.84-18.248a45.706 45.706 0 0 1 17.316-12.38c6.983-2.934 13.916-5.12 20.807-6.518 6.887-1.484 13.358-2.186 19.405-2.186 14.06 0 26.952 2.652 38.636 8.008V534.528l-154.481 48.548v145.218a27.228 27.228 0 0 1-6.8 18.202 45.66 45.66 0 0 1-17.315 12.38 112.64 112.64 0 0 1-20.803 6.564c-6.937 1.398-13.404 2.14-19.41 2.14-6.052 0-12.523-.696-19.41-2.14a112.502 112.502 0 0 1-20.807-6.518 45.706 45.706 0 0 1-17.311-12.426 27.233 27.233 0 0 1-6.845-18.248c0-6.794 2.33-12.892 6.845-18.196a45.706 45.706 0 0 1 17.31-12.38c6.984-2.934 13.922-5.12 20.808-6.564a94.802 94.802 0 0 1 19.405-2.14c14.06 0 26.957 2.652 38.636 7.956V498.872a19.876 19.876 0 0 1 13.685-18.846l167.286-52.414a17.63 17.63 0 0 1 5.581-.84c5.402 0 9.964 1.91 13.686 5.73 3.773 3.86 5.632 8.468 5.632 13.962z" + /> 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 @@ + 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="M427.377 725.32V768H259.814v-42.68h167.563zM594.944 640v42.68h-335.13V640h335.13zm0-85.32v42.64h-335.13v-42.64h335.13zm0-85.36V512h-335.13v-42.68h335.13z" + /> 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 @@ + 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="M594.616 426.824v.23h.092V768h-27.873v-.051h-83.968.046-83.143.05-139.919v-28.39l.052-.047v-85.826h-.052V625.29h.052v-85.826h-.098v-28.396l.093-.046v-55.854h-.093v-28.39h334.71l.046.046zM371.988 653.686h-84.106v85.826h84.106v-85.826zm83.083 0h-55.245v85.826h55.199v-85.826h.05zm111.76 0h-83.923v85.826h83.876v-85.826h.046zM371.987 539.459h-84.106v85.831h84.106v-85.826zm83.083 0h-55.245v85.831h55.199v-85.826h.05zm111.76 0h-83.923v85.831h83.876v-85.826h.046zm0-84.245H287.881v55.808h278.902v-55.854l.046.051z" + /> 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 @@ + fill="#36D2AD" + /> + fill-opacity="0.4" + /> + fill="#FFFFFF" + /> 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 @@ + fill="#E94848" + /> + fill="#FFFFFF" + /> + fill-opacity=".4" + /> 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"],