@cfast/ui 0.0.1 → 0.2.0

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.
Files changed (51) hide show
  1. package/README.md +23 -23
  2. package/dist/chunk-PWBG6CGF.js +1400 -0
  3. package/dist/{permission-gate-DVmY42oz.d.ts → client-CIx8_tmv.d.ts} +617 -2
  4. package/dist/client.d.ts +4 -617
  5. package/dist/client.js +6 -8
  6. package/dist/index.d.ts +52 -5
  7. package/dist/index.js +17 -13
  8. package/llms.txt +159 -0
  9. package/package.json +25 -41
  10. package/LICENSE +0 -21
  11. package/dist/chunk-755IRYDN.js +0 -941
  12. package/dist/chunk-7SNK37GF.js +0 -418
  13. package/dist/chunk-ASMYTWTR.js +0 -356
  14. package/dist/chunk-B2XXH5V4.js +0 -66
  15. package/dist/chunk-BQMXYYEV.js +0 -348
  16. package/dist/chunk-DTKBXCTU.js +0 -211
  17. package/dist/chunk-EYIBATYR.js +0 -33
  18. package/dist/chunk-FPZAQ2YQ.js +0 -474
  19. package/dist/chunk-G2OU4BYC.js +0 -205
  20. package/dist/chunk-JEGEIQ3R.js +0 -925
  21. package/dist/chunk-JUNLQJ6H.js +0 -1013
  22. package/dist/chunk-NRGMW3JA.js +0 -906
  23. package/dist/chunk-Q6FPL2OJ.js +0 -1086
  24. package/dist/chunk-QHWAGKNW.js +0 -456
  25. package/dist/chunk-QZT62CGJ.js +0 -924
  26. package/dist/chunk-RDTUEOLK.js +0 -486
  27. package/dist/chunk-RESL4IJJ.js +0 -112
  28. package/dist/chunk-UDCWQUTR.js +0 -221
  29. package/dist/chunk-UE7PZOIJ.js +0 -11
  30. package/dist/chunk-UTZTHGNE.js +0 -84
  31. package/dist/chunk-UVRXMOX5.js +0 -439
  32. package/dist/chunk-XFD3N2D4.js +0 -161
  33. package/dist/client-CXIHCQtA.d.ts +0 -274
  34. package/dist/joy.d.ts +0 -199
  35. package/dist/joy.js +0 -1150
  36. package/dist/permission-gate-apt9T9Mu.d.ts +0 -1256
  37. package/dist/types-1bAiH2uK.d.ts +0 -392
  38. package/dist/types-BX6u5sAd.d.ts +0 -403
  39. package/dist/types-BpdY7w5l.d.ts +0 -403
  40. package/dist/types-BrepeVp8.d.ts +0 -403
  41. package/dist/types-BvAqMZhn.d.ts +0 -403
  42. package/dist/types-C74nSscq.d.ts +0 -403
  43. package/dist/types-DD1Cpx8F.d.ts +0 -403
  44. package/dist/types-DHUhQwJn.d.ts +0 -403
  45. package/dist/types-DZSJNt_M.d.ts +0 -392
  46. package/dist/types-DaaJiIjW.d.ts +0 -391
  47. package/dist/types-LUpWJwps.d.ts +0 -403
  48. package/dist/types-a7zVU6WE.d.ts +0 -394
  49. package/dist/types-biJTHMcH.d.ts +0 -403
  50. package/dist/types-ow_qSEYJ.d.ts +0 -392
  51. package/dist/types-wnLasZaB.d.ts +0 -1234
@@ -1,221 +0,0 @@
1
- import {
2
- useActionStatus
3
- } from "./chunk-EYIBATYR.js";
4
-
5
- // src/plugin.ts
6
- import { createContext, useContext, createElement as createElement2 } from "react";
7
-
8
- // src/headless-defaults.ts
9
- import { createElement } from "react";
10
- var headlessDefaults = {
11
- // Actions
12
- button: ({ children, onClick, disabled, loading, type }) => createElement(
13
- "button",
14
- { onClick, disabled: disabled || loading, type: type ?? "button" },
15
- loading ? "Loading..." : children
16
- ),
17
- tooltip: ({ children, title }) => createElement("span", { title }, children),
18
- confirmDialog: ({ open, onClose, onConfirm, title, description, confirmLabel, cancelLabel }) => open ? createElement(
19
- "dialog",
20
- { open: true },
21
- createElement("p", null, createElement("strong", null, title)),
22
- description ? createElement("p", null, description) : null,
23
- createElement(
24
- "div",
25
- null,
26
- createElement("button", { onClick: onClose }, cancelLabel ?? "Cancel"),
27
- createElement("button", { onClick: onConfirm }, confirmLabel ?? "Confirm")
28
- )
29
- ) : null,
30
- // Data display
31
- table: ({ children }) => createElement("table", null, children),
32
- tableHead: ({ children }) => createElement("thead", null, children),
33
- tableBody: ({ children }) => createElement("tbody", null, children),
34
- tableRow: ({ children, onClick }) => createElement("tr", { onClick }, children),
35
- tableCell: ({ children, header, sortable, sortDirection, onSort }) => createElement(
36
- header ? "th" : "td",
37
- {
38
- onClick: sortable ? onSort : void 0,
39
- style: sortable ? { cursor: "pointer" } : void 0
40
- },
41
- children,
42
- sortable && sortDirection ? sortDirection === "asc" ? " \u2191" : " \u2193" : null
43
- ),
44
- chip: ({ children, size }) => createElement(
45
- "span",
46
- {
47
- style: {
48
- display: "inline-block",
49
- padding: size === "sm" ? "1px 6px" : "2px 8px",
50
- borderRadius: "12px",
51
- fontSize: size === "sm" ? "12px" : "14px",
52
- backgroundColor: "#eee"
53
- }
54
- },
55
- children
56
- ),
57
- // Layout
58
- appShell: ({ children, sidebar, header }) => createElement(
59
- "div",
60
- { style: { display: "flex", minHeight: "100vh" } },
61
- sidebar ? createElement("nav", null, sidebar) : null,
62
- createElement(
63
- "div",
64
- { style: { flex: 1 } },
65
- header ?? null,
66
- createElement("main", null, children)
67
- )
68
- ),
69
- sidebar: ({ children }) => createElement(
70
- "aside",
71
- { style: { width: "240px", borderRight: "1px solid #ddd" } },
72
- children
73
- ),
74
- pageContainer: ({ children, title, actions }) => createElement(
75
- "div",
76
- null,
77
- title || actions ? createElement(
78
- "div",
79
- { style: { display: "flex", justifyContent: "space-between", alignItems: "center" } },
80
- title ? createElement("h1", null, title) : null,
81
- actions ?? null
82
- ) : null,
83
- children
84
- ),
85
- breadcrumb: ({ items }) => createElement(
86
- "nav",
87
- { "aria-label": "breadcrumb" },
88
- items.map(
89
- (item, i) => createElement(
90
- "span",
91
- { key: i },
92
- i > 0 ? " / " : null,
93
- item.to ? createElement("a", { href: item.to }, item.label) : item.label
94
- )
95
- )
96
- ),
97
- // Feedback
98
- toast: ({ children }) => createElement("div", null, children),
99
- alert: ({ children, color }) => createElement(
100
- "div",
101
- {
102
- role: "alert",
103
- style: {
104
- padding: "8px 12px",
105
- borderRadius: "4px",
106
- backgroundColor: color === "danger" ? "#fee" : color === "success" ? "#efe" : color === "warning" ? "#ffe" : "#f5f5f5"
107
- }
108
- },
109
- children
110
- ),
111
- // File
112
- dropZone: ({ children, isDragOver, onClick, onDrop, onDragOver, onDragLeave }) => createElement(
113
- "div",
114
- {
115
- onClick,
116
- onDrop: (e) => {
117
- e.preventDefault();
118
- onDrop(e.dataTransfer.files);
119
- },
120
- onDragOver: (e) => {
121
- e.preventDefault();
122
- onDragOver(e);
123
- },
124
- onDragLeave,
125
- style: {
126
- border: `2px dashed ${isDragOver ? "#4caf50" : "#ccc"}`,
127
- borderRadius: "8px",
128
- padding: "32px",
129
- textAlign: "center",
130
- cursor: "pointer"
131
- }
132
- },
133
- children
134
- )
135
- };
136
-
137
- // src/plugin.ts
138
- var UIPluginContext = createContext(null);
139
- function createUIPlugin(config) {
140
- return { components: config.components };
141
- }
142
- function UIPluginProvider({
143
- plugin,
144
- children
145
- }) {
146
- return createElement2(UIPluginContext.Provider, { value: plugin }, children);
147
- }
148
- function useUIPlugin() {
149
- return useContext(UIPluginContext);
150
- }
151
- function useComponent(slot) {
152
- const plugin = useUIPlugin();
153
- const component = plugin?.components[slot];
154
- if (component) {
155
- return component;
156
- }
157
- return headlessDefaults[slot];
158
- }
159
-
160
- // src/components/permission-gate.tsx
161
- import { createElement as createElement3, Fragment } from "react";
162
- function PermissionGate({
163
- action,
164
- actionName,
165
- input,
166
- children,
167
- fallback
168
- }) {
169
- const status = useActionStatus(action, actionName, input);
170
- if (status.invisible) {
171
- return null;
172
- }
173
- if (!status.permitted) {
174
- return fallback ? createElement3(Fragment, null, fallback) : null;
175
- }
176
- return createElement3(Fragment, null, children);
177
- }
178
-
179
- // src/components/action-button.tsx
180
- import { createElement as createElement4 } from "react";
181
- function ActionButton({
182
- action,
183
- actionName,
184
- input,
185
- children,
186
- whenForbidden = "disable",
187
- confirmation: _confirmation,
188
- variant,
189
- color,
190
- size,
191
- startDecorator
192
- }) {
193
- const status = useActionStatus(action, actionName, input);
194
- const Button = useComponent("button");
195
- if (status.invisible) {
196
- return null;
197
- }
198
- if (!status.permitted && whenForbidden === "hide") {
199
- return null;
200
- }
201
- const disabled = !status.permitted && whenForbidden === "disable";
202
- return createElement4(Button, {
203
- children,
204
- onClick: () => status.submit(),
205
- disabled,
206
- loading: status.pending,
207
- variant,
208
- color,
209
- size,
210
- startDecorator
211
- });
212
- }
213
-
214
- export {
215
- createUIPlugin,
216
- UIPluginProvider,
217
- useUIPlugin,
218
- useComponent,
219
- PermissionGate,
220
- ActionButton
221
- };
@@ -1,11 +0,0 @@
1
- // src/hooks/use-action-status.ts
2
- import { useActions } from "@cfast/actions/client";
3
- function useActionStatus(descriptor) {
4
- const actions = useActions(descriptor);
5
- const name = descriptor.actionNames[0];
6
- return actions[name]();
7
- }
8
-
9
- export {
10
- useActionStatus
11
- };
@@ -1,84 +0,0 @@
1
- // src/hooks/use-toast.ts
2
- import { createContext, useContext, useCallback } from "react";
3
- var ToastContext = createContext(null);
4
- function useToast() {
5
- const ctx = useContext(ToastContext);
6
- if (!ctx) {
7
- throw new Error("useToast must be used within a <ToastProvider>");
8
- }
9
- const show = useCallback(
10
- (options) => ctx.show(options),
11
- [ctx]
12
- );
13
- const success = useCallback(
14
- (message, description) => ctx.show({ message, type: "success", description }),
15
- [ctx]
16
- );
17
- const error = useCallback(
18
- (message, description) => ctx.show({ message, type: "error", description }),
19
- [ctx]
20
- );
21
- const info = useCallback(
22
- (message, description) => ctx.show({ message, type: "info", description }),
23
- [ctx]
24
- );
25
- const warning = useCallback(
26
- (message, description) => ctx.show({ message, type: "warning", description }),
27
- [ctx]
28
- );
29
- return { show, success, error, info, warning };
30
- }
31
-
32
- // src/components/avatar-with-initials.tsx
33
- import { jsx } from "react/jsx-runtime";
34
- function getInitials(name) {
35
- return name.split(" ").map((part) => part[0]).join("").toUpperCase().slice(0, 2);
36
- }
37
- var sizeMap = { sm: 32, md: 40, lg: 56 };
38
- function AvatarWithInitials({
39
- src,
40
- name,
41
- size = "md"
42
- }) {
43
- const px = sizeMap[size];
44
- if (src) {
45
- return /* @__PURE__ */ jsx(
46
- "img",
47
- {
48
- src,
49
- alt: name,
50
- style: {
51
- width: px,
52
- height: px,
53
- borderRadius: "50%",
54
- objectFit: "cover"
55
- }
56
- }
57
- );
58
- }
59
- return /* @__PURE__ */ jsx(
60
- "span",
61
- {
62
- "aria-label": name,
63
- style: {
64
- display: "inline-flex",
65
- alignItems: "center",
66
- justifyContent: "center",
67
- width: px,
68
- height: px,
69
- borderRadius: "50%",
70
- backgroundColor: "#ddd",
71
- fontSize: px * 0.4,
72
- fontWeight: "bold"
73
- },
74
- children: getInitials(name)
75
- }
76
- );
77
- }
78
-
79
- export {
80
- ToastContext,
81
- useToast,
82
- getInitials,
83
- AvatarWithInitials
84
- };