open-index/open-npm huggingface dataset:
npm package: @gausszhou/math
Description: My Math Library
Latest version: 0.0.2

# Math

My Math Library

## Todo List
- [ ] Vector
  - [ ] Vec2
  - [ ] Vec3
- [ ] mat
  - [ ] mat2
  - [ ] mat3
  - [ ] mat4
- [ ] utils
  - [x] clamp
  - [x] lerp
  - [x] smoothstep
- [ ] random
  - [ ] setSeed
  - [ ] getSeed
  - [ ] randomColor

## Code Reference

```
https://github.com/Jam3/math-as-code
https://github.com/mattdesl/minimath
https://github.com/toji/gl-matrix
https://github.com/josdejong/mathjs
```
npm package: @gausszhou/vue-drag-resize
Description: A Component for Vue.js 2.0
Author: gausszhou
Latest version: 2.0.0-beta.2

# vue-drag-resize

[![Software License](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)](LICENSE) [![Npm Package](https://img.shields.io/npm/v/@gausszhou/vue-drag-resize.svg)](https://www.npmjs.com/package/@gausszhou/vue-drag-resize)

## About

> beta version

## Live Demo

[中文在线演示地址](https://gausszhou.github.io/vue-drag-resize)

## Quick Start

```shell
npm install  @gausszhou/vue-drag-resize
```

```js
// 引入全局自定义组件
import VueDragResize from "@gausszhou/vue-drag-resize"
Vue.component('vue-drag-resize', VueDragResize) 
```

```vue
<template>
  <div class="view-box">
    <div id="toolbar">基本组件</div>
    <div class="container">
      <vue-drag-resize :x="0" :y="0" :w="200" :h="200">
        <p>你可以拖着我，按照自己的意愿调整大小。1</p>
      </vue-drag-resize>
      <vue-drag-resize :x="200" :y="200" :w="200" :h="200">
        <p>你可以拖着我，按照自己的意愿调整大小。2</p>
      </vue-drag-resize>
    </div>
  </div>
</template>
```

## Code Reference

```shell
https://github.com/mauricius/vue-draggable-resizable
https://github.com/gorkys/vue-draggable-resizable-gorkys
https://github.com/tmrcui/vue-draggable-resizable-rotatable
https://github.com/gausszhou/vue-drag-resize-rotate
```
npm package: @gausszhou/vue-drag-resize-rotate
Description: A Component for Vue.js 2.0
Author: gausszhou
Latest version: 2.0.15

# vue-drag-resize-rotate
 
[![Software License](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)](LICENSE) [![Npm Package](https://img.shields.io/npm/v/@gausszhou/vue-drag-resize-rotate.svg)](https://www.npmjs.com/package/@gausszhou/vue-drag-resize-rotate)

<p align='center'>
<a href="https://github.com/gausszhou/vue-drag-resize-rotate/blob/master/README.md">简体中文</a> | English
</p>

## Tips

> Please detour if the elements dragged at the same time reach more than 50+ businesses


## Online demo

[Chinese online demo address](https://gausszhou.github.io/vue-drag-resize-rotate)

## Getting started

```bash
npm install  @gausszhou/vue-drag-resize-rotate
```

```vue
<template>
  <div class="container">
    <vue-drag-resize-rotate
      :w="100"
      :h="100"
      :x="0"
      :y="0"
      :parent="true"
      :draggable="true"
      :resizable="true"
      :rotatable="true"
      @resizing="resizing"
      @rotating="rotating"
      :r="0"
    >
    {{ angle }}
    </vue-drag-resize-rotate>
  </div>
</template>

<script>
import VueDragResizeRotate from "@gausszhou/vue-drag-resize-rotate";

export default {
  components: {
    VueDragResizeRotate,
  },
  data() {
    return {
      angle: 0,
    };
  },
  methods: {
    resizing(x, y, w, h) {
      console.log(x, y, w, h);
    },
    rotating(angle) {
      console.log(angle)
    },
  },
};
</script>
```

## Todo list
 
- [x] Fixed some regular judgment problems and 1px error of container size
- [x] Integrate auto-align function
- [x] Integrate and refactor rotation function
   - [x] realizes rotation, can stretch the size when rotating, and does not move to the vertex
   - [x] Rotary handle style follows angle changes
- [x] fix aspect ratio
   - [x] allow external incoming aspect ratio
- [x] fix zoom
- [ ] rebuild code
   - [ ] Extract logic
   - [ ] Optimized performance

> Tip: After turning on the rotation, the grid alignment and parent container restrictions will be invalid, and there will be Breaking Changes to be refactored! ! !

## References

```shell
https://github.com/mauricius/vue-draggable-resizable
https://github.com/gorkys/vue-draggable-resizable-gorkys
https://github.com/tmrcui/vue-draggable-resizable-rotatable   
```
npm package: @gausszhou/vue3-drag-resize
Description: A Component for Vue.js 3.0
Author: gausszhou
Latest version: 3.0.0-beta.2

# vue3-drag-resize

 
[![Software License](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)](LICENSE) [![Npm Package](https://img.shields.io/npm/v/@gausszhou/vue3-drag-resize.svg)](https://www.npmjs.com/package/@gausszhou/vue3-drag-resize)

## Live Demo

[中文在线演示地址](https://gausszhou.github.io/vue3-drag-resize)

## Quick Start

```shell
npm install  @gausszhou/vue3-drag-resize
```

```js
import { createApp } from "vue";

import VueDragReSize from "@gausszhou/vue3-drag-resize";
import "@gausszhou/vue3-drag-resize/lib/bundle.ems.css";

const app = createApp(App);

// 请使用大驼峰
app.component("VueDragReSize", VueDragReSize);

app.mount("#app");
```

## Code Reference

```shell
https://github.com/gausszhou/vue-drag-resize
```

## Thanks

感谢 `gogocode` 提供的代码转换服务
npm package: @gausszhou/vue3-drag-resize-rotate
Description: A Component for Vue.js 3.0
Author: gausszhou
Latest version: 3.0.2

# vue3-drag-resize-rotate

[![Software License](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)](LICENSE) [![Npm Package](https://img.shields.io/npm/v/@gausszhou/vue3-drag-resize-rotate.svg)](https://www.npmjs.com/package/@gausszhou/vue3-drag-resize-rotate)

## Live Demo

[中文在线演示地址](https://gausszhou.github.io/vue3-drag-resize-rotate)

## Quick Start

```shell
npm install  @gausszhou/vue3-drag-resize-rotate
```

```js
import { createApp } from "vue";

import VueDragResizeRotate from "@gausszhou/vue3-drag-resize-rotate";
import "@gausszhou/vue3-drag-resize-rotate/lib/bundle.esm.css";

const app = createApp(App);

// use
app.use(VueDragResizeRotate);
// or component
// app.component(VueDragResizeRotate.name, VueDragResizeRotate);

app.mount("#app");
```

## Props

| Prop      | Description   |
| --------- | ------------- |
| draggable | Enable drag   |
| resizable | Enable resize |
| rotatable | Enable rotate |
| w         | width         |
| h         | height        |
| x         | left          |
| y         | top           |
| z         | Zindex        |
| r         | rotate angle  |

## Emits

| Event          | Description              |
| ------------- | ------------------------ |
| dragging      | on dragging              |
| dragstop      | on drag stop             |
| resizing      | on resizing              |
| resizestop    | on resize stop           |
| rotating      | on rotating              |
| rotatestop    | on rotate stop           |
| refLineParams | on reference line change |

## Code Reference

```shell
https://github.com/gausszhou/vue-drag-resize-rotate
```

## Thanks

感谢 `gogocode` 提供的代码转换服务
npm package: @gautemo/vite-plugin-service-worker
Description: Simple way to register service worker in a Vite project
Author: Gaute Meek Olsen
Latest version: 0.1.0

# vite-plugin-service-worker

Simple way to register service worker in a Vite project

## Install

```sh
npm i @gautemo/vite-plugin-service-worker -D
```

## Usage

<details>
  <summary>JavaScript</summary>

Add `serviceWorkerPlugin` to your `vite.config.js` and specify your service worker filename:

```js
import { defineConfig } from 'vite'
import { serviceWorkerPlugin } from '@gautemo/vite-plugin-service-worker'

export default defineConfig({
  plugins: [
    serviceWorkerPlugin({
      filename: 'sw.js',
    }),
  ],
})
```

Then register your service worker in your src code.

```js
navigator.serviceWorker.register('/sw.js', {
  type: 'module',
})
```

</details>

<details>
  <summary>TypeScript</summary>

Add `serviceWorkerPlugin` to your `vite.config.ts` and specify your service worker filename:

```ts
import { defineConfig } from 'vite'
import { serviceWorkerPlugin } from '@gautemo/vite-plugin-service-worker'

export default defineConfig({
  plugins: [
    serviceWorkerPlugin({
      filename: 'sw.ts',
    }),
  ],
})
```

Then register your service worker in your src code. Import the `serviceWorkerFile` so the plugin can alternate between the .js and .ts extension based on if it's in dev or build.

```ts
import { serviceWorkerFile } from 'virtual:vite-plugin-service-worker'

navigator.serviceWorker.register(serviceWorkerFile, {
  type: 'module',
})
```

Also add the type to your `vite-env.d.ts` file:

```ts
declare module 'virtual:vite-plugin-service-worker' {
  export const serviceWorkerFile: string
}
```

</details>

## Example

Project with TypeScript: [module-ts](./examples/module-ts/)

## npm publish

```sh
pnpm build
```

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