chore: close lint fails #165

.storybook/examples/marker-cluster-options.jsx

@@ -1,22 +1,21 @@
-import React from 'react';
+import React from "react";
 
-import L from 'leaflet';
-import { MapContainer, TileLayer, Marker } from 'react-leaflet';
+import L from "leaflet";
+import { MapContainer, TileLayer, Marker } from "react-leaflet";
 
-import MarkerClusterGroup from './../../src/react-leaflet-markercluster';
+import MarkerClusterGroup from "./../../src/react-leaflet-markercluster";
 
-import { MAP_ZOOM, MAP_MAX_ZOOM, MAP_CENTER_COORDINATES } from './constants';
+import { MAP_ZOOM, MAP_MAX_ZOOM, MAP_CENTER_COORDINATES } from "./constants";
 
-import './styles.scss';
+import "./styles.scss";
 
 // Function for creating custom icon for cluster group
 // https://github.com/Leaflet/Leaflet.markercluster#customising-the-clustered-markers
 // NOTE: iconCreateFunction is running by leaflet, which is not support ES6 arrow func syntax
-// eslint-disable-next-line
-const createClusterCustomIcon = function(cluster) {
+const createClusterCustomIcon = function (cluster) {
   return L.divIcon({
     html: `<span>${cluster.getChildCount()}</span>`,
-    className: 'marker-cluster-custom',
+    className: "marker-cluster-custom",
     iconSize: L.point(40, 40, true),
   });
 };

.storybook/examples/marker-tooltip.jsx

@@ -1,13 +1,12 @@
-import React from 'react';
+import React from "react";
 
-import L from 'leaflet';
-import { MapContainer, TileLayer, Marker, Tooltip } from 'react-leaflet';
+import { MapContainer, TileLayer, Marker, Tooltip } from "react-leaflet";
 
-import MarkerClusterGroup from './../../src/react-leaflet-markercluster';
+import MarkerClusterGroup from "./../../src/react-leaflet-markercluster";
 
-import { MAP_ZOOM, MAP_MAX_ZOOM, MAP_CENTER_COORDINATES } from './constants';
+import { MAP_ZOOM, MAP_MAX_ZOOM, MAP_CENTER_COORDINATES } from "./constants";
 
-import './styles.scss';
+import "./styles.scss";
 
 // Setup Tooltip according to react-leaflet documentation
 // https://react-leaflet.js.org/docs/en/examples.html

eslint.config.mjs

@@ -1,14 +1,16 @@
-import pluginJs from '@eslint/js';
-import eslintConfigPrettier from 'eslint-config-prettier';
-import pluginReact from 'eslint-plugin-react';
-import storybook from 'eslint-plugin-storybook';
-import globals from 'globals';
+import pluginJs from "@eslint/js";
+import eslintConfigPrettier from "eslint-config-prettier";
+import pluginReact from "eslint-plugin-react";
+import storybook from "eslint-plugin-storybook";
+import globals from "globals";
 
 export default [
-  { files: ['**/*.{js,mjs,cjs,jsx}'] },
+  { files: ["**/*.{js,mjs,cjs,jsx}"] },
+  { ignores: ["dist/**"] },
   { languageOptions: { globals: globals.browser } },
+  { settings: { react: { version: "detect" } } },
   pluginJs.configs.recommended,
   pluginReact.configs.flat.recommended,
   eslintConfigPrettier,
-  ...storybook.configs['flat/recommended'],
+  ...storybook.configs["flat/recommended"],
 ];

package.json

@@ -45,7 +45,7 @@
   "private": false,
   "scripts": {
     "dev": "storybook dev -p 6006",
-    "lint": "eslint --ext .js ./ --ignore-pattern '/dist/'",
+    "lint": "eslint",
     "build:cjs": "cross-env BABEL_ENV=cjs babel ./src -o ./dist/cjs/index.js",
     "build:esm": "cross-env BABEL_ENV=esm babel ./src -o ./dist/esm/index.js",
     "build:code": "npm run build:cjs && npm run build:esm && cp ./index.d.ts ./dist/index.d.ts",

src/react-leaflet-markercluster.js

@@ -1,6 +1,6 @@
-import { createPathComponent } from '@react-leaflet/core';
-import L from 'leaflet';
-import 'leaflet.markercluster';
+import { createPathComponent } from "@react-leaflet/core";
+import L from "leaflet";
+import "leaflet.markercluster";
 
 L.MarkerClusterGroup.include({
   _flushLayerBuffer() {
@@ -16,19 +16,20 @@ L.MarkerClusterGroup.include({
   },
 });
 
-L.MarkerClusterGroup.addInitHook(function() {
+L.MarkerClusterGroup.addInitHook(function () {
   this._layerBuffer = [];
 });
 
+// eslint-disable-next-line no-unused-vars
 function createMarkerCluster({ children: _c, ...props }, context) {
   const clusterProps = {};
   const clusterEvents = {};
-  
+
   // Splitting props and events to different objects
   Object.entries(props).forEach(([propName, prop]) =>
-    propName.startsWith('on')
+    propName.startsWith("on")
       ? (clusterEvents[propName] = prop)
-      : (clusterProps[propName] = prop)
+      : (clusterProps[propName] = prop),
   );
   const instance = new L.MarkerClusterGroup(clusterProps);