Skip to content

Commit 716719c

Browse files
TylerAPfleddererTylerAPfledderer
committed
Merge remote-tracking branch 'upstream/dev' into feat/quiz-component-stories
2 parents 30944e5 + 343efc9 commit 716719c

File tree

323 files changed

+6102
-3236
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

323 files changed

+6102
-3236
lines changed

‎.all-contributorsrc

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11320,7 +11320,8 @@
1132011320
"avatar_url": "https://avatars.githubusercontent.com/u/71248977?v=4",
1132111321
"profile": "https://github.com/UNOFFICIALbgd",
1132211322
"contributions": [
11323-
"bug"
11323+
"bug",
11324+
"doc"
1132411325
]
1132511326
},
1132611327
{
@@ -12249,7 +12250,8 @@
1224912250
"avatar_url": "https://avatars.githubusercontent.com/u/73983677?v=4",
1225012251
"profile": "https://github.com/omahs",
1225112252
"contributions": [
12252-
"translation"
12253+
"translation",
12254+
"maintenance"
1225312255
]
1225412256
},
1225512257
{
@@ -12278,6 +12280,33 @@
1227812280
"contributions": [
1227912281
"content"
1228012282
]
12283+
},
12284+
{
12285+
"login": "sandeepV2",
12286+
"name": "Sandeep Belagavi",
12287+
"avatar_url": "https://avatars.githubusercontent.com/u/52043035?v=4",
12288+
"profile": "https://github.com/sandeepV2",
12289+
"contributions": [
12290+
"bug"
12291+
]
12292+
},
12293+
{
12294+
"login": "codingmickey",
12295+
"name": "Kartik Jolapara",
12296+
"avatar_url": "https://avatars.githubusercontent.com/u/42518907?v=4",
12297+
"profile": "https://github.com/codingmickey",
12298+
"contributions": [
12299+
"code"
12300+
]
12301+
},
12302+
{
12303+
"login": "Ekam-Bitt",
12304+
"name": "Ekam Bitt",
12305+
"avatar_url": "https://avatars.githubusercontent.com/u/74407205?v=4",
12306+
"profile": "https://ekam-bitt.github.io",
12307+
"contributions": [
12308+
"maintenance"
12309+
]
1228112310
}
1228212311
],
1228312312
"contributorsPerLine": 7,

‎.lintstagedrc.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ const buildEslintCommand = (filenames) =>
55
.map((f) => path.relative(process.cwd(), f))
66
.join(" --file ")}`
77

8+
const formatCommand = "prettier --write"
9+
810
module.exports = {
9-
"*.{js,jsx,ts,tsx}": [buildEslintCommand],
11+
"*.{js,jsx,ts,tsx}": [buildEslintCommand, formatCommand],
1012
}

‎.prettierrc

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,8 @@
33
"semi": false,
44
"singleQuote": false,
55
"tabWidth": 2,
6-
"trailingComma": "es5"
7-
}
6+
"trailingComma": "es5",
7+
"plugins": [
8+
"prettier-plugin-tailwindcss"
9+
]
10+
}

‎.storybook/ChakraDecorator.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { useEffect, useMemo, useState } from "react"
12
import {
23
ChakraBaseProvider,
34
extendBaseTheme,
@@ -6,7 +7,7 @@ import {
67
import type { Decorator } from "@storybook/react"
78

89
import theme from "../src/@chakra-ui/theme"
9-
import { useEffect, useMemo, useState } from "react"
10+
1011
import i18n from "./i18next"
1112

1213
type DecoratorProps = Parameters<Decorator>

‎.storybook/main.ts

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,22 @@ import type { StorybookConfig } from "@storybook/nextjs"
1616

1717
const config: StorybookConfig = {
1818
stories: [
19-
"../src/components/**/*.stories.tsx",
19+
"../src/components/**/*.stories.{ts,tsx}",
20+
"../src/@chakra-ui/stories/*.stories.tsx",
2021
"../src/layouts/stories/*.stories.tsx",
2122
],
2223
addons: [
2324
"@storybook/addon-links",
24-
"@storybook/addon-essentials",
25+
{
26+
name: "@storybook/addon-essentials",
27+
options: {
28+
backgrounds: false,
29+
},
30+
},
2531
"@storybook/addon-interactions",
2632
"storybook-react-i18next",
27-
"@chromatic-com/storybook"
33+
"@storybook/addon-themes",
34+
"@chromatic-com/storybook",
2835
],
2936
staticDirs: ["../public"],
3037
framework: {
@@ -72,7 +79,7 @@ const config: StorybookConfig = {
7279
},
7380
},
7481

75-
reactDocgen: "react-docgen-typescript"
82+
reactDocgen: "react-docgen-typescript",
7683
},
7784
}
7885
export default config

‎.storybook/modes.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { baseLocales } from "./i18next"
2-
import { chakraBreakpointArray } from "./preview"
2+
import { breakpointSet } from "./preview"
33

4-
export const viewportModes = chakraBreakpointArray.reduce<{
4+
export const viewportModes = breakpointSet.reduce<{
55
[mode: string]: { viewport: string }
66
}>((arr, [token]) => {
77
return {

‎.storybook/preview-head.html

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,3 @@
1-
<style type="text/css">
21

3-
:root {
4-
--font-inter: 'Inter', sans-serif;
5-
}
6-
7-
</style>
8-
9-
<link rel="preload" href="/fonts/inter/latin.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
2+
<link rel="preload" href="/fonts/inter/latin.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
3+
<link rel="preload" href="/fonts/ibm-plex-mono/IBMPlexMono-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous" />

‎.storybook/preview.ts

Lines changed: 0 additions & 95 deletions
This file was deleted.

‎.storybook/preview.tsx

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
import isChromatic from "chromatic/isChromatic"
2+
import { MotionGlobalConfig } from "framer-motion"
3+
import { withThemeByDataAttribute } from "@storybook/addon-themes"
4+
import type { Preview } from "@storybook/react"
5+
6+
import ThemeProvider from "@/components/ThemeProvider"
7+
8+
import i18n, { baseLocales } from "./i18next"
9+
10+
import "../src/styles/global.css"
11+
import "../src/styles/fonts.css"
12+
13+
MotionGlobalConfig.skipAnimations = isChromatic()
14+
15+
export const breakpointSet: [token: string, value: string][] = [
16+
["base", "375px"],
17+
["sm", "640px"],
18+
["md", "768px"],
19+
["lg", "1024px"],
20+
["xl", "1280px"],
21+
["2xl", "1536px"],
22+
]
23+
24+
const preview: Preview = {
25+
globals: {
26+
locale: "en",
27+
locales: baseLocales,
28+
},
29+
decorators: [
30+
withThemeByDataAttribute({
31+
themes: {
32+
light: "light",
33+
dark: "dark",
34+
},
35+
defaultTheme: "light",
36+
}),
37+
(Story) => (
38+
<ThemeProvider>
39+
<Story />
40+
</ThemeProvider>
41+
),
42+
],
43+
parameters: {
44+
i18n,
45+
actions: { argTypesRegex: "^on[A-Z].*" },
46+
controls: {
47+
matchers: {
48+
color: /(background|color)$/i,
49+
date: /Date$/i,
50+
},
51+
},
52+
chromatic: {
53+
prefersReducedMotion: "reduce",
54+
},
55+
options: {
56+
storySort: {
57+
order: ["Atoms", "Molecules", "Organisms", "Templates", "Pages"],
58+
},
59+
},
60+
layout: "centered",
61+
// Modify viewport selection to match Chakra breakpoints (or custom breakpoints)
62+
viewport: {
63+
viewports: breakpointSet.reduce<{
64+
[token: string]: {
65+
name: string
66+
styles: Record<"width" | "height", string>
67+
}
68+
}>((arr, [token, value]) => {
69+
return {
70+
...arr,
71+
[token]: {
72+
name: token,
73+
styles: {
74+
width: value,
75+
height: "800px",
76+
},
77+
},
78+
}
79+
}, {}),
80+
},
81+
},
82+
}
83+
84+
export default preview

‎.storybook/types.ts

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1+
import type { StyleConfig, ThemingProps } from "@chakra-ui/react"
12
import type { ArgTypes } from "@storybook/react"
2-
import type { ThemingProps } from "@chakra-ui/react"
33

44
// Type declarations below pulled directly from `@chakra-ui/storybook-addon`
55
// with some alteration
@@ -11,8 +11,8 @@ import type { ThemingProps } from "@chakra-ui/react"
1111
type KeyOf<T> = [T] extends [never]
1212
? never
1313
: T extends object
14-
? Extract<keyof T, string>
15-
: never
14+
? Extract<keyof T, string>
15+
: never
1616

1717
export type ThemingArgTypeKey = "variant" | "size"
1818

@@ -49,10 +49,12 @@ export type ThemingArgTypeKey = "variant" | "size"
4949
* @param componentName component name to create the ArgTypes for
5050
*/
5151
export function getThemingArgTypes<
52-
Theme extends Record<string, any>,
53-
ComponentName extends KeyOf<Theme["components"]>
52+
Theme extends Record<string, unknown> & {
53+
components?: Record<string, StyleConfig>
54+
},
55+
ComponentName extends KeyOf<Theme["components"]>,
5456
>(theme: Theme, componentName: ComponentName) {
55-
const component = theme.components[componentName]
57+
const component = theme.components?.[componentName]
5658
if (!component) {
5759
return undefined
5860
}

0 commit comments

Comments
 (0)