@lipemat/js-boilerplate 10.3.0-beta.7 → 10.3.0

package/config/css-loader.config.js

@@ -1,5 +1,4 @@
-const config = require( '../helpers/package-config' );
-const {getLocalIdent} = require( '../helpers/css-classnames' );
+const {getLocalIdent, usingShortCssClasses} = require( '../helpers/css-classnames' );
 
 /**
  * Options for the Webpack `css-loader`.
@@ -40,7 +39,7 @@ if ( 'production' === process.env.NODE_ENV ) {
 		modules: {
 			exportLocalsConvention: 'camelCase',
 			// Use short CSS Classes if enabled.
-			...config.shortCssClasses ? {getLocalIdent} : {},
+			...usingShortCssClasses() ? {getLocalIdent} : {},
 			// Hash used when short CSS classes are not enabled.
 			localIdentName: '[contenthash:base64:5]',
 			mode,

package/config/tsconfig.json

@@ -1,6 +1,8 @@
 {
-  "//": "@see ./templates/tsconfig.json to use/extend this configuration in your project",
-  "//": "PHPStorm will only see changes to the file, if you re-save the project root's tsconfig.json file",
+  "//~": "@see ./templates/tsconfig.json to use/extend this configuration in your project",
+  "//~~": "PHPStorm will only see changes to the file, if you re-save the project root's tsconfig.json file",
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "JS Boilerplate",
   "compilerOptions": {
     "allowSyntheticDefaultImports": true,
     "jsx": "preserve",
@@ -8,14 +10,16 @@
       "dom",
       "es2018"
     ],
-    "module": "commonjs",
+    "module": "ESNext",
+    "moduleResolution": "Node",
     "noFallthroughCasesInSwitch": true,
     "noImplicitReturns": true,
     "noImplicitThis": true,
     "sourceMap": true,
     "strictBindCallApply": true,
     "strictNullChecks": true,
-    "target": "es6"
+    "target": "es6",
+    "verbatimModuleSyntax": false
   },
   "exclude": [
     "node_modules"

package/helpers/css-classnames.js

@@ -1,9 +1,22 @@
+const {getPackageConfig} = require( './package-config' );
+
 const SHORT_ALPHABET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
 const ALPHABET = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
 
 const classes = {};
 let counters = [ -1 ];
 
+/**
+ * Check if short CSS classes are enabled.
+ *
+ * Using a helper function to allow for future enhancements.
+ *
+ * @since 10.3.0
+ */
+function usingShortCssClasses() {
+	return getPackageConfig().shortCssClasses;
+}
+
 /**
  * Reset all counters.
  *
@@ -102,5 +115,6 @@ module.exports = {
 	SHORT_ALPHABET,
 	getLocalIdent,
 	getNextClass,
+	usingShortCssClasses,
 	resetCounters,
 };

package/helpers/package-config.js

@@ -19,4 +19,17 @@ try {
 } catch ( e ) {
 }
 
+/**
+ * Helper function to get the results of `packageConfig`.
+ *
+ * - Allows mocking the results of `packageConfig` for testing.
+ * - Allows getting the config through a callback instead of an import.
+ *
+ * @since 10.3.0
+ */
+function getPackageConfig() {
+	return packageConfig;
+}
+packageConfig.getPackageConfig = getPackageConfig;
+
 module.exports = packageConfig;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lipemat/js-boilerplate",
-  "version": "10.3.0-beta.7",
+  "version": "10.3.0",
   "description": "Dependencies and scripts for a no config JavaScript app",
   "author": "Mat Lipe",
   "license": "MIT",
@@ -42,7 +42,7 @@
     "@babel/preset-env": "^7.22.9",
     "@babel/preset-react": "^7.12.10",
     "@babel/preset-typescript": "^7.12.7",
-    "@csstools/postcss-global-data": "^2.0.0",
+    "@csstools/postcss-global-data": "2.0.0",
     "@lipemat/css-mqpacker": "^9.0.0",
     "@lipemat/eslint-config": "^3.0.1",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10",