vite-plugin-scope-tailwind
Version:
A vite-plugin to encapsulate and scope your TailwindCSS styles to your library and prevent them affecting styles outside
299 lines (298 loc) • 8.1 kB
JavaScript
import g from "path";
function E(e) {
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
}
function b(e) {
if (Object.prototype.hasOwnProperty.call(e, "__esModule")) return e;
var t = e.default;
if (typeof t == "function") {
var r = function n() {
return this instanceof n ? Reflect.construct(t, arguments, this.constructor) : t.apply(this, arguments);
};
r.prototype = t.prototype;
} else r = {};
return Object.defineProperty(r, "__esModule", { value: !0 }), Object.keys(e).forEach(function(n) {
var s = Object.getOwnPropertyDescriptor(e, n);
Object.defineProperty(r, n, s.get ? s : {
enumerable: !0,
get: function() {
return e[n];
}
});
}), r;
}
function T(e) {
throw new Error('Could not dynamically require "' + e + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
}
var f = { exports: {} };
const P = {}, O = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null,
default: P
}, Symbol.toStringTag, { value: "Module" })), A = /* @__PURE__ */ b(O);
var $;
function S() {
if ($) return f.exports;
$ = 1;
var e = typeof process < "u" && process.pid ? process.pid.toString(36) : "", t = "";
if (typeof __webpack_require__ != "function" && typeof T < "u") {
var r = "", n = A;
if (n.networkInterfaces) var s = n.networkInterfaces();
if (s) {
e:
for (let a in s) {
const c = s[a], u = c.length;
for (var o = 0; o < u; o++)
if (c[o] !== void 0 && c[o].mac && c[o].mac != "00:00:00:00:00:00") {
r = c[o].mac;
break e;
}
}
t = r ? parseInt(r.replace(/\:|\D+/gi, "")).toString(36) : "";
}
}
f.exports = f.exports.default = function(a, c) {
return (a || "") + t + e + l().toString(36) + (c || "");
}, f.exports.process = function(a, c) {
return (a || "") + e + l().toString(36) + (c || "");
}, f.exports.time = function(a, c) {
return (a || "") + l().toString(36) + (c || "");
};
function l() {
var a = Date.now(), c = l.last || a;
return l.last = a > c ? a : c + 1;
}
return f.exports;
}
var W = S();
const F = /* @__PURE__ */ E(W), d = {
tailwindClassNames: /* @__PURE__ */ new Set()
}, I = (e) => {
for (const t of e) {
if (t === "")
continue;
const r = t.replace(/\\/gi, "");
if (r.startsWith("[")) {
const n = [...r.matchAll(/(\[.+?\]:.+?):/g)], [[s, o = r]] = [
...n.length > 0 ? n : [[]]
];
d.tailwindClassNames.add(o), d.tailwindClassNames.add(t);
} else {
const [n] = [...r.matchAll(/^([a-z]+):/g)];
if (n && n[1]) {
const s = new RegExp(`(${n[1]}:.+):${n[1]}`, "gi"), [o] = [...r.matchAll(s)];
o && o[1] && d.tailwindClassNames.add(o[1]);
}
d.tailwindClassNames.add(r);
}
}
}, k = () => d.tailwindClassNames, i = (e) => e.replace(/"/g, "").replace(/'/g, ""), M = (e, t) => e.startsWith("'") && e.endsWith("'") ? `'${t}-${i(e)}'` : e.startsWith('"') && e.endsWith('"') ? `"${t}-${i(e)}"` : e.endsWith('"') ? `${t}-${i(e)}"` : e.endsWith("'") ? `${t}-${i(e)}'` : e.startsWith('"') ? `"${t}-${i(e)}` : e.startsWith("'") ? `'${t}-${i(e)}` : `${t}-${e}`, w = (e, t) => k().has(i(e)) ? M(e, t) : e, y = ({
c: e,
classIdentifier: t,
id: r
}) => {
const n = new RegExp(`${t}: "(.+?)"`, "gi"), s = e.matchAll(n);
for (const [o, l] of s)
e = e.replace(
o,
`${t}: "${l.split(" ").map((a) => w(a, r)).join(" ")}"`
);
return e;
}, x = ({
c: e,
classIdentifier: t,
id: r
}) => {
const n = new RegExp(`${t}: \`(.+?)\``, "gi"), s = e.matchAll(n);
for (const [o, l] of s)
e = e.replace(
o,
`${t}: \`${l.split(" ").map((a) => w(a, r)).join(" ")}\``
);
return e;
}, j = (e) => (t) => {
const r = /className/g;
if (t.match(r)) {
let s = t.replace(/className: "/g, `className: "${e} `).replace(/className: `/g, `className: \`${e} `);
return s = y({
c: s,
id: e,
classIdentifier: "className"
}), s = x({
c: s,
id: e,
classIdentifier: "className"
}), {
code: s,
map: null
};
} else
return {
code: t,
map: null
};
}, _ = (e) => (t) => {
const r = /class/g;
if (t.match(r)) {
let s = t.replace(/class: "/g, `class: "${e} `).replace(/class="/g, `class="${e} `);
return s = y({
c: s,
id: e,
classIdentifier: "class"
}), s = x({
c: s,
id: e,
classIdentifier: "class"
}), {
code: s,
map: null
};
} else
return {
code: t,
map: null
};
}, v = /* @__PURE__ */ new Set([
"blockquote",
"dl",
"dd",
"h1",
"h2",
"h3",
"h4",
"h5",
"h6",
"hr",
"figure",
"p",
"pr",
"ol",
"ul",
"img",
"svg",
"video",
"canvas",
"audio",
"iframe",
"embed",
"object"
]), D = (e) => (t) => R({
id: e,
regex: (r) => new RegExp(`"${r}", {(?:.|\\s)+?}\\)`, "g"),
innerRegex: (r) => new RegExp(`"${r}", ({(?:.|\\s)+?})+?`, "i"),
classText: "className",
replace: {
from: () => ", {",
to: () => `, {
className: "${e}",`
},
appendClassFn: j
})(t), z = (e) => (t) => R({
id: e,
regex: (r) => new RegExp(`<${r}(?:.|\\s)*?>[^<]*</${r}>`, "g"),
innerRegex: (r) => new RegExp(`<${r}(?:.|\\s)*?>`, "i"),
classText: "class",
replace: {
from: (r) => `<${r}`,
to: (r) => `<${r} class="${e}"`
},
appendClassFn: _
})(t), R = ({
id: e,
regex: t,
innerRegex: r,
classText: n,
replace: { from: s, to: o },
appendClassFn: l
}) => (a) => {
let c = a;
for (const u of v) {
const N = [...c.matchAll(t(u))].map((p) => p[0]);
for (const p of N) {
const [q] = [...c.match(r(u)) ?? []];
if (q.includes(n)) {
const C = l(e)(p);
c = c.replace(p, C.code);
} else
c = c.replace(p, p.replace(s(u), o(u)));
}
}
return {
code: c,
map: null
};
}, B = () => {
try {
const e = require(g.join(process.cwd(), "postcss.config.js"));
return m(e);
} catch {
}
try {
const e = require(g.join(process.cwd(), "postcss.config.cjs"));
return m(e);
} catch {
}
try {
const e = require(g.join(process.cwd(), "postcss.config.json"));
return m(e);
} catch {
}
return {
plugins: {
tailwindcss: {},
autoprefixer: {}
}
};
}, G = (e) => Object.keys(e.plugins), m = (e) => e.default ? e.default() : e, Q = (e) => e.split(new RegExp("(?<!\\\\)\\.")), U = (e, t) => (e = e.trim(), t instanceof RegExp ? !!t.exec(e) : typeof t == "string" ? e === t : Array.isArray(t) ? t.some((r) => r instanceof RegExp ? r.exec(e) : e === r) : e === t), H = ({
prefix: e,
ignore: t
}) => {
const r = e.replace(".", "");
return {
postcssPlugin: "prefix-tailwind-classes",
Root(n) {
n.walkRules((s) => {
if (!s.selectors)
return !1;
s.selectors = s.selectors.map((o) => {
if (o.indexOf(".") !== 0)
return v.has(o) ? o + "." + r : o;
var l = Q(o);
return I(l), l.map((a) => U(a, t) || a.trim().length === 0 ? a : `${r}-${a}`).join(".");
});
});
}
};
}, h = F("d"), L = (e) => (t) => ({
code: j(e)(D(e)(t).code).code,
map: null
}), J = (e) => (t) => ({
code: _(e)(z(e)(t).code).code,
map: null
}), V = ({
react: e = !1,
ignore: t = []
} = {}) => ({
name: "vite-plugin-scope-tailwind",
config: (r) => {
var o, l;
const n = ((l = (o = r.css) == null ? void 0 : o.postcss) == null ? void 0 : l.plugins) ?? [], s = B();
return {
css: {
postcss: {
plugins: [
...n,
...G(s).map(
(a) => require(g.join(process.cwd(), "node_modules", a))
),
H({ prefix: h, ignore: t })
]
}
}
};
},
transform: e ? L(h) : J(h)
});
export {
V as default
};
//# sourceMappingURL=index.mjs.map