pixel-react 1.4.2 → 1.4.4

package/lib/components/AddResourceButton/type.d.ts

@@ -49,7 +49,7 @@ export interface AddResourceButtonProps {
  * @property {boolean} isActive - Specifies if the button is in an active state (highlighted when selected).
  */
 export interface DirectionalArrowButtonProps {
-    direction: string | 'top' | 'right' | 'down';
+    direction: 'top' | 'right' | 'down';
     menuOptions: {
         label: string;
         value: string | string[];

package/lib/components/Drawer/Types.d.ts

@@ -133,4 +133,8 @@ export interface DrawerProps {
      * Custom z-index for the secondary drawer
      */
     secondLayerZIndex?: boolean;
+    /**
+     * Custom top for the drawer
+     */
+    top?: string;
 }

package/lib/components/Excel/ExcelContextMenu/ExcelContextMenu.d.ts

@@ -0,0 +1,13 @@
+import './ExcelContextMenu.scss';
+import * as Matrix from '../ExcelFile/ExcelFileComponents/matrix';
+import { CellBase, ContextMenuState } from '../ExcelFile/ExcelFileComponents/types';
+type ExcelContextMenuProps = {
+    data: Matrix.Matrix<CellBase>;
+    contextMenu: ContextMenuState;
+    addRowTop: (data: Matrix.Matrix<CellBase>) => void;
+    addColumnLeft: (data: Matrix.Matrix<CellBase>) => void;
+    deleteRow: (data: Matrix.Matrix<CellBase>) => void;
+    deleteColumn: (data: Matrix.Matrix<CellBase>) => void;
+};
+declare const ExcelContextMenu: React.FC<ExcelContextMenuProps>;
+export default ExcelContextMenu;

package/lib/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.d.ts

@@ -10,19 +10,6 @@ export type Props<CellType extends Types.CellBase> = {
     data: Matrix.Matrix<CellType>;
     /** Class name to be added to the spreadsheet's root element */
     className?: string;
-    /**
-     * Use dark colors that complement dark mode
-     * @defaultValue `false`
-     */
-    /**
-     * Function used to create the formula parser (instance of
-     * "fast-formula-parser") used by the Spreadsheet by getting the spreadsheet's
-     * data.
-     * @defaultValue function which creates a formula parser bound to the
-     * Spreadsheet's data.
-     * @see `createFormulaParser`
-     * @see https://www.npmjs.com/package/fast-formula-parser
-     */
     createFormulaParser?: Types.CreateFormulaParser;
     /**
      * Labels to use in column indicators.

package/lib/components/Excel/ExcelFile/ExcelFileComponents/actions.d.ts

@@ -34,6 +34,10 @@ export declare const BORDER_TYPE = "BORDER_TYPE";
 export declare const COLOR = "COLOR";
 export declare const BACKGROUND_COLOR = "BACKGROUND_COLOR";
 export declare const FORMATE_PAINTER = "FORMATE_PAINTER";
+export declare const ADD_ROW_TOP = "ADD_ROW_TOP";
+export declare const ADD_COLUMN_LEFT = "ADD_COLUMN_LEFT";
+export declare const DELETE_ROW = "DELETE_ROW";
+export declare const DELETE_COLUMN = "DELETE_COLUMN";
 export type BaseAction<T extends string> = {
     type: T;
 };
@@ -106,6 +110,30 @@ export type FormatePainterStyle = BaseAction<typeof FORMATE_PAINTER> & {
     };
 };
 export declare function formatePainter(data: Matrix<CellBase>): FormatePainterStyle;
+export type AddRowTop = BaseAction<typeof ADD_ROW_TOP> & {
+    payload: {
+        data: Matrix<CellBase>;
+    };
+};
+export declare function addRowTop(data: Matrix<CellBase>): AddRowTop;
+export type AddColumnLeft = BaseAction<typeof ADD_COLUMN_LEFT> & {
+    payload: {
+        data: Matrix<CellBase>;
+    };
+};
+export declare function addColumnLeft(data: Matrix<CellBase>): AddColumnLeft;
+export type DeleteRow = BaseAction<typeof DELETE_ROW> & {
+    payload: {
+        data: Matrix<CellBase>;
+    };
+};
+export declare function deleteRow(data: Matrix<CellBase>): DeleteRow;
+export type DeleteColumn = BaseAction<typeof DELETE_COLUMN> & {
+    payload: {
+        data: Matrix<CellBase>;
+    };
+};
+export declare function deleteColumn(data: Matrix<CellBase>): DeleteColumn;
 export type SetDataAction = BaseAction<typeof SET_DATA> & {
     payload: {
         data: Matrix<CellBase>;
@@ -200,4 +228,4 @@ export type ClearAction = BaseAction<typeof CLEAR>;
 export declare function clear(): ClearAction;
 export type BlurAction = BaseAction<typeof BLUR>;
 export declare function blur(): BlurAction;
-export type Action = SetDataAction | SetCreateFormulaParserAction | SelectEntireRowAction | SelectEntireColumnAction | SelectEntireWorksheetAction | SetSelectionAction | SelectAction | ActivateAction | SetCellDataAction | SetCellDimensionsAction | PasteAction | KeyDownAction | DragStartAction | DragEndAction | CommitAction | CopyAction | CutAction | EditAction | ViewAction | ClearAction | UnderlineTypeStyle | FontSize | FontFamily | TextAlignType | BorderType | ItalicStyle | BoldStyle | ColorStyle | BackgroundStyle | FormatePainterStyle | BlurAction;
+export type Action = SetDataAction | SetCreateFormulaParserAction | SelectEntireRowAction | SelectEntireColumnAction | SelectEntireWorksheetAction | SetSelectionAction | SelectAction | ActivateAction | SetCellDataAction | SetCellDimensionsAction | PasteAction | KeyDownAction | DragStartAction | DragEndAction | CommitAction | CopyAction | CutAction | EditAction | ViewAction | ClearAction | UnderlineTypeStyle | FontSize | FontFamily | TextAlignType | BorderType | ItalicStyle | BoldStyle | ColorStyle | BackgroundStyle | FormatePainterStyle | AddRowTop | AddColumnLeft | DeleteRow | DeleteColumn | BlurAction;

package/lib/components/Excel/ExcelFile/ExcelFileComponents/engine/engine.d.ts

@@ -1,4 +1,3 @@
-import FormulaParser, { Value } from 'fast-formula-parser';
 import * as Matrix from '../matrix';
 import { Point } from '../point';
 import { CellBase, CreateFormulaParser } from '../types';
@@ -11,12 +10,7 @@ export declare class Model<Cell extends CellBase> {
     constructor(createFormulaParser: CreateFormulaParser, data: Matrix.Matrix<Cell>, referenceGraph?: PointGraph, evaluatedData?: Matrix.Matrix<Cell>);
 }
 export declare function updateCellValue<Cell extends CellBase>(model: Model<Cell>, point: Point, cell: Cell): Model<Cell>;
-/**
- *
- * @param data - the spreadsheet data
- * @returns the spreadsheet reference graph
- */
-export declare function createReferenceGraph(data: Matrix.Matrix<CellBase>): PointGraph;
-export declare function createEvaluatedData<Cell extends CellBase>(data: Matrix.Matrix<Cell>, referenceGraph: PointGraph, createFormulaParser: CreateFormulaParser): Matrix.Matrix<Cell>;
+export declare function createReferenceGraph(): PointGraph;
+export declare function createEvaluatedData<Cell extends CellBase>(data: Matrix.Matrix<Cell>, referenceGraph: PointGraph): Matrix.Matrix<Cell>;
 /** Get the computed value of a formula cell */
-export declare function getFormulaComputedValue(value: string, point: Point, formulaParser: FormulaParser): Value;
+export declare function getFormulaComputedValue(): string;

package/lib/components/Excel/ExcelFile/ExcelFileComponents/engine/formula.d.ts

@@ -1,17 +1,9 @@
-import FormulaParser, { FormulaParserConfig, Value } from 'fast-formula-parser';
-import { Point } from '../point';
 import * as Matrix from '../matrix';
 import { CellBase } from '../types';
-import { PointSet } from './point-set';
 export declare const FORMULA_VALUE_PREFIX = "=";
 /** Returns whether given value is a formula */
 export declare function isFormulaValue(value: unknown): value is string;
 /** Extracts formula from value  */
 export declare function extractFormula(value: string): string;
-export declare function createFormulaParser(data: Matrix.Matrix<CellBase>, config?: Omit<FormulaParserConfig, 'onCell' | 'onRange'>): FormulaParser;
-/**
- * For given formula returns the cell references
- * @param formula - formula to get references for
- */
-export declare function getReferences(formula: string, point: Point, data: Matrix.Matrix<CellBase>): PointSet;
-export declare function evaluate(formula: string, point: Point, formulaParser: FormulaParser): Value;
+export declare function createFormulaParser(data: Matrix.Matrix<CellBase>): Matrix.Matrix<CellBase>;
+export declare function evaluate(): string;

package/lib/components/Excel/ExcelFile/ExcelFileComponents/engine/point-graph.d.ts

@@ -13,7 +13,6 @@ export declare class PointGraph {
     get(node: Point): PointSet;
     getBackwards(node: Point): PointSet;
     getBackwardsRecursive(node: Point, visited?: PointSet): PointSet;
-    /** Determine whether the graph has a circular dependency, starting from given start point */
     hasCircularDependency(startPoint: Point): boolean;
     [Symbol.iterator](): Iterator<[Point, PointSet]>;
     /** Get the points in the graph in a breadth-first order */

package/lib/components/Excel/ExcelFile/ExcelFileComponents/types.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import FormulaParser from 'fast-formula-parser';
 import { Point } from './point';
 import { Selection } from './selection';
 import { Model } from './engine';
 import { PointRange } from './point-range';
 import { Matrix } from './matrix';
+import * as MatrixValue from './matrix';
 /** The base type of cell data in Spreadsheet */
 export type CellBase<Value = any> = {
     /** Whether the cell should not be editable */
@@ -54,6 +54,8 @@ export type StoreState<Cell extends CellBase = CellBase> = {
     dragging: boolean;
     lastChanged: Point | null;
     lastCommit: null | CellChange<Cell>[];
+    selectedRow: null | number;
+    selectedColumn: null | number;
 };
 export type CellChange<Cell extends CellBase = CellBase> = {
     prevCell: Cell | null;
@@ -89,6 +91,7 @@ export type CellComponentProps<Cell extends CellBase = CellBase> = {
     setCellDimensions: (point: Point, dimensions: Dimensions) => void;
     /** Set data of the cell */
     setCellData: (cell: Cell) => void;
+    setContextMenu: React.Dispatch<React.SetStateAction<ContextMenuState>>;
 };
 /** Type of the Spreadsheet Cell component */
 export type CellComponent<Cell extends CellBase = CellBase> = React.ComponentType<CellComponentProps<Cell>>;
@@ -143,6 +146,24 @@ export type RowIndicatorProps = {
     selected: boolean;
     /** Callback to be called when the row is selected */
     onSelect: (row: number, extend: boolean) => void;
+    setContextMenu: React.Dispatch<React.SetStateAction<ContextMenuState>>;
+    deleteRow: (data: MatrixValue.Matrix<CellBase>) => void;
+    addRowTop: (data: MatrixValue.Matrix<CellBase>) => void;
+    data: MatrixValue.Matrix<CellBase>;
+};
+export type ContextMenuState = {
+    open: boolean;
+    position: {
+        x: number;
+        y: number;
+    };
+    options: optionsType[];
+};
+type optionsType = {
+    label: string;
+    value: string;
+    iconName: string;
+    action: () => void;
 };
 /** Type of the RowIndicator component */
 export type RowIndicatorComponent = React.ComponentType<RowIndicatorProps>;
@@ -158,6 +179,10 @@ export type ColumnIndicatorProps = {
     fixed?: boolean;
     /** Callback to be called when the column is selected */
     onSelect: (column: number, extend: boolean) => void;
+    setContextMenu: React.Dispatch<React.SetStateAction<ContextMenuState>>;
+    deleteColumn: (data: MatrixValue.Matrix<CellBase>) => void;
+    addColumnLeft: (data: MatrixValue.Matrix<CellBase>) => void;
+    data: MatrixValue.Matrix<CellBase>;
 };
 /** Type of the ColumnIndicator component */
 export type ColumnIndicatorComponent = React.ComponentType<ColumnIndicatorProps>;
@@ -174,5 +199,5 @@ export type CommitChanges<Cell extends CellBase = CellBase> = Array<{
     prevCell: Cell | null;
     nextCell: Cell | null;
 }>;
-export type CreateFormulaParser = (data: Matrix<CellBase>) => FormulaParser;
+export type CreateFormulaParser = (data: Matrix<CellBase>) => void;
 export {};

package/lib/components/Form/Forms.d.ts

@@ -5,5 +5,7 @@ interface FormProps<T extends Form.FieldValues> extends Form.UseFormProps<T> {
     onSubmit: Form.SubmitHandler<T>;
     children: (methods: ReturnType<typeof Form.useForm<T>>) => React.ReactNode;
 }
-declare const Forms: <T extends Form.FieldValues>({ onSubmit, children, id, ...rest }: FormProps<T>) => import("react/jsx-runtime").JSX.Element;
-export default Forms;
+declare const ForwardedForms: <T extends Form.FieldValues>(props: FormProps<T> & {
+    ref?: React.Ref<any>;
+}) => JSX.Element;
+export default ForwardedForms;

package/lib/components/InputWithDropdown/InputWithDropdown.d.ts

@@ -1,4 +1,4 @@
 import './InputWithDropdown.scss';
 import { InputWithDropdownProps } from './types';
-declare const InputWithDropdown: ({ name, label, value, disabled, required, placeholder, error, helperText, optionsList, selectedOption, onDropdownChangeHandler, onInputChangeHandler, onInputBlurHandler, optionsRequired, dropdownPosition, type, }: InputWithDropdownProps) => import("react/jsx-runtime").JSX.Element;
+declare const InputWithDropdown: ({ name, label, value, disabled, required, placeholder, error, helperText, optionsList, selectedOption, autoComplete, onDropdownChangeHandler, onInputChangeHandler, onInputBlurHandler, optionsRequired, dropdownPosition, type, }: InputWithDropdownProps) => import("react/jsx-runtime").JSX.Element;
 export default InputWithDropdown;

package/lib/components/MenuOption/MenuOption.d.ts

@@ -1,4 +1,4 @@
 import './MenuOption.scss';
 import { MenuOptionProps } from './types';
-declare const MenuOption: ({ labelName, iconName, tooltipTitle, tooltipPlacement, options, dropdownPlacement, onClick, onOptionClick, iconButtonSize, iconButtonBorderRadius, iconSize, variant, zIndex, }: MenuOptionProps) => import("react/jsx-runtime").JSX.Element;
+declare const MenuOption: ({ labelName, iconName, tooltipTitle, tooltipPlacement, options, onClick, onOptionClick, iconButtonSize, iconButtonBorderRadius, iconSize, variant, zIndex, dropdownPlacement, }: MenuOptionProps) => import("react/jsx-runtime").JSX.Element;
 export default MenuOption;

package/lib/components/MenuOption/types.d.ts

@@ -10,15 +10,17 @@ interface OptionClick {
      * @type {Array<string> | string}
      * @required
      */
-    value: Array<string> | string;
+    value: any;
 }
 interface OptionType extends OptionClick {
     /**
      * The name of the icon associated with the option.
      * @type {string}
-     * @required
+     * @optional
      */
     icon?: string;
+    iconColor?: string;
+    name?: string;
     /**
      * Indicates whether the option is disabled.
      * @type {boolean}
@@ -35,17 +37,47 @@ interface OptionCardProps {
     options: Array<OptionType>;
     /**
      * Callback function triggered when an option is clicked.
-     * @param {any} data - The data associated with the clicked option.
+     * @param {OptionClick} data - The data associated with the clicked option.
      * @type {function}
      * @required
      */
-    onClick: (data?: any) => void;
+    onClick: (data: OptionClick) => void;
     /**
      * Optional styles applied to the card.
      * @type {React.CSSProperties}
      * @optional
      */
     styles?: React.CSSProperties;
+    /**
+     * The z-index of the option card.
+     * @type {number}
+     * @optional
+     */
+    zIndex?: number;
+    /**
+     * The position of the menu relative to the triggering element.
+     * @type {dropdownPosition}
+     * @required
+     */
+    menuPosition: any;
+    /**
+     * Reference to the menu DOM element.
+     * @type {React.RefObject<HTMLElement>}
+     * @required
+     */
+    menuRef: React.RefObject<HTMLElement>;
+    /**
+     * Callback function to close the dropdown.
+     * @type {() => void}
+     * @required
+     */
+    closeDropdown: () => void;
+    /**
+     * Placement of the dropdown menu relative to the icon.
+     * @type {dropdownPosition}
+     * @optional
+     */
+    dropdownPosition?: 'top' | 'down' | 'left' | 'right';
 }
 interface MenuOptionProps {
     /**
@@ -80,27 +112,27 @@ interface MenuOptionProps {
     tooltipPlacement?: 'bottom' | 'left' | 'right' | 'top' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end';
     /**
      * The placement of the dropdown menu relative to the icon.
-     * @type {'top' | 'left' | 'right' | 'bottom'}
+     * @type {dropdownPosition}
      * @optional
      */
-    dropdownPlacement?: string | 'top' | 'left' | 'right' | 'down';
+    dropdownPlacement?: 'top' | 'down' | 'left' | 'right';
     /**
-    * The variant of the menu option, either 'dark' or 'light'.
-    * @type {'dark' | 'light'}
-    * @default 'light'
-    * @optional
-    */
+     * The variant of the menu option, either 'dark' or 'light'.
+     * @type {'dark' | 'light'}
+     * @default 'light'
+     * @optional
+     */
     variant?: 'dark' | 'light';
     /**
      * Callback function triggered when the icon is clicked.
-     * @type {function}
+     * @type {() => void}
      * @optional
      */
     onClick?: () => void;
     /**
      * Callback function triggered when an option is clicked.
      * @param {OptionClick} option - The option that was clicked.
-     * @type {function}
+     * @type {(option: OptionClick) => void}
      * @optional
      */
     onOptionClick?: (option: OptionClick) => void;
@@ -117,13 +149,15 @@ interface MenuOptionProps {
      */
     iconSize?: number;
     /**
-     * The border radius of the icon.
+     * The border radius of the icon button.
      * @type {number}
      * @default 7
      */
     iconButtonBorderRadius?: number;
     /**
      * Providing z-index for the options card.
+     * @type {number}
+     * @optional
      */
     zIndex?: number;
 }
@@ -137,7 +171,7 @@ interface OptionProps {
     /**
      * Callback function triggered when the option is clicked.
      * @param {OptionClick} option - The clicked option.
-     * @type {function}
+     * @type {(option: OptionClick) => void}
      * @required
      */
     onClick: (option: OptionClick) => void;

package/lib/components/MiniModal/types.d.ts

@@ -9,7 +9,7 @@ export interface MiniEditModalProps {
     /**
      * A reference to the button element that triggers the modal.
      */
-    anchorRef: RefObject<HTMLButtonElement>;
+    anchorRef: RefObject<HTMLButtonElement> | string;
     /**
      * Optional properties for configuring the modal header.
      */

package/lib/components/MultiSelect/MultiSelect.d.ts

@@ -1,4 +1,4 @@
 import './MultiSelect.scss';
 import { MultiSelectProps } from './MultiSelectTypes';
-declare const MultiSelect: ({ options, type, selectedOptions, onChange, acceptNewOption, zIndex, label, onSearch, required, disabled, errorMessage, displayCount, placeholderForSearching, variant, onLabelPlusIconClick, onManageLabelsClick, className, highlightedMachine, onSelectButtonClick, withSelectButton, }: MultiSelectProps) => import("react/jsx-runtime").JSX.Element;
+declare const MultiSelect: ({ options, type, selectedOptions, onChange, acceptNewOption, zIndex, label, onSearch, required, disabled, errorMessage, displayCount, placeholderForSearching, variant, onLabelPlusIconClick, onManageLabelsClick, className, highlightedMachine, onSelectButtonClick, labelAccessor, valueAccessor, withSelectButton, }: MultiSelectProps) => import("react/jsx-runtime").JSX.Element;
 export default MultiSelect;

package/lib/components/MultiSelect/MultiSelectTypes.d.ts

@@ -1,10 +1,7 @@
 import { ReactElement } from 'react';
+type OptionValue = any;
 interface Option {
-    label?: string;
-    value?: string;
-    accessor?: string;
-    isChecked?: boolean;
-    isDisabled?: boolean;
+    [key: string]: OptionValue;
 }
 interface MultiSelectProps {
     options: Option[];
@@ -32,5 +29,7 @@ interface MultiSelectProps {
     className?: string;
     /** Machine Name to be displayed */
     highlightedMachine?: string | ReactElement;
+    labelAccessor?: string;
+    valueAccessor?: string;
 }
 export { Option, MultiSelectProps };

package/lib/components/MultiSelect/dropdownTypes.d.ts

@@ -14,4 +14,6 @@ export interface DropdownProps {
     zIndex: number;
     withSelectButton?: boolean;
     onSelect?: () => void;
+    labelAccessor?: string;
+    valueAccessor?: string;
 }

package/lib/components/RadioButton/RadioButton.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
 import './RadioButton.scss';
+import RadioButtonProps from './radioButtonTypes';
 declare const RadioButton: React.FC<RadioButtonProps>;
 export default RadioButton;

package/lib/components/RadioButton/radioButtonTypes.d.ts

@@ -1,3 +1,4 @@
+import { ReactElement } from 'react';
 /**
  * Props for the RadioButton component.
  */
@@ -6,7 +7,7 @@ interface RadioButtonProps {
      * The display label for the radio button.
      * Optional.
      */
-    label?: string;
+    label?: string | ReactElement;
     /**
      * The name attribute for the radio button, used for grouping.
      */
@@ -48,3 +49,4 @@ interface RadioButtonProps {
      */
     tooltipTitle?: React.ReactNode;
 }
+export default RadioButtonProps;

package/lib/components/Select/components/types.d.ts

@@ -1,4 +1,5 @@
 import { DrowdownPosition, Option } from '../types';
+import { RefObject } from 'react';
 export interface DropdownProps {
     options: Option[];
     dropdownPosition: DrowdownPosition;
@@ -7,9 +8,10 @@ export interface DropdownProps {
     valueAccessor?: string;
     onSelectBlur: () => void;
     onSelectOptionSelector: (option: Option) => void;
-    inputRef?: React.RefObject<HTMLInputElement>;
-    selectArrowRef?: React.RefObject<HTMLDivElement>;
+    inputRef?: RefObject<HTMLInputElement>;
+    selectArrowRef?: RefObject<HTMLDivElement>;
     heightFromTop: number;
+    selectedOption?: Option;
 }
 export declare const dropdownDefaultCSSData: {
     margin: number;

package/lib/components/Table/Table.d.ts

@@ -1,4 +1,4 @@
 import './Table.scss';
 import { TableProps } from './Types';
-declare const Table: ({ data, columns, headerType, withCheckbox, onSelect, allSelected, partialSelected, withFixedHeader, borderWithRadius, headerCheckboxDisabled, noDataContent, height, className, tableHeadClass, tableBodyRowClass, headerTextColor, tableDataTextColor, headerIconName, headerIconOnClick, }: TableProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const Table: ({ data, columns, headerType, withCheckbox, onSelect, allSelected, partialSelected, withFixedHeader, borderWithRadius, headerCheckboxDisabled, noDataContent, height, className, tableHeadClass, tableBodyRowClass, headerTextColor, tableDataTextColor, headerIconName, headerIconOnClick, }: TableProps) => import("react/jsx-runtime").JSX.Element;
 export default Table;

package/lib/components/ToggleSwitch/ToggleSwitch.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import "./ToggleSwitch.scss";
+interface ToggleSwitchProps {
+    firstButton: string;
+    secondButton: string;
+    handleClick: (selected: string) => void;
+    selected: string;
+}
+declare const ToggleSwitch: React.FC<ToggleSwitchProps>;
+export default ToggleSwitch;

package/lib/components/ToggleSwitch/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ToggleSwitch';