Skip to content

Commit 2dbe81e

Browse files
johnykeijohnykei
authored
Merge pull request #130 from digital-go-jp/v2
merge v2 into main
2 parents 2a24c5e + 2678f05 commit 2dbe81e

File tree

7 files changed

+903
-2098
lines changed

7 files changed

+903
-2098
lines changed

‎.storybook/preview.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import './globals.css';
21
import type { Preview } from '@storybook/react';
3-
import 'tailwindcss/tailwind.css';
2+
import './globals.css';
43

54
const preview: Preview = {
65
parameters: {

‎package-lock.json‎

Lines changed: 672 additions & 2068 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@digital-go-jp/design-system-example-components",
3-
"version": "2.0.3",
3+
"version": "2.0.4",
44
"type": "module",
55
"main": "dist/index.cjs.js",
66
"typings": "dist/index.d.ts",
@@ -39,34 +39,34 @@
3939
"storybook:test": "test-storybook"
4040
},
4141
"dependencies": {
42-
"@digital-go-jp/tailwind-theme-plugin": "^0.1.17",
42+
"@digital-go-jp/tailwind-theme-plugin": "^0.2.0",
4343
"react": "^18.3.1",
4444
"react-dom": "^18.3.1",
45-
"tailwindcss": "^3.4.13"
45+
"tailwindcss": "^3.4.15"
4646
},
4747
"devDependencies": {
4848
"@biomejs/biome": "^1.9.4",
49-
"@markuplint/jsx-parser": "^4.7.7",
50-
"@markuplint/react-spec": "^4.5.9",
51-
"@storybook/addon-a11y": "^8.3.6",
52-
"@storybook/addon-essentials": "^8.3.6",
53-
"@storybook/addon-interactions": "^8.3.6",
54-
"@storybook/addon-links": "^8.3.6",
55-
"@storybook/blocks": "^8.3.6",
56-
"@storybook/react": "^8.3.6",
57-
"@storybook/react-vite": "^8.3.6",
58-
"@storybook/test": "^8.3.6",
49+
"@markuplint/jsx-parser": "^4.7.13",
50+
"@markuplint/react-spec": "^4.5.11",
51+
"@storybook/addon-a11y": "^8.4.5",
52+
"@storybook/addon-essentials": "^8.4.5",
53+
"@storybook/addon-interactions": "^8.4.5",
54+
"@storybook/addon-links": "^8.4.5",
55+
"@storybook/blocks": "^8.4.5",
56+
"@storybook/react": "^8.4.5",
57+
"@storybook/react-vite": "^8.4.5",
58+
"@storybook/test": "^8.4.5",
5959
"@tsconfig/node20": "^20.1.4",
60-
"@types/node": "^22.7.6",
61-
"@types/react": "^18.3.11",
62-
"@types/react-dom": "^18.3.0",
63-
"@vitejs/plugin-react-swc": "^3.7.0",
60+
"@types/node": "^22.9.1",
61+
"@types/react": "^18.3.12",
62+
"@types/react-dom": "^18.3.1",
63+
"@vitejs/plugin-react-swc": "^3.7.1",
6464
"autoprefixer": "^10.4.20",
65-
"markuplint": "^4.9.4",
66-
"postcss": "^8.4.47",
67-
"storybook": "^8.3.6",
68-
"typescript": "^5.6.2",
69-
"vite": "^5.4.9"
65+
"markuplint": "^4.11.3",
66+
"postcss": "^8.4.49",
67+
"storybook": "^8.4.5",
68+
"typescript": "^5.6.3",
69+
"vite": "^5.4.11"
7070
},
7171
"engines": {
7272
"node": ">=18"

‎src/components/Ol/Ol.stories.tsx‎

Lines changed: 119 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type { Meta, StoryObj } from '@storybook/react';
22
import React from 'react';
3+
import { Ul } from '../';
34
import { Ol } from './Ol';
45

56
const meta = {
@@ -11,10 +12,10 @@ const meta = {
1112
export default meta;
1213
type Story = StoryObj<typeof meta>;
1314

14-
export const Example: Story = {
15+
export const Spacing4: Story = {
1516
render: () => {
1617
return (
17-
<Ol>
18+
<Ol className='[&_:where(ol,ul)]:mt-1 [&_:where(ol,ul)]:-mb-1 [&_li]:py-1'>
1819
<li>サンプルサンプル</li>
1920
<li>サンプルサンプル</li>
2021
<li>サンプルサンプル</li>
@@ -24,9 +25,125 @@ export const Example: Story = {
2425
<li>サンプルサンプル</li>
2526
<li>サンプルサンプル</li>
2627
<li>サンプルサンプル</li>
28+
<li>
29+
サンプルサンプル
30+
<Ol>
31+
<li>サンプルサンプル</li>
32+
<li>サンプルサンプル</li>
33+
<li>サンプルサンプル</li>
34+
<li>サンプルサンプル</li>
35+
</Ol>
36+
</li>
2737
<li>サンプルサンプル</li>
2838
</Ol>
2939
</li>
40+
<li>サンプルサンプル</li>
41+
</Ol>
42+
);
43+
},
44+
};
45+
46+
export const Spacing8: Story = {
47+
render: () => {
48+
return (
49+
<Ol className='[&_:where(ol,ul)]:mt-2 [&_:where(ol,ul)]:-mb-2 [&_li]:py-2'>
50+
<li>サンプルサンプル</li>
51+
<li>サンプルサンプル</li>
52+
<li>サンプルサンプル</li>
53+
<li>
54+
サンプルサンプル
55+
<Ol>
56+
<li>サンプルサンプル</li>
57+
<li>サンプルサンプル</li>
58+
<li>サンプルサンプル</li>
59+
<li>
60+
サンプルサンプル
61+
<Ol>
62+
<li>サンプルサンプル</li>
63+
<li>サンプルサンプル</li>
64+
<li>サンプルサンプル</li>
65+
<li>サンプルサンプル</li>
66+
</Ol>
67+
</li>
68+
<li>サンプルサンプル</li>
69+
</Ol>
70+
</li>
71+
<li>サンプルサンプル</li>
72+
</Ol>
73+
);
74+
},
75+
};
76+
77+
export const Spacing12: Story = {
78+
render: () => {
79+
return (
80+
<Ol className='[&_:where(ol,ul)]:mt-3 [&_:where(ol,ul)]:-mb-3 [&_li]:py-3'>
81+
<li>サンプルサンプル</li>
82+
<li>サンプルサンプル</li>
83+
<li>サンプルサンプル</li>
84+
<li>
85+
サンプルサンプル
86+
<Ol>
87+
<li>サンプルサンプル</li>
88+
<li>サンプルサンプル</li>
89+
<li>サンプルサンプル</li>
90+
<li>
91+
サンプルサンプル
92+
<Ol>
93+
<li>サンプルサンプル</li>
94+
<li>サンプルサンプル</li>
95+
<li>サンプルサンプル</li>
96+
<li>サンプルサンプル</li>
97+
</Ol>
98+
</li>
99+
<li>サンプルサンプル</li>
100+
</Ol>
101+
</li>
102+
<li>サンプルサンプル</li>
103+
</Ol>
104+
);
105+
},
106+
};
107+
108+
export const WithLowerLatin: Story = {
109+
render: () => {
110+
return (
111+
<Ol className='[&_:where(ol,ul)]:mt-1 [&_:where(ol,ul)]:-mb-1 [&_li]:py-1'>
112+
<li>サンプルサンプル</li>
113+
<li>サンプルサンプル</li>
114+
<li>サンプルサンプル</li>
115+
<li>
116+
サンプルサンプル
117+
<Ol className='list-lower-latin'>
118+
<li>サンプルサンプル</li>
119+
<li>サンプルサンプル</li>
120+
<li>サンプルサンプル</li>
121+
<li>サンプルサンプル</li>
122+
</Ol>
123+
</li>
124+
<li>サンプルサンプル</li>
125+
</Ol>
126+
);
127+
},
128+
};
129+
130+
export const WithUnorderedList: Story = {
131+
render: () => {
132+
return (
133+
<Ol className='[&_:where(ol,ul)]:mt-1 [&_:where(ol,ul)]:-mb-1 [&_li]:py-1'>
134+
<li>サンプルサンプル</li>
135+
<li>サンプルサンプル</li>
136+
<li>サンプルサンプル</li>
137+
<li>
138+
サンプルサンプル
139+
<Ul>
140+
<li>サンプルサンプル</li>
141+
<li>サンプルサンプル</li>
142+
<li>サンプルサンプル</li>
143+
<li>サンプルサンプル</li>
144+
</Ul>
145+
</li>
146+
<li>サンプルサンプル</li>
30147
</Ol>
31148
);
32149
},

‎src/components/Ol/Ol.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { ComponentProps } from 'react';
22

3-
export const olStyle = 'pl-8 list-decimal [&_&]:list-lower-latin';
3+
export const olStyle = 'pl-8 list-[revert]';
44

55
export type OlProps = ComponentProps<'ol'>;
66

‎src/components/Ul/Ul.stories.tsx‎

Lines changed: 87 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type { Meta, StoryObj } from '@storybook/react';
22
import React from 'react';
3+
import { Ol } from '../';
34
import { Ul } from './Ul';
45

56
const meta = {
@@ -11,10 +12,10 @@ const meta = {
1112
export default meta;
1213
type Story = StoryObj<typeof meta>;
1314

14-
export const Example: Story = {
15+
export const Spacing4: Story = {
1516
render: () => {
1617
return (
17-
<Ul>
18+
<Ul className='[&_:where(ol,ul)]:mt-1 [&_:where(ol,ul)]:-mb-1 [&_li]:py-1'>
1819
<li>サンプルサンプル</li>
1920
<li>サンプルサンプル</li>
2021
<li>サンプルサンプル</li>
@@ -32,8 +33,92 @@ export const Example: Story = {
3233
<li>サンプルサンプル</li>
3334
</Ul>
3435
</li>
36+
<li>サンプルサンプル</li>
37+
</Ul>
38+
</li>
39+
<li>サンプルサンプル</li>
40+
</Ul>
41+
);
42+
},
43+
};
44+
45+
export const Spacing8: Story = {
46+
render: () => {
47+
return (
48+
<Ul className='[&_:where(ol,ul)]:mt-2 [&_:where(ol,ul)]:-mb-2 [&_li]:py-2'>
49+
<li>サンプルサンプル</li>
50+
<li>サンプルサンプル</li>
51+
<li>サンプルサンプル</li>
52+
<li>
53+
サンプルサンプル
54+
<Ul>
55+
<li>サンプルサンプル</li>
56+
<li>サンプルサンプル</li>
57+
<li>サンプルサンプル</li>
58+
<li>
59+
サンプルサンプル
60+
<Ul>
61+
<li>サンプルサンプル</li>
62+
<li>サンプルサンプル</li>
63+
<li>サンプルサンプル</li>
64+
</Ul>
65+
</li>
66+
<li>サンプルサンプル</li>
67+
</Ul>
68+
</li>
69+
<li>サンプルサンプル</li>
70+
</Ul>
71+
);
72+
},
73+
};
74+
75+
export const Spacing12: Story = {
76+
render: () => {
77+
return (
78+
<Ul className='[&_:where(ol,ul)]:mt-3 [&_:where(ol,ul)]:-mb-3 [&_li]:py-3'>
79+
<li>サンプルサンプル</li>
80+
<li>サンプルサンプル</li>
81+
<li>サンプルサンプル</li>
82+
<li>
83+
サンプルサンプル
84+
<Ul>
85+
<li>サンプルサンプル</li>
86+
<li>サンプルサンプル</li>
87+
<li>サンプルサンプル</li>
88+
<li>
89+
サンプルサンプル
90+
<Ul>
91+
<li>サンプルサンプル</li>
92+
<li>サンプルサンプル</li>
93+
<li>サンプルサンプル</li>
94+
</Ul>
95+
</li>
96+
<li>サンプルサンプル</li>
3597
</Ul>
3698
</li>
99+
<li>サンプルサンプル</li>
100+
</Ul>
101+
);
102+
},
103+
};
104+
105+
export const WithOrderedList: Story = {
106+
render: () => {
107+
return (
108+
<Ul className='[&_:where(ol,ul)]:mt-1 [&_:where(ol,ul)]:-mb-1 [&_li]:py-1'>
109+
<li>サンプルサンプル</li>
110+
<li>サンプルサンプル</li>
111+
<li>サンプルサンプル</li>
112+
<li>
113+
サンプルサンプル
114+
<Ol>
115+
<li>サンプルサンプル</li>
116+
<li>サンプルサンプル</li>
117+
<li>サンプルサンプル</li>
118+
<li>サンプルサンプル</li>
119+
</Ol>
120+
</li>
121+
<li>サンプルサンプル</li>
37122
</Ul>
38123
);
39124
},

‎src/components/Ul/Ul.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { ComponentProps } from 'react';
22

3-
export const ulStyle = 'pl-8 list-disc [&_&]:list-circle [&_&_&]:list-square';
3+
export const ulStyle = 'pl-8 list-[revert]';
44

55
export type UlProps = ComponentProps<'ul'>;
66

0 commit comments

Comments
 (0)