@windycom/plugin-devtools 1.0.2-beta.2 → 1.0.5

package/README.md

@@ -1,3 +1,8 @@
 # Windy Plugins Developer tools
 
 Check out https://docs.windy-plugins.com for more information.
+
+# CHANGELOG
+
+-   1.0.5 - Fixing .d.ts declarations
+-   1.0.0 - TS declarations for client v42

package/index.mjs

@@ -18,8 +18,9 @@ const testLoadedPlugin = config => {
     );
 
     assert(
-        typeof icon === 'string' && /^.$/u.test(icon),
-        'Plugin icon MUSt be just single emoji character',
+        typeof icon === 'string' &&
+            (icon.length === 1 || /^[\u{0000}-\u{10FFFF}]{1,4}$/u.test(icon)),
+        'Plugin icon must be just single emoji character',
     );
 
     assert(

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@windycom/plugin-devtools",
-    "version": "1.0.2-beta.2",
+    "version": "1.0.5",
     "description": "Developer tools and TS declarations for developers of Windy Plugins.",
     "main": "index.mjs",
     "module": "index.mjs",

package/publishExamples.sh

@@ -6,7 +6,7 @@ NAME=example
 SHA=$(git rev-parse --short HEAD)
 OWNER=windycom
 
-DIR=dist/example05
+DIR=dist/example06
 
 cd ./$DIR
 echo "Creating plugin archive..."

package/types/client/BindedDropDown.d.ts

@@ -0,0 +1,14 @@
+import { BindedSwitch } from '@windy/BindedSwitch';
+import { DropDown } from '@windy/DropDown';
+import type { BindedSwitchInitParams } from '@windy/BindedSwitch';
+import type { DropDownInitParams } from '@windy/DropDown';
+import type { DataSpecifications } from '@windy/dataSpecifications.d';
+export type BindedDropDownInitParams<T extends keyof DataSpecifications> = DropDownInitParams<DataSpecifications[T]['def']> & BindedSwitchInitParams<T>;
+export declare class BindedDropDown<T extends keyof DataSpecifications> extends DropDown<DataSpecifications[T]['def']> {
+    protected initValue: DataSpecifications[T]['def'];
+    protected selected: DataSpecifications[T]['def'];
+    bindedSwitch: BindedSwitch<T>;
+    constructor(params: BindedDropDownInitParams<T>);
+    set(value: DataSpecifications[T]['def'], _uiIdentOrNoEmit?: string | boolean | void): void;
+    unmount(): void;
+}

package/types/{Calendar.d.ts → client/Calendar.d.ts}

@@ -1,10 +1,10 @@
 /**
  * Object containing timestamps and methods for given weather product
  */
-import type { CalendarDay, MinifestObject, Weekday } from '@windy/Calendar.d';
-import type { TimeFormatFunction } from '@windy/format.d';
-import type { Products } from '@windy/rootScope.d';
-import type { ISODateString, Path, Timestamp } from '@windy/types.d';
+import type { CalendarDay, MinifestObject, Weekday } from './d.ts.files/Calendar.d';
+import type { TimeFormatFunction } from './d.ts.files/format.d';
+import type { Products } from './d.ts.files/rootScope.d';
+import type { ISODateString, Path, Timestamp } from './d.ts.files/types.d';
 export type CalendarInitParams = Pick<Calendar, 'numOfHours' | 'minifestFile'> & {
     /**
      * Ident of product that this calendar is for

package/types/client/CanvasLayer.d.ts

@@ -0,0 +1 @@
+export {};

package/types/{Color.d.ts → client/Color.d.ts}

@@ -1,6 +1,6 @@
-import type { ColorGradient, ColorIdent, PluginColorIdent, RGBA, RGBString } from '@windy/Color.d';
-import type { StoreOptions } from '@windy/store.d';
-import type { NumValue } from '@windy/types.d';
+import type { ColorGradient, ColorIdent, PluginColorIdent, RGBA, RGBString } from './d.ts.files/Color.d';
+import type { StoreOptions } from './d.ts.files/store.d';
+import type { NumValue } from './d.ts.files/types.d';
 export type ColorInitParams = Pick<Color, 'ident'> & Partial<Pick<Color, 'qualitative' | 'save'>> & {
     steps: number;
     default?: ColorGradient | null;

package/types/{DataTiler.d.ts → client/DataTiler.d.ts}

@@ -1,6 +1,6 @@
 import { dataLoader } from '@windy/dataLoader';
-import type { FullRenderParameters } from '@windy/Layer.d';
-import type { DataTile } from '@windy/dataLoader';
+import type { FullRenderParameters } from './d.ts.files/Layer.d';
+import type { DataTile } from './d.ts.files/dataLoader';
 import type { ExtendedTileParams } from './DataTiler.d';
 export interface TilePoint {
     x: number;

package/types/client/Detail1hCheckbox.d.ts

@@ -0,0 +1,4 @@
+import { BindedCheckbox } from '@windy/BindedCheckbox';
+export declare class Detail1hCheckbox extends BindedCheckbox<'detail1h'> {
+    toggle(): void;
+}

package/types/{ExternalSveltePlugin.d.ts → client/ExternalSveltePlugin.d.ts}

@@ -13,7 +13,8 @@ export type LoadeExternalSveltePlugin = {
 type Config2config = {
     className: string;
     attachPoint?: string;
-    pane?: PluginPane;
+    pane: PluginPane;
+    addMObileSliders?: boolean;
 };
 export declare class ExternalSveltePlugin extends SveltePlugin<'windy-external-plugin'> {
     ident: 'windy-external-plugin';

package/types/{GlObj.d.ts → client/GlObj.d.ts}

@@ -1,4 +1,4 @@
-import type { Canvas, ExtendedWebGLTexture, WebGLProgramObject } from '@windy/GlObj.d';
+import type { Canvas, ExtendedWebGLTexture, WebGLProgramObject } from './d.ts.files/GlObj.d';
 /**
  * GLObj - Web GL context wrapper
  */

package/types/{Layer.d.ts → client/Layer.d.ts}

@@ -1,14 +1,14 @@
-import type { Color } from '@windy/Color';
-import type { FullRenderParameters, Layers, RenderParams, TransformFunction } from '@windy/Layer.d';
-import type { Metric } from '@windy/Metric';
-import type { Legend } from '@windy/Metric.d';
-import type { NumberedMetric } from '@windy/MetricClasses';
-import type { Product } from '@windy/Product';
-import type { DataQuality, FileSuffix } from '@windy/Product.d';
-import type { Renderers } from '@windy/Renderer.d';
-import type { WeatherParameters } from '@windy/interfaces.d';
-import type { Levels, Products } from '@windy/rootScope.d';
-import type { Timestamp } from '@windy/types';
+import type { Color } from './d.ts.files/Color';
+import type { FullRenderParameters, Layers, RenderParams, TransformFunction } from './d.ts.files/Layer.d';
+import type { Metric } from './d.ts.files/Metric';
+import type { Legend } from './d.ts.files/Metric.d';
+import type { NumberedMetric } from './d.ts.files/MetricClasses';
+import type { Product } from './d.ts.files/Product';
+import type { DataQuality, FileSuffix } from './d.ts.files/Product.d';
+import type { Renderers } from './d.ts.files/Renderer.d';
+import type { WeatherParameters } from './d.ts.files/interfaces.d';
+import type { Levels, Products } from './d.ts.files/rootScope.d';
+import type { Timestamp } from './d.ts.files/types';
 type LayerInitParams = Pick<Layer, 'ident'> & Partial<Layer>;
 export declare class Layer<M extends Metric | undefined = Metric | undefined> {
     /**

package/types/{Metric.d.ts → client/Metric.d.ts}

@@ -1,8 +1,8 @@
-import type { Color } from '@windy/Color';
-import type { RGBString } from '@windy/Color.d';
-import type { ConvObj, Legend, LegendDescription, LegendLines, MetricIdent, MetricInitParams, MetricItem, MetricKey } from '@windy/Metric.d';
-import type { LoadedTranslations } from '@windy/trans.d';
-import type { HTMLString, NumValue } from '@windy/types.d';
+import type { Color } from './d.ts.files/Color';
+import type { RGBString } from './d.ts.files/Color.d';
+import type { ConvObj, Legend, LegendDescription, LegendLines, MetricIdent, MetricInitParams, MetricItem, MetricKey } from './d.ts.files/Metric.d';
+import type { LoadedTranslations } from './d.ts.files/trans.d';
+import type { HTMLString, NumValue } from './d.ts.files/types.d';
 export declare const rtrnSelf: (x: NumValue) => NumValue;
 /**
  * # @windy/Metric

package/types/{Plugin.d.ts → client/Plugin.d.ts}

@@ -18,8 +18,10 @@ export type PluginPane =
  | 'nearest'
 /** Bottom plugin that ducks under mobile time controls (use only in exception) */
  | 'small-bottom-bottom'
-/** External plugin embedded to HP */
- | 'embedded';
+/** Plugin embedded to RHbottom area on desktop (so far used only for external plugins) */
+ | 'embedded'
+/** Fullscreen mobile panes */
+ | 'fullscreen-mobile';
 /** Allowed params to Plugin constructor (private and protected props are omited by default) */
 export type PluginInitParams<P extends PluginIdent> = Pick<Plugin<P>, 'ident'> & Partial<Omit<Plugin<P>, 'isLoaded' | 'isOpen' | 'load' | 'open'>>;
 export declare class Plugin<P extends PluginIdent> {

package/types/{Product.d.ts → client/Product.d.ts}

@@ -1,11 +1,11 @@
 import { Calendar } from '@windy/Calendar';
-import type { MinifestObject } from '@windy/Calendar.d';
-import type { Layers } from '@windy/Layer.d';
-import type { DataQuality, FileSuffix } from '@windy/Product.d';
-import type { HttpPayload } from '@windy/http.d';
-import type { LatLon } from '@windy/interfaces';
-import type { AcTimes, Isolines, Levels, Overlays, Products } from '@windy/rootScope.d';
-import type { ProductCategory, ProductIdent } from '@windy/types';
+import * as http from '@windy/http';
+import type { MinifestObject } from './d.ts.files/Calendar.d';
+import type { Layers } from './d.ts.files/Layer.d';
+import type { DataQuality, FileSuffix } from './d.ts.files/Product.d';
+import type { LatLon } from './d.ts.files/interfaces';
+import type { AcTimes, Isolines, Levels, Overlays, Products } from './d.ts.files/rootScope.d';
+import type { ProductCategory, ProductIdent } from './d.ts.files/types';
 export type ProductInitParams = Pick<Product, 'modelName' | 'provider' | 'interval'> & Partial<Pick<Product, 'provider' | 'ident' | 'maxTileZoom' | 'animationSpeed' | 'animationSpeed1h' | 'fileSuffix' | 'fileSuffixFallback' | 'JPGtransparency' | 'PNGtransparency' | 'dataQuality' | 'betterDataQuality' | 'animation' | 'labelsTemp' | 'overlays' | 'prefferedProduct' | 'pathGenerator' | 'isolines' | 'directory' | 'category' | 'modelIdent' | 'intervalPremium' | 'server' | 'modelResolution' | 'levels' | 'logo' | 'acTimes'>> & {
     requiresInfoJson?: boolean;
     forecastSize?: number;
@@ -182,7 +182,7 @@ export declare class Product {
     };
     moveTs(moveRight: boolean, isAccu?: boolean): boolean | void;
     getMinifestUrl(): string;
-    loadMinifest(): Promise<HttpPayload<MinifestObject>>;
+    loadMinifest(): Promise<http.HttpPayload<MinifestObject>>;
     open(): Promise<void | Calendar>;
     close(): void;
     /**

package/types/{ProductSwitch.d.ts → client/ProductSwitch.d.ts}

@@ -6,7 +6,7 @@ export type ProductSwitchInitParams = {
 export declare class ProductSwitch extends BindedSwitch<'product'> {
     showResolution: boolean;
     constructor(params: ProductSwitchInitParams);
-    printHTML(prods?: ("radar" | "satellite" | "capAlerts" | "cams" | "icon" | "drought" | "gfs" | "ecmwf" | "ecmwfAnalysis" | "ecmwfWaves" | "gfsWaves" | "iconWaves" | "efi" | "cmems" | "fireDanger" | "activeFires" | "nems" | "namConus" | "namHawaii" | "namAlaska" | "iconEu" | "iconD2" | "arome" | "aromeAntilles" | "aromeReunion" | "camsEu" | "iconEuWaves" | "hrrrAlaska" | "hrrrConus" | "bomAccess" | "ukv" | "mblue")[]): void;
+    printHTML(prods?: ("icon" | "radar" | "satellite" | "capAlerts" | "gfs" | "ecmwf" | "ecmwfAnalysis" | "ecmwfWaves" | "gfsWaves" | "iconWaves" | "cams" | "efi" | "cmems" | "drought" | "fireDanger" | "activeFires" | "nems" | "namConus" | "namHawaii" | "namAlaska" | "iconEu" | "iconD2" | "arome" | "aromeAntilles" | "aromeReunion" | "camsEu" | "iconEuWaves" | "hrrrAlaska" | "hrrrConus" | "bomAccess" | "ukv" | "mblue")[]): void;
     /**
      * The menu is already in a DOM since we do not modify products so often
      */

package/types/{Renderer.d.ts → client/Renderer.d.ts}

@@ -1,7 +1,7 @@
-import type { FullRenderParameters } from '@windy/Layer.d';
-import type { Renderers } from '@windy/Renderer.d';
-import type { InterpolatorFactory } from '@windy/interpolator';
-import type { BottomTagPlugins, Plugins } from '@windy/plugins.d';
+import type { FullRenderParameters } from './d.ts.files/Layer.d';
+import type { Renderers } from './d.ts.files/Renderer.d';
+import type { InterpolatorFactory } from './d.ts.files/interpolator';
+import type { BottomTagPlugins, Plugins } from './d.ts.files/plugins.d';
 type AllowedRenderPlugins = Pick<Plugins, 'radar' | 'satellite' | 'cap-alerts' | 'isolines' | 'gl-particles' | 'particles'>;
 export interface RendererInitParams {
     ident: Renderers;

package/types/{Webcams.d.ts → client/Webcams.d.ts}

@@ -1,8 +1,8 @@
 import { ClickHandler } from '@windy/ClickHandler';
-import type { ClickHandlerInitParams } from '@windy/ClickHandler';
-import type { WebcamDetail, WebcamsLoadingParams, WebcamMetadata } from '@windy/Webcams.d';
-import type { Plugins } from '@windy/plugins.d';
-import type { LatLon } from '@windy/interfaces';
+import type { ClickHandlerInitParams } from './d.ts.files/ClickHandler';
+import type { WebcamDetail, WebcamsLoadingParams, WebcamMetadata } from './d.ts.files/Webcams.d';
+import type { Plugins } from './d.ts.files/plugins.d';
+import type { LatLon } from './d.ts.files/interfaces';
 export type WebcamsInitParams = {
     useHover?: boolean;
     maxAmount?: number;

package/types/client/components.d.ts

@@ -0,0 +1 @@
+export {};

package/types/client/d.ts.files/Calendar.d.ts

@@ -0,0 +1,87 @@
+import { LoadedTranslations } from '@windy/trans.d';
+import { Timestamp, ISODateString } from '@windy/types.d';
+
+/**
+ * Main minifest object. Mother of all forecasts
+ */
+export interface MinifestObject {
+    /**
+     * Version
+     */
+    v: string;
+
+    /**
+     * Array of hour moments that contain forecast data
+     */
+    dst: number[][];
+
+    /**
+     * Main identifier, identifiing the refTime on the backend.
+     */
+    info: string;
+
+    /**
+     * Reference time of forecast
+     */
+    ref: ISODateString;
+
+    /**
+     * Update time of the forecast
+     */
+    update: ISODateString;
+
+    /**
+     * In an emergency case backend can set `force` property at minifest. It breaks minifest client cache and set minifest at any circumstances
+     */
+    forced?: boolean;
+}
+
+/**
+ * Main Calendar Day Object
+ */
+export interface CalendarDay {
+    /**
+     * Translation ID for week day abbreviation
+     */
+    display: keyof LoadedTranslations;
+
+    /**
+     * Translation ID for week day abbreviation
+     */
+    displayLong: keyof LoadedTranslations;
+
+    /**
+     * Start of the day
+     */
+    start: Timestamp;
+
+    /**
+     * End of the day
+     */
+    end: Timestamp;
+
+    /**
+     * Midday of the day
+     */
+    middayTs: Timestamp;
+
+    /**
+     * Day of the month
+     */
+    day: number;
+
+    /**
+     * month
+     */
+    month: number;
+
+    /**
+     * year
+     */
+    year: number;
+}
+
+/**
+ * Valid translation keys
+ */
+export type Weekday = 'SUN' | 'MON' | 'TUE' | 'WED' | 'THU' | 'FRI' | 'SAT';

package/types/client/d.ts.files/CanvasLayer.d.ts

@@ -0,0 +1,70 @@
+export class CanvasLayer extends L.Layer {
+    targetPane?:
+        | 'mapPane'
+        | 'tilePane'
+        | 'overlayPane'
+        | 'objectsPane'
+        | 'popupPane'
+        | 'shadowPane'
+        | 'markerPane';
+    _showCanvasOn?: boolean;
+    failed?: boolean;
+    _canvas?: L.CanvasElement | null;
+    _center?: L.LatLng;
+    _zoom?: number;
+    _frame?: number | null;
+    wasOnZoom?: boolean;
+    options: L.LayerOptions & {
+        disableAutoReset: boolean;
+        padding: number;
+    };
+
+    initialize(this: this, options?: L.LayerOptions): void;
+    onResizeCanvas(this: this, width: number, height: number): void;
+    showCanvas(this: this, on: boolean): void;
+    reset(this: this): void;
+    canvasDisplay(this: this, enable: boolean): void;
+    getCanvas(this: this): L.CanvasElement | undefined | null;
+    redraw(this: this): void;
+
+    _resize(this: this, event: L.ResizeEvent): void;
+    _animateZoom(this: this, e: L.ZoomAnimEvent): void;
+    _onZoom(this: this): void;
+    _onZoomStart(this: this): void;
+    _onZoomEnd(this: this): void;
+    _moveEnd(this: this): void;
+    _reset(this: this): void;
+    _redraw(this: this): void;
+    _updateTransform(center: L.LatLng, zoom: number): void;
+
+    /** TODO empty by default */
+    onInit(this: this): void;
+
+    /** TODO true by default */
+    onCreateCanvas(this: this, canvas?: HTMLElement): boolean;
+
+    /** TODO empty by default */
+    onCanvasFailed(this: this): void;
+
+    /** TODO empty by default */
+    onRemoveCanvas(this: this, canvas?: HTMLElement): void;
+
+    /** TODO empty by default */
+    onMoveEnd(this: this): void;
+
+    /** TODO empty by default */
+    onZoomEnd(this: this): void;
+
+    /** TODO empty by default */
+    onReset(this: this): void;
+
+    // Just this typings rewrites of leaflet methods
+    onAdd(this: this, map: L.Map): this;
+    addTo(this: this, map: L.Map): this;
+    onRemove(this: this, map: L.Map): this;
+
+    onContextLost(): void;
+    onContextRestored(): void;
+    onContextCreationError(e: WebGLContextEvent): void;
+    canvasHooks(canvas: L.CanvasElement | null | undefined, on: boolean): void;
+}

package/types/client/d.ts.files/Color.d.ts

@@ -0,0 +1,82 @@
+import { NumValue } from '@windy/types.d';
+
+export type RGBA = [number, number, number, number];
+
+export type YUVA = [number, number, number, number];
+
+export type ColorGradient = [NumValue, RGBA][];
+
+/**
+ * 'rgb(200,0,150)'
+ */
+export type RGBString = string;
+
+/**
+ * 'rgba(200,0,150,1)'
+ */
+export type RGBAString = string;
+
+export type ColorIdent =
+    | 'temp'
+    | 'wind'
+    | 'rh'
+    | 'pressure'
+    | 'cclAltitude'
+    | 'altitude'
+    | 'deg0'
+    | 'levels'
+    | 'rain'
+    | 'ptype'
+    | 'rainClouds'
+    | 'clouds'
+    | 'lclouds'
+    | 'hclouds'
+    | 'mclouds'
+    | 'cape'
+    | 'lightDensity'
+    | 'cbase'
+    | 'snow'
+    | 'rainAccu'
+    | 'waves'
+    | 'currents'
+    | 'currentsTide'
+    | 'visibility'
+    | 'gtco3'
+    | 'aod550'
+    | 'pm2p5'
+    | 'no2'
+    | 'tcso2'
+    | 'go3'
+    | 'cosc'
+    | 'dust'
+    | 'satellite'
+    | 'radar'
+    | 'fog'
+    | 'justGray'
+    | 'efiWind'
+    | 'efiTemp'
+    | 'efiRain'
+    | 'moistureAnom40'
+    | 'moistureAnom100'
+    | 'drought40'
+    | 'drought100'
+    | 'soilMoisture40'
+    | 'soilMoisture100'
+    | 'fwi'
+    | 'dfm10h'
+    | 'solarpower'
+    | 'uvindex'
+    | 'turbulence'
+    | 'icing'
+    | 'wetbulbtemp';
+
+type PluginColorIdent =
+    | 'airQ'
+    | 'windDetail'
+    | 'wavesDetail'
+    | 'periodDetail'
+    | 'altitudeDetail'
+    | 'visibilityDetail'
+    | 'dewpointSpreadDetail'
+    | 'blitz'
+    | 'radiation';

package/types/client/d.ts.files/DataTiler.d.ts

@@ -0,0 +1,45 @@
+import { MapCoordinates } from '@windy/dataSpecifications.d';
+
+export interface TilePoint {
+    x: number;
+    y: number;
+    z: number;
+}
+
+export interface ExtendedTileParams extends MapCoordinates {
+    /**
+     * => bounds.min.x of map.getPixelBounds();
+     */
+    pixelOriginX: number;
+
+    /**
+     * => bounds.min.y of map.getPixelBounds();
+     */
+    pixelOriginY: number;
+
+    /**
+     * Data zoom
+     */
+    dZoom: number;
+
+    /**
+     * Size of map in piels
+     */
+    width: number;
+
+    /**
+     * Size of map in pxels
+     */
+    height: number;
+
+    /**
+     * Coords of original unwrapped map tiles
+     * basicaly map.getPixelBounds();
+     */
+    origTiles: {
+        minX: number;
+        minY: number;
+        maxX: number;
+        maxY: number;
+    };
+}

package/types/client/d.ts.files/GlObj.d.ts

@@ -0,0 +1,92 @@
+import type { Texture2D } from 'plugins/_shared/gl-lib/gl-lib';
+import type {
+    Mat2,
+    Mat2d,
+    Mat3,
+    Mat4,
+    Quat,
+    Quat2,
+    Vec2,
+    Vec3,
+    Vec4,
+} from '@plugins/globe/gl-matrix/types';
+
+export interface CustomError extends Error {
+    contextLost?: boolean;
+    isVertexShader?: boolean;
+    name: string;
+    full?: string;
+}
+
+// export type WebGLProgramObject = {
+//     [whatever: string]: any;
+// };
+
+export type UniformName = `u${string}`;
+
+export type AttributeName = `a${string}`;
+
+export type SamplerName = `s${string}`;
+
+export type WebGLProgramAttributes = {
+    [attribute: AttributeName]: number;
+};
+
+export type WebGLProgramUniforms = {
+    [uniform: UniformName]: WebGLUniformLocation | null;
+    [sampler: SamplerName]: WebGLUniformLocation | null;
+};
+
+export type WebGLProgramParams = WebGLProgramAttributes & WebGLProgramUniforms;
+
+export type AnyUniform = number | Vec2 | Vec3 | Vec4 | Mat2 | Mat2d | Mat3 | Mat4 | Quat | Quat2;
+
+export type ShaderPars = {
+    uVPars0?: Vec4;
+    uVPars1?: Vec4;
+    uVPars2?: Vec4;
+
+    uMatRot?: Mat3;
+
+    uPars0?: Vec4;
+    uPars1?: Vec4;
+} & {
+    [uniform: UniformName]: AnyUniform;
+    [uniform: SamplerName]: Texture2D | WebGLTexture | null;
+};
+
+export type WebGLProgramObject = {
+    program: WebGLProgram | null;
+    aPos?: number;
+    variantI?: number; // property added in VisualizerShader.compile()
+} & WebGLProgramParams;
+
+export interface ExtendedWebGLTexture extends WebGLTexture {
+    _width?: GLsizei;
+    _height?: GLsizei;
+    _format?: GLenum;
+}
+
+/**
+ * Canvas as HTML element with added properties
+ */
+//  export interface Canvas extends HTMLCanvasElement {
+//     cssWidth: number;
+//     cssHeight: number;
+//     cssHeightInner: number;
+//     pxRatio: number;
+//     heightInner: number;
+// }
+
+export type HTMLCanvasExtended = HTMLCanvasElement & {
+    cssWidth: number;
+    cssHeight: number;
+    cssHeightInner: number;
+    pxRatio: number;
+    heightInner: number;
+};
+
+/**
+ * HTML canvas element or HTML canvas element with added properties
+ */
+export type Canvas = HTMLCanvasElement | HTMLCanvasExtended;