@cfast/ui 0.0.1 → 0.1.0

package/dist/chunk-BQMXYYEV.js

@@ -1,348 +0,0 @@
-import {
-  useActionStatus,
-  useToast
-} from "./chunk-B2XXH5V4.js";
-
-// src/plugin.ts
-import { createContext, useContext, createElement as createElement2 } from "react";
-
-// src/headless-defaults.ts
-import { createElement } from "react";
-var headlessDefaults = {
-  // Actions
-  button: ({ children, onClick, disabled, loading, type }) => createElement(
-    "button",
-    { onClick, disabled: disabled || loading, type: type ?? "button" },
-    loading ? "Loading..." : children
-  ),
-  tooltip: ({ children, title }) => createElement("span", { title }, children),
-  confirmDialog: ({ open, onClose, onConfirm, title, description, confirmLabel, cancelLabel }) => open ? createElement(
-    "dialog",
-    { open: true },
-    createElement("p", null, createElement("strong", null, title)),
-    description ? createElement("p", null, description) : null,
-    createElement(
-      "div",
-      null,
-      createElement("button", { onClick: onClose }, cancelLabel ?? "Cancel"),
-      createElement("button", { onClick: onConfirm }, confirmLabel ?? "Confirm")
-    )
-  ) : null,
-  // Data display
-  table: ({ children }) => createElement("table", null, children),
-  tableHead: ({ children }) => createElement("thead", null, children),
-  tableBody: ({ children }) => createElement("tbody", null, children),
-  tableRow: ({ children, onClick }) => createElement("tr", { onClick }, children),
-  tableCell: ({ children, header, sortable, sortDirection, onSort }) => createElement(
-    header ? "th" : "td",
-    {
-      onClick: sortable ? onSort : void 0,
-      style: sortable ? { cursor: "pointer" } : void 0
-    },
-    children,
-    sortable && sortDirection ? sortDirection === "asc" ? " \u2191" : " \u2193" : null
-  ),
-  chip: ({ children, size }) => createElement(
-    "span",
-    {
-      style: {
-        display: "inline-block",
-        padding: size === "sm" ? "1px 6px" : "2px 8px",
-        borderRadius: "12px",
-        fontSize: size === "sm" ? "12px" : "14px",
-        backgroundColor: "#eee"
-      }
-    },
-    children
-  ),
-  // Layout
-  appShell: ({ children, sidebar, header }) => createElement(
-    "div",
-    { style: { display: "flex", minHeight: "100vh" } },
-    sidebar ? createElement("nav", null, sidebar) : null,
-    createElement(
-      "div",
-      { style: { flex: 1 } },
-      header ?? null,
-      createElement("main", null, children)
-    )
-  ),
-  sidebar: ({ children }) => createElement(
-    "aside",
-    { style: { width: "240px", borderRight: "1px solid #ddd" } },
-    children
-  ),
-  pageContainer: ({ children, title, actions }) => createElement(
-    "div",
-    null,
-    title || actions ? createElement(
-      "div",
-      { style: { display: "flex", justifyContent: "space-between", alignItems: "center" } },
-      title ? createElement("h1", null, title) : null,
-      actions ?? null
-    ) : null,
-    children
-  ),
-  breadcrumb: ({ items }) => createElement(
-    "nav",
-    { "aria-label": "breadcrumb" },
-    items.map(
-      (item, i) => createElement(
-        "span",
-        { key: i },
-        i > 0 ? " / " : null,
-        item.to ? createElement("a", { href: item.to }, item.label) : item.label
-      )
-    )
-  ),
-  // Feedback
-  toast: ({ children }) => createElement("div", null, children),
-  alert: ({ children, color }) => createElement(
-    "div",
-    {
-      role: "alert",
-      style: {
-        padding: "8px 12px",
-        borderRadius: "4px",
-        backgroundColor: color === "danger" ? "#fee" : color === "success" ? "#efe" : color === "warning" ? "#ffe" : "#f5f5f5"
-      }
-    },
-    children
-  ),
-  // File
-  dropZone: ({ children, isDragOver, onClick, onDrop, onDragOver, onDragLeave }) => createElement(
-    "div",
-    {
-      onClick,
-      onDrop: (e) => {
-        e.preventDefault();
-        onDrop(e.dataTransfer.files);
-      },
-      onDragOver: (e) => {
-        e.preventDefault();
-        onDragOver(e);
-      },
-      onDragLeave,
-      style: {
-        border: `2px dashed ${isDragOver ? "#4caf50" : "#ccc"}`,
-        borderRadius: "8px",
-        padding: "32px",
-        textAlign: "center",
-        cursor: "pointer"
-      }
-    },
-    children
-  )
-};
-
-// src/plugin.ts
-var UIPluginContext = createContext(null);
-function createUIPlugin(config) {
-  return { components: config.components };
-}
-function UIPluginProvider({
-  plugin,
-  children
-}) {
-  return createElement2(UIPluginContext.Provider, { value: plugin }, children);
-}
-function useUIPlugin() {
-  return useContext(UIPluginContext);
-}
-function useComponent(slot) {
-  const plugin = useUIPlugin();
-  const component = plugin?.components[slot];
-  if (component) {
-    return component;
-  }
-  return headlessDefaults[slot];
-}
-
-// src/hooks/use-confirm.ts
-import { createContext as createContext2, useContext as useContext2, useCallback } from "react";
-var ConfirmContext = createContext2(null);
-function useConfirm() {
-  const ctx = useContext2(ConfirmContext);
-  if (!ctx) {
-    throw new Error("useConfirm must be used within a <ConfirmProvider>");
-  }
-  return useCallback(
-    (options) => ctx.confirm(options),
-    [ctx]
-  );
-}
-
-// src/hooks/use-action-toast.ts
-import { useEffect, useRef } from "react";
-import { useActions } from "@cfast/actions/client";
-function useActionToast(descriptor, config) {
-  const actions = useActions(descriptor);
-  const toast = useToast();
-  const prevDataRef = useRef({});
-  useEffect(() => {
-    for (const [name, cfg] of Object.entries(config)) {
-      const actionFn = actions[name];
-      if (!actionFn) continue;
-      const result = actionFn();
-      const prevData = prevDataRef.current[name];
-      if (result.data !== void 0 && result.data !== prevData) {
-        prevDataRef.current[name] = result.data;
-        if (cfg.success) {
-          toast.success(cfg.success);
-        }
-      }
-      if (result.error !== void 0 && result.error !== prevData) {
-        prevDataRef.current[name] = result.error;
-        if (cfg.error) {
-          toast.error(cfg.error);
-        }
-      }
-    }
-  });
-}
-
-// src/components/permission-gate.tsx
-import { createElement as createElement3, Fragment } from "react";
-function PermissionGate({
-  action,
-  actionName,
-  input,
-  children,
-  fallback
-}) {
-  const status = useActionStatus(action, actionName, input);
-  if (status.invisible) {
-    return null;
-  }
-  if (!status.permitted) {
-    return fallback ? createElement3(Fragment, null, fallback) : null;
-  }
-  return createElement3(Fragment, null, children);
-}
-
-// src/components/action-button.tsx
-import { createElement as createElement4 } from "react";
-function ActionButton({
-  action,
-  actionName,
-  input,
-  children,
-  whenForbidden = "disable",
-  confirmation: _confirmation,
-  variant,
-  color,
-  size,
-  startDecorator
-}) {
-  const status = useActionStatus(action, actionName, input);
-  const Button = useComponent("button");
-  if (status.invisible) {
-    return null;
-  }
-  if (!status.permitted && whenForbidden === "hide") {
-    return null;
-  }
-  const disabled = !status.permitted && whenForbidden === "disable";
-  return createElement4(Button, {
-    children,
-    onClick: () => status.submit(),
-    disabled,
-    loading: status.pending,
-    variant,
-    color,
-    size,
-    startDecorator
-  });
-}
-
-// src/components/confirm-provider.tsx
-import { createElement as createElement5, useState, useCallback as useCallback2, useRef as useRef2 } from "react";
-function ConfirmProvider({ children }) {
-  const [state, setState] = useState(null);
-  const ConfirmDialog = useComponent("confirmDialog");
-  const resolveRef = useRef2(null);
-  const confirm = useCallback2((options) => {
-    return new Promise((resolve) => {
-      resolveRef.current = resolve;
-      setState({ ...options, resolve });
-    });
-  }, []);
-  const handleClose = useCallback2(() => {
-    resolveRef.current?.(false);
-    resolveRef.current = null;
-    setState(null);
-  }, []);
-  const handleConfirm = useCallback2(() => {
-    resolveRef.current?.(true);
-    resolveRef.current = null;
-    setState(null);
-  }, []);
-  return createElement5(
-    ConfirmContext.Provider,
-    { value: { confirm } },
-    children,
-    state ? createElement5(ConfirmDialog, {
-      open: true,
-      onClose: handleClose,
-      onConfirm: handleConfirm,
-      title: state.title,
-      description: state.description,
-      confirmLabel: state.confirmLabel,
-      cancelLabel: state.cancelLabel,
-      variant: state.variant
-    }) : null
-  );
-}
-
-// src/components/form-status.tsx
-import { createElement as createElement6 } from "react";
-function FormStatus({ data }) {
-  const Alert = useComponent("alert");
-  if (!data) return null;
-  const elements = [];
-  if (data.success) {
-    elements.push(
-      createElement6(Alert, { key: "success", color: "success", children: data.success })
-    );
-  }
-  if (data.error) {
-    elements.push(
-      createElement6(Alert, { key: "error", color: "danger", children: data.error })
-    );
-  }
-  if (data.fieldErrors) {
-    const errorMessages = Object.entries(data.fieldErrors).flatMap(
-      ([field, errors]) => errors.map((err) => `${field}: ${err}`)
-    );
-    if (errorMessages.length > 0) {
-      elements.push(
-        createElement6(Alert, {
-          key: "field-errors",
-          color: "danger",
-          children: createElement6(
-            "ul",
-            { style: { margin: 0, paddingLeft: "16px" } },
-            ...errorMessages.map(
-              (msg, i) => createElement6("li", { key: i }, msg)
-            )
-          )
-        })
-      );
-    }
-  }
-  if (elements.length === 0) return null;
-  return createElement6("div", { style: { display: "flex", flexDirection: "column", gap: "8px" } }, ...elements);
-}
-
-export {
-  createUIPlugin,
-  UIPluginProvider,
-  useUIPlugin,
-  useComponent,
-  useConfirm,
-  useActionToast,
-  PermissionGate,
-  ActionButton,
-  ConfirmProvider,
-  FormStatus
-};

package/dist/chunk-DTKBXCTU.js

@@ -1,211 +0,0 @@
-// src/plugin.ts
-import { createContext, useContext, createElement as createElement2 } from "react";
-
-// src/headless-defaults.ts
-import { createElement } from "react";
-var headlessDefaults = {
-  // Actions
-  button: ({ children, onClick, disabled, loading, type }) => createElement(
-    "button",
-    { onClick, disabled: disabled || loading, type: type ?? "button" },
-    loading ? "Loading..." : children
-  ),
-  tooltip: ({ children, title }) => createElement("span", { title }, children),
-  confirmDialog: ({ open, onClose, onConfirm, title, description, confirmLabel, cancelLabel }) => open ? createElement(
-    "dialog",
-    { open: true },
-    createElement("p", null, createElement("strong", null, title)),
-    description ? createElement("p", null, description) : null,
-    createElement(
-      "div",
-      null,
-      createElement("button", { onClick: onClose }, cancelLabel ?? "Cancel"),
-      createElement("button", { onClick: onConfirm }, confirmLabel ?? "Confirm")
-    )
-  ) : null,
-  // Data display
-  table: ({ children }) => createElement("table", null, children),
-  tableHead: ({ children }) => createElement("thead", null, children),
-  tableBody: ({ children }) => createElement("tbody", null, children),
-  tableRow: ({ children, onClick }) => createElement("tr", { onClick }, children),
-  tableCell: ({ children, header, sortable, sortDirection, onSort }) => createElement(
-    header ? "th" : "td",
-    {
-      onClick: sortable ? onSort : void 0,
-      style: sortable ? { cursor: "pointer" } : void 0
-    },
-    children,
-    sortable && sortDirection ? sortDirection === "asc" ? " \u2191" : " \u2193" : null
-  ),
-  chip: ({ children, size }) => createElement(
-    "span",
-    {
-      style: {
-        display: "inline-block",
-        padding: size === "sm" ? "1px 6px" : "2px 8px",
-        borderRadius: "12px",
-        fontSize: size === "sm" ? "12px" : "14px",
-        backgroundColor: "#eee"
-      }
-    },
-    children
-  ),
-  // Layout
-  appShell: ({ children, sidebar, header }) => createElement(
-    "div",
-    { style: { display: "flex", minHeight: "100vh" } },
-    sidebar ? createElement("nav", null, sidebar) : null,
-    createElement(
-      "div",
-      { style: { flex: 1 } },
-      header ?? null,
-      createElement("main", null, children)
-    )
-  ),
-  sidebar: ({ children }) => createElement(
-    "aside",
-    { style: { width: "240px", borderRight: "1px solid #ddd" } },
-    children
-  ),
-  pageContainer: ({ children, title, actions }) => createElement(
-    "div",
-    null,
-    title || actions ? createElement(
-      "div",
-      { style: { display: "flex", justifyContent: "space-between", alignItems: "center" } },
-      title ? createElement("h1", null, title) : null,
-      actions ?? null
-    ) : null,
-    children
-  ),
-  breadcrumb: ({ items }) => createElement(
-    "nav",
-    { "aria-label": "breadcrumb" },
-    items.map(
-      (item, i) => createElement(
-        "span",
-        { key: i },
-        i > 0 ? " / " : null,
-        item.to ? createElement("a", { href: item.to }, item.label) : item.label
-      )
-    )
-  ),
-  // Feedback
-  toast: ({ children }) => createElement("div", null, children),
-  alert: ({ children, color }) => createElement(
-    "div",
-    {
-      role: "alert",
-      style: {
-        padding: "8px 12px",
-        borderRadius: "4px",
-        backgroundColor: color === "danger" ? "#fee" : color === "success" ? "#efe" : color === "warning" ? "#ffe" : "#f5f5f5"
-      }
-    },
-    children
-  ),
-  // File
-  dropZone: ({ children, isDragOver, onClick, onDrop, onDragOver, onDragLeave }) => createElement(
-    "div",
-    {
-      onClick,
-      onDrop: (e) => {
-        e.preventDefault();
-        onDrop(e.dataTransfer.files);
-      },
-      onDragOver: (e) => {
-        e.preventDefault();
-        onDragOver(e);
-      },
-      onDragLeave,
-      style: {
-        border: `2px dashed ${isDragOver ? "#4caf50" : "#ccc"}`,
-        borderRadius: "8px",
-        padding: "32px",
-        textAlign: "center",
-        cursor: "pointer"
-      }
-    },
-    children
-  )
-};
-
-// src/plugin.ts
-var UIPluginContext = createContext(null);
-function createUIPlugin(config) {
-  return { components: config.components };
-}
-function UIPluginProvider({
-  plugin,
-  children
-}) {
-  return createElement2(UIPluginContext.Provider, { value: plugin }, children);
-}
-function useUIPlugin() {
-  return useContext(UIPluginContext);
-}
-function useComponent(slot) {
-  const plugin = useUIPlugin();
-  const component = plugin?.components[slot];
-  if (component) {
-    return component;
-  }
-  return headlessDefaults[slot];
-}
-
-// src/components/permission-gate.tsx
-import { createElement as createElement3, Fragment } from "react";
-function PermissionGate({
-  action,
-  children,
-  fallback
-}) {
-  if (action.invisible) {
-    return null;
-  }
-  if (!action.permitted) {
-    return fallback ? createElement3(Fragment, null, fallback) : null;
-  }
-  return createElement3(Fragment, null, children);
-}
-
-// src/components/action-button.tsx
-import { createElement as createElement4 } from "react";
-function ActionButton({
-  action,
-  children,
-  whenForbidden = "disable",
-  confirmation: _confirmation,
-  variant,
-  color,
-  size,
-  startDecorator
-}) {
-  const Button = useComponent("button");
-  if (action.invisible) {
-    return null;
-  }
-  if (!action.permitted && whenForbidden === "hide") {
-    return null;
-  }
-  const disabled = !action.permitted && whenForbidden === "disable";
-  return createElement4(Button, {
-    children,
-    onClick: () => action.submit(),
-    disabled,
-    loading: action.pending,
-    variant,
-    color,
-    size,
-    startDecorator
-  });
-}
-
-export {
-  createUIPlugin,
-  UIPluginProvider,
-  useUIPlugin,
-  useComponent,
-  PermissionGate,
-  ActionButton
-};

package/dist/chunk-EYIBATYR.js

@@ -1,33 +0,0 @@
-// src/hooks/use-action-status.ts
-import { useActions } from "@cfast/actions/client";
-function useActionStatus(descriptor, actionName, input) {
-  const actions = useActions(descriptor);
-  const name = actionName ?? descriptor.actionNames[0];
-  const actionFn = actions[name];
-  if (!actionFn) {
-    return {
-      permitted: false,
-      invisible: true,
-      reason: `Action "${name}" not found in descriptor`,
-      submit: () => {
-      },
-      pending: false,
-      data: void 0,
-      error: void 0
-    };
-  }
-  const result = actionFn(input);
-  return {
-    permitted: result.permitted,
-    invisible: result.invisible,
-    reason: result.reason,
-    submit: result.submit,
-    pending: result.pending,
-    data: result.data,
-    error: result.error
-  };
-}
-
-export {
-  useActionStatus
-};