@framingui/ui 0.6.1 → 0.6.3
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/LICENSE +21 -0
- package/README.md +22 -1090
- package/dist/chunk-7UBERMRE.mjs +180 -0
- package/dist/index.d.mts +3 -140
- package/dist/index.mjs +257 -1688
- package/dist/src/components/badge.d.ts +1 -1
- package/dist/src/components/button.d.ts +1 -1
- package/dist/src/components/calendar.d.ts.map +1 -1
- package/dist/src/components/calendar.js +12 -11
- package/dist/src/components/calendar.js.map +1 -1
- package/dist/src/components/command.d.ts +7 -7
- package/dist/src/components/select.js +1 -1
- package/dist/src/components/select.js.map +1 -1
- package/dist/src/components/sheet.d.ts +1 -1
- package/dist/src/index.d.ts +0 -1
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/index.js +0 -1
- package/dist/src/index.js.map +1 -1
- package/dist/src/lib/theme-loader.d.ts +1 -0
- package/dist/src/lib/theme-loader.d.ts.map +1 -1
- package/dist/src/lib/theme-loader.js.map +1 -1
- package/dist/src/lib/tokens.d.ts +1 -0
- package/dist/src/lib/tokens.d.ts.map +1 -1
- package/dist/src/lib/tokens.js +1 -0
- package/dist/src/lib/tokens.js.map +1 -1
- package/dist/src/primitives/badge.d.ts +1 -1
- package/dist/src/primitives/button.d.ts +1 -1
- package/dist/src/primitives/text.d.ts +1 -1
- package/dist/src/templates/auth/forgot-password.d.ts +2 -2
- package/dist/src/templates/auth/forgot-password.d.ts.map +1 -1
- package/dist/src/templates/auth/forgot-password.js +2 -35
- package/dist/src/templates/auth/forgot-password.js.map +1 -1
- package/dist/src/templates/auth/login.d.ts +2 -2
- package/dist/src/templates/auth/login.d.ts.map +1 -1
- package/dist/src/templates/auth/login.js +2 -35
- package/dist/src/templates/auth/login.js.map +1 -1
- package/dist/src/templates/auth/signup.d.ts +2 -2
- package/dist/src/templates/auth/signup.d.ts.map +1 -1
- package/dist/src/templates/auth/signup.js +2 -35
- package/dist/src/templates/auth/signup.js.map +1 -1
- package/dist/src/templates/auth/verification.d.ts +2 -2
- package/dist/src/templates/auth/verification.d.ts.map +1 -1
- package/dist/src/templates/auth/verification.js +2 -35
- package/dist/src/templates/auth/verification.js.map +1 -1
- package/dist/src/templates/core/landing.d.ts +2 -2
- package/dist/src/templates/core/landing.d.ts.map +1 -1
- package/dist/src/templates/core/landing.js +2 -35
- package/dist/src/templates/core/landing.js.map +1 -1
- package/dist/src/templates/core/preferences.d.ts +2 -2
- package/dist/src/templates/core/preferences.d.ts.map +1 -1
- package/dist/src/templates/core/preferences.js +2 -41
- package/dist/src/templates/core/preferences.js.map +1 -1
- package/dist/src/templates/core/profile.d.ts +2 -2
- package/dist/src/templates/core/profile.d.ts.map +1 -1
- package/dist/src/templates/core/profile.js +2 -35
- package/dist/src/templates/core/profile.js.map +1 -1
- package/dist/src/templates/create-template.d.ts +4 -0
- package/dist/src/templates/create-template.d.ts.map +1 -0
- package/dist/src/templates/create-template.js +41 -0
- package/dist/src/templates/create-template.js.map +1 -0
- package/dist/src/templates/dashboard/overview.d.ts +2 -2
- package/dist/src/templates/dashboard/overview.d.ts.map +1 -1
- package/dist/src/templates/dashboard/overview.js +2 -56
- package/dist/src/templates/dashboard/overview.js.map +1 -1
- package/dist/src/templates/feedback/confirmation.d.ts +2 -2
- package/dist/src/templates/feedback/confirmation.d.ts.map +1 -1
- package/dist/src/templates/feedback/confirmation.js +2 -35
- package/dist/src/templates/feedback/confirmation.js.map +1 -1
- package/dist/src/templates/feedback/empty.d.ts +2 -2
- package/dist/src/templates/feedback/empty.d.ts.map +1 -1
- package/dist/src/templates/feedback/empty.js +2 -35
- package/dist/src/templates/feedback/empty.js.map +1 -1
- package/dist/src/templates/feedback/error.d.ts +2 -2
- package/dist/src/templates/feedback/error.d.ts.map +1 -1
- package/dist/src/templates/feedback/error.js +2 -35
- package/dist/src/templates/feedback/error.js.map +1 -1
- package/dist/src/templates/feedback/loading.d.ts +2 -2
- package/dist/src/templates/feedback/loading.d.ts.map +1 -1
- package/dist/src/templates/feedback/loading.js +2 -35
- package/dist/src/templates/feedback/loading.js.map +1 -1
- package/dist/src/templates/feedback/success.d.ts +2 -2
- package/dist/src/templates/feedback/success.d.ts.map +1 -1
- package/dist/src/templates/feedback/success.js +2 -35
- package/dist/src/templates/feedback/success.js.map +1 -1
- package/dist/templates/index.d.mts +142 -0
- package/dist/templates/index.mjs +905 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +18 -14
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Button } from '../../components/button';
|
|
3
|
-
import {
|
|
3
|
+
import { createTemplateFromCatalog } from '../create-template';
|
|
4
4
|
export function EmptyTemplateComponent({ children, className = '', slots = {}, texts = {}, options = {}, }) {
|
|
5
5
|
const title = texts.title || 'No Items Found';
|
|
6
6
|
const message = texts.message || 'Get started by creating your first item';
|
|
@@ -8,38 +8,5 @@ export function EmptyTemplateComponent({ children, className = '', slots = {}, t
|
|
|
8
8
|
const showCta = options.show_cta ?? true;
|
|
9
9
|
return (_jsxs("div", { className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`, children: [_jsxs("div", { className: "max-w-md text-center space-y-[var(--tekton-spacing-6)]", children: [slots.illustration || (_jsx("div", { className: "flex justify-center", children: _jsx("div", { className: "rounded-full bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-8)]", children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-16 w-16 text-[var(--tekton-text-muted-foreground)]", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4" }) }) }) })), _jsxs("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [_jsx("h2", { className: "text-2xl font-bold", children: title }), _jsx("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: message })] }), showCta && (_jsx("div", { children: _jsx(Button, { size: "lg", children: ctaLabel }) })), slots.helpText && (_jsx("div", { className: "text-sm text-[var(--tekton-text-muted-foreground)]", children: slots.helpText }))] }), children] }));
|
|
10
10
|
}
|
|
11
|
-
export const EmptyTemplate =
|
|
12
|
-
id: 'feedback.empty',
|
|
13
|
-
name: 'Empty',
|
|
14
|
-
category: 'feedback',
|
|
15
|
-
description: 'Empty state screen with call-to-action',
|
|
16
|
-
skeleton: {
|
|
17
|
-
shell: 'centered',
|
|
18
|
-
page: 'feedback-page',
|
|
19
|
-
sections: [
|
|
20
|
-
{
|
|
21
|
-
id: 'empty-state',
|
|
22
|
-
name: 'Empty State',
|
|
23
|
-
slot: 'main',
|
|
24
|
-
required: true,
|
|
25
|
-
Component: EmptyTemplateComponent,
|
|
26
|
-
},
|
|
27
|
-
],
|
|
28
|
-
},
|
|
29
|
-
layout: {
|
|
30
|
-
type: 'centered',
|
|
31
|
-
responsive: DEFAULT_RESPONSIVE_LAYOUT,
|
|
32
|
-
},
|
|
33
|
-
customizable: {
|
|
34
|
-
texts: ['title', 'message', 'cta_label'],
|
|
35
|
-
optional: ['show_cta'],
|
|
36
|
-
slots: ['illustration', 'helpText'],
|
|
37
|
-
},
|
|
38
|
-
requiredComponents: ['Button'],
|
|
39
|
-
Component: EmptyTemplateComponent,
|
|
40
|
-
version: '1.0.0',
|
|
41
|
-
created: '2026-02-01',
|
|
42
|
-
updated: '2026-02-01',
|
|
43
|
-
tags: ['feedback', 'empty', 'state', 'no-data'],
|
|
44
|
-
};
|
|
11
|
+
export const EmptyTemplate = createTemplateFromCatalog('feedback.empty', EmptyTemplateComponent);
|
|
45
12
|
//# sourceMappingURL=empty.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"empty.js","sourceRoot":"","sources":["../../../../src/templates/feedback/empty.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,yBAAyB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"empty.js","sourceRoot":"","sources":["../../../../src/templates/feedback/empty.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAK/D,MAAM,UAAU,sBAAsB,CAAC,EACrC,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,EACV,KAAK,GAAG,EAAE,EACV,OAAO,GAAG,EAAE,GACQ;IACpB,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,gBAAgB,CAAC;IAC9C,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,yCAAyC,CAAC;IAC3E,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,IAAI,YAAY,CAAC;IACjD,MAAM,OAAO,GAAG,OAAO,CAAC,QAAQ,IAAI,IAAI,CAAC;IAEzC,OAAO,CACL,eACE,SAAS,EAAE,6EAA6E,SAAS,EAAE,aAEnG,eAAK,SAAS,EAAC,wDAAwD,aAEpE,KAAK,CAAC,YAAY,IAAI,CACrB,cAAK,SAAS,EAAC,qBAAqB,YAClC,cAAK,SAAS,EAAC,sEAAsE,YACnF,cACE,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAC,sDAAsD,EAChE,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,EACnB,MAAM,EAAC,cAAc,YAErB,eACE,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAE,CAAC,EACd,CAAC,EAAC,qMAAqM,GACvM,GACE,GACF,GACF,CACP,EAGD,eAAK,SAAS,EAAC,mCAAmC,aAChD,aAAI,SAAS,EAAC,oBAAoB,YAAE,KAAK,GAAM,EAC/C,YAAG,SAAS,EAAC,4CAA4C,YAAE,OAAO,GAAK,IACnE,EAGL,OAAO,IAAI,CACV,wBACE,KAAC,MAAM,IAAC,IAAI,EAAC,IAAI,YAAE,QAAQ,GAAU,GACjC,CACP,EAGA,KAAK,CAAC,QAAQ,IAAI,CACjB,cAAK,SAAS,EAAC,oDAAoD,YAAE,KAAK,CAAC,QAAQ,GAAO,CAC3F,IACG,EACL,QAAQ,IACL,CACP,CAAC;AACJ,CAAC;AAKD,MAAM,CAAC,MAAM,aAAa,GAAG,yBAAyB,CAAC,gBAAgB,EAAE,sBAAsB,CAAC,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { ScreenTemplateProps } from '../types';
|
|
2
2
|
export declare function ErrorTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
-
export declare const ErrorTemplate: ScreenTemplate;
|
|
3
|
+
export declare const ErrorTemplate: import("..").ScreenTemplate;
|
|
4
4
|
//# sourceMappingURL=error.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error.d.ts","sourceRoot":"","sources":["../../../../src/templates/feedback/error.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"error.d.ts","sourceRoot":"","sources":["../../../../src/templates/feedback/error.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAMpD,wBAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,SAAc,EACd,KAAU,EACV,KAAU,EACV,OAAY,GACb,EAAE,mBAAmB,2CAuDrB;AAKD,eAAO,MAAM,aAAa,6BAAsE,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Button } from '../../components/button';
|
|
3
|
-
import {
|
|
3
|
+
import { createTemplateFromCatalog } from '../create-template';
|
|
4
4
|
export function ErrorTemplateComponent({ children, className = '', slots = {}, texts = {}, options = {}, }) {
|
|
5
5
|
const title = texts.title || 'Something Went Wrong';
|
|
6
6
|
const message = texts.message || 'An error occurred. Please try again.';
|
|
@@ -8,38 +8,5 @@ export function ErrorTemplateComponent({ children, className = '', slots = {}, t
|
|
|
8
8
|
const showRetry = options.show_retry ?? true;
|
|
9
9
|
return (_jsxs("div", { className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`, children: [_jsxs("div", { className: "max-w-md text-center space-y-[var(--tekton-spacing-6)]", children: [slots.icon || (_jsx("div", { className: "flex justify-center", children: _jsx("div", { className: "rounded-full bg-[var(--tekton-bg-destructive)] bg-opacity-10 p-[var(--tekton-spacing-4)]", children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-12 w-12 text-[var(--tekton-text-destructive)]", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" }) }) }) })), _jsxs("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [_jsx("h2", { className: "text-2xl font-bold", children: title }), _jsx("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: message })] }), slots.errorDetails && (_jsx("div", { className: "text-left bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-4)] rounded-[var(--tekton-radius-md)] text-sm", children: slots.errorDetails })), _jsxs("div", { className: "flex flex-col gap-[var(--tekton-spacing-3)]", children: [showRetry && _jsx(Button, { className: "w-full", children: retryLabel }), slots.additionalActions && slots.additionalActions] })] }), children] }));
|
|
10
10
|
}
|
|
11
|
-
export const ErrorTemplate =
|
|
12
|
-
id: 'feedback.error',
|
|
13
|
-
name: 'Error',
|
|
14
|
-
category: 'feedback',
|
|
15
|
-
description: 'Error state screen with message and retry option',
|
|
16
|
-
skeleton: {
|
|
17
|
-
shell: 'centered',
|
|
18
|
-
page: 'feedback-page',
|
|
19
|
-
sections: [
|
|
20
|
-
{
|
|
21
|
-
id: 'error-message',
|
|
22
|
-
name: 'Error Message',
|
|
23
|
-
slot: 'main',
|
|
24
|
-
required: true,
|
|
25
|
-
Component: ErrorTemplateComponent,
|
|
26
|
-
},
|
|
27
|
-
],
|
|
28
|
-
},
|
|
29
|
-
layout: {
|
|
30
|
-
type: 'centered',
|
|
31
|
-
responsive: DEFAULT_RESPONSIVE_LAYOUT,
|
|
32
|
-
},
|
|
33
|
-
customizable: {
|
|
34
|
-
texts: ['title', 'message', 'retry_label'],
|
|
35
|
-
optional: ['show_retry'],
|
|
36
|
-
slots: ['icon', 'errorDetails', 'additionalActions'],
|
|
37
|
-
},
|
|
38
|
-
requiredComponents: ['Button'],
|
|
39
|
-
Component: ErrorTemplateComponent,
|
|
40
|
-
version: '1.0.0',
|
|
41
|
-
created: '2026-02-01',
|
|
42
|
-
updated: '2026-02-01',
|
|
43
|
-
tags: ['feedback', 'error', 'failure', 'state'],
|
|
44
|
-
};
|
|
11
|
+
export const ErrorTemplate = createTemplateFromCatalog('feedback.error', ErrorTemplateComponent);
|
|
45
12
|
//# sourceMappingURL=error.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error.js","sourceRoot":"","sources":["../../../../src/templates/feedback/error.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,yBAAyB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"error.js","sourceRoot":"","sources":["../../../../src/templates/feedback/error.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAK/D,MAAM,UAAU,sBAAsB,CAAC,EACrC,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,EACV,KAAK,GAAG,EAAE,EACV,OAAO,GAAG,EAAE,GACQ;IACpB,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,sBAAsB,CAAC;IACpD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,sCAAsC,CAAC;IACxE,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,IAAI,WAAW,CAAC;IACpD,MAAM,SAAS,GAAG,OAAO,CAAC,UAAU,IAAI,IAAI,CAAC;IAE7C,OAAO,CACL,eACE,SAAS,EAAE,6EAA6E,SAAS,EAAE,aAEnG,eAAK,SAAS,EAAC,wDAAwD,aAEpE,KAAK,CAAC,IAAI,IAAI,CACb,cAAK,SAAS,EAAC,qBAAqB,YAClC,cAAK,SAAS,EAAC,0FAA0F,YACvG,cACE,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAC,iDAAiD,EAC3D,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,EACnB,MAAM,EAAC,cAAc,YAErB,eACE,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAE,CAAC,EACd,CAAC,EAAC,sIAAsI,GACxI,GACE,GACF,GACF,CACP,EAGD,eAAK,SAAS,EAAC,mCAAmC,aAChD,aAAI,SAAS,EAAC,oBAAoB,YAAE,KAAK,GAAM,EAC/C,YAAG,SAAS,EAAC,4CAA4C,YAAE,OAAO,GAAK,IACnE,EAGL,KAAK,CAAC,YAAY,IAAI,CACrB,cAAK,SAAS,EAAC,6GAA6G,YACzH,KAAK,CAAC,YAAY,GACf,CACP,EAGD,eAAK,SAAS,EAAC,6CAA6C,aACzD,SAAS,IAAI,KAAC,MAAM,IAAC,SAAS,EAAC,QAAQ,YAAE,UAAU,GAAU,EAC7D,KAAK,CAAC,iBAAiB,IAAI,KAAK,CAAC,iBAAiB,IAC/C,IACF,EACL,QAAQ,IACL,CACP,CAAC;AACJ,CAAC;AAKD,MAAM,CAAC,MAAM,aAAa,GAAG,yBAAyB,CAAC,gBAAgB,EAAE,sBAAsB,CAAC,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { ScreenTemplateProps } from '../types';
|
|
2
2
|
export declare function LoadingTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
-
export declare const LoadingTemplate: ScreenTemplate;
|
|
3
|
+
export declare const LoadingTemplate: import("..").ScreenTemplate;
|
|
4
4
|
//# sourceMappingURL=loading.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"loading.d.ts","sourceRoot":"","sources":["../../../../src/templates/feedback/loading.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"loading.d.ts","sourceRoot":"","sources":["../../../../src/templates/feedback/loading.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAMpD,wBAAgB,wBAAwB,CAAC,EACvC,QAAQ,EACR,SAAc,EACd,KAAU,EACV,KAAU,EACV,OAAY,GACb,EAAE,mBAAmB,2CAsBrB;AAKD,eAAO,MAAM,eAAe,6BAG3B,CAAC"}
|
|
@@ -1,42 +1,9 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { createTemplateFromCatalog } from '../create-template';
|
|
3
3
|
export function LoadingTemplateComponent({ children, className = '', slots = {}, texts = {}, options = {}, }) {
|
|
4
4
|
const message = texts.message || 'Loading...';
|
|
5
5
|
const showMessage = options.show_message ?? true;
|
|
6
6
|
return (_jsxs("div", { className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`, children: [_jsxs("div", { className: "flex flex-col items-center gap-[var(--tekton-spacing-4)]", children: [slots.spinner || (_jsx("div", { className: "animate-spin rounded-full h-12 w-12 border-b-2 border-[var(--tekton-border-primary)]" })), showMessage && (_jsx("p", { className: "text-sm text-[var(--tekton-text-muted-foreground)]", children: message }))] }), children] }));
|
|
7
7
|
}
|
|
8
|
-
export const LoadingTemplate =
|
|
9
|
-
id: 'feedback.loading',
|
|
10
|
-
name: 'Loading',
|
|
11
|
-
category: 'feedback',
|
|
12
|
-
description: 'Loading state screen with spinner and optional message',
|
|
13
|
-
skeleton: {
|
|
14
|
-
shell: 'centered',
|
|
15
|
-
page: 'feedback-page',
|
|
16
|
-
sections: [
|
|
17
|
-
{
|
|
18
|
-
id: 'loading-indicator',
|
|
19
|
-
name: 'Loading Indicator',
|
|
20
|
-
slot: 'main',
|
|
21
|
-
required: true,
|
|
22
|
-
Component: LoadingTemplateComponent,
|
|
23
|
-
},
|
|
24
|
-
],
|
|
25
|
-
},
|
|
26
|
-
layout: {
|
|
27
|
-
type: 'centered',
|
|
28
|
-
responsive: DEFAULT_RESPONSIVE_LAYOUT,
|
|
29
|
-
},
|
|
30
|
-
customizable: {
|
|
31
|
-
texts: ['message'],
|
|
32
|
-
optional: ['show_message'],
|
|
33
|
-
slots: ['spinner'],
|
|
34
|
-
},
|
|
35
|
-
requiredComponents: [],
|
|
36
|
-
Component: LoadingTemplateComponent,
|
|
37
|
-
version: '1.0.0',
|
|
38
|
-
created: '2026-02-01',
|
|
39
|
-
updated: '2026-02-01',
|
|
40
|
-
tags: ['feedback', 'loading', 'spinner', 'state'],
|
|
41
|
-
};
|
|
8
|
+
export const LoadingTemplate = createTemplateFromCatalog('feedback.loading', LoadingTemplateComponent);
|
|
42
9
|
//# sourceMappingURL=loading.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"loading.js","sourceRoot":"","sources":["../../../../src/templates/feedback/loading.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,yBAAyB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"loading.js","sourceRoot":"","sources":["../../../../src/templates/feedback/loading.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAK/D,MAAM,UAAU,wBAAwB,CAAC,EACvC,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,EACV,KAAK,GAAG,EAAE,EACV,OAAO,GAAG,EAAE,GACQ;IACpB,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,YAAY,CAAC;IAC9C,MAAM,WAAW,GAAG,OAAO,CAAC,YAAY,IAAI,IAAI,CAAC;IAEjD,OAAO,CACL,eACE,SAAS,EAAE,6EAA6E,SAAS,EAAE,aAEnG,eAAK,SAAS,EAAC,0DAA0D,aAEtE,KAAK,CAAC,OAAO,IAAI,CAChB,cAAK,SAAS,EAAC,sFAAsF,GAAG,CACzG,EAGA,WAAW,IAAI,CACd,YAAG,SAAS,EAAC,oDAAoD,YAAE,OAAO,GAAK,CAChF,IACG,EACL,QAAQ,IACL,CACP,CAAC;AACJ,CAAC;AAKD,MAAM,CAAC,MAAM,eAAe,GAAG,yBAAyB,CACtD,kBAAkB,EAClB,wBAAwB,CACzB,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { ScreenTemplateProps } from '../types';
|
|
2
2
|
export declare function SuccessTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): import("react/jsx-runtime").JSX.Element;
|
|
3
|
-
export declare const SuccessTemplate: ScreenTemplate;
|
|
3
|
+
export declare const SuccessTemplate: import("..").ScreenTemplate;
|
|
4
4
|
//# sourceMappingURL=success.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"success.d.ts","sourceRoot":"","sources":["../../../../src/templates/feedback/success.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"success.d.ts","sourceRoot":"","sources":["../../../../src/templates/feedback/success.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAMpD,wBAAgB,wBAAwB,CAAC,EACvC,QAAQ,EACR,SAAc,EACd,KAAU,EACV,KAAU,EACV,OAAY,GACb,EAAE,mBAAmB,2CAiErB;AAKD,eAAO,MAAM,eAAe,6BAG3B,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Button } from '../../components/button';
|
|
3
|
-
import {
|
|
3
|
+
import { createTemplateFromCatalog } from '../create-template';
|
|
4
4
|
export function SuccessTemplateComponent({ children, className = '', slots = {}, texts = {}, options = {}, }) {
|
|
5
5
|
const title = texts.title || 'Success!';
|
|
6
6
|
const message = texts.message || 'Your action was completed successfully';
|
|
@@ -8,38 +8,5 @@ export function SuccessTemplateComponent({ children, className = '', slots = {},
|
|
|
8
8
|
const showCta = options.show_cta ?? true;
|
|
9
9
|
return (_jsxs("div", { className: `min-h-screen flex items-center justify-center p-[var(--tekton-spacing-4)] ${className}`, children: [_jsxs("div", { className: "max-w-md text-center space-y-[var(--tekton-spacing-6)]", children: [slots.icon || (_jsx("div", { className: "flex justify-center", children: _jsx("div", { className: "rounded-full bg-[var(--tekton-bg-success)] bg-opacity-10 p-[var(--tekton-spacing-4)]", children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-12 w-12 text-[var(--tekton-text-success)]", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }) }) })), _jsxs("div", { className: "space-y-[var(--tekton-spacing-2)]", children: [_jsx("h2", { className: "text-2xl font-bold", children: title }), _jsx("p", { className: "text-[var(--tekton-text-muted-foreground)]", children: message })] }), slots.details && (_jsx("div", { className: "text-left bg-[var(--tekton-bg-muted)] p-[var(--tekton-spacing-4)] rounded-[var(--tekton-radius-md)] text-sm", children: slots.details })), showCta && (_jsx("div", { children: _jsx(Button, { className: "w-full", size: "lg", children: ctaLabel }) })), slots.additionalActions && (_jsx("div", { className: "flex flex-col gap-[var(--tekton-spacing-3)]", children: slots.additionalActions }))] }), children] }));
|
|
10
10
|
}
|
|
11
|
-
export const SuccessTemplate =
|
|
12
|
-
id: 'feedback.success',
|
|
13
|
-
name: 'Success',
|
|
14
|
-
category: 'feedback',
|
|
15
|
-
description: 'Success state screen with confirmation message',
|
|
16
|
-
skeleton: {
|
|
17
|
-
shell: 'centered',
|
|
18
|
-
page: 'feedback-page',
|
|
19
|
-
sections: [
|
|
20
|
-
{
|
|
21
|
-
id: 'success-message',
|
|
22
|
-
name: 'Success Message',
|
|
23
|
-
slot: 'main',
|
|
24
|
-
required: true,
|
|
25
|
-
Component: SuccessTemplateComponent,
|
|
26
|
-
},
|
|
27
|
-
],
|
|
28
|
-
},
|
|
29
|
-
layout: {
|
|
30
|
-
type: 'centered',
|
|
31
|
-
responsive: DEFAULT_RESPONSIVE_LAYOUT,
|
|
32
|
-
},
|
|
33
|
-
customizable: {
|
|
34
|
-
texts: ['title', 'message', 'cta_label'],
|
|
35
|
-
optional: ['show_cta'],
|
|
36
|
-
slots: ['icon', 'details', 'additionalActions'],
|
|
37
|
-
},
|
|
38
|
-
requiredComponents: ['Button'],
|
|
39
|
-
Component: SuccessTemplateComponent,
|
|
40
|
-
version: '1.0.0',
|
|
41
|
-
created: '2026-02-01',
|
|
42
|
-
updated: '2026-02-01',
|
|
43
|
-
tags: ['feedback', 'success', 'confirmation', 'state'],
|
|
44
|
-
};
|
|
11
|
+
export const SuccessTemplate = createTemplateFromCatalog('feedback.success', SuccessTemplateComponent);
|
|
45
12
|
//# sourceMappingURL=success.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"success.js","sourceRoot":"","sources":["../../../../src/templates/feedback/success.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,yBAAyB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"success.js","sourceRoot":"","sources":["../../../../src/templates/feedback/success.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAK/D,MAAM,UAAU,wBAAwB,CAAC,EACvC,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,EACV,KAAK,GAAG,EAAE,EACV,OAAO,GAAG,EAAE,GACQ;IACpB,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,UAAU,CAAC;IACxC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,wCAAwC,CAAC;IAC1E,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,IAAI,UAAU,CAAC;IAC/C,MAAM,OAAO,GAAG,OAAO,CAAC,QAAQ,IAAI,IAAI,CAAC;IAEzC,OAAO,CACL,eACE,SAAS,EAAE,6EAA6E,SAAS,EAAE,aAEnG,eAAK,SAAS,EAAC,wDAAwD,aAEpE,KAAK,CAAC,IAAI,IAAI,CACb,cAAK,SAAS,EAAC,qBAAqB,YAClC,cAAK,SAAS,EAAC,sFAAsF,YACnG,cACE,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAC,6CAA6C,EACvD,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,EACnB,MAAM,EAAC,cAAc,YAErB,eACE,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,WAAW,EAAE,CAAC,EACd,CAAC,EAAC,+CAA+C,GACjD,GACE,GACF,GACF,CACP,EAGD,eAAK,SAAS,EAAC,mCAAmC,aAChD,aAAI,SAAS,EAAC,oBAAoB,YAAE,KAAK,GAAM,EAC/C,YAAG,SAAS,EAAC,4CAA4C,YAAE,OAAO,GAAK,IACnE,EAGL,KAAK,CAAC,OAAO,IAAI,CAChB,cAAK,SAAS,EAAC,6GAA6G,YACzH,KAAK,CAAC,OAAO,GACV,CACP,EAGA,OAAO,IAAI,CACV,wBACE,KAAC,MAAM,IAAC,SAAS,EAAC,QAAQ,EAAC,IAAI,EAAC,IAAI,YACjC,QAAQ,GACF,GACL,CACP,EAGA,KAAK,CAAC,iBAAiB,IAAI,CAC1B,cAAK,SAAS,EAAC,6CAA6C,YACzD,KAAK,CAAC,iBAAiB,GACpB,CACP,IACG,EACL,QAAQ,IACL,CACP,CAAC;AACJ,CAAC;AAKD,MAAM,CAAC,MAAM,eAAe,GAAG,yBAAyB,CACtD,kBAAkB,EAClB,wBAAwB,CACzB,CAAC"}
|
|
@@ -0,0 +1,142 @@
|
|
|
1
|
+
import { ComponentType, ReactNode } from 'react';
|
|
2
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
|
+
|
|
4
|
+
type ScreenCategory = 'auth' | 'dashboard' | 'form' | 'marketing' | 'feedback';
|
|
5
|
+
type TemplateLayout = 'centered' | 'sidebar' | 'full';
|
|
6
|
+
interface ResponsiveBreakpoints {
|
|
7
|
+
mobile: number;
|
|
8
|
+
tablet: number;
|
|
9
|
+
desktop: number;
|
|
10
|
+
}
|
|
11
|
+
interface ResponsiveLayout {
|
|
12
|
+
mobile: {
|
|
13
|
+
padding: string;
|
|
14
|
+
gap: string;
|
|
15
|
+
columns: number;
|
|
16
|
+
};
|
|
17
|
+
tablet: {
|
|
18
|
+
padding: string;
|
|
19
|
+
gap: string;
|
|
20
|
+
columns: number;
|
|
21
|
+
};
|
|
22
|
+
desktop: {
|
|
23
|
+
padding: string;
|
|
24
|
+
gap: string;
|
|
25
|
+
columns: number;
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
interface TemplateLayoutConfig {
|
|
29
|
+
type: TemplateLayout;
|
|
30
|
+
responsive: ResponsiveLayout;
|
|
31
|
+
}
|
|
32
|
+
interface SectionTemplate {
|
|
33
|
+
id: string;
|
|
34
|
+
name: string;
|
|
35
|
+
slot: string;
|
|
36
|
+
required: boolean;
|
|
37
|
+
Component: ComponentType<any>;
|
|
38
|
+
}
|
|
39
|
+
interface CustomizationBoundaries {
|
|
40
|
+
texts: string[];
|
|
41
|
+
optional: string[];
|
|
42
|
+
slots: string[];
|
|
43
|
+
}
|
|
44
|
+
interface TemplateSkeleton {
|
|
45
|
+
shell: string;
|
|
46
|
+
page: string;
|
|
47
|
+
sections: SectionTemplate[];
|
|
48
|
+
}
|
|
49
|
+
interface ScreenTemplateProps {
|
|
50
|
+
children?: ReactNode;
|
|
51
|
+
className?: string;
|
|
52
|
+
slots?: Record<string, ReactNode>;
|
|
53
|
+
texts?: Record<string, string>;
|
|
54
|
+
options?: Record<string, string | boolean | number>;
|
|
55
|
+
}
|
|
56
|
+
interface ScreenTemplate {
|
|
57
|
+
id: string;
|
|
58
|
+
name: string;
|
|
59
|
+
category: ScreenCategory;
|
|
60
|
+
description: string;
|
|
61
|
+
skeleton: TemplateSkeleton;
|
|
62
|
+
layout: TemplateLayoutConfig;
|
|
63
|
+
customizable: CustomizationBoundaries;
|
|
64
|
+
requiredComponents: string[];
|
|
65
|
+
Component: ComponentType<ScreenTemplateProps>;
|
|
66
|
+
version: string;
|
|
67
|
+
created: string;
|
|
68
|
+
updated: string;
|
|
69
|
+
tags?: string[];
|
|
70
|
+
}
|
|
71
|
+
interface TemplateRegistryEntry {
|
|
72
|
+
template: ScreenTemplate;
|
|
73
|
+
metadata: {
|
|
74
|
+
usageCount: number;
|
|
75
|
+
lastUsed?: string;
|
|
76
|
+
};
|
|
77
|
+
}
|
|
78
|
+
declare const DEFAULT_RESPONSIVE_LAYOUT: ResponsiveLayout;
|
|
79
|
+
declare const DEFAULT_BREAKPOINTS: ResponsiveBreakpoints;
|
|
80
|
+
|
|
81
|
+
declare class TemplateRegistry {
|
|
82
|
+
private static instance;
|
|
83
|
+
private templates;
|
|
84
|
+
private constructor();
|
|
85
|
+
static getInstance(): TemplateRegistry;
|
|
86
|
+
register(template: ScreenTemplate): void;
|
|
87
|
+
registerMany(templates: ScreenTemplate[]): void;
|
|
88
|
+
get(id: string): ScreenTemplate | undefined;
|
|
89
|
+
getAll(): ScreenTemplate[];
|
|
90
|
+
getByCategory(category: ScreenCategory): ScreenTemplate[];
|
|
91
|
+
findByRequiredComponents(components: string[]): ScreenTemplate[];
|
|
92
|
+
search(keyword: string): ScreenTemplate[];
|
|
93
|
+
getMetadata(id: string): TemplateRegistryEntry['metadata'] | undefined;
|
|
94
|
+
getMostUsed(limit?: number): ScreenTemplate[];
|
|
95
|
+
getRecentlyUsed(limit?: number): ScreenTemplate[];
|
|
96
|
+
clear(): void;
|
|
97
|
+
count(): number;
|
|
98
|
+
has(id: string): boolean;
|
|
99
|
+
remove(id: string): boolean;
|
|
100
|
+
}
|
|
101
|
+
declare const templateRegistry: TemplateRegistry;
|
|
102
|
+
|
|
103
|
+
declare function LoginTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
104
|
+
declare const LoginTemplate: ScreenTemplate;
|
|
105
|
+
|
|
106
|
+
declare function SignupTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
107
|
+
declare const SignupTemplate: ScreenTemplate;
|
|
108
|
+
|
|
109
|
+
declare function ForgotPasswordTemplateComponent({ children, className, slots, texts, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
110
|
+
declare const ForgotPasswordTemplate: ScreenTemplate;
|
|
111
|
+
|
|
112
|
+
declare function VerificationTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
113
|
+
declare const VerificationTemplate: ScreenTemplate;
|
|
114
|
+
|
|
115
|
+
declare function LandingTemplateComponent({ children, className, slots, texts, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
116
|
+
declare const LandingTemplate: ScreenTemplate;
|
|
117
|
+
|
|
118
|
+
declare function PreferencesTemplateComponent({ children, className, slots, texts, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
119
|
+
declare const PreferencesTemplate: ScreenTemplate;
|
|
120
|
+
|
|
121
|
+
declare function ProfileTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
122
|
+
declare const ProfileTemplate: ScreenTemplate;
|
|
123
|
+
|
|
124
|
+
declare function LoadingTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
125
|
+
declare const LoadingTemplate: ScreenTemplate;
|
|
126
|
+
|
|
127
|
+
declare function ErrorTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
128
|
+
declare const ErrorTemplate: ScreenTemplate;
|
|
129
|
+
|
|
130
|
+
declare function EmptyTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
131
|
+
declare const EmptyTemplate: ScreenTemplate;
|
|
132
|
+
|
|
133
|
+
declare function ConfirmationTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
134
|
+
declare const ConfirmationTemplate: ScreenTemplate;
|
|
135
|
+
|
|
136
|
+
declare function SuccessTemplateComponent({ children, className, slots, texts, options, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
137
|
+
declare const SuccessTemplate: ScreenTemplate;
|
|
138
|
+
|
|
139
|
+
declare function DashboardTemplateComponent({ children, className, slots, texts, }: ScreenTemplateProps): react_jsx_runtime.JSX.Element;
|
|
140
|
+
declare const DashboardTemplate: ScreenTemplate;
|
|
141
|
+
|
|
142
|
+
export { ConfirmationTemplate, ConfirmationTemplateComponent, type CustomizationBoundaries, DEFAULT_BREAKPOINTS, DEFAULT_RESPONSIVE_LAYOUT, DashboardTemplate, DashboardTemplateComponent, EmptyTemplate, EmptyTemplateComponent, ErrorTemplate, ErrorTemplateComponent, ForgotPasswordTemplate, ForgotPasswordTemplateComponent, LandingTemplate, LandingTemplateComponent, LoadingTemplate, LoadingTemplateComponent, LoginTemplate, LoginTemplateComponent, PreferencesTemplate, PreferencesTemplateComponent, ProfileTemplate, ProfileTemplateComponent, type ResponsiveBreakpoints, type ResponsiveLayout, type ScreenCategory, type ScreenTemplate, type ScreenTemplateProps, type SectionTemplate, SignupTemplate, SignupTemplateComponent, SuccessTemplate, SuccessTemplateComponent, type TemplateLayout, type TemplateLayoutConfig, TemplateRegistry, type TemplateRegistryEntry, type TemplateSkeleton, VerificationTemplate, VerificationTemplateComponent, templateRegistry };
|