open-index/open-npm huggingface dataset:
npm package: @kiwicom/universal-components
Description: Component Library for React Native, Expo and React applications
Author: kiwi.com
Latest version: 0.0.17
Deprecated: Not maintained

# Universal Components

Component library compatible with Expo/React Native projects as well as React applications.

Relies on [react-native-web](https://github.com/necolas/react-native-web) to port components, written with a React Native first approach, to the web.

[📘 Storybook](https://kiwicom-universal-components.netlify.com) |
[📚 Documentation](https://kiwicom-universal-components-docs.netlify.com)

## Usage

```bash
yarn install @kiwicom/universal-components
# Only for React Native
react-native link @kiwicom/universal-components
```

### In Expo projects

Since `react-native link` is not available in Expo, we need to load the fonts at the root of the application. Your `App.js` should look like

```javascript
import React from "react";
import { View } from "react-native";
import { Icon, Text, PageLoader } from "@kiwicom/universal-components";
import { Font } from "expo";
import OrbitIcons from "@kiwicom/universal-components/lib/fonts/orbit-icons.ttf";
import Roboto from "@kiwicom/universal-components/lib/fonts/Roboto/Roboto-Regular.ttf";
import RobotoItalic from '@kiwicom/universal-components/lib/fonts/Roboto/Roboto-Italic.ttf';
import RobotoBold from '@kiwicom/universal-components/lib/fonts/Roboto/Roboto-Bold.ttf';
import RobotoBoldItalic from '@kiwicom/universal-components/lib/fonts/Roboto/Roboto-BoldItalic.ttf';

export default class App extends React.Component {
  state = {
    fontLoaded: false
  };

  componentDidMount() {
    Font.loadAsync({
      "orbit-icons": OrbitIcons,
      Roboto,
      RobotoItalic,
      RobotoBold,
      RobotoBoldItalic,
    }).then(() => {
      this.setState({ fontLoaded: true });
    });
  }

  render() {
    return this.state.fontLoaded ? (
      <View>
        <Text>Open up App.js to start working on your app!</Text>
        <Icon name="calendar" />
      </View>
    ) : (
      <PageLoader />
    );
  }
}
```

For more information, consult the documentation on [expo.io](https://docs.expo.io/versions/latest/guides/using-custom-fonts).

Note: For web projects, you need to ensure you support the `.web.js` extension. [create-react-app](https://github.com/facebook/create-react-app/blob/6364bbf6dc8244508398f934d0882f05e0cb5dcc/packages/react-scripts/config/paths.js#L52) already supports it by default.

# Contributing

See [CONTRIBUTING.md](https://github.com/kiwicom/universal-components/blob/master/CONTRIBUTING.md)

Repository: <https://github.com/kiwicom/universal-components>

Forward your suggestions, issues and bugs [here](https://github.com/kiwicom/universal-components/issues).
npm package: @kiwicom/webpack
Description: The official Kiwi.com Webpack config.
Author: oreqizer
Latest version: 0.3.4

# @kiwicom/webpack

The official **Kiwi.com** Webpack config.

## Setup

`webpack.config.js`

```js
const kiwicom = require("@kiwicom/webpack");
const { merge } = require("webpack-merge");

module.exports = (e, argv) => {
  const cfg = kiwicom(e, argv);

  const production = argv.mode === "production";

  const base = {
    entry: {
      // your entrypoints
    },
    output: {
      // your output
    },
  };

  if (production) {
    return merge(cfg, base, {
      // ...production
    });
  }

  return merge(cfg, base, {
    // ...dev
  });
};
```

`package.json`

```json
{
  "scripts": {
    "webpack": "webpack --mode production",
    "webpack:dev": "webpack serve --mode development",
    "webpack:stats": "webpack --mode production --json > stats.json"
  }
}
```

## License

MIT
npm package: @kiwidb/api-wrapper
Description: An api wrapper for KiwiDB
Author: BRA1L0R
Latest version: 1.1.0

# Kiwi API wrapper

![](https://img.shields.io/github/last-commit/Kiwi-DB/api-wrapper?color=green&label=Last%20commit&style=flat-square)

```ts
const kiwi = new KiwiDB("http://api.kiwidb.io/", "APITOKEN");

kiwi.get("Key").then(res => {
    console.log(res.value)
})
```

## Installation
With NPM: 
```
npm install @kiwidb/api-wrapper
```

With yarn: 
```
yarn add @kiwidb/api-wrapper
```

## Usage
### Instancing KiwiDB
```ts
// url: The api url of the kiwi rest api
// token: the personal token used for accessing the database
const db = new KiwiDB(url, token)
```

### KiwiDB.get(key)
```ts
// Use this method to get a value from the database
// key: key of the value you want to get
db.get(key).then(res => console.log(res.value))
```
`console.log(res.value)` will return the value of the key

### KiwiDB.set(key, value)
```ts
// Use this method to set a value in the database
// key: the key you want to set
// value: the value you want to set the key to
db.set(key, value).then(res => console.log(res.status))
```
`console.log(res.status)` should return a status code 2XX, if not then the key already exists / something bad happened

### KiwiDB.delete(key)
```ts
// Use this method to delete a value from the database
db.delete('The key you want to delete').then(res => console.log(res.status))
```
As before, if a value != than 2XX is returned from `console.log` the key probably doesn't exist
npm package: @kiwigrid/kiwi-atoms
Description: Common Components for Kiwigrid Apps
Latest version: 0.9.1

# Kiwi-Atoms

This package is a conglomeration of web components built with stencil which wrap some of our library.bootstrap "css components".

## Setup & Running

To setup and run this package run

```bash
npm install
npm run start
```

which installs all dependencies and runs development servers for stencil and storybook.

You can also run stencil and storybook in separate terminal instances with the commands

```bash
npm run start:stencil
npm run start:storybook
```

Storybook is a presentation ui and developing tool to easily test and manage web components.

### More themes for the theme switcher

Out of the box the themeswitcher only knows about our kiwigrid theme.
To let it know about other variants create a file named `local-themes.json` in the `.storybook` folder.

This file has to contain an array of objects and can look like this:

```json
[{ "value": "kiwigrid", "title": "Kiwigrid" }]
```
npm package: @kiwigrid/kiwi-navigation-shell
Description: SPA routing for decoupled web components
Latest version: 0.4.0

# Navigation Shell

![Built With Stencil](https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=for-the-badge)

When composing web components into an existing app, navigating between decoupled components or between components and existing parts of the existing app can become a problem. If the component deals with navigating by itself it would be tight to the composing apps navigation structure and therefore not reusable by other apps with a different navigation structure.

The navigation shell tries to solve this problem by delegating the configuration of routes and the execution of the actual navigation operation to the composing app. The only contract between the components and the composing app is a unique key (the `routeKey`) and the data (`routeData`) needed to perform a navigation. The `routeKey` identifies a single route configuration and is used to refer to that route from within a component.

## Using this component

The main building block is the `<kiwi-navigation-shell />`. It holds the route configuration. The `<kiwi-shell-link />` is used to turn the configuration identified by a `routeKey` into an actual link.

See:

* [kiwi-navigation-shell](./src/components/kiwi-navigation-shell/readme.md)
* [kiwi-shell-link](./src/components/kiwi-shell-link/readme.md)

## Development

```bash
npm install
npm start
```

To build the component for production, run:

```bash
npm run build
```

To run the unit tests for the components, run:

```bash
npm test
```

Need help? Check out stencil docs [here](https://stenciljs.com/docs/my-first-component).
npm package: @kiwigrid/ngx-daterangepicker
Description: Angular Datepicker
Latest version: 1.1.0

## Angular DateRange Picker

This date range picker based on https://github.com/jkuri/ng-daterangepicker.

Supported Angular versions:

| version | angular version |
| ------- | --------------- |
| 1.x     | 9.x             |
| 0.6.x   | 5.x+            |

### Installation

```sh
npm install @kiwigrid/ngx-daterangepicker --save
```

or

```sh
yarn add @kiwigrid/ngx-daterangepicker --save
```

### Example

```ts
import { NgxDateRangePickerModule } from '@kiwigrid/ngx-daterangepicker';

// app.module.ts
@NgModule({
  ...
  imports: [ ..., NgxDateRangePickerModule, ... ],
  ...
})
export class AppModule { }
```

```ts
// app.component.ts
import { Component, OnInit } from '@angular/core';
import {
  NgxDateRangePickerOptions,
  NgxDateRangePickerOutput,
} from '@kiwigrid/ngx-daterangepicker';

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
})
export class AppComponent {
  value: NgxDateRangePickerOutput;
  options: NgxDateRangePickerOptions;

  ngOnInit() {
    this.options = {
      theme: 'default',
      range: 'TM',
      dayNames: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
      presetNames: [
        'Today',
        'This Week',
        'Last 7 Days',
        'Last Week',
        'This Month',
        'Last Month',
        'This Year',
        'Last Year',
        'Start',
        'End',
        'Apply',
        'Cancel',
      ],
      dateFormat: 'yMd',
      startOfWeek: 1,
      position: 'right',
    };
    this.value = {
      from: 0,
      to: 0,
    };
  }
}
```

```html
<!-- app.component.html -->
<ngx-daterangepicker
  [(ngModel)]="value"
  [options]="options"
></ngx-daterangepicker>
```

### Configuration

```ts
export interface NgxDateRangePickerOptions {
  theme: 'default' | 'green' | 'teal' | 'cyan' | 'grape' | 'red' | 'gray';
  range: 'TD' | 'TM' | 'LM' | 'LW' | 'TW' | 'TY' | 'LY' | 'L7D';
  dayNames: string[];
  presetNames: string[];
  dateFormat: string;
  startOfWeek: number;
  position: string;
}
```

### Running the demo

```sh
git clone https://github.com/kiwigrid/ngx-daterangepicker.git
cd ngx-daterangepicker
npm install
npm start
```

### Licence

MIT
npm package: @kiwik/cz-custom-kiwik
Description: cz adapter for kiwik
Author: kiwik-clanaid
Latest version: 0.2.3

## cz-custom-kiwik
Kiwik [Commitizen](https://github.com/commitizen/cz-cli) 提交信息适配器

* 全中文提示
* 支持lerna结构，读取子包名，提供scope
* 允许跳过Drone触发
* 预览提交信息

### 使用

安装
```bash
npm i @kiwiot/cz-custom-kiwik --save-dev
yarn add @kiwiot/cz-custom-kiwik -D
```

在项目`package.json`文件中添加`config`字段
```json
{
    "config": {
    "commitizen": {
      "path": "./node_modules/@kiwiot/cz-custom-kiwik"
    }
  }
}
```
npm package: @kiwik/kstrict
Description: A collection A collection of configurations containing the kiwik front-end lint tool
Author: kiwik-clanaid
Latest version: 0.2.3

# `@kiwik/kstrict`

Kiwik前端lint工具统一配置集合

当前包含：eslint、prettier、stylelint

## Usage

#### 安装

```
yarn add @kiwik/kstrict -D
npm i @kiwik/kstrict --save-dev
```

#### in `.eslintrc.js`

```js
module.exports = {
  extends: [require.resolve('@kiwik/kstrict/dist/eslint')],

  rules: {
    // your rules
  },
};
```

#### in `.prettierrc.js`

```js
const { prettier } = require('@kiwik/kstrict');

module.exports = {
  ...prettier,
};
```

#### in `.stylelintrc.js`

```js
module.exports = {
  extends: [require.resolve('@kiwik/kstrict/dist/stylelint')],
  rules: {
    // your rules
  },
};
```

### Thanks

* [`fabric`](https://github.com/umijs/fabric)
* [`AntM`](https://github.com/AntmJS/antm)