@opentiny/vue-renderless 3.10.7 → 3.11.0

package/cascader-panel/vue.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import {
   initStore,
   checkNode,
@@ -78,7 +78,15 @@ const initState = ({ reactive, props, computed, parent, slots }) => {
   });
   return state;
 };
-const initApi = ({ api: api2, state, menus, props, nextTick, parent, emit }) => {
+const initApi = ({
+  api: api2,
+  state,
+  menus,
+  props,
+  nextTick,
+  parent,
+  emit
+}) => {
   Object.assign(api2, {
     state,
     isLeaf: isLeaf(),
@@ -105,7 +113,12 @@ const initApi = ({ api: api2, state, menus, props, nextTick, parent, emit }) =>
     handleKeyDown: handleKeyDown({ api: api2, emit, menus })
   });
 };
-const initWatch = ({ watch, state, props, api: api2 }) => {
+const initWatch = ({
+  watch,
+  state,
+  props,
+  api: api2
+}) => {
   watch(
     () => props.options,
     () => api2.initStore(),

package/cascader-select/index.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 const normalRange = (value, min, max) => value < min ? min : value > max ? max : value;
 const sliceValue = (value, min, max, count, cycleRoll) => {
   value = normalRange(value, min, max);

package/cascader-select/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   init,
   handleTouchstart,

package/cell/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const api = ["state"];
 const renderless = (props, { reactive, computed, inject }, { parent }) => {
   parent.tinyForm = parent.tinyForm || inject("form", null);

package/chart-bar/index.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated, getStackMap, get, set, cloneDeep } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { isNull } from "../common/type";

package/chart-boxplot/index.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated, htmlHandler, getLegend } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getXAxis = (args) => {
@@ -77,6 +77,7 @@ const getTooltip = (args) => {
   const { tooltipFormatter, tooltipLabel } = args;
   return {
     trigger: "item",
+    // axis item
     formatter(items) {
       if (tooltipFormatter) {
         return tooltipFormatter.apply(null, arguments);

package/chart-candle/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { getFormated } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { isNull } from "../common/type";

package/chart-core/deps/constants.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 const sf = () => ({ show: false });
 const DEFAULT_THEME = {
   categoryAxis: { axisLine: sf(), axisTick: sf(), splitLine: sf() },

package/chart-core/deps/numerify.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 let ABBR = { th: 3, mi: 6, bi: 9, tr: 12 };
 let abbrLabel = { th: "k", mi: "m", bi: "b", tr: "t" };
 let DEFAULT_OPTIONS = { zeroFormat: null, nullFormat: null, defaultFormat: "0,0", scalePercentBy100: true, abbrLabel };

package/chart-core/deps/utils.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../../chunk-PKUHTIDK.js";
+} from "../../chunk-G2ADBYYC.js";
 import { extend, copyArray } from "../../common/object";
 import { isObject, typeOf as getType, isNull } from "../../common/type";
 import _debounce from "../../common/deps/debounce";

package/chart-core/index.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { on, off } from "../common/deps/dom";
 import {
   DEFAULT_COLORS,

package/chart-core/modules/animation.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 var animation_default = ({ options, animation }) => {
   if (!animation) {
     return;

package/chart-core/modules/extend.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../../chunk-PKUHTIDK.js";
+} from "../../chunk-G2ADBYYC.js";
 import { set, isObject, merge } from "../deps/utils";
 const isArr = Array.isArray;
 var extend_default = ({ options, extend }) => {

package/chart-core/modules/mark.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 var mark_default = (seriesItem, marks) => {
   Object.keys(marks).forEach((key) => {
     if (marks[key]) {

package/chart-core/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   computedCanvasStyle,
   computedChartColor,

package/chart-funnel/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { getFormated } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { isNull } from "../common/type";

package/chart-gauge/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { getFormated, isObject } from "../chart-core/deps/utils";
 import { isNull } from "../common/type";
 import { itemLabel, itemContent } from "../chart-core/deps/constants";

package/chart-graph/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getTooltip = () => ({
   trigger: "item",

package/chart-heatmap/index.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated, getBmap, getAmap, getMapJSON } from "../chart-core/deps/utils";
 import { HEAT_MAP_COLOR, itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getAxisList = (rows, label) => {

package/chart-line/index.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated, getStackMap, getLegend, hexToRgb, set } from "../chart-core/deps/utils";
 import { isNull } from "../common/type";
 import { itemPoint, itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "../chart-core/deps/constants";

package/chart-liquidfill/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { getFormated, isObject } from "../chart-core/deps/utils";
 import { itemLabel, itemContent } from "../chart-core/deps/constants";
 const isArr = Array.isArray;

package/chart-map/index.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated, getMapJSON, getLegend as getLegendMap } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { isNull } from "../common/type";

package/chart-pie/index.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated, setArrayValue, cloneDeep } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { isNull } from "../common/type";

package/chart-radar/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { getFormated } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { isNull } from "../common/type";

package/chart-sankey/index.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { isNull } from "../common/type";

package/chart-scatter/index.js

@@ -1,6 +1,6 @@
 import {
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated, hexToRgb } from "../chart-core/deps/utils";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 import { line } from "../chart-line";

package/chart-sunburst/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { itemPoint, itemLabel, itemContent } from "../chart-core/deps/constants";
 const getTooltip = () => ({
   trigger: "item",

package/chart-tree/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { isObject } from "../chart-core/deps/utils";
 import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "../chart-core/deps/constants";
 const getTreeLegend = (args) => {

package/chart-waterfall/index.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../chunk-PKUHTIDK.js";
+} from "../chunk-G2ADBYYC.js";
 import { getFormated } from "../chart-core/deps/utils";
 import { isNull } from "../common/type";
 import { itemLabel, itemContent, SAAS_DEFAULT_COLORS_10 } from "../chart-core/deps/constants";

package/chart-wordcloud/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { random } from "../common/string";
 import { itemLabel, itemContent } from "../chart-core/deps/constants";
 const isArr = Array.isArray;

package/checkbox/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { isNull } from "../common/type";
 const addToStore = ({ state, props }) => () => {
   if (Array.isArray(state.model) && !state.model.includes(props.label)) {
@@ -15,7 +15,14 @@ const removeFromStore = ({ state, props }) => () => {
     state.model = props.falseLabel !== void 0 && props.falseLabel;
   }
 };
-const handleChange = ({ state, props, emit, nextTick, dispatch, constants }) => (event) => {
+const handleChange = ({
+  state,
+  props,
+  emit,
+  nextTick,
+  dispatch,
+  constants
+}) => (event) => {
   if (state.isLimitExceeded) {
     return;
   }
@@ -35,7 +42,12 @@ const computedGetModelGet = ({ state, props }) => () => {
   const model = state.isGroup ? state.store : props.modelValue !== void 0 ? props.modelValue : state.selfModel;
   return isNull(model) ? [] : model;
 };
-const computedGetModelSet = ({ state, dispatch, emit, constants }) => (value) => {
+const computedGetModelSet = ({
+  state,
+  dispatch,
+  emit,
+  constants
+}) => (value) => {
   if (state.isGroup) {
     state.isLimitExceeded = false;
     state.checkboxGroup.min !== void 0 && value.length < state.checkboxGroup.min && (state.isLimitExceeded = true);
@@ -54,6 +66,7 @@ const computedIsChecked = ({ state, props }) => () => {
   } else if (!isNull(state.model)) {
     return state.model === props.trueLabel;
   }
+  return false;
 };
 const computedIsGroup = ({ state, parent, constants }) => () => {
   let parentObj = parent.$parent;
@@ -83,7 +96,11 @@ const mounted = ({ props, emit, api, parent }) => () => {
   props.indeterminate && parent.$el.setAttribute("aria-controls", props.controls);
   emit("complete", true);
 };
-const toggleEvent = ({ parent, props, type }) => {
+const toggleEvent = ({
+  parent,
+  props,
+  type
+}) => {
   const inputEl = parent.$el;
   for (let ev in props.events) {
     inputEl[type + "EventListener"](ev, props.events[ev]);
@@ -94,12 +111,12 @@ const computedIsGroupDisplayOnly = ({ state }) => () => state.isGroup && (state.
 const computedDisplayLabel = ({ state, props, t }) => () => {
   state.showLabel = true;
   if (props.trueLabel !== void 0 && props.falseLabel !== void 0) {
-    return props.modelValue ? props.trueLabel : props.falseLabel;
+    return props.modelValue ? String(props.trueLabel) : String(props.falseLabel);
   } else {
     return props.modelValue ? t("yes") : t("no");
   }
 };
-const computedIsShowText = ({ props }) => () => props.text || props.label || !isNull(props.text) || !isNull(props.label);
+const computedIsShowText = ({ props }) => () => !isNull(props.text) || !isNull(props.label);
 const computedShowText = ({ props }) => () => {
   if (props.text || !isNull(props.text)) {
     return props.text;

package/checkbox/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   addToStore,
   removeFromStore,
@@ -27,7 +27,9 @@ const initState = ({ reactive, computed, parent, api: api2, inject, props }) =>
     vertical: inject("vertical", null),
     focus: false,
     selfModel: false,
+    showLabel: false,
     isLimitExceeded: false,
+    checkboxGroup: null,
     store: computed(() => api2.computedStore()),
     isGroup: computed(() => api2.computedIsGroup()),
     isChecked: computed(() => api2.computedIsChecked()),
@@ -49,7 +51,18 @@ const initState = ({ reactive, computed, parent, api: api2, inject, props }) =>
   });
   return state;
 };
-const initApi = ({ api: api2, state, dispatch, props, parent, constants, formItemSize, emit, nextTick, t }) => {
+const initApi = ({
+  api: api2,
+  state,
+  dispatch,
+  props,
+  parent,
+  constants,
+  formItemSize,
+  emit,
+  nextTick,
+  t
+}) => {
   Object.assign(api2, {
     state,
     addToStore: addToStore({ state, props }),

package/checkbox-button/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const handleChange = ({ state, props, emit, nextTick, dispatch, constants }) => (event) => {
   if (state.isLimitExceeded) {
     return;

package/checkbox-button/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import {
   handleChange,
   computedGetModelGet,

package/checkbox-group/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const computedFormItemSize = (props) => () => (props.formItem || {}).formItemSize;
 const computedCheckboxGroupSize = ({ props, formItemSize }) => () => props.size || formItemSize.value;
 export {

package/checkbox-group/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { computedFormItemSize, computedCheckboxGroupSize } from "./index";
 const api = ["state"];
 const renderless = (props, { computed, reactive, watch }, { dispatch, constants }) => {

package/col/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const setSubitemAttrValue = ({ className, item, value }) => {
   if (value) {
     if (typeof value === "number") {
@@ -28,16 +28,17 @@ const setGlobalAttrValue = ({ attr, className, value }) => {
   className[`col-xl-${attr}`] = value;
 };
 const getClassName = ({ api, props }) => () => {
-  const span = props.span;
+  const multiple = 2;
+  const span = props.span * multiple;
   const offset = props.offset;
   const push = props.move ? props.move : 0;
   const pull = props.move ? 0 : -props.move;
   const subitems = {
-    xs: props.xs,
-    sm: props.sm,
-    md: props.md,
-    lg: props.lg,
-    xl: props.xl
+    xs: props.xs * multiple,
+    sm: props.sm * multiple,
+    md: props.md * multiple,
+    lg: props.lg * multiple,
+    xl: props.xl * multiple
   };
   const className = {};
   const result = [];

package/col/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { setSubitemAttrValue, setGlobalAttrValue, getClassName, getStyle, row } from "./index";
 const api = ["state"];
 const renderless = (props, { computed, reactive }, { parent }) => {

package/collapse/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const setActiveNames = ({ emit, props, state }) => (activeNames) => {
   activeNames = [].concat(activeNames);
   const value = props.accordion ? activeNames[0] : activeNames;

package/collapse/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { setActiveNames, handleItemClick } from "./index";
 const api = ["state"];
 const renderless = (props, { reactive, watch }, { parent, emit, constants }) => {
@@ -16,7 +16,7 @@ const renderless = (props, { reactive, watch }, { parent, emit, constants }) =>
     (value) => {
       state.activeNames = value || value === 0 ? [].concat(value) : [];
     },
-    { immediate: true }
+    { immediate: true, deep: true }
   );
   parent.$on(eventName, api2.handleItemClick);
   return api2;

package/collapse-item/index.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 const handleFocus = ({ state, interval }) => () => {
   setTimeout(() => {
     if (!state.isClick) {

package/collapse-item/vue.js

@@ -1,4 +1,4 @@
-import "../chunk-PKUHTIDK.js";
+import "../chunk-G2ADBYYC.js";
 import { handleFocus, handleEnterClick, handleHeaderClick } from "./index";
 import { guid } from "../common/string";
 const api = ["state", "isActive", "handleFocus", "handleEnterClick", "handleHeaderClick"];

package/color-picker/alpha-select/index.js

@@ -0,0 +1,24 @@
+import "../../chunk-G2ADBYYC.js";
+const calcLeftByAlpha = (wrapper, thumb, alpha) => {
+  return Math.round(
+    alpha * (wrapper.offsetWidth - thumb.offsetWidth / 2) / 100
+  );
+};
+const updateThumb = (alpha, thumb, wrapper) => {
+  thumb.style.left = `${calcLeftByAlpha(wrapper, thumb, alpha)}px`;
+};
+const onDrag = (event, bar, thumb, alpha) => {
+  const rect = bar.value.getBoundingClientRect();
+  const { clientX } = event;
+  let left = clientX - rect.left;
+  left = Math.max(thumb.value.offsetWidth / 2, left);
+  left = Math.min(left, rect.width - thumb.value.offsetWidth / 2);
+  alpha.value = Math.round(
+    (left - thumb.value.offsetWidth / 2) / (rect.width - thumb.value.offsetWidth) * 100
+  );
+};
+export {
+  calcLeftByAlpha,
+  onDrag,
+  updateThumb
+};

package/color-picker/alpha-select/vue.js

@@ -0,0 +1,58 @@
+import "../../chunk-G2ADBYYC.js";
+import Color from "../utils/color";
+import { draggable } from "../utils/use-drag";
+import { onDrag, updateThumb } from ".";
+const api = ["state", "color", "slider", "alphaWrapper", "alphaThumb"];
+const renderless = (props, context, { emit }) => {
+  const hex = props.color;
+  const color = new Color(hex, props.alpha);
+  const [rr, gg, bb] = color.getRGB();
+  const r = context.ref(rr);
+  const g = context.ref(gg);
+  const b = context.ref(bb);
+  const slider = context.ref();
+  const alphaWrapper = context.ref();
+  const alphaThumb = context.ref();
+  const alpha = context.ref(color.get("a"));
+  context.watch(() => props.color, (hex2) => {
+    color.reset(hex2);
+    const [rr2, gg2, bb2] = color.getRGB();
+    r.value = rr2;
+    g.value = gg2;
+    b.value = bb2;
+  });
+  context.watch(alpha, (newAlpha) => {
+    updateThumb(newAlpha, alphaThumb.value, alphaWrapper.value);
+    emit("alpha-update", alpha.value);
+  });
+  const background = context.computed(() => {
+    return `linear-gradient(to right, rgba(${r.value}, ${g.value}, ${b.value}, 0) 0%, rgba(${r.value}, ${g.value}, ${b.value}, 1) 100%)`;
+  });
+  const state = context.reactive({
+    background,
+    hex
+  });
+  const api2 = {
+    state,
+    color: props.color,
+    slider,
+    alphaWrapper,
+    alphaThumb
+  };
+  context.onMounted(() => {
+    updateThumb(alpha.value, alphaThumb.value, slider.value);
+    draggable(slider.value, {
+      drag(event) {
+        onDrag(event, slider, alphaThumb, alpha);
+      },
+      start(event) {
+        onDrag(event, slider, alphaThumb, alpha);
+      }
+    });
+  });
+  return api2;
+};
+export {
+  api,
+  renderless
+};