Skip to content

Commit f2be923

Browse files
lsagetlethiaslsagetlethias
committed
unstyled tweak and fix picto
1 parent 0a430b0 commit f2be923

9 files changed

Lines changed: 87 additions & 68 deletions

File tree

‎.storybook/DocsContainer.tsx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
import React, { PropsWithChildren, useEffect } from "react";
2-
import { DocsContainer as BaseContainer, DocsContainerProps } from "@storybook/addon-docs/blocks";
2+
import {
3+
DocsContainer as BaseContainer,
4+
DocsContainerProps,
5+
Unstyled
6+
} from "@storybook/addon-docs/blocks";
37
import { useDarkMode } from "@vueless/storybook-dark-mode";
48
import { darkTheme, lightTheme } from "./customTheme";
59
import "../dist/dsfr/utility/icons/icons.min.css";
@@ -49,7 +53,9 @@ export const DocsContainer = ({ children, ...rest }: PropsWithChildren<DocsConta
4953
5054
`}</style>
5155
<BaseContainer {...rest} theme={isStorybookUiDark ? darkTheme : lightTheme}>
52-
<MuiDsfrThemeProvider>{children}</MuiDsfrThemeProvider>
56+
<MuiDsfrThemeProvider>
57+
<Unstyled>{children}</Unstyled>
58+
</MuiDsfrThemeProvider>
5359
</BaseContainer>
5460
</>
5561
);

‎.storybook/main.ts‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,18 +6,19 @@ export default {
66
options: {}
77
},
88
features: {
9-
controls: true
9+
controls: true,
10+
viewport: true,
11+
backgrounds: false
1012
},
1113
stories: [
1214
"../stories/*.mdx",
1315
"../stories/*.stories.@(ts|tsx)",
1416
"../stories/blocks/*.stories.@(ts|tsx)",
15-
"../stories/charts/*.stories.@(ts|tsx)",
16-
"../stories/picto/*.stories.@(ts|tsx)"
17+
"../stories/charts/*.stories.@(ts|tsx)"
1718
],
1819
addons: [
19-
"@storybook/addon-links",
2020
"@vueless/storybook-dark-mode",
21+
"@storybook/addon-links",
2122
"@storybook/addon-a11y",
2223
"@storybook/addon-docs"
2324
],

‎.storybook/preview.tsx‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
1+
import { IndexEntry } from "storybook/internal/types";
12
import { darkTheme, lightTheme } from "./customTheme";
23
import { DocsContainer } from "./DocsContainer";
3-
import { Parameters, Preview } from "@storybook/react-vite";
4+
import { Preview } from "@storybook/react-vite";
5+
6+
console.log("COUCOU from preview.tsx");
47

58
const preview: Preview = {
69
tags: ["autodocs"],
@@ -12,8 +15,9 @@ const preview: Preview = {
1215
"date": /Date$/
1316
}
1417
},
15-
"backgrounds": { disable: true },
18+
"backgrounds": { disabled: true },
1619
"darkMode": {
20+
"stylePreview": true,
1721
"light": lightTheme,
1822
"dark": darkTheme
1923
},
@@ -95,8 +99,8 @@ const preview: Preview = {
9599
}
96100
},
97101
"options": {
98-
"storySort": (a: any, b: any) =>
99-
getHardCodedWeight(b[1].kind) - getHardCodedWeight(a[1].kind)
102+
"storySort": (a: IndexEntry, b: IndexEntry) =>
103+
getHardCodedWeight(b.title) - getHardCodedWeight(a.title)
100104
}
101105
}
102106
};

‎package.json‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -83,10 +83,10 @@
8383
"@gouvfr/dsfr-chart": "^1.0.0",
8484
"@mui/icons-material": "^5.14.18",
8585
"@mui/material": "^5.14.18",
86-
"@storybook/addon-a11y": "10.1.10",
87-
"@storybook/addon-docs": "10.1.10",
88-
"@storybook/addon-links": "10.1.10",
89-
"@storybook/react-vite": "^10.1.10",
86+
"@storybook/addon-a11y": "10.1.11",
87+
"@storybook/addon-docs": "10.1.11",
88+
"@storybook/addon-links": "10.1.11",
89+
"@storybook/react-vite": "^10.1.11",
9090
"@tanstack/react-virtual": "^3.0.0-beta.39",
9191
"@types/css": "^0.0.33",
9292
"@types/jsdom": "^21.1.7",
@@ -104,7 +104,7 @@
104104
"css": "^3.0.0",
105105
"eslint": "^8",
106106
"eslint-config-prettier": "^8.3.0",
107-
"eslint-plugin-storybook": "10.1.10",
107+
"eslint-plugin-storybook": "10.1.11",
108108
"evt": "^2.4.2",
109109
"fzf": "^0.5.1",
110110
"husky": "^4.3.8",
@@ -120,7 +120,7 @@
120120
"react": "18.2.0",
121121
"react-dom": "18.2.0",
122122
"remixicon": "^4.2.0",
123-
"storybook": "10.1.10",
123+
"storybook": "10.1.11",
124124
"svgo": "^3.3.2",
125125
"ts-node": "^10.9.1",
126126
"tss-react": "^4.9.1",

‎stories/getStory.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React, { useEffect, createContext, useContext } from "react";
22
import type { ComponentType, ReactNode } from "react";
3-
import type { ArgTypes, Meta, StoryFn, StoryObj } from "@storybook/react-vite";
3+
import type { ArgTypes, Meta, StoryFn } from "@storybook/react-vite";
44
import { symToStr } from "tsafe/symToStr";
55
import { id } from "tsafe/id";
66
import { useIsDark } from "../dist/useIsDark";

‎stories/picto/Pictograms.tsx‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createElement, useState } from "react";
2-
import { Source } from "@storybook/components";
2+
import { Source } from "@storybook/addon-docs/blocks";
33
import { Search } from "./Search";
44
import { useConst } from "powerhooks/useConst";
55
import { Evt } from "evt";
@@ -12,8 +12,11 @@ import { Tooltip } from "../../dist/Tooltip";
1212
import CallOut from "../../dist/CallOut";
1313
import { getLink } from "../../dist/link";
1414
import { useColors } from "../../dist/useColors";
15+
import React from "react";
16+
import { PictoProps } from "../../dist/picto/utils/PictoWrapper";
1517

16-
const pictogrameEntries = Object.entries(Picto);
18+
type PictogramKey = keyof typeof Picto;
19+
const pictogrameEntries = Object.entries(Picto) as [PictogramKey, React.FC<PictoProps>][];
1720

1821
const modal = createModal({
1922
id: "foo-modal",
@@ -28,7 +31,7 @@ export function Pictograms() {
2831
const filteredPictograms = pictogrameEntries.filter(([key]) =>
2932
key.toLowerCase().includes(search.toLowerCase())
3033
);
31-
const [selectedPicto, setSelectedPicto] = useState<{ key: string } | null>(null);
34+
const [selectedPicto, setSelectedPicto] = useState<{ key: PictogramKey } | null>(null);
3235

3336
const evtSearchAction = useConst(() => Evt.create<"scroll to">());
3437

@@ -87,7 +90,11 @@ export function Pictograms() {
8790
);
8891
}
8992

90-
const PictogramsModal = ({ selectedPicto }: { selectedPicto: { key: string } | null }) => {
93+
const PictogramsModal = ({
94+
selectedPicto
95+
}: {
96+
selectedPicto: { key: keyof typeof Picto } | null;
97+
}) => {
9198
const { isDark } = useColors();
9299
const { classes } = useStyles();
93100

@@ -101,6 +108,7 @@ const PictogramsModal = ({ selectedPicto }: { selectedPicto: { key: string } | n
101108
<Source
102109
language="tsx"
103110
code={`import ${selectedPicto.key} from "@codegouvfr/react-dsfr/picto/${selectedPicto.key}";`}
111+
dark={isDark}
104112
/>
105113
<div
106114
style={{

‎stories/picto/Search.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { SearchBar } from "../../dist/SearchBar";
44
import { fr } from "../../dist/fr";
55
import { NonPostableEvt } from "evt";
66
import { useEvt } from "evt/hooks";
7+
import React from "react";
78

89
export type Props = {
910
className?: string;

‎stories/sectionName.ts‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎yarn.lock‎

Lines changed: 46 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -991,47 +991,47 @@
991991
lodash.union "^4.6.0"
992992
lodash.values "^4.3.0"
993993

994-
"@storybook/addon-a11y@10.1.10":
995-
version "10.1.10"
996-
resolved "https://registry.yarnpkg.com/@storybook/addon-a11y/-/addon-a11y-10.1.10.tgz#92b07890c0f1d3a2aa4b908154b32e15510ab981"
997-
integrity sha512-lXVFywCSdA39uCR0KEFz3F6WTjzoqSi5gQYtWrFelzaUiMH46uBLHPYaKlpUuNbTL/o9ctrhX1YNzegujrXSoQ==
994+
"@storybook/addon-a11y@10.1.11":
995+
version "10.1.11"
996+
resolved "https://registry.yarnpkg.com/@storybook/addon-a11y/-/addon-a11y-10.1.11.tgz#841c80aa9c9d913e07ffd8fd9622dc25757153ba"
997+
integrity sha512-3sr6HmcDgW1+TQAV9QtWBE3HlGyfFXVZY3RECTNLNH6fRC+rYQCItisvQIVxQpyftLSQ8EAMN9JQzs495MjWNg==
998998
dependencies:
999999
"@storybook/global" "^5.0.0"
10001000
axe-core "^4.2.0"
10011001

1002-
"@storybook/addon-docs@10.1.10":
1003-
version "10.1.10"
1004-
resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-10.1.10.tgz#94116fb33b568caf7eb21abc0806714371de5747"
1005-
integrity sha512-PSJVtawnGNrEkeLJQn9TTdeqrtDij8onvmnFtfkDaFG5IaUdQaLX9ibJ4gfxYakq+BEtlCcYiWErNJcqDrDluQ==
1002+
"@storybook/addon-docs@10.1.11":
1003+
version "10.1.11"
1004+
resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-10.1.11.tgz#8b8bb3e53a10577e1029a84e69034b79da426479"
1005+
integrity sha512-Jwm291Fhim2eVcZIVlkG1B2skb0ZI9oru6nqMbJxceQZlvZmcIa4oxvS1oaMTKw2DJnCv97gLm57P/YvRZ8eUg==
10061006
dependencies:
10071007
"@mdx-js/react" "^3.0.0"
1008-
"@storybook/csf-plugin" "10.1.10"
1008+
"@storybook/csf-plugin" "10.1.11"
10091009
"@storybook/icons" "^2.0.0"
1010-
"@storybook/react-dom-shim" "10.1.10"
1010+
"@storybook/react-dom-shim" "10.1.11"
10111011
react "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
10121012
react-dom "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
10131013
ts-dedent "^2.0.0"
10141014

1015-
"@storybook/addon-links@10.1.10":
1016-
version "10.1.10"
1017-
resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-10.1.10.tgz#fc405897eff95ad5a70659063bb094cc91901f01"
1018-
integrity sha512-SVKFDb14mne16QMGkmOEk+T4NLvCuFJJ1ecebQ01cPiG5gM72LhzYkAro717Aizd6owyMqcWs0Rsfwl09qi5zA==
1015+
"@storybook/addon-links@10.1.11":
1016+
version "10.1.11"
1017+
resolved "https://registry.yarnpkg.com/@storybook/addon-links/-/addon-links-10.1.11.tgz#777c119003e0aaf925d3166e40daec45f8090a8b"
1018+
integrity sha512-PEC+Fn3fyBOlMlCcLX+AUunrQMcH7MEfiFtPkp7QnjfMGwBIyzCjgVxM2OyKyIslQnB1So1pY98uTI26fXz/yg==
10191019
dependencies:
10201020
"@storybook/global" "^5.0.0"
10211021

1022-
"@storybook/builder-vite@10.1.10":
1023-
version "10.1.10"
1024-
resolved "https://registry.yarnpkg.com/@storybook/builder-vite/-/builder-vite-10.1.10.tgz#24e35759ac7e3ce97265a0a47e357aa73991eb61"
1025-
integrity sha512-6m6zOyDhHLynv3lvkH70s1YoIkIFPhbpGsBKvHchRLrZLe8hCPeafIFLfZRPoD4yIPwBS6rWbjMsSvBMFlR+ag==
1022+
"@storybook/builder-vite@10.1.11":
1023+
version "10.1.11"
1024+
resolved "https://registry.yarnpkg.com/@storybook/builder-vite/-/builder-vite-10.1.11.tgz#877746967f9465e91ecf794f2bcec913321215e6"
1025+
integrity sha512-MMD09Ap7FyzDfWG961pkIMv/w684XXe1bBEi+wCEpHxvrgAd3j3A9w/Rqp9Am2uRDPCEdi1QgSzS3SGW3aGThQ==
10261026
dependencies:
1027-
"@storybook/csf-plugin" "10.1.10"
1027+
"@storybook/csf-plugin" "10.1.11"
10281028
"@vitest/mocker" "3.2.4"
10291029
ts-dedent "^2.0.0"
10301030

1031-
"@storybook/csf-plugin@10.1.10":
1032-
version "10.1.10"
1033-
resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-10.1.10.tgz#65c905cfc6f7b98928fd26691d8eec6b5da3ded1"
1034-
integrity sha512-2dri4TRU8uuj/skmx/ZBw+GnnXf8EZHiMDMeijVRdBQtYFWPeoYzNIrGRpNfbuGpnDP0dcxrqti/TsedoxwFkA==
1031+
"@storybook/csf-plugin@10.1.11":
1032+
version "10.1.11"
1033+
resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-10.1.11.tgz#27f3166f3fe1bb708b61ece4141ce400dc11ad1d"
1034+
integrity sha512-Ant0NhgqHKzQsseeVTSetZCuDHHs0W2HRkHt51Kg/sUl0T/sDtfVA+fWZT8nGzGZqYSFkxqYPWjauPmIhPtaRw==
10351035
dependencies:
10361036
unplugin "^2.3.5"
10371037

@@ -1045,33 +1045,33 @@
10451045
resolved "https://registry.yarnpkg.com/@storybook/icons/-/icons-2.0.1.tgz#1bd351db1d33bfccbbafa7b64fb413168f1a6616"
10461046
integrity sha512-/smVjw88yK3CKsiuR71vNgWQ9+NuY2L+e8X7IMrFjexjm6ZR8ULrV2DRkTA61aV6ryefslzHEGDInGpnNeIocg==
10471047

1048-
"@storybook/react-dom-shim@10.1.10":
1049-
version "10.1.10"
1050-
resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-10.1.10.tgz#7a749e1aa0427de9ee6c6f924176892208ec4eeb"
1051-
integrity sha512-9pmUbEr1MeMHg9TG0c2jVUfHWr2AA86vqZGphY/nT6mbe/rGyWtBl5EnFLrz6WpI8mo3h+Kxs6p2oiuIYieRtw==
1048+
"@storybook/react-dom-shim@10.1.11":
1049+
version "10.1.11"
1050+
resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-10.1.11.tgz#8921d4fe0f579bd1f451d54ae4a9a9d71d1d5a3c"
1051+
integrity sha512-o8WPhRlZbORUWG9lAgDgJP0pi905VHJUFJr1Kp8980gHqtlemtnzjPxKy5vFwj6glNhAlK8SS8OOYzWP7hloTQ==
10521052

1053-
"@storybook/react-vite@^10.1.10":
1054-
version "10.1.10"
1055-
resolved "https://registry.yarnpkg.com/@storybook/react-vite/-/react-vite-10.1.10.tgz#6d3ec90999e645235d76d787b4461c08635bfade"
1056-
integrity sha512-6kE4/88YuwO07P0DR6caKNDNvCB/VnpimPmj4Jv6qmqrBgnoOOiXHIKyHJD+EjNyrbbwv4ygG01RVEajpjQaDA==
1053+
"@storybook/react-vite@^10.1.11":
1054+
version "10.1.11"
1055+
resolved "https://registry.yarnpkg.com/@storybook/react-vite/-/react-vite-10.1.11.tgz#aff3728ca284f4ed3ae0fd2891b5da7897edb3a3"
1056+
integrity sha512-qh1BCD25nIoiDfqwha+qBkl7pcG4WuzM+c8tsE63YEm8AFIbNKg5K8lVUoclF+4CpFz7IwBpWe61YUTDfp+91w==
10571057
dependencies:
10581058
"@joshwooding/vite-plugin-react-docgen-typescript" "^0.6.3"
10591059
"@rollup/pluginutils" "^5.0.2"
1060-
"@storybook/builder-vite" "10.1.10"
1061-
"@storybook/react" "10.1.10"
1060+
"@storybook/builder-vite" "10.1.11"
1061+
"@storybook/react" "10.1.11"
10621062
empathic "^2.0.0"
10631063
magic-string "^0.30.0"
10641064
react-docgen "^8.0.0"
10651065
resolve "^1.22.8"
10661066
tsconfig-paths "^4.2.0"
10671067

1068-
"@storybook/react@10.1.10":
1069-
version "10.1.10"
1070-
resolved "https://registry.yarnpkg.com/@storybook/react/-/react-10.1.10.tgz#ac5202fd178d9f352db9c38b6c7e36626b0ce337"
1071-
integrity sha512-9Rpr8/wX0p5/EaulrxpqrjKjhGaA/Ab9HgxzTqs2Shz0gvMAQHoiRnTEp7RCCkP49ruFYnIp0yGRSovu03LakQ==
1068+
"@storybook/react@10.1.11":
1069+
version "10.1.11"
1070+
resolved "https://registry.yarnpkg.com/@storybook/react/-/react-10.1.11.tgz#365662c8db7822508dec5ae17b848dd8c9b1ab9c"
1071+
integrity sha512-rmMGmEwBaM2YpB8oDk2moM0MNjNMqtwyoPPZxjyruY9WVhYca8EDPGKEdRzUlb4qZJsTgLi7VU4eqg6LD/mL3Q==
10721072
dependencies:
10731073
"@storybook/global" "^5.0.0"
1074-
"@storybook/react-dom-shim" "10.1.10"
1074+
"@storybook/react-dom-shim" "10.1.11"
10751075
react-docgen "^8.0.2"
10761076

10771077
"@swc/helpers@0.5.2":
@@ -2873,10 +2873,10 @@ eslint-config-prettier@^8.3.0:
28732873
resolved "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.5.0.tgz"
28742874
integrity sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==
28752875

2876-
eslint-plugin-storybook@10.1.10:
2877-
version "10.1.10"
2878-
resolved "https://registry.yarnpkg.com/eslint-plugin-storybook/-/eslint-plugin-storybook-10.1.10.tgz#030a55e58a5e96a513cbf873434a840abdaf6a7d"
2879-
integrity sha512-ITr6Aq3buR/DuDATkq1BafUVJLybyo676fY+tj9Zjd1Ak+UXBAMQcQ++tiBVVHm1RqADwM3b1o6bnWHK2fPPKw==
2876+
eslint-plugin-storybook@10.1.11:
2877+
version "10.1.11"
2878+
resolved "https://registry.yarnpkg.com/eslint-plugin-storybook/-/eslint-plugin-storybook-10.1.11.tgz#80ea073c30ff6948fe34f728ff1c05333eb8579f"
2879+
integrity sha512-mbq2r2kK5+AcLl0XDJ3to91JOgzCbHOqj+J3n+FRw6drk+M1boRqMShSoMMm0HdzXPLmlr7iur+qJ5ZuhH6ayQ==
28802880
dependencies:
28812881
"@typescript-eslint/utils" "^8.8.1"
28822882

@@ -5239,10 +5239,10 @@ sprintf-js@~1.0.2:
52395239
resolved "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz"
52405240
integrity sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==
52415241

5242-
storybook@10.1.10:
5243-
version "10.1.10"
5244-
resolved "https://registry.yarnpkg.com/storybook/-/storybook-10.1.10.tgz#9023e063f97cb2c38b4520e03d49336bcbf6661f"
5245-
integrity sha512-oK0t0jEogiKKfv5Z1ao4Of99+xWw1TMUGuGRYDQS4kp2yyBsJQEgu7NI7OLYsCDI6gzt5p3RPtl1lqdeVLUi8A==
5242+
storybook@10.1.11:
5243+
version "10.1.11"
5244+
resolved "https://registry.yarnpkg.com/storybook/-/storybook-10.1.11.tgz#cdd75835eebad45edc93129f9468a32eb6c1f4bd"
5245+
integrity sha512-pKP5jXJYM4OjvNklGuHKO53wOCAwfx79KvZyOWHoi9zXUH5WVMFUe/ZfWyxXG/GTcj0maRgHGUjq/0I43r0dDQ==
52465246
dependencies:
52475247
"@storybook/global" "^5.0.0"
52485248
"@storybook/icons" "^2.0.0"

0 commit comments

Comments
 (0)