pixel-react 1.2.1 → 1.2.3

package/src/components/ExcelFile/ExcelFile/Excel/actions.ts

@@ -1,40 +1,125 @@
-import { Matrix } from "./matrix";
-import { Point } from "./point";
+import { Matrix } from './matrix';
+import { Point } from './point';
 import {
   CellBase,
   Dimensions,
   CommitChanges,
   CreateFormulaParser,
-} from "./types";
-import { Selection } from "./selection";
-
-export const SET_DATA = "SET_DATA";
-export const SET_CREATE_FORMULA_PARSER = "SET_CREATE_FORMULA_PARSER";
-export const SELECT_ENTIRE_ROW = "SELECT_ENTIRE_ROW";
-export const SELECT_ENTIRE_COLUMN = "SELECT_ENTIRE_COLUMN";
-export const SELECT_ENTIRE_WORKSHEET = "SELECT_ENTIRE_WORKSHEET";
-export const SET_SELECTION = "SET_SELECTION";
-export const SELECT = "SELECT";
-export const ACTIVATE = "ACTIVATE";
-export const SET_CELL_DATA = "SET_CELL_DATA";
-export const SET_CELL_DIMENSIONS = "SET_CELL_DIMENSIONS";
-export const COPY = "COPY";
-export const CUT = "CUT";
-export const PASTE = "PASTE";
-export const EDIT = "EDIT";
-export const VIEW = "VIEW";
-export const CLEAR = "CLEAR";
-export const BLUR = "BLUR";
-export const KEY_PRESS = "KEY_PRESS";
-export const KEY_DOWN = "KEY_DOWN";
-export const DRAG_START = "DRAG_START";
-export const DRAG_END = "DRAG_END";
-export const COMMIT = "COMMIT";
+} from './types';
+import { Selection } from './selection';
+
+export const SET_DATA = 'SET_DATA';
+export const SET_CREATE_FORMULA_PARSER = 'SET_CREATE_FORMULA_PARSER';
+export const SELECT_ENTIRE_ROW = 'SELECT_ENTIRE_ROW';
+export const SELECT_ENTIRE_COLUMN = 'SELECT_ENTIRE_COLUMN';
+export const SELECT_ENTIRE_WORKSHEET = 'SELECT_ENTIRE_WORKSHEET';
+export const SET_SELECTION = 'SET_SELECTION';
+export const SELECT = 'SELECT';
+export const ACTIVATE = 'ACTIVATE';
+export const SET_CELL_DATA = 'SET_CELL_DATA';
+export const SET_CELL_DIMENSIONS = 'SET_CELL_DIMENSIONS';
+export const COPY = 'COPY';
+export const CUT = 'CUT';
+export const PASTE = 'PASTE';
+export const EDIT = 'EDIT';
+export const VIEW = 'VIEW';
+export const CLEAR = 'CLEAR';
+export const BLUR = 'BLUR';
+export const KEY_PRESS = 'KEY_PRESS';
+export const KEY_DOWN = 'KEY_DOWN';
+export const DRAG_START = 'DRAG_START';
+export const DRAG_END = 'DRAG_END';
+export const COMMIT = 'COMMIT';
+export const BOLD = 'BOLD';
+export const ITALIC = 'ITALIC';
+export const UNDERLINE = 'UNDERLINE';
+export const COLOR = 'COLOR';
+export const BACKGROUND_COLOR = 'BACKGROUND_COLOR';
+export const FORMATE_PAINTER = 'FORMATE_PAINTER';
 
 export type BaseAction<T extends string> = {
   type: T;
 };
 
+export type BoldStyle = BaseAction<typeof BOLD> & {
+  payload: {
+    data: Matrix<CellBase>;
+  };
+};
+
+export function bold(data: Matrix<CellBase>): BoldStyle {
+  return {
+    type: BOLD,
+    payload: { data },
+  };
+}
+export type ItalicStyle = BaseAction<typeof ITALIC> & {
+  payload: {
+    data: Matrix<CellBase>;
+  };
+};
+
+export function italic(data: Matrix<CellBase>): ItalicStyle {
+  return {
+    type: ITALIC,
+    payload: { data },
+  };
+}
+export type UnderlineStyle = BaseAction<typeof UNDERLINE> & {
+  payload: {
+    data: Matrix<CellBase>;
+  };
+};
+
+export function underline(data: Matrix<CellBase>): UnderlineStyle {
+  return {
+    type: UNDERLINE,
+    payload: { data },
+  };
+}
+export type ColorStyle = BaseAction<typeof COLOR> & {
+  payload: {
+    data: Matrix<CellBase>;
+    value: string;
+  };
+};
+
+export function color(data: Matrix<CellBase>, value: string): ColorStyle {
+  return {
+    type: COLOR,
+    payload: { data, value },
+  };
+}
+export type BackgroundStyle = BaseAction<typeof BACKGROUND_COLOR> & {
+  payload: {
+    data: Matrix<CellBase>;
+    value: string;
+  };
+};
+
+export function backgroundStyle(
+  data: Matrix<CellBase>,
+  value: string
+): BackgroundStyle {
+  return {
+    type: BACKGROUND_COLOR,
+    payload: { data, value },
+  };
+}
+
+export type FormatePainterStyle = BaseAction<typeof FORMATE_PAINTER> & {
+  payload: {
+    data: Matrix<CellBase>;
+  };
+};
+
+export function formatePainter(data: Matrix<CellBase>): FormatePainterStyle {
+  return {
+    type: FORMATE_PAINTER,
+    payload: { data },
+  };
+}
+
 export type SetDataAction = BaseAction<typeof SET_DATA> & {
   payload: {
     data: Matrix<CellBase>;
@@ -109,13 +194,13 @@ export function selectEntireWorksheet(): SelectEntireWorksheetAction {
   return { type: SELECT_ENTIRE_WORKSHEET };
 }
 
-export type SetSelectionAction = BaseAction<typeof SET_SELECTION> & {  
+export type SetSelectionAction = BaseAction<typeof SET_SELECTION> & {
   payload: {
     selection: Selection;
   };
 };
 
-export function setSelection(selection: Selection): SetSelectionAction {  
+export function setSelection(selection: Selection): SetSelectionAction {
   return { type: SET_SELECTION, payload: { selection } };
 }
 
@@ -133,7 +218,6 @@ export function select(point: Point): SelectAction {
 }
 
 export type ActivateAction = BaseAction<typeof ACTIVATE> & {
-  
   payload: {
     point: Point;
   };
@@ -177,7 +261,7 @@ export function setCellDimensions(
   };
 }
 
-export type PasteAction = BaseAction<typeof PASTE> & {  
+export type PasteAction = BaseAction<typeof PASTE> & {
   payload: {
     data: string;
   };
@@ -299,4 +383,10 @@ export type Action =
   | EditAction
   | ViewAction
   | ClearAction
+  | UnderlineStyle
+  | ItalicStyle
+  | BoldStyle
+  | ColorStyle
+  | BackgroundStyle
+  | FormatePainterStyle
   | BlurAction;

package/src/components/ExcelFile/ExcelFile/Excel/areModelsEqual.ts

@@ -1,4 +1,4 @@
-import { Model } from "./engine";
+import { Model } from './engine';
 
 function areModelsEqual(a: unknown, b: unknown): boolean | undefined {
   const isAModule = a instanceof Model;

package/src/components/ExcelFile/ExcelFile/Excel/context.ts

@@ -1,7 +1,7 @@
-import * as React from "react";
-import { createContext } from "use-context-selector";
-import reducer, { INITIAL_STATE } from "./reducer";
-import { Action } from "./actions";
+import * as React from 'react';
+import { createContext } from 'use-context-selector';
+import reducer, { INITIAL_STATE } from './reducer';
+import { Action } from './actions';
 
 export type ReducerState = React.ReducerState<typeof reducer>;
 export type Dispatch = React.Dispatch<Action>;

package/src/components/ExcelFile/ExcelFile/Excel/engine/engine.ts

@@ -1,10 +1,10 @@
-import FormulaParser, { FormulaError, Value } from "fast-formula-parser";
-import * as Matrix from "../matrix";
-import { Point } from "../point";
-import { CellBase, CreateFormulaParser } from "../types";
-import * as Formula from "./formula";
-import { PointGraph } from "./point-graph";
-import { PointSet } from "./point-set";
+import FormulaParser, { FormulaError, Value } from 'fast-formula-parser';
+import * as Matrix from '../matrix';
+import { Point } from '../point';
+import { CellBase, CreateFormulaParser } from '../types';
+import * as Formula from './formula';
+import { PointGraph } from './point-graph';
+import { PointSet } from './point-set';
 
 export class Model<Cell extends CellBase> {
   readonly data!: Matrix.Matrix<Cell>;

package/src/components/ExcelFile/ExcelFile/Excel/engine/formula.ts

@@ -4,19 +4,19 @@ import FormulaParser, {
   FormulaError,
   FormulaParserConfig,
   Value,
-} from "fast-formula-parser";
-import { PointRange } from "../point-range";
-import { Point } from "../point";
-import * as Matrix from "../matrix";
-import { CellBase } from "../types";
-import { PointSet } from "./point-set";
+} from 'fast-formula-parser';
+import { PointRange } from '../point-range';
+import { Point } from '../point';
+import * as Matrix from '../matrix';
+import { CellBase } from '../types';
+import { PointSet } from './point-set';
 
-export const FORMULA_VALUE_PREFIX = "=";
+export const FORMULA_VALUE_PREFIX = '=';
 
 /** Returns whether given value is a formula */
 export function isFormulaValue(value: unknown): value is string {
   return (
-    typeof value === "string" &&
+    typeof value === 'string' &&
     value.startsWith(FORMULA_VALUE_PREFIX) &&
     value.length > 1
   );
@@ -29,7 +29,7 @@ export function extractFormula(value: string): string {
 
 export function createFormulaParser(
   data: Matrix.Matrix<CellBase>,
-  config?: Omit<FormulaParserConfig, "onCell" | "onRange">
+  config?: Omit<FormulaParserConfig, 'onCell' | 'onRange'>
 ): FormulaParser {
   return new FormulaParser({
     ...config,
@@ -78,7 +78,7 @@ export function getReferences(
 
     const references = PointSet.from(
       dependencies.flatMap((reference) => {
-        const isRange = "from" in reference;
+        const isRange = 'from' in reference;
         if (isRange) {
           const { from, to } = reference;
 
@@ -132,6 +132,6 @@ function convertPointToCellRef(point: Point): CellRef {
     row: point.row + 1,
     col: point.column + 1,
     // TODO: fill once we support multiple sheets
-    sheet: "Sheet1",
+    sheet: 'Sheet1',
   };
 }

package/src/components/ExcelFile/ExcelFile/Excel/engine/index.ts

@@ -1,2 +1,2 @@
-export { Model, updateCellValue } from "./engine";
-export { createFormulaParser } from "./formula";
+export { Model, updateCellValue } from './engine';
+export { createFormulaParser } from './formula';

package/src/components/ExcelFile/ExcelFile/Excel/engine/point-graph.ts

@@ -1,6 +1,6 @@
-import { Point } from "../point";
-import * as pointHash from "./point-hash";
-import { PointSet } from "./point-set";
+import { Point } from '../point';
+import * as pointHash from './point-hash';
+import { PointSet } from './point-set';
 
 /**
  * Immutable directed graph of points, where each point can have multiple

package/src/components/ExcelFile/ExcelFile/Excel/engine/point-hash.ts

@@ -1,10 +1,10 @@
-import { Point } from "../point";
+import { Point } from '../point';
 
 export function toString(point: Point): string {
   return `${point.row},${point.column}`;
 }
 
 export function fromString(point: string): Point {
-  const [row, column] = point.split(",");
+  const [row, column] = point.split(',');
   return { row: Number(row), column: Number(column) };
 }

package/src/components/ExcelFile/ExcelFile/Excel/engine/point-set.ts

@@ -1,5 +1,5 @@
-import * as Point from "../point";
-import * as pointHash from "./point-hash";
+import * as Point from '../point';
+import * as pointHash from './point-hash';
 
 /**
  * Immutable Set like interface of points

package/src/components/ExcelFile/ExcelFile/Excel/index.ts

@@ -1,12 +1,12 @@
-import Spreadsheet from "./Spreadsheet";
-import DataEditor from "./DataEditor";
-import DataViewer from "./DataViewer";
+import Spreadsheet from './Spreadsheet';
+import DataEditor from './DataEditor';
+import DataViewer from './DataViewer';
 
 export default Spreadsheet;
 export { Spreadsheet, DataEditor, DataViewer };
-export type { Props } from "./Spreadsheet";
-export { createEmpty as createEmptyMatrix } from "./matrix";
-export type { Matrix } from "./matrix";
+export type { Props } from './Spreadsheet';
+export { createEmpty as createEmptyMatrix } from './matrix';
+export type { Matrix } from './matrix';
 export {
   Selection,
   EmptySelection,
@@ -17,9 +17,9 @@ export {
   EntireWorksheetSelection,
   InvalidIndexError,
   RangeSelection,
-} from "./selection";
-export { PointRange } from "./point-range";
-export type { Point } from "./point";
+} from './selection';
+export { PointRange } from './point-range';
+export type { Point } from './point';
 export type {
   CellBase,
   CellDescriptor,
@@ -44,5 +44,6 @@ export type {
   TableProps,
   HeaderRowProps,
   HeaderRowComponent,
-} from "./types";
-export { createFormulaParser, Model } from "./engine";
+} from './types';
+
+export { createFormulaParser, Model } from './engine';

package/src/components/ExcelFile/ExcelFile/Excel/matrix.ts

@@ -1,4 +1,4 @@
-import * as Point from "./point";
+import * as Point from './point';
 
 /** A two-dimensional array of given type T in rows and columns */
 export type Matrix<T> = Array<Array<T | undefined>>;
@@ -65,7 +65,7 @@ export function set<T>(
   if (nextFirstRow.length <= point.column) {
     nextFirstRow.length = point.column + 1; // Extend the first row if needed
   }
-  
+
   // Set the modified first row back into the matrix
   nextMatrix[0] = nextFirstRow;
 
@@ -82,10 +82,8 @@ export function set<T>(
   return nextMatrix;
 }
 
-
 /** Like Matrix.set() but mutates the matrix */
 
-
 export function mutableSet<T>(
   point: Point.Point,
   value: T,
@@ -114,8 +112,6 @@ export function mutableSet<T>(
   row[point.column] = value;
 }
 
-
-
 /** Removes the coordinate of matrix */
 // export function unset<T>(point: Point.Point, matrix: Matrix<T>): Matrix<T> {
 //   if (!has(point, matrix)) {
@@ -155,7 +151,6 @@ export function unset<T>(point: Point.Point, matrix: Matrix<T>): Matrix<T> {
   return nextMatrix;
 }
 
-
 /** Creates an array of values by running each element in collection thru iteratee. */
 export function map<T, T2>(
   func: (value: T | undefined, point: Point.Point) => T2,
@@ -187,34 +182,33 @@ export function* entries<T>(
 
 export function join(
   matrix: Matrix<unknown>,
-  horizontalSeparator = "\t",
-  verticalSeparator = "\n"
+  horizontalSeparator = '\t',
+  verticalSeparator = '\n'
 ): string {
-  let joined = "";
+  let joined = '';
   const { rows, columns } = getSize(matrix);
-  
+
   for (let row = 0; row < rows; row++) {
     if (row) {
       joined += verticalSeparator;
     }
-    
+
     for (let column = 0; column < columns; column++) {
       if (column) {
         joined += horizontalSeparator;
       }
-      
+
       // Ensure matrix[row] exists and matrix[row][column] is not undefined
       const cellValue = matrix[row]?.[column];
-      
+
       // If cellValue is undefined, you can use a fallback value like an empty string
-      joined += cellValue !== undefined ? String(cellValue) : "";
+      joined += cellValue !== undefined ? String(cellValue) : '';
     }
   }
-  
+
   return joined;
 }
 
-
 /**
  * Parses a CSV separated by a horizontalSeparator and verticalSeparator into a
  * Matrix using a transform function
@@ -222,19 +216,19 @@ export function join(
 export function split<T>(
   csv: string,
   transform: (value: string) => T,
-  horizontalSeparator = "\t",
+  horizontalSeparator = '\t',
   verticalSeparator: string | RegExp = /\r\n|\n|\r/
 ): Matrix<T> {
   // Temporarily replace line breaks inside quotes
   const replaced = csv.replace(/"([^"]*?)"/g, (_, p1) => {
-    return p1.replace(/\n/g, "\\n");
+    return p1.replace(/\n/g, '\\n');
   });
   return replaced.split(verticalSeparator).map((row) =>
     row
       .split(horizontalSeparator)
       .map((line) => {
         // Restore original line breaks in each line
-        return line.replace(/\\n/g, "\n");
+        return line.replace(/\\n/g, '\n');
       })
       .map(transform)
   );
@@ -246,7 +240,7 @@ export function has(point: Point.Point, matrix: Matrix<unknown>): boolean {
   if (!firstRow) {
     return false; // If first row is undefined, return false
   }
-  
+
   // Perform validation checks
   return (
     point.row >= 0 &&
@@ -258,7 +252,6 @@ export function has(point: Point.Point, matrix: Matrix<unknown>): boolean {
   );
 }
 
-
 /** Counts of the rows and column in a matrix */
 export type Size = {
   /** Count of the rows in the matrix */
@@ -372,7 +365,9 @@ export function toArray<T1, T2>(
       for (let column = 0; column < currentRow.length; column++) {
         const value = currentRow[column];
         // If transform is provided, apply it; otherwise, use the value as is
-        array.push(transform ? transform(value, { row, column }) : value as T2);
+        array.push(
+          transform ? transform(value, { row, column }) : (value as T2)
+        );
       }
     }
   }
@@ -380,7 +375,6 @@ export function toArray<T1, T2>(
   return array;
 }
 
-
 /** Returns the maximum point in the matrix */
 export function maxPoint(matrix: Matrix<unknown>): Point.Point {
   const size = getSize(matrix);

package/src/components/ExcelFile/ExcelFile/Excel/point-range.ts

@@ -2,7 +2,7 @@
  * Interface for ranges between two points
  */
 
-import * as Point from "./point";
+import * as Point from './point';
 
 /** Range between two points. Creates a normalized range between two given points */
 export class PointRange {