open-index/open-npm huggingface dataset:
npm package: @peteretelej/vuepress-plugin-fulltext-search
Description: Vuepress2 full-text search plugin
Author: Peter Etelej
Latest version: 0.0.3

# vuepress-plugin-fulltext-search

Vuepress2 full-text search plugin using [FlexSearch](https://github.com/nextapps-de/flexsearch).

:warning: This is under development. Please use other plugins instead.


Usage

``` sh
yarn add -D @peteretelej/vuepress-plugin-fulltext-search
```

Add plugin to `docs/.vuepress/config.js`
``` js
module.exports = {
    plugins: ['@peteretelej/fulltext-search'],
}
```
npm package: @peterindiola/singtel-ui
Description: ### A very customizable table component.
Author: Peter Indiola
Latest version: 1.0.1

# Table Component

### A very customizable table component.

## Features

- Dynamic data source
- Dynamic table header
- Sorting
- Responsive

## Demo

[StoryBook](https://pindiola-ui-table.netlify.app/)

## Usage

```js
let nameOrder = false;
const columns = [
  {
    title: 'Name',
    key: 'name',
    dataIndex: 'name',
    sorter: (a, b) => {
      if (order) {
        if (a.name.split(' ')[1] > b.name.split(' ')[1]) return 1;
        else return -1;
      } else {
        if (a.name.split(' ')[1] > b.name.split(' ')[1]) return -1;
        else return 1;
      }
    },
  },
  {
    title: 'Mobile',
    key: 'mobile',
    dataIndex: 'mobile',
  },
  {
    title: 'Expiry',
    key: 'expiry',
    dataIndex: 'expiry',
  },
  {
    title: 'Penalty',
    key: 'penalty',
    dataIndex: 'penalty',
  },
];

const dataSource = [
  {
    id: 1,
    name: 'Mavis Chen',
    mobile: '8899 7654',
    expiry: 'Dec 2022',
    penalty: '$600',
  },
  {
    id: 2,
    name: 'Rodney Artichoke',
    mobile: '9988 7676',
    expiry: 'Dec 2022',
    penalty: '$300',
  },
  {
    id: 3,
    name: 'Valentino Morose',
    mobile: '8900 7654',
    expiry: 'Dec 2022',
    penalty: '$300',
  },
  {
    id: 4,
    name: 'Eric Widget',
    mobile: '8900 7654',
    expiry: 'Dec 2022',
    penalty: '$300',
  },
];

<Table columns={columns} dataSource={dataSource}>
```

## Theming

Customize the theme by passing a theme object props

```js
const theme = {
  colors: {
    primary: '#5C50BB',
    light: '#EFEDFD',
  },
  fontFamily: 'Avenir LT Std, sans-serif, Roboto',
};

<Table columns={columns} dataSource={dataSource} theme={theme}>
```
npm package: @peterkmoss/flowchart-vue
Description: Flowchart & Flowchart designer component for Vue.js.
Latest version: 0.21.4

# Flowchart

Flowchart & Flowchart designer component for Vue.js.

[![NPM](https://img.shields.io/npm/v/@peterkmoss/flowchart-vue)](https://www.npmjs.com/package/@peterkmoss/flowchart-vue)

This is a fork of [joyceworks/flowchart-vue](https://github.com/joyceworks/flowchart-vue) which focuses on scalability and extendability of the code base.

## Usage

```shell script
npm i @peterkmoss/flowchart-vue
```

```vue
<template>
    <div id="app">
      <button @click="addStart">Add Start</button>
      <button @click="addEnd">Add End</button>
      <button @click="addOperation">Add Operation</button>
      <button @click="addDecision">Add Decision</button>
      <button @click="$refs.chart.remove()">Delete(Del)</button>
      <button @click="$refs.chart.editCurrent()"> Edit(Double-click node)</button>
      <button @click="$refs.chart.save()">Save</button>
      <flowchart 
        :nodes="nodes"
        :connections="connections" 
        @editnode="handleEditNode"
        @editconnection="handleEditConnection" 
        @save="handleChartSave" 
        ref="chart"
      />
    </div>
</template>
<script>
  import Flowchart, {
    Nodes, Connections,
  } from '@peterkmoss/flowchart-vue';

  export default {
    name: 'App',
    components: {
      Flowchart,
    },
    data() {
      return {
        nodes: [
          new Nodes.StartNode(1, 100, 220),
          new Nodes.OperationNode(2, 250, 220, "Op"),
          new Nodes.DesicionNode(3, 400, 220, "De"),
          new Nodes.EndNode(4, 550, 220),
        ],
        connections: [
          new Connections.ArrowConnection(
            1, 
            { id: 1, position: "right" }, 
            { id: 2, position: "left" }
          )
        ],
      };
    },
    methods: {
      addEnd() {
        this.add(100, 100, Nodes.EndNode);
      },
      addStart() {
        this.add(100, 100, Nodes.StartNode);
      },
      addDecision() {
        this.add(100, 100, Nodes.DesicionNode);
      },
      addOperation() {
        this.add(100, 100, Nodes.OperationNode);
      },
      add(x, y, cls) {
        this.$refs.chart.add(new cls(+new Date(), x, y, "New"))
      },
      handleChartSave(nodes, connections) {
        // E.g. save to database
      },
      handleEditNode(node) {
        // E.g. open a dialog to change properties on the node
      },
      handleEditConnection(connection) {
        // E.g. open a dialog to change properties on the connection
      },
    }
  };
</script>
```

## Demo

- Development Environment

  ``` shell
  git clone https://github.com/Peterkmoss/flowchart-vue.git
  cd flowchart-vue
  yarn install # or npm install
  yarn run serve # or npm run serve
  ```
  
  Then open http://localhost:8080/ (or other assigned port) in browser.

## API - TODO for this fork

See joyceworks' [Wiki](https://github.com/joyceworks/flowchart-vue/wiki).