postcss-normalize-display-values (#1759)

Author: romainmenke

plugins/postcss-normalize-display-values/CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changes to PostCSS Normalize Display Values
 
+### Unreleased (patch)
+
+- Add `inline block` support
+
 ### 4.0.0
 
 _August 3, 2024_

plugins/postcss-normalize-display-values/dist/index.cjs

@@ -1 +1 @@
-"use strict";var e=require("postcss-value-parser"),l=new Map([["block,flex","flex"],["block,flow","block"],["block,flow-root","flow-root"],["block,grid","grid"],["block,table","table"],["inline,flex","inline-flex"],["inline,flow","inline"],["inline,flow,list-item","inline list-item"],["inline,flow-root","inline-block"],["inline,grid","inline-grid"],["inline,ruby","ruby"],["inline,table","inline-table"],["list-item,block,flow","list-item"],["ruby-base,flow","ruby-base"],["ruby-text,flow","ruby-text"],["run-in,flow","run-in"],["table-caption,flow","table-caption"],["table-cell,flow","table-cell"]]);function transform(n){if(!n.trim())return n;const{nodes:i}=e(n);if(i.length<=1)return n;const t=i.filter(e=>"word"===e.type).map(e=>e.value.toLowerCase());if(t.length<=1)return n;const o=l.get(t.join(","));return o||n}const n=/^display$/i,creator=e=>{const l=!("preserve"in Object(e))||Boolean(e?.preserve);return{postcssPlugin:"postcss-normalize-display-values",Declaration(e){if(!n.test(e.prop))return;const i=e.value;if(!i)return;const t=transform(i);e.value!==t&&(e.cloneBefore({value:t}),l||e.remove())}}};creator.postcss=!0,module.exports=creator;
+"use strict";var e=require("postcss-value-parser"),l=new Map([["block,flex","flex"],["block,flow","block"],["block,flow-root","flow-root"],["block,grid","grid"],["block,table","table"],["inline,block","inline-block"],["inline,flex","inline-flex"],["inline,flow","inline"],["inline,flow,list-item","inline list-item"],["inline,flow-root","inline-block"],["inline,grid","inline-grid"],["inline,ruby","ruby"],["inline,table","inline-table"],["list-item,block,flow","list-item"],["ruby-base,flow","ruby-base"],["ruby-text,flow","ruby-text"],["run-in,flow","run-in"],["table-caption,flow","table-caption"],["table-cell,flow","table-cell"]]);function transform(n){if(!n.trim())return n;const{nodes:i}=e(n);if(i.length<=1)return n;const t=i.filter(e=>"word"===e.type).map(e=>e.value.toLowerCase());if(t.length<=1)return n;const o=l.get(t.join(","));return o||n}const n=/^display$/i,i=/\b\s\b/,creator=e=>{const l=!("preserve"in Object(e))||Boolean(e?.preserve);return{postcssPlugin:"postcss-normalize-display-values",Declaration(e){if(!n.test(e.prop))return;const t=e.value;if(!t)return;if(!i.test(t))return;const o=transform(t);e.value!==o&&(e.cloneBefore({value:o}),l||e.remove())}}};creator.postcss=!0,module.exports=creator;

plugins/postcss-normalize-display-values/dist/index.mjs

@@ -1 +1 @@
-import e from"postcss-value-parser";var l=new Map([["block,flex","flex"],["block,flow","block"],["block,flow-root","flow-root"],["block,grid","grid"],["block,table","table"],["inline,flex","inline-flex"],["inline,flow","inline"],["inline,flow,list-item","inline list-item"],["inline,flow-root","inline-block"],["inline,grid","inline-grid"],["inline,ruby","ruby"],["inline,table","inline-table"],["list-item,block,flow","list-item"],["ruby-base,flow","ruby-base"],["ruby-text,flow","ruby-text"],["run-in,flow","run-in"],["table-caption,flow","table-caption"],["table-cell,flow","table-cell"]]);function transform(n){if(!n.trim())return n;const{nodes:t}=e(n);if(t.length<=1)return n;const i=t.filter(e=>"word"===e.type).map(e=>e.value.toLowerCase());if(i.length<=1)return n;const o=l.get(i.join(","));return o||n}const n=/^display$/i,creator=e=>{const l=!("preserve"in Object(e))||Boolean(e?.preserve);return{postcssPlugin:"postcss-normalize-display-values",Declaration(e){if(!n.test(e.prop))return;const t=e.value;if(!t)return;const i=transform(t);e.value!==i&&(e.cloneBefore({value:i}),l||e.remove())}}};creator.postcss=!0;export{creator as default};
+import e from"postcss-value-parser";var l=new Map([["block,flex","flex"],["block,flow","block"],["block,flow-root","flow-root"],["block,grid","grid"],["block,table","table"],["inline,block","inline-block"],["inline,flex","inline-flex"],["inline,flow","inline"],["inline,flow,list-item","inline list-item"],["inline,flow-root","inline-block"],["inline,grid","inline-grid"],["inline,ruby","ruby"],["inline,table","inline-table"],["list-item,block,flow","list-item"],["ruby-base,flow","ruby-base"],["ruby-text,flow","ruby-text"],["run-in,flow","run-in"],["table-caption,flow","table-caption"],["table-cell,flow","table-cell"]]);function transform(n){if(!n.trim())return n;const{nodes:i}=e(n);if(i.length<=1)return n;const t=i.filter(e=>"word"===e.type).map(e=>e.value.toLowerCase());if(t.length<=1)return n;const o=l.get(t.join(","));return o||n}const n=/^display$/i,i=/\b\s\b/,creator=e=>{const l=!("preserve"in Object(e))||Boolean(e?.preserve);return{postcssPlugin:"postcss-normalize-display-values",Declaration(e){if(!n.test(e.prop))return;const t=e.value;if(!t)return;if(!i.test(t))return;const o=transform(t);e.value!==o&&(e.cloneBefore({value:o}),l||e.remove())}}};creator.postcss=!0;export{creator as default};

plugins/postcss-normalize-display-values/src/index.ts

@@ -32,6 +32,8 @@ function transform(value: string): string {
 
 const IS_DISPLAY_REGEX = /^display$/i;
 
+const IS_MAYBE_MULTI_KEYWORD = /\b\s\b/;
+
 /** postcss-normalize-display-values plugin options */
 export type pluginOptions = {
 	/** Preserve the original notation. default: true */
@@ -53,6 +55,10 @@ const creator: PluginCreator<pluginOptions> = (opts?: pluginOptions) => {
 				return;
 			}
 
+			if (!IS_MAYBE_MULTI_KEYWORD.test(value)) {
+				return;
+			}
+
 			const result = transform(value);
 			if (decl.value === result) {
 				return;

plugins/postcss-normalize-display-values/src/mappings.ts

@@ -7,6 +7,7 @@ export default new Map([
 	['block,flow-root', 'flow-root'],
 	['block,grid', 'grid'],
 	['block,table', 'table'],
+	['inline,block', 'inline-block'],
 	['inline,flex', 'inline-flex'],
 	['inline,flow', 'inline'],
 	['inline,flow,list-item', 'inline list-item'],

plugins/postcss-normalize-display-values/test/basic.css

@@ -34,6 +34,10 @@
 	display: inline flex;
 }
 
+.inline-block {
+	display: inline block;
+}
+
 .block-grid {
 	display: block grid;
 }

plugins/postcss-normalize-display-values/test/basic.expect.css

@@ -43,6 +43,11 @@
 	display: inline flex;
 }
 
+.inline-block {
+	display: inline-block;
+	display: inline block;
+}
+
 .block-grid {
 	display: grid;
 	display: block grid;

plugins/postcss-normalize-display-values/test/basic.preserve-false.expect.css

@@ -34,6 +34,10 @@
 	display: inline-flex;
 }
 
+.inline-block {
+	display: inline-block;
+}
+
 .block-grid {
 	display: grid;
 }