@olwiba/ui 0.2.27 → 0.2.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +14 -0
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/docs-manifest.json +1 -6
- package/package.json +1 -1
- package/site/demos/overlay.tsx +1 -1
- package/site/demos/underlay.tsx +1 -1
- package/site/lib/sandboxes.ts +0 -221
- package/src/app/AuthSection.tsx +16 -2
- package/site/demos/application-sidebar-block.tsx +0 -9
- package/site/demos/auth-split-block.tsx +0 -9
- package/site/demos/dashboard-overview-block.tsx +0 -9
- package/site/demos/dashboard-shell-block.tsx +0 -10
- package/site/demos/marketing-hero-block.tsx +0 -10
package/docs-manifest.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"package": "@olwiba/ui",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.27",
|
|
4
4
|
"generatedBy": "scripts/check-docs-exports.ts",
|
|
5
5
|
"contentRoot": "content/docs",
|
|
6
6
|
"demosRoot": "site/demos",
|
|
@@ -94,9 +94,7 @@
|
|
|
94
94
|
"animated-swap.tsx",
|
|
95
95
|
"app-shell.tsx",
|
|
96
96
|
"app-ui-page.tsx",
|
|
97
|
-
"application-sidebar-block.tsx",
|
|
98
97
|
"auth-section.tsx",
|
|
99
|
-
"auth-split-block.tsx",
|
|
100
98
|
"billing-page.tsx",
|
|
101
99
|
"billing-panel.tsx",
|
|
102
100
|
"carousel.tsx",
|
|
@@ -108,8 +106,6 @@
|
|
|
108
106
|
"context-menu.tsx",
|
|
109
107
|
"count-up.tsx",
|
|
110
108
|
"cta-section.tsx",
|
|
111
|
-
"dashboard-overview-block.tsx",
|
|
112
|
-
"dashboard-shell-block.tsx",
|
|
113
109
|
"data-table.tsx",
|
|
114
110
|
"demo-brand.tsx",
|
|
115
111
|
"dock.tsx",
|
|
@@ -140,7 +136,6 @@
|
|
|
140
136
|
"marketing-faq-block.tsx",
|
|
141
137
|
"marketing-features-block.tsx",
|
|
142
138
|
"marketing-footer-block.tsx",
|
|
143
|
-
"marketing-hero-block.tsx",
|
|
144
139
|
"marketing-nav-block.tsx",
|
|
145
140
|
"marketing-newsletter-block.tsx",
|
|
146
141
|
"marketing-page.tsx",
|
package/package.json
CHANGED
package/site/demos/overlay.tsx
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { Overlay, type OverlayVariant } from '@olwiba/ui';
|
|
5
|
-
import { DemoControls, useUsageCode } from '
|
|
5
|
+
import { DemoControls, useUsageCode } from '@olwiba/docs';
|
|
6
6
|
import { Button, Badge } from '@olwiba/cn';
|
|
7
7
|
|
|
8
8
|
const variants: OverlayVariant[] = ['dim', 'scrim', 'loading'];
|
package/site/demos/underlay.tsx
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { Underlay, type UnderlayVariant } from '@olwiba/ui';
|
|
5
|
-
import { DemoControls, useUsageCode } from '
|
|
5
|
+
import { DemoControls, useUsageCode } from '@olwiba/docs';
|
|
6
6
|
import { Button, Badge } from '@olwiba/cn';
|
|
7
7
|
|
|
8
8
|
const variants: UnderlayVariant[] = ['dots', 'lines', 'cross', 'glow'];
|
package/site/lib/sandboxes.ts
CHANGED
|
@@ -84,227 +84,6 @@ export default function SignInPage() {
|
|
|
84
84
|
/>
|
|
85
85
|
);
|
|
86
86
|
}
|
|
87
|
-
`,
|
|
88
|
-
},
|
|
89
|
-
],
|
|
90
|
-
},
|
|
91
|
-
'auth-split-block': {
|
|
92
|
-
id: 'auth-split-block',
|
|
93
|
-
defaultViewport: 'desktop',
|
|
94
|
-
preview: React.lazy(() => import('~/demos/auth-split-block')),
|
|
95
|
-
files: [
|
|
96
|
-
{
|
|
97
|
-
path: 'app/page.tsx',
|
|
98
|
-
language: 'tsx',
|
|
99
|
-
code: `import { AuthSplitBlock } from "@olwiba/ui";
|
|
100
|
-
|
|
101
|
-
export default function Page() {
|
|
102
|
-
return <AuthSplitBlock />;
|
|
103
|
-
}
|
|
104
|
-
`,
|
|
105
|
-
},
|
|
106
|
-
{
|
|
107
|
-
path: 'src/blocks/AuthSplitBlock.tsx',
|
|
108
|
-
language: 'tsx',
|
|
109
|
-
code: `import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Input, Label } from "@olwiba/cn";
|
|
110
|
-
|
|
111
|
-
export function AuthSplitBlock() {
|
|
112
|
-
return (
|
|
113
|
-
<section className="grid min-h-[560px] overflow-hidden rounded-2xl border bg-card lg:grid-cols-2">
|
|
114
|
-
<div className="relative hidden p-8 lg:flex lg:flex-col lg:justify-between">
|
|
115
|
-
<div className="absolute inset-0 bg-gradient-to-br from-primary/20 via-transparent to-muted" />
|
|
116
|
-
<div className="relative z-10">
|
|
117
|
-
<Badge variant="secondary" className="mb-4">Welcome</Badge>
|
|
118
|
-
<h2 className="text-3xl font-semibold tracking-tight">Build better interfaces faster</h2>
|
|
119
|
-
</div>
|
|
120
|
-
</div>
|
|
121
|
-
|
|
122
|
-
<div className="flex items-center justify-center p-6 lg:p-10">
|
|
123
|
-
<Card className="w-full max-w-md">
|
|
124
|
-
<CardHeader>
|
|
125
|
-
<CardTitle>Sign in</CardTitle>
|
|
126
|
-
<CardDescription>Enter your email and password to continue.</CardDescription>
|
|
127
|
-
</CardHeader>
|
|
128
|
-
<CardContent className="space-y-4">
|
|
129
|
-
<div className="space-y-2">
|
|
130
|
-
<Label htmlFor="email">Email</Label>
|
|
131
|
-
<Input id="email" type="email" placeholder="name@company.com" />
|
|
132
|
-
</div>
|
|
133
|
-
<Button className="w-full">Continue</Button>
|
|
134
|
-
</CardContent>
|
|
135
|
-
</Card>
|
|
136
|
-
</div>
|
|
137
|
-
</section>
|
|
138
|
-
);
|
|
139
|
-
}
|
|
140
|
-
`,
|
|
141
|
-
},
|
|
142
|
-
],
|
|
143
|
-
},
|
|
144
|
-
'dashboard-overview-block': {
|
|
145
|
-
id: 'dashboard-overview-block',
|
|
146
|
-
defaultViewport: 'desktop',
|
|
147
|
-
preview: React.lazy(() => import('~/demos/dashboard-overview-block')),
|
|
148
|
-
files: [
|
|
149
|
-
{
|
|
150
|
-
path: 'app/page.tsx',
|
|
151
|
-
language: 'tsx',
|
|
152
|
-
code: `import { DashboardOverviewBlock } from "@olwiba/ui";
|
|
153
|
-
|
|
154
|
-
export default function Page() {
|
|
155
|
-
return <DashboardOverviewBlock />;
|
|
156
|
-
}
|
|
157
|
-
`,
|
|
158
|
-
},
|
|
159
|
-
{
|
|
160
|
-
path: 'src/blocks/DashboardOverviewBlock.tsx',
|
|
161
|
-
language: 'tsx',
|
|
162
|
-
code: `import { ArrowUpRight } from "lucide-react";
|
|
163
|
-
import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Progress, Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@olwiba/cn";
|
|
164
|
-
|
|
165
|
-
export function DashboardOverviewBlock() {
|
|
166
|
-
return (
|
|
167
|
-
<section className="space-y-6 rounded-2xl border bg-card p-4 sm:p-6">
|
|
168
|
-
<div className="flex flex-wrap items-start justify-between gap-3">
|
|
169
|
-
<div>
|
|
170
|
-
<h2 className="text-2xl font-semibold tracking-tight">Overview</h2>
|
|
171
|
-
<p className="text-sm text-muted-foreground">Snapshot of key product and revenue metrics.</p>
|
|
172
|
-
</div>
|
|
173
|
-
<Button variant="outline" size="sm">Export report <ArrowUpRight className="ml-2 size-4" /></Button>
|
|
174
|
-
</div>
|
|
175
|
-
|
|
176
|
-
<Card>
|
|
177
|
-
<CardHeader>
|
|
178
|
-
<CardTitle>Recent invoices</CardTitle>
|
|
179
|
-
<CardDescription>Latest billing activity from your workspace.</CardDescription>
|
|
180
|
-
</CardHeader>
|
|
181
|
-
<CardContent>
|
|
182
|
-
<Table>
|
|
183
|
-
<TableHeader>
|
|
184
|
-
<TableRow>
|
|
185
|
-
<TableHead>Invoice</TableHead>
|
|
186
|
-
<TableHead>Status</TableHead>
|
|
187
|
-
</TableRow>
|
|
188
|
-
</TableHeader>
|
|
189
|
-
<TableBody>
|
|
190
|
-
<TableRow>
|
|
191
|
-
<TableCell>#INV-9031</TableCell>
|
|
192
|
-
<TableCell><Badge>Paid</Badge></TableCell>
|
|
193
|
-
</TableRow>
|
|
194
|
-
</TableBody>
|
|
195
|
-
</Table>
|
|
196
|
-
<div className="mt-4"><Progress value={72} /></div>
|
|
197
|
-
</CardContent>
|
|
198
|
-
</Card>
|
|
199
|
-
</section>
|
|
200
|
-
);
|
|
201
|
-
}
|
|
202
|
-
`,
|
|
203
|
-
},
|
|
204
|
-
],
|
|
205
|
-
},
|
|
206
|
-
'dashboard-shell-block': {
|
|
207
|
-
id: 'dashboard-shell-block',
|
|
208
|
-
defaultViewport: 'desktop',
|
|
209
|
-
preview: React.lazy(() => import('~/demos/dashboard-shell-block')),
|
|
210
|
-
files: [
|
|
211
|
-
{
|
|
212
|
-
path: 'app/page.tsx',
|
|
213
|
-
language: 'tsx',
|
|
214
|
-
code: `import { DashboardShellBlock } from "@olwiba/ui";
|
|
215
|
-
|
|
216
|
-
export default function Page() {
|
|
217
|
-
return <DashboardShellBlock />;
|
|
218
|
-
}
|
|
219
|
-
`,
|
|
220
|
-
},
|
|
221
|
-
{
|
|
222
|
-
path: 'src/blocks/DashboardShellBlock.tsx',
|
|
223
|
-
language: 'tsx',
|
|
224
|
-
code: `import { DashboardShellBlock } from "@olwiba/ui";
|
|
225
|
-
|
|
226
|
-
export default function Example() {
|
|
227
|
-
return <DashboardShellBlock />;
|
|
228
|
-
}
|
|
229
|
-
`,
|
|
230
|
-
},
|
|
231
|
-
],
|
|
232
|
-
},
|
|
233
|
-
'marketing-hero-block': {
|
|
234
|
-
id: 'marketing-hero-block',
|
|
235
|
-
defaultViewport: 'desktop',
|
|
236
|
-
preview: React.lazy(() => import('~/demos/marketing-hero-block')),
|
|
237
|
-
files: [
|
|
238
|
-
{
|
|
239
|
-
path: 'app/page.tsx',
|
|
240
|
-
language: 'tsx',
|
|
241
|
-
code: `import { MarketingHeroBlock } from "@olwiba/ui";
|
|
242
|
-
|
|
243
|
-
export default function Page() {
|
|
244
|
-
return <MarketingHeroBlock />;
|
|
245
|
-
}
|
|
246
|
-
`,
|
|
247
|
-
},
|
|
248
|
-
{
|
|
249
|
-
path: 'src/blocks/MarketingHeroBlock.tsx',
|
|
250
|
-
language: 'tsx',
|
|
251
|
-
code: `import { ArrowRight } from "lucide-react";
|
|
252
|
-
import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle } from "@olwiba/cn";
|
|
253
|
-
|
|
254
|
-
export function MarketingHeroBlock() {
|
|
255
|
-
return (
|
|
256
|
-
<section className="overflow-hidden rounded-2xl border bg-card">
|
|
257
|
-
<div className="relative px-6 py-14 sm:px-10 sm:py-20">
|
|
258
|
-
<div className="relative mx-auto max-w-4xl text-center">
|
|
259
|
-
<Badge className="mb-4" variant="secondary">Base UI Blocks</Badge>
|
|
260
|
-
<h1 className="text-balance text-4xl font-semibold tracking-tight sm:text-5xl">
|
|
261
|
-
Ship polished screens with olwibaCN-powered building blocks
|
|
262
|
-
</h1>
|
|
263
|
-
<div className="mt-8 flex flex-wrap items-center justify-center gap-3">
|
|
264
|
-
<Button size="lg">Get started <ArrowRight className="ml-2 size-4" /></Button>
|
|
265
|
-
<Button size="lg" variant="outline">View examples</Button>
|
|
266
|
-
</div>
|
|
267
|
-
</div>
|
|
268
|
-
</div>
|
|
269
|
-
<div className="grid gap-4 p-6 sm:grid-cols-3 sm:p-8">
|
|
270
|
-
<Card>
|
|
271
|
-
<CardHeader>
|
|
272
|
-
<CardTitle className="text-base">Composable by default</CardTitle>
|
|
273
|
-
<CardDescription>Built from olwibaCN primitives.</CardDescription>
|
|
274
|
-
</CardHeader>
|
|
275
|
-
<CardContent />
|
|
276
|
-
</Card>
|
|
277
|
-
</div>
|
|
278
|
-
</section>
|
|
279
|
-
);
|
|
280
|
-
}
|
|
281
|
-
`,
|
|
282
|
-
},
|
|
283
|
-
],
|
|
284
|
-
},
|
|
285
|
-
'application-sidebar-block': {
|
|
286
|
-
id: 'application-sidebar-block',
|
|
287
|
-
defaultViewport: 'desktop',
|
|
288
|
-
preview: React.lazy(() => import('~/demos/application-sidebar-block')),
|
|
289
|
-
files: [
|
|
290
|
-
{
|
|
291
|
-
path: 'app/page.tsx',
|
|
292
|
-
language: 'tsx',
|
|
293
|
-
code: `import { ApplicationSidebarBlock } from "@olwiba/ui";
|
|
294
|
-
|
|
295
|
-
export default function Page() {
|
|
296
|
-
return <ApplicationSidebarBlock />;
|
|
297
|
-
}
|
|
298
|
-
`,
|
|
299
|
-
},
|
|
300
|
-
{
|
|
301
|
-
path: 'src/blocks/ApplicationSidebarBlock.tsx',
|
|
302
|
-
language: 'tsx',
|
|
303
|
-
code: `import { ApplicationSidebarBlock } from "@olwiba/ui";
|
|
304
|
-
|
|
305
|
-
export default function Example() {
|
|
306
|
-
return <ApplicationSidebarBlock />;
|
|
307
|
-
}
|
|
308
87
|
`,
|
|
309
88
|
},
|
|
310
89
|
],
|
package/src/app/AuthSection.tsx
CHANGED
|
@@ -123,9 +123,23 @@ export interface AuthFormProps {
|
|
|
123
123
|
onSubmit?: (e: React.FormEvent<HTMLFormElement>) => void;
|
|
124
124
|
onSso?: () => void;
|
|
125
125
|
/** (signin) Link to the sign-up page */
|
|
126
|
+
/**
|
|
127
|
+
* Where "Create an account" points. Omit it to leave the link out.
|
|
128
|
+
*
|
|
129
|
+
* Previously defaulted to '#', so a consumer that never set it rendered a
|
|
130
|
+
* dead control, and passing undefined could not remove it — a default
|
|
131
|
+
* parameter reapplies on undefined. Sites where accounts are granted rather
|
|
132
|
+
* than self-served had no way to say so.
|
|
133
|
+
*/
|
|
126
134
|
signUpHref?: string;
|
|
127
135
|
/** (signup / forgot-password / reset-password / verify) Link back to the sign-in page */
|
|
128
136
|
signInHref?: string;
|
|
137
|
+
/**
|
|
138
|
+
* Where "Forgot password" points. Omit it to leave the link out.
|
|
139
|
+
*
|
|
140
|
+
* Previously defaulted to '#', so a consumer that never wired a reset flow
|
|
141
|
+
* still rendered the link — it looked available and did nothing when clicked.
|
|
142
|
+
*/
|
|
129
143
|
forgotPasswordHref?: string;
|
|
130
144
|
/** (verify) Re-sends the one-time code */
|
|
131
145
|
onResend?: () => void;
|
|
@@ -163,9 +177,9 @@ function DefaultForm({
|
|
|
163
177
|
mode = 'signin',
|
|
164
178
|
onSubmit,
|
|
165
179
|
onSso,
|
|
166
|
-
signUpHref
|
|
180
|
+
signUpHref,
|
|
167
181
|
signInHref = '#',
|
|
168
|
-
forgotPasswordHref
|
|
182
|
+
forgotPasswordHref,
|
|
169
183
|
onResend,
|
|
170
184
|
destination,
|
|
171
185
|
codeLength = 6,
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { AppShell } from '@olwiba/ui';
|
|
2
|
-
|
|
3
|
-
export default function DashboardShellBlockDemo() {
|
|
4
|
-
return (
|
|
5
|
-
<div className="h-full min-h-0 w-full max-w-[1400px]">
|
|
6
|
-
{/* contained: rail is absolute within this shell; provider uses layout=embedded + sandbox height */}
|
|
7
|
-
<AppShell sidebarPosition="contained" />
|
|
8
|
-
</div>
|
|
9
|
-
);
|
|
10
|
-
}
|