woby
Version:
A high-performance framework with fine-grained observable/signal-based reactivity for building rich applications.
993 lines (992 loc) • 35.4 kB
JavaScript
;
var _a, _b;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const runtime = require("./create_element-BUG6undN.cjs");
const setters = require("./setters-CMvyty0B.cjs");
const render_to_string = require("./render_to_string-CoO3rHSR.cjs");
const root = require("./root-B1uuIGIw.cjs");
const IS_BROWSER = !!((_b = (_a = globalThis.CDATASection) == null ? void 0 : _a.toString) == null ? void 0 : _b.call(_a).match(/^\s*function\s+CDATASection\s*\(\s*\)\s*\{\s*\[native code\]\s*\}\s*$/));
const isServer = () => {
return !IS_BROWSER;
};
const types = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
__proto__: null
}, Symbol.toStringTag, { value: "Module" }));
const Dynamic = ({ component, props, children }) => {
if (setters.isFunction(component) || setters.isFunction(props)) {
return render_to_string.memo(() => {
return render_to_string.resolve(runtime.createElement(setters.get(component, false), setters.get(props), children));
});
} else {
return runtime.createElement(component, props, children);
}
};
const cache = {};
const runWithSuperRoot = setters._with();
let lockId = 1;
const KeepAlive = ({ id, ttl, children }) => {
return render_to_string.memo((stack) => {
return render_to_string.useResolved([id, ttl], (id2, ttl2) => {
var _a2;
const lock = lockId++;
const item = cache[id2] || (cache[id2] = { id: id2, lock });
item.lock = lock;
(_a2 = item.reset) == null ? void 0 : _a2.call(item, stack);
item.suspended || (item.suspended = render_to_string.observable(false));
item.suspended(false);
if (!item.dispose || !item.result) {
runWithSuperRoot(() => {
root.root((stack2, dispose) => {
item.dispose = () => {
delete cache[id2];
dispose(stack2);
};
render_to_string.suspense(item.suspended, () => {
item.result = render_to_string.resolve(children);
}, stack2);
});
}, stack);
}
setters.cleanup(() => {
var _a3;
const hasLock = () => lock === item.lock;
if (!hasLock()) return;
(_a3 = item.suspended) == null ? void 0 : _a3.call(item, true);
if (!ttl2 || ttl2 <= 0 || ttl2 >= Infinity) return;
const dispose = () => {
var _a4;
return hasLock() && ((_a4 = item.dispose) == null ? void 0 : _a4.call(item, stack));
};
const timeoutId = setTimeout(dispose, ttl2);
const reset = () => clearTimeout(timeoutId);
item.reset = reset;
});
return item.result;
});
});
};
const render = (child, parent) => {
if (!parent || !(parent instanceof HTMLElement || parent instanceof ShadowRoot)) throw new Error("Invalid parent node");
parent.textContent = "";
return root.root((stack, dispose) => {
setters.setChild(parent, child, setters.FragmentUtils.make(), stack);
return () => {
dispose(stack);
parent.textContent = "";
};
});
};
const Portal = ({ when = true, mount, wrapper, children }) => {
const portal = setters.get(wrapper) || setters.createHTMLNode("div");
if (!(portal instanceof HTMLElement)) throw new Error("Invalid wrapper node");
const condition = render_to_string.boolean(when);
const stack = new Error();
setters.useRenderEffect(() => {
if (!setters.get(condition)) return;
const parent = setters.get(mount) || document.body;
if (!(parent instanceof Element)) throw new Error("Invalid mount node");
parent.insertBefore(portal, null);
return () => {
parent.removeChild(portal);
};
}, stack);
setters.useRenderEffect(() => {
if (!setters.get(condition)) return;
return render(children, portal);
}, stack);
return setters.assign(() => setters.get(condition) || children, { metadata: { portal } });
};
const cloneElement = (element, props, ...children) => {
if (setters.isPrimitive(element))
return element;
else if (setters.isFunction(element)) {
if (!element[setters.SYMBOL_CLONE])
throw new Error("target is not cloneable, it is not created by jsx.createElement");
const { Component, props: oldProps } = element[setters.SYMBOL_CLONE];
const newProps = { ...oldProps, ...props };
if (children.length > 0)
Object.assign(props, { children });
return runtime.wrapCloneElement(runtime.createElement(Component, newProps), Component, newProps);
} else if (setters.isArray(element))
return element.map((e) => cloneElement(e, props));
else if (element.cloneNode)
return element.cloneNode();
throw new Error("Unknown element");
};
function h$1(component, props, ...children) {
if (children.length || setters.isObject(props) && !setters.isArray(props)) {
if (!props) props = { children };
else props = { ...props, children };
return runtime.createElement(component, props);
} else {
return runtime.createElement(component, null, props);
}
}
const registry = {};
const h = (type, props, ...children) => runtime.createElement(registry[type] || type, props, ...children);
const register = (components) => void setters.assign(registry, components);
const html = setters.assign(render_to_string.htm.bind(h), { register });
const lazy = (fetcher) => {
const fetcherOnce = setters.once(fetcher);
const component = (props) => {
const resource = render_to_string.useResource(fetcherOnce);
return render_to_string.memo(() => {
return render_to_string.useResolved(resource, ({ pending, error, value }) => {
if (pending) return;
if (error) throw error;
const component2 = "default" in value ? value.default : value;
return render_to_string.resolve(runtime.createElement(component2, props));
});
});
};
component.preload = () => {
return new Promise((resolve2, reject) => {
const resource = render_to_string.useResource(fetcherOnce);
render_to_string.useResolved(resource, ({ pending, error }) => {
if (pending) return;
if (error) return reject(error);
return resolve2();
});
});
};
return component;
};
const template = (fn) => {
const safePropertyRe = /^[a-z0-9-_]+$/i;
const checkValidProperty = (property) => {
if (setters.isString(property) && safePropertyRe.test(property)) return true;
throw new Error(`Invalid property, only alphanumeric properties are allowed inside templates, received: "${property}"`);
};
const makeAccessor = (actionsWithNodes) => {
return new Proxy({}, {
get(target, prop) {
checkValidProperty(prop);
const accessor = (node, method, key, targetNode) => {
if (key) checkValidProperty(key);
actionsWithNodes.push([node, method, prop, key, targetNode]);
};
const metadata = { [setters.SYMBOL_TEMPLATE_ACCESSOR]: true };
return setters.assign(accessor, metadata);
}
});
};
const makeActionsWithNodesAndTemplate = () => {
const actionsWithNodes = [];
const accessor = makeAccessor(actionsWithNodes);
const component = fn(accessor);
if (setters.isFunction(component)) {
const root2 = component();
if (root2 instanceof Element) {
return { actionsWithNodes, root: root2 };
}
}
throw new Error("Invalid template, it must return a function that returns an Element");
};
const makeActionsWithPaths = (actionsWithNodes) => {
const actionsWithPaths = [];
for (let i = 0, l = actionsWithNodes.length; i < l; i++) {
const [node, method, prop, key, targetNode] = actionsWithNodes[i];
const nodePath = makeNodePath(node);
const targetNodePath = targetNode ? makeNodePath(targetNode) : void 0;
actionsWithPaths.push([nodePath, method, prop, key, targetNodePath]);
}
return actionsWithPaths;
};
const makeNodePath = /* @__PURE__ */ (() => {
let prevNode = null;
let prevPath;
return (node) => {
if (node === prevNode) return prevPath;
const path = [];
let child = node;
let parent = child.parentNode;
while (parent) {
const index = !child.previousSibling ? 0 : !child.nextSibling ? -0 : setters.indexOf(parent.childNodes, child);
path.push(index);
child = parent;
parent = parent.parentNode;
}
prevNode = node;
prevPath = path;
return path;
};
})();
const makeNodePathProperties = (path) => {
const properties = ["root"];
const parts = path.slice().reverse();
for (let i = 0, l = parts.length; i < l; i++) {
const part = parts[i];
if (Object.is(0, part)) {
properties.push("firstChild");
} else if (Object.is(-0, part)) {
properties.push("lastChild");
} else {
properties.push("firstChild");
for (let nsi = 0; nsi < part; nsi++) {
properties.push("nextSibling");
}
}
}
return properties;
};
const makeReviverPaths = (actionsWithPaths) => {
const paths = [];
for (let i = 0, l = actionsWithPaths.length; i < l; i++) {
const action = actionsWithPaths[i];
const nodePath = action[0];
const targetNodePath = action[4];
paths.push(nodePath);
if (targetNodePath) {
paths.push(targetNodePath);
}
}
return paths;
};
const makeReviverVariablesData = (paths, properties) => {
const data = new Array(paths.length);
for (let i = 0, l = paths.length; i < l; i++) {
data[i] = {
path: paths[i],
properties: properties[i]
};
}
return data;
};
const makeReviverVariables = (actionsWithPaths) => {
const paths = makeReviverPaths(actionsWithPaths);
const properties = paths.map(makeNodePathProperties);
const data = makeReviverVariablesData(paths, properties);
const assignments = [];
const map = /* @__PURE__ */ new Map();
let variableId = 0;
while (true) {
const datum = data.find((datum2) => datum2.properties.length > 1);
if (!datum) break;
const [current, next] = datum.properties;
const variable = `$${variableId++}`;
const assignment = `const ${variable} = ${current}.${next};`;
assignments.push(assignment);
for (let i = 0, l = data.length; i < l; i++) {
const datum2 = data[i];
const [otherCurrent, otherNext] = datum2.properties;
if (otherCurrent !== current || otherNext !== next) continue;
datum2.properties[0] = variable;
datum2.properties.splice(1, 1);
}
}
for (let i = 0, l = data.length; i < l; i++) {
const datum = data[i];
map.set(datum.path, datum.properties[0]);
}
return { assignments, map };
};
const makeReviverActions = (actionsWithPaths, variables) => {
const actions = [];
for (let i = 0, l = actionsWithPaths.length; i < l; i++) {
const [nodePath, method, prop, key, targetNodePath] = actionsWithPaths[i];
if (targetNodePath) {
actions.push(`this.${method} ( props["${prop}"], ${variables.get(targetNodePath)} );`);
} else if (key) {
actions.push(`this.${method} ( ${variables.get(nodePath)}, "${key}", props["${prop}"] );`);
} else {
actions.push(`this.${method} ( ${variables.get(nodePath)}, props["${prop}"] );`);
}
}
return actions;
};
const makeReviver = (actionsWithPaths) => {
const { assignments, map } = makeReviverVariables(actionsWithPaths);
const actions = makeReviverActions(actionsWithPaths, map);
const fn2 = new Function("root", "props", `${assignments.join("")}${actions.join("")}return root;`);
const apis = { setAttribute: setters.setAttribute, setChildReplacement: setters.setChildReplacement, setClasses: setters.setClasses, setEvent: setters.setEvent, setHTML: setters.setHTML, setProperty: setters.setProperty, setRef: setters.setRef, setStyles: setters.setStyles };
const reviver = fn2.bind(apis);
return reviver;
};
const makeComponent = () => {
const { actionsWithNodes, root: root2 } = makeActionsWithNodesAndTemplate();
const actionsWithPaths = makeActionsWithPaths(actionsWithNodes);
const reviver = makeReviver(actionsWithPaths);
return (props) => {
const clone2 = root2.cloneNode(true);
return runtime.wrapElement(reviver.bind(void 0, clone2, props));
};
};
return makeComponent();
};
const clone = (source, deepClone = false) => {
if (setters.isPrimitive(source))
return source;
if (setters.isFunction(source))
return source;
if (setters.isArray(source))
if (deepClone)
return source.map((item) => clone(item, deepClone));
else
return source;
const newObject = {};
Object.keys(source).forEach((key) => {
if (typeof source[key] === "function" && !setters.isObservable(source[key])) {
newObject[key] = source[key];
} else if (setters.isObservable(source[key]) && setters.isObject(setters.get(source[key])) && !setters.isArray(setters.get(source[key]))) {
const innerObject = clone(setters.get(source[key]));
newObject[key] = innerObject;
} else if (setters.isObservable(source[key])) {
newObject[key] = render_to_string.observable(setters.get(source[key]));
} else if (setters.isObject(setters.get(source[key])) && deepClone) {
const innerObject = clone(source[key]);
newObject[key] = innerObject;
} else
newObject[key] = source[key];
});
return newObject;
};
const is = (value) => value === "" || value === "true" || value === true;
const HtmlBoolean = {
equals: (a, b) => is(a) === is(b),
type: Boolean,
toHtml: (value) => is(value) ? "" : void 0,
// Return empty string for true, undefined for false
fromHtml: (value) => is(value)
};
const toNumber = (value) => {
if (value === void 0 || value === "") return NaN;
if (typeof value === "number") return value;
const num = Number(value);
return isNaN(num) ? NaN : num;
};
const HtmlNumber = {
equals: (a, b) => toNumber(a) === toNumber(b),
type: Number,
toHtml: (value) => {
const num = toNumber(value);
return isNaN(num) ? void 0 : String(num);
},
fromHtml: (value) => toNumber(value)
};
const toDate = (value) => {
if (value === void 0 || value === "") return void 0;
if (value instanceof Date) return isNaN(value.getTime()) ? void 0 : value;
if (typeof value === "number") {
const date2 = new Date(value);
return isNaN(date2.getTime()) ? void 0 : date2;
}
if (typeof value === "string") {
const timestamp = Date.parse(value);
if (!isNaN(timestamp)) {
return new Date(timestamp);
}
const numericTimestamp = Number(value);
if (!isNaN(numericTimestamp)) {
const date3 = new Date(numericTimestamp);
if (!isNaN(date3.getTime())) {
return date3;
}
}
const date2 = new Date(value);
return isNaN(date2.getTime()) ? void 0 : date2;
}
const date = new Date(value);
return isNaN(date.getTime()) ? void 0 : date;
};
const HtmlDate = {
equals: (a, b) => {
const dateA = toDate(a);
const dateB = toDate(b);
return dateA === void 0 && dateB === void 0 || dateA !== void 0 && dateB !== void 0 && dateA.getTime() === dateB.getTime();
},
type: Date,
toHtml: (value) => {
const date = toDate(value);
return date ? date.toISOString() : "";
},
fromHtml: (value) => toDate(value) || /* @__PURE__ */ new Date(NaN)
};
const toBigInt = (value) => {
if (value === void 0 || value === "") return void 0;
try {
if (typeof value === "bigint") return value;
if (typeof value === "number") {
if (!Number.isInteger(value)) return void 0;
return BigInt(value);
}
return BigInt(value);
} catch {
return void 0;
}
};
const HtmlBigInt = {
equals: (a, b) => {
const bigA = toBigInt(a);
const bigB = toBigInt(b);
return bigA === void 0 && bigB === void 0 || bigA !== void 0 && bigB !== void 0 && bigA === bigB;
},
type: BigInt,
toHtml: (value) => {
const big = toBigInt(value);
return big ? big.toString() : void 0;
},
fromHtml: (value) => toBigInt(value) || BigInt(0)
};
const toObject = (value) => {
if (value === void 0 || value === "") return void 0;
if (typeof value !== "string") return value;
try {
return HtmlObject.JSON.parse(value);
} catch {
return void 0;
}
};
const HtmlObject = {
/**
* JSON implementation used for parsing and stringifying objects.
* Consumers can replace this with alternative implementations like JSON5.
*/
JSON,
equals: (a, b) => {
const objA = toObject(a);
const objB = toObject(b);
return objA === void 0 && objB === void 0 || objA !== void 0 && objB !== void 0 && HtmlObject.JSON.stringify(objA) === HtmlObject.JSON.stringify(objB);
},
type: Object,
toHtml: (value) => {
const obj = toObject(value);
try {
return obj ? HtmlObject.JSON.stringify(obj) : void 0;
} catch {
return "";
}
},
fromHtml: (value) => toObject(value) || {}
};
const parseCSSLength = (value) => {
if (typeof value === "string" && value === "") {
return void 0;
}
if (typeof value === "object" && value !== null && "value" in value && "unit" in value) {
return {
value: value.value,
unit: value.unit,
valueOf: () => `${value.value}${value.unit}`,
toString: () => `${value.value}${value.unit}`
};
}
if (value === "auto" || value === "inherit" || value === "initial" || value === "unset") {
return value;
}
if (typeof value === "undefined")
return void 0;
const match = value.match(/^(-?\d*\.?\d+)([a-zA-Z%]+)$/);
if (match) {
const [, num, unit] = match;
const numericValue = parseFloat(num);
return {
value: numericValue,
unit,
valueOf: () => `${numericValue}${unit}`,
toString: () => `${numericValue}${unit}`
};
}
if (typeof value === "string" && /^-?\d*\.?\d+$/.test(value)) {
const numericValue = parseFloat(value);
return {
value: numericValue,
unit: "px",
valueOf: () => `${numericValue}px`,
toString: () => `${numericValue}px`
};
}
return value;
};
const stringifyCSSLength = (value) => {
if (typeof value === "string") return value;
if (typeof value === "number") return `${value}px`;
return `${value.value}${value.unit}`;
};
const HtmlLength = {
equals: (a, b) => {
const parsedA = parseCSSLength(a);
const parsedB = parseCSSLength(b);
if (typeof parsedA === "string" && typeof parsedB === "string") {
return parsedA === parsedB;
}
if (typeof parsedA === "object" && typeof parsedB === "object") {
return parsedA.value === parsedB.value && parsedA.unit === parsedB.unit;
}
return false;
},
type: Object,
toHtml: (value) => {
const parsed = parseCSSLength(value);
if (parsed === void 0) return void 0;
if (typeof parsed === "string" || typeof parsed === "number") return parsed;
return stringifyCSSLength(parsed);
},
fromHtml: (value) => {
if (typeof value !== "string") return value;
return parseCSSLength(value);
}
};
const parseCSSBox = (value) => {
if (value === "") {
return void 0;
}
if (typeof value === "object" && value !== null && "top" in value && "right" in value && "bottom" in value && "left" in value) {
return {
top: value.top,
right: value.right,
bottom: value.bottom,
left: value.left,
valueOf: () => `${value.top} ${value.right} ${value.bottom} ${value.left}`,
toString: () => `${value.top} ${value.right} ${value.bottom} ${value.left}`
};
}
if (Array.isArray(value)) {
switch (value.length) {
case 1:
return {
top: value[0],
right: value[0],
bottom: value[0],
left: value[0],
valueOf: () => `${value[0]}`,
toString: () => `${value[0]}`
};
case 2:
return {
top: value[0],
right: value[1],
bottom: value[0],
left: value[1],
valueOf: () => `${value[0]} ${value[1]}`,
toString: () => `${value[0]} ${value[1]}`
};
case 3:
return {
top: value[0],
right: value[1],
bottom: value[2],
left: value[1],
valueOf: () => `${value[0]} ${value[1]} ${value[2]}`,
toString: () => `${value[0]} ${value[1]} ${value[2]}`
};
case 4:
return {
top: value[0],
right: value[1],
bottom: value[2],
left: value[3],
valueOf: () => `${value[0]} ${value[1]} ${value[2]} ${value[3]}`,
toString: () => `${value[0]} ${value[1]} ${value[2]} ${value[3]}`
};
}
}
if (typeof value === "string" || typeof value === "number") {
return {
top: value,
right: value,
bottom: value,
left: value,
valueOf: () => `${value}`,
toString: () => `${value}`
};
}
return {
top: "0px",
right: "0px",
bottom: "0px",
left: "0px",
valueOf: () => "0px",
toString: () => "0px"
};
};
const HtmlBox = {
// Compare two CSS box values for equality
// Handles undefined, string, and object values
equals: (a, b) => {
const boxA = parseCSSBox(a);
const boxB = parseCSSBox(b);
if (boxA === void 0 || boxB === void 0) {
return boxA === boxB;
}
return boxA.top === boxB.top && boxA.right === boxB.right && boxA.bottom === boxB.bottom && boxA.left === boxB.left;
},
type: Object,
toHtml: (value) => {
const box = parseCSSBox(value);
if (box === void 0) return void 0;
return box.toString();
},
fromHtml: (value) => {
if (typeof value !== "string") return value;
const parts = value.split(" ").filter((part) => part.length > 0);
switch (parts.length) {
case 1:
return { top: parts[0], right: parts[0], bottom: parts[0], left: parts[0], valueOf: () => value, toString: () => value };
case 2:
return { top: parts[0], right: parts[1], bottom: parts[0], left: parts[1], valueOf: () => value, toString: () => value };
case 3:
return { top: parts[0], right: parts[1], bottom: parts[2], left: parts[1], valueOf: () => value, toString: () => value };
case 4:
return { top: parts[0], right: parts[1], bottom: parts[2], left: parts[3], valueOf: () => value, toString: () => value };
default:
return { top: "0px", right: "0px", bottom: "0px", left: "0px", valueOf: () => "0px", toString: () => "0px" };
}
}
};
const parseCSSColor = (value) => {
if (value === "") {
return void 0;
}
if (typeof value === "object" && value !== null && "r" in value && "g" in value && "b" in value) {
return {
r: value.r,
g: value.g,
b: value.b,
valueOf: () => `#${Math.min(255, Math.max(0, value.r)).toString(16).padStart(2, "0")}${Math.min(255, Math.max(0, value.g)).toString(16).padStart(2, "0")}${Math.min(255, Math.max(0, value.b)).toString(16).padStart(2, "0")}`,
toString: () => `#${Math.min(255, Math.max(0, value.r)).toString(16).padStart(2, "0")}${Math.min(255, Math.max(0, value.g)).toString(16).padStart(2, "0")}${Math.min(255, Math.max(0, value.b)).toString(16).padStart(2, "0")}`
};
}
if (typeof value === "string") {
if (value.startsWith("#")) {
const hex = value.slice(1);
if (hex.length === 3) {
const r = parseInt(hex[0] + hex[0], 16);
const g = parseInt(hex[1] + hex[1], 16);
const b = parseInt(hex[2] + hex[2], 16);
return {
r,
g,
b,
valueOf: () => value,
toString: () => value
};
} else if (hex.length === 6) {
const r = parseInt(hex.slice(0, 2), 16);
const g = parseInt(hex.slice(2, 4), 16);
const b = parseInt(hex.slice(4, 6), 16);
return {
r,
g,
b,
valueOf: () => value,
toString: () => value
};
}
}
return value;
}
if (typeof value === "number") {
const r = value >> 16 & 255;
const g = value >> 8 & 255;
const b = value & 255;
const hex = `#${r.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${b.toString(16).padStart(2, "0")}`;
return {
r,
g,
b,
valueOf: () => hex,
toString: () => hex
};
}
return String(value);
};
const stringifyCSSColor = (value) => {
if (typeof value === "string") return value;
return `#${Math.min(255, Math.max(0, value.r)).toString(16).padStart(2, "0")}${Math.min(255, Math.max(0, value.g)).toString(16).padStart(2, "0")}${Math.min(255, Math.max(0, value.b)).toString(16).padStart(2, "0")}`;
};
const HtmlColor = {
equals: (a, b) => {
const parsedA = parseCSSColor(a);
const parsedB = parseCSSColor(b);
if (typeof parsedA === "string" && typeof parsedB === "string") {
return parsedA === parsedB;
}
if (typeof parsedA === "object" && typeof parsedB === "object" && "r" in parsedA && "r" in parsedB) {
return parsedA.r === parsedB.r && parsedA.g === parsedB.g && parsedA.b === parsedB.b;
}
return false;
},
type: String,
toHtml: (value) => {
const parsed = parseCSSColor(value);
if (parsed === void 0) return void 0;
return stringifyCSSColor(parsed);
},
fromHtml: (value) => {
return value;
}
};
const toStyleObject = (value) => {
if (value === void 0 || value === "") return void 0;
if (typeof value === "object" && value !== null) {
return value;
}
if (typeof value === "string") {
if (value.trim() === "") return void 0;
const style = {};
const rules = value.split(";");
for (const rule of rules) {
const trimmedRule = rule.trim();
if (trimmedRule) {
const colonIndex = trimmedRule.indexOf(":");
if (colonIndex > 0) {
const property = trimmedRule.substring(0, colonIndex).trim();
const value2 = trimmedRule.substring(colonIndex + 1).trim();
if (property && value2) {
const camelCaseProperty = property.replace(/-([a-z])/g, (g) => g[1].toUpperCase());
style[camelCaseProperty] = value2;
}
}
}
}
return Object.keys(style).length > 0 ? style : void 0;
}
return void 0;
};
const stringifyStyleObject = (value) => {
if (value === void 0 || value === null) return "";
const cssRules = [];
for (const [property, val] of Object.entries(value)) {
if (property && val !== void 0 && val !== null) {
const kebabCaseProperty = property.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
cssRules.push(`${kebabCaseProperty}: ${val}`);
}
}
return cssRules.join("; ");
};
const HtmlStyle = {
// Compare two CSS style values for equality
// Handles undefined, string, and object values
equals: (a, b) => {
const styleA = toStyleObject(a);
const styleB = toStyleObject(b);
if (styleA === void 0 && styleB === void 0) return true;
if (styleA === void 0 || styleB === void 0) return false;
return stringifyStyleObject(styleA) === stringifyStyleObject(styleB);
},
type: Object,
toHtml: (value) => {
const style = toStyleObject(value);
return stringifyStyleObject(style);
},
fromHtml: (value) => {
return toStyleObject(value) || {};
}
};
const toString = (value) => {
if (value === null || value === void 0) return "";
return String(value);
};
const HtmlString = {
equals: (a, b) => toString(a) === toString(b),
type: String,
toHtml: (value) => toString(value),
fromHtml: (value) => toString(value)
};
const toFunctionString = (value) => {
if (value === null || value === void 0) return void 0;
return void 0;
};
const HtmlFunction = {
equals: (a, b) => {
return a === b;
},
type: Function,
toHtml: (value) => {
const result = toFunctionString(value);
return result;
},
fromHtml: (value) => {
return void 0;
}
};
const toClassString = (value) => {
if (value === null || value === void 0) return "";
if (typeof value === "string") return value;
if (typeof value === "number") return String(value);
if (typeof value === "boolean") return value ? "" : "";
if (typeof value === "function") {
try {
return toClassString(value());
} catch {
return "";
}
}
if (Array.isArray(value)) {
return value.map(toClassString).filter(Boolean).join(" ");
}
if (typeof value === "object") {
return Object.entries(value).filter(([key, val]) => {
try {
const resolvedVal = typeof val === "function" ? val() : val;
return resolvedVal === true;
} catch {
return false;
}
}).map(([key]) => key).join(" ");
}
return "";
};
const HtmlClass = {
equals: (a, b) => toClassString(a) === toClassString(b),
type: String,
toHtml: (value) => toClassString(value),
fromHtml: (value) => value
};
const HtmlHidden = () => ({
equals: (a, b) => {
return a === b;
},
type: Function,
toHtml: (value) => void 0,
fromHtml: (value) => void 0
});
const HtmlChild = HtmlHidden();
const ObservableSymbol = setters.SYMBOL_OBSERVABLE;
exports.Fragment = runtime.Fragment;
exports.SYMBOL_STACK = runtime.SYMBOL_STACK;
exports.createElement = runtime.createElement;
exports.getMeta = runtime.getMeta;
exports.isJsx = runtime.isJsx;
exports.jsx = runtime.jsx;
exports.jsxDEV = runtime.jsxDEV;
exports.jsxs = runtime.jsxs;
exports.unwrapJsx = runtime.unwrapJsx;
exports.wrapCloneElement = runtime.wrapCloneElement;
exports.$$ = setters.get;
exports.CONTEXTS_DATA = setters.CONTEXTS_DATA;
exports.DEBUGGER = setters.DEBUGGER;
exports.DIRECTIVES = setters.DIRECTIVES;
exports.FragmentUtils = setters.FragmentUtils;
exports.SYMBOLS_DIRECTIVES = setters.SYMBOLS_DIRECTIVES;
exports.SYMBOL_CLONE = setters.SYMBOL_CLONE;
exports.SYMBOL_DEFAULT = setters.SYMBOL_DEFAULT;
exports.SYMBOL_JSX = setters.SYMBOL_JSX;
exports.SYMBOL_OBSERVABLE = setters.SYMBOL_OBSERVABLE;
exports.SYMBOL_OBSERVABLE_FROZEN = setters.SYMBOL_OBSERVABLE_FROZEN;
exports.SYMBOL_OBSERVABLE_READABLE = setters.SYMBOL_OBSERVABLE_READABLE;
exports.SYMBOL_OBSERVABLE_WRITABLE = setters.SYMBOL_OBSERVABLE_WRITABLE;
exports.SYMBOL_SUSPENSE = setters.SYMBOL_SUSPENSE$1;
exports.SYMBOL_SUSPENSE_COLLECTOR = setters.SYMBOL_SUSPENSE_COLLECTOR;
exports.SYMBOL_TEMPLATE_ACCESSOR = setters.SYMBOL_TEMPLATE_ACCESSOR;
exports.SYMBOL_UNCACHED = setters.SYMBOL_UNCACHED;
exports.SYMBOL_UNTRACKED = setters.SYMBOL_UNTRACKED;
exports.SYMBOL_UNTRACKED_UNWRAPPED = setters.SYMBOL_UNTRACKED_UNWRAPPED;
exports.Stack = setters.Stack;
exports.callStack = setters.callStack;
exports.castArray = setters.castArray;
exports.castError = setters.castError;
exports.context = setters.context;
exports.fixBigInt = setters.fixBigInt;
exports.flatten = setters.flatten;
exports.indexOf = setters.indexOf;
exports.isArray = setters.isArray;
exports.isBatching = setters.isBatching;
exports.isBoolean = setters.isBoolean;
exports.isClass = setters.isClass;
exports.isComponent = setters.isComponent;
exports.isError = setters.isError;
exports.isFalsy = setters.isFalsy;
exports.isFunction = setters.isFunction;
exports.isFunctionReactive = setters.isFunctionReactive;
exports.isNil = setters.isNil;
exports.isNode = setters.isNode;
exports.isObject = setters.isObject;
exports.isObservable = setters.isObservable;
exports.isPrimitive = setters.isPrimitive;
exports.isPromise = setters.isPromise;
exports.isSSR = setters.isSSR;
exports.isSVG = setters.isSVG;
exports.isSVGElement = setters.isSVGElement;
exports.isStore = setters.isStore;
exports.isString = setters.isString;
exports.isTemplateAccessor = setters.isTemplateAccessor;
exports.isTruthy = setters.isTruthy;
exports.isVoidChild = setters.isVoidChild;
exports.noop = setters.noop;
exports.once = setters.once;
exports.resolveArraysAndStatics = setters.resolveArraysAndStatics;
exports.setChild = setters.setChild;
exports.setProp = setters.setProp;
exports.setRef = setters.setRef;
exports.store = setters.store;
exports.toArray = setters.toArray;
exports.untrack = setters.untrack;
exports.useCleanup = setters.cleanup;
exports.useEffect = setters.effect;
exports.useMicrotask = setters.useMicrotask;
exports.$ = render_to_string.observable;
exports.ErrorBoundary = render_to_string.ErrorBoundary;
exports.For = render_to_string.For;
exports.If = render_to_string.If;
exports.Suspense = render_to_string.Suspense;
exports.Switch = render_to_string.Switch;
exports.Ternary = render_to_string.Ternary;
exports.assign = render_to_string.assign;
exports.batch = render_to_string.batch;
exports.createContext = render_to_string.createContext;
exports.createDirective = render_to_string.createDirective;
exports.customElement = render_to_string.customElement;
exports.defaults = render_to_string.defaults;
exports.hmr = render_to_string.hmr;
exports.isObservableWritable = render_to_string.isObservableWritable;
exports.make = render_to_string.make;
exports.mark = render_to_string.mark;
exports.renderToString = render_to_string.renderToString;
exports.resolve = render_to_string.resolve;
exports.tick = render_to_string.tick;
exports.useAbortController = render_to_string.useAbortController;
exports.useAbortSignal = render_to_string.useAbortSignal;
exports.useAnimationFrame = render_to_string.useAnimationFrame;
exports.useAnimationLoop = render_to_string.useAnimationLoop;
exports.useAttached = render_to_string.useAttached;
exports.useBoolean = render_to_string.boolean;
exports.useContext = render_to_string.useContext;
exports.useDisposed = render_to_string.disposed;
exports.useEventListener = render_to_string.useEventListener;
exports.useFetch = render_to_string.useFetch;
exports.useIdleCallback = render_to_string.useIdleCallback;
exports.useIdleLoop = render_to_string.useIdleLoop;
exports.useInterval = render_to_string.useInterval;
exports.useLightDom = render_to_string.useLightDom;
exports.useMemo = render_to_string.memo;
exports.useMounted = render_to_string.useMounted;
exports.useMountedContext = render_to_string.useMountedContext;
exports.usePromise = render_to_string.usePromise;
exports.useReadonly = render_to_string.readonly;
exports.useResolved = render_to_string.useResolved;
exports.useResource = render_to_string.useResource;
exports.useSelector = render_to_string.selector;
exports.useSuspended = render_to_string.suspended;
exports.useSuspense = render_to_string.suspense;
exports.useTimeout = render_to_string.useTimeout;
exports.useUntracked = render_to_string.untracked;
exports.useRoot = root.root;
exports.Dynamic = Dynamic;
exports.HtmlBigInt = HtmlBigInt;
exports.HtmlBoolean = HtmlBoolean;
exports.HtmlBox = HtmlBox;
exports.HtmlChild = HtmlChild;
exports.HtmlClass = HtmlClass;
exports.HtmlColor = HtmlColor;
exports.HtmlDate = HtmlDate;
exports.HtmlFunction = HtmlFunction;
exports.HtmlHidden = HtmlHidden;
exports.HtmlLength = HtmlLength;
exports.HtmlNumber = HtmlNumber;
exports.HtmlObject = HtmlObject;
exports.HtmlString = HtmlString;
exports.HtmlStyle = HtmlStyle;
exports.JSX = types;
exports.KeepAlive = KeepAlive;
exports.ObservableSymbol = ObservableSymbol;
exports.Portal = Portal;
exports.clone = clone;
exports.cloneElement = cloneElement;
exports.h = h$1;
exports.html = html;
exports.isServer = isServer;
exports.lazy = lazy;
exports.render = render;
exports.template = template;
//# sourceMappingURL=index.cjs.js.map