vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
60 lines (59 loc) • 1.91 kB
JavaScript
import { defineComponent as g, computed as f, h as d, createElementBlock as r, openBlock as n, Fragment as h, renderList as x, createBlock as m, createTextVNode as y, toDisplayString as k, resolveDynamicComponent as _ } from "vue";
const v = { class: "highlight-wrap" }, S = /* @__PURE__ */ g({
__name: "Highlight",
props: {
text: { default: void 0 },
patterns: { default: () => [] },
autoEscape: { type: Boolean, default: !0 },
caseSensitive: { type: Boolean, default: !1 },
highlightTag: { default: "mark" },
highlightClass: { default: void 0 },
highlightStyle: { default: () => ({}) }
},
setup(c) {
const t = c, o = f(() => {
if (t.patterns.length === 0 || !t.text)
return [t.text];
{
const a = t.patterns.map((e) => t.autoEscape ? p(e) : e).join("|"), s = new RegExp(`(${a})`, t.caseSensitive ? "g" : "gi");
return u(t.text, s).map((e) => e.isMatch ? d(
t.highlightTag,
{
class: ["highlight-mark", t.highlightClass],
style: t.highlightStyle
},
e.text
) : e.text);
}
});
function p(a) {
return a.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
}
function u(a, s) {
const l = [];
let e = 0, i;
for (; (i = s.exec(a)) !== null && (i.index > e && l.push({
text: a.slice(e, i.index),
isMatch: !1
}), l.push({
text: i[0],
isMatch: !0
}), e = s.lastIndex, !!s.global); )
;
return e < a.length && l.push({
text: a.slice(e),
isMatch: !1
}), l;
}
return (a, s) => (n(), r("span", v, [
(n(!0), r(h, null, x(o.value, (l, e) => (n(), r(h, { key: e }, [
typeof l == "string" ? (n(), r(h, { key: 0 }, [
y(k(l), 1)
], 64)) : (n(), m(_(l), { key: 1 }))
], 64))), 128))
]));
}
});
export {
S as default
};