directives

Implement reusable custom directives for json-render to standardize formatting, math, and i18n.

1|Updated Jun 19, 2026
One-click install
npx skills add https://github.com/pch007/json-render --skill directives-pch007
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: directives
Source: https://github.com/pch007/json-render/tree/main/skills/directives
Command: npx skills add https://github.com/pch007/json-render --skill directives-pch007

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Pre-built custom directives for json-render provide a library of reusable, well-documented operations (formatting, arithmetic, string manipulation, and internationalization) that accelerate building consistent UIs and data transformations.

Core Features & Use Cases

  • A suite of built-in directives: $format, $math, $concat, $count, $truncate, $pluralize, $join, plus an i18n directive factory createI18nDirective for localization.
  • Easy composition and safety: directives wrap other expressions and resolve sub-values, enabling complex transformations while keeping specs readable and deterministic.
  • Real-world use: format dates and currencies in UI specs, compute derived values, and generate locale-aware strings for multilingual apps.

Quick Start

Import the directives and wire them into your registry and provider to start using them in your specs.

Frequently Asked Questions about directives

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

FAQPage Schema
What are custom directives for JSON rendering and when do I need them?

The directives library includes $format, $math, $concat, $count, $truncate, $pluralize, and $join for formatting and arithmetic, plus a createI18nDirective factory for generating locale-aware strings in multilingual TypeScript applications.

How do I implement custom directives for JSON rendering in TypeScript?

Import the pre-built directives and wire them into your registry and provider. This allows you to compose canonical directives with built-in expressions to resolve sub-values predictably within your component catalogs and spec-driven renderers.

Can I use these JSON rendering directives for internationalization in TypeScript?

Yes, the directives library provides an i18n directive factory called createI18nDirective. It enables you to generate locale-aware strings and standardize internationalization across multilingual applications and spec-driven rendering outputs.

How do JSON rendering directives handle complex data transformations safely?

Directives wrap other expressions and resolve sub-values deterministically, enabling complex transformations while keeping specs readable. This composition mechanism enforces safe usage by resolving inputs predictably across formatting and arithmetic operations.

Does the directives library require any external dependencies to function?

No, the directives library operates with zero external dependencies. It provides standalone pre-built operations for formatting, arithmetic, string manipulation, and internationalization that you can directly wire into your TypeScript registry.

What is the best way to standardize formatting and math operations across UI specs?

Use a library of pre-built custom directives for json-render to standardize formatting and math across specs. Canonical directives like $format and $math ensure deterministic resolution and consistent outputs across component catalogs and renderers.