Директивы форматирования и математики в JSON-спеках

★ 8.1 · vibe-coding

@json-render/directives Rendering Directives is a Claude Code skill that wires a suite of pre-built directives from the @json-render/directives package into json-render specs, covering formatting, arithmetic, string manipulation, and i18n without hand-written helper code. Reach for it when you need to display a state value as a formatted currency or relative date directly in a JSON spec, count array items, concatenate fields from different state paths, render correct singular/plural labels, or support multiple UI languages through a $t translation key with interpolation. The package ships $format (Intl-backed: currency, date, number, percent, relative dates), $math (add, subtract, multiply, divide, mod, min, max, round, floor, ceil, abs), $concat, $count, $truncate, $pluralize, $join, and the createI18nDirective factory; custom directives are defined with defineDirective from @json-render/core using a Zod schema. Written in TypeScript, it plugs into any of the four official renderers — React, Vue, Svelte, Solid — via the directives prop on the provider or createRenderer, and into prompt generation via catalog.prompt({ directives }). Directives compose naturally because each resolver calls resolvePropValue on its inputs, so $format can wrap $math wrapping $state. The skill enriches JSON render specs with data-transformation logic — it is not a standalone renderer.