@factorialco/f0-react 1.274.0 → 1.276.0

package/dist/f0.css

@@ -0,0 +1 @@
+.grid-stack{position:relative}.grid-stack-rtl{direction:ltr}.grid-stack-rtl>.grid-stack-item{direction:rtl}.grid-stack-placeholder>.placeholder-content{background-color:#0000001a;margin:0;position:absolute;width:auto;z-index:0!important}.grid-stack>.grid-stack-item{position:absolute;padding:0;top:0;left:0;width:var(--gs-column-width);height:var(--gs-cell-height)}.grid-stack>.grid-stack-item>.grid-stack-item-content{margin:0;position:absolute;width:auto;overflow-x:hidden;overflow-y:auto}.grid-stack>.grid-stack-item.size-to-content:not(.size-to-content-max)>.grid-stack-item-content{overflow-y:hidden}.grid-stack>.grid-stack-item>.grid-stack-item-content,.grid-stack>.grid-stack-placeholder>.placeholder-content{top:var(--gs-item-margin-top);right:var(--gs-item-margin-right);bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-handle{position:absolute;font-size:.1px;display:block;touch-action:none}.grid-stack-item.ui-resizable-disabled>.ui-resizable-handle,.grid-stack-item.ui-resizable-autohide>.ui-resizable-handle{display:none}.grid-stack-item>.ui-resizable-ne,.grid-stack-item>.ui-resizable-nw,.grid-stack-item>.ui-resizable-se,.grid-stack-item>.ui-resizable-sw{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23666" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 20 20"><path d="m10 3 2 2H8l2-2v14l-2-2h4l-2 2"/></svg>');background-repeat:no-repeat;background-position:center}.grid-stack-item>.ui-resizable-ne{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-sw{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-nw{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-se{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-nw{cursor:nw-resize;width:20px;height:20px;top:var(--gs-item-margin-top);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-n{cursor:n-resize;height:10px;top:var(--gs-item-margin-top);left:25px;right:25px}.grid-stack-item>.ui-resizable-ne{cursor:ne-resize;width:20px;height:20px;top:var(--gs-item-margin-top);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-e{cursor:e-resize;width:10px;top:15px;bottom:15px;right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-se{cursor:se-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-s{cursor:s-resize;height:10px;left:25px;bottom:var(--gs-item-margin-bottom);right:25px}.grid-stack-item>.ui-resizable-sw{cursor:sw-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-w{cursor:w-resize;width:10px;top:15px;bottom:15px;left:var(--gs-item-margin-left)}.grid-stack-item.ui-draggable-dragging>.ui-resizable-handle{display:none!important}.grid-stack-item.ui-draggable-dragging{will-change:left,top}.grid-stack-item.ui-resizable-resizing{will-change:width,height}.ui-draggable-dragging,.ui-resizable-resizing{z-index:10000}.ui-draggable-dragging>.grid-stack-item-content,.ui-resizable-resizing>.grid-stack-item-content{box-shadow:1px 4px 6px #0003;opacity:.8}.grid-stack-animate,.grid-stack-animate .grid-stack-item{transition:left .3s,top .3s,height .3s,width .3s}.grid-stack-animate .grid-stack-item.ui-draggable-dragging,.grid-stack-animate .grid-stack-item.ui-resizable-resizing,.grid-stack-animate .grid-stack-item.grid-stack-placeholder{transition:left 0s,top 0s,height 0s,width 0s}.grid-stack>.grid-stack-item[gs-y="0"]{top:0}.grid-stack>.grid-stack-item[gs-x="0"]{left:0%}

package/dist/f0.d.ts

@@ -24,6 +24,8 @@ import { DateFilterOptions } from './DateFilter/DateFilter';
 import { default as default_2 } from 'react';
 import { DotTagCellValue } from '../../value-display/types/dotTag';
 import { DotTagCellValue as DotTagCellValue_2 } from './types/dotTag.tsx';
+import { F0GridStackProps as F0GridStackProps_2 } from './F0GridStack';
+import { F0GridStackRef as F0GridStackRef_2 } from './F0GridStack';
 import { F0IconProps as F0IconProps_2 } from './F0Icon';
 import { f1Colors } from '@factorialco/f0-core';
 import { FileCellValue } from '../../value-display/types/file';
@@ -32,6 +34,8 @@ import { FolderCellValue } from '../../value-display/types/folder';
 import { FolderCellValue as FolderCellValue_2 } from './types/folder.tsx';
 import { ForwardedRef } from 'react';
 import { ForwardRefExoticComponent } from 'react';
+import { GridStackOptions } from 'gridstack';
+import { GridStackWidget } from 'gridstack';
 import { HTMLAttributeAnchorTarget } from 'react';
 import { HTMLAttributes } from 'react';
 import { IconCellValue } from './types/icon.tsx';
@@ -1447,6 +1451,8 @@ export declare const defaultTranslations: {
             readonly rangeTitle: "Use range";
             readonly range: "Between {{min}} and {{max}}";
         };
+        readonly selectAll: "Select all";
+        readonly clear: "Clear";
     };
     readonly toc: {
         readonly search: "Search...";
@@ -1476,6 +1482,12 @@ export declare const defaultTranslations: {
             readonly settings: "{{visualizationName}} settings";
             readonly reset: "Reset to default";
         };
+        readonly table: {
+            readonly settings: {
+                readonly showAllColumns: "Show all";
+                readonly hideAllColumns: "Hide all";
+            };
+        };
         readonly itemsCount: "items";
         readonly emptyStates: {
             readonly noData: {
@@ -2047,6 +2059,55 @@ export declare type F0DropdownButtonProps<T = string> = {
 
 export declare function F0EventCatcherProvider({ children, onEvent, enabled, catchEvents, }: EventCatcherProviderProps): JSX.Element;
 
+export declare const F0GridStack: ForwardRefExoticComponent<F0GridStackProps_2 & RefAttributes<F0GridStackRef_2>>;
+
+export declare interface F0GridStackProps {
+    options: GridStackReactOptions;
+    widgets: GridStackReactWidget[];
+    onChange?: (layout: GridStackWidgetPosition[]) => void;
+}
+
+/**
+ * Methods exposed via ref to control the grid programmatically.
+ * @example
+ * ```tsx
+ * const gridRef = useRef<F0GridStackRef>(null)
+ *
+ * // Add a widget
+ * gridRef.current?.addWidget({
+ *   id: 'new-widget',
+ *   w: 2,
+ *   h: 2,
+ *   renderFn: () => <div>Content</div>
+ *   meta: {
+ *     // Your metadata associated with the widget
+ *   }
+ * })
+ *
+ * // Remove a widget
+ * gridRef.current?.removeWidget('widget-id')
+ *
+ * // Remove all widgets
+ * gridRef.current?.removeAll()
+ *
+ * // Save current layout
+ * const layout = gridRef.current?.saveOptions()
+ * ```
+ */
+export declare interface F0GridStackRef {
+    addWidget: (widget: GridStackReactWidget) => void;
+    removeWidget: (id: string) => void;
+    addSubGrid: (subGrid: GridStackReactWidget & {
+        id: Required<GridStackWidget>["id"];
+        subGridOpts: Required<GridStackWidget>["subGridOpts"] & {
+            children: Array<GridStackWidget & {
+                id: Required<GridStackWidget>["id"];
+            }>;
+        };
+    }) => void;
+    removeAll: () => void;
+}
+
 export declare const F0Icon: ForwardRefExoticComponent<Omit<Omit<F0IconProps_2, "ref"> & RefAttributes<SVGSVGElement>, "ref"> & RefAttributes<HTMLElement | SVGElement>>;
 
 export declare interface F0IconProps extends SVGProps<SVGSVGElement>, VariantProps<typeof iconVariants> {
@@ -2276,6 +2337,31 @@ declare type GranularityDefinitionKey = keyof typeof granularityDefinitions;
 
 declare const granularityDefinitions: Record<string, GranularityDefinition>;
 
+export declare type GridStackReactOptions = Omit<GridStackOptions, "children">;
+
+export declare type GridStackReactSize = {
+    w: number;
+    h: number;
+};
+
+export declare interface GridStackReactWidget extends GridStackWidget {
+    id: Required<GridStackWidget>["id"];
+    allowedSizes?: GridStackReactSize[];
+    renderFn?: () => React.ReactElement;
+}
+
+/**
+ * Represents a node in the grid layout.
+ */
+export declare interface GridStackWidgetPosition {
+    id: string;
+    w: number;
+    h: number;
+    x: number;
+    y: number;
+    meta?: Record<string, unknown>;
+}
+
 /**
  * Symbol used to identify the groupId in the data
  */
@@ -3977,8 +4063,8 @@ declare module "@tiptap/core" {
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        liveCompanion: {
-            insertLiveCompanion: (data: LiveCompanionData, config?: LiveCompanionConfig) => ReturnType;
+        transcript: {
+            insertTranscript: (data: TranscriptData, config?: TranscriptConfig) => ReturnType;
         };
     }
 }
@@ -3986,15 +4072,35 @@ declare module "@tiptap/core" {
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        transcript: {
-            insertTranscript: (data: TranscriptData, config?: TranscriptConfig) => ReturnType;
+        liveCompanion: {
+            insertLiveCompanion: (data: LiveCompanionData, config?: LiveCompanionConfig) => ReturnType;
         };
     }
 }
 
 
-declare namespace Calendar {
-    var displayName: string;
+declare module "gridstack" {
+    interface GridStackWidget {
+        id?: string;
+        allowedSizes?: Array<{
+            w: number;
+            h: number;
+        }>;
+        renderFn?: () => React.ReactElement | null;
+        meta?: Record<string, unknown>;
+    }
+    interface GridStackNode {
+        id?: string;
+        w?: number;
+        h?: number;
+        x?: number;
+        y?: number;
+        allowedSizes?: Array<{
+            w: number;
+            h: number;
+        }>;
+        renderFn?: () => React.ReactElement | null;
+    }
 }
 
 
@@ -4005,3 +4111,8 @@ declare module "@tiptap/core" {
         };
     }
 }
+
+
+declare namespace Calendar {
+    var displayName: string;
+}