vft 0.0.374 → 0.0.375

package/lib/components/checkbox/composables/use-checkbox-event.cjs

@@ -1 +1,65 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../form/index.cjs");require("@vueuse/core");require("@vft/utils");const q=require("../../../utils/error.cjs");require("../../config-provider/hooks/use-global-config.cjs");const a=require("vue");require("lodash-es");const k=require("../constants.cjs"),C=require("../../form/hooks/use-form-item.cjs"),E=(t,{model:u,isLimitExceeded:c,hasOwnLabel:i,isDisabled:l,isLabeledByFormItem:s})=>{const v=a.inject(k.checkboxGroupContextKey,void 0),{formItem:h}=C.useFormItem(),{emit:o}=a.getCurrentInstance();function r(e){return e===t.trueValue||e===!0?t.trueValue??!0:t.falseValue??!1}function f(e,n){o("change",r(e),n)}function g(e){if(c.value)return;const n=e.target;o("change",r(n.checked),e)}async function d(e){c.value||!i.value&&!l.value&&s.value&&(e.composedPath().some(b=>b.tagName==="LABEL")||(u.value=r([!1,t.falseValue].includes(u.value)),await a.nextTick(),f(u.value,e)))}const m=a.computed(()=>v?.validateEvent||t.validateEvent);return a.watch(()=>t.modelValue,()=>{m.value&&h?.validate("change").catch(e=>q.debugWarn(e))}),{handleChange:g,onClickRoot:d}};exports.useCheckboxEvent=E;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../form/index.cjs");
+require("@vueuse/core");
+require("@vft/utils");
+const error = require("../../../utils/error.cjs");
+require("../../config-provider/hooks/use-global-config.cjs");
+const vue = require("vue");
+require("lodash-es");
+const constants = require("../constants.cjs");
+const useFormItem = require("../../form/hooks/use-form-item.cjs");
+const useCheckboxEvent = (props, {
+  model,
+  isLimitExceeded,
+  hasOwnLabel,
+  isDisabled,
+  isLabeledByFormItem
+}) => {
+  const checkboxGroup = vue.inject(constants.checkboxGroupContextKey, void 0);
+  const { formItem } = useFormItem.useFormItem();
+  const { emit } = vue.getCurrentInstance();
+  function getLabeledValue(value) {
+    return value === props.trueValue || value === true ? props.trueValue ?? true : props.falseValue ?? false;
+  }
+  function emitChangeEvent(checked, e) {
+    emit("change", getLabeledValue(checked), e);
+  }
+  function handleChange(e) {
+    if (isLimitExceeded.value) return;
+    const target = e.target;
+    emit("change", getLabeledValue(target.checked), e);
+  }
+  async function onClickRoot(e) {
+    if (isLimitExceeded.value) return;
+    if (!hasOwnLabel.value && !isDisabled.value && isLabeledByFormItem.value) {
+      const eventTargets = e.composedPath();
+      const hasLabel = eventTargets.some(
+        (item) => item.tagName === "LABEL"
+      );
+      if (!hasLabel) {
+        model.value = getLabeledValue(
+          [false, props.falseValue].includes(model.value)
+        );
+        await vue.nextTick();
+        emitChangeEvent(model.value, e);
+      }
+    }
+  }
+  const validateEvent = vue.computed(
+    () => checkboxGroup?.validateEvent || props.validateEvent
+  );
+  vue.watch(
+    () => props.modelValue,
+    () => {
+      if (validateEvent.value) {
+        formItem?.validate("change").catch((err) => error.debugWarn(err));
+      }
+    }
+  );
+  return {
+    handleChange,
+    onClickRoot
+  };
+};
+exports.useCheckboxEvent = useCheckboxEvent;

package/lib/components/checkbox/composables/use-checkbox-model.cjs

@@ -1 +1,33 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("@vft/utils"),i=require("../../../constants/event.cjs"),e=require("vue"),a=require("../constants.cjs"),d=l=>{const n=e.ref(!1),{emit:r}=e.getCurrentInstance(),t=e.inject(a.checkboxGroupContextKey,void 0),s=e.computed(()=>c.isUndefined(t)===!1),u=e.ref(!1);return{model:e.computed({get(){return s.value?t?.modelValue?.value:l.modelValue??n.value},set(o){s.value&&c.isArray(o)?(u.value=t?.max?.value!==void 0&&o.length>t?.max.value,u.value===!1&&t?.changeEvent?.(o)):(r(i.UPDATE_MODEL_EVENT,o),n.value=o)}}),isGroup:s,isLimitExceeded:u}};exports.useCheckboxModel=d;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utils = require("@vft/utils");
+const event = require("../../../constants/event.cjs");
+const vue = require("vue");
+const constants = require("../constants.cjs");
+const useCheckboxModel = (props) => {
+  const selfModel = vue.ref(false);
+  const { emit } = vue.getCurrentInstance();
+  const checkboxGroup = vue.inject(constants.checkboxGroupContextKey, void 0);
+  const isGroup = vue.computed(() => utils.isUndefined(checkboxGroup) === false);
+  const isLimitExceeded = vue.ref(false);
+  const model = vue.computed({
+    get() {
+      return isGroup.value ? checkboxGroup?.modelValue?.value : props.modelValue ?? selfModel.value;
+    },
+    set(val) {
+      if (isGroup.value && utils.isArray(val)) {
+        isLimitExceeded.value = checkboxGroup?.max?.value !== void 0 && val.length > checkboxGroup?.max.value;
+        isLimitExceeded.value === false && checkboxGroup?.changeEvent?.(val);
+      } else {
+        emit(event.UPDATE_MODEL_EVENT, val);
+        selfModel.value = val;
+      }
+    }
+  });
+  return {
+    model,
+    isGroup,
+    isLimitExceeded
+  };
+};
+exports.useCheckboxModel = useCheckboxModel;

package/lib/components/checkbox/composables/use-checkbox-status.cjs

@@ -1 +1,46 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@vft/utils");require("../../form/index.cjs");const b=require("lodash-es"),t=require("vue"),h=require("../constants.cjs"),r=require("../../form/hooks/use-form-common-props.cjs"),f=(u,c,{model:n})=>{const s=t.inject(h.checkboxGroupContextKey,void 0),i=t.ref(!1),l=t.computed(()=>{const e=n.value;return o.isBoolean(e)?e:o.isArray(e)?o.isObject(u.value)?e.map(t.toRaw).some(v=>b.isEqual(v,u.value)):e.map(t.toRaw).includes(u.value):e!=null?e===u.trueValue:!!e}),a=r.useFormSize(t.computed(()=>s?.size?.value),{prop:!0}),d=r.useFormSize(t.computed(()=>s?.size?.value)),m=t.computed(()=>!!(c.default||u.value||u.label));return{checkboxButtonSize:a,isChecked:l,isFocused:i,checkboxSize:d,hasOwnLabel:m}};exports.useCheckboxStatus=f;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utils = require("@vft/utils");
+require("../../form/index.cjs");
+const lodashEs = require("lodash-es");
+const vue = require("vue");
+const constants = require("../constants.cjs");
+const useFormCommonProps = require("../../form/hooks/use-form-common-props.cjs");
+const useCheckboxStatus = (props, slots, { model }) => {
+  const checkboxGroup = vue.inject(constants.checkboxGroupContextKey, void 0);
+  const isFocused = vue.ref(false);
+  const isChecked = vue.computed(() => {
+    const value = model.value;
+    if (utils.isBoolean(value)) {
+      return value;
+    } else if (utils.isArray(value)) {
+      if (utils.isObject(props.value)) {
+        return value.map(vue.toRaw).some((o) => lodashEs.isEqual(o, props.value));
+      } else {
+        return value.map(vue.toRaw).includes(props.value);
+      }
+    } else if (value !== null && value !== void 0) {
+      return value === props.trueValue;
+    } else {
+      return !!value;
+    }
+  });
+  const checkboxButtonSize = useFormCommonProps.useFormSize(
+    vue.computed(() => checkboxGroup?.size?.value),
+    {
+      prop: true
+    }
+  );
+  const checkboxSize = useFormCommonProps.useFormSize(vue.computed(() => checkboxGroup?.size?.value));
+  const hasOwnLabel = vue.computed(() => {
+    return !!(slots.default || props.value || props.label);
+  });
+  return {
+    checkboxButtonSize,
+    isChecked,
+    isFocused,
+    checkboxSize,
+    hasOwnLabel
+  };
+};
+exports.useCheckboxStatus = useCheckboxStatus;

package/lib/components/checkbox/composables/use-checkbox.cjs

@@ -1 +1,60 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("@vft/utils");require("../../form/index.cjs");const I=require("./use-checkbox-disabled.cjs"),v=require("./use-checkbox-event.cjs"),S=require("./use-checkbox-model.cjs"),q=require("./use-checkbox-status.cjs"),r=require("../../form/hooks/use-form-item.cjs"),f=(e,{model:t})=>{function s(){C.isArray(t.value)&&!t.value.includes(e.value)?t.value.push(e.value):t.value=e.trueValue||!0}e.checked&&s()},F=(e,t)=>{const{formItem:s}=r.useFormItem(),{model:u,isGroup:a,isLimitExceeded:l}=S.useCheckboxModel(e),{isFocused:b,isChecked:c,checkboxButtonSize:d,checkboxSize:h,hasOwnLabel:o}=q.useCheckboxStatus(e,t,{model:u}),{isDisabled:n}=I.useCheckboxDisabled({model:u,isChecked:c}),{inputId:k,isLabeledByFormItem:i}=r.useFormItemInputId(e,{formItemContext:s,disableIdGeneration:o,disableIdManagement:a}),{handleChange:m,onClickRoot:x}=v.useCheckboxEvent(e,{model:u,isLimitExceeded:l,hasOwnLabel:o,isDisabled:n,isLabeledByFormItem:i});return f(e,{model:u}),{inputId:k,isLabeledByFormItem:i,isChecked:c,isDisabled:n,isFocused:b,checkboxButtonSize:d,checkboxSize:h,hasOwnLabel:o,model:u,handleChange:m,onClickRoot:x}};exports.useCheckbox=F;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utils = require("@vft/utils");
+require("../../form/index.cjs");
+const useCheckboxDisabled = require("./use-checkbox-disabled.cjs");
+const useCheckboxEvent = require("./use-checkbox-event.cjs");
+const useCheckboxModel = require("./use-checkbox-model.cjs");
+const useCheckboxStatus = require("./use-checkbox-status.cjs");
+const useFormItem = require("../../form/hooks/use-form-item.cjs");
+const setStoreValue = (props, { model }) => {
+  function addToStore() {
+    if (utils.isArray(model.value) && !model.value.includes(props.value)) {
+      model.value.push(props.value);
+    } else {
+      model.value = props.trueValue || true;
+    }
+  }
+  props.checked && addToStore();
+};
+const useCheckbox = (props, slots) => {
+  const { formItem: vftFormItem } = useFormItem.useFormItem();
+  const { model, isGroup, isLimitExceeded } = useCheckboxModel.useCheckboxModel(props);
+  const {
+    isFocused,
+    isChecked,
+    checkboxButtonSize,
+    checkboxSize,
+    hasOwnLabel
+  } = useCheckboxStatus.useCheckboxStatus(props, slots, {
+    model
+  });
+  const { isDisabled } = useCheckboxDisabled.useCheckboxDisabled({ model, isChecked });
+  const { inputId, isLabeledByFormItem } = useFormItem.useFormItemInputId(props, {
+    formItemContext: vftFormItem,
+    disableIdGeneration: hasOwnLabel,
+    disableIdManagement: isGroup
+  });
+  const { handleChange, onClickRoot } = useCheckboxEvent.useCheckboxEvent(props, {
+    model,
+    isLimitExceeded,
+    hasOwnLabel,
+    isDisabled,
+    isLabeledByFormItem
+  });
+  setStoreValue(props, { model });
+  return {
+    inputId,
+    isLabeledByFormItem,
+    isChecked,
+    isDisabled,
+    isFocused,
+    checkboxButtonSize,
+    checkboxSize,
+    hasOwnLabel,
+    model,
+    handleChange,
+    onClickRoot
+  };
+};
+exports.useCheckbox = useCheckbox;

package/lib/components/checkbox/constants.cjs

@@ -1 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=Symbol("checkboxGroupContextKey");exports.checkboxGroupContextKey=e;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const checkboxGroupContextKey = Symbol("checkboxGroupContextKey");
+exports.checkboxGroupContextKey = checkboxGroupContextKey;

package/lib/components/checkbox/index.cjs

@@ -1 +1,23 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("vue");const e=require("../../utils/vue/install.cjs");require("lodash-es");const r=require("./checkbox.vue2.cjs"),t=require("./checkbox-button.vue2.cjs"),u=require("./checkbox-group.vue2.cjs"),c=require("./constants.cjs"),o=e.withInstall(r.default,{CheckboxButton:t.default,CheckboxGroup:u.default}),n=e.withNoopInstall(t.default),s=e.withNoopInstall(u.default);exports.checkboxGroupContextKey=c.checkboxGroupContextKey;exports.VftCheckbox=o;exports.VftCheckboxButton=n;exports.VftCheckboxGroup=s;exports.default=o;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+require("@vueuse/core");
+require("@vft/utils");
+require("../config-provider/hooks/use-global-config.cjs");
+require("vue");
+const install = require("../../utils/vue/install.cjs");
+require("lodash-es");
+const checkbox_vue_vue_type_script_setup_true_lang = require("./checkbox.vue2.cjs");
+const checkboxButton_vue_vue_type_script_setup_true_lang = require("./checkbox-button.vue2.cjs");
+const checkboxGroup_vue_vue_type_script_setup_true_lang = require("./checkbox-group.vue2.cjs");
+const constants = require("./constants.cjs");
+const VftCheckbox = install.withInstall(checkbox_vue_vue_type_script_setup_true_lang.default, {
+  CheckboxButton: checkboxButton_vue_vue_type_script_setup_true_lang.default,
+  CheckboxGroup: checkboxGroup_vue_vue_type_script_setup_true_lang.default
+});
+const VftCheckboxButton = install.withNoopInstall(checkboxButton_vue_vue_type_script_setup_true_lang.default);
+const VftCheckboxGroup = install.withNoopInstall(checkboxGroup_vue_vue_type_script_setup_true_lang.default);
+exports.checkboxGroupContextKey = constants.checkboxGroupContextKey;
+exports.VftCheckbox = VftCheckbox;
+exports.VftCheckboxButton = VftCheckboxButton;
+exports.VftCheckboxGroup = VftCheckboxGroup;
+exports.default = VftCheckbox;

package/lib/components/checkbox/style/css.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/base.css");require("vft/theme-style/vft-checkbox.css");
+"use strict";
+require("vft/theme-style/base.css");
+require("vft/theme-style/vft-checkbox.css");

package/lib/components/checkbox/style/index.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/src/base.scss");require("vft/theme-style/src/checkbox.scss");
+"use strict";
+require("vft/theme-style/src/base.scss");
+require("vft/theme-style/src/checkbox.scss");

package/lib/components/checkbox-button/style/css.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/base.css");require("vft/theme-style/vft-checkbox-button.css");
+"use strict";
+require("vft/theme-style/base.css");
+require("vft/theme-style/vft-checkbox-button.css");

package/lib/components/checkbox-button/style/index.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/src/base.scss");require("vft/theme-style/src/checkbox-button.scss");
+"use strict";
+require("vft/theme-style/src/base.scss");
+require("vft/theme-style/src/checkbox-button.scss");

package/lib/components/checkbox-group/style/css.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/base.css");require("vft/theme-style/vft-checkbox-group.css");
+"use strict";
+require("vft/theme-style/base.css");
+require("vft/theme-style/vft-checkbox-group.css");

package/lib/components/checkbox-group/style/index.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/src/base.scss");require("vft/theme-style/src/checkbox-group.scss");
+"use strict";
+require("vft/theme-style/src/base.scss");
+require("vft/theme-style/src/checkbox-group.scss");

package/lib/components/clamp/clamp.vue.cjs

@@ -1 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./clamp.vue2.cjs");exports.default=e.default;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const clamp_vue_vue_type_script_setup_true_lang = require("./clamp.vue2.cjs");
+exports.default = clamp_vue_vue_type_script_setup_true_lang.default;

package/lib/components/clamp/clamp.vue2.cjs

@@ -1 +1,235 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue");require("@vueuse/core");const b=require("@vft/utils"),B=require("../../utils/helper.cjs");require("lodash-es");const $=["title","aria-label"],O=t.defineComponent({name:"vft-clamp"}),U=t.defineComponent({...O,props:{text:{},maxHeight:{},maxLines:{default:1},expanded:{type:Boolean,default:!1},ellipsis:{default:"…"},autoResize:{type:Boolean,default:!1},location:{default:"end"}},emits:["clamp-change","update:expanded"],setup(e,{expose:w,emit:L}){const g=L,n=t.ref(null),f=t.ref(null),r=t.ref(null),a=t.reactive({offset:0,localExpanded:e.expanded,unregisterResizeCallback:null}),z=t.computed(()=>{if(!a.localExpanded&&e.maxHeight)return B.addUnit(e.maxHeight)}),v=()=>{r.value&&(r.value.textContent=S.value)},u=()=>{a.localExpanded||(v(),(d()||i.value)&&m())},E=()=>{e.text&&(a.offset=e.text.length,k(),e.autoResize&&n.value&&(b.addListener(n.value,u),a.unregisterResizeCallback=()=>{n.value&&b.removeListener(n.value,u)}),u())},k=()=>{a.unregisterResizeCallback?.()},d=()=>!e.maxLines&&!e.maxHeight||!n.value?!1:e.maxLines&&x()>e.maxLines?!0:!!(e.maxHeight&&n.value.scrollHeight>n.value.offsetHeight),x=()=>f.value?Object.keys(Array.prototype.slice.call(f.value.getClientRects()).reduce((l,{top:c,bottom:s})=>{const o=`${c}/${s}`;return l[o]||(l[o]=!0),l},{})).length:0,m=(...l)=>{const[c=0,s=a.offset]=l;if(s-c<=3){T();return}const o=Math.floor((s+c)/2);h(o),d()?m(c,o):m(o,s)},h=l=>{a.offset=l,v()},T=()=>{M(),q()},M=()=>{for(;(!d()||x()<2)&&a.offset<e.text.length;)y(1)},q=()=>{for(;d()&&x()>1&&a.offset>0;)y(-1)},y=l=>{h(a.offset+l)},i=t.computed(()=>e.text?a.offset!==e.text.length:!1);t.watch(()=>i.value,l=>{t.nextTick(()=>{g("clamp-change",l)})},{immediate:!0});const S=t.computed(()=>i.value?j.value:e.text),j=t.computed(()=>{if(e.location==="start")return e.ellipsis+(e.text.slice(0,a.offset)||"").trim();if(e.location==="middle"){const l=Math.floor(a.offset/2);return(e.text.slice(0,l)||"").trim()+e.ellipsis+(e.text.slice(-l)||"").trim()}return(e.text.slice(0,a.offset)||"").trim()+e.ellipsis}),R=()=>{a.localExpanded=!0},C=()=>{a.localExpanded=!1},H=()=>{a.localExpanded=!a.localExpanded};return t.watch(()=>e.expanded,l=>{a.localExpanded=l}),t.watch(()=>a.localExpanded,l=>{l?h(e.text.length):u(),e.expanded!==l&&g("update:expanded",l)}),t.watch(()=>[e.maxLines,e.maxHeight,e.ellipsis,e.location,i.value].join(),()=>{t.nextTick(()=>{u()})}),t.watch(()=>[e.text,e.autoResize].join(),()=>{t.nextTick(()=>{E()})}),t.onUnmounted(()=>{k()}),t.onMounted(()=>{E()}),w({isClamped:i}),(l,c)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"textClampRef",ref:n,class:"text-clamp",style:t.normalizeStyle({overflow:"hidden",maxHeight:z.value})},[t.createElementVNode("span",{ref_key:"contentRef",ref:f},[t.renderSlot(l.$slots,"before",{expand:R,collapse:C,toggle:H,clamped:i.value,expanded:a.localExpanded}),t.createElementVNode("span",{ref_key:"textRef",ref:r,title:l.text,"aria-label":l.text},null,8,$),t.renderSlot(l.$slots,"after",{expand:R,collapse:C,toggle:H,clamped:i.value,expanded:a.localExpanded})],512)],4))}});exports.default=U;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+require("@vueuse/core");
+const utils = require("@vft/utils");
+const helper = require("../../utils/helper.cjs");
+require("lodash-es");
+const _hoisted_1 = ["title", "aria-label"];
+const __default__ = vue.defineComponent({
+  name: "vft-clamp"
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: {
+    text: {},
+    maxHeight: {},
+    maxLines: { default: 1 },
+    expanded: { type: Boolean, default: false },
+    ellipsis: { default: "…" },
+    autoResize: { type: Boolean, default: false },
+    location: { default: "end" }
+  },
+  emits: ["clamp-change", "update:expanded"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const emits = __emit;
+    const textClampRef = vue.ref(null);
+    const contentRef = vue.ref(null);
+    const textRef = vue.ref(null);
+    const state = vue.reactive({
+      offset: 0,
+      localExpanded: __props.expanded,
+      unregisterResizeCallback: null
+    });
+    const realMaxHeight = vue.computed(() => {
+      if (state.localExpanded) return void 0;
+      if (!__props.maxHeight) return void 0;
+      return helper.addUnit(__props.maxHeight);
+    });
+    const applyChange = () => {
+      textRef.value && (textRef.value.textContent = realText.value);
+    };
+    const update = () => {
+      if (state.localExpanded) return;
+      applyChange();
+      if (isOverflow() || isClamped.value) {
+        search();
+      }
+    };
+    const init = () => {
+      if (!__props.text) return;
+      state.offset = __props.text.length;
+      cleanUp();
+      if (__props.autoResize && textClampRef.value) {
+        utils.addListener(textClampRef.value, update);
+        state.unregisterResizeCallback = () => {
+          textClampRef.value && utils.removeListener(textClampRef.value, update);
+        };
+      }
+      update();
+    };
+    const cleanUp = () => {
+      state.unregisterResizeCallback?.();
+    };
+    const isOverflow = () => {
+      if (!__props.maxLines && !__props.maxHeight) return false;
+      if (!textClampRef.value) return false;
+      if (__props.maxLines && getLines() > __props.maxLines) return true;
+      return !!(__props.maxHeight && textClampRef.value.scrollHeight > textClampRef.value.offsetHeight);
+    };
+    const getLines = () => {
+      if (!contentRef.value) return 0;
+      return Object.keys(
+        Array.prototype.slice.call(contentRef.value.getClientRects()).reduce((prev, { top, bottom }) => {
+          const key = `${top}/${bottom}`;
+          if (!prev[key]) {
+            prev[key] = true;
+          }
+          return prev;
+        }, {})
+      ).length;
+    };
+    const search = (...range) => {
+      const [from = 0, to = state.offset] = range;
+      if (to - from <= 3) {
+        stepToFit();
+        return;
+      }
+      const target = Math.floor((to + from) / 2);
+      clampAt(target);
+      if (isOverflow()) {
+        search(from, target);
+      } else {
+        search(target, to);
+      }
+    };
+    const clampAt = (offset) => {
+      state.offset = offset;
+      applyChange();
+    };
+    const stepToFit = () => {
+      fill();
+      clamp();
+    };
+    const fill = () => {
+      while ((!isOverflow() || getLines() < 2) && state.offset < __props.text.length) {
+        moveEdge(1);
+      }
+    };
+    const clamp = () => {
+      while (isOverflow() && getLines() > 1 && state.offset > 0) {
+        moveEdge(-1);
+      }
+    };
+    const moveEdge = (steps) => {
+      clampAt(state.offset + steps);
+    };
+    const isClamped = vue.computed(() => {
+      if (!__props.text) return false;
+      return state.offset !== __props.text.length;
+    });
+    vue.watch(
+      () => isClamped.value,
+      (val) => {
+        vue.nextTick(() => {
+          emits("clamp-change", val);
+        });
+      },
+      { immediate: true }
+    );
+    const realText = vue.computed(() => {
+      return isClamped.value ? clampedText.value : __props.text;
+    });
+    const clampedText = vue.computed(() => {
+      if (__props.location === "start") {
+        return __props.ellipsis + (__props.text.slice(0, state.offset) || "").trim();
+      }
+      if (__props.location === "middle") {
+        const split = Math.floor(state.offset / 2);
+        return (__props.text.slice(0, split) || "").trim() + __props.ellipsis + (__props.text.slice(-split) || "").trim();
+      }
+      return (__props.text.slice(0, state.offset) || "").trim() + __props.ellipsis;
+    });
+    const expand = () => {
+      state.localExpanded = true;
+    };
+    const collapse = () => {
+      state.localExpanded = false;
+    };
+    const toggle = () => {
+      state.localExpanded = !state.localExpanded;
+    };
+    vue.watch(
+      () => __props.expanded,
+      (val) => {
+        state.localExpanded = val;
+      }
+    );
+    vue.watch(
+      () => state.localExpanded,
+      (val) => {
+        if (val) {
+          clampAt(__props.text.length);
+        } else {
+          update();
+        }
+        if (__props.expanded !== val) {
+          emits("update:expanded", val);
+        }
+      }
+    );
+    vue.watch(
+      () => [__props.maxLines, __props.maxHeight, __props.ellipsis, __props.location, isClamped.value].join(),
+      () => {
+        vue.nextTick(() => {
+          update();
+        });
+      }
+    );
+    vue.watch(
+      () => [__props.text, __props.autoResize].join(),
+      () => {
+        vue.nextTick(() => {
+          init();
+        });
+      }
+    );
+    vue.onUnmounted(() => {
+      cleanUp();
+    });
+    vue.onMounted(() => {
+      init();
+    });
+    __expose({
+      isClamped
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        ref_key: "textClampRef",
+        ref: textClampRef,
+        class: "text-clamp",
+        style: vue.normalizeStyle({
+          overflow: "hidden",
+          maxHeight: realMaxHeight.value
+        })
+      }, [
+        vue.createElementVNode("span", {
+          ref_key: "contentRef",
+          ref: contentRef
+        }, [
+          vue.renderSlot(_ctx.$slots, "before", {
+            expand,
+            collapse,
+            toggle,
+            clamped: isClamped.value,
+            expanded: state.localExpanded
+          }),
+          vue.createElementVNode("span", {
+            ref_key: "textRef",
+            ref: textRef,
+            title: _ctx.text,
+            "aria-label": _ctx.text
+          }, null, 8, _hoisted_1),
+          vue.renderSlot(_ctx.$slots, "after", {
+            expand,
+            collapse,
+            toggle,
+            clamped: isClamped.value,
+            expanded: state.localExpanded
+          })
+        ], 512)
+      ], 4);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/clamp/index.cjs

@@ -1 +1,12 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("vue");const r=require("../../utils/vue/install.cjs");require("lodash-es");const t=require("./clamp.vue2.cjs"),e=r.withInstall(t.default);exports.VftClamp=e;exports.default=e;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+require("@vueuse/core");
+require("@vft/utils");
+require("../config-provider/hooks/use-global-config.cjs");
+require("vue");
+const install = require("../../utils/vue/install.cjs");
+require("lodash-es");
+const clamp_vue_vue_type_script_setup_true_lang = require("./clamp.vue2.cjs");
+const VftClamp = install.withInstall(clamp_vue_vue_type_script_setup_true_lang.default);
+exports.VftClamp = VftClamp;
+exports.default = VftClamp;

package/lib/components/clamp/style/css.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/base.css");require("vft/theme-style/vft-clamp.css");
+"use strict";
+require("vft/theme-style/base.css");
+require("vft/theme-style/vft-clamp.css");

package/lib/components/clamp/style/index.cjs

@@ -1 +1,3 @@
-"use strict";require("vft/theme-style/src/base.scss");require("vft/theme-style/src/clamp.scss");
+"use strict";
+require("vft/theme-style/src/base.scss");
+require("vft/theme-style/src/clamp.scss");

package/lib/components/clamp-toggle/clamp-toggle.vue.cjs

@@ -1 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./clamp-toggle.vue2.cjs");exports.default=e.default;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const clampToggle_vue_vue_type_script_setup_true_lang = require("./clamp-toggle.vue2.cjs");
+exports.default = clampToggle_vue_vue_type_script_setup_true_lang.default;

package/lib/components/clamp-toggle/clamp-toggle.vue2.cjs

@@ -1 +1,65 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),s=require("../clamp/index.cjs");require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");const u=require("../../utils/ns-cover.cjs");require("lodash-es");const g=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const c=["onClick"],d=e.defineComponent({name:"vft-clamp-toggle"}),m=e.defineComponent({...d,props:{text:{},maxHeight:{},maxLines:{default:1},expanded:{type:Boolean,default:!1},location:{default:"end"},ellipsis:{default:"…"},autoResize:{type:Boolean,default:!1},color:{},size:{},toggleColor:{},toggleSize:{},toggleText:{default:()=>["展开","收缩"]}},setup(o){const i=g.useNamespace("clamp-toggle"),a=e.computed(()=>u.generateCssVars({color:o.color,size:o.size,toggleColor:o.toggleColor,toggleSize:o.toggleSize},"clamp-toggle"));return(t,p)=>(e.openBlock(),e.createBlock(e.unref(s.VftClamp),{style:e.normalizeStyle(a.value),text:t.text,"max-height":t.maxHeight,"max-lines":t.maxLines,expanded:t.expanded,location:t.location,ellipsis:t.ellipsis,"auto-resize":t.autoResize},{after:e.withCtx(({toggle:r,expanded:l,clamped:n})=>[l||n?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["cursor-pointer",e.unref(i).e("more")]),onClick:r},e.toDisplayString(l?t.toggleText[1]:t.toggleText[0]),11,c)):e.createCommentVNode("",!0)]),_:1},8,["style","text","max-height","max-lines","expanded","location","ellipsis","auto-resize"]))}});exports.default=m;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const index$1 = require("../clamp/index.cjs");
+require("@vueuse/core");
+require("@vft/utils");
+require("../config-provider/hooks/use-global-config.cjs");
+const nsCover = require("../../utils/ns-cover.cjs");
+require("lodash-es");
+const index = require("../../hooks/use-namespace/index.cjs");
+require("../../hooks/use-model-toggle/index.cjs");
+require("@popperjs/core");
+require("../../hooks/use-z-index/index.cjs");
+const _hoisted_1 = ["onClick"];
+const __default__ = vue.defineComponent({
+  name: "vft-clamp-toggle"
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: {
+    text: {},
+    maxHeight: {},
+    maxLines: { default: 1 },
+    expanded: { type: Boolean, default: false },
+    location: { default: "end" },
+    ellipsis: { default: "…" },
+    autoResize: { type: Boolean, default: false },
+    color: {},
+    size: {},
+    toggleColor: {},
+    toggleSize: {},
+    toggleText: { default: () => ["展开", "收缩"] }
+  },
+  setup(__props) {
+    const ns = index.useNamespace("clamp-toggle");
+    const style = vue.computed(() => {
+      return nsCover.generateCssVars(
+        { color: __props.color, size: __props.size, toggleColor: __props.toggleColor, toggleSize: __props.toggleSize },
+        "clamp-toggle"
+      );
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(index$1.VftClamp), {
+        style: vue.normalizeStyle(style.value),
+        text: _ctx.text,
+        "max-height": _ctx.maxHeight,
+        "max-lines": _ctx.maxLines,
+        expanded: _ctx.expanded,
+        location: _ctx.location,
+        ellipsis: _ctx.ellipsis,
+        "auto-resize": _ctx.autoResize
+      }, {
+        after: vue.withCtx(({ toggle, expanded: isExpand, clamped }) => [
+          isExpand || clamped ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 0,
+            class: vue.normalizeClass(["cursor-pointer", vue.unref(ns).e("more")]),
+            onClick: toggle
+          }, vue.toDisplayString(!isExpand ? _ctx.toggleText[0] : _ctx.toggleText[1]), 11, _hoisted_1)) : vue.createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["style", "text", "max-height", "max-lines", "expanded", "location", "ellipsis", "auto-resize"]);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/clamp-toggle/index.cjs

@@ -1 +1,12 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("vue");const r=require("../../utils/vue/install.cjs");require("lodash-es");const t=require("./clamp-toggle.vue2.cjs"),e=r.withInstall(t.default);exports.VftClampToggle=e;exports.default=e;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+require("@vueuse/core");
+require("@vft/utils");
+require("../config-provider/hooks/use-global-config.cjs");
+require("vue");
+const install = require("../../utils/vue/install.cjs");
+require("lodash-es");
+const clampToggle_vue_vue_type_script_setup_true_lang = require("./clamp-toggle.vue2.cjs");
+const VftClampToggle = install.withInstall(clampToggle_vue_vue_type_script_setup_true_lang.default);
+exports.VftClampToggle = VftClampToggle;
+exports.default = VftClampToggle;