canvas-color-disc 1.4.1 → 1.4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.cn.md +12 -13
  2. package/README.md +12 -13
  3. package/package.json +1 -1
package/README.cn.md CHANGED
@@ -5,7 +5,6 @@
5
5
  > 基于 Canvas 的圆形色盘取色组件，支持 PC 与移动端（Pointer Events）；同时提供 Vue 2 / Vue 3 组件与框架无关的 Web Component / 纯 JS 版本
6
6
 
7
7
  [![在线演示](https://img.shields.io/badge/Live%20Demo-online-2ea44f?logo=githubpages&logoColor=white)](https://zancheng.github.io/canvas-color-disc/)
8
- [![StackBlitz 在线编辑](https://img.shields.io/badge/StackBlitz-Open%20in%20editor-1389FD?logo=stackblitz&logoColor=white)](https://stackblitz.com/github/zancheng/canvas-color-disc)
9
8
 
10
9
  ![预览](https://cdn.jsdelivr.net/gh/zancheng/canvas-color-disc@main/preview.png)
11
10
 
@@ -13,7 +12,7 @@
13
12
 
14
13
  | 环境 | 引入 | 用法 | 样式 |
15
14
  | --- | --- | --- | --- |
16
- | 纯 HTML | `<script src="https://unpkg.com/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js">` | 写 `<canvas-color-disc>` 标签，监听 `change` 事件 | 自动注入，无需引入 |
15
+ | 纯 HTML | `<script src="https://unpkg.com/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js">` | 写 `<canvas-color-disc>` 标签，监听 `change` 事件 | 自动注入，无需引入 |
17
16
  | React | `import 'canvas-color-disc/vanilla'` | 同上；React 19 直接写 JSX 属性与 `onchange`，React 18 用 `ref` 桥接 | 自动注入，无需引入 |
18
17
  | Vue 2（`^2.5.0`） | `import CanvasColorDisc from 'canvas-color-disc/vue2'` | `v-model`：`value` / `input` | `canvas-color-disc/dist/style.css` |
19
18
  | Vue 3（`^3.0.0`） | `import CanvasColorDisc from 'canvas-color-disc'`（或 `canvas-color-disc/vue3`） | `v-model`：`modelValue` / `update:modelValue` | `canvas-color-disc/vue3/style.css` |
@@ -33,14 +32,14 @@ Vue 2 与 Vue 3 产物来自同一份源码（`src/components/CanvasColorDisc.vu
33
32
 
34
33
  ### 纯 HTML
35
34
 
36
- 想先试试效果？打开[在线演示](https://zancheng.github.io/canvas-color-disc/)，或在 [StackBlitz 上边改边跑](https://stackblitz.com/github/zancheng/canvas-color-disc)。
35
+ 想先试试效果？打开[在线演示](https://zancheng.github.io/canvas-color-disc/)。
37
36
 
38
37
  ```html
39
- <!-- unpkg，锁定当前版本（去掉 @1.4.0 即始终加载最新版）：
40
- https://unpkg.com/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js
38
+ <!-- unpkg，锁定当前版本（去掉 @1.4.1 即始终加载最新版）：
39
+ https://unpkg.com/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js
41
40
  jsDelivr 镜像（同一文件、同一版本）：
42
- https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js -->
43
- <script src="https://unpkg.com/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js"></script>
41
+ https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js -->
42
+ <script src="https://unpkg.com/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js"></script>
44
43
 
45
44
  <canvas-color-disc width="300" height="300"></canvas-color-disc>
46
45
 
@@ -50,7 +49,7 @@ Vue 2 与 Vue 3 产物来自同一份源码（`src/components/CanvasColorDisc.vu
50
49
  </script>
51
50
  ```
52
51
 
53
- 两个 CDN 也支持无路径的裸包地址——`https://unpkg.com/canvas-color-disc@1.4.0` 与 `https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0` 均直接指向该 UMD 文件（由 package.json 中的 `unpkg` / `jsdelivr` 字段指定）。
52
+ 两个 CDN 也支持无路径的裸包地址——`https://unpkg.com/canvas-color-disc@1.4.1` 与 `https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1` 均直接指向该 UMD 文件（由 package.json 中的 `unpkg` / `jsdelivr` 字段指定）。
54
53
 
55
54
  ### React
56
55
 
@@ -177,12 +176,12 @@ export default {
177
176
  ### 浏览器直接引入（Vue 版 UMD）
178
177
 
179
178
  ```html
180
- <!-- unpkg，锁定当前版本（去掉 @1.4.0 即始终加载最新版）；jsDelivr 镜像只需替换源前缀，版本保持一致：
181
- https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0/dist/style.css
182
- https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0/dist/canvas-color-disc.umd.js -->
183
- <link rel="stylesheet" href="https://unpkg.com/canvas-color-disc@1.4.0/dist/style.css">
179
+ <!-- unpkg，锁定当前版本（去掉 @1.4.1 即始终加载最新版）；jsDelivr 镜像只需替换源前缀，版本保持一致：
180
+ https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1/dist/style.css
181
+ https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1/dist/canvas-color-disc.umd.js -->
182
+ <link rel="stylesheet" href="https://unpkg.com/canvas-color-disc@1.4.1/dist/style.css">
184
183
  <script src="https://unpkg.com/vue@2.7.16/dist/vue.js"></script>
185
- <script src="https://unpkg.com/canvas-color-disc@1.4.0/dist/canvas-color-disc.umd.js"></script>
184
+ <script src="https://unpkg.com/canvas-color-disc@1.4.1/dist/canvas-color-disc.umd.js"></script>
186
185
 
187
186
  <script>
188
187
  // 未调用 Vue.use 时，也可直接作为组件选项使用
package/README.md CHANGED
@@ -5,7 +5,6 @@
5
5
  > A circular color picker built on Canvas, works on both desktop and mobile (Pointer Events). Available as a Vue 2 / Vue 3 component and as a framework-agnostic Web Component / vanilla JS class.
6
6
 
7
7
  [![Live Demo](https://img.shields.io/badge/Live%20Demo-online-2ea44f?logo=githubpages&logoColor=white)](https://zancheng.github.io/canvas-color-disc/)
8
- [![Open in StackBlitz](https://img.shields.io/badge/StackBlitz-Open%20in%20editor-1389FD?logo=stackblitz&logoColor=white)](https://stackblitz.com/github/zancheng/canvas-color-disc)
9
8
 
10
9
  ![preview](https://cdn.jsdelivr.net/gh/zancheng/canvas-color-disc@main/preview.png)
11
10
 
@@ -13,7 +12,7 @@
13
12
 
14
13
  | Setup | Import | Usage | Styles |
15
14
  | --- | --- | --- | --- |
16
- | Plain HTML | `<script src="https://unpkg.com/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js">` | Render `<canvas-color-disc>` and listen for the `change` event | auto-injected, no CSS import |
15
+ | Plain HTML | `<script src="https://unpkg.com/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js">` | Render `<canvas-color-disc>` and listen for the `change` event | auto-injected, no CSS import |
17
16
  | React | `import 'canvas-color-disc/vanilla'` | Same element; JSX props and `onchange` on React 19, a `ref` bridge on React 18 | auto-injected, no CSS import |
18
17
  | Vue 2 (`^2.5.0`) | `import CanvasColorDisc from 'canvas-color-disc/vue2'` | `v-model`: `value` / `input` | `canvas-color-disc/dist/style.css` |
19
18
  | Vue 3 (`^3.0.0`) | `import CanvasColorDisc from 'canvas-color-disc'` (or `canvas-color-disc/vue3`) | `v-model`: `modelValue` / `update:modelValue` | `canvas-color-disc/vue3/style.css` |
@@ -34,14 +33,14 @@ Works in plain HTML, React, Angular and anything else.
34
33
 
35
34
  ### Plain HTML
36
35
 
37
- Prefer to try it first? Open the [live demo](https://zancheng.github.io/canvas-color-disc/) or [edit and run it on StackBlitz](https://stackblitz.com/github/zancheng/canvas-color-disc).
36
+ Prefer to try it first? Open the [live demo](https://zancheng.github.io/canvas-color-disc/).
38
37
 
39
38
  ```html
40
- <!-- unpkg, pinned to the current version (drop @1.4.0 to always get the latest):
41
- https://unpkg.com/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js
39
+ <!-- unpkg, pinned to the current version (drop @1.4.1 to always get the latest):
40
+ https://unpkg.com/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js
42
41
  jsDelivr mirror (identical file, same version):
43
- https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js -->
44
- <script src="https://unpkg.com/canvas-color-disc@1.4.0/dist/vanilla/canvas-color-disc.umd.js"></script>
42
+ https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js -->
43
+ <script src="https://unpkg.com/canvas-color-disc@1.4.1/dist/vanilla/canvas-color-disc.umd.js"></script>
45
44
 
46
45
  <canvas-color-disc width="300" height="300"></canvas-color-disc>
47
46
 
@@ -51,7 +50,7 @@ Prefer to try it first? Open the [live demo](https://zancheng.github.io/canvas-c
51
50
  </script>
52
51
  ```
53
52
 
54
- Both CDNs also resolve the bare package URL — `https://unpkg.com/canvas-color-disc@1.4.0` and `https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0` — straight to that UMD file, thanks to the `unpkg` / `jsdelivr` fields in package.json.
53
+ Both CDNs also resolve the bare package URL — `https://unpkg.com/canvas-color-disc@1.4.1` and `https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1` — straight to that UMD file, thanks to the `unpkg` / `jsdelivr` fields in package.json.
55
54
 
56
55
  ### React
57
56
 
@@ -178,13 +177,13 @@ The component is registered as `CanvasColorDisc`, use it as `<canvas-color-disc
178
177
  ### Use via CDN (Vue 2 / Vue 3 UMD)
179
178
 
180
179
  ```html
181
- <!-- unpkg, pinned to the current version (drop @1.4.0 to always get the latest);
180
+ <!-- unpkg, pinned to the current version (drop @1.4.1 to always get the latest);
182
181
  for the jsDelivr mirror replace the origin and keep the same version:
183
- https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0/dist/style.css
184
- https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.0/dist/canvas-color-disc.umd.js -->
185
- <link rel="stylesheet" href="https://unpkg.com/canvas-color-disc@1.4.0/dist/style.css">
182
+ https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1/dist/style.css
183
+ https://cdn.jsdelivr.net/npm/canvas-color-disc@1.4.1/dist/canvas-color-disc.umd.js -->
184
+ <link rel="stylesheet" href="https://unpkg.com/canvas-color-disc@1.4.1/dist/style.css">
186
185
  <script src="https://unpkg.com/vue@2.7.16/dist/vue.js"></script>
187
- <script src="https://unpkg.com/canvas-color-disc@1.4.0/dist/canvas-color-disc.umd.js"></script>
186
+ <script src="https://unpkg.com/canvas-color-disc@1.4.1/dist/canvas-color-disc.umd.js"></script>
188
187
 
189
188
  <script>
190
189
  // Without Vue.use, it can also be used directly as a component option
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "canvas-color-disc",
3
- "version": "1.4.1",
3
+ "version": "1.4.2",
4
4
  "description": "Color disc realized by canvas",
5
5
  "private": false,
6
6
  "main": "dist/vue3/canvas-color-disc.umd.js",