@db-ux/core-components 3.0.0 → 3.0.2

package/build/assets/fonts/generate-eu-fonts.ts

@@ -1,5 +1,5 @@
 import { glob } from 'glob';
-import { exec } from 'node:child_process';
+import { execFile } from 'node:child_process';
 import { promisify } from 'node:util';
 
 import { dirname } from 'path';
@@ -8,12 +8,16 @@ import { fileURLToPath } from 'url';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename).replaceAll('\\', '/');
 
-const execAsync = promisify(exec);
+// Security: Using execFile instead of exec to eliminate shell injection risks
+// execFile directly executes the binary without involving a shell
+const execFileAsync = promisify(execFile);
 
 const generateFonts = async () => {
 	console.log('Generating EU fonts...');
 	try {
-		await execAsync('pyftsubset --help');
+		// Security: Using array arguments instead of concatenated string
+		// This prevents shell interpretation of special characters
+		await execFileAsync('pyftsubset', ['--help']);
 	} catch (e) {
 		console.warn(
 			'You need to install pyftsubset. Check packages/foundations/assets/fonts/README.md for more information.'
@@ -22,19 +26,28 @@ const generateFonts = async () => {
 
 	try {
 		const files = await glob(`${__dirname}/*.ttf`);
-		const commands = files.map((file) =>
-			[
-				'pyftsubset',
+
+		for (const file of files) {
+			// Security: Validate that the file is within the expected directory
+			// and has the expected extension to prevent path traversal attacks
+			if (!file.startsWith(__dirname) || !file.endsWith('.ttf')) {
+				console.warn(`Skipping potentially unsafe file path: ${file}`);
+				continue;
+			}
+
+			// Security: Arguments are passed as separate array elements
+			// No shell concatenation means no risk of command injection
+			const args = [
 				file,
 				'--layout-features=*',
 				'--flavor=woff2',
 				`--unicodes-file=${__dirname}/unicode-eu.txt`,
 				`--output-file=${file.replace('.ttf', '-EU.woff2')}`
-			].join(' ')
-		);
+			];
 
-		for (const command of commands) {
-			const { stdout, stderr } = await execAsync(command);
+			// Security: execFile provides better performance and type safety
+			// as it doesn't spawn a shell process
+			const { stdout, stderr } = await execFileAsync('pyftsubset', args);
 			if (stdout) console.log(`stdout: ${stdout}`);
 			if (stderr) console.error(`stderr: ${stderr}`);
 		}

package/build/components/custom-select/custom-select.css

@@ -1094,14 +1094,11 @@ summary[aria-disabled=true]) {
   text-overflow: ellipsis;
 }
 .db-custom-select [id$=-placeholder] {
-  display: none;
-  margin-inline-end: calc(var(--db-icon-font-size) + var(--db-spacing-fixed-sm));
-}
-.db-custom-select:has(.db-custom-select-form-field:empty), .db-custom-select:has(.db-custom-select-form-field > :empty) {
   --db-form-component-padding-inline-end: calc(var(--db-icon-font-size) + var(--db-spacing-fixed-sm) + var(--db-spacing-fixed-xs));
+  margin-inline-end: calc(var(--db-icon-font-size) + var(--db-spacing-fixed-sm));
 }
-.db-custom-select:has(.db-custom-select-form-field:empty) [id$=-placeholder], .db-custom-select:has(.db-custom-select-form-field > :empty) [id$=-placeholder] {
-  display: block;
+.db-custom-select:has(summary span) [id$=-placeholder] {
+  display: none;
 }
 .db-custom-select > db-button > .db-button[data-icon=cross][data-variant=ghost],
 .db-custom-select > .db-button[data-icon=cross][data-variant=ghost] {

package/build/components/custom-select/custom-select.scss

@@ -43,19 +43,17 @@
 	@include form-components.set-default-form-component(summary);
 
 	[id$="-placeholder"] {
-		display: none;
+		--db-form-component-padding-inline-end: #{select-components.$select-icon-padding};
+
 		margin-inline-end: calc(
 			#{form-components.$font-size-height} +
 				#{variables.$db-spacing-fixed-sm}
 		);
 	}
 
-	&:has(.db-custom-select-form-field:empty),
-	&:has(.db-custom-select-form-field > :empty) {
-		--db-form-component-padding-inline-end: #{select-components.$select-icon-padding};
-
+	&:has(summary span) {
 		[id$="-placeholder"] {
-			display: block;
+			display: none;
 		}
 	}