@flowtomic/ui 0.1.9 → 0.1.11

package/dist/components/organisms/widget-palette/widget-palette.d.ts

@@ -0,0 +1,71 @@
+/**
+ * WidgetPalette - Organism Component
+ *
+ * Sidebar com widgets disponíveis para adicionar ao dashboard.
+ * Componente genérico e totalmente configurável via props.
+ */
+export interface WidgetPaletteItem {
+    /**
+     * ID único do widget
+     */
+    id: string;
+    /**
+     * Tipo do widget (string genérico)
+     */
+    type: string;
+    /**
+     * Nome do widget
+     */
+    name: string;
+    /**
+     * Descrição do widget
+     */
+    description: string;
+    /**
+     * Ícone do widget
+     */
+    icon: React.ComponentType<{
+        className?: string;
+    }>;
+    /**
+     * Tamanho padrão do widget (largura x altura)
+     */
+    defaultSize: {
+        w: number;
+        h: number;
+    };
+}
+export interface WidgetPaletteProps {
+    /**
+     * Se a paleta está aberta
+     */
+    isOpen: boolean;
+    /**
+     * Lista de widgets disponíveis (obrigatória)
+     */
+    widgets: WidgetPaletteItem[];
+    /**
+     * Callback para fechar a paleta
+     */
+    onClose?: () => void;
+    /**
+     * Título da paleta (opcional)
+     */
+    title?: string;
+    /**
+     * Descrição da paleta (opcional)
+     */
+    description?: string;
+    /**
+     * Classe CSS adicional
+     */
+    className?: string;
+}
+/**
+ * Paleta de widgets
+ *
+ * Componente genérico que exibe uma lista de widgets arrastáveis.
+ * Totalmente configurável via props, sem widgets hardcoded.
+ */
+export declare function WidgetPalette({ isOpen, widgets, onClose, title, description, className, }: WidgetPaletteProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=widget-palette.d.ts.map

package/dist/components/organisms/widget-palette/widget-palette.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"widget-palette.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/widget-palette/widget-palette.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAMH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAElD;;OAEG;IACH,WAAW,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACvC;AAED,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAsDD;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,EAC5B,MAAM,EACN,OAAO,EACP,OAAO,EACP,KAA6B,EAC7B,WAA2D,EAC3D,SAAS,GACV,EAAE,kBAAkB,kDAkDpB"}

package/dist/components/organisms/widget-palette/widget-palette.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * WidgetPalette - Organism Component
+ *
+ * Sidebar com widgets disponíveis para adicionar ao dashboard.
+ * Componente genérico e totalmente configurável via props.
+ */
+import { useDraggable } from "@dnd-kit/core";
+import { X } from "lucide-react";
+import { cn } from "@/lib/utils";
+/**
+ * Item de widget arrastável da paleta
+ */
+function DraggableWidgetItem({ widget }) {
+    const { attributes, listeners, setNodeRef, transform, isDragging } = useDraggable({
+        id: `palette-${widget.id}`,
+        data: {
+            type: "palette-widget",
+            widgetId: widget.id,
+            widgetType: widget.type,
+            defaultSize: widget.defaultSize,
+        },
+    });
+    const style = transform
+        ? {
+            transform: `translate3d(${transform.x}px, ${transform.y}px, 0)`,
+        }
+        : undefined;
+    const Icon = widget.icon;
+    return (_jsx("div", { ref: setNodeRef, style: style, ...listeners, ...attributes, className: cn("p-4 rounded-lg border-2 border-border bg-card", "cursor-grab active:cursor-grabbing", "hover:border-primary hover:shadow-md", "transition-all duration-200", isDragging && "opacity-50 z-50"), children: _jsxs("div", { className: "flex items-start gap-3", children: [_jsx("div", { className: "p-2 rounded-md bg-primary/10", children: _jsx(Icon, { className: "w-5 h-5 text-primary" }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("h4", { className: "font-semibold text-sm text-foreground mb-1", children: widget.name }), _jsx("p", { className: "text-xs text-muted-foreground line-clamp-2", children: widget.description }), _jsxs("div", { className: "mt-2 text-xs text-muted-foreground", children: [widget.defaultSize.w, " \u00D7 ", widget.defaultSize.h] })] })] }) }));
+}
+/**
+ * Paleta de widgets
+ *
+ * Componente genérico que exibe uma lista de widgets arrastáveis.
+ * Totalmente configurável via props, sem widgets hardcoded.
+ */
+export function WidgetPalette({ isOpen, widgets, onClose, title = "Widgets Disponíveis", description = "Arraste widgets para adicionar ao dashboard", className, }) {
+    if (!isOpen)
+        return null;
+    return (_jsxs("div", { className: cn("fixed right-0 top-0 h-full w-80 bg-background border-l border-border", "shadow-lg z-40 transition-transform duration-300", "flex flex-col", className), children: [_jsxs("div", { className: "p-4 border-b border-border", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h3", { className: "text-lg font-semibold text-foreground", children: title }), onClose && (_jsx("button", { type: "button", onClick: onClose, className: "p-1 rounded-md hover:bg-accent transition-colors", "aria-label": "Fechar paleta", children: _jsx(X, { className: "w-5 h-5" }) }))] }), _jsx("p", { className: "text-sm text-muted-foreground mt-1", children: description })] }), _jsx("div", { className: "flex-1 overflow-y-auto p-4 space-y-3", children: widgets.length === 0 ? (_jsx("div", { className: "text-center py-8 text-sm text-muted-foreground", children: "Nenhum widget dispon\u00EDvel" })) : (widgets.map((widget) => _jsx(DraggableWidgetItem, { widget: widget }, widget.id))) }), _jsx("div", { className: "p-4 border-t border-border bg-muted/50", children: _jsxs("p", { className: "text-xs text-muted-foreground text-center", children: [widgets.length, " ", widgets.length === 1 ? "widget" : "widgets", " dispon\u00EDvel", widgets.length !== 1 ? "eis" : ""] }) })] }));
+}

package/dist/index.d.ts

@@ -13,4 +13,5 @@ export * from "./components/atoms";
 export * from "./components/molecules";
 export * from "./components/organisms";
 export { cn } from "./lib/utils";
+export type { GridConfig, WidgetConfig, WidgetLayout } from "./types/dashboard";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,cAAc,oBAAoB,CAAC;AAGnC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,wBAAwB,CAAC;AAGvC,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,cAAc,oBAAoB,CAAC;AAGnC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,wBAAwB,CAAC;AAEvC,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC"}