input-behavior-chile

Format RUT, CLP currency, and +56 phone numbers in React/Next.js forms.

Updated Nov 25, 2025
One-click install
npx skills add https://github.com/filimorniga-ux/farmacias-vallenar-suit --skill input-behavior-chile
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: input-behavior-chile
Source: https://github.com/filimorniga-ux/farmacias-vallenar-suit/tree/main/.agent/skills/input-behavior-chile
Command: npx skills add https://github.com/filimorniga-ux/farmacias-vallenar-suit --skill input-behavior-chile

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Prevents blocked numeric inputs and inconsistent local formats by enforcing Chilean input behaviors across forms and POS flows, so users can edit freely while the app preserves valid, storage-ready values.

Core Features & Use Cases

  • Fluid Editing for Numeric Inputs: Maintain internal state as string|number, allow empty-string during typing, and apply validation/formatting only on blur or submit to avoid "input locked" behaviour in React/Next.js.
  • RUT Formatting and Validation: Auto-punctuate RUT/Run/DNI fields to the pattern XX.XXX.XXX-Y and validate the check digit using modulo-11 to ensure correct tax IDs on customer profiles and invoicing.
  • CLP Currency Display & Persistence: Show Chilean pesos with thousand separators using Intl.NumberFormat('es-CL') while storing raw integers (e.g., 10000) in state or DB; ideal for price fields in POS and cart.
  • +56 Phone Normalization: Auto-prepend +56/+569 when appropriate, normalize to E.164 on save, and remove spaces/symbols for consistent contact storage.

Quick Start

Apply the input-behavior-chile conventions to a React form to auto-format RUT, display CLP with thousand separators, normalize Chilean phone numbers to E.164, and allow fluid numeric edits that validate on blur.

Frequently Asked Questions about input-behavior-chile

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I format and validate a Chilean RUT in a React form?

To format a Chilean RUT in React, auto-punctuate the input to the XX.XXX.XXX-Y pattern and validate the check digit using modulo-11 to ensure correct tax IDs on blur or submit.

Why does my React numeric input get blocked when formatting CLP currency?

Numeric inputs get blocked in React when formatting logic restricts intermediate states. Maintain internal state as string or number, allow empty-string during typing, and apply CLP formatting only on blur or submit.

What's the best way to store Chilean pesos (CLP) from a POS cart in the database?

Display CLP with thousand separators using Intl.NumberFormat('es-CL') in the UI, but store raw integers like 10000 in state or DB to ensure clean financial data for POS and cart operations.

How do I normalize Chilean phone numbers to E.164 on submit?

Normalize Chilean phone numbers to E.164 by auto-prepending +56 or +569 when appropriate, removing spaces and symbols on save to ensure consistent contact storage across your application.

Can I use lazy validation for RUT and phone fields in Next.js?

Yes, you can apply lazy validation for RUT and phone fields in Next.js by deferring format checks and modulo-11 validation to blur or submit events, allowing fluid intermediate edits without blocking the user.