be-intl (🌐)

Format numbers, dates automatically and semantically.

<data value=123456.789 lang="de-DE" be-intl='{ "style": "currency", "currency": "EUR" }'></data>

emits

<data value=123456.789 lang="de-DE" be-intl='{ "style": "currency", "currency": "EUR" }'>123.456,79 €</data>

The output element provides identical support.

<time lang="ar-EG" datetime=2011-11-18T14:54:39.929Z be-intl='{ "weekday": "long", "year": "numeric", "month": "long", "day": "numeric" }'></time>

emits

<time lang="ar-EG" datetime="2011-11-18T14:54:39.929Z" be-intl="{ &quot;weekday&quot;: &quot;long&quot;, &quot;year&quot;: &quot;numeric&quot;, &quot;month&quot;: &quot;long&quot;, &quot;day&quot;: &quot;numeric&quot; }">الجمعة، ١٨ نوفمبر ٢٠١١</time>

We can also employ more semantic syntax:

<data value=123456.789 lang="de-DE" be-intl-style=currency be-intl-currency=EUR></data>

Alternative names

The semantic example above involves a lot of keyboard tapping of the letters "be-intl". To avoid blisters on your itty bitty fingers, we provide an alternative base attribute you can use:

<time lang="ar-EG" datetime="2011-11-18T14:54:39.929Z"
🌐-weekday=long 🌐-year=numeric 🌐-month=long 🌐-day=numeric></time>

Viewing Locally

Any web server than can serve static files will do, but...

1. Install git.
2. Fork/clone this repo.
3. Install node.
4. Open command window to folder where you cloned this repo.

5. npm install

6. npm run serve

7. Open http://localhost:3030/demo in a modern browser.

Importing in ES Modules:

import 'be-intl/be-intl.js';

Using from CDN:

<script type=module crossorigin=anonymous>
    import 'https://esm.run/be-intl';
</script>