@moni-labs/moni-ui 0.4.8 → 0.4.9

package/src/components/_base/field-styles.ts

@@ -143,6 +143,13 @@ export const fieldStyles = css`
 	.field[class*='round'].extra {
 		border-radius: 2rem;
 	}
+	/* Compact rounding for dense forms without falling back to square corners. */
+	.field.small-round,
+	.field.small-round.small,
+	.field.small-round.large,
+	.field.small-round.extra {
+		border-radius: 0.5rem;
+	}
 
 	/* ─── Icon positioning ───────────────────────────────────────────────────── */
 	/* Generic rule: absolutely positions any icon/image/svg inside the field. */

package/src/components/moni-select.test.ts

@@ -23,6 +23,14 @@ describe('moni-select', () => {
 		expect(input?.getAttribute('readonly')).toBe('');
 	});
 
+	it('aplica la clase small-round para un redondeado compacto', async () => {
+		el.shape = 'small-round';
+		await el.updateComplete;
+		const field = el.shadowRoot?.querySelector('.field');
+		expect(field?.classList.contains('small-round')).toBe(true);
+		expect(field?.classList.contains('square')).toBe(false);
+	});
+
 	it('analiza las opciones insertadas en slots (slotted)', async () => {
 		const opt1 = document.createElement('moni-select-option');
 		opt1.setAttribute('value', 'v1');

package/src/components/moni-select.ts

@@ -146,11 +146,11 @@ export class MoniSelect extends MoniElement {
 
 	/**
 	 * Forma (radio de borde) del campo.
-	 * @type {'round' | 'square' | 'no-round'}
+	 * @type {'round' | 'small-round' | 'square' | 'no-round'}
 	 * @default 'no-round'
 	 */
 	@property({ reflect: true })
-	shape: 'round' | 'square' | 'no-round' = 'no-round';
+	shape: 'round' | 'small-round' | 'square' | 'no-round' = 'no-round';
 
 	/**
 	 * Deshabilita el campo select.
@@ -1694,6 +1694,7 @@ export class MoniSelect extends MoniElement {
 			suffix: true,
 			invalid: this.error,
 			round: this.shape === 'round',
+			'small-round': this.shape === 'small-round',
 			square: this.shape === 'no-round'
 		};
 

package/src/components/moni-text-field.test.ts

@@ -86,6 +86,14 @@ describe('moni-text-field', () => {
 		expect(field?.classList.contains('round')).toBe(true);
 	});
 
+	it('aplica la clase small-round para un redondeado compacto', async () => {
+		el.shape = 'small-round';
+		await el.updateComplete;
+		const field = el.shadowRoot?.querySelector('.field');
+		expect(field?.classList.contains('small-round')).toBe(true);
+		expect(field?.classList.contains('square')).toBe(false);
+	});
+
 	it('renderiza underlined sin fondo, contorno completo ni forma redondeada', async () => {
 		el.variant = 'underlined';
 		el.shape = 'round';

package/src/components/moni-text-field.ts

@@ -106,11 +106,11 @@ export class MoniTextField extends MoniElement {
 
 	/**
 	 * Forma del radio del borde (border-radius) del campo.
-	 * @type {'round' | 'no-round'}
+	 * @type {'round' | 'small-round' | 'no-round'}
 	 * @default 'no-round'
 	 */
 	@property({ reflect: true })
-	shape: 'round' | 'no-round' = 'no-round';
+	shape: 'round' | 'small-round' | 'no-round' = 'no-round';
 
 	/**
 	 * El tipo de input HTML nativo.
@@ -544,6 +544,7 @@ export class MoniTextField extends MoniElement {
 			'suffix-action-field': Boolean(this.suffixButtonIcon) || this._hasSuffixSlot,
 			invalid: this.error,
 			round: this.shape === 'round' && this.variant !== 'underlined',
+			'small-round': this.shape === 'small-round' && this.variant !== 'underlined',
 			square: this.shape === 'no-round'
 		};
 		const placeholder = this.placeholder || (this.label ? ' ' : '');

package/src/components/moni-textarea.test.ts

@@ -97,6 +97,14 @@ describe('moni-textarea', () => {
 		expect(field?.classList.contains('round')).toBe(true);
 	});
 
+	it('aplica la clase small-round para un redondeado compacto', async () => {
+		el.shape = 'small-round';
+		await el.updateComplete;
+		const field = el.shadowRoot?.querySelector('.field');
+		expect(field?.classList.contains('small-round')).toBe(true);
+		expect(field?.classList.contains('square')).toBe(false);
+	});
+
 	it('no aplica la clase de forma (shape) en el contenedor de campo para shape=square', async () => {
 		el.shape = 'square';
 		await el.updateComplete;

package/src/components/moni-textarea.ts

@@ -98,11 +98,11 @@ export class MoniTextarea extends MoniElement {
 
 	/**
 	 * Forma del radio del borde (border-radius) del campo.
-	 * @type {'round' | 'square' | 'no-round'}
+	 * @type {'round' | 'small-round' | 'square' | 'no-round'}
 	 * @default 'no-round'
 	 */
 	@property({ reflect: true })
-	shape: 'round' | 'square' | 'no-round' = 'no-round';
+	shape: 'round' | 'small-round' | 'square' | 'no-round' = 'no-round';
 
 	/**
 	 * Nombre del icono inicial (leading) (Material Symbols).
@@ -364,6 +364,7 @@ export class MoniTextarea extends MoniElement {
 			suffix: hasTrailing,
 			invalid: this.error,
 			round: this.shape === 'round',
+			'small-round': this.shape === 'small-round',
 			square: this.shape === 'no-round'
 		};
 		const placeholder = this.placeholder || (this.label ? ' ' : '');

package/dist/cdn/chunks/if-defined-DlAUOFi9.js

@@ -1 +0,0 @@
-import{c as e}from"./decorate-D4jKxi6H.js";var t=t=>t??e;export{t};