alpinejs
Version:
The rugged, minimal JavaScript framework
1,704 lines (1,675 loc) • 95.9 kB
JavaScript
// packages/alpinejs/src/scheduler.js
var flushPending = false;
var flushing = false;
var queue = [];
var lastFlushedIndex = -1;
function scheduler(callback) {
queueJob(callback);
}
function queueJob(job) {
if (!queue.includes(job))
queue.push(job);
queueFlush();
}
function dequeueJob(job) {
let index = queue.indexOf(job);
if (index !== -1 && index > lastFlushedIndex)
queue.splice(index, 1);
}
function queueFlush() {
if (!flushing && !flushPending) {
flushPending = true;
queueMicrotask(flushJobs);
}
}
function flushJobs() {
flushPending = false;
flushing = true;
for (let i = 0; i < queue.length; i++) {
queue[i]();
lastFlushedIndex = i;
}
queue.length = 0;
lastFlushedIndex = -1;
flushing = false;
}
// packages/alpinejs/src/reactivity.js
var reactive;
var effect;
var release;
var raw;
var shouldSchedule = true;
function disableEffectScheduling(callback) {
shouldSchedule = false;
callback();
shouldSchedule = true;
}
function setReactivityEngine(engine) {
reactive = engine.reactive;
release = engine.release;
effect = (callback) => engine.effect(callback, {scheduler: (task) => {
if (shouldSchedule) {
scheduler(task);
} else {
task();
}
}});
raw = engine.raw;
}
function overrideEffect(override) {
effect = override;
}
function elementBoundEffect(el) {
let cleanup2 = () => {
};
let wrappedEffect = (callback) => {
let effectReference = effect(callback);
if (!el._x_effects) {
el._x_effects = new Set();
el._x_runEffects = () => {
el._x_effects.forEach((i) => i());
};
}
el._x_effects.add(effectReference);
cleanup2 = () => {
if (effectReference === void 0)
return;
el._x_effects.delete(effectReference);
release(effectReference);
};
return effectReference;
};
return [wrappedEffect, () => {
cleanup2();
}];
}
// packages/alpinejs/src/mutation.js
var onAttributeAddeds = [];
var onElRemoveds = [];
var onElAddeds = [];
function onElAdded(callback) {
onElAddeds.push(callback);
}
function onElRemoved(el, callback) {
if (typeof callback === "function") {
if (!el._x_cleanups)
el._x_cleanups = [];
el._x_cleanups.push(callback);
} else {
callback = el;
onElRemoveds.push(callback);
}
}
function onAttributesAdded(callback) {
onAttributeAddeds.push(callback);
}
function onAttributeRemoved(el, name, callback) {
if (!el._x_attributeCleanups)
el._x_attributeCleanups = {};
if (!el._x_attributeCleanups[name])
el._x_attributeCleanups[name] = [];
el._x_attributeCleanups[name].push(callback);
}
function cleanupAttributes(el, names) {
if (!el._x_attributeCleanups)
return;
Object.entries(el._x_attributeCleanups).forEach(([name, value]) => {
if (names === void 0 || names.includes(name)) {
value.forEach((i) => i());
delete el._x_attributeCleanups[name];
}
});
}
var observer = new MutationObserver(onMutate);
var currentlyObserving = false;
function startObservingMutations() {
observer.observe(document, {subtree: true, childList: true, attributes: true, attributeOldValue: true});
currentlyObserving = true;
}
function stopObservingMutations() {
flushObserver();
observer.disconnect();
currentlyObserving = false;
}
var recordQueue = [];
var willProcessRecordQueue = false;
function flushObserver() {
recordQueue = recordQueue.concat(observer.takeRecords());
if (recordQueue.length && !willProcessRecordQueue) {
willProcessRecordQueue = true;
queueMicrotask(() => {
processRecordQueue();
willProcessRecordQueue = false;
});
}
}
function processRecordQueue() {
onMutate(recordQueue);
recordQueue.length = 0;
}
function mutateDom(callback) {
if (!currentlyObserving)
return callback();
stopObservingMutations();
let result = callback();
startObservingMutations();
return result;
}
var isCollecting = false;
var deferredMutations = [];
function deferMutations() {
isCollecting = true;
}
function flushAndStopDeferringMutations() {
isCollecting = false;
onMutate(deferredMutations);
deferredMutations = [];
}
function onMutate(mutations) {
if (isCollecting) {
deferredMutations = deferredMutations.concat(mutations);
return;
}
let addedNodes = [];
let removedNodes = [];
let addedAttributes = new Map();
let removedAttributes = new Map();
for (let i = 0; i < mutations.length; i++) {
if (mutations[i].target._x_ignoreMutationObserver)
continue;
if (mutations[i].type === "childList") {
mutations[i].addedNodes.forEach((node) => node.nodeType === 1 && addedNodes.push(node));
mutations[i].removedNodes.forEach((node) => node.nodeType === 1 && removedNodes.push(node));
}
if (mutations[i].type === "attributes") {
let el = mutations[i].target;
let name = mutations[i].attributeName;
let oldValue = mutations[i].oldValue;
let add2 = () => {
if (!addedAttributes.has(el))
addedAttributes.set(el, []);
addedAttributes.get(el).push({name, value: el.getAttribute(name)});
};
let remove = () => {
if (!removedAttributes.has(el))
removedAttributes.set(el, []);
removedAttributes.get(el).push(name);
};
if (el.hasAttribute(name) && oldValue === null) {
add2();
} else if (el.hasAttribute(name)) {
remove();
add2();
} else {
remove();
}
}
}
removedAttributes.forEach((attrs, el) => {
cleanupAttributes(el, attrs);
});
addedAttributes.forEach((attrs, el) => {
onAttributeAddeds.forEach((i) => i(el, attrs));
});
for (let node of removedNodes) {
if (addedNodes.includes(node))
continue;
onElRemoveds.forEach((i) => i(node));
if (node._x_cleanups) {
while (node._x_cleanups.length)
node._x_cleanups.pop()();
}
}
addedNodes.forEach((node) => {
node._x_ignoreSelf = true;
node._x_ignore = true;
});
for (let node of addedNodes) {
if (removedNodes.includes(node))
continue;
if (!node.isConnected)
continue;
delete node._x_ignoreSelf;
delete node._x_ignore;
onElAddeds.forEach((i) => i(node));
node._x_ignore = true;
node._x_ignoreSelf = true;
}
addedNodes.forEach((node) => {
delete node._x_ignoreSelf;
delete node._x_ignore;
});
addedNodes = null;
removedNodes = null;
addedAttributes = null;
removedAttributes = null;
}
// packages/alpinejs/src/scope.js
function scope(node) {
return mergeProxies(closestDataStack(node));
}
function addScopeToNode(node, data2, referenceNode) {
node._x_dataStack = [data2, ...closestDataStack(referenceNode || node)];
return () => {
node._x_dataStack = node._x_dataStack.filter((i) => i !== data2);
};
}
function closestDataStack(node) {
if (node._x_dataStack)
return node._x_dataStack;
if (typeof ShadowRoot === "function" && node instanceof ShadowRoot) {
return closestDataStack(node.host);
}
if (!node.parentNode) {
return [];
}
return closestDataStack(node.parentNode);
}
function mergeProxies(objects) {
let thisProxy = new Proxy({}, {
ownKeys: () => {
return Array.from(new Set(objects.flatMap((i) => Object.keys(i))));
},
has: (target, name) => {
return objects.some((obj) => obj.hasOwnProperty(name));
},
get: (target, name) => {
return (objects.find((obj) => {
if (obj.hasOwnProperty(name)) {
let descriptor = Object.getOwnPropertyDescriptor(obj, name);
if (descriptor.get && descriptor.get._x_alreadyBound || descriptor.set && descriptor.set._x_alreadyBound) {
return true;
}
if ((descriptor.get || descriptor.set) && descriptor.enumerable) {
let getter = descriptor.get;
let setter = descriptor.set;
let property = descriptor;
getter = getter && getter.bind(thisProxy);
setter = setter && setter.bind(thisProxy);
if (getter)
getter._x_alreadyBound = true;
if (setter)
setter._x_alreadyBound = true;
Object.defineProperty(obj, name, {
...property,
get: getter,
set: setter
});
}
return true;
}
return false;
}) || {})[name];
},
set: (target, name, value) => {
let closestObjectWithKey = objects.find((obj) => obj.hasOwnProperty(name));
if (closestObjectWithKey) {
closestObjectWithKey[name] = value;
} else {
objects[objects.length - 1][name] = value;
}
return true;
}
});
return thisProxy;
}
// packages/alpinejs/src/interceptor.js
function initInterceptors(data2) {
let isObject2 = (val) => typeof val === "object" && !Array.isArray(val) && val !== null;
let recurse = (obj, basePath = "") => {
Object.entries(Object.getOwnPropertyDescriptors(obj)).forEach(([key, {value, enumerable}]) => {
if (enumerable === false || value === void 0)
return;
let path = basePath === "" ? key : `${basePath}.${key}`;
if (typeof value === "object" && value !== null && value._x_interceptor) {
obj[key] = value.initialize(data2, path, key);
} else {
if (isObject2(value) && value !== obj && !(value instanceof Element)) {
recurse(value, path);
}
}
});
};
return recurse(data2);
}
function interceptor(callback, mutateObj = () => {
}) {
let obj = {
initialValue: void 0,
_x_interceptor: true,
initialize(data2, path, key) {
return callback(this.initialValue, () => get(data2, path), (value) => set(data2, path, value), path, key);
}
};
mutateObj(obj);
return (initialValue) => {
if (typeof initialValue === "object" && initialValue !== null && initialValue._x_interceptor) {
let initialize = obj.initialize.bind(obj);
obj.initialize = (data2, path, key) => {
let innerValue = initialValue.initialize(data2, path, key);
obj.initialValue = innerValue;
return initialize(data2, path, key);
};
} else {
obj.initialValue = initialValue;
}
return obj;
};
}
function get(obj, path) {
return path.split(".").reduce((carry, segment) => carry[segment], obj);
}
function set(obj, path, value) {
if (typeof path === "string")
path = path.split(".");
if (path.length === 1)
obj[path[0]] = value;
else if (path.length === 0)
throw error;
else {
if (obj[path[0]])
return set(obj[path[0]], path.slice(1), value);
else {
obj[path[0]] = {};
return set(obj[path[0]], path.slice(1), value);
}
}
}
// packages/alpinejs/src/magics.js
var magics = {};
function magic(name, callback) {
magics[name] = callback;
}
function injectMagics(obj, el) {
Object.entries(magics).forEach(([name, callback]) => {
let memoizedUtilities = null;
function getUtilities() {
if (memoizedUtilities) {
return memoizedUtilities;
} else {
let [utilities, cleanup2] = getElementBoundUtilities(el);
memoizedUtilities = {interceptor, ...utilities};
onElRemoved(el, cleanup2);
return memoizedUtilities;
}
}
Object.defineProperty(obj, `$${name}`, {
get() {
return callback(el, getUtilities());
},
enumerable: false
});
});
return obj;
}
// packages/alpinejs/src/utils/error.js
function tryCatch(el, expression, callback, ...args) {
try {
return callback(...args);
} catch (e) {
handleError(e, el, expression);
}
}
function handleError(error2, el, expression = void 0) {
Object.assign(error2, {el, expression});
console.warn(`Alpine Expression Error: ${error2.message}
${expression ? 'Expression: "' + expression + '"\n\n' : ""}`, el);
setTimeout(() => {
throw error2;
}, 0);
}
// packages/alpinejs/src/evaluator.js
var shouldAutoEvaluateFunctions = true;
function dontAutoEvaluateFunctions(callback) {
let cache = shouldAutoEvaluateFunctions;
shouldAutoEvaluateFunctions = false;
let result = callback();
shouldAutoEvaluateFunctions = cache;
return result;
}
function evaluate(el, expression, extras = {}) {
let result;
evaluateLater(el, expression)((value) => result = value, extras);
return result;
}
function evaluateLater(...args) {
return theEvaluatorFunction(...args);
}
var theEvaluatorFunction = normalEvaluator;
function setEvaluator(newEvaluator) {
theEvaluatorFunction = newEvaluator;
}
function normalEvaluator(el, expression) {
let overriddenMagics = {};
injectMagics(overriddenMagics, el);
let dataStack = [overriddenMagics, ...closestDataStack(el)];
let evaluator = typeof expression === "function" ? generateEvaluatorFromFunction(dataStack, expression) : generateEvaluatorFromString(dataStack, expression, el);
return tryCatch.bind(null, el, expression, evaluator);
}
function generateEvaluatorFromFunction(dataStack, func) {
return (receiver = () => {
}, {scope: scope2 = {}, params = []} = {}) => {
let result = func.apply(mergeProxies([scope2, ...dataStack]), params);
runIfTypeOfFunction(receiver, result);
};
}
var evaluatorMemo = {};
function generateFunctionFromString(expression, el) {
if (evaluatorMemo[expression]) {
return evaluatorMemo[expression];
}
let AsyncFunction = Object.getPrototypeOf(async function() {
}).constructor;
let rightSideSafeExpression = /^[\n\s]*if.*\(.*\)/.test(expression) || /^(let|const)\s/.test(expression) ? `(async()=>{ ${expression} })()` : expression;
const safeAsyncFunction = () => {
try {
return new AsyncFunction(["__self", "scope"], `with (scope) { __self.result = ${rightSideSafeExpression} }; __self.finished = true; return __self.result;`);
} catch (error2) {
handleError(error2, el, expression);
return Promise.resolve();
}
};
let func = safeAsyncFunction();
evaluatorMemo[expression] = func;
return func;
}
function generateEvaluatorFromString(dataStack, expression, el) {
let func = generateFunctionFromString(expression, el);
return (receiver = () => {
}, {scope: scope2 = {}, params = []} = {}) => {
func.result = void 0;
func.finished = false;
let completeScope = mergeProxies([scope2, ...dataStack]);
if (typeof func === "function") {
let promise = func(func, completeScope).catch((error2) => handleError(error2, el, expression));
if (func.finished) {
runIfTypeOfFunction(receiver, func.result, completeScope, params, el);
func.result = void 0;
} else {
promise.then((result) => {
runIfTypeOfFunction(receiver, result, completeScope, params, el);
}).catch((error2) => handleError(error2, el, expression)).finally(() => func.result = void 0);
}
}
};
}
function runIfTypeOfFunction(receiver, value, scope2, params, el) {
if (shouldAutoEvaluateFunctions && typeof value === "function") {
let result = value.apply(scope2, params);
if (result instanceof Promise) {
result.then((i) => runIfTypeOfFunction(receiver, i, scope2, params)).catch((error2) => handleError(error2, el, value));
} else {
receiver(result);
}
} else if (typeof value === "object" && value instanceof Promise) {
value.then((i) => receiver(i));
} else {
receiver(value);
}
}
// packages/alpinejs/src/directives.js
var prefixAsString = "x-";
function prefix(subject = "") {
return prefixAsString + subject;
}
function setPrefix(newPrefix) {
prefixAsString = newPrefix;
}
var directiveHandlers = {};
function directive(name, callback) {
directiveHandlers[name] = callback;
return {
before(directive2) {
if (!directiveHandlers[directive2]) {
console.warn("Cannot find directive `${directive}`. `${name}` will use the default order of execution");
return;
}
const pos = directiveOrder.indexOf(directive2);
directiveOrder.splice(pos >= 0 ? pos : directiveOrder.indexOf("DEFAULT"), 0, name);
}
};
}
function directives(el, attributes, originalAttributeOverride) {
attributes = Array.from(attributes);
if (el._x_virtualDirectives) {
let vAttributes = Object.entries(el._x_virtualDirectives).map(([name, value]) => ({name, value}));
let staticAttributes = attributesOnly(vAttributes);
vAttributes = vAttributes.map((attribute) => {
if (staticAttributes.find((attr) => attr.name === attribute.name)) {
return {
name: `x-bind:${attribute.name}`,
value: `"${attribute.value}"`
};
}
return attribute;
});
attributes = attributes.concat(vAttributes);
}
let transformedAttributeMap = {};
let directives2 = attributes.map(toTransformedAttributes((newName, oldName) => transformedAttributeMap[newName] = oldName)).filter(outNonAlpineAttributes).map(toParsedDirectives(transformedAttributeMap, originalAttributeOverride)).sort(byPriority);
return directives2.map((directive2) => {
return getDirectiveHandler(el, directive2);
});
}
function attributesOnly(attributes) {
return Array.from(attributes).map(toTransformedAttributes()).filter((attr) => !outNonAlpineAttributes(attr));
}
var isDeferringHandlers = false;
var directiveHandlerStacks = new Map();
var currentHandlerStackKey = Symbol();
function deferHandlingDirectives(callback) {
isDeferringHandlers = true;
let key = Symbol();
currentHandlerStackKey = key;
directiveHandlerStacks.set(key, []);
let flushHandlers = () => {
while (directiveHandlerStacks.get(key).length)
directiveHandlerStacks.get(key).shift()();
directiveHandlerStacks.delete(key);
};
let stopDeferring = () => {
isDeferringHandlers = false;
flushHandlers();
};
callback(flushHandlers);
stopDeferring();
}
function getElementBoundUtilities(el) {
let cleanups = [];
let cleanup2 = (callback) => cleanups.push(callback);
let [effect3, cleanupEffect] = elementBoundEffect(el);
cleanups.push(cleanupEffect);
let utilities = {
Alpine: alpine_default,
effect: effect3,
cleanup: cleanup2,
evaluateLater: evaluateLater.bind(evaluateLater, el),
evaluate: evaluate.bind(evaluate, el)
};
let doCleanup = () => cleanups.forEach((i) => i());
return [utilities, doCleanup];
}
function getDirectiveHandler(el, directive2) {
let noop = () => {
};
let handler4 = directiveHandlers[directive2.type] || noop;
let [utilities, cleanup2] = getElementBoundUtilities(el);
onAttributeRemoved(el, directive2.original, cleanup2);
let fullHandler = () => {
if (el._x_ignore || el._x_ignoreSelf)
return;
handler4.inline && handler4.inline(el, directive2, utilities);
handler4 = handler4.bind(handler4, el, directive2, utilities);
isDeferringHandlers ? directiveHandlerStacks.get(currentHandlerStackKey).push(handler4) : handler4();
};
fullHandler.runCleanups = cleanup2;
return fullHandler;
}
var startingWith = (subject, replacement) => ({name, value}) => {
if (name.startsWith(subject))
name = name.replace(subject, replacement);
return {name, value};
};
var into = (i) => i;
function toTransformedAttributes(callback = () => {
}) {
return ({name, value}) => {
let {name: newName, value: newValue} = attributeTransformers.reduce((carry, transform) => {
return transform(carry);
}, {name, value});
if (newName !== name)
callback(newName, name);
return {name: newName, value: newValue};
};
}
var attributeTransformers = [];
function mapAttributes(callback) {
attributeTransformers.push(callback);
}
function outNonAlpineAttributes({name}) {
return alpineAttributeRegex().test(name);
}
var alpineAttributeRegex = () => new RegExp(`^${prefixAsString}([^:^.]+)\\b`);
function toParsedDirectives(transformedAttributeMap, originalAttributeOverride) {
return ({name, value}) => {
let typeMatch = name.match(alpineAttributeRegex());
let valueMatch = name.match(/:([a-zA-Z0-9\-:]+)/);
let modifiers = name.match(/\.[^.\]]+(?=[^\]]*$)/g) || [];
let original = originalAttributeOverride || transformedAttributeMap[name] || name;
return {
type: typeMatch ? typeMatch[1] : null,
value: valueMatch ? valueMatch[1] : null,
modifiers: modifiers.map((i) => i.replace(".", "")),
expression: value,
original
};
};
}
var DEFAULT = "DEFAULT";
var directiveOrder = [
"ignore",
"ref",
"data",
"id",
"bind",
"init",
"for",
"model",
"modelable",
"transition",
"show",
"if",
DEFAULT,
"teleport"
];
function byPriority(a, b) {
let typeA = directiveOrder.indexOf(a.type) === -1 ? DEFAULT : a.type;
let typeB = directiveOrder.indexOf(b.type) === -1 ? DEFAULT : b.type;
return directiveOrder.indexOf(typeA) - directiveOrder.indexOf(typeB);
}
// packages/alpinejs/src/utils/dispatch.js
function dispatch(el, name, detail = {}) {
el.dispatchEvent(new CustomEvent(name, {
detail,
bubbles: true,
composed: true,
cancelable: true
}));
}
// packages/alpinejs/src/utils/walk.js
function walk(el, callback) {
if (typeof ShadowRoot === "function" && el instanceof ShadowRoot) {
Array.from(el.children).forEach((el2) => walk(el2, callback));
return;
}
let skip = false;
callback(el, () => skip = true);
if (skip)
return;
let node = el.firstElementChild;
while (node) {
walk(node, callback, false);
node = node.nextElementSibling;
}
}
// packages/alpinejs/src/utils/warn.js
function warn(message, ...args) {
console.warn(`Alpine Warning: ${message}`, ...args);
}
// packages/alpinejs/src/lifecycle.js
var started = false;
function start() {
if (started)
warn("Alpine has already been initialized on this page. Calling Alpine.start() more than once can cause problems.");
started = true;
if (!document.body)
warn("Unable to initialize. Trying to load Alpine before `<body>` is available. Did you forget to add `defer` in Alpine's `<script>` tag?");
dispatch(document, "alpine:init");
dispatch(document, "alpine:initializing");
startObservingMutations();
onElAdded((el) => initTree(el, walk));
onElRemoved((el) => destroyTree(el));
onAttributesAdded((el, attrs) => {
directives(el, attrs).forEach((handle) => handle());
});
let outNestedComponents = (el) => !closestRoot(el.parentElement, true);
Array.from(document.querySelectorAll(allSelectors())).filter(outNestedComponents).forEach((el) => {
initTree(el);
});
dispatch(document, "alpine:initialized");
}
var rootSelectorCallbacks = [];
var initSelectorCallbacks = [];
function rootSelectors() {
return rootSelectorCallbacks.map((fn) => fn());
}
function allSelectors() {
return rootSelectorCallbacks.concat(initSelectorCallbacks).map((fn) => fn());
}
function addRootSelector(selectorCallback) {
rootSelectorCallbacks.push(selectorCallback);
}
function addInitSelector(selectorCallback) {
initSelectorCallbacks.push(selectorCallback);
}
function closestRoot(el, includeInitSelectors = false) {
return findClosest(el, (element) => {
const selectors = includeInitSelectors ? allSelectors() : rootSelectors();
if (selectors.some((selector) => element.matches(selector)))
return true;
});
}
function findClosest(el, callback) {
if (!el)
return;
if (callback(el))
return el;
if (el._x_teleportBack)
el = el._x_teleportBack;
if (!el.parentElement)
return;
return findClosest(el.parentElement, callback);
}
function isRoot(el) {
return rootSelectors().some((selector) => el.matches(selector));
}
var initInterceptors2 = [];
function interceptInit(callback) {
initInterceptors2.push(callback);
}
function initTree(el, walker = walk, intercept = () => {
}) {
deferHandlingDirectives(() => {
walker(el, (el2, skip) => {
intercept(el2, skip);
initInterceptors2.forEach((i) => i(el2, skip));
directives(el2, el2.attributes).forEach((handle) => handle());
el2._x_ignore && skip();
});
});
}
function destroyTree(root) {
walk(root, (el) => cleanupAttributes(el));
}
// packages/alpinejs/src/nextTick.js
var tickStack = [];
var isHolding = false;
function nextTick(callback = () => {
}) {
queueMicrotask(() => {
isHolding || setTimeout(() => {
releaseNextTicks();
});
});
return new Promise((res) => {
tickStack.push(() => {
callback();
res();
});
});
}
function releaseNextTicks() {
isHolding = false;
while (tickStack.length)
tickStack.shift()();
}
function holdNextTicks() {
isHolding = true;
}
// packages/alpinejs/src/utils/classes.js
function setClasses(el, value) {
if (Array.isArray(value)) {
return setClassesFromString(el, value.join(" "));
} else if (typeof value === "object" && value !== null) {
return setClassesFromObject(el, value);
} else if (typeof value === "function") {
return setClasses(el, value());
}
return setClassesFromString(el, value);
}
function setClassesFromString(el, classString) {
let split = (classString2) => classString2.split(" ").filter(Boolean);
let missingClasses = (classString2) => classString2.split(" ").filter((i) => !el.classList.contains(i)).filter(Boolean);
let addClassesAndReturnUndo = (classes) => {
el.classList.add(...classes);
return () => {
el.classList.remove(...classes);
};
};
classString = classString === true ? classString = "" : classString || "";
return addClassesAndReturnUndo(missingClasses(classString));
}
function setClassesFromObject(el, classObject) {
let split = (classString) => classString.split(" ").filter(Boolean);
let forAdd = Object.entries(classObject).flatMap(([classString, bool]) => bool ? split(classString) : false).filter(Boolean);
let forRemove = Object.entries(classObject).flatMap(([classString, bool]) => !bool ? split(classString) : false).filter(Boolean);
let added = [];
let removed = [];
forRemove.forEach((i) => {
if (el.classList.contains(i)) {
el.classList.remove(i);
removed.push(i);
}
});
forAdd.forEach((i) => {
if (!el.classList.contains(i)) {
el.classList.add(i);
added.push(i);
}
});
return () => {
removed.forEach((i) => el.classList.add(i));
added.forEach((i) => el.classList.remove(i));
};
}
// packages/alpinejs/src/utils/styles.js
function setStyles(el, value) {
if (typeof value === "object" && value !== null) {
return setStylesFromObject(el, value);
}
return setStylesFromString(el, value);
}
function setStylesFromObject(el, value) {
let previousStyles = {};
Object.entries(value).forEach(([key, value2]) => {
previousStyles[key] = el.style[key];
if (!key.startsWith("--")) {
key = kebabCase(key);
}
el.style.setProperty(key, value2);
});
setTimeout(() => {
if (el.style.length === 0) {
el.removeAttribute("style");
}
});
return () => {
setStyles(el, previousStyles);
};
}
function setStylesFromString(el, value) {
let cache = el.getAttribute("style", value);
el.setAttribute("style", value);
return () => {
el.setAttribute("style", cache || "");
};
}
function kebabCase(subject) {
return subject.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
}
// packages/alpinejs/src/utils/once.js
function once(callback, fallback = () => {
}) {
let called = false;
return function() {
if (!called) {
called = true;
callback.apply(this, arguments);
} else {
fallback.apply(this, arguments);
}
};
}
// packages/alpinejs/src/directives/x-transition.js
directive("transition", (el, {value, modifiers, expression}, {evaluate: evaluate2}) => {
if (typeof expression === "function")
expression = evaluate2(expression);
if (expression === false)
return;
if (!expression || typeof expression === "boolean") {
registerTransitionsFromHelper(el, modifiers, value);
} else {
registerTransitionsFromClassString(el, expression, value);
}
});
function registerTransitionsFromClassString(el, classString, stage) {
registerTransitionObject(el, setClasses, "");
let directiveStorageMap = {
enter: (classes) => {
el._x_transition.enter.during = classes;
},
"enter-start": (classes) => {
el._x_transition.enter.start = classes;
},
"enter-end": (classes) => {
el._x_transition.enter.end = classes;
},
leave: (classes) => {
el._x_transition.leave.during = classes;
},
"leave-start": (classes) => {
el._x_transition.leave.start = classes;
},
"leave-end": (classes) => {
el._x_transition.leave.end = classes;
}
};
directiveStorageMap[stage](classString);
}
function registerTransitionsFromHelper(el, modifiers, stage) {
registerTransitionObject(el, setStyles);
let doesntSpecify = !modifiers.includes("in") && !modifiers.includes("out") && !stage;
let transitioningIn = doesntSpecify || modifiers.includes("in") || ["enter"].includes(stage);
let transitioningOut = doesntSpecify || modifiers.includes("out") || ["leave"].includes(stage);
if (modifiers.includes("in") && !doesntSpecify) {
modifiers = modifiers.filter((i, index) => index < modifiers.indexOf("out"));
}
if (modifiers.includes("out") && !doesntSpecify) {
modifiers = modifiers.filter((i, index) => index > modifiers.indexOf("out"));
}
let wantsAll = !modifiers.includes("opacity") && !modifiers.includes("scale");
let wantsOpacity = wantsAll || modifiers.includes("opacity");
let wantsScale = wantsAll || modifiers.includes("scale");
let opacityValue = wantsOpacity ? 0 : 1;
let scaleValue = wantsScale ? modifierValue(modifiers, "scale", 95) / 100 : 1;
let delay = modifierValue(modifiers, "delay", 0) / 1e3;
let origin = modifierValue(modifiers, "origin", "center");
let property = "opacity, transform";
let durationIn = modifierValue(modifiers, "duration", 150) / 1e3;
let durationOut = modifierValue(modifiers, "duration", 75) / 1e3;
let easing = `cubic-bezier(0.4, 0.0, 0.2, 1)`;
if (transitioningIn) {
el._x_transition.enter.during = {
transformOrigin: origin,
transitionDelay: `${delay}s`,
transitionProperty: property,
transitionDuration: `${durationIn}s`,
transitionTimingFunction: easing
};
el._x_transition.enter.start = {
opacity: opacityValue,
transform: `scale(${scaleValue})`
};
el._x_transition.enter.end = {
opacity: 1,
transform: `scale(1)`
};
}
if (transitioningOut) {
el._x_transition.leave.during = {
transformOrigin: origin,
transitionDelay: `${delay}s`,
transitionProperty: property,
transitionDuration: `${durationOut}s`,
transitionTimingFunction: easing
};
el._x_transition.leave.start = {
opacity: 1,
transform: `scale(1)`
};
el._x_transition.leave.end = {
opacity: opacityValue,
transform: `scale(${scaleValue})`
};
}
}
function registerTransitionObject(el, setFunction, defaultValue = {}) {
if (!el._x_transition)
el._x_transition = {
enter: {during: defaultValue, start: defaultValue, end: defaultValue},
leave: {during: defaultValue, start: defaultValue, end: defaultValue},
in(before = () => {
}, after = () => {
}) {
transition(el, setFunction, {
during: this.enter.during,
start: this.enter.start,
end: this.enter.end
}, before, after);
},
out(before = () => {
}, after = () => {
}) {
transition(el, setFunction, {
during: this.leave.during,
start: this.leave.start,
end: this.leave.end
}, before, after);
}
};
}
window.Element.prototype._x_toggleAndCascadeWithTransitions = function(el, value, show, hide) {
const nextTick2 = document.visibilityState === "visible" ? requestAnimationFrame : setTimeout;
let clickAwayCompatibleShow = () => nextTick2(show);
if (value) {
if (el._x_transition && (el._x_transition.enter || el._x_transition.leave)) {
el._x_transition.enter && (Object.entries(el._x_transition.enter.during).length || Object.entries(el._x_transition.enter.start).length || Object.entries(el._x_transition.enter.end).length) ? el._x_transition.in(show) : clickAwayCompatibleShow();
} else {
el._x_transition ? el._x_transition.in(show) : clickAwayCompatibleShow();
}
return;
}
el._x_hidePromise = el._x_transition ? new Promise((resolve, reject) => {
el._x_transition.out(() => {
}, () => resolve(hide));
el._x_transitioning.beforeCancel(() => reject({isFromCancelledTransition: true}));
}) : Promise.resolve(hide);
queueMicrotask(() => {
let closest = closestHide(el);
if (closest) {
if (!closest._x_hideChildren)
closest._x_hideChildren = [];
closest._x_hideChildren.push(el);
} else {
nextTick2(() => {
let hideAfterChildren = (el2) => {
let carry = Promise.all([
el2._x_hidePromise,
...(el2._x_hideChildren || []).map(hideAfterChildren)
]).then(([i]) => i());
delete el2._x_hidePromise;
delete el2._x_hideChildren;
return carry;
};
hideAfterChildren(el).catch((e) => {
if (!e.isFromCancelledTransition)
throw e;
});
});
}
});
};
function closestHide(el) {
let parent = el.parentNode;
if (!parent)
return;
return parent._x_hidePromise ? parent : closestHide(parent);
}
function transition(el, setFunction, {during, start: start2, end} = {}, before = () => {
}, after = () => {
}) {
if (el._x_transitioning)
el._x_transitioning.cancel();
if (Object.keys(during).length === 0 && Object.keys(start2).length === 0 && Object.keys(end).length === 0) {
before();
after();
return;
}
let undoStart, undoDuring, undoEnd;
performTransition(el, {
start() {
undoStart = setFunction(el, start2);
},
during() {
undoDuring = setFunction(el, during);
},
before,
end() {
undoStart();
undoEnd = setFunction(el, end);
},
after,
cleanup() {
undoDuring();
undoEnd();
}
});
}
function performTransition(el, stages) {
let interrupted, reachedBefore, reachedEnd;
let finish = once(() => {
mutateDom(() => {
interrupted = true;
if (!reachedBefore)
stages.before();
if (!reachedEnd) {
stages.end();
releaseNextTicks();
}
stages.after();
if (el.isConnected)
stages.cleanup();
delete el._x_transitioning;
});
});
el._x_transitioning = {
beforeCancels: [],
beforeCancel(callback) {
this.beforeCancels.push(callback);
},
cancel: once(function() {
while (this.beforeCancels.length) {
this.beforeCancels.shift()();
}
;
finish();
}),
finish
};
mutateDom(() => {
stages.start();
stages.during();
});
holdNextTicks();
requestAnimationFrame(() => {
if (interrupted)
return;
let duration = Number(getComputedStyle(el).transitionDuration.replace(/,.*/, "").replace("s", "")) * 1e3;
let delay = Number(getComputedStyle(el).transitionDelay.replace(/,.*/, "").replace("s", "")) * 1e3;
if (duration === 0)
duration = Number(getComputedStyle(el).animationDuration.replace("s", "")) * 1e3;
mutateDom(() => {
stages.before();
});
reachedBefore = true;
requestAnimationFrame(() => {
if (interrupted)
return;
mutateDom(() => {
stages.end();
});
releaseNextTicks();
setTimeout(el._x_transitioning.finish, duration + delay);
reachedEnd = true;
});
});
}
function modifierValue(modifiers, key, fallback) {
if (modifiers.indexOf(key) === -1)
return fallback;
const rawValue = modifiers[modifiers.indexOf(key) + 1];
if (!rawValue)
return fallback;
if (key === "scale") {
if (isNaN(rawValue))
return fallback;
}
if (key === "duration" || key === "delay") {
let match = rawValue.match(/([0-9]+)ms/);
if (match)
return match[1];
}
if (key === "origin") {
if (["top", "right", "left", "center", "bottom"].includes(modifiers[modifiers.indexOf(key) + 2])) {
return [rawValue, modifiers[modifiers.indexOf(key) + 2]].join(" ");
}
}
return rawValue;
}
// packages/alpinejs/src/clone.js
var isCloning = false;
function skipDuringClone(callback, fallback = () => {
}) {
return (...args) => isCloning ? fallback(...args) : callback(...args);
}
function onlyDuringClone(callback) {
return (...args) => isCloning && callback(...args);
}
function clone(oldEl, newEl) {
if (!newEl._x_dataStack)
newEl._x_dataStack = oldEl._x_dataStack;
isCloning = true;
dontRegisterReactiveSideEffects(() => {
cloneTree(newEl);
});
isCloning = false;
}
function cloneTree(el) {
let hasRunThroughFirstEl = false;
let shallowWalker = (el2, callback) => {
walk(el2, (el3, skip) => {
if (hasRunThroughFirstEl && isRoot(el3))
return skip();
hasRunThroughFirstEl = true;
callback(el3, skip);
});
};
initTree(el, shallowWalker);
}
function dontRegisterReactiveSideEffects(callback) {
let cache = effect;
overrideEffect((callback2, el) => {
let storedEffect = cache(callback2);
release(storedEffect);
return () => {
};
});
callback();
overrideEffect(cache);
}
// packages/alpinejs/src/utils/bind.js
function bind(el, name, value, modifiers = []) {
if (!el._x_bindings)
el._x_bindings = reactive({});
el._x_bindings[name] = value;
name = modifiers.includes("camel") ? camelCase(name) : name;
switch (name) {
case "value":
bindInputValue(el, value);
break;
case "style":
bindStyles(el, value);
break;
case "class":
bindClasses(el, value);
break;
case "selected":
case "checked":
bindAttributeAndProperty(el, name, value);
break;
default:
bindAttribute(el, name, value);
break;
}
}
function bindInputValue(el, value) {
if (el.type === "radio") {
if (el.attributes.value === void 0) {
el.value = value;
}
if (window.fromModel) {
el.checked = checkedAttrLooseCompare(el.value, value);
}
} else if (el.type === "checkbox") {
if (Number.isInteger(value)) {
el.value = value;
} else if (!Number.isInteger(value) && !Array.isArray(value) && typeof value !== "boolean" && ![null, void 0].includes(value)) {
el.value = String(value);
} else {
if (Array.isArray(value)) {
el.checked = value.some((val) => checkedAttrLooseCompare(val, el.value));
} else {
el.checked = !!value;
}
}
} else if (el.tagName === "SELECT") {
updateSelect(el, value);
} else {
if (el.value === value)
return;
el.value = value;
}
}
function bindClasses(el, value) {
if (el._x_undoAddedClasses)
el._x_undoAddedClasses();
el._x_undoAddedClasses = setClasses(el, value);
}
function bindStyles(el, value) {
if (el._x_undoAddedStyles)
el._x_undoAddedStyles();
el._x_undoAddedStyles = setStyles(el, value);
}
function bindAttributeAndProperty(el, name, value) {
bindAttribute(el, name, value);
setPropertyIfChanged(el, name, value);
}
function bindAttribute(el, name, value) {
if ([null, void 0, false].includes(value) && attributeShouldntBePreservedIfFalsy(name)) {
el.removeAttribute(name);
} else {
if (isBooleanAttr(name))
value = name;
setIfChanged(el, name, value);
}
}
function setIfChanged(el, attrName, value) {
if (el.getAttribute(attrName) != value) {
el.setAttribute(attrName, value);
}
}
function setPropertyIfChanged(el, propName, value) {
if (el[propName] !== value) {
el[propName] = value;
}
}
function updateSelect(el, value) {
const arrayWrappedValue = [].concat(value).map((value2) => {
return value2 + "";
});
Array.from(el.options).forEach((option) => {
option.selected = arrayWrappedValue.includes(option.value);
});
}
function camelCase(subject) {
return subject.toLowerCase().replace(/-(\w)/g, (match, char) => char.toUpperCase());
}
function checkedAttrLooseCompare(valueA, valueB) {
return valueA == valueB;
}
function isBooleanAttr(attrName) {
const booleanAttributes = [
"disabled",
"checked",
"required",
"readonly",
"hidden",
"open",
"selected",
"autofocus",
"itemscope",
"multiple",
"novalidate",
"allowfullscreen",
"allowpaymentrequest",
"formnovalidate",
"autoplay",
"controls",
"loop",
"muted",
"playsinline",
"default",
"ismap",
"reversed",
"async",
"defer",
"nomodule"
];
return booleanAttributes.includes(attrName);
}
function attributeShouldntBePreservedIfFalsy(name) {
return !["aria-pressed", "aria-checked", "aria-expanded", "aria-selected"].includes(name);
}
function getBinding(el, name, fallback) {
if (el._x_bindings && el._x_bindings[name] !== void 0)
return el._x_bindings[name];
return getAttributeBinding(el, name, fallback);
}
function extractProp(el, name, fallback, extract = true) {
if (el._x_bindings && el._x_bindings[name] !== void 0)
return el._x_bindings[name];
if (el._x_inlineBindings && el._x_inlineBindings[name] !== void 0) {
let binding = el._x_inlineBindings[name];
binding.extract = extract;
return dontAutoEvaluateFunctions(() => {
return evaluate(el, binding.expression);
});
}
return getAttributeBinding(el, name, fallback);
}
function getAttributeBinding(el, name, fallback) {
let attr = el.getAttribute(name);
if (attr === null)
return typeof fallback === "function" ? fallback() : fallback;
if (attr === "")
return true;
if (isBooleanAttr(name)) {
return !![name, "true"].includes(attr);
}
return attr;
}
// packages/alpinejs/src/utils/debounce.js
function debounce(func, wait) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
func.apply(context, args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
}
// packages/alpinejs/src/utils/throttle.js
function throttle(func, limit) {
let inThrottle;
return function() {
let context = this, args = arguments;
if (!inThrottle) {
func.apply(context, args);
inThrottle = true;
setTimeout(() => inThrottle = false, limit);
}
};
}
// packages/alpinejs/src/plugin.js
function plugin(callback) {
let callbacks = Array.isArray(callback) ? callback : [callback];
callbacks.forEach((i) => i(alpine_default));
}
// packages/alpinejs/src/store.js
var stores = {};
var isReactive = false;
function store(name, value) {
if (!isReactive) {
stores = reactive(stores);
isReactive = true;
}
if (value === void 0) {
return stores[name];
}
stores[name] = value;
if (typeof value === "object" && value !== null && value.hasOwnProperty("init") && typeof value.init === "function") {
stores[name].init();
}
initInterceptors(stores[name]);
}
function getStores() {
return stores;
}
// packages/alpinejs/src/binds.js
var binds = {};
function bind2(name, bindings) {
let getBindings = typeof bindings !== "function" ? () => bindings : bindings;
if (name instanceof Element) {
applyBindingsObject(name, getBindings());
} else {
binds[name] = getBindings;
}
}
function injectBindingProviders(obj) {
Object.entries(binds).forEach(([name, callback]) => {
Object.defineProperty(obj, name, {
get() {
return (...args) => {
return callback(...args);
};
}
});
});
return obj;
}
function applyBindingsObject(el, obj, original) {
let cleanupRunners = [];
while (cleanupRunners.length)
cleanupRunners.pop()();
let attributes = Object.entries(obj).map(([name, value]) => ({name, value}));
let staticAttributes = attributesOnly(attributes);
attributes = attributes.map((attribute) => {
if (staticAttributes.find((attr) => attr.name === attribute.name)) {
return {
name: `x-bind:${attribute.name}`,
value: `"${attribute.value}"`
};
}
return attribute;
});
directives(el, attributes, original).map((handle) => {
cleanupRunners.push(handle.runCleanups);
handle();
});
}
// packages/alpinejs/src/datas.js
var datas = {};
function data(name, callback) {
datas[name] = callback;
}
function injectDataProviders(obj, context) {
Object.entries(datas).forEach(([name, callback]) => {
Object.defineProperty(obj, name, {
get() {
return (...args) => {
return callback.bind(context)(...args);
};
},
enumerable: false
});
});
return obj;
}
// packages/alpinejs/src/alpine.js
var Alpine = {
get reactive() {
return reactive;
},
get release() {
return release;
},
get effect() {
return effect;
},
get raw() {
return raw;
},
version: "3.12.3",
flushAndStopDeferringMutations,
dontAutoEvaluateFunctions,
disableEffectScheduling,
startObservingMutations,
stopObservingMutations,
setReactivityEngine,
closestDataStack,
skipDuringClone,
onlyDuringClone,
addRootSelector,
addInitSelector,
addScopeToNode,
deferMutations,
mapAttributes,
evaluateLater,
interceptInit,
setEvaluator,
mergeProxies,
extractProp,
findClosest,
closestRoot,
destroyTree,
interceptor,
transition,
setStyles,
mutateDom,
directive,
throttle,
debounce,
evaluate,
initTree,
nextTick,
prefixed: prefix,
prefix: setPrefix,
plugin,
magic,
store,
start,
clone,
bound: getBinding,
$data: scope,
walk,
data,
bind: bind2
};
var alpine_default = Alpine;
// node_modules/@vue/shared/dist/shared.esm-bundler.js
function makeMap(str, expectsLowerCase) {
const map = Object.create(null);
const list = str.split(",");
for (let i = 0; i < list.length; i++) {
map[list[i]] = true;
}
return expectsLowerCase ? (val) => !!map[val.toLowerCase()] : (val) => !!map[val];
}
var PatchFlagNames = {
[1]: `TEXT`,
[2]: `CLASS`,
[4]: `STYLE`,
[8]: `PROPS`,
[16]: `FULL_PROPS`,
[32]: `HYDRATE_EVENTS`,
[64]: `STABLE_FRAGMENT`,
[128]: `KEYED_FRAGMENT`,
[256]: `UNKEYED_FRAGMENT`,
[512]: `NEED_PATCH`,
[1024]: `DYNAMIC_SLOTS`,
[2048]: `DEV_ROOT_FRAGMENT`,
[-1]: `HOISTED`,
[-2]: `BAIL`
};
var slotFlagsText = {
[1]: "STABLE",
[2]: "DYNAMIC",
[3]: "FORWARDED"
};
var specialBooleanAttrs = `itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly`;
var isBooleanAttr2 = /* @__PURE__ */ makeMap(specialBooleanAttrs + `,async,autofocus,autoplay,controls,default,defer,disabled,hidden,loop,open,required,reversed,scoped,seamless,checked,muted,multiple,selected`);
var EMPTY_OBJ = true ? Object.freeze({}) : {};
var EMPTY_ARR = true ? Object.freeze([]) : [];
var extend = Object.assign;
var hasOwnProperty = Object.prototype.hasOwnProperty;
var hasOwn = (val, key) => hasOwnProperty.call(val, key);
var isArray = Array.isArray;
var isMap = (val) => toTypeString(val) === "[object Map]";
var isString = (val) => typeof val === "string";
var isSymbol = (val) => typeof val === "symbol";
var isObject = (val) => val !== null && typeof val === "object";
var objectToString = Object.prototype.toString;
var toTypeString = (value) => objectToString.call(value);
var toRawType = (value) => {
return toTypeString(value).slice(8, -1);
};
var isIntegerKey = (key) => isString(key) && key !== "NaN" && key[0] !== "-" && "" + parseInt(key, 10) === key;
var cacheStringFunction = (fn) => {
const cache = Object.create(null);
return (str) => {
const hit = cache[str];
return hit || (cache[str] = fn(str));
};
};
var camelizeRE = /-(\w)/g;
var camelize = cacheStringFunction((str) => {
return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : "");
});
var hyphenateRE = /\B([A-Z])/g;
var hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, "-$1").toLowerCase());
var capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
var toHandlerKey = cacheStringFunction((str) => str ? `on${capitalize(str)}` : ``);
var hasChanged = (value, oldValue) => value !== oldValue && (value === value || oldValue === oldValue);
// node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js
var targetMap = new WeakMap();
var effectStack = [];
var activeEffect;
var ITERATE_KEY = Symbol(true ? "iterate" : "");
var MAP_KEY_ITERATE_KEY = Symbol(true ? "Map key iterate" : "");
function isEffect(fn) {
return fn && fn._isEffect === true;
}
function effect2(fn, options = EMPTY_OBJ) {
if (isEffect(fn)) {
fn = fn.raw;
}
const effect3 = createReactiveEffect(fn, options);
if (!options.lazy) {
effect3();
}
return effect3;
}
function stop(effect3) {
if (effect3.active) {
cleanup(effect3);
if (effect3.options.onStop) {
effect3.options.onStop();
}
effect3.active = false;
}
}
var uid = 0;
function createReactiveEffect(fn, options) {
const effect3 = function reactiveEffect() {
if (!effect3.active) {
return fn();
}
if (!effectStack.includes(effect3)) {
cleanup(effect3);
try {
enableTracking();
effectStack.push(effect3);
activeEffect = effect3;
return fn();
} finally {
effectStack.pop();
resetTracking();
activeEffect = effectStack[effectStack.length - 1];
}
}
};
effect3.id = uid++;
effect3.allowRecurse = !!options.allowRecurse;
effect3._isEffect = true;
effect3.active = true;
effect3.raw = fn;
effect3.deps = [];
effect3.options = options;
return effect3;
}
function cleanup(effect3) {
const {deps} = effect3;
if (deps.length) {
for (let i = 0; i < deps.length; i++) {
deps[i].delete(effect3);
}
deps.length = 0;
}
}
var shouldTrack = true;
var trackStack = [];
function pauseTracking() {
trackSta