@ark-ui/vue/dist/components/collection/use-list-collection.cjs

A collection of unstyled, accessible UI components for Vue, utilizing state machines for seamless interaction.

'use strict';

Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });

const vue = require('vue');
const listCollection = require('./list-collection.cjs');

function useListCollection(props) {
  const resolvedProps = vue.computed(() => {
    const { initialItems = [], filter, limit, ...collectionOptions } = vue.toValue(props);
    return [{ initialItems, filter, limit }, collectionOptions];
  });
  const create = (items) => {
    const [, collectionOptions] = resolvedProps.value;
    return listCollection.createListCollection({ ...collectionOptions, items });
  };
  const init = () => {
    const [localProps] = resolvedProps.value;
    return create(
      localProps.limit != null ? localProps.initialItems.slice(0, localProps.limit) : localProps.initialItems
    );
  };
  const collection = vue.ref(init());
  const setCollection = (newCollection) => {
    const [localProps] = resolvedProps.value;
    collection.value = localProps.limit == null ? newCollection : newCollection.copy(newCollection.items.slice(0, localProps.limit));
  };
  return {
    collection,
    filter: (inputValue) => {
      const [localProps] = resolvedProps.value;
      const filter = localProps.filter;
      if (!filter) return;
      const filtered = create(localProps.initialItems).filter((itemString) => filter(itemString, inputValue));
      setCollection(filtered);
    },
    set: (items) => {
      setCollection(create(items));
    },
    reset: () => {
      const [localProps] = resolvedProps.value;
      setCollection(create(localProps.initialItems));
    },
    clear: () => {
      setCollection(create([]));
    },
    insert: (index, ...items) => {
      setCollection(collection.value.insert(index, ...items));
    },
    insertBefore: (value, ...items) => {
      setCollection(collection.value.insertBefore(value, ...items));
    },
    insertAfter: (value, ...items) => {
      setCollection(collection.value.insertAfter(value, ...items));
    },
    remove: (...itemOrValues) => {
      setCollection(collection.value.remove(...itemOrValues));
    },
    move: (value, to) => {
      setCollection(collection.value.move(value, to));
    },
    moveBefore: (value, ...values) => {
      setCollection(collection.value.moveBefore(value, ...values));
    },
    moveAfter: (value, ...values) => {
      setCollection(collection.value.moveAfter(value, ...values));
    },
    reorder: (from, to) => {
      setCollection(collection.value.reorder(from, to));
    },
    append: (...items) => {
      setCollection(collection.value.append(...items));
    },
    prepend: (...items) => {
      setCollection(collection.value.prepend(...items));
    },
    update: (value, item) => {
      setCollection(collection.value.update(value, item));
    }
  };
}

exports.useListCollection = useListCollection;