@ark-ui/vue/dist/components/highlight/highlight.vue.js

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

import { defineComponent, createElementBlock, openBlock, Fragment, renderList, unref, toDisplayString, createTextVNode } from 'vue';
import { useHighlight } from './use-highlight.js';

const _hoisted_1 = { key: 0 };
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "highlight",
  props: {
    text: {},
    query: {},
    ignoreCase: { type: Boolean, default: void 0 },
    matchAll: { type: Boolean, default: void 0 },
    exactMatch: { type: Boolean, default: void 0 }
  },
  setup(__props) {
    const props = __props;
    if (typeof props.text !== "string") {
      throw new Error("[ark-ui/highlight] text must be a string");
    }
    const chunks = useHighlight(props);
    return (_ctx, _cache) => {
      return openBlock(true), createElementBlock(Fragment, null, renderList(unref(chunks), (chunk) => {
        return openBlock(), createElementBlock(Fragment, null, [
          chunk.match ? (openBlock(), createElementBlock("mark", _hoisted_1, toDisplayString(chunk.text), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
            createTextVNode(toDisplayString(chunk.text), 1)
          ], 64))
        ], 64);
      }), 256);
    };
  }
});

export { _sfc_main as default };