@vunk/plus 1.2.2 → 1.3.1

package/components/tables-v1-checkbox/index.mjs

@@ -1,4 +1,4 @@
-import { computed, ref, watch, inject, isVNode, Comment, Fragment, shallowRef, watchEffect, provide, onBeforeUnmount, onBeforeMount, toRef, defineComponent, h, createVNode, resolveComponent, openBlock, createBlock, withCtx, mergeProps, toHandlers } from 'vue';
+import { computed, ref, watch, inject, isVNode, Comment, Fragment, shallowRef, watchEffect, provide, onBeforeUnmount, onBeforeMount, toRef, defineComponent, h, createVNode, resolveComponent, createBlock, openBlock, withCtx, mergeProps, toHandlers } from 'vue';
 import { _VkTabelsV1Ctx, VkTablesV1 } from '@vunk/plus/components/tables-v1';
 import { VkCheckRecordLogicProvider, VkCheckRecordLogic } from '@vunk/core';
 import { noop } from '@vunk/shared/function';
@@ -617,31 +617,203 @@ function createKey(prefix, suffix) {
   return prefix + (suffix === 'default' ? '' : suffix.replace(/^[a-z]/, startChar => startChar.toUpperCase()));
 }
 
+// src: https://www.w3schools.com/colors/colors_names.asp
 var colors = {
-    black: '#000',
-    silver: '#C0C0C0',
-    gray: '#808080',
-    white: '#FFF',
-    maroon: '#800000',
-    red: '#F00',
-    purple: '#800080',
-    fuchsia: '#F0F',
-    green: '#008000',
-    lime: '#0F0',
-    olive: '#808000',
-    yellow: '#FF0',
-    navy: '#000080',
-    blue: '#00F',
-    teal: '#008080',
-    aqua: '#0FF',
-    transparent: '#0000'
+    aliceblue: "#F0F8FF",
+    antiquewhite: "#FAEBD7",
+    aqua: "#0FF",
+    aquamarine: "#7FFFD4",
+    azure: "#F0FFFF",
+    beige: "#F5F5DC",
+    bisque: "#FFE4C4",
+    black: "#000",
+    blanchedalmond: "#FFEBCD",
+    blue: "#00F",
+    blueviolet: "#8A2BE2",
+    brown: "#A52A2A",
+    burlywood: "#DEB887",
+    cadetblue: "#5F9EA0",
+    chartreuse: "#7FFF00",
+    chocolate: "#D2691E",
+    coral: "#FF7F50",
+    cornflowerblue: "#6495ED",
+    cornsilk: "#FFF8DC",
+    crimson: "#DC143C",
+    cyan: "#0FF",
+    darkblue: "#00008B",
+    darkcyan: "#008B8B",
+    darkgoldenrod: "#B8860B",
+    darkgray: "#A9A9A9",
+    darkgrey: "#A9A9A9",
+    darkgreen: "#006400",
+    darkkhaki: "#BDB76B",
+    darkmagenta: "#8B008B",
+    darkolivegreen: "#556B2F",
+    darkorange: "#FF8C00",
+    darkorchid: "#9932CC",
+    darkred: "#8B0000",
+    darksalmon: "#E9967A",
+    darkseagreen: "#8FBC8F",
+    darkslateblue: "#483D8B",
+    darkslategray: "#2F4F4F",
+    darkslategrey: "#2F4F4F",
+    darkturquoise: "#00CED1",
+    darkviolet: "#9400D3",
+    deeppink: "#FF1493",
+    deepskyblue: "#00BFFF",
+    dimgray: "#696969",
+    dimgrey: "#696969",
+    dodgerblue: "#1E90FF",
+    firebrick: "#B22222",
+    floralwhite: "#FFFAF0",
+    forestgreen: "#228B22",
+    fuchsia: "#F0F",
+    gainsboro: "#DCDCDC",
+    ghostwhite: "#F8F8FF",
+    gold: "#FFD700",
+    goldenrod: "#DAA520",
+    gray: "#808080",
+    grey: "#808080",
+    green: "#008000",
+    greenyellow: "#ADFF2F",
+    honeydew: "#F0FFF0",
+    hotpink: "#FF69B4",
+    indianred: "#CD5C5C",
+    indigo: "#4B0082",
+    ivory: "#FFFFF0",
+    khaki: "#F0E68C",
+    lavender: "#E6E6FA",
+    lavenderblush: "#FFF0F5",
+    lawngreen: "#7CFC00",
+    lemonchiffon: "#FFFACD",
+    lightblue: "#ADD8E6",
+    lightcoral: "#F08080",
+    lightcyan: "#E0FFFF",
+    lightgoldenrodyellow: "#FAFAD2",
+    lightgray: "#D3D3D3",
+    lightgrey: "#D3D3D3",
+    lightgreen: "#90EE90",
+    lightpink: "#FFB6C1",
+    lightsalmon: "#FFA07A",
+    lightseagreen: "#20B2AA",
+    lightskyblue: "#87CEFA",
+    lightslategray: "#778899",
+    lightslategrey: "#778899",
+    lightsteelblue: "#B0C4DE",
+    lightyellow: "#FFFFE0",
+    lime: "#0F0",
+    limegreen: "#32CD32",
+    linen: "#FAF0E6",
+    magenta: "#F0F",
+    maroon: "#800000",
+    mediumaquamarine: "#66CDAA",
+    mediumblue: "#0000CD",
+    mediumorchid: "#BA55D3",
+    mediumpurple: "#9370DB",
+    mediumseagreen: "#3CB371",
+    mediumslateblue: "#7B68EE",
+    mediumspringgreen: "#00FA9A",
+    mediumturquoise: "#48D1CC",
+    mediumvioletred: "#C71585",
+    midnightblue: "#191970",
+    mintcream: "#F5FFFA",
+    mistyrose: "#FFE4E1",
+    moccasin: "#FFE4B5",
+    navajowhite: "#FFDEAD",
+    navy: "#000080",
+    oldlace: "#FDF5E6",
+    olive: "#808000",
+    olivedrab: "#6B8E23",
+    orange: "#FFA500",
+    orangered: "#FF4500",
+    orchid: "#DA70D6",
+    palegoldenrod: "#EEE8AA",
+    palegreen: "#98FB98",
+    paleturquoise: "#AFEEEE",
+    palevioletred: "#DB7093",
+    papayawhip: "#FFEFD5",
+    peachpuff: "#FFDAB9",
+    peru: "#CD853F",
+    pink: "#FFC0CB",
+    plum: "#DDA0DD",
+    powderblue: "#B0E0E6",
+    purple: "#800080",
+    rebeccapurple: "#663399",
+    red: "#F00",
+    rosybrown: "#BC8F8F",
+    royalblue: "#4169E1",
+    saddlebrown: "#8B4513",
+    salmon: "#FA8072",
+    sandybrown: "#F4A460",
+    seagreen: "#2E8B57",
+    seashell: "#FFF5EE",
+    sienna: "#A0522D",
+    silver: "#C0C0C0",
+    skyblue: "#87CEEB",
+    slateblue: "#6A5ACD",
+    slategray: "#708090",
+    slategrey: "#708090",
+    snow: "#FFFAFA",
+    springgreen: "#00FF7F",
+    steelblue: "#4682B4",
+    tan: "#D2B48C",
+    teal: "#008080",
+    thistle: "#D8BFD8",
+    tomato: "#FF6347",
+    turquoise: "#40E0D0",
+    violet: "#EE82EE",
+    wheat: "#F5DEB3",
+    white: "#FFF",
+    whitesmoke: "#F5F5F5",
+    yellow: "#FF0",
+    yellowgreen: "#9ACD32",
+    transparent: "#0000"
 };
 
+// All the algorithms credit to https://stackoverflow.com/questions/36721830/convert-hsl-to-rgb-and-hex/54014428#54014428
+// original author: Kamil Kiełczewski
+/**
+ * @param h 360
+ * @param s 100
+ * @param l 100
+ * @returns [h, s, v] 360, 100, 100
+ */
+/**
+ * @param h 360
+ * @param s 100
+ * @param v 100
+ * @returns [r, g, b] 255, 255, 255
+ */
+function hsv2rgb(h, s, v) {
+    s /= 100;
+    v /= 100;
+    let f = (n, k = (n + h / 60) % 6) => v - v * s * Math.max(Math.min(k, 4 - k, 1), 0);
+    return [f(5) * 255, f(3) * 255, f(1) * 255];
+}
+/**
+ * @param h 360
+ * @param s 100
+ * @param l 100
+ * @returns [255, 255, 255]
+ */
+function hsl2rgb(h, s, l) {
+    s /= 100;
+    l /= 100;
+    let a = s * Math.min(l, 1 - l);
+    let f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+    return [f(0) * 255, f(8) * 255, f(4) * 255];
+}
+
 const prefix = '^\\s*';
 const suffix = '\\s*$';
+const percent = '\\s*((\\.\\d+)|(\\d+(\\.\\d*)?))%\\s*'; // 4 offset
 const float = '\\s*((\\.\\d+)|(\\d+(\\.\\d*)?))\\s*'; // 4 offset
 const hex = '([0-9A-Fa-f])';
 const dhex = '([0-9A-Fa-f]{2})';
+const hslRegex = new RegExp(`${prefix}hsl\\s*\\(${float},${percent},${percent}\\)${suffix}`);
+const hsvRegex = new RegExp(`${prefix}hsv\\s*\\(${float},${percent},${percent}\\)${suffix}`);
+const hslaRegex = new RegExp(`${prefix}hsla\\s*\\(${float},${percent},${percent},${float}\\)${suffix}`);
+const hsvaRegex = new RegExp(`${prefix}hsva\\s*\\(${float},${percent},${percent},${float}\\)${suffix}`);
 const rgbRegex = new RegExp(`${prefix}rgb\\s*\\(${float},${float},${float}\\)${suffix}`);
 const rgbaRegex = new RegExp(`${prefix}rgba\\s*\\(${float},${float},${float},${float}\\)${suffix}`);
 const sHexRegex = new RegExp(`${prefix}#${hex}${hex}${hex}${suffix}`);
@@ -651,9 +823,61 @@ const hexaRegex = new RegExp(`${prefix}#${dhex}${dhex}${dhex}${dhex}${suffix}`);
 function parseHex(value) {
     return parseInt(value, 16);
 }
+/**
+ * Convert color string to hsla array
+ * @param color format like hsl(180, 100%, 100%), hsla(180, 100%, 100%, 1)
+ * @returns
+ */
+function hsla(color) {
+    try {
+        let i;
+        if ((i = hslaRegex.exec(color))) {
+            return [
+                roundDeg(i[1]),
+                roundPercent(i[5]),
+                roundPercent(i[9]),
+                roundAlpha(i[13])
+            ];
+        }
+        else if ((i = hslRegex.exec(color))) {
+            return [roundDeg(i[1]), roundPercent(i[5]), roundPercent(i[9]), 1];
+        }
+        throw new Error(`[seemly/hsla]: Invalid color value ${color}.`);
+    }
+    catch (e) {
+        throw e;
+    }
+}
+/**
+ * Convert color string to hsva array
+ * @param color format like hsv(180, 100%, 100%), hsva(180, 100%, 100%, 1)
+ * @returns
+ */
+function hsva(color) {
+    try {
+        let i;
+        if ((i = hsvaRegex.exec(color))) {
+            return [
+                roundDeg(i[1]),
+                roundPercent(i[5]),
+                roundPercent(i[9]),
+                roundAlpha(i[13])
+            ];
+        }
+        else if ((i = hsvRegex.exec(color))) {
+            return [roundDeg(i[1]), roundPercent(i[5]), roundPercent(i[9]), 1];
+        }
+        throw new Error(`[seemly/hsva]: Invalid color value ${color}.`);
+    }
+    catch (e) {
+        throw e;
+    }
+}
 /**
  * Convert color string to rgba array.
- * @param color format like #000[0], #000000[00], rgb(0, 0, 0), rgba(0, 0, 0, 0) and basic color keywords https://www.w3.org/TR/css-color-3/#html4 and transparent
+ * @param color format like #000[0], #000000[00], rgb(0, 0, 0),
+ * rgba(0, 0, 0, 0), hsl(a) color, hsv(a) color and color keywords and
+ * transparent
  * @returns
  */
 function rgba(color) {
@@ -700,6 +924,14 @@ function rgba(color) {
         else if (color in colors) {
             return rgba(colors[color]);
         }
+        else if (hslRegex.test(color) || hslaRegex.test(color)) {
+            const [h, s, l, a] = hsla(color);
+            return [...hsl2rgb(h, s, l), a];
+        }
+        else if (hsvRegex.test(color) || hsvaRegex.test(color)) {
+            const [h, s, v, a] = hsva(color);
+            return [...hsv2rgb(h, s, v), a];
+        }
         throw new Error(`[seemly/rgba]: Invalid color value ${color}.`);
     }
     catch (e) {
@@ -727,7 +959,7 @@ function composite(background, overlay) {
 }
 function changeColor(base, options) {
     const [r, g, b, a = 1] = Array.isArray(base) ? base : rgba(base);
-    if (options.alpha) {
+    if (typeof options.alpha === 'number') {
         return stringifyRgba(r, g, b, options.alpha);
     }
     return stringifyRgba(r, g, b, a);
@@ -745,6 +977,14 @@ function roundAlpha(value) {
         return 0;
     return v;
 }
+function roundDeg(value) {
+    const v = Math.round(Number(value));
+    if (v >= 360)
+        return 0;
+    if (v < 0)
+        return 0;
+    return v;
+}
 function roundChannel(value) {
     const v = Math.round(Number(value));
     if (v > 255)
@@ -753,6 +993,14 @@ function roundChannel(value) {
         return 0;
     return v;
 }
+function roundPercent(value) {
+    const v = Math.round(Number(value));
+    if (v > 100)
+        return 100;
+    if (v < 0)
+        return 0;
+    return v;
+}
 function toRgbaString(base) {
     const [r, g, b] = base;
     if (3 in base) {
@@ -3316,22 +3564,11 @@ const base = {
   // disabled placeholder
   alphaClose: '0.6',
   alphaDisabled: '0.5',
-  alphaDisabledInput: '0.02',
-  alphaPending: '0.05',
-  alphaTablePending: '0.02',
-  alphaPressed: '0.07',
   alphaAvatar: '0.2',
-  alphaRail: '0.14',
   alphaProgressRail: '.08',
-  alphaBorder: '0.12',
-  alphaDivider: '0.06',
   alphaInput: '0',
-  alphaAction: '0.02',
-  alphaTab: '0.04',
   alphaScrollbar: '0.25',
   alphaScrollbarHover: '0.4',
-  alphaCode: '0.05',
-  alphaTag: '0.02',
   // primary
   primaryHover: '#36ad6a',
   primaryDefault: '#18a058',
@@ -3540,7 +3777,6 @@ function self$1(vars) {
   });
 }
 const radioLight = {
-  name: 'Radio',
   common: derived,
   self: self$1
 };
@@ -4134,7 +4370,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     /* STABLE */
   }, 8, ["model-value", "oid-field"]);
 }
-var VkTablesV1Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/vunk-plus/vunk-plus/packages/components/tables-v1-checkbox/src/index.vue"]]);
+var VkTablesV1Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 
 var types = /*#__PURE__*/Object.freeze({
     __proto__: null