open-index/open-npm huggingface dataset:
npm package: @liedekef/fdatepicker
Description: Modern, lightweight, jQuery-free Lightweight customizable datepicker.
Author: Franky Van Liedekerke
Latest version: 3.0.42

# fDatepicker

## Description

Lightweight customizable cross-browser Vanilla JS datepicker using PHP datetime format strings.

[![Simple datepicker](https://github.com/liedekef/fdatepicker/raw/main/docs/img/simple.png)](https://github.com/liedekef/fdatepicker/)
[![Datepicker with range and time](https://github.com/liedekef/fdatepicker/raw/main/docs/img/rangepicker.png)](https://github.com/liedekef/fdatepicker/)
[![Multiple days and print selected](https://github.com/liedekef/fdatepicker/raw/main/docs/img/multiple.png)](https://github.com/liedekef/fdatepicker/)

## Installation

Use one of the releases on github or download the files [directly](https://github.com/liedekef/fdatepicker/tree/main)

Or use npm:

```bash
npm install @liedekef/fdatepicker
```


## Usage

Include styles and scripts as indicated:

```
<html>
    <head>
        <link href="css/fdatepicker.min.css" rel="stylesheet" type="text/css">
        <script src="js/fdatepicker.min.js"></script>

        <!-- Include English language -->
        <script src="js/i18n/fdatepicker.en.js"></script>
    </head>
</html>
```

## Documentation

Please check the [Github wiki](https://github.com/liedekef/fdatepicker/wiki) for the documentation
npm package: @liedekef/ftable
Description: Modern, lightweight, jQuery-free CRUD table for dynamic AJAX-powered tables.
Author: Franky Van Liedekerke
Latest version: 1.3.8

What is fTable
==============

FTable is a clean, vanilla JavaScript rewrite of the popular `jTable` plugin, designed for modern web apps.

✅ No dependencies  
✅ Dynamic forms & async fields  
✅ Localization  
✅ Responsive  
✅ MIT Licensed  

## Screenshots
[![A screenshot of fTable](https://raw.githubusercontent.com/liedekef/ftable/main/screenshot.png)](https://github.com/liedekef/ftable/)
[![Other screenshot, used in Events Made Easy](https://raw.githubusercontent.com/liedekef/ftable/main/screenshot2.png)](https://github.com/liedekef/ftable/)

FTable is a clean, vanilla JavaScript rewrite of the popular `jTable` plugin, designed for modern web apps.

### Features
✅ Create, Read, Update, Delete  
✅ Sorting, Paging, Filtering  
✅ Dynamic dependent fields  
✅ Ajax loading for data and options  
✅ Localization via JTable.setMessages(...)  
✅ Modal forms  
✅ CSV export, Print  
✅ User preferences (localStorage)  

## Install

Use one of the releases on github or download the files [directly](https://github.com/liedekef/ftable/tree/main)
Or use npm:

```bash
npm install @liedekef/ftable
```

## Usage

As a standalone script:
```JS
<link href="ftable/themes/lightcolor/gray/ftable.css" rel="stylesheet">
<script src="js/ftable/ftable.js"></script>

const table = new FTable('#table', {
  actions: {
    listAction: '/api/users',
    createAction: '/api/users/add',
    updateAction: '/api/users/update',
    deleteAction: '/api/users/delete'
  },
  fields: {
    id: { key: true, list: false },
    name: { title: 'Name' },
    email: { title: 'Email', type: 'email' }
  }
});
```

As a module:
```JS
import '@liedekef/ftable/ftable.css';
import FTable from '@liedekef/ftable';

const table = new FTable('#table', {
  actions: {
    listAction: '/api/users',
    createAction: '/api/users/add',
    updateAction: '/api/users/update',
    deleteAction: '/api/users/delete'
  },
  fields: {
    id: { key: true, list: false },
    name: { title: 'Name' },
    email: { title: 'Email', type: 'email' }
  }
});
```

## Notes
See the wiki for documentation, demos, themes and more...
npm package: @liedekef/jtable
Description: A maintained fork of jtable: a JQuery plugin to create AJAX based CRUD tables.
Author: liedekef
Latest version: 3.1.5

What is jTable
======

[![A screenshot of jTable](https://raw.githubusercontent.com/liedekef/jtable/master/screenshot.png)](https://github.com/liedekef/jtable/)
[![Other screenshot, used in Events Made Easy](https://raw.githubusercontent.com/liedekef/jtable/master/screenshot2.png)](https://github.com/liedekef/jtable/)

jTable is a jQuery plugin used to create AJAX based CRUD tables without coding HTML or Javascript. It has several features including:

* Automatically creates HTML table and loads records from server using AJAX.
* 'Create new record' html5 dialog form. When user creates a record, it sends data to the server using AJAX and adds the same record to the table in the page.
* 'Edit record' html5 dialog form. When user edits a record, it updates the server using AJAX and updates all cells on the table in the page.
* Allow user to 'delete a record' by html5 dialog based confirmation. When user deletes a record, it deletes the record from server using AJAX and deletes the record from the table in the page.
* Shows simple animations (delay) for create/delete/edit operations on the table.
* Supports server side paging and sorting using AJAX.
* Supports master/child tables.
* Allows user to select rows.
* Allows user to resize and show/hide columns.
* Exposes some events to enable validation with forms.
* Can be localized easily.
* All styling of table and forms is defined in a CSS file, so you can easily change the style of everything to use the plugin in your pages. The CSS file is well defined and commented.
* Comes with several pre-defined color themes.
* Not dependent on any server side technology.
* OS independent and works on all common browsers.

Notes
======
See the wiki for documentation, demos, themes and more...
npm package: @liejy/request
Description: [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier) ![GitHub Workflow Status](https://img.shields.io/github/workflow/status/wangkaiwd/typescript-library-template/De
Latest version: 0.0.4

## @liejy/request

[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
![GitHub Workflow Status](https://img.shields.io/github/workflow/status/wangkaiwd/typescript-library-template/Deploy%20to%20GitHub%20pages)
![license](https://img.shields.io/github/license/wangkaiwd/typescript-library-template)

一个基于 Axios 封装的网络请求库

### Usage

```shell
npm install @liejy/request
```

### Feature

- 支持多种拦截方式，触发顺序：

1.  实例拦截
2.  函数调用拦截

- 支持取消单个请求
- 支持取消所有请求

### API

使用 Request 构造器生成实例

#### Request(config)

配置`Request`构造函数，配置项`config`与 `Axios` 基本保持一致。

> 注：v0.0.2 与 v0.0.3 的区别在于 successMap 传递的参数不一致。在 v0.0.2 版本中使用元组，如：['code', 0]来拦截相应状态；在 v0.0.3 版本中由于遇到多种成功状态拦截的场景，因此改用为对象形式，如：{code:0,ret:[0, false]}以作扩展。

```ts
import Request from "@liejy/request";

const request = new Request({
  baseURL: "https://cnodejs.org/",
  successMap: { code: 0 },
  interceptors: {
    // 实例请求拦截
    requestInterceptors: (config) => {
      return config;
    },
    // 实例响应拦截
    responseInterceptors: (result) => {
      return result;
    },
  },
});
```

其中`config`配置新增几项配置

```ts
type codeType =  string | number | boolean
export type SuccessMaps = Record<string, codeType| codeType[]>;
export interface RequestConfig extends AxiosRequestConfig {
  interceptors?: RequestInterceptors;
  successMap?: SuccessMaps /* 默认为不开启成功拦截，不设置则不开启。开启响应态处理，返回成功永远resolve，返回错误永远reject。格式如： {code:0,ret:[0, false]} */;
  canRepeat?: boolean /* 是否同时发送相同请求 */;
}
```

#### request#request(config)

实例请求方法`request#request(config)`，配置项`config`与 `Axios` 保持一致。

```ts
import { RequestConfig } from "@liejy/request";
interface iRequestConfig<T> extends RequestConfig {
  data?: T;
}
interface iResponse<T> {
  code: number;
  message: string;
  data: T;
}
export const http = <D, T = any>(config: iRequestConfig<D>) => {
  const { method = "GET" } = config;
  if (method === "GET" || method === "get") {
    config.params = config.data;
  }
  return request.request<iResponse<T>>(config);
};

http({
  method: "get",
  url: "/api/v1/topics",
  canRepeat: false,
  params: { id: 1 },
  interceptors: {
    // 函数请求拦截器
    requestInterceptors: (config) => {
      return config;
    },
    // 函数响应拦截器
    responseInterceptors: (result) => {
      return result;
    },
  },
});
```

#### request#cancelRequest(url)

取消单个请求。

```ts
export const cancelRequest = (url: string | string[]) => {
  return request.cancelRequest(url);
};
```

#### request#cancelAllRequest()

取消多个请求。

```ts
export const cancelAllRequest = () => {
  return request.cancelAllRequest();
};
```
npm package: @liejy/vue-countup
Description: countup for vue.js. 
Author: liejiayong
Latest version: 0.2.0

# vue-countup

## Feature

- 新增兼容 ie11+

## Usage

### 引入模块

```vue
<template>
    <jcount :start="0" :end="8888">
</template>
<script>
import Vue from 'vue';
import jcount from '@liejy/vue-countup';
Vue.use(jcount);
</script>
```

如果想设置包裹元素样式，可以使用 childEle 来设置数字被包裹的 DOM.[【查看案例】](https://codepen.io/liejiayong/pen/GRjRdQE)

```vue
<jcount :start="0" :end="1688" :child-ele="span" :wrap-ele="div">
```

### props

- start - 开始数值
  - type: Number
  - required : false
  - default : 0
- end - 结束数值
  - type: Number
  - required : false
  - default : 0
- duration - 动画持续时间
  - type: Number
  - required : false
  - default : 3000
- decimals - // 小数点位数
  - type: Number
  - required : false
  - default : 0
- decimal - // 小数位符号
  - type: String
  - required : false
  - default : '.'
- separator - // 分隔符
  - type: String
  - required : false
  - default : ','
- prefix - // 前缀
  - type: String
  - required : false
  - default : ''
- suffix - // 后缀
  - type: false
  - required : true
  - default : ''
- wrapEle - // 父元素组件
  - type: false
  - required : true
  - default : 'span'
- childEle - // 子元素组件
  - type: false
  - required : true
  - default : ''
npm package: @liejy/vue-loadingbar
Description: loadingbar for vue.js
Author: JyLie
Latest version: 0.1.0

# vue-loadingbar

## Usage

- 引入模块

```js
import Vue from 'vue';
import LoadingBar from '@liejy/vue-loadingbar';
Vue.use(LoadingBar);

LoadingBar.start();
LoadingBar.update({
  percent: 90, // 0~100
  status: 'success', // success|error
  show: false, // true|false
});
LoadingBar.config({
  height: 2,
  duration: 800,
});
LoadingBar.start();
LoadingBar.finish();
LoadingBar.error();
LoadingBar.destroy();
```
npm package: @liejy/watermark
Description: watermark for html background
Author: liejiayong
Latest version: 0.1.0

# @liejy/watermark

A lightweight WaterMark for html background

# Usage

## install

```bash

npm i @liejy/watermark

```

## Example

默认调用

```js
new WaterMark();
```

或可传参

```js
new WaterMark(document.body, {
    msg: "内部文档，请勿外传", // 水印内容
    wmCls: ".jy_wm", // 水印主件类名
    width: "100", // canvas元素宽
    height: "100", // canvas元素高
    textAlign: "left", // 文字对齐
    textBaseline: "bottom", // 基准线
    font: "16px Microsoft Yahei", // 字体大小及样式
    fillStyle: "#000", // 自定义水印的颜色
    globalAlpha: 0.1, // 设置图形和图像透明度的值
    rotate: 16, // 文字旋转角度
    zIndex: 1000, // 元素堆叠顺序
    x: 50, // 文字位置x
    y: 50, // 文字位置y
});
```
npm package: @lielamar/logger
Description: A simple logger library
Author: Liel Amar
Latest version: 1.0.8

# Logger

A simple Logger for NodeJS written in TypeScript

## Instalation

You can install [Logger](https://www.npmjs.com/package/@lielamar/logger) from [npm js](https://www.npmjs.com/).
You need to have [Node](https://nodejs.org/en/) installed on your machine before installing the Logger module.

```bash
$ npm install @lielamar/logger
```

## Usage

To use the Logger module you need to create a file where you will manage your Logger from.
This file should import the Logger module, create an instance of it and then export it.

```js
const Logger = require("@lielamar/logger").default;

const logger = new Logger("Namespace", "path/to/target/folder", {
  consoleLog: true,
  includeObjects: true,
});

logger.info("Hello!");
logger.warn("Hello!");
logger.debug("Hello!");
logger.error("Hello!");

module.exports = logger;
```

and then you can use logger from any other class by requiring the previous file.
if you have multiple logs happening asynchrony it's also best to await the logger to prevent duplications :)

```js
const logger = require("./logger.js");

await logger.info("Hey from another file!");
```

## Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

## License

[MIT](https://choosealicense.com/licenses/mit/)
npm package: @liene-putnina/eslint-config-lintmyride
Description: ESLint and Prettier config for a React TypeScript project
Author: Liene Putniņa
Latest version: 1.3.0

# eslint-config-lintmyride

## Overview

This config is aimed at [React](https://reactjs.org/) projects that use [TypeScript](https://typescript-eslint.io/). It extends [airbnb](https://www.npmjs.com/package/eslint-prettier-config-airbnb)  ESLint config, has [Prettier](https://prettier.io/) and React integration. The package gives you a ready-to-use **eslint/prettier** config that you can easily integrate into your project without having to set everything up from scratch.

## Installation

To install the package, run:

```shell
npm install -D @liene-putnina/eslint-config-lintmyride
```

or

```shell
yarn add -D @liene-putnina/eslint-config-lintmyride
```

After you've installed the **main** package, you need to install its **peer dependencies**. These are needed for the linting and formatting to work properly. Here are the additional packages you need to install in your **React** **TypeScript** project.

```shell
@typescript-eslint/parser @typescript-eslint/eslint-plugin eslint eslint-config-airbnb eslint-config-airbnb-typescript eslint-config-prettier eslint-import-resolver-typescript eslint-plugin-import eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-jsx-a11y eslint-plugin-prettier prettier
```

## Usage

Create config files for ESLint ( **.eslintrc.js** ) and Prettier ( **.prettierrc.js** ) and add this config there as seen in the examples below

```js
// .eslintrc.js

const eslintConfig = require('@liene-putnina/eslint-config-lintmyride');

module.exports = {
  ...eslintConfig,
  parserOptions: {
    ...eslintConfig.parserOptions,
    project: ['./tsconfig.json'],
    tsconfigRootDir: __dirname,
  },
  /*The rules in parserOptions are needed to ensure that ESLint won't lint the files it's
  not supposed to and will follow the rules layed out in the local TypeScript config */
};
```

```js
// .prettierrc.js

module.exports = {
    ...require('@liene-putnina/eslint-config-lintmyride/src/prettier.js'),
};
```

If there are parts of your project you do NOT want to lint or format, add them to **.eslintignore** and **.prettierignore** files respectively.

See the [**example**](https://github.com/lienputnina/eslint-config-lintmyride/tree/main/example) project for a more comprehensive view of the setup and usage.

## License

Licensed under **MIT** License.
npm package: @liene-putnina/react-components-for-you
Description: Storybook-based React component library
Author: Liene Putniņa
Latest version: 1.6.0

# react-components-for-you

## Overview

A [React](https://reactjs.org/) component library showcased with [Storybook](https://storybook.js.org/).

## See the components [here](https://react-components-storybook-lv.netlify.app/)

**This is a WIP**.

## Installation

To install the package, run:

```shell
yarn add @liene-putnina/react-components-for-you
```

You also need to install the following **peer dependencies:**

```shell
react react-dom
```

## Usage

Import either the whole library or specific components

```jsx
// Imports the whole library
import * from '@liene-putnina/react-components-for-you'; 

// Imports a single component
import { Button } from '@liene-putnina/react-components-for-you';
```

Add them to your code

```tsx
// The component without variants
const MyComponent = () => {
  return (
    <Button>{children}<Button/>
  )
};

// The component with variants
 const MyComponent = () => {
    return (
      <Button variant={ButtonVariant.DANGER}>{children}<Button/>
    )
  };
```

Due to the structure of this library, the css of the components is **not included by default**. In order to get the styling working, add **the following line** to your global style file:

```css
@import '@liene-putnina/react-components-for-you/dist/index.css';
```

## Development

Uses node version **16.x.x**

### To run locally

```shell
# Opens the storybook dev server on `http://localhost:6006/`
yarn storybook
```

### To build

```shell
# Builds the library
yarn build

# Builds the static storybook page
yarn build-storybook
```

## License

Licensed under **MIT** License.