@massimo-cassandro/minimo 1.43.1 → 1.43.2

package/charts/src/helpers/parse-std-axis-opts.js

@@ -25,6 +25,7 @@ export function parseStdAxisOpts(params = {} ) {
       values: [], // array flat dei valori per il calcolo di maxValues e minValues, qualora fossero null
       legenda: null,
       padding: 0, // spazio intorno ai bordi del grafico
+      padding_right: null, // padding del solo lato destro; se null viene usato `padding`
       width: null, // width e height non possono essere null, vanno verificate prima
       height: null,
       eti_asseX_height: null, // non può essere null, va verificato prima
@@ -96,7 +97,7 @@ export function parseStdAxisOpts(params = {} ) {
     // i lati sx e inferiore corrispondono agli assi
     parsed.chart_area = {
       top       : legenda_height + gap_legenda + params.padding, // coordinata y superiore
-      right     : params.width - params.padding, // coordinata x dx
+      right     : params.width - (params.padding_right?? params.padding), // coordinata x dx
       bottom    : params.height - params.eti_asseX_height - params.ticksLength - params.padding, // coordinata y inferiore
       left      : params.eti_asseY_width + params.ticksLength + params.padding // coordinata x sx
     };

package/charts/src/lines.js

@@ -274,6 +274,17 @@ export async function lines(params) {
       .viewbox(0, 0, params.width, params.height)
       .attr({...params.svgAttrs});
 
+    /*
+      L'ultimo punto di ogni linea cade sul limite destro della chart area:
+      se il padding è inferiore al raggio massimo dei punti, il cerchio verrebbe tagliato dal bordo dell'svg.
+      In tal caso il padding destro viene portato al raggio massimo.
+    */
+    const radii = Array.isArray(params.data_points_attrs.r)
+      ? params.data_points_attrs.r
+      : [params.data_points_attrs.r];
+    const maxPointRadius = Math.max(0, ...radii.map(r => Number(r) || 0));
+    const paddingRight = Math.max(params.padding, maxPointRadius);
+
     // pre-elaborazione e calcolo di alcuni elementi (chartArea)
     // nuove variabili definite da parseStdAxisOpts
     const {
@@ -291,6 +302,7 @@ export async function lines(params) {
       values: flatValues,
       legenda: params.legenda,
       padding: params.padding,
+      padding_right: paddingRight,
       width: params.width,
       height: params.height,
       eti_asseX_height: params.xAxisLabelHeight,

package/dev-tools/starter-kit/source_files/root/package-tpl.json

@@ -40,7 +40,8 @@
     "npm-upd": "npm update --save"
   },
   "allowScripts": {
-    "@parcel/watcher": false
+    "@parcel/watcher": false,
+    "fsevents@2.3.3": true
   },
   "devDependencies": {},
   "dependencies": {}

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

@@ -103,21 +103,27 @@ const isDevelopment = process.env.NODE_ENV === 'development'
   ,minimo_path = './node_modules/@massimo-cassandro/minimo' // fromProjectRoot('node_modules/@massimo-cassandro/minimo')
 
   ,usePurgeCss = true // false per disattivare PurgeCSS (debug rapido di problemi legati al purge)
+  ,purgeCssInDev = false
   ,purgeCSSOptions = {
     keyframes: true, // rimuove i @keyframes non referenziati
     debug: false // true per loggare i selettori rimossi da PurgeCSS a fine build
   }
 
-  // plugin per l'estrazione ottimizzata delle custom properties (vedi
-  // webpack-config-modules/custom-props-purgecss-plugin.mjs): dopo la
-  // minificazione inietta nei css compilati SOLO le definizioni di custom
-  // properties effettivamente usate, prese dal file master. I css del progetto
-  // contengono quindi solo usi `var(--nome)`, mai definizioni (custom-properties.css
-  // NON va importato nelle entry css). Se false il plugin non viene nemmeno
-  // caricato e la gestione delle custom properties resta a carico del progetto
+  /*
+    plugin per l'estrazione ottimizzata delle custom properties (vedi
+    webpack-config-modules/custom-props-purgecss-plugin.mjs): dopo la
+    minificazione inietta nei css compilati SOLO le definizioni di custom
+    properties effettivamente usate, prese dal file master. I css del progetto
+    contengono quindi solo usi `var(--nome)`, mai definizioni (custom-properties.css
+    NON va importato nelle entry css). Se false il plugin non viene nemmeno
+    caricato e la gestione delle custom properties resta a carico del progetto
+  */
   ,useCustomPropsPlugin = true
-  // file master con TUTTE le definizioni di custom properties disponibili
-  // (copiato da minimo da starter-install.sh, generato da `npm run 'build tokens'`)
+
+  /*
+    file master con TUTTE le definizioni di custom properties disponibili
+    (copiato da minimo da starter-install.sh, generato da `npm run 'build tokens'`)
+  */
   ,customPropsFile = path.resolve(__dirname, './app/css/custom-properties.css')
 
   /*
@@ -143,14 +149,15 @@ const isDevelopment = process.env.NODE_ENV === 'development'
   */
   ,standaloneEntries = []
 
-  // PurgeCSS e plugin custom properties lavorano sugli asset css finali:
-  // in dev, con `false`, sono entrambi disattivati (build più veloce, css
-  // iniettato con style-loader; se `useCustomPropsPlugin` è true le definizioni
-  // vengono aggiunte per intero alle entry, vedi `parsedEntries`).
-  // Con `true` (a scopo di test) sono attivi come in produzione (secondo i
-  // rispettivi flag `usePurgeCss` / `useCustomPropsPlugin`) e `inlineCssInDevMode`
-  // viene forzato a false
-  ,purgeCssInDev = false
+  /*
+    PurgeCSS e plugin custom properties lavorano sugli asset css finali:
+    in dev, con `false`, sono entrambi disattivati (build più veloce, css
+    iniettato con style-loader; se `useCustomPropsPlugin` è true le definizioni
+    vengono aggiunte per intero alle entry, vedi `parsedEntries`).
+    Con `purgeCssInDev = true` (a scopo di test) sono attivi come in produzione (secondo i
+    rispettivi flag `usePurgeCss` / `useCustomPropsPlugin`) e `inlineCssInDevMode`
+    viene forzato a false
+  */
   ,runCustomPropsPlugin = useCustomPropsPlugin && (!isDevelopment || purgeCssInDev)
   // ,manifest_shared_seed = {}
 ;

package/package.json

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

package/src/css/grid.css

@@ -2,10 +2,8 @@
 
 .grid {
   --_cols: 1;
-  /* --_min-col-width: calc((100% - calc(var(--_cols) * var(--flex-grid-gap))) / var(--grid-cols));  NB custom prop rimossa */
 
   display: grid;
-  /* grid-template-columns: repeat(var(--_cols), minmax(var(--grid-min-col-width), 1fr)); NB custom prop rimossa */
   grid-template-columns: repeat(var(--_cols), minmax(0, 1fr));
   grid-auto-flow: row;
   gap: var(--flex-grid-gap);
@@ -28,7 +26,7 @@
   @media (--media-large-viewport-up) {
     --_cols: 4;
 
-    /* versione a 3, 4, 5, 6, 8 colonne */
+    /* versione a 2-10 colonne */
     &.grid-2 {
       --_cols: 2;
     }
@@ -44,9 +42,18 @@
     &.grid-6 {
       --_cols: 6;
     }
+    &.grid-7 {
+      --_cols: 6;
+    }
     &.grid-8 {
       --_cols: 8;
     }
+    &.grid-9 {
+      --_cols: 9;
+    }
+    &.grid-10 {
+      --_cols: 10;
+    }
 
     > .span-2 {
       grid-column-end: span 2;
@@ -54,10 +61,15 @@
     > .span-3 {
       grid-column-end: span 3;
     }
-
     > .span-4 {
       grid-column-end: span 4;
     }
+    > .span-5 {
+      grid-column-end: span 5;
+    }
+    > .span-6 {
+      grid-column-end: span 6;
+    }
   } /* end @media */
 
   /* grid items */

package/types/classes.d.ts

@@ -76,12 +76,15 @@ export type MinimoClass =
   | 'gap-0'
   | 'gap-2'
   | 'grid'
+  | 'grid-10'
   | 'grid-2'
   | 'grid-3'
   | 'grid-4'
   | 'grid-5'
   | 'grid-6'
+  | 'grid-7'
   | 'grid-8'
+  | 'grid-9'
   | 'grid-full-row'
   | 'grid-item-last'
   | 'grid-new-row'
@@ -854,6 +857,8 @@ export type MinimoClass =
   | 'span-2'
   | 'span-3'
   | 'span-4'
+  | 'span-5'
+  | 'span-6'
   | 'spinner'
   | 'table'
   | 'table-bordered'