@massimo-cassandro/minimo 1.21.3 → 1.21.5

package/dev-tools/starter-kit/templates/package-tpl.json

@@ -19,7 +19,8 @@
   "scripts": {
     "progetto JS webpack DEV": "npm 'launchChrome' && NODE_ENV=development webpack serve --config ./webpack.config.mjs #--open-app-name 'Google Chrome'",
     "progetto sf webpack DEV": "rm -rf ./public/_dev && NODE_ENV=development webpack --config ./frontend/webpack.config.mjs",
-    "webpack PROD": "NODE_ENV=production webpack --config ./webpack.config.mjs --stats minimal",
+    "webpack PROD": "npm run 'UPD-version' && NODE_ENV=production webpack --config ./webpack.config.mjs --stats minimal",
+    "eslint-check": "npx eslint app/ # or src/, frontend/src/ ...",
     "create-favicons INIT": "npx create-favicons init",
     "create-favicons": "npx create-favicons --dir=./src/favicons",
     "UPD-version": "npx update-version  # --log-file=./frontend/changelog.md --log-patch --pkg=alt/path/to/package.json",
@@ -30,7 +31,9 @@
     "symfony server": "symfony serve --port=8100 --listen-ip=0.0.0.0 # symfony server:stop # http://192.168.1.135:8100 # -d (deamon): rimane aperto anche dopo la chiusra del terminale",
     "node server": "node serve # richiede ‘npm i serve’",
     "build tokens": "npx buildTokens --config ./path/to/tokens-config.mjs",
-    "check unresolved props": "npx checkUnresolvedProps --config ./path/to/tokens-config.mjs"
+    "check unresolved props": "npx checkUnresolvedProps --config ./path/to/tokens-config.mjs",
+    "npm-outdated": "npm outdated",
+    "npm-upd": "npm update --save"
   },
   "devDependencies": {},
   "dependencies": {}

package/dev-tools/starter-kit/webpack.config.mjs

@@ -457,9 +457,12 @@ const config = {
             ...(current_year > start_year? [current_year] : [])
           ].join('-')
           ,vers = packageJson.version.split('.').slice(0,-1).join('.')
+          // ,vers = packageJson.version
         ;
 
-        return `/*! ${packageJson.name} v.${vers} - Massimo Cassandro ${year} */`;
+        const author = packageJson.author?.name ?? (packageJson.author ?? '');
+
+        return `/*! ${packageJson.name} v.${vers} - ${author} ${year} */`;
 
       },
       raw: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@massimo-cassandro/minimo",
-  "version": "1.21.3",
+  "version": "1.21.5",
   "description": "Light css framework & utilities",
   "type": "module",
   "main": "./index.js",

package/src/components/modal-popup/modal-popup.js

@@ -40,7 +40,10 @@ function closeDialog(el) {
  *
  * @param {Object} params
  * @param {string | null} [params.dialogExtraClassName=null] - Extra class added to the dialog element.
+ * @param {string | DomBuilderItem[] | null} [params.content=null] - Plain text, HTML, or a domBuilder array.
  * @param {string | null} [params.contentExtraClassName=null] - Extra class added to the content wrapper.
+ * @param {HTMLElement | null} [params.triggerElement=null] - Optional element that triggered the popup; when set, `aria-haspopup`, `aria-controls` and `aria-expanded` are managed on it.
+ * @param {boolean} [params.addFocus=true] - if true, dialog receives focus after opening
  * @param {string | null} [params.headerExtraClassName=null] - Extra class added to the header wrapper.
  * @param {string | null} [params.footerExtraClassName=null] - Extra class added to the footer wrapper.
  * @param {string | number | null} [params.dialogWidth=null] - optional dialog width value - if set, overrides main css custom prop
@@ -50,14 +53,12 @@ function closeDialog(el) {
  * @param {string | number | null} [params.dialogMinHeight=null] - optional dialog min-height value - if set, overrides main css custom prop
  * @param {string | number | null} [params.dialogMaxHeight=null] - optional dialog max-height value - if set, overrides main css custom prop
  * @param {string | null} [params.iframeUrl=null] - URL to load in an iframe.
- * @param {string | DomBuilderItem[] | null} [params.content=null] - Plain text, HTML, or a domBuilder array.
  * @param {string | null} [params.ajaxUrl=null] - URL for Ajax content loading.
  * @param {((data: *, el: Element) => void) | null} [params.ajaxCallback=null] - Called with the Ajax response and the content element.
  * @param {((el: HTMLDialogElement) => void) | null} [params.closeCallback=null] - Called with the dialog element just before it is removed.
  * @param {boolean} [params.addScrollbarPadding=false] - Adds right padding to compensate for the scrollbar.
  * @param {string | DomBuilderItem[] | null} [params.headerContent=null] - Header content: plain text, HTML, or a domBuilder array.
  * @param {string | DomBuilderItem[] | null} [params.footerContent=null] - Footer content: plain text, HTML, or a domBuilder array.
- * @param {HTMLElement | null} [params.triggerElement=null] - Optional element that triggered the popup; when set, `aria-haspopup`, `aria-controls` and `aria-expanded` are managed on it.
  * @returns {HTMLDialogElement} The dialog element.
  */
 
@@ -77,6 +78,8 @@ export function modalPopup({
   dialogMinHeight = null,
   dialogMaxHeight = null,
 
+  addFocus = true,
+
   /** iframe url */
   iframeUrl = null,
 
@@ -295,7 +298,10 @@ export function modalPopup({
 
   document.body.classList.add('overflow-hidden');
   thisDialog.showModal();
-  thisDialog.focus();
+
+  if(addFocus) {
+    thisDialog.focus();
+  }
 
   thisDialog.classList.add(styles.on);
 

package/src/components/modal-popup/modal-popup.minimo.tokens.mjs

@@ -15,11 +15,11 @@ export default {
     },
     height: {
       $type: 'dimension',
-      $value: 'max-content',
+      $value: 'fit-content',
     },
     'min-height': {
       $type: 'dimension',
-      $value: '300px',
+      $value: '40dvw',
     },
     'max-height': {
       $type: 'dimension',

package/src/components/modal-popup/modal-popup.module.css

@@ -36,7 +36,8 @@
 
 .closeButton  {
 
-  position: absolute;
+  /* stylelint-disable-next-line declaration-no-important */
+  position: absolute !important;
   top: calc(-1 * var(--mpopup-btn-close-size) / 3);
   right: calc(-1 * var(--mpopup-btn-close-size) / 3);
 }

package/src/minimo.css

@@ -1,5 +1,4 @@
-/* decomment layers if you want to use them */
-/* see https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@layer */
+/* decomment if you want to use layers. see https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@layer */
 /* @layer reset, base, components, utilities, project, overrides; */
 
 /* @import '@src/fonts.css'; */

package/src/utilities/dom-builder-helpers/form-tags.js

@@ -102,7 +102,7 @@ export function buildInput({
  * @param {string} args.label - select label.
  * @param {string | null} args.name - select `name` attribute.
  * @param {string | null} args.id - `id` attribute.
- * @param {string | number | null} args.selectedValue - selected value
+ * @param {string | number | null} args.selectedValue - selected value (note: checked against 'options' values using loose equality '=='):
  * @param {Array<[string|number, string]> | Array<Record<string, string>> | Record<string, string> | null} args.options -
  *    options value/text pairs, as an array of two-element `[[value, text], ...]` arrays,
  *    as an array of objects `[{somekey: value, somekey2: text},...]` objects, or as a single `{value: text, ...}` object
@@ -162,7 +162,8 @@ export function buildSelect({
               tag: 'option',
               attrs: {
                 value: value,
-                selected: value === selectedValue
+                // eslint-disable-next-line eqeqeq
+                selected: value == selectedValue
               },
               content: text
             }))