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

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

'use strict';

Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });

const vue = require('vue');
const useHighlight = require('./use-highlight.cjs');

const _hoisted_1 = { key: 0 };
const _sfc_main = /* @__PURE__ */ vue.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.useHighlight(props);
    return (_ctx, _cache) => {
      return vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(chunks), (chunk) => {
        return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
          chunk.match ? (vue.openBlock(), vue.createElementBlock("mark", _hoisted_1, vue.toDisplayString(chunk.text), 1)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
            vue.createTextVNode(vue.toDisplayString(chunk.text), 1)
          ], 64))
        ], 64);
      }), 256);
    };
  }
});

exports.default = _sfc_main;