@factorialco/f0-react 1.276.2 → 1.277.0

package/dist/f0.d.ts

@@ -1,12 +1,12 @@
 import { AlertTagCellValue } from '../../value-display/types/alertTag';
-import { AlertTagCellValue as AlertTagCellValue_2 } from './types/alertTag.tsx';
+import { AlertTagCellValue as AlertTagCellValue_2 } from './types/alertTag';
 import { AmountCellValue } from '../../value-display/types/amount';
-import { AmountCellValue as AmountCellValue_2 } from './types/amount.tsx';
+import { AmountCellValue as AmountCellValue_2 } from './types/amount';
 import { AnchorHTMLAttributes } from 'react';
 import { AriaAttributes } from 'react';
 import { AutoFill as AutoFill_2 } from 'react';
 import { AvatarListCellValue } from '../../value-display/types/avatarList';
-import { AvatarListCellValue as AvatarListCellValue_2 } from './types/avatarList.tsx';
+import { AvatarListCellValue as AvatarListCellValue_2 } from './types/avatarList';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { AvatarProps as AvatarProps_2 } from '@radix-ui/react-avatar';
 import { baseColors } from '@factorialco/f0-core';
@@ -16,29 +16,30 @@ import { ChartConfig as ChartConfig_2 } from './utils/types';
 import { ChartPropsBase } from './utils/types';
 import { ClassValue } from 'cva';
 import { CompanyCellValue } from '../../value-display/types/company';
-import { CompanyCellValue as CompanyCellValue_2 } from './types/company.tsx';
+import { CompanyCellValue as CompanyCellValue_2 } from './types/company';
 import { ComponentProps } from 'react';
+import { CountryCellValue } from './types/country';
 import { DateCellValue } from '../../value-display/types/date';
-import { DateCellValue as DateCellValue_2 } from './types/date.tsx';
+import { DateCellValue as DateCellValue_2 } from './types/date';
 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 { DotTagCellValue as DotTagCellValue_2 } from './types/dotTag';
 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';
-import { FileCellValue as FileCellValue_2 } from './types/file.tsx';
+import { FileCellValue as FileCellValue_2 } from './types/file';
 import { FolderCellValue } from '../../value-display/types/folder';
-import { FolderCellValue as FolderCellValue_2 } from './types/folder.tsx';
+import { FolderCellValue as FolderCellValue_2 } from './types/folder';
 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';
+import { IconCellValue } from './types/icon';
 import { ImgHTMLAttributes } from 'react';
 import { InFilterOptions } from './InFilter/types';
 import { internalAvatarColors as internalAvatarColors_2 } from '../../../ui/Avatar';
@@ -47,15 +48,15 @@ import { internalAvatarTypes as internalAvatarTypes_2 } from '../../../ui/Avatar
 import { JSX as JSX_2 } from 'react';
 import { LineChartConfig } from '../../ui/chart';
 import { LineChartPropsBase } from './utils/types';
-import { LongTextCellValue } from './types/longText.tsx';
+import { LongTextCellValue } from './types/longText';
 import { NumberCellValue } from '../../value-display/types/number';
-import { NumberCellValue as NumberCellValue_2 } from './types/number.tsx';
+import { NumberCellValue as NumberCellValue_2 } from './types/number';
 import { NumberFilterOptions } from './NumberFilter/NumberFilter';
 import { NumberFilterValue } from './NumberFilter/NumberFilter';
 import { Observable } from 'zen-observable-ts';
-import { PercentageCellValue } from './types/percentage.tsx';
+import { PercentageCellValue } from './types/percentage';
 import { PersonCellValue } from '../../value-display/types/person';
-import { PersonCellValue as PersonCellValue_2 } from './types/person.tsx';
+import { PersonCellValue as PersonCellValue_2 } from './types/person';
 import { PieChartProps } from './PieChart';
 import { PopoverContentProps } from '@radix-ui/react-popover';
 import * as React_2 from 'react';
@@ -64,16 +65,16 @@ import { ReactNode } from 'react';
 import { RefAttributes } from 'react';
 import { RefObject } from 'react';
 import { StatusCellValue } from '../../value-display/types/status';
-import { StatusCellValue as StatusCellValue_2 } from './types/status.tsx';
+import { StatusCellValue as StatusCellValue_2 } from './types/status';
 import { SVGProps } from 'react';
 import { TagCellValue } from '../../value-display/types/tag';
-import { TagCellValue as TagCellValue_2 } from './types/tag.tsx';
+import { TagCellValue as TagCellValue_2 } from './types/tag';
 import { TagListCellValue } from '../../value-display/types/tagList';
-import { TagListCellValue as TagListCellValue_2 } from './types/tagList.tsx';
+import { TagListCellValue as TagListCellValue_2 } from './types/tagList';
 import { TeamCellValue } from '../../value-display/types/team';
-import { TeamCellValue as TeamCellValue_2 } from './types/team.tsx';
+import { TeamCellValue as TeamCellValue_2 } from './types/team';
 import { TextCellValue } from '../../value-display/types/text';
-import { TextCellValue as TextCellValue_2 } from './types/text.tsx';
+import { TextCellValue as TextCellValue_2 } from './types/text';
 import { ValueDisplayRendererContext } from '../../value-display';
 import { VariantProps } from 'cva';
 
@@ -1035,6 +1036,8 @@ declare type ComponentTypes = (typeof componentTypes)[number];
 
 declare const componentTypes: readonly ["layout", "info", "action", "form"];
 
+declare type CountryCode = keyof TranslationsType["countries"];
+
 export declare function createAtlaskitDriver(instanceId: symbol): DndDriver;
 
 /**
@@ -1282,7 +1285,7 @@ export declare type DataSourceDefinition<R extends RecordType = RecordType, Filt
     currentGrouping?: GroupingState<R, Grouping>;
 };
 
-declare type DateFilterDefinition = BaseFilterDefinition<"date"> & {
+export declare type DateFilterDefinition = BaseFilterDefinition<"date"> & {
     options?: DateFilterOptions_2;
 };
 
@@ -1372,6 +1375,109 @@ declare type DateValue = {
 declare type DefaultAction = BannerAction;
 
 export declare const defaultTranslations: {
+    readonly countries: {
+        ad: string;
+        ae: string;
+        af: string;
+        ag: string;
+        ai: string;
+        al: string;
+        am: string;
+        ao: string;
+        ar: string;
+        as: string;
+        at: string;
+        au: string;
+        aw: string;
+        ax: string;
+        az: string;
+        ba: string;
+        bb: string;
+        bd: string;
+        be: string;
+        bf: string;
+        bg: string;
+        bh: string;
+        bi: string;
+        bj: string;
+        bm: string;
+        bo: string;
+        br: string;
+        bt: string;
+        bw: string;
+        by: string;
+        bz: string;
+        ca: string;
+        cd: string;
+        cf: string;
+        cg: string;
+        ch: string;
+        ci: string;
+        ck: string;
+        cl: string;
+        cm: string;
+        cn: string;
+        co: string;
+        cr: string;
+        cu: string;
+        cv: string;
+        cw: string;
+        cy: string;
+        cz: string;
+        de: string;
+        dj: string;
+        dk: string;
+        dm: string;
+        do: string;
+        dz: string;
+        ec: string;
+        ee: string;
+        eg: string;
+        er: string;
+        es: string;
+        et: string;
+        fi: string;
+        fj: string;
+        fk: string;
+        fm: string;
+        fo: string;
+        fr: string;
+        ga: string;
+        gb: string;
+        gd: string;
+        ge: string;
+        gg: string;
+        gh: string;
+        gi: string;
+        gl: string;
+        gm: string;
+        gn: string;
+        gq: string;
+        gr: string;
+        gt: string;
+        gu: string;
+        gw: string;
+        hk: string;
+        hn: string;
+        hr: string;
+        ht: string;
+        hu: string;
+        id: string;
+        ie: string;
+        il: string;
+        im: string;
+        in: string;
+        io: string;
+        iq: string;
+        ir: string;
+        is: string;
+        it: string;
+        je: string;
+        jm: string;
+        jo: string;
+        jp: string;
+        ke: string;
+    };
     readonly approvals: {
         readonly history: "Approval history";
         readonly statuses: {
@@ -1800,7 +1906,7 @@ export declare type F0AvatarFileProps = Omit<React.ComponentPropsWithoutRef<type
 } & Pick<BaseAvatarProps, "aria-label" | "aria-labelledby">;
 
 declare type F0AvatarFlagProps = {
-    flag: string;
+    flag: CountryCode;
     size?: BaseAvatarProps["size"];
     badge?: AvatarBadge;
 } & Pick<BaseAvatarProps, "aria-label" | "aria-labelledby">;
@@ -2271,6 +2377,26 @@ declare type FilterTypeSchema<Options extends object = never> = {
  */
 export declare type FilterValue<T extends FilterDefinition> = T extends InFilterDefinition<infer U> ? U[] : T extends SearchFilterDefinition ? string : T extends DateFilterDefinition ? DateRange | Date | undefined : T extends NumberFilterDefinition ? [number | undefined, number | undefined] | undefined : never;
 
+/**
+ * Extracts the value type for a specific filter key from a FiltersDefinition.
+ * This helper type allows for type-safe access to filter values when you know the specific filter key.
+ *
+ * @example
+ * ```ts
+ * type MyFilters = {
+ *   department: InFilterDefinition<string>
+ *   search: SearchFilterDefinition
+ * }
+ *
+ * type DepartmentValue = FilterValueByKey<MyFilters, 'department'> // string[]
+ * type SearchValue = FilterValueByKey<MyFilters, 'search'> // string
+ * ```
+ *
+ * @template Definition - The FiltersDefinition type
+ * @template Key - The specific filter key to extract the value type for
+ */
+export declare type FilterValueByKey<Definition extends Record<string, FilterDefinition>, Key extends keyof Definition> = FilterValue<Definition[Key]>;
+
 export declare type FlagAvatarVariant = Extract<AvatarVariant, {
     type: "flag";
 }>;
@@ -2456,7 +2582,7 @@ declare type ImageContextValue = {
 
 declare type ImageProps = ImgHTMLAttributes<HTMLImageElement>;
 
-declare type InFilterDefinition<T = unknown, R extends RecordType = RecordType> = BaseFilterDefinition<"in"> & {
+export declare type InFilterDefinition<T = string | number, R extends RecordType = RecordType> = BaseFilterDefinition<"in"> & {
     options: InFilterOptions_2<T, R>;
 };
 
@@ -2476,13 +2602,13 @@ declare type InFilterOptionItem<T = unknown> = {
  * Represents the options for the InFilter component.
  * @template T - Type of the underlying value
  */
-declare type InFilterOptions_2<T, R extends RecordType = RecordType> = {
+declare type InFilterOptions_2<T, _R extends RecordType = RecordType> = {
     cache?: boolean;
 } & ({
     options: Array<InFilterOptionItem<T>> | (() => Array<InFilterOptionItem<T>> | Promise<Array<InFilterOptionItem<T>>>);
 } | {
-    source: DataSourceDefinition<R, FiltersDefinition, SortingsDefinition, GroupingDefinition<R>>;
-    mapOptions: (item: R) => InFilterOptionItem<T>;
+    source: DataSourceDefinition<any, FiltersDefinition, SortingsDefinition, GroupingDefinition<any>>;
+    mapOptions: (item: any) => InFilterOptionItem<T>;
 });
 
 /**
@@ -2852,7 +2978,7 @@ export declare interface NextStepsProps {
     items: StepItemProps[];
 }
 
-declare type NumberFilterDefinition = BaseFilterDefinition<"number"> & {
+export declare type NumberFilterDefinition = BaseFilterDefinition<"number"> & {
     options?: NumberFilterOptions_2;
 };
 
@@ -3257,7 +3383,7 @@ declare type RegularAction = BaseAction & {
 
 declare type RendererDefinition = ValueDisplayRendererDefinition;
 
-declare type SearchFilterDefinition = BaseFilterDefinition<"search">;
+export declare type SearchFilterDefinition = BaseFilterDefinition<"search">;
 
 declare type SearchOptions = {
     /** Whether search is enabled */
@@ -3949,6 +4075,7 @@ export declare const useXRay: () => {
 
 declare type ValueDisplayRendererContext_2 = {
     visualization: ValueDisplayVisualizationType;
+    i18n: TranslationsType;
 };
 
 /**
@@ -3981,6 +4108,7 @@ declare const valueDisplayRenderers: {
     readonly icon: (args: IconCellValue, meta: ValueDisplayRendererContext_2) => JSX_2.Element;
     readonly file: (args: FileCellValue_2) => JSX_2.Element;
     readonly folder: (args: FolderCellValue_2) => JSX_2.Element;
+    readonly country: (args: CountryCellValue, context: ValueDisplayRendererContext_2) => JSX_2.Element;
 };
 
 declare type ValueDisplayVisualizationType = "table" | "card" | "list" | (string & {});
@@ -4052,6 +4180,31 @@ declare global {
 }
 
 
+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;
+    }
+}
+
+
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
         aiBlock: {
@@ -4079,31 +4232,6 @@ declare module "@tiptap/core" {
 }
 
 
-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;
-    }
-}
-
-
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
         moodTracker: {