Skip to content

Commit 1965b8f

Browse files
huangyiirenehuangyiirene
authored
Merge pull request #23 from objectstack-ai/copilot/design-demo-scenarios
2 parents 8182434 + 60491dd commit 1965b8f

34 files changed

Lines changed: 6510 additions & 7 deletions

‎apps/playground/src/data/examples.ts‎

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,25 +4,37 @@
44
*/
55

66
import { primitives } from './examples/primitives';
7+
import { basic } from './examples/basic';
78
import { layouts } from './examples/layouts';
89
import { forms } from './examples/forms';
910
import { dataDisplay } from './examples/data-display';
11+
import { feedback } from './examples/feedback';
12+
import { disclosure } from './examples/disclosure';
1013
import { complex } from './examples/complex';
14+
import { dashboards } from './examples/dashboards';
1115

1216
export const examples = {
1317
...primitives,
18+
...basic,
1419
...layouts,
1520
...forms,
1621
...dataDisplay,
17-
...complex
22+
...feedback,
23+
...disclosure,
24+
...complex,
25+
...dashboards
1826
};
1927

2028
export type ExampleKey = keyof typeof examples;
2129

2230
export const exampleCategories = {
31+
'Dashboards': ['analytics-dashboard', 'ecommerce-dashboard', 'project-management'],
32+
'Basic': ['text-typography', 'image-gallery', 'icon-showcase', 'divider-demo'],
2333
'Primitives': ['simple-page', 'input-states', 'button-variants'],
34+
'Forms': ['form-demo', 'airtable-form', 'form-controls', 'date-time-pickers', 'file-upload-demo', 'input-otp-demo', 'toggle-group-demo'],
2435
'Layouts': ['grid-layout', 'dashboard', 'tabs-demo'],
25-
'Data Display': ['calendar-view', 'enterprise-table', 'data-table-simple'],
26-
'Forms': ['form-demo', 'airtable-form'],
27-
'Complex': ['kanban-board']
36+
'Data Display': ['calendar-view', 'enterprise-table', 'data-table-simple', 'alert-messages', 'badge-labels', 'avatar-profiles', 'list-views', 'markdown-renderer', 'tree-hierarchy'],
37+
'Feedback': ['loading-states', 'progress-indicators', 'skeleton-loading'],
38+
'Disclosure': ['accordion-faq', 'collapsible-sections'],
39+
'Complex': ['kanban-board', 'carousel-gallery', 'timeline-events', 'table-basic']
2840
};

‎apps/playground/src/data/examples/basic.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import textTypography from './basic/text-typography.json';
2+
import imageGallery from './basic/image-gallery.json';
3+
import iconShowcase from './basic/icon-showcase.json';
4+
import dividerDemo from './basic/divider-demo.json';
5+
6+
export const basic = {
7+
'text-typography': JSON.stringify(textTypography, null, 2),
8+
'image-gallery': JSON.stringify(imageGallery, null, 2),
9+
'icon-showcase': JSON.stringify(iconShowcase, null, 2),
10+
'divider-demo': JSON.stringify(dividerDemo, null, 2)
11+
};

‎apps/playground/src/data/examples/basic/divider-demo.json‎

Lines changed: 161 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
{
2+
"type": "div",
3+
"className": "space-y-6 max-w-4xl",
4+
"body": [
5+
{
6+
"type": "div",
7+
"className": "space-y-2",
8+
"body": [
9+
{
10+
"type": "text",
11+
"content": "Separator Component",
12+
"className": "text-3xl font-bold"
13+
},
14+
{
15+
"type": "text",
16+
"content": "Dividing content sections with horizontal and vertical separators",
17+
"className": "text-muted-foreground"
18+
}
19+
]
20+
},
21+
{
22+
"type": "card",
23+
"className": "p-6",
24+
"body": {
25+
"type": "div",
26+
"className": "space-y-6",
27+
"body": [
28+
{
29+
"type": "div",
30+
"className": "space-y-3",
31+
"body": [
32+
{
33+
"type": "text",
34+
"content": "Section One",
35+
"className": "text-lg font-semibold"
36+
},
37+
{
38+
"type": "text",
39+
"content": "This is the first section of content. Separators help organize information visually.",
40+
"className": "text-sm text-muted-foreground"
41+
}
42+
]
43+
},
44+
{
45+
"type": "separator"
46+
},
47+
{
48+
"type": "div",
49+
"className": "space-y-3",
50+
"body": [
51+
{
52+
"type": "text",
53+
"content": "Section Two",
54+
"className": "text-lg font-semibold"
55+
},
56+
{
57+
"type": "text",
58+
"content": "Another section separated from the previous one. Clean and minimal design.",
59+
"className": "text-sm text-muted-foreground"
60+
}
61+
]
62+
},
63+
{
64+
"type": "separator"
65+
},
66+
{
67+
"type": "div",
68+
"className": "space-y-3",
69+
"body": [
70+
{
71+
"type": "text",
72+
"content": "Section Three",
73+
"className": "text-lg font-semibold"
74+
},
75+
{
76+
"type": "text",
77+
"content": "The final section showing consistent separation between content blocks.",
78+
"className": "text-sm text-muted-foreground"
79+
}
80+
]
81+
}
82+
]
83+
}
84+
},
85+
{
86+
"type": "card",
87+
"className": "p-6",
88+
"body": {
89+
"type": "div",
90+
"className": "space-y-4",
91+
"body": [
92+
{
93+
"type": "text",
94+
"content": "Separator in Lists",
95+
"className": "text-lg font-semibold"
96+
},
97+
{
98+
"type": "div",
99+
"className": "space-y-4",
100+
"body": [
101+
{
102+
"type": "div",
103+
"className": "space-y-2",
104+
"body": [
105+
{
106+
"type": "text",
107+
"content": "Dashboard",
108+
"className": "font-medium"
109+
},
110+
{
111+
"type": "text",
112+
"content": "Overview of your account",
113+
"className": "text-sm text-muted-foreground"
114+
}
115+
]
116+
},
117+
{
118+
"type": "separator"
119+
},
120+
{
121+
"type": "div",
122+
"className": "space-y-2",
123+
"body": [
124+
{
125+
"type": "text",
126+
"content": "Settings",
127+
"className": "font-medium"
128+
},
129+
{
130+
"type": "text",
131+
"content": "Manage your preferences",
132+
"className": "text-sm text-muted-foreground"
133+
}
134+
]
135+
},
136+
{
137+
"type": "separator"
138+
},
139+
{
140+
"type": "div",
141+
"className": "space-y-2",
142+
"body": [
143+
{
144+
"type": "text",
145+
"content": "Profile",
146+
"className": "font-medium"
147+
},
148+
{
149+
"type": "text",
150+
"content": "Update your information",
151+
"className": "text-sm text-muted-foreground"
152+
}
153+
]
154+
}
155+
]
156+
}
157+
]
158+
}
159+
}
160+
]
161+
}

0 commit comments

Comments
 (0)