open-index/open-npm huggingface dataset:
npm package: @ltrcong/addition-of-two-numbers
Description: A simple ESM package that exports add(a, b) = a + b.
Author: Lê Trọng Công
Latest version: 1.0.0

# addition-of-two-numbers

A simple ESM package that exports `add(a, b)` which returns `a + b`.

## Install

```bash
npm install addition-of-two-numbers
npm package: @ltspkg/types.kity
Description: The typings for kity library
Author: chunsen
Latest version: 2.0.0-beta.0

# [Kity Vector Libary](https://github.com/fex-team/kity)类型定义文件

kity API的TypeScript类型定义文件

## 安装

```bash
npm install @ltspkg/types.kity --save-dev
```

## 版本
所有可用的版本和对应的基础哭版本，参考[VERSIONS.md](./VERSIONS.md)

## 更新日志
参考 [CHANGELOG.md](./CHANGELOG.md)
npm package: @ltspkgorg/text-engine
Description: 一个将字符串中匹配的片段，按照自定义的配置规则解析为目标字符串的文本引擎
Latest version: 0.1.3

# 背景

对于跨业务或者跨端来说，前端针对外部服务提供的数据（此处特指字符串文本）有自己的处理逻辑以及展示效果，如颜色、字体大小等等，外部服务关注的是提供的数据是否正确而对于前端需求方如何处理数据、如何展示并不是他们关注的重要内容。为此，可通过定义数据规则使得外部服务减少不必要的数据展示关注也让前端需求方能灵活的处理数据以及展示数据。

## 介绍

> text-engine 是一个将字符串中匹配的片段，按照自定义的配置规则解析为目标字符串的文本引擎

**匹配模式：`#x{content}y1[,y2]#`**。

解析的过程为：1）将文本内容经右侧配置函数依次处理，其中右侧`y1`、`y2`为配置的文本内容`content`处理函数，可无或多个（多个之间用逗号分割，不能有空格）；2）将经过处理的最终结果通过识别左侧`x`配置的渲染函数转为字符串。

## 安装

```bash
npm install @ltspkgorg/text-engine --save
```

## 使用

#### 步骤一：创建文本引擎

```typescript
import { textEngineFactory } from "@ltspkgorg/text-engine";

const textEngine = textEngineFactory({
  renders: {
    a1: (val: unknown) => `<div>${val}</div>`,
    a2: (val: unknown) => `<span style="color:red">${val}</span>`,
  },
  transfers: {
    b1: (val: unknown) => Number(val) * 1000,
    b2: (val: unknown) => (Number(val) / 1000).toFixed(2) + "k",
  },
});
```

#### 步骤二：解析文本字符串

```typescript
const result = textEngine.parse("这是#a1{100.0345}#万元");

console.log(result);
// 这是<div>100.0345</div>万元
```

## 示例

#### 示例一

输出纯文本内容

```typescript
const result = textEngine.parse("这是#{100.0345}#万元");
console.log(result);
// 这是100.0345万元
```

#### 示例二

转换的文本中含有左侧规则符号

```typescript
const result = textEngine.parse(
  "含有多个左侧规则符号的文本#a1{测试左侧（{#、#a{）规则}#符号"
);
console.log(result);
// 含有多个左侧规则符号的文本<div>测试左侧（{#、#a{）规则</div>符号
```

#### 示例三

转换的文本中含有右侧规则符号

```typescript
const result = textEngine.parse(
  "含有多个右侧规则符号的文本#a1{测试右侧（}#、}a,b#）规则}#符号"
);
console.log(result);
// 含有多个右侧规则符号的文本<div>测试右侧（}#、}a,b#）规则</div>符号
```

#### 示例四

转换的文本中含有空格（开头、中间、结尾）

```typescript
const result = textEngine.parse(`文本含有空格符的文本#a1{ 测试左侧 规则  }#`);

console.log(result);
// 文本含有空格符的文本<div> 测试左侧 规则  </div>
```

## 变更记录

[CHANGELOG](./CHANGELOG.md)

## 协议

MIT
npm package: @ltteng/eslint-config
Description: LiTENGTENG's ESLint config preset
Author: LiTENGTENG
Latest version: 1.0.0

# @ltteng/eslint-config

Flat ESLint config for JavaScript, TypeScript, Vue 2, Vue 3, Prettier.

Forked from [sxzz/eslint-config](https://github.com/sxzz/eslint-config)

## Features

- Format with Prettier.
- Designed to work with TypeScript, Vue 2 and 3 out-of-box.
- Support JSON(5), YAML, Markdown...
- Sort imports, `package.json`, `tsconfig.json`...
- ESLint Flat config.
- Reasonable defaults, best practices, only one-line of config.

## Install

```bash
npm i -D @ltteng/eslint-config
```

Require Node.js >= 18.18, and ESLint >= 8.56.0.

## Usage

```js
import { ltteng } from '@ltteng/eslint-config'
export default ltteng(
  [
    /* your custom config */
  ],
  // Features: it'll detect installed dependency and enable necessary features automatically
  {
    prettier: true,
    markdown: true,
    vue: true, // auto detection
    unocss: false, // auto detection
  },
)
```

### Presets

```js
// eslint.config.js
import {
  // Includes
  // - `presetBasic` (JS+TS) support
  // - `presetLangsExtensions` (markdown, yaml, jsonc) support
  // - Vue support
  // - UnoCSS support (`uno.config.ts` is required)
  // - Prettier support
  presetAll,
  presetBasic, // Includes `presetJavaScript` and typescript support
  presetJavaScript, // Ignore common files and include javascript support
  presetJsonc, // Includes basic json(c) file support and sorting json keys
  presetLangsExtensions, // Includes markdown, yaml + `presetJsonc` support
} from '@ltteng/eslint-config'

export default presetAll
```

See [preset.ts](./src/presets.ts) for more details.

### VSCode

```jsonc
{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit",
    "source.organizeImports": "never"
  },
  "eslint.experimental.useFlatConfig": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "vue",
    "html",
    "markdown",
    "json",
    "jsonc",
    "yaml"
  ]
}
```

## License

[MIT](./LICENSE) License © 2024-PRESENT [LiTENGTENG](https://github.com/ltteng)
npm package: @lttr/nuxt-config-eslint
Description: An opinionated ESlint config for Nuxt apps
Author: Lukas Trumm
Latest version: 0.4.1

# Eslint config for Nuxt

An opinionated Eslint config for Nuxt apps.

## What's included

This config extends `@nuxt/eslint` module with additional packages:

- [eslint-plugin-vue-scoped-css](https://github.com/future-architect/eslint-plugin-vue-scoped-css) - scoped CSS best practices
- [eslint-plugin-vuejs-accessibility](https://vue-a11y.github.io/eslint-plugin-vuejs-accessibility/) - a11y rules
- [eslint-config-prettier](https://github.com/prettier/eslint-config-prettier) - disable rules conflicting with Prettier

Plus opinionated Vue rules:

- `vue/block-lang` - enforce TypeScript in script blocks
- `vue/block-order` - enforce template/script/style order
- `vue/component-api-style` - enforce `<script setup>`
- `vue/define-props-declaration` - enforce type-based props
- `vue/component-name-in-template-casing` - PascalCase components
- `vue/require-typed-ref` - typed ref() calls
- `vue/v-for-delimiter-style` - enforce `of` over `in`
- `vue/v-bind-style` - enforce `:foo` shorthand over `:foo="foo"`

## Usage

### Installation

```
pnpm dlx nuxi module add eslint
pnpm add -D @lttr/nuxt-config-eslint
```

### Example `eslint.config.js` file in a Nuxt app, which uses this package

```ts
// @ts-check
import withNuxt from "./.nuxt/eslint.config.mjs"
import customConfig from "@lttr/nuxt-config-eslint"

export default withNuxt(customConfig)
```

### Optional

```
pnpm dlx add-npm-scripts 'lint' 'eslint'
pnpm dlx add-npm-scripts 'lint:fix' 'eslint --fix'
pnpm dlx format-package --write
```
npm package: @lttr/nuxt-config-postcss
Description: Custom postcss config for Nuxt
Author: Lukas Trumm
Latest version: 0.0.8

# Nuxt config Postcss

[![npm version][npm-version-src]][npm-version-href]
[![License][license-src]][license-href]
[![Nuxt][nuxt-src]][nuxt-href]

An opinionated Postcss config for Nuxt

[✨ &nbsp;Release Notes](/CHANGELOG.md)

## Quick Setup

Install the module to your Nuxt application with one command:

```bash
npx nuxi module add @lttr/nuxt-config-postcss
```

### Configuration

Add a file to the configuration which contains global custom media query
definitions:

```ts
import { createResolver } from "@nuxt/kit"

const resolver = createResolver(import.meta.url)

export default defineNuxtConfig({
  modules: ["@lttr/nuxt-config-postcss"],
  lttrConfigPostcss: {
    filesWithGlobals: [resolver.resolve("./assets/css/media.css")],
  },
})
```

<!-- Badges -->

[npm-version-src]: https://img.shields.io/npm/v/@lttr/nuxt-config-postcss/latest.svg?style=flat&colorA=020420&colorB=00DC82
[npm-version-href]: https://npmjs.com/package/@lttr/nuxt-config-postcss
[npm-downloads-src]: https://img.shields.io/npm/dm/@lttr/nuxt-config-postcss.svg?style=flat&colorA=020420&colorB=00DC82
[npm-downloads-href]: https://npmjs.com/package/@lttr/nuxt-config-postcss
[license-src]: https://img.shields.io/npm/l/@lttr/nuxt-config-postcss.svg?style=flat&colorA=020420&colorB=00DC82
[license-href]: https://npmjs.com/package/@lttr/nuxt-config-postcss
[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
[nuxt-href]: https://nuxt.com
npm package: @lttr/nuxt-puleo
Description: Integrate Puleo into Nuxt
Author: Lukas Trumm
Latest version: 0.0.8

# Nuxt-Puleo

[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![License][license-src]][license-href]
[![Nuxt][nuxt-src]][nuxt-href]

My new Nuxt module for doing amazing things.

## Quick Setup

Install the module to your Nuxt application with one command:

```bash
npx nuxi module add @lttr/nuxt-puleo
```

That's it! You can now use My Module in your Nuxt app ✨

## Contribution

<details>
  <summary>Local development</summary>
  
  ```bash
  # Install dependencies
  npm install
  
  # Generate type stubs
  npm run dev:prepare
  
  # Develop with the playground
  npm run dev
  
  # Build the playground
  npm run dev:build
  
  # Run ESLint
  npm run lint
  
  # Run Vitest
  npm run test
  npm run test:watch
  
  # Release new version
  npm run release
  ```

</details>

<!-- Badges -->

[npm-version-src]: https://img.shields.io/npm/v/@lttr/nuxt-puleo/latest.svg?style=flat&colorA=020420&colorB=00DC82
[npm-version-href]: https://npmjs.com/package/@lttr/nuxt-puleo
[npm-downloads-src]: https://img.shields.io/npm/dm/@lttr/nuxt-puleo.svg?style=flat&colorA=020420&colorB=00DC82
[npm-downloads-href]: https://npm.chart.dev/@lttr/nuxt-puleo
[license-src]: https://img.shields.io/npm/l/@lttr/nuxt-puleo.svg?style=flat&colorA=020420&colorB=00DC82
[license-href]: https://npmjs.com/package/@lttr/nuxt-puleo
[nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js
[nuxt-href]: https://nuxt.com
npm package: @lttr/puleo
Description: An attempt to build a mid-level CSS library forming a good starting point for custom designs. Opinionated on demand.
Author: Lukas Trumm
Latest version: 0.8.1

# Puleo CSS

An attempt to build a mid-level CSS library forming a good starting point for
custom designs. Opinionated on demand.

## Basic ideas

- Should work in 3 ways
  - Import a CSS file and start prototyping
  - Configure with a set of design tokens
  - Create you own composition from individual building blocks
- Build on top of ideas, that are already out there
  - [Normalize]()
  - [Every Layout](https://every-layout.dev/)
  - [Open props](https://open-props.style/)
  - [Pollen](https://www.pollen.style/)
  - [Tailwind](https://tailwindcss.com/)
  - [Utopia](https://utopia.fyi/)
- CSS is good enough
  - No need for alternative techniques like utility class framework, CSS in JS etc.
  - No need for a pre-processor
  - Transpilation of newer CSS features allows to use standard CSS from the future
- Scoping on components level is good
  - Ment to be used with CSS, that is scoped to components (like Vue or Svelte
    scoped style blocks or upcoming CSS native scoping; BEM does the job as well
    but it is not preffered)
- Base styling layer needs (with [ITCSS](https://benmarshall.me/itcss/) layer associations)
  - set of primitive values (physical variables/props) (-> Settings)
  - set of semantic variables/design tokens (-> Settings)
  - type, space and grid system (-> Tools)
  - CSS reset/normalization (-> Generic)
  - brand specific reset (-> Generic)
  - improved HTML elements (-> Elements)
  - utility classes for a couple of text styles (-> Objects)
  - utility classes for often used layouts (-> Objects)
  - individual component styles (-> Components)
  - utility classes for other aspects (like .visually-hidden) (-> Utilities)
npm package: @lttr/shell-aliases
Description: Retrieve and parse zsh aliases from the environment or from a file
Latest version: 1.0.3

# Zsh aliases

Retrieve and parse zsh aliases from the environment or from a file.

This package is written for `deno` and compiled for `node` using `dnt`.

## Usage (for deno)

```typescript
import { evaluatedAliases, aliasesFromFile } from "https://deno.land/x/shell_aliases/mod.ts";

const aliases = await evaluatedAliases();
// or
const aliases = await aliasesFromFile(pathToAliasesFile);

// aliases will be an array like:
// [
//   {
//     key: "..",
//     value: "cd .."
//   },
//   {
//     key: "ll",
//     value: "ls -l"
//   }
// ]
```

## Usage (for node)

```typescript
import { evaluatedAliases } from "@lttr/shell-aliases";
const aliases = await evaluatedAliases();
```

## Testing

```
deno task test
```

## First: Deno x publishing

This package is automatically [published](https://deno.land/x/shell_aliases) when new tag with version is pushed to the Github repository.

```
git describe --tags # get last tag
git tag <version>
git push --tags
```

## Second: NPM publishing

There is a build script that uses [dnt](https://deno.land/x/dnt) and compiles a
npm package.

```
deno run -A _build.ts <version>
cd npm
npm publish --access public
deno task clean
```
npm package: @lttr/zsh-history
Description: Retrieve and parse zsh history from its common location
Latest version: 1.0.1

# Zsh history

Retrieve and parse zsh history from its common location `~/.zsh_history`.

This package is written for `deno` and compiled for `node` using `dnt`.


## Usage (for deno)

```typescript
import { zshHistory } from "https://deno.land/x/zsh_history/mod.ts";

const history = await zshHistory();
// or
const history = await zshHistory(customPath);
```

## Usage (for node)

```typescript
import { zshHistory } from "@lttr/zsh-history";
const history = await zshHistory();
```

## Testing

```
deno task test
```

## First: Deno x publishing

This package is automatically [published](https://deno.land/x/shell_aliases) when new tag with version is pushed to the Github repository.

```
git describe --tags # get last tag
git tag <version>
git push --tags
```

## Second: NPM publishing

There is a build script that uses [dnt](https://deno.land/x/dnt) and compiles a
npm package.

```
deno run -A _build.ts <version>
cd npm
npm publish --access public
deno task clean
```

## Prior art

https://github.com/danasilver/zsh-history
npm package: @ltv/env
Description: NodeJS Environment Utils
Author: Luc
Latest version: 4.0.3

# env

NodeJS safe environment parser. Compatible with TypeScript.

In this version,

- I have removed dotenv support. If you want to use dotenv, please use the previous version. Otherwise, you should install the dotenv package yourself.
- I have removed the lodash.has and lodash.trim dependencies, and the package size has been reduced. There is no dependency anymore.

## Features

- Safe environment parser
- Compatible with TypeScript

With typescript, if you're using are not mentioning the default value, the return type will be `T | undefined`.
Otherwise, the return type will be `T`.

e.g.

```ts
const foo = env.string('FOO') // foo: string | undefined
const bar = env.string('BAR', 'bar') // bar: string
```

## Installation

```bash
npm install @ltv/env
```

## Usage

```js
const env = require('@ltv/env')
```

```ts
import env from '@ltv/env'
```

### env.string

```ts
env.string(key: string, defaultValue?: string): string
```

### env.number

```ts
env.number(key: string, defaultValue?: number): number
```

### env.int

```ts
env.int(key: string, defaultValue?: number): number
```

### env.float

```ts
env.float(key: string, defaultValue?: number): number
```

### env.bool

```ts
env.bool(key: string, defaultValue?: boolean): boolean
```

### env.array

```ts
env.array(key: string, defaultValue?: string[]): string[]
```

### env.json

```ts
env.json(key: string, defaultValue?: object): object
```

### env.date

```ts
env.date(key: string, defaultValue?: Date): Date
```
npm package: @ltv/gql-merge
Description: Tools for merging GraphQL documents
Author: Luc
Latest version: 0.1.5

# gql-merge

[![standard-readme compliant](https://img.shields.io/badge/standard--readme-OK-green.svg?style=flat-square)](https://github.com/RichardLitt/standard-readme)
[![npm](https://img.shields.io/npm/v/gql-merge.svg?style=flat-square)](https://www.npmjs.com/package/gql-merge)
[![npm](https://img.shields.io/npm/dm/gql-merge.svg?style=flat-square)](https://www.npmjs.com/package/gql-merge)
[![npm](https://img.shields.io/npm/l/gql-merge.svg?style=flat-square)](https://www.npmjs.com/package/gql-merge)

> Tools for merging GraphQL documents

## Table of Contents

- [Background](#background)
- [Installation](#installation)
- [CLI](#cli)
- [API](#api)

## Background


This repo contains tools for merging definitions into multiple GraphQL documents
into one. For example, say you have these two files GraphQL files:

```graphql
type Post {
  id: ID!
  content: String
}

type Query {
  postById(id: ID!): Post
}
```

```graphql
type Author {
  id: ID!
  name: String
}

type Query {
  postsByAuthorId(id: ID!): [Post]
}
```

You can use the `gql-merge` CLI to combine these files into one:

```
$ gql-merge --out-file schema.graphql testdata/readme*
```

The resulting file would look like this:

```graphql
type Post {
  id: ID!
  content: String
}

type Query {
  postById(id: ID!): Post
  postsByAuthorId(id: ID!): [Post]
}

type Author {
  id: ID!
  name: String
}
```

## Installation

```
$ npm i -g gql-merge
```

## CLI

```
$ gql-merge -h

  Usage: gql-merge [options] <glob ...>

  Tools for merging GraphQL documents

  Options:

    -h, --help             output usage information
    -V, --version          output the version number
    -o, --out-file <path>  Output GraphQL file, otherwise use stdout
    -v, --verbose          Enable verbose logging

  Examples:

    $ gql-merge **/*.graphql > schema.graphql
    $ gql-merge -o schema.graphql **/*.graphql
    $ gql-merge dir1/*.graphql dir2/*.graphql > schema.graphql

```

## API

You can also import the package. The following example merges all files living in the `data/types` folder.

```
import fs from 'fs';
import path from 'path';
import { mergeStrings } from 'gql-merge';

const typesDir = path.resolve(__dirname, 'data/types');
const typeFiles = fs.readdirSync(typesDir);
const types = typeFiles.map(file => fs.readFileSync(path.join(typesDir, file), 'utf-8'));
const typeDefs = mergeStrings(types);
```

More detailed docs coming soon.

### `mergeFileGlob`

### `mergeFilePaths`

### `mergeStrings`

### `mergeString`

### `mergeAst`
npm package: @ltv/js-dev-toolkit
Description: ## Install
Latest version: 0.1.2

# js-dev-toolkit

## Install

```bash
npm install --save-dev @ltv/js-dev-toolkit
```

## Usage

### Prettier

- Create a `.prettierrc.js` file in the root of your project and add the following:

```javascript
module.exports = require('@ltv/js-dev-toolkit').prettier;
```
npm package: @ltv/leaflet.glify
Description: web gl renderer plugin for leaflet
Latest version: 1.1.1

# Leaflet.glify
web gl renderer plugin for leaflet

_Pronounced leaflet-G.L.-Ify, or leaflet-glify, or L.-G.L.-Ify, or L-glify, or elglify_

inspired by http://bl.ocks.org/Sumbera/c6fed35c377a46ff74c3 & need.

## Objective
* To provide a means of rendering a massive amount of data visually in a way that does not degrade user experience
* Remaining as simple as possible with current fastest libs
* Providing the same sort of user experience one would get using standard html and elements


## Simple Polygon Usage
```javascript
L.glify.shapes({
  map: map,
  data: geoJson,
  click: function(e, feature) {
    //do something when a shape is clicked
  }
});
```

## Simple Points Usage
```javascript
L.glify.points({
  map: map,
  data: points,
  click: function(e, point, xy) {
    //do something when a point is clicked
  }
});
```

## (Planned) Simple Lines Usage
```javascript
L.glify.lines({
  map: map,
  data:geojson,
  click: function(e, feature, xy) {
    //do something when a line is clicked
  }
});
```

## `L.glify.shapes` Options
* `map` `{Object}` required leaflet map
* `data` `{Object}` required geojson data
* `vertexShaderSource` `{String|Function}` optional glsl vertex shader source, defaults to use `L.glify.shader.vertex`
* `fragmentShaderSource` `{String|Function}` optional glsl fragment shader source, defaults to use `L.glify.shader.fragment.polygon`
* `click` `{Function}` optional event handler for clicking a shape
* `color` `{Function|Object|String}` optional, default is 'random'
  * When `color` is a `Function` its arguments are gets the `index`:`number`, and the `feature`:`object` that is being colored
* `className` {String} a class name applied to canvas, default is ''

## `L.glify.points` Options
* `map` `{Object}` required leaflet map
* `data` `{Object}` required geojson data
* `vertexShaderSource` `{String|Function}` optional glsl vertex shader source, defaults to use `L.glify.shader.vertex`
* `fragmentShaderSource` `{String|Function}` optional glsl fragment shader source, defaults to use `L.glify.shader.fragment.point`
* `click` `{Function}` optional event handler for clicking a point
* `color` `{Function|Object|String}` optional, default is 'random'
  * When `color` is a `Function` its arguments are gets the `index`:`number`, and the `point`:`array` that is being colored 
* `opacity` {Number} a value from 0 to 1, default is 0.8
* `className` {String} a class name applied to canvas, default is ''
* `size` {Number|Function} pixel size of point
* `sensitivity` {Number} exagurates the size of the clickable area to make it easier to click a point

## `L.glify` methods
* `longitudeFirst()`
* `latitudeFirst()`
* `instances`
* `points(options)`
* `shapes(options)`
* `flattenData(data)`
* `latLonToPixel(lat, lon)`


## Roadmap
Soon to come, lines, and limitless styles.
npm package: @ltwoz/prettier-config
Description: Global config for Prettier
Author: Ltwoz
Latest version: 1.1.1

<p align="center">
  <br>
  <img width="250" src="https://media.discordapp.net/attachments/609919287024680961/1158301036155514970/logo-gray.png" />
  <br>
</p>

<h1 align="center">
  @ltwoz/prettier-config
</h1>

<h4 align="center">
  Ltwoz-flavored Prettier config.
</h4>

<p align="center">
  <a href="https://www.npmjs.com/package/@ltwoz/prettier-config">
    <img src="https://img.shields.io/npm/v/@ltwoz/prettier-config.svg?style=for-the-badge" alt="NPM version" />
  </a>
  <a href="https://github.com/Ltwoz/prettier-config/blob/main/LICENSE">
    <img src="https://img.shields.io/badge/license-MIT-blue.svg?style=for-the-badge" alt="Ltwoz prettier-config is released under the MIT license." />
  </a>
</p>

## Installation

With `npm`:

```sh
npm install --save-dev prettier @ltwoz/prettier-config
```

Or using `pnpm`:

```sh
pnpm add -D prettier @ltwoz/prettier-config
```

Or using `yarn`:

```sh
yarn add prettier @ltwoz/prettier-config -D
```

## Setup

Add the following code to your `.prettierrc` file:

```json
{
  "prettier": "@ltwoz/prettier-config",
}
```
npm package: @ltxhhz/koishi-plugin-give-you-some-color
Description: 给你点颜色看看
Latest version: 0.1.5

# koishi-plugin-give-you-some-color

[![npm](https://img.shields.io/npm/v/@ltxhhz/koishi-plugin-give-you-some-color?style=flat-square)](https://www.npmjs.com/package/@ltxhhz/koishi-plugin-give-you-some-color)

![img](./images/2.png)

使用了 [color - npm (npmjs.com)](https://www.npmjs.com/package/color) 库，输入的字符串由 [color-string - npm (npmjs.com)](https://www.npmjs.com/package/color-string) 库处理。

* 支持部分中文颜色，因为和英文[做了映射](./src/colors.ts)。
* 支持使用模板，详见下方示例和配置。

## 前置

- [ltxhhz/koishi-plugin-skia-canvas: 基于 skia-canvas 提供 koishi 的 skia 服务 (github.com)](https://github.com/ltxhhz/koishi-plugin-skia-canvas)

## 示例

![示例](./images/3.png "示例")

## 配置

![img](./images/4.png)

## 其他插件

* [ltxhhz/koishi-plugin-imagify-skia: koishi 插件，使用 skia-canvas 的图形化输出，性能优于 puppeteer (github.com)](https://github.com/ltxhhz/koishi-plugin-imagify-skia)
npm package: @lu-development/st-gen
Description: Stencil create component cli
Author: Jag Reehal
Latest version: 0.7.3

### Stencil Create Component

cli to create Stencil components in your current working directory.

## This is until I (or somebody else) submits a PR to for Stencil to provide this natively.

install globally

```bash
npm install -g @lu-development/st-gen
```

and run

```bash
st-gen
```

or use npx

```bash
npx st-gen
```
## You can also provide component name e.g. 

```bash
st-gen my-app
```

## If you're using Stencil 0.7.18 or earlier

use st-cc@0.6.2
npm package: @lu-development/ux-gdpr-consent
Description: GDPR compliance plugin
Latest version: 2.0.34

# LU GDPR Consent

LU GDPR Consent is a small modal dialog UI that is designed to show when a site is visited from a European Union country. It relies on an API call to [IPStack](https://ipstack.com) to determine the visitor's location. The user is presented with an option to agree / disagree with LU's use of cookies. GDPR Consent places cookies (which are later read to conditionally show the UI) and emits an event based on the user's decision. The cookies and event can be used by other applications to control GDPR-sensitive behavior, but GDPR Consent does not enforce that control.

## Development and Distribution

This component is web component built with JavaScript and [published](https://docs.npmjs.com/cli/publish) to [npm](https://www.npmjs.com/package/@lu-development/ux-gdpr-consent). It is currently only integrated through Google Tag Manager (GTM), using the [@latest tag](https://unpkg.com) from unpkg to automatically consume the latest version. The component is injected using the code in `inject.html`, which is updated (if needed) within GTM's admin UI.

## Using this component

### Script tag

- Put a script tag similar to this `<script src='https://unpkg.com/@lu-development/ux-gdpr-consent@latest/dist/gdpr.min.js'></script>` in the head of your index.html
- Then you can use the element anywhere in your template, JSX, html etc like `<ux-gdpr-consent></ux-gdpr-consent>`

### Node Modules

- Run `npm i @lu-development/ux-gdpr-consent`
- Put a script tag similar to this `<script src='src/gdpr.js'></script>` in the head of your index.html
- Then you can use the element anywhere in your template, JSX, html etc

### In a SPA

- Run `npm i @lu-development/ux-gdpr-consent`
- Add an import to the npm packages `import ux-gdpr-consent;`
- Then you can use the element anywhere in your template, JSX, html etc like `<ux-gdpr-consent></ux-gdpr-consent>`
npm package: @lu-development/ux-patterns
Description: Stencil Component Starter
Latest version: 1.7.2

## Getting Started Developing the UX Patterns

To start working on the design system(and if you have access to repo), clone this repo to a new directory:

```bash
git clone https://bitbucket.os.liberty.edu/scm/ds/ux-patterns.git
cd ux-patterns
```

and run:

```bash
npm start
```

## Getting Started With Components



######Script tag

Put this script tag with the version

```
<link href="https://unpkg.com/@lu-development/ux-patterns@1.7.2/css/liberty.bundle.css" rel="stylesheet">
<script type="module" src="https://unpkg.com/@lu-development/ux-patterns@1.7.2/dist/uxpatterns/uxpatterns.esm.js"></script>
<script nomodule src="https://unpkg.com/@lu-development/ux-patterns@1.7.2/dist/uxpatterns/uxpatterns.js"></script>
```

You need to import at least the core.css for your app to function. You don't need the full liberty.bundle.css

in the head of your index.html
Then you can use the element anywhere in your template, JSX, html etc.

https://stenciljs.com
npm package: @lu-development/ux-style-guide
Description: Liberty University Style Guide
Author: Liberty University
Latest version: 0.0.3

# Liberty University: Style Guide

If you are seeing this on NPM... you can use this component library in any framework or the "no framework" of your choice. See getting started with components below.

If you are trying to develop the style guide. Note that though the component library is public the style guide is still a private repository.

## Getting Started Developing the Style Guide

To start working on the style guide(and if you have access to repo), clone this repo to a new directory:

```bash
git clone git@bitbucket.org:lu-dev/ux-style-guide.git
cd ux-style-guide
```

and run:

```bash
npm install
npm start
```

To build the app for production, run:

```bash
npm run build
```

To run the unit tests once, run:

```
npm test
```

To run the unit tests and watch for file changes during development, run:

```
npm run test.watch
```

To publish the repo. Make sure the project version is incremented properly according to Semantic Versioning. Of course you need to be logged into you npm account and have publishing auth. If you need access create an npm account if you don't have one and email jdreckley@liberty.edu with you request.

```
npm publish --access=public    
```

## Getting Started With Components



######Script tag

Put this script tag with the version

```
<script src='https://unpkg.com/@lu-development/ux-style-guide@<version you want>/dist/uxstyleguide.js'></script>
```
in the head of your index.html
Then you can use the element anywhere in your template, JSX, html etc.

######Node Modules

Run 
```
npm install @lu-development/ux-style-guide --save
```
Put a script tag similar to this 
```
<script src='node_modules/@lu-development/ux-style-guide/dist/uxstyleguide.js'></script>
 ```
 in the head of your index.html
Then you can use the element anywhere in your template, JSX, html etc.

######In a stencil-app-starter app

Run 
```
npm install @lu-development/ux-style-guide --save
```
Add an import to the npm packages: import @lu-development/ux-style-guide;
Then you can use the element anywhere in your template, JSX, html etc.

######Framework Integration
Reference: https://stenciljs.com/docs/framework-integration

In my experience so far(because stencil still has not created the common js index.js magic at this point) you need to specify the /dist/esm/index.js when importing the defineCustomElements function.

Also the angular import does not work at his point but you can import with the script tag and still add the CustomElementSchema to the AppModule... it works just fine.
npm package: @lu-jiejie/markdown-it-magic-link
Description: Makes links and `@mentions` in markdown beautiful and interactive.
Author: Lu Jiejie
Latest version: 0.2.3

# markdown-it-magic-link

[![npm version][npm-version-src]][npm-version-href]

Makes links and `@mentions` in markdown beautiful and interactive.

> This is a fork of [antfu/markdown-it-magic-link](https://github.com/antfu/markdown-it-magic-link) with additional platform-specific mention support.

## New Features

### Platform-specific @mentions

In addition to the original GitHub @mentions (`{@username}`), this fork adds support for custom platform mentions using the format `{@platform:username}`.

#### Configuration

```js
import MarkdownItMagicLink from '@lu-jiejie/markdown-it-magic-link'
import MarkdownIt from 'markdown-it'

const md = MarkdownIt()
md.use(MarkdownItMagicLink, {
  platformUsers: {
    bilibili: {
      'lu-jiejie': {
        link: 'https://space.bilibili.com/123456',
        avatarUrl: 'https://i0.hdslb.com/bfs/face/avatar.jpg',
        displayName: 'Lu Jiejie' // optional
      }
    },
    twitter: {
      someone: {
        link: 'https://twitter.com/someone',
        avatarUrl: 'https://pbs.twimg.com/avatar.jpg'
      }
    }
  }
})
```

#### Usage

```markdown
Check out {@bilibili:lu-jiejie}
Follow me on {@twitter:someone}
Custom display: {@bilibili:lu-jiejie|My Display Name}
```

<!-- Badges -->

[npm-version-src]: https://img.shields.io/npm/v/@lu-jiejie/markdown-it-magic-link?style=flat&colorA=080f12&colorB=1fa669
[npm-version-href]: https://www.npmjs.com/package/@lu-jiejie/markdown-it-magic-link
npm package: @lu-kk/sentry-mini-program
Description: ## 打包 ```bash yarn build ```
Author: m_lukuankuan@163.com
Latest version: 1.0.17

# 自用包
## fork源：sentry-miniapp

## 打包
```bash
yarn build
```

## 发布
```bash
yarn pub
``` 

## 测试
```bash
npx jest test/platform/index.test.ts
```

## 项目使用方式

```js

import Sentry from '@lu-kk/sentry-mini-program'

Sentry.init({
  platform: 'tt', // 若是指定，包内的sdk会强制绑定这个平台，若不指定，包内会自行判断
  dsn: '',
  environment: '',
  beforeSend: () => {},
})

Sentry.configureScope((scope) => {
  scope.setUser({id: ''})“
  scope.setTags({
    mini_program_name: '',
  })
  scope.setExtras({
    project_ame: '',
  })
})

```
npm package: @lu.se/console
Description: Like console but with colors. Changes console.log, error, info, debug and warn to get an ISO timestamp in some color
Author: Johan Dahl
Latest version: 1.1.3

# @lu.se/console-color

Redefine `console.log`, `console.info`, `console.debug`, `console.error`, `console.warn` to use time stamp and colors.

## Example

```js
console.log('This is console.log')
console.info('This is console.info')
console.debug('This is console.debug')
console.error('This is console.error')
console.warn('This is console.error')
```

Outputs:

![Image of output](output.png)
npm package: @lu.se/styled-editor
Description: A styled text editor component for Vue 3 using Tiptap.
Author: Johan Dahl johan.dahl@lth.lu.se
Latest version: 0.4.1

# Vuejs 3 Styled editor 
Styled rich text editor component using Tiptap
Supports a limited set of HTML tags as specified in allowedTags prop
Has a toolbar with buttons for the allowed tags

## Fontawesome

These icons are used in the toolbar
- fa-bold
- fa-italic
- fa-underline
- fa-strikethrough
- fa-link
- fa-link-slash
- fa-list-ul
- fa-list-ol
- fa-undo
- fa-redo

import them like this

```js
import {
  faBold,
  faItalic,
  faUnderline,
  faStrikethrough,
  faListOl,
  faListUl,
  faUndo,
  faRedo,
  faLink,
  faLinkSlash,
} from '@fortawesome/pro-light-svg-icons'
```

and also icons used for placeholder groups if any

## i18n 

[locale/sv.js](locale/sv.js) and [locale/en.js](locale/en.js) contains translations for mostly
aria-labels. Import them and add them to strings in project like this:

```js
import sv from '@/locales/sv.js'
import en from '@/locales/en.js'

import styledEditorSv from '@lu.se/styled-editor/locales/sv.js'
import styledEditorEn from '@lu.se/styled-editor/locales/en.js'

// Merge styled editor translations
sv.styled_editor = styledEditorSv.styled_editor
en.styled_editor = styledEditorEn.styled_editor
```


## Props

- modelValue: String, required, the HTML content of the editor
- state: Boolean or null, default null, validation state of the editor
- disabled: Boolean, default false, whether the editor is disabled
- allowedTags: Array of strings, default [], list of allowed HTML tags a, b, i, u, s, ul, ol, li, br, p (li are implicit if not specified)
  if p is omitted will ul, ol and li not be allowed

## Emits

- update:model-value: emitted when the content changes

It has custom logic to convert the editor content to HTML, handling placeholders and avoiding empty paragraphs in lists.

## Slots

- toolbar-append: add something to the end of the toolbar. It exposes two fields
    - disabled: Boolean if components inside slot should be disabled
    - insertPlaceHolder: Function which take one argument. The placeholder to be inserted as `<var>placeholder</var>`

## Exposed functions

- focus(): give focus to editor
- insertPlaceholder(name: string): Function which take one argument. The placeholder to be inserted as `<var>placeholder</var>`
npm package: @lu.se/validation
Description: Package to validate fields in Vue3
Author: Johan Dahl
Latest version: 1.0.5

# Validation

Home cooked validation library consists of two components

`ValidatorForm` and `Validator`. `Validator` 

## Rules

A rule is just a list of either `rule: string` or an object with `{rule: string, ... other values}`
Rules are registred with `registredRule` which is exported by `validation.js`

```javascript
registerRule('between', (value, {min, max}) => value >= min && value <= max)
```

The rule can't be async as of now. If the rule fails will it create an error message by calling
$t(`_validation_${rule.rule}`, {field: $t(name), ...rule)} so for example


## Validator

It watches a value and then it changes does run rules on the value. First rule failing
is shown as an error in human-readable form (uses vue-i18n)

## ValidatorForm

It stores all Validator instances declared inside it. And it exposes the method
validate which runs validation on all Validators it returns

```javascript
{
  errors: [...],
  sucess: true || false
}
```

errors is an object with the following properties

name: The name of the Validator
error: The human readable error message
rule: The name of rule which failed