@pequity/squirrel 1.0.20-beta.1 → 1.0.20-beta.3

package/dist/cjs/text.js

@@ -1 +1,16 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=(i,s)=>{const n=String(s).trim(),t=String(i).trim(),r=t.indexOf(n);if(r>=0){const e=t.substring(0,r),g=t.substring(r,r+n.length),o=t.substring(r+n.length);return[e,g,o]}else return[t]};exports.splitStringForHighlight=l;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const splitStringForHighlight = (textToSearchIn, searchStr) => {
+  const str = String(searchStr).trim();
+  const text = String(textToSearchIn).trim();
+  const index = text.indexOf(str);
+  if (index >= 0) {
+    const part1 = text.substring(0, index);
+    const part2 = text.substring(index, index + str.length);
+    const part3 = text.substring(index + str.length);
+    return [part1, part2, part3];
+  } else {
+    return [text];
+  }
+};
+exports.splitStringForHighlight = splitStringForHighlight;

package/dist/cjs/useInputClasses.js

@@ -1 +1,44 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./inputClassesShared.js"),s=require("vue"),$={size:s.ref("md"),errorMsg:s.ref(""),required:s.ref(!1),prefix:s.ref(!1),suffix:s.ref(!1)};function v(l){const n={...$,...s.toRefs(l)},{size:r,errorMsg:o,required:c,prefix:E,suffix:S}=n,u=s.computed(()=>{const t=`${e.INPUT_BASE} ${e.INPUT_SIZES[r.value]}`,a=E.value?e.SPACING_PREFIX[r.value]:e.SPACING_LEFT[r.value],_=S.value?e.SPACING_SUFFIX[r.value]:e.SPACING_RIGHT[r.value];return`${t} ${a} ${_} ${o.value?e.INPUT_ERROR:e.INPUT_NORMAL}`}),f=s.computed(()=>{const t=`${e.LABEL_BASE} ${e.LABEL_SIZES[r.value]}`;return c.value?`${t} ${e.LABEL_REQUIRED}`:t}),i=s.computed(()=>`${u.value.replace(` ${e.SPACING_RIGHT[r.value]}`,"")} ${e.SELECT_BASE} ${e.SELECT_ARROW} ${e.SELECT_SIZES[r.value]}`),I=s.computed(()=>`${u.value} ${e.TEXTAREA_BASE}`),R=s.ref(e.ERROR_MSG);return{inputClasses:u,labelClasses:f,selectClasses:i,textareaClasses:I,errorMsgClasses:R}}exports.useInputClasses=v;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const inputClassesShared = require("./inputClassesShared.js");
+const vue = require("vue");
+const defaults = {
+  size: vue.ref("md"),
+  errorMsg: vue.ref(""),
+  required: vue.ref(false),
+  prefix: vue.ref(false),
+  suffix: vue.ref(false)
+};
+function useInputClasses(props) {
+  const opts = { ...defaults, ...vue.toRefs(props) };
+  const { size, errorMsg, required, prefix, suffix } = opts;
+  const inputClasses = vue.computed(() => {
+    const base = `${inputClassesShared.INPUT_BASE} ${inputClassesShared.INPUT_SIZES[size.value]}`;
+    const spacingLeft = prefix.value ? inputClassesShared.SPACING_PREFIX[size.value] : inputClassesShared.SPACING_LEFT[size.value];
+    const spacingRight = suffix.value ? inputClassesShared.SPACING_SUFFIX[size.value] : inputClassesShared.SPACING_RIGHT[size.value];
+    const res = `${base} ${spacingLeft} ${spacingRight} ${errorMsg.value ? inputClassesShared.INPUT_ERROR : inputClassesShared.INPUT_NORMAL}`;
+    return res;
+  });
+  const labelClasses = vue.computed(() => {
+    const base = `${inputClassesShared.LABEL_BASE} ${inputClassesShared.LABEL_SIZES[size.value]}`;
+    const res = required.value ? `${base} ${inputClassesShared.LABEL_REQUIRED}` : base;
+    return res;
+  });
+  const selectClasses = vue.computed(() => {
+    const res = `${inputClasses.value.replace(` ${inputClassesShared.SPACING_RIGHT[size.value]}`, "")} ${inputClassesShared.SELECT_BASE} ${inputClassesShared.SELECT_ARROW} ${inputClassesShared.SELECT_SIZES[size.value]}`;
+    return res;
+  });
+  const textareaClasses = vue.computed(() => {
+    const res = `${inputClasses.value} ${inputClassesShared.TEXTAREA_BASE}`;
+    return res;
+  });
+  const errorMsgClasses = vue.ref(inputClassesShared.ERROR_MSG);
+  return {
+    inputClasses,
+    labelClasses,
+    selectClasses,
+    textareaClasses,
+    errorMsgClasses
+  };
+}
+exports.useInputClasses = useInputClasses;

package/dist/cjs/usePLoading.js

@@ -1 +1,35 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),a=require("lodash-es"),e=t.ref(!1),o=[];let u;const c=i=>{const{delay:s}={delay:200,...i},l=t.getCurrentScope(),r=()=>{o.length===0&&s>0?u=setTimeout(()=>{e.value=!0},s):e.value=!0,o.push(a.uniqueId())},n=()=>{o.length===1&&(e.value=!1),clearTimeout(u),o.pop()};return l&&t.onScopeDispose(()=>{n()}),{show:e,loadingShow:r,loadingHide:n}};exports.usePLoading=c;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const lodashEs = require("lodash-es");
+const show = vue.ref(false);
+const loadingIds = [];
+let timer;
+const usePLoading = (options) => {
+  const { delay } = { delay: 200, ...options };
+  const scope = vue.getCurrentScope();
+  const loadingShow = () => {
+    if (loadingIds.length === 0 && delay > 0) {
+      timer = setTimeout(() => {
+        show.value = true;
+      }, delay);
+    } else {
+      show.value = true;
+    }
+    loadingIds.push(lodashEs.uniqueId());
+  };
+  const loadingHide = () => {
+    if (loadingIds.length === 1) {
+      show.value = false;
+    }
+    clearTimeout(timer);
+    loadingIds.pop();
+  };
+  if (scope) {
+    vue.onScopeDispose(() => {
+      loadingHide();
+    });
+  }
+  return { show, loadingShow, loadingHide };
+};
+exports.usePLoading = usePLoading;

package/dist/cjs/usePModal.js

@@ -1 +1,21 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),t=l.reactive({modals:{}}),d=()=>{const s=e=>{t.modals[e]=!0},o=e=>{delete t.modals[e]};return{state:t,show:s,hide:o,hideAll:()=>{Object.keys(t.modals).forEach(e=>{o(e)})}}};exports.usePModal=d;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const state = vue.reactive({
+  modals: {}
+});
+const usePModal = () => {
+  const show = (name) => {
+    state.modals[name] = true;
+  };
+  const hide = (name) => {
+    delete state.modals[name];
+  };
+  const hideAll = () => {
+    Object.keys(state.modals).forEach((modalName) => {
+      hide(modalName);
+    });
+  };
+  return { state, show, hide, hideAll };
+};
+exports.usePModal = usePModal;

package/dist/cjs/usePTableColResize.js

@@ -1 +1,81 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("./p-table.js"),o=require("vue"),L=h=>{const{enabled:u,ths:r}=h,s=o.ref(!1),a=o.ref("0px"),d=o.ref(0),v=o.ref(-1),z=e=>{if(a.value=`${e.clientX}px`,s.value){document.body.classList.add("cursor-col-resize");const t=r.value[v.value],l=t.getBoundingClientRect(),i=e.clientX-l.left-t.offsetWidth,c=t.offsetWidth+i;f(c),a.value=e.clientX<l.left?"0px":`${e.clientX}px`}},p=(e,t)=>{e.detail===1&&(e.preventDefault(),s.value=!0,d.value=r.value[t].offsetWidth,v.value=t)},n=()=>{s.value&&(s.value=!1,document.body.classList.remove("cursor-col-resize"))},b=e=>{var i;s.value=!0;const t=(i=r.value[e].closest("table"))==null?void 0:i.querySelectorAll("tbody tr td:nth-child("+(e+1)+") div.w-max");if(!t)return;const l=[...t].reduce((c,g)=>{const m=g.getBoundingClientRect().width;return m>c?m:c},0);f(l),o.nextTick(()=>{s.value=!1})},f=e=>{d.value=e>R.MIN_WIDTH_COL_RESIZE?Math.ceil(e):R.MIN_WIDTH_COL_RESIZE};return o.onMounted(()=>{u.value&&document.addEventListener("mouseup",n)}),o.onBeforeUnmount(()=>{u.value&&document.removeEventListener("mouseup",n)}),o.watch(u,e=>{e?document.addEventListener("mouseup",n):document.removeEventListener("mouseup",n)}),{isColResizing:s,colResizeHandleLeft:a,colResizingIndex:v,colResizingWidth:d,colResize:z,colResizeStart:p,colResizeStop:n,colResizeFitToData:b}};exports.usePTableColResize=L;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const pTable = require("./p-table.js");
+const vue = require("vue");
+const usePTableColResize = (options) => {
+  const { enabled, ths } = options;
+  const isColResizing = vue.ref(false);
+  const colResizeHandleLeft = vue.ref("0px");
+  const colResizingWidth = vue.ref(0);
+  const colResizingIndex = vue.ref(-1);
+  const colResize = (e) => {
+    colResizeHandleLeft.value = `${e.clientX}px`;
+    if (isColResizing.value) {
+      document.body.classList.add("cursor-col-resize");
+      const th = ths.value[colResizingIndex.value];
+      const rect = th.getBoundingClientRect();
+      const diff = e.clientX - rect.left - th.offsetWidth;
+      const widthToSet = th.offsetWidth + diff;
+      setColResizingWidth(widthToSet);
+      colResizeHandleLeft.value = e.clientX < rect.left ? "0px" : `${e.clientX}px`;
+    }
+  };
+  const colResizeStart = (e, i) => {
+    if (e.detail === 1) {
+      e.preventDefault();
+      isColResizing.value = true;
+      colResizingWidth.value = ths.value[i].offsetWidth;
+      colResizingIndex.value = i;
+    }
+  };
+  const colResizeStop = () => {
+    if (!isColResizing.value) {
+      return;
+    }
+    isColResizing.value = false;
+    document.body.classList.remove("cursor-col-resize");
+  };
+  const colResizeFitToData = (colIndex) => {
+    var _a;
+    isColResizing.value = true;
+    const tds = (_a = ths.value[colIndex].closest("table")) == null ? void 0 : _a.querySelectorAll("tbody tr td:nth-child(" + (colIndex + 1) + ") div.w-max");
+    if (!tds) {
+      return;
+    }
+    const maxWidth = [...tds].reduce((max, td) => {
+      const width = td.getBoundingClientRect().width;
+      return width > max ? width : max;
+    }, 0);
+    setColResizingWidth(maxWidth);
+    vue.nextTick(() => {
+      isColResizing.value = false;
+    });
+  };
+  const setColResizingWidth = (width) => {
+    colResizingWidth.value = width > pTable.MIN_WIDTH_COL_RESIZE ? Math.ceil(width) : pTable.MIN_WIDTH_COL_RESIZE;
+  };
+  vue.onMounted(() => {
+    enabled.value && document.addEventListener("mouseup", colResizeStop);
+  });
+  vue.onBeforeUnmount(() => {
+    enabled.value && document.removeEventListener("mouseup", colResizeStop);
+  });
+  vue.watch(enabled, (nV) => {
+    if (nV) {
+      document.addEventListener("mouseup", colResizeStop);
+    } else {
+      document.removeEventListener("mouseup", colResizeStop);
+    }
+  });
+  return {
+    isColResizing,
+    colResizeHandleLeft,
+    colResizingIndex,
+    colResizingWidth,
+    colResize,
+    colResizeStart,
+    colResizeStop,
+    colResizeFitToData
+  };
+};
+exports.usePTableColResize = usePTableColResize;

package/dist/cjs/usePTableRowVirtualizer.js

@@ -1 +1,31 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),i=require("@tanstack/vue-virtual"),s=l=>{if(!l.value)return{virtualizer:null,virtualRows:e.ref([{key:0,index:0}]),paddingTop:e.ref(0),paddingBottom:e.ref(0),measureElement:()=>e.ref(void 0)};const t=i.useVirtualizer(l),u=e.computed(()=>t.value.getVirtualItems()),n=e.computed(()=>u.value.length>0?u.value[0].start:0),o=e.computed(()=>u.value.length>0?(t==null?void 0:t.value.getTotalSize())-u.value[u.value.length-1].end:0);return{virtualizer:t,virtualRows:u,paddingTop:n,paddingBottom:o,measureElement:r=>{const a=e.isRef(r)?e.unref(r):r==null?void 0:r.$el;a&&t.value.measureElement(a)}}};exports.usePTableRowVirtualizer=s;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const vueVirtual = require("@tanstack/vue-virtual");
+const usePTableRowVirtualizer = (options) => {
+  if (!options.value) {
+    return {
+      virtualizer: null,
+      virtualRows: vue.ref([{ key: 0, index: 0 }]),
+      paddingTop: vue.ref(0),
+      paddingBottom: vue.ref(0),
+      measureElement: () => vue.ref(void 0)
+    };
+  }
+  const virtualizer = vueVirtual.useVirtualizer(options);
+  const virtualRows = vue.computed(() => virtualizer.value.getVirtualItems());
+  const paddingTop = vue.computed(() => virtualRows.value.length > 0 ? virtualRows.value[0].start : 0);
+  const paddingBottom = vue.computed(
+    () => virtualRows.value.length > 0 ? (virtualizer == null ? void 0 : virtualizer.value.getTotalSize()) - virtualRows.value[virtualRows.value.length - 1].end : 0
+  );
+  const measureElement = (cmp) => {
+    const el = vue.isRef(cmp) ? vue.unref(cmp) : cmp == null ? void 0 : cmp.$el;
+    if (!el) {
+      return;
+    }
+    virtualizer.value.measureElement(el);
+    return void 0;
+  };
+  return { virtualizer, virtualRows, paddingTop, paddingBottom, measureElement };
+};
+exports.usePTableRowVirtualizer = usePTableRowVirtualizer;

package/dist/cjs/useSelectList.js

@@ -1 +1,256 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("vue"),D=require("./listKeyboardNavigation.js"),A=require("lodash-es"),F=require("./object.js"),U=require("./string.js"),Y=require("@tanstack/vue-virtual"),Z=e=>{let i=Array.isArray(e)?e.slice():[];return i.length&&!F.isObject(i[0])&&(i=i.filter((m,r,u)=>u.indexOf(m)===r).map(m=>({value:m,text:m}))),i},G=(e,i,m,r,u)=>{let n=e;return i&&F.isObject(e)&&(m?n=e.map(f=>f[r]):n=e&&e[r]),Array.isArray(n)?n:[n]},S=()=>new Promise(e=>requestAnimationFrame(()=>requestAnimationFrame(e))),L=e=>new Promise(i=>setTimeout(i,e||0)),y={sm:32,md:40,lg:48},H="clear-both block w-full cursor-pointer whitespace-nowrap py-1 px-3 text-left text-sm font-medium hover:bg-p-blue-10",q="selected",J=(e,i,m,r)=>{let u=null;const n=c.ref([]),s=c.ref([]),f=c.ref(""),T=c.computed(()=>n.value.filter(l=>s.value.includes(l[e.itemValue]))),d=c.computed(()=>A.cloneDeep(n.value).filter(l=>String(l[e.itemText]).toLocaleLowerCase().includes(String(f.value).toLocaleLowerCase()))),O=c.computed(()=>e.itemSize?e.itemSize:y[e.size]),E=c.computed(()=>d.value.map(t=>t[e.itemValue]).every(t=>s.value.includes(t))),I=Y.useVirtualizer(c.computed(()=>({count:d.value.length,getScrollElement:()=>m.value,getItemKey:l=>U.toString(d.value[l][e.itemValue]),estimateSize:()=>e.itemSize?e.itemSize:y[e.size],overscan:10}))),j=l=>{var t;return(t=d.value[l])==null?void 0:t[e.itemValue]},C=l=>{var t;return(t=d.value[l])==null?void 0:t[e.itemText]};c.watch(()=>e.modelValue,l=>{s.value=G(l,e.valueIsObject,e.multiple,e.itemValue,n.value)},{immediate:!0,deep:!0}),c.watch(f,async l=>{if(await P(),await S(),!u)return;const t=u.getItems().filter(a=>a.style.transform.includes("translateY(0px)"))[0];l||e.multiple?u.setFocusedItem(t):h()>-1?b():u.clearFocusedState()}),c.onUnmounted(()=>{u==null||u.destroy(),u=null});const z=()=>{if(e.selectedTopShown){const l=n.value.reduce((t,a)=>(s.value.includes(a[e.itemValue])?t[0].push(a):t[1].push(a),t),[[],[]]);n.value=l[0].sort((t,a)=>String(t[e.itemText]).localeCompare(String(a[e.itemText]),void 0,{numeric:!0,sensitivity:"base"})).concat(l[1])}},_=async(l,t)=>{var o,x;const a=l.currentTarget;e.multiple&&e.searchable&&document.activeElement!==((o=i.value)==null?void 0:o.$el.querySelector("input"))&&((x=i.value)==null||x.$el.querySelector("input").focus()),e.multiple?g(t)?r("update:modelValue",v(s.value.filter(B=>B!==t))):r("update:modelValue",v([...s.value,t])):r("update:modelValue",e.valueIsObject?w(t):t),await c.nextTick(),u==null||u.setFocusedItem(a.parentElement),r("select",t)},v=l=>e.valueIsObject?l.map(t=>w(t)):l,w=l=>n.value.find(t=>t[e.itemValue]===l),g=l=>s.value.includes(l),V=()=>{u?u.init():u=D.setupListKeyboardNavigation({itemContainer:m.value,itemSelector:"[p-select-list-option]",itemSelectSelector:"[p-select-list-option-item]",itemFocusClass:"bg-p-blue-10"})},N=()=>{u==null||u.destroy(),u=null},M=async()=>{V()},K=()=>{u==null||u.clearFocusedState()},P=async()=>{I.value.scrollToOffset(0),await S()},b=async l=>{var a;l!=null&&l.wait&&await L(l.wait);const t=h();if(m.value&&I.value&&t>-1){I.value.scrollToIndex(t,{align:"center"}),await L(),await S();const o=(a=m.value)==null?void 0:a.querySelector(`.${q}`);u==null||u.setFocusedItem(o==null?void 0:o.parentNode)}},h=()=>n.value.indexOf(T.value[0]),$=()=>{if(!e.multiple)return;const l=s.value,t=d.value.map(o=>o[e.itemValue]),a=A.uniqBy([...l,...t],o=>o);r("update:modelValue",v(a))},k=()=>{f.value="",r("update:modelValue",[])};return c.watch(()=>e.items,l=>{if(n.value=Z(l),e.multiple&&e.items.length&&s.value.length){const t=s.value.filter(a=>n.value.some(o=>o[e.itemValue]===a));t.length!==s.value.length&&(console.warn("[p-select-list] Some values in the modelValue are not in the items list."),r("update:modelValue",v(t)))}},{immediate:!0}),{LIST_ITEM_SIZES:y,LIST_ITEM_CLASS:H,LIST_ITEM_ACTIVE_CLASS:q,selectedItems:T,computedItems:d,computedItemSize:O,computedInsideSelected:E,internalItems:n,internalValue:s,search:f,rowVirtualizer:I,getValue:j,getText:C,isSelected:g,setupNavigationSvc:V,destroyNavigationSvc:N,select:_,onFocus:M,onMousemove:K,scrollToActiveItem:b,putSelectedItemsOnTop:z,selectAll:$,clearAll:k}};exports.useSelectList=J;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const listKeyboardNavigation = require("./listKeyboardNavigation.js");
+const lodashEs = require("lodash-es");
+const object = require("./object.js");
+const string = require("./string.js");
+const vueVirtual = require("@tanstack/vue-virtual");
+const createInternalItems = (items) => {
+  let arr = Array.isArray(items) ? items.slice() : [];
+  if (arr.length && !object.isObject(arr[0])) {
+    arr = arr.filter((item, i, self) => self.indexOf(item) === i).map((item) => ({ value: item, text: item }));
+  }
+  return arr;
+};
+const createInternalValue = (modelValue, valueIsObject, multiple, itemValue, internalItems) => {
+  let val = modelValue;
+  if (valueIsObject && object.isObject(modelValue)) {
+    if (multiple) {
+      val = modelValue.map((v) => v[itemValue]);
+    } else {
+      val = modelValue ? modelValue[itemValue] : modelValue;
+    }
+  }
+  const arr = Array.isArray(val) ? val : [val];
+  return arr;
+};
+const nextFrame = () => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve)));
+const nextLoop = (ms) => new Promise((resolve) => setTimeout(resolve, ms || 0));
+const LIST_ITEM_SIZES = { sm: 32, md: 40, lg: 48 };
+const LIST_ITEM_CLASS = "clear-both block w-full cursor-pointer whitespace-nowrap py-1 px-3 text-left text-sm font-medium hover:bg-p-blue-10";
+const LIST_ITEM_ACTIVE_CLASS = "selected";
+const useSelectList = (props, inputSearch, virtualizerRef, emit) => {
+  let navigationSvc = null;
+  const internalItems = vue.ref([]);
+  const internalValue = vue.ref([]);
+  const search = vue.ref("");
+  const selectedItems = vue.computed(() => {
+    return internalItems.value.filter((item) => internalValue.value.includes(item[props.itemValue]));
+  });
+  const computedItems = vue.computed(() => {
+    return lodashEs.cloneDeep(internalItems.value).filter((item) => {
+      return String(item[props.itemText]).toLocaleLowerCase().includes(String(search.value).toLocaleLowerCase());
+    });
+  });
+  const computedItemSize = vue.computed(() => props.itemSize ? props.itemSize : LIST_ITEM_SIZES[props.size]);
+  const computedInsideSelected = vue.computed(() => {
+    const filteredItems = computedItems.value.map((item) => item[props.itemValue]);
+    return filteredItems.every((item) => internalValue.value.includes(item));
+  });
+  const rowVirtualizer = vueVirtual.useVirtualizer(
+    vue.computed(() => {
+      return {
+        count: computedItems.value.length,
+        getScrollElement: () => virtualizerRef.value,
+        getItemKey: (index) => string.toString(computedItems.value[index][props.itemValue]),
+        estimateSize: () => {
+          return props.itemSize ? props.itemSize : LIST_ITEM_SIZES[props.size];
+        },
+        overscan: 10
+      };
+    })
+  );
+  const getValue = (index) => {
+    var _a;
+    return (_a = computedItems.value[index]) == null ? void 0 : _a[props.itemValue];
+  };
+  const getText = (index) => {
+    var _a;
+    return (_a = computedItems.value[index]) == null ? void 0 : _a[props.itemText];
+  };
+  vue.watch(
+    () => props.modelValue,
+    (nV) => {
+      internalValue.value = createInternalValue(
+        nV,
+        props.valueIsObject,
+        props.multiple,
+        props.itemValue,
+        internalItems.value
+      );
+    },
+    {
+      immediate: true,
+      deep: true
+    }
+  );
+  vue.watch(search, async (nV) => {
+    await scrollScrollerToTop();
+    await nextFrame();
+    if (!navigationSvc) {
+      return;
+    }
+    const firstItem = navigationSvc.getItems().filter((item) => item.style.transform.includes("translateY(0px)"))[0];
+    if (nV) {
+      navigationSvc.setFocusedItem(firstItem);
+    } else {
+      if (props.multiple) {
+        navigationSvc.setFocusedItem(firstItem);
+      } else {
+        getActiveItemIndex() > -1 ? scrollToActiveItem() : navigationSvc.clearFocusedState();
+      }
+    }
+  });
+  vue.onUnmounted(() => {
+    navigationSvc == null ? void 0 : navigationSvc.destroy();
+    navigationSvc = null;
+  });
+  const putSelectedItemsOnTop = () => {
+    if (props.selectedTopShown) {
+      const arr = internalItems.value.reduce(
+        (acc, curr) => {
+          internalValue.value.includes(curr[props.itemValue]) ? acc[0].push(curr) : acc[1].push(curr);
+          return acc;
+        },
+        [[], []]
+      );
+      internalItems.value = arr[0].sort(
+        (a, b) => String(a[props.itemText]).localeCompare(String(b[props.itemText]), void 0, {
+          numeric: true,
+          sensitivity: "base"
+        })
+      ).concat(arr[1]);
+    }
+  };
+  const select = async (e, val) => {
+    var _a, _b;
+    const el = e.currentTarget;
+    if (props.multiple && props.searchable && document.activeElement !== ((_a = inputSearch.value) == null ? void 0 : _a.$el.querySelector("input"))) {
+      (_b = inputSearch.value) == null ? void 0 : _b.$el.querySelector("input").focus();
+    }
+    if (props.multiple) {
+      if (!isSelected(val)) {
+        emit("update:modelValue", toArrOfObjIfNeeded([...internalValue.value, val]));
+      } else {
+        emit("update:modelValue", toArrOfObjIfNeeded(internalValue.value.filter((item) => item !== val)));
+      }
+    } else {
+      emit("update:modelValue", props.valueIsObject ? getItemByValue(val) : val);
+    }
+    await vue.nextTick();
+    navigationSvc == null ? void 0 : navigationSvc.setFocusedItem(el.parentElement);
+    emit("select", val);
+  };
+  const toArrOfObjIfNeeded = (arr) => {
+    return props.valueIsObject ? arr.map((val) => getItemByValue(val)) : arr;
+  };
+  const getItemByValue = (value) => {
+    return internalItems.value.find((item) => item[props.itemValue] === value);
+  };
+  const isSelected = (val) => {
+    return internalValue.value.includes(val);
+  };
+  const setupNavigationSvc = () => {
+    if (navigationSvc) {
+      navigationSvc.init();
+    } else {
+      navigationSvc = listKeyboardNavigation.setupListKeyboardNavigation({
+        itemContainer: virtualizerRef.value,
+        itemSelector: "[p-select-list-option]",
+        itemSelectSelector: `[p-select-list-option-item]`,
+        itemFocusClass: "bg-p-blue-10"
+      });
+    }
+  };
+  const destroyNavigationSvc = () => {
+    navigationSvc == null ? void 0 : navigationSvc.destroy();
+    navigationSvc = null;
+  };
+  const onFocus = async () => {
+    setupNavigationSvc();
+  };
+  const onMousemove = () => {
+    navigationSvc == null ? void 0 : navigationSvc.clearFocusedState();
+  };
+  const scrollScrollerToTop = async () => {
+    rowVirtualizer.value.scrollToOffset(0);
+    await nextFrame();
+  };
+  const scrollToActiveItem = async (options) => {
+    var _a;
+    if (options == null ? void 0 : options.wait) {
+      await nextLoop(options.wait);
+    }
+    const activeIndex = getActiveItemIndex();
+    if (virtualizerRef.value && rowVirtualizer.value && activeIndex > -1) {
+      rowVirtualizer.value.scrollToIndex(activeIndex, {
+        align: "center"
+      });
+      await nextLoop();
+      await nextFrame();
+      const activeEl = (_a = virtualizerRef.value) == null ? void 0 : _a.querySelector(`.${LIST_ITEM_ACTIVE_CLASS}`);
+      navigationSvc == null ? void 0 : navigationSvc.setFocusedItem(activeEl == null ? void 0 : activeEl.parentNode);
+    }
+  };
+  const getActiveItemIndex = () => {
+    return internalItems.value.indexOf(selectedItems.value[0]);
+  };
+  const selectAll = () => {
+    if (!props.multiple) {
+      return;
+    }
+    const selectedItems2 = internalValue.value;
+    const filteredItems = computedItems.value.map((item) => item[props.itemValue]);
+    const toEmit = lodashEs.uniqBy([...selectedItems2, ...filteredItems], (item) => item);
+    emit("update:modelValue", toArrOfObjIfNeeded(toEmit));
+  };
+  const clearAll = () => {
+    search.value = "";
+    emit("update:modelValue", []);
+  };
+  vue.watch(
+    () => props.items,
+    (nV) => {
+      internalItems.value = createInternalItems(nV);
+      if (props.multiple && props.items.length && internalValue.value.length) {
+        const internalValueFiltered = internalValue.value.filter((item) => {
+          return internalItems.value.some((i) => i[props.itemValue] === item);
+        });
+        if (internalValueFiltered.length !== internalValue.value.length) {
+          console.warn(`[p-select-list] Some values in the modelValue are not in the items list.`);
+          emit("update:modelValue", toArrOfObjIfNeeded(internalValueFiltered));
+        }
+      }
+    },
+    {
+      immediate: true
+    }
+  );
+  return {
+    LIST_ITEM_SIZES,
+    LIST_ITEM_CLASS,
+    LIST_ITEM_ACTIVE_CLASS,
+    selectedItems,
+    computedItems,
+    computedItemSize,
+    computedInsideSelected,
+    internalItems,
+    internalValue,
+    search,
+    rowVirtualizer,
+    getValue,
+    getText,
+    isSelected,
+    setupNavigationSvc,
+    destroyNavigationSvc,
+    select,
+    onFocus,
+    onMousemove,
+    scrollToActiveItem,
+    putSelectedItemsOnTop,
+    selectAll,
+    clearAll
+  };
+};
+exports.useSelectList = useSelectList;

package/dist/es/chunks/_plugin-vue_export-helper.js

@@ -1,9 +1,10 @@
-const s = (t, r) => {
-  const o = t.__vccOpts || t;
-  for (const [c, e] of r)
-    o[c] = e;
-  return o;
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
 };
 export {
-  s as _
+  _export_sfc as _
 };

package/dist/es/chunks/p-action-bar.js

@@ -1,52 +1,61 @@
-import { defineComponent as a, openBlock as n, createElementBlock as s, createVNode as m, createElementVNode as t, toDisplayString as l, Fragment as d, renderList as p, createBlock as c, withCtx as u, resolveDynamicComponent as k, createCommentVNode as f } from "vue";
-import x from "../p-btn.js";
-import _ from "../p-close-btn.js";
-const h = {
+import { defineComponent, openBlock, createElementBlock, createVNode, createElementVNode, toDisplayString, Fragment, renderList, createBlock, withCtx, resolveDynamicComponent, createCommentVNode } from "vue";
+import PBtn from "../p-btn.js";
+import PCloseBtn from "../p-close-btn.js";
+const _hoisted_1 = {
   class: "fixed bottom-6 left-1/2 flex h-12 -translate-x-1/2 select-none flex-row items-center rounded-lg bg-p-purple-60 px-2 text-sm font-medium text-white",
   role: "alertdialog"
-}, y = { class: "px-3" }, g = /* @__PURE__ */ t("div", { class: "mx-4 h-9 w-0.5 rounded bg-p-purple-50" }, null, -1), v = { class: "flex" }, C = { class: "flex items-center gap-2 px-1 py-0.5" }, N = /* @__PURE__ */ a({
+};
+const _hoisted_2 = { class: "px-3" };
+const _hoisted_3 = /* @__PURE__ */ createElementVNode("div", { class: "mx-4 h-9 w-0.5 rounded bg-p-purple-50" }, null, -1);
+const _hoisted_4 = { class: "flex" };
+const _hoisted_5 = { class: "flex items-center gap-2 px-1 py-0.5" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "p-action-bar",
   props: {
     label: {
       type: String,
-      required: !0
+      required: true
     },
     actions: {
       type: Array,
-      required: !0
+      required: true
     }
   },
   emits: ["click:dismiss", "click:action"],
-  setup(o) {
-    return (i, r) => (n(), s("div", h, [
-      m(_, {
-        variant: "dark",
-        onClick: r[0] || (r[0] = (e) => i.$emit("click:dismiss"))
-      }),
-      t("p", y, l(o.label), 1),
-      g,
-      t("div", v, [
-        (n(!0), s(d, null, p(o.actions, (e) => (n(), c(x, {
-          key: `action-${e.name}`,
-          size: "sm",
-          type: "secondary-ghost-dark",
-          onClick: (b) => i.$emit("click:action", e.name)
-        }, {
-          default: u(() => [
-            t("div", C, [
-              e.icon ? (n(), c(k(e.icon), {
-                key: 0,
-                class: "h-4 w-4"
-              })) : f("", !0),
-              t("div", null, l(e.label), 1)
-            ])
-          ]),
-          _: 2
-        }, 1032, ["onClick"]))), 128))
-      ])
-    ]));
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(PCloseBtn, {
+          variant: "dark",
+          onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("click:dismiss"))
+        }),
+        createElementVNode("p", _hoisted_2, toDisplayString(__props.label), 1),
+        _hoisted_3,
+        createElementVNode("div", _hoisted_4, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.actions, (action) => {
+            return openBlock(), createBlock(PBtn, {
+              key: `action-${action.name}`,
+              size: "sm",
+              type: "secondary-ghost-dark",
+              onClick: ($event) => _ctx.$emit("click:action", action.name)
+            }, {
+              default: withCtx(() => [
+                createElementVNode("div", _hoisted_5, [
+                  action.icon ? (openBlock(), createBlock(resolveDynamicComponent(action.icon), {
+                    key: 0,
+                    class: "h-4 w-4"
+                  })) : createCommentVNode("", true),
+                  createElementVNode("div", null, toDisplayString(action.label), 1)
+                ])
+              ]),
+              _: 2
+            }, 1032, ["onClick"]);
+          }), 128))
+        ])
+      ]);
+    };
   }
 });
 export {
-  N as _
+  _sfc_main as _
 };