@sisense/sdk-ui 1.11.0 → 1.13.0

package/dist/dashboard-widget/types.d.ts

@@ -48,6 +48,7 @@ export interface WidgetDto {
     desc: string | null;
     options?: {
         dashboardFiltersMode: `${WidgetDashboardFilterMode}`;
+        selector: boolean;
     };
 }
 export type FiltersIgnoringRules = {

package/dist/dashboard-widget/utils.d.ts

@@ -21,7 +21,9 @@ export declare function getRootPanelItem(item: PanelItem): PanelItem;
 export declare function getSortType(jaqlSort: `${JaqlSortDirection}` | undefined): SortDirection;
 /**
  * Merges two arrays of filter objects, prioritizing 'targetFilters' over 'sourceFilters',
- * and removes duplicates based on filter compare id
+ * and removes duplicates based on filter compare id.
+ *
+ * Saves the 'sourceFilters' filters order, while adds new filters to the end of the array.
  *
  * @param {Filter[]} [sourceFilters=[]] - The source array of filter objects.
  * @param {Filter[]} [targetFilters=[]] - The target array of filter objects.

package/dist/dynamic-size-container/dynamic-size-container.d.ts

@@ -24,7 +24,15 @@ export type DynamicSizeContainerProps = {
  * (3) Then the container's size is used.
  * (4) Otherwise the "defaultSize" is used.
  *
+ * Component Structure:
+ * The component layout consists of multiple layers to address different requirements:
+ * - Container layer: The top `div` that handles inheriting the parent size.
+ * - Content layer: The middle `div` that represents the actual content size.
+ * - Detached content layer: The bottom `div` that detaches the internal content (using "absolute" positioning) from the layout to prevent the parent layout from being constrained by its content size.
  *
+ * Limitations:
+ * - It is not possible to determine if a parent element has no size to inherit or if its size has been explicitly set to "0px".
+ *   Therefore, the default size will be applied when the parent element's size is set to "0px".
  *
  * @param {DynamicSizeContainerProps} props - DynamicSizeContainer properties.
  * @returns {JSX.Element} The DynamicSizeContainer component.

package/dist/filters/components/cascading-filter-tile/cascading-filter-tile.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="react" />
+import { CascadingFilter, Filter } from '@sisense/sdk-data';
+import { FilterVariant } from '../common/filter-utils.js';
+/**
+ * Props for {@link CascadingFilterTile}
+ *
+ * @internal
+ */
+export interface CascadingFilterTileProps {
+    /** Cascading filter object to initialize filter type and default values */
+    filter: CascadingFilter;
+    /** Arrangement of the filter inputs. Use vertical for standard filter tiles and horizontal for toolbars */
+    arrangement?: FilterVariant;
+    /** Callback returning filter object, or null for failure */
+    onChange: (filter: Filter) => void;
+}
+/**
+ * UI component representing group of cascading (dependent) filters.
+ *
+ * @param props - Cascading filter tile props
+ * @returns Cascading filter tile component
+ * @group Filter Tiles
+ * @internal
+ */
+export declare const CascadingFilterTile: import("react").FunctionComponent<CascadingFilterTileProps>;

package/dist/filters/components/cascading-filter-tile/cascading-level-filter.d.ts

@@ -0,0 +1,21 @@
+import { Filter } from '@sisense/sdk-data';
+/**
+ * Props of the {@link CascadingLevelFilterTile} component
+ *
+ * @internal
+ */
+export type CascadingLevelFilterTileProps = {
+    /** Filter to display */
+    filter: Filter;
+    parentFilters: Filter[];
+    /** Callback to handle filter change */
+    onChange: (filter: Filter | null) => void;
+    /** Whether the filter is the last in the list */
+    isLast?: boolean;
+};
+/**
+ * Filter tile component that renders a level filter based on its type
+ *
+ * @internal
+ */
+export declare const CascadingLevelFilterTile: ({ filter, parentFilters, onChange, isLast, }: CascadingLevelFilterTileProps) => import("react/jsx-runtime").JSX.Element;

package/dist/filters/components/cascading-filter-tile/index.d.ts

@@ -0,0 +1 @@
+export { CascadingFilterTile, type CascadingFilterTileProps } from './cascading-filter-tile';

package/dist/filters/components/common/date-range-field-button.d.ts

@@ -1,14 +1,11 @@
-import { CompleteThemeSettings } from '../../../types';
 import { type FunctionComponent, type ButtonHTMLAttributes } from 'react';
-type Variant = 'white' | 'grey';
+import { Themable } from '../../../theme-provider/types';
+export type Variant = 'white' | 'grey';
 type InputProps = {
     variant?: Variant;
     label?: string;
     isActive?: boolean;
 } & ButtonHTMLAttributes<HTMLButtonElement>;
-type ThemeMixin = {
-    theme: CompleteThemeSettings;
-};
-export type DateRangeFieldButtonProps = InputProps & ThemeMixin;
+export type DateRangeFieldButtonProps = InputProps & Themable;
 export declare const DateRangeFieldButton: FunctionComponent<DateRangeFieldButtonProps>;
 export {};

package/dist/filters/components/criteria-filter-tile/criteria-filter-operations.d.ts

@@ -1,4 +1,4 @@
-import { Measure } from '@sisense/sdk-data';
+import { Filter, Measure } from '@sisense/sdk-data';
 import { CriteriaFilterType } from './criteria-filter-tile';
 /**
  * Collection of filter options for the {@link CriteriaFilterMenu},
@@ -37,7 +37,7 @@ export type FilterOptionType = keyof typeof FilterOption;
  * @internal
  */
 export type FilterInfo = {
-    fn: Function;
+    fn: (...args: any[]) => Filter;
     inputCount: number;
     symbols: string[];
     message: string;

package/dist/filters/components/criteria-filter-tile/criteria-filter-tile.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { FilterTileDesignOptions } from '../filter-tile.js';
 import { ExcludeFilter, Filter, Measure, NumericFilter, RankingFilter, TextFilter } from '@sisense/sdk-data';
 import { FilterVariant } from '../common/filter-utils.js';
 /**
@@ -15,6 +16,11 @@ export interface CriteriaFilterTileProps {
     onUpdate: (filter: Filter | null) => void;
     /** List of available measures to rank by. Required only for ranking filters. */
     measures?: Measure[];
+    /**
+     * Design options for the filter tile component
+     * @internal
+     */
+    tileDesignOptions?: FilterTileDesignOptions;
 }
 export type CriteriaFilterType = NumericFilter | TextFilter | RankingFilter | ExcludeFilter;
 /**

package/dist/filters/components/custom-filter-tile.d.ts

@@ -0,0 +1,43 @@
+/// <reference types="react" />
+import { Filter } from '@sisense/sdk-data';
+/**
+ * Props for {@link CustomFilterTile}
+ *
+ * @internal
+ */
+export interface CustomFilterTileProps {
+    /** Custom filter. */
+    filter: Filter;
+    /**
+     * Callback to handle changes in custom filter.
+     *
+     * @param filter - Custom filter
+     */
+    onUpdate: (filter: Filter | null) => void;
+}
+/**
+ * UI component for a custom filter defined with JAQL.
+ *
+ * @internal
+ * @example
+ * ```tsx
+ * const filterJaql = { from: 10, to: 20000 };
+ *
+ * const [customFilter, setCustomFilter] = useState<Filter>(
+ *   filterFactory.customFilter(DM.Commerce.Cost, filterJaql),
+ * );
+ *
+ * return (
+ *   <CustomFilterTile
+ *     filter={customFilter}
+ *     onChange={(filter: Filter) => {
+ *       setCustomFilter(filter);
+ *     }}
+ *   />
+ * );
+ * ```
+ * @param props - Custom filter tile props
+ * @returns Custom filter tile component
+ * @group Filter Tiles
+ */
+export declare const CustomFilterTile: import("react").FunctionComponent<CustomFilterTileProps>;

package/dist/filters/components/date-filter/date-filter/date-filter.d.ts

@@ -27,6 +27,21 @@ export type DateRangeFilterProps = {
      * Whether this is a dependent filter.
      */
     isDependent?: boolean;
+    /**
+     * The variant of the date range field button.
+     * To be compatible with the old DateRangeFilterTile.
+     *
+     * TODO: Remove this prop when the old DateRangeFilterTile is deprecated.
+     * @internal
+     * @default 'grey'
+     */
+    variant?: 'white' | 'grey';
+    /**
+     * Whether the filter is disabled.
+     *
+     * @internal
+     */
+    disabled?: boolean;
 };
 /**
  * Date Filter component for filtering data by date range.

package/dist/filters/components/date-filter/date-range-filter-tile/date-range-filter-display.d.ts

@@ -0,0 +1,6 @@
+import { DateRangeFilter } from '@sisense/sdk-data';
+type DateRangeFilterDisplayProps = {
+    filter: DateRangeFilter;
+};
+export declare const DateRangeFilterDisplay: (props: DateRangeFilterDisplayProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/filters/components/date-filter/date-range-filter-tile/date-range-filter-tile.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import { LevelAttribute, DataSource, Filter } from '@sisense/sdk-data';
+import { FilterTileDesignOptions } from '../../filter-tile';
 export interface DateRangeFilterTileProps {
     /**
      * Filter tile title
@@ -41,6 +42,17 @@ export interface DateRangeFilterTileProps {
      * List of filters this filter is dependent on.
      */
     parentFilters?: Filter[];
+    /**
+     * Whether to display the filter as a tiled version.
+     * @default false
+     * @internal
+     */
+    tiled?: boolean;
+    /**
+     * Design options for the filter tile component
+     * @internal
+     */
+    tileDesignOptions?: FilterTileDesignOptions;
 }
 /**
  * Date Range Filter Tile component for filtering data by date range.

package/dist/filters/components/date-filter/date-range-filter-tile/editable-date-range-filter.d.ts

@@ -0,0 +1,14 @@
+import { DateRangeFilter } from '@sisense/sdk-data';
+import type { DateRangeFilterTileProps } from './date-range-filter-tile';
+import { DateLimits } from './use-date-limits';
+type EditableDateRangeFilterProps = DateRangeFilterTileProps & {
+    filter: DateRangeFilter;
+    dateLimits: Required<DateLimits>;
+    isOldDateRangeFilterTile?: boolean;
+    disabled?: boolean;
+};
+/**
+ * Editable Date Range Filter component for filtering data by date range.
+ */
+export declare const EditableDateRangeFilter: (props: EditableDateRangeFilterProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/filters/components/date-filter/date-range-filter-tile/use-date-limits.d.ts

@@ -1,7 +1,6 @@
 import { DataSource, Filter, LevelAttribute } from '@sisense/sdk-data';
-type DateLimits = {
+export type DateLimits = {
     minDate?: string;
     maxDate?: string;
 };
 export declare const useDateLimits: (userLimits: DateLimits, attribute: LevelAttribute, dataSource?: DataSource, parentFilters?: Filter[]) => Required<DateLimits> | null;
-export {};

package/dist/filters/components/date-filter/relative-date-filter-tile/relative-date-filter-tile.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import { Filter } from '@sisense/sdk-data';
 import { FilterVariant } from '../../common/index.js';
+import { FilterTileDesignOptions } from '../../filter-tile.js';
 /**
  * Props for {@link RelativeDateFilterTile}
  */
@@ -14,9 +15,9 @@ export interface RelativeDateFilterTileProps {
     /**
      * Callback function that is called when the relative date filter object should be updated.
      *
-     * @param filter - Relative date filter, or null for failure/disabled
+     * @param filter - Relative date filter
      */
-    onUpdate: (filter: Filter | null) => void;
+    onUpdate: (filter: Filter) => void;
     /**
      * Limit of the date range that can be selected.
      */
@@ -24,6 +25,11 @@ export interface RelativeDateFilterTileProps {
         maxDate: string;
         minDate: string;
     };
+    /**
+     * Design options for the filter tile component
+     * @internal
+     */
+    tileDesignOptions?: FilterTileDesignOptions;
 }
 /**
  * UI component that allows the user to filter date attributes according to

package/dist/filters/components/date-filter/relative-date-filter-tile/relative-date-filter.d.ts

@@ -1,4 +1,4 @@
-import { Filter, RelativeDateFilter as RelativeDateFilterType } from '@sisense/sdk-data';
+import { RelativeDateFilter as RelativeDateFilterType } from '@sisense/sdk-data';
 import { FilterVariant } from '../../common/index.js';
 import { FunctionComponent } from 'react';
 /**
@@ -7,7 +7,7 @@ import { FunctionComponent } from 'react';
 export interface RelativeDateFilterProps {
     filter: RelativeDateFilterType;
     arrangement?: FilterVariant;
-    onUpdate: (filter: Filter | null) => void;
+    onUpdate: (filter: RelativeDateFilterType) => void;
     disabled: boolean;
     limit?: {
         maxDate: string;
@@ -19,8 +19,8 @@ export interface RelativeDateFilterProps {
  */
 export declare const RelativeDateFilter: FunctionComponent<RelativeDateFilterProps>;
 export declare const DATE_OPS_MAP: {
-    [x: string]: string;
+    readonly [x: string]: "dateFilter.last" | "dateFilter.next";
 };
 export declare const DATE_LEVELS_MAP: {
-    [x: string]: string;
+    readonly [x: string]: "dateFilter.days" | "dateFilter.weeks" | "dateFilter.months" | "dateFilter.quarters" | "dateFilter.years";
 };

package/dist/filters/components/filter-tile.d.ts

@@ -1,11 +1,31 @@
 import type { FunctionComponent, ReactNode } from 'react';
 import { FilterVariant } from './common/filter-utils';
+import { DeepRequired } from 'ts-essentials';
+/**
+ * Design options for the filter tile component.
+ * @internal
+ */
+export interface FilterTileDesignOptions {
+    header?: {
+        shouldBeShown?: boolean;
+        isCollapsible?: boolean;
+        hasBorder?: boolean;
+    };
+    border?: {
+        shouldBeShown?: boolean;
+    };
+    footer?: {
+        shouldBeShown?: boolean;
+    };
+}
+export type CompleteFilterTileDesignOptions = DeepRequired<FilterTileDesignOptions>;
 interface Props {
-    title: string;
+    title?: string;
     renderContent: (collapsed: boolean, tileDisabled: boolean) => ReactNode;
     arrangement?: FilterVariant;
     disabled?: boolean;
     isDependent?: boolean;
+    design?: FilterTileDesignOptions;
     onToggleDisabled?: () => void;
 }
 /**

package/dist/filters/components/filters-panel/filters-panel-tile.d.ts

@@ -1,4 +1,4 @@
-import { Filter } from '@sisense/sdk-data';
+import { DataSource, Filter } from '@sisense/sdk-data';
 /**
  * Props of the {@link FiltersPanelTile} component
  *
@@ -9,10 +9,12 @@ export type FiltersPanelTileProps = {
     filter: Filter;
     /** Callback to handle filter change */
     onChange: (filter: Filter | null) => void;
+    /** Default data source used for filter tiles */
+    defaultDataSource?: DataSource;
 };
 /**
  * Filter tile component that renders a filter based on its type
  *
  * @internal
  */
-export declare const FiltersPanelTile: ({ filter, onChange }: FiltersPanelTileProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FiltersPanelTile: ({ filter, onChange, defaultDataSource, }: FiltersPanelTileProps) => import("react/jsx-runtime").JSX.Element;

package/dist/filters/components/filters-panel/filters-panel.d.ts

@@ -1,4 +1,4 @@
-import { Filter } from '@sisense/sdk-data';
+import { DataSource, Filter } from '@sisense/sdk-data';
 /**
  * Props of the {@link FiltersPanel} component
  *
@@ -9,10 +9,12 @@ export type FiltersPanelProps = {
     filters: Filter[];
     /** Callback to handle changes in filters */
     onFiltersChange: (filters: Filter[]) => void;
+    /** Default data source used for filter tiles */
+    defaultDataSource?: DataSource;
 };
 /**
  * Filters panel component that renders a list of filter tiles
  *
  * @internal
  */
-export declare const FiltersPanel: ({ filters, onFiltersChange }: FiltersPanelProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FiltersPanel: ({ filters, onFiltersChange, defaultDataSource, }: FiltersPanelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/filters/components/icons/arrow-icon.d.ts

@@ -0,0 +1,6 @@
+import { Themable } from '../../../theme-provider/types';
+import type { SVGProps } from 'react';
+export declare const ArrowIcon: (props: Pick<SVGProps<SVGElement>, 'className' | 'width' | 'height' | 'fill' | 'onClick'> & {
+    direction: 'left' | 'right';
+    disabled?: boolean;
+} & Themable) => import("react/jsx-runtime").JSX.Element;

package/dist/filters/components/icons/double-arrow-icon.d.ts

@@ -0,0 +1,6 @@
+import { Themable } from '../../../theme-provider/types';
+import type { SVGProps } from 'react';
+export declare const DoubleArrowIcon: (props: Pick<SVGProps<SVGElement>, 'className' | 'width' | 'height' | 'fill' | 'onClick'> & {
+    direction: 'left' | 'right';
+    disabled?: boolean;
+} & Themable) => import("react/jsx-runtime").JSX.Element;

package/dist/filters/components/member-filter-tile/member-filter-tile.d.ts

@@ -1,5 +1,6 @@
-import type { Attribute, DataSource, Filter } from '@sisense/sdk-data';
+import { Attribute, DataSource, Filter } from '@sisense/sdk-data';
 import { FunctionComponent } from 'react';
+import { FilterTileDesignOptions } from '../filter-tile';
 /**
  * Props for {@link MemberFilterTile}
  */
@@ -20,6 +21,8 @@ export interface MemberFilterTileProps {
     onChange: (filter: Filter | null) => void;
     /** List of filters this filter is dependent on */
     parentFilters?: Filter[];
+    /** Design options for the tile @internal */
+    tileDesignOptions?: FilterTileDesignOptions;
 }
 /**
  * UI component that allows the user to select members to include/exclude in a

package/dist/filters/components/member-filter-tile/member-list.d.ts

@@ -3,7 +3,7 @@ import { Member, SelectedMember } from './members-reducer';
 export interface MemberListProps {
     members: Member[];
     selectedMembers: SelectedMember[];
-    onSelectMember: (member: Member) => void;
+    onSelectMember: (member: Member, isSelected: boolean) => void;
     selectAllMembers: () => void;
     clearAllMembers: () => void;
     disabled: boolean;

package/dist/filters/hooks/use-synchronized-filter.d.ts

@@ -0,0 +1,12 @@
+import { Filter } from '@sisense/sdk-data';
+/**
+ * Filter tiles supposed to be Controlled components (stateless) and to react on passed `filter`.
+ * But to achieve backward compatibility, we also need to handle `filter` as internal state
+ * in case of using Filter tile as Uncontrolled component (statefull).
+ *
+ * This hook helps with synchronization for both patterns.
+ */
+export declare function useSynchronizedFilter<TFilter extends Filter = Filter>(filterFromProps: TFilter | null, updateFilterFromProps: (filter: TFilter) => void, createEmptyFilter?: () => TFilter): {
+    filter: TFilter;
+    updateFilter: (newFilter: TFilter) => void;
+};

package/dist/filters/index.d.ts

@@ -1,5 +1,7 @@
 export * from './components/member-filter-tile';
 export * from './components/date-filter';
 export * from './components/criteria-filter-tile';
+export * from './components/cascading-filter-tile';
 export * from './components/filters-panel';
+export * from './components/custom-filter-tile';
 export { type FilterVariant } from './components/common/filter-utils';

package/dist/filters/utils.d.ts

@@ -0,0 +1,7 @@
+import { type Filter } from '@sisense/sdk-data';
+/**
+ * Clones a filter with a toggled 'disabled' state.
+ * @param filter - Filter to clone
+ */
+export declare const cloneFilterAndToggleDisabled: <TFilter extends Filter>(filter: TFilter) => TFilter;
+export declare const cloneFilter: <TFilter extends Filter>(filter: TFilter) => TFilter;

package/dist/highcharts-memorized.d.ts

@@ -3,5 +3,5 @@ import { HighchartsOptionsInternal } from './chart-options-processor/chart-optio
 type HighchartsReactMemoizedProps = {
     options: HighchartsOptionsInternal;
 };
-export declare const HighchartsReactMemoized: import("react").MemoExoticComponent<({ options }: HighchartsReactMemoizedProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const HighchartsReactMemoized: import("react").NamedExoticComponent<HighchartsReactMemoizedProps>;
 export {};