open-index/open-npm huggingface dataset:
npm package: @fatal-insomnia/vue-i18next
Description: i18next integration for Vue
Author: David Luis Wiegandt
Latest version: 0.6.3

# vue-i18next

> Stripped-down version of the package described in <https://panter.github.io/vue-i18next/>

## Introduction

This library is a simple wrapper for [i18next](https://www.i18next.com), simplifying its use in Vue.

## Initialisation

```typescript
import Vue from "vue";
import i18next from "i18next";
import VueI18Next from "@fatal-insomnia/vue-i18next";

Vue.use(VueI18Next);

i18next.init({
    lng: "de",
    resources: { ... }
});

new Vue({ ... });
```

## Usage

Using the `$t` function, which works analogously to the `t` function found in [i18next](https://www.i18next.com/overview/api#t).

```vue
<i18n>
{
    "en": {
        "insurance": "Insurance"
    },
    "de": {
        "insurance": "Versicherung"
    }
}
</i18n>

<template>
    <span>{{ $t('insurance') }}</span>
</template>
```
npm package: @fatbrain/preact-custom-element
Description: web components custom element wrapper for preact components
Author: Jonas Jonsson
Latest version: 0.1.0-rc.2

# @fatbrain/preact-custom-element

Web components custom element wrapper for preact components.

## Example

```ts
import register from '@fatbrain/preact-custom-element'
import { ComponentChildren } from 'preact'
import { useCallback } from 'preact/hooks'

type PersonProps = {
  name: string
  age?: number
  onSay?: (when: Date, message: string) => void
  children: ComponentChildren
}

const Person = ({ age, children, name, onSay }: PersonProps) => {
  const handleClick = useCallback(() => onSay?.(new Date(), 'dumdidum...'), [])
  return <div>
    <ul>
      <li>name: {name ?? <i>no name</i>}</li>
      <li>age: {age ?? <i>no age</i>}</li>
    </ul>
    {children}
    <button type={type} onClick={handleClick}>Say something...<button>
  </div>
}
```

Lets register the `Person` component as a custom element, observing the `age`
and `name` attribute and registering the `onSay` callback as a **custom event**
named `x-say`.

```ts
register(Person, 'x-person', ['age', 'name'], {
  shadow: true,
  events: { onSay: 'x-say' },
})
```

If needed, transform `onSay` arguments for the custom events `details` to some
other value, and also remap attribute `age` to `x-age`

```ts
register(Person, 'x-person', { age: 'x-age', name: 'name' }, {
    shadow: true,
    events: {
      onSay: ['x-say', (when, message) =>
        `${message}, at timestamp ${when.getTime()}`
      ],
    },
  },
)
```

If needed, transform `age` attribute values.

```ts
register(Person, 'x-person', [['age', value => value / 2]], {
  shadow: true,
  events: {
    onSay: 'x-say',
  },
})
```
npm package: @fatchan/gulp-pug
Description: Gulp plugin for compiling Pug templates
Latest version: 4.0.1

# gulp-pug [![Build Status][status-img]][status] ![Dependencies][deps] ![Downloads][downloads]
> Gulp plugin for compiling Pug templates

This Gulp plugin enables you to compile your Pug templates into HTML or JS, with support for template locals, custom Pug filters, AMD wrapping, and others.  Here is a simple example using `gulp-pug`:

```javascript
var pug = require('gulp-pug');

gulp.task('views', function buildHTML() {
  return gulp.src('views/*.pug')
  .pipe(pug({
    // Your options in here.
  }))
});
```

## API

### `pug([opts])`

 - `opts` (`Object`): Any options from [Pug's API][api] in addition to `pug`'s own options.
 - `opts.locals` (`Object`): Locals to compile the Pug with. You can also provide locals through the `data` field of the file object, e.g. with [`gulp-data`][gulp-data]. They will be merged with `opts.locals`.
 - `opts.data` (`Object`): Same as `opts.locals`.
 - `opts.client` (`Boolean`): Compile Pug to JavaScript code.
 - `opts.pug`: A custom instance of Pug for `gulp-pug` to use.
 - `opts.verbose`: display name of file from stream that is being compiled.
 
To change `opts.filename` use [`gulp-rename`][gulp-rename] before `gulp-pug`.

Returns a stream that compiles Vinyl files as Pug.

## Also See

 - [`pug`][pug]
 - [`gulp-data`][gulp-data]: Using locals in your Pug templates easier.
 - [`gulp-rename`][gulp-rename]: Change `opts.filename` passed into Pug.
 - [`gulp-wrap-amd`][gulp-wrap-amd]: Wrap your Pug in an AMD wrapper.
 - [`gulp-frontmatter-wrangler`][gulp-frontmatter-wrangler]: Useful if you need YAML frontmatter at the top of your Pug file.

## Thanks

 - Many thanks to [Blaine Bublitz][phated] for the original `gulp-jade` plugin.

## LICENSE

[MIT][license] &copy; Jamen Marzonie

[status]: https://travis-ci.org/gulp-community/gulp-pug
[status-img]: https://travis-ci.org/gulp-community/gulp-pug.png?branch=master
[deps]: https://david-dm.org/gulp-community/gulp-pug.svg
[downloads]: https://img.shields.io/npm/dm/gulp-pug.svg
[pug]: http://github.com/gulp-community/pug
[api]: https://pugjs.org/api/reference.html
[gulp-data]: https://npmjs.com/gulp-data
[gulp-rename]: https://npmjs.com/gulp-rename
[gulp-wrap-amd]: https://github.com/phated/gulp-wrap-amd
[gulp-frontmatter-wrangler]: https://github.com/DougBeney/gulp-frontmatter-wrangler
[phated]: https://github.com/phated
[license]: LICENSE