chore(): Rename files

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## [next]
 
+- chore(): rename files to modern style [#8621](https://github.com/fabricjs/fabric.js/pull/8621)
 - chore(): move and rename text & itext files and organize as folders, rename mixins [#8620](https://github.com/fabricjs/fabric.js/pull/8620)
 - chore(TS): type IText, IText behavior, IText click behavior [#8610](https://github.com/fabricjs/fabric.js/pull/8610)
 - BREAKING: refactor `clone(obj, true)` with `cloneDeep(obj)` and remove all `extend`, `clone` calls in favor of object spreads. [#8600](https://github.com/fabricjs/fabric.js/pull/8600)

index.ts

@@ -1,13 +1,13 @@
 // FILTERS
-import { BaseFilter } from './src/filters/base_filter.class';
-import { BlendColor } from './src/filters/blendcolor_filter.class';
-import { BlendImage } from './src/filters/blendimage_filter.class';
-import { Blur } from './src/filters/blur_filter.class';
-import { Brightness } from './src/filters/brightness_filter.class';
-import { ColorMatrix } from './src/filters/colormatrix_filter.class';
-import { Composed } from './src/filters/composed_filter.class';
-import { Contrast } from './src/filters/contrast_filter.class';
-import { Convolute } from './src/filters/convolute_filter.class';
+import { BaseFilter } from './src/filters/BaseFilter';
+import { BlendColor } from './src/filters/BlendColor';
+import { BlendImage } from './src/filters/BlendImage';
+import { Blur } from './src/filters/Blur';
+import { Brightness } from './src/filters/Brightness';
+import { ColorMatrix } from './src/filters/ColorMatrix';
+import { Composed } from './src/filters/Composed';
+import { Contrast } from './src/filters/Contrast';
+import { Convolute } from './src/filters/Convolute';
 import {
   Sepia,
   Brownie,
@@ -16,17 +16,17 @@ import {
   Technicolor,
   Polaroid,
   BlackWhite,
-} from './src/filters/filter_generator';
-import { Gamma } from './src/filters/gamma_filter.class';
-import { Grayscale } from './src/filters/grayscale_filter.class';
-import { HueRotation } from './src/filters/hue_rotation.class';
-import { Invert } from './src/filters/invert_filter.class';
-import { Noise } from './src/filters/noise_filter.class';
-import { Pixelate } from './src/filters/pixelate_filter.class';
-import { RemoveColor } from './src/filters/removecolor_filter.class';
-import { Resize } from './src/filters/resize_filter.class';
-import { Saturation } from './src/filters/saturate_filter.class';
-import { Vibrance } from './src/filters/vibrance_filter.class';
+} from './src/filters/ColorMatrixFilters';
+import { Gamma } from './src/filters/Gamma';
+import { Grayscale } from './src/filters/Grayscale';
+import { HueRotation } from './src/filters/HueRotation';
+import { Invert } from './src/filters/Invert';
+import { Noise } from './src/filters/Noise';
+import { Pixelate } from './src/filters/Pixelate';
+import { RemoveColor } from './src/filters/RemoveColor';
+import { Resize } from './src/filters/Resize';
+import { Saturation } from './src/filters/Saturation';
+import { Vibrance } from './src/filters/Vibrance';
 
 const filters = {
   BaseFilter,
@@ -320,43 +320,43 @@ const controlsUtils = {
 
 import { cache } from './src/cache';
 import { VERSION as version, iMatrix } from './src/constants';
-import { StaticCanvas } from './src/canvas/static_canvas.class';
-import { Canvas } from './src/canvas/canvas_events';
+import { StaticCanvas } from './src/canvas/StaticCanvas';
+import { Canvas } from './src/canvas/Canvas';
 import { config } from './src/config';
 import { loadSVGFromURL } from './src/parser/loadSVGFromURL';
 import { loadSVGFromString } from './src/parser/loadSVGFromString';
 import { initFilterBackend } from './src/filters/FilterBackend';
-import { Canvas2dFilterBackend } from './src/filters/2d_backend.class';
-import { WebGLFilterBackend } from './src/filters/webgl_backend.class';
+import { Canvas2dFilterBackend } from './src/filters/Canvas2dFilterBackend';
+import { WebGLFilterBackend } from './src/filters/WebGLFilterBackend';
 import { runningAnimations } from './src/util/animation/AnimationRegistry';
 import { Observable } from './src/Observable';
-import { Point } from './src/point.class';
-import { Intersection } from './src/intersection.class';
-import { Color } from './src/color/color.class';
-import { Control } from './src/controls/control.class';
-import { Gradient } from './src/gradient/gradient.class';
-import { Pattern } from './src/pattern.class';
-import { Shadow } from './src/shadow.class';
-import { BaseBrush } from './src/brushes/base_brush.class';
-import { PencilBrush } from './src/brushes/pencil_brush.class';
-import { CircleBrush } from './src/brushes/circle_brush.class';
-import { SprayBrush } from './src/brushes/spray_brush.class';
-import { PatternBrush } from './src/brushes/pattern_brush.class';
+import { Point } from './src/Point';
+import { Intersection } from './src/Intersection';
+import { Color } from './src/color/Color';
+import { Control } from './src/controls/Control';
+import { Gradient } from './src/gradient/Gradient';
+import { Pattern } from './src/Pattern';
+import { Shadow } from './src/Shadow';
+import { BaseBrush } from './src/brushes/BaseBrush';
+import { PencilBrush } from './src/brushes/PencilBrush';
+import { CircleBrush } from './src/brushes/CircleBrush';
+import { SprayBrush } from './src/brushes/SprayBrush';
+import { PatternBrush } from './src/brushes/PatternBrush';
 import { FabricObject as Object } from './src/shapes/Object/FabricObject';
-import { Line } from './src/shapes/line.class';
-import { Circle } from './src/shapes/circle.class';
-import { Triangle } from './src/shapes/triangle.class';
-import { Ellipse } from './src/shapes/ellipse.class';
-import { Rect } from './src/shapes/rect.class';
-import { Path } from './src/shapes/path.class';
-import { Polyline } from './src/shapes/polyline.class';
-import { Polygon } from './src/shapes/polygon.class';
+import { Line } from './src/shapes/Line';
+import { Circle } from './src/shapes/Circle';
+import { Triangle } from './src/shapes/Triangle';
+import { Ellipse } from './src/shapes/Ellipse';
+import { Rect } from './src/shapes/Rect';
+import { Path } from './src/shapes/Path';
+import { Polyline } from './src/shapes/Polyline';
+import { Polygon } from './src/shapes/Polygon';
 import { Text } from './src/shapes/Text/Text';
 import { IText } from './src/shapes/IText/IText';
-import { Textbox } from './src/shapes/textbox.class';
-import { Group } from './src/shapes/group.class';
-import { ActiveSelection } from './src/shapes/active_selection.class';
-import { Image } from './src/shapes/image.class';
+import { Textbox } from './src/shapes/Textbox';
+import { Group } from './src/shapes/Group';
+import { ActiveSelection } from './src/shapes/ActiveSelection';
+import { Image } from './src/shapes/Image';
 import { getEnv, getDocument, getWindow, setEnvForTests } from './src/env';
 import { createCollectionMixin } from './src/Collection';
 import { parseAttributes } from './src/parser/parseAttributes';

src/EventTypeDefs.ts

@@ -1,14 +1,14 @@
-import type { Control } from './controls/control.class';
-import type { Point } from './point.class';
+import type { Control } from './controls/Control';
+import type { Point } from './Point';
 import type { FabricObject } from './shapes/Object/FabricObject';
 import type { FabricObject as StaticFabricObject } from './shapes/Object/Object';
 import type { FabricObjectSVGExportMixin } from './shapes/Object/FabricObjectSVGExportMixin';
-import type { Group } from './shapes/group.class';
+import type { Group } from './shapes/Group';
 import type { TOriginX, TOriginY, TRadian } from './typedefs';
 import type { saveObjectTransform } from './util/misc/objectTransforms';
-import type { Canvas } from './canvas/canvas_events';
+import type { Canvas } from './canvas/Canvas';
 import type { IText } from './shapes/IText/IText';
-import type { StaticCanvas } from './canvas/static_canvas.class';
+import type { StaticCanvas } from './canvas/StaticCanvas';
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface, @typescript-eslint/no-unused-vars
 export interface BaseFabricObject

src/intersection.class.ts → src/Intersection.ts

@@ -1,4 +1,4 @@
-import { Point } from './point.class';
+import { Point } from './Point';
 
 /* Adaptation of work of Kevin Lindsey (kevin@kevlindev.com) */
 

src/shadow.class.ts → src/Shadow.ts

@@ -1,6 +1,6 @@
-import { Color } from './color/color.class';
+import { Color } from './color/Color';
 import { config } from './config';
-import { Point } from './point.class';
+import { Point } from './Point';
 import type { FabricObject } from './shapes/Object/FabricObject';
 import { TClassProperties } from './typedefs';
 import { uid } from './util/internals/uid';

src/brushes/base_brush.class.ts → src/brushes/BaseBrush.ts

@@ -1,8 +1,8 @@
-import { Color } from '../color/color.class';
-import type { Point } from '../point.class';
+import { Color } from '../color/Color';
+import type { Point } from '../Point';
 import { TEvent } from '../EventTypeDefs';
-import type { Shadow } from '../shadow.class';
-import type { Canvas } from '../canvas/canvas_events';
+import type { Shadow } from '../Shadow';
+import type { Canvas } from '../canvas/Canvas';
 
 type TBrushEventData = TEvent & { pointer: Point };
 

src/brushes/circle_brush.class.ts → src/brushes/CircleBrush.ts

@@ -1,11 +1,11 @@
-import { Color } from '../color/color.class';
-import { Point } from '../point.class';
-import { Shadow } from '../shadow.class';
-import { Circle } from '../shapes/circle.class';
-import { Group } from '../shapes/group.class';
+import { Color } from '../color/Color';
+import { Point } from '../Point';
+import { Shadow } from '../Shadow';
+import { Circle } from '../shapes/Circle';
+import { Group } from '../shapes/Group';
 import { getRandomInt } from '../util/internals';
-import type { Canvas } from '../canvas/canvas_events';
-import { BaseBrush } from './base_brush.class';
+import type { Canvas } from '../canvas/Canvas';
+import { BaseBrush } from './BaseBrush';
 
 export type CircleBrushPoint = {
   x: number;

src/brushes/pattern_brush.class.ts → src/brushes/PatternBrush.ts

@@ -1,8 +1,8 @@
-import { Pattern } from '../pattern.class';
+import { Pattern } from '../Pattern';
 import { PathData } from '../typedefs';
 import { createCanvasElement } from '../util/misc/dom';
-import type { Canvas } from '../canvas/canvas_events';
-import { PencilBrush } from './pencil_brush.class';
+import type { Canvas } from '../canvas/Canvas';
+import { PencilBrush } from './PencilBrush';
 
 export class PatternBrush extends PencilBrush {
   declare source?: CanvasImageSource;

src/brushes/pencil_brush.class.ts → src/brushes/PencilBrush.ts

@@ -1,11 +1,11 @@
 import { ModifierKey, TEvent } from '../EventTypeDefs';
-import { Point } from '../point.class';
-import { Shadow } from '../shadow.class';
-import { Path } from '../shapes/path.class';
+import { Point } from '../Point';
+import { Shadow } from '../Shadow';
+import { Path } from '../shapes/Path';
 import { PathData } from '../typedefs';
 import { getSmoothPathFromPoints, joinPath } from '../util/path';
-import type { Canvas } from '../canvas/canvas_events';
-import { BaseBrush } from './base_brush.class';
+import type { Canvas } from '../canvas/Canvas';
+import { BaseBrush } from './BaseBrush';
 
 /**
  * @private

src/brushes/spray_brush.class.ts → src/brushes/SprayBrush.ts

@@ -1,10 +1,10 @@
-import { Point } from '../point.class';
-import { Group } from '../shapes/group.class';
-import { Shadow } from '../shadow.class';
-import { Rect } from '../shapes/rect.class';
+import { Point } from '../Point';
+import { Group } from '../shapes/Group';
+import { Shadow } from '../Shadow';
+import { Rect } from '../shapes/Rect';
 import { getRandomInt } from '../util/internals';
-import type { Canvas } from '../canvas/canvas_events';
-import { BaseBrush } from './base_brush.class';
+import type { Canvas } from '../canvas/Canvas';
+import { BaseBrush } from './BaseBrush';
 
 export type SprayBrushPoint = {
   x: number;

src/canvas/canvas_events.ts → src/canvas/Canvas.ts

@@ -9,9 +9,9 @@ import {
   TPointerEventNames,
   Transform,
 } from '../EventTypeDefs';
-import { Point } from '../point.class';
-import { ActiveSelection } from '../shapes/active_selection.class';
-import { Group } from '../shapes/group.class';
+import { Point } from '../Point';
+import { ActiveSelection } from '../shapes/ActiveSelection';
+import { Group } from '../shapes/Group';
 import type { FabricObject } from '../shapes/Object/FabricObject';
 import { AssertKeys } from '../typedefs';
 import { isTouchEvent, stopEvent } from '../util/dom_event';
@@ -22,7 +22,7 @@ import {
   isFabricObjectWithDragSupport,
   isInteractiveTextObject,
 } from '../util/types';
-import { SelectableCanvas } from './canvas.class';
+import { SelectableCanvas } from './SelectableCanvas';
 import { TextEditingManager } from './TextEditingManager';
 
 const addEventOptions = { passive: false } as EventListenerOptions;

src/canvas/canvas.class.ts → src/canvas/SelectableCanvas.ts

@@ -1,7 +1,7 @@
 import { getEnv } from '../env';
 import { dragHandler } from '../controls/drag';
 import { getActionFromCorner } from '../controls/util';
-import { Point } from '../point.class';
+import { Point } from '../Point';
 import { FabricObject } from '../shapes/Object/FabricObject';
 import {
   CanvasEvents,
@@ -14,21 +14,15 @@ import {
   addTransformToObject,
   saveObjectTransform,
 } from '../util/misc/objectTransforms';
-import { StaticCanvas, TCanvasSizeOptions } from './static_canvas.class';
+import { StaticCanvas, TCanvasSizeOptions } from './StaticCanvas';
 import {
   isActiveSelection,
   isCollection,
   isFabricObjectCached,
 } from '../util/types';
 import { invertTransform, transformPoint } from '../util/misc/matrix';
 import { isTransparent } from '../util/misc/isTransparent';
-import {
-  TMat2D,
-  TOriginX,
-  TOriginY,
-  TSize,
-  TToCanvasElementOptions,
-} from '../typedefs';
+import { TMat2D, TOriginX, TOriginY, TSize } from '../typedefs';
 import { degreesToRadians } from '../util/misc/radiansDegreesConversion';
 import { getPointer, isTouchEvent } from '../util/dom_event';
 import type { IText } from '../shapes/IText/IText';
@@ -38,7 +32,7 @@ import {
   wrapElement,
 } from '../util/dom_misc';
 import { setStyle } from '../util/dom_style';
-import type { BaseBrush } from '../brushes/base_brush.class';
+import type { BaseBrush } from '../brushes/BaseBrush';
 import { pick } from '../util/misc/pick';
 import { TSVGReviver } from '../typedefs';
 import { sendPointToPlane } from '../util/misc/planeChange';

src/canvas/static_canvas.class.ts → src/canvas/StaticCanvas.ts

@@ -2,14 +2,14 @@ import { getEnv } from '../env';
 import { config } from '../config';
 import { iMatrix, VERSION } from '../constants';
 import type { CanvasEvents, StaticCanvasEvents } from '../EventTypeDefs';
-import type { Gradient } from '../gradient/gradient.class';
+import type { Gradient } from '../gradient/Gradient';
 import { createCollectionMixin } from '../Collection';
 import { CommonMethods } from '../CommonMethods';
-import type { Pattern } from '../pattern.class';
-import { Point } from '../point.class';
+import type { Pattern } from '../Pattern';
+import { Point } from '../Point';
 import type { BaseFabricObject as FabricObject } from '../EventTypeDefs';
 import type { TCachedFabricObject } from '../shapes/Object/Object';
-import type { Rect } from '../shapes/rect.class';
+import type { Rect } from '../shapes/Rect';
 import {
   ImageFormat,
   TCornerPoint,

src/canvas/canvas_gestures.mixin.ts

@@ -6,7 +6,7 @@ import {
   degreesToRadians,
   radiansToDegrees,
 } from '../util/misc/radiansDegreesConversion';
-import { Canvas } from './canvas_events';
+import { Canvas } from './Canvas';
 
 /**
  * Adds support for multi-touch gestures using the Event.js library.

src/controls/control.class.ts → src/controls/Control.ts

@@ -5,7 +5,7 @@ import {
   TPointerEvent,
   TransformActionHandler,
 } from '../EventTypeDefs';
-import { Point } from '../point.class';
+import { Point } from '../Point';
 import type { FabricObject } from '../shapes/Object/Object';
 import { TDegree, TMat2D } from '../typedefs';
 import { cos } from '../util/misc/cos';

src/controls/controls.render.ts

@@ -1,7 +1,7 @@
 import { twoMathPi } from '../constants';
 import type { FabricObject } from '../shapes/Object/Object';
 import { degreesToRadians } from '../util/misc/radiansDegreesConversion';
-import type { Control } from './control.class';
+import type { Control } from './Control';
 
 export type ControlRenderingStyleOverride = Partial<
   Pick<

src/controls/default_controls.ts

@@ -1,5 +1,5 @@
 import { FabricObject } from '../shapes/Object/FabricObject';
-import { Textbox } from '../shapes/textbox.class';
+import { Textbox } from '../shapes/Textbox';
 import { scaleCursorStyleHandler, scalingEqually } from './scale';
 import { changeWidth } from './changeWidth';
 import { rotationStyleHandler, rotationWithSnapping } from './rotate';
@@ -9,7 +9,7 @@ import {
   scalingXOrSkewingY,
   scalingYOrSkewingX,
 } from './scaleSkew';
-import { Control } from './control.class';
+import { Control } from './Control';
 
 // use this function if you want to generate new controls for every instance
 export const createObjectDefaultControls = () => ({

src/controls/polyControl.ts

@@ -1,8 +1,8 @@
-import { Point } from '../point.class';
-import { Control } from './control.class';
+import { Point } from '../Point';
+import { Control } from './Control';
 import { TMat2D } from '../typedefs';
 import { iMatrix } from '../constants';
-import type { Polyline } from '../shapes/polyline.class';
+import type { Polyline } from '../shapes/Polyline';
 import { multiplyTransformMatrices } from '../util/misc/matrix';
 import {
   TPointerEvent,

src/controls/scale.ts

@@ -6,7 +6,7 @@ import {
 } from '../EventTypeDefs';
 import type { FabricObject } from '../shapes/Object/FabricObject';
 import { TAxis } from '../typedefs';
-import type { Canvas } from '../canvas/canvas_events';
+import type { Canvas } from '../canvas/Canvas';
 import {
   findCornerQuadrant,
   getLocalPoint,