Skip to content

Commit e11d2a5

Browse files
timDeHoftimDeHof
authored
Merge pull request #2 from timDeHof/chore/add-typescript-eslint-and-prettier
feat: enhance project configuration and timeline component
2 parents 8784700 + 842958b commit e11d2a5

35 files changed

+21244
-20775
lines changed

‎.eslintrc.json‎

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,28 @@
11
{
22
"extends": [
33
"next/core-web-vitals",
4-
"plugin:storybook/recommended"
5-
]
6-
}
4+
"plugin:@typescript-eslint/recommended",
5+
"plugin:storybook/recommended",
6+
"prettier"
7+
],
8+
"rules": {
9+
"@typescript-eslint/ban-ts-comment": ["error", { "ts-ignore": "allow-with-description" }],
10+
"@typescript-eslint/restrict-template-expressions": "off",
11+
"react/prop-types": "off",
12+
"comma-spacing": "error",
13+
"object-curly-spacing": ["error", "always"],
14+
"array-bracket-spacing": ["error", "never"],
15+
"max-len": [
16+
"warn",
17+
{
18+
"code": 100,
19+
"ignoreUrls": true,
20+
"ignoreTemplateLiterals": true,
21+
"ignoreStrings": true,
22+
"ignoreTrailingComments": true
23+
}
24+
]
25+
},
26+
"parser": "@typescript-eslint/parser",
27+
"plugins": ["@typescript-eslint"]
28+
}

‎.github/ISSUE_TEMPLATE/bug_report.md‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,14 @@ about: Create a report to help us improve
44
title: ''
55
labels: ''
66
assignees: ''
7-
87
---
98

109
**Describe the bug**
1110
A clear and concise description of what the bug is.
1211

1312
**To Reproduce**
1413
Steps to reproduce the behavior:
14+
1515
1. Go to '...'
1616
2. Click on '....'
1717
3. Scroll down to '....'
@@ -24,15 +24,17 @@ A clear and concise description of what you expected to happen.
2424
If applicable, add screenshots to help explain your problem.
2525

2626
**Desktop (please complete the following information):**
27-
- OS: [e.g. iOS]
28-
- Browser [e.g. chrome, safari]
29-
- Version [e.g. 22]
27+
28+
- OS: [e.g. iOS]
29+
- Browser [e.g. chrome, safari]
30+
- Version [e.g. 22]
3031

3132
**Smartphone (please complete the following information):**
32-
- Device: [e.g. iPhone6]
33-
- OS: [e.g. iOS8.1]
34-
- Browser [e.g. stock browser, safari]
35-
- Version [e.g. 22]
33+
34+
- Device: [e.g. iPhone6]
35+
- OS: [e.g. iOS8.1]
36+
- Browser [e.g. stock browser, safari]
37+
- Version [e.g. 22]
3638

3739
**Additional context**
3840
Add any other context about the problem here.

‎.github/ISSUE_TEMPLATE/feature_request.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ about: Suggest an idea for this project
44
title: ''
55
labels: ''
66
assignees: ''
7-
87
---
98

109
**Is your feature request related to a problem? Please describe.**

‎.github/workflows/deploy-github-pages.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,4 +32,4 @@ jobs:
3232
install_command: yarn install # default: npm ci
3333
build_command: yarn build-storybook # default: npm run build-storybook
3434
path: storybook-static # default: dist/storybook
35-
checkout: false # default: true
35+
checkout: false # default: true

‎.prettierrc‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"printWidth": 100,
3+
"tabWidth": 2,
4+
"singleQuote": true,
5+
"trailingComma": "all",
6+
"semi": true,
7+
"bracketSpacing": true,
8+
"plugins": ["prettier-plugin-tailwindcss"]
9+
}

‎.storybook/main.ts‎

Lines changed: 11 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,15 @@
1-
import type { StorybookConfig } from "@storybook/nextjs";
1+
import type { StorybookConfig } from '@storybook/nextjs';
22

33
const config: StorybookConfig = {
4-
stories: [
5-
"../src/**/*.mdx",
6-
"../src/**/*.stories.@(js|jsx|mjs|ts|tsx)",
7-
],
4+
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
85
addons: [
9-
"@storybook/addon-links",
10-
"@storybook/addon-essentials",
11-
"@storybook/addon-onboarding",
12-
"@storybook/addon-interactions",
13-
"@storybook/addon-themes",
14-
"@storybook/addon-a11y",
15-
"@storybook/addon-coverage",
6+
'@storybook/addon-links',
7+
'@storybook/addon-essentials',
8+
'@storybook/addon-onboarding',
9+
'@storybook/addon-interactions',
10+
'@storybook/addon-themes',
11+
'@storybook/addon-a11y',
12+
'@storybook/addon-coverage',
1613
{
1714
name: '@storybook/addon-styling-webpack',
1815
options: {
@@ -21,11 +18,11 @@ const config: StorybookConfig = {
2118
},
2219
],
2320
framework: {
24-
name: "@storybook/nextjs",
21+
name: '@storybook/nextjs',
2522
options: {},
2623
},
2724
docs: {
28-
autodocs: "tag",
25+
autodocs: 'tag',
2926
},
3027
staticDirs: ['../public'],
3128
};

‎.storybook/manager-head.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
<meta name="description" content="Components for my shadcntimeline project" key="desc" />
2-
<meta name="robots" content="noindex" />
2+
<meta name="robots" content="noindex" />

‎.storybook/preview.ts‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import type { Preview } from "@storybook/react";
1+
import type { Preview } from '@storybook/react';
22
import '../src/app/globals.css';
33

4-
import { withThemeByClassName } from "@storybook/addon-themes";
4+
import { withThemeByClassName } from '@storybook/addon-themes';
55

66
const preview: Preview = {
77
parameters: {
@@ -13,14 +13,16 @@ const preview: Preview = {
1313
},
1414
},
1515

16-
decorators: [withThemeByClassName({
16+
decorators: [
17+
withThemeByClassName({
1718
themes: {
18-
// nameOfTheme: 'classNameForTheme',
19-
light: '',
20-
dark: 'dark',
19+
// nameOfTheme: 'classNameForTheme',
20+
light: '',
21+
dark: 'dark',
2122
},
2223
defaultTheme: 'light',
23-
})]
24+
}),
25+
],
2426
};
2527

2628
export default preview;

‎.storybook/preview.tsx‎

Lines changed: 9 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import React from "react";
2-
import type { Preview } from "@storybook/react";
3-
import "../src/app/globals.css";
4-
import { ThemeProvider } from "../src/components/providers/theme-provider";
1+
import React from 'react';
2+
import type { Preview } from '@storybook/react';
3+
import '../src/app/globals.css';
4+
import { ThemeProvider } from '../src/components/providers/theme-provider';
55

66
const preview: Preview = {
77
parameters: {
8-
actions: { argTypesRegex: "^on[A-Z].*" },
8+
actions: { argTypesRegex: '^on[A-Z].*' },
99
controls: {
1010
matchers: {
1111
color: /(background|color)$/i,
@@ -21,27 +21,15 @@ const preview: Preview = {
2121
inline: true,
2222
},
2323
container: ({ children, context }) => (
24-
<ThemeProvider
25-
attribute="class"
26-
defaultTheme="dark"
27-
enableSystem
28-
disableTransitionOnChange
29-
>
30-
<div className="dark min-h-screen bg-background text-foreground">
31-
{children}
32-
</div>
24+
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem disableTransitionOnChange>
25+
<div className="dark min-h-screen bg-background text-foreground">{children}</div>
3326
</ThemeProvider>
3427
),
3528
},
3629
},
3730
decorators: [
3831
(Story) => (
39-
<ThemeProvider
40-
attribute="class"
41-
defaultTheme="dark"
42-
enableSystem
43-
disableTransitionOnChange
44-
>
32+
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem disableTransitionOnChange>
4533
<div className="dark min-h-screen bg-background">
4634
<div className="container mx-auto max-w-2xl py-10">
4735
<Story />
@@ -52,4 +40,4 @@ const preview: Preview = {
5240
],
5341
};
5442

55-
export default preview;
43+
export default preview;

‎README.md‎

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -34,65 +34,65 @@ npm run storybook
3434
## Usage
3535

3636
```tsx
37-
import { Timeline, TimelineItem } from '@/components/timeline'
38-
import { Check } from 'lucide-react'
37+
import { Timeline, TimelineItem } from '@/components/timeline';
38+
import { Check } from 'lucide-react';
3939

4040
export default function Example() {
4141
return (
4242
<Timeline>
4343
<TimelineItem
44-
date={new Date("2024-01-01")}
44+
date={new Date('2024-01-01')}
4545
title="Feature Released"
4646
description="New timeline component is now available"
4747
icon={<Check />}
4848
status="completed"
4949
/>
5050
<TimelineItem
51-
date={new Date("2024-01-02")}
51+
date={new Date('2024-01-02')}
5252
title="In Progress"
5353
description="Working on documentation"
5454
status="in-progress"
5555
/>
5656
<TimelineItem
57-
date={new Date("2024-01-03")}
57+
date={new Date('2024-01-03')}
5858
title="Upcoming"
5959
description="Planning future updates"
6060
status="pending"
6161
/>
6262
</Timeline>
63-
)
63+
);
6464
}
6565
```
6666

6767
## Props
6868

6969
### Timeline
7070

71-
| Prop | Type | Default | Description |
72-
|----------|--------------------|---------|-----------------------|
71+
| Prop | Type | Default | Description |
72+
| -------- | -------------------- | ------- | -------------------- |
7373
| size | 'sm' \| 'md' \| 'lg' | 'md' | Size of the timeline |
7474
| iconsize | 'sm' \| 'md' \| 'lg' | 'md' | Size of icons |
7575

7676
### TimelineItem
7777

78-
| Prop | Type | Default | Description |
79-
|----------------|---------------------------------------------|-------------|----------------------------|
80-
| date | Date \| string \| number | - | Date of the event |
81-
| title | string | - | Title of the event |
82-
| description | string | - | Description of the event |
83-
| icon | ReactNode | - | Custom icon |
84-
| iconColor | 'primary' \| 'secondary' \| 'muted' \| 'accent' | 'primary' | Color theme of the icon |
85-
| status | 'completed' \| 'in-progress' \| 'pending' | 'completed' | Current status |
86-
| loading | boolean | false | Show loading state |
87-
| error | string | - | Show error state |
78+
| Prop | Type | Default | Description |
79+
| ----------- | ----------------------------------------------- | ----------- | ------------------------ |
80+
| date | Date \| string \| number | - | Date of the event |
81+
| title | string | - | Title of the event |
82+
| description | string | - | Description of the event |
83+
| icon | ReactNode | - | Custom icon |
84+
| iconColor | 'primary' \| 'secondary' \| 'muted' \| 'accent' | 'primary' | Color theme of the icon |
85+
| status | 'completed' \| 'in-progress' \| 'pending' | 'completed' | Current status |
86+
| loading | boolean | false | Show loading state |
87+
| error | string | - | Show error state |
8888

8989
### TimelineTime
9090

91-
| Prop | Type | Default | Description |
92-
|----------------|----------------------------------------|-------------|----------------------------|
93-
| date | Date \| string \| number | - | Date to display |
94-
| format | string \| Intl.DateTimeFormatOptions | - | Date formatting options |
95-
| className | string | - | Additional CSS classes |
91+
| Prop | Type | Default | Description |
92+
| --------- | ------------------------------------ | ------- | ----------------------- |
93+
| date | Date \| string \| number | - | Date to display |
94+
| format | string \| Intl.DateTimeFormatOptions | - | Date formatting options |
95+
| className | string | - | Additional CSS classes |
9696

9797
## Server-Side Rendering
9898

0 commit comments

Comments
 (0)