eewing
618 lines
16 KiB
JavaScript
618 lines
16 KiB
JavaScript
import { A as ATTACHMENT_KEY, r as run, d as derived, p as props_id, b as attributes, c as bind_props, e as spread_props } from "./index2.js";
|
|
import { c as cn } from "./utils2.js";
|
|
import { clsx } from "clsx";
|
|
import parse from "style-to-object";
|
|
function createAttachmentKey() {
|
|
return Symbol(ATTACHMENT_KEY);
|
|
}
|
|
function isFunction(value) {
|
|
return typeof value === "function";
|
|
}
|
|
function isObject(value) {
|
|
return value !== null && typeof value === "object";
|
|
}
|
|
const CLASS_VALUE_PRIMITIVE_TYPES = ["string", "number", "bigint", "boolean"];
|
|
function isClassValue(value) {
|
|
if (value === null || value === void 0)
|
|
return true;
|
|
if (CLASS_VALUE_PRIMITIVE_TYPES.includes(typeof value))
|
|
return true;
|
|
if (Array.isArray(value))
|
|
return value.every((item) => isClassValue(item));
|
|
if (typeof value === "object") {
|
|
if (Object.getPrototypeOf(value) !== Object.prototype)
|
|
return false;
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
const BoxSymbol = Symbol("box");
|
|
const isWritableSymbol = Symbol("is-writable");
|
|
function boxWith(getter, setter) {
|
|
const derived2 = getter();
|
|
if (setter) {
|
|
return {
|
|
[BoxSymbol]: true,
|
|
[isWritableSymbol]: true,
|
|
get current() {
|
|
return derived2;
|
|
},
|
|
set current(v) {
|
|
setter(v);
|
|
}
|
|
};
|
|
}
|
|
return {
|
|
[BoxSymbol]: true,
|
|
get current() {
|
|
return getter();
|
|
}
|
|
};
|
|
}
|
|
function isBox(value) {
|
|
return isObject(value) && BoxSymbol in value;
|
|
}
|
|
function isWritableBox(value) {
|
|
return isBox(value) && isWritableSymbol in value;
|
|
}
|
|
function boxFrom(value) {
|
|
if (isBox(value)) return value;
|
|
if (isFunction(value)) return boxWith(value);
|
|
return simpleBox(value);
|
|
}
|
|
function boxFlatten(boxes) {
|
|
return Object.entries(boxes).reduce(
|
|
(acc, [key, b]) => {
|
|
if (!isBox(b)) {
|
|
return Object.assign(acc, { [key]: b });
|
|
}
|
|
if (isWritableBox(b)) {
|
|
Object.defineProperty(acc, key, {
|
|
get() {
|
|
return b.current;
|
|
},
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
set(v) {
|
|
b.current = v;
|
|
}
|
|
});
|
|
} else {
|
|
Object.defineProperty(acc, key, {
|
|
get() {
|
|
return b.current;
|
|
}
|
|
});
|
|
}
|
|
return acc;
|
|
},
|
|
{}
|
|
);
|
|
}
|
|
function toReadonlyBox(b) {
|
|
if (!isWritableBox(b)) return b;
|
|
return {
|
|
[BoxSymbol]: true,
|
|
get current() {
|
|
return b.current;
|
|
}
|
|
};
|
|
}
|
|
function simpleBox(initialValue) {
|
|
let current = initialValue;
|
|
return {
|
|
[BoxSymbol]: true,
|
|
[isWritableSymbol]: true,
|
|
get current() {
|
|
return current;
|
|
},
|
|
set current(v) {
|
|
current = v;
|
|
}
|
|
};
|
|
}
|
|
function composeHandlers(...handlers) {
|
|
return function(e) {
|
|
for (const handler of handlers) {
|
|
if (!handler)
|
|
continue;
|
|
if (e.defaultPrevented)
|
|
return;
|
|
if (typeof handler === "function") {
|
|
handler.call(this, e);
|
|
} else {
|
|
handler.current?.call(this, e);
|
|
}
|
|
}
|
|
};
|
|
}
|
|
const NUMBER_CHAR_RE = /\d/;
|
|
const STR_SPLITTERS = ["-", "_", "/", "."];
|
|
function isUppercase(char = "") {
|
|
if (NUMBER_CHAR_RE.test(char))
|
|
return void 0;
|
|
return char !== char.toLowerCase();
|
|
}
|
|
function splitByCase(str) {
|
|
const parts = [];
|
|
let buff = "";
|
|
let previousUpper;
|
|
let previousSplitter;
|
|
for (const char of str) {
|
|
const isSplitter = STR_SPLITTERS.includes(char);
|
|
if (isSplitter === true) {
|
|
parts.push(buff);
|
|
buff = "";
|
|
previousUpper = void 0;
|
|
continue;
|
|
}
|
|
const isUpper = isUppercase(char);
|
|
if (previousSplitter === false) {
|
|
if (previousUpper === false && isUpper === true) {
|
|
parts.push(buff);
|
|
buff = char;
|
|
previousUpper = isUpper;
|
|
continue;
|
|
}
|
|
if (previousUpper === true && isUpper === false && buff.length > 1) {
|
|
const lastChar = buff.at(-1);
|
|
parts.push(buff.slice(0, Math.max(0, buff.length - 1)));
|
|
buff = lastChar + char;
|
|
previousUpper = isUpper;
|
|
continue;
|
|
}
|
|
}
|
|
buff += char;
|
|
previousUpper = isUpper;
|
|
previousSplitter = isSplitter;
|
|
}
|
|
parts.push(buff);
|
|
return parts;
|
|
}
|
|
function pascalCase(str) {
|
|
if (!str)
|
|
return "";
|
|
return splitByCase(str).map((p) => upperFirst(p)).join("");
|
|
}
|
|
function camelCase(str) {
|
|
return lowerFirst(pascalCase(str || ""));
|
|
}
|
|
function upperFirst(str) {
|
|
return str ? str[0].toUpperCase() + str.slice(1) : "";
|
|
}
|
|
function lowerFirst(str) {
|
|
return str ? str[0].toLowerCase() + str.slice(1) : "";
|
|
}
|
|
function cssToStyleObj(css) {
|
|
if (!css)
|
|
return {};
|
|
const styleObj = {};
|
|
function iterator(name, value) {
|
|
if (name.startsWith("-moz-") || name.startsWith("-webkit-") || name.startsWith("-ms-") || name.startsWith("-o-")) {
|
|
styleObj[pascalCase(name)] = value;
|
|
return;
|
|
}
|
|
if (name.startsWith("--")) {
|
|
styleObj[name] = value;
|
|
return;
|
|
}
|
|
styleObj[camelCase(name)] = value;
|
|
}
|
|
parse(css, iterator);
|
|
return styleObj;
|
|
}
|
|
function executeCallbacks(...callbacks) {
|
|
return (...args) => {
|
|
for (const callback of callbacks) {
|
|
if (typeof callback === "function") {
|
|
callback(...args);
|
|
}
|
|
}
|
|
};
|
|
}
|
|
function createParser(matcher, replacer) {
|
|
const regex = RegExp(matcher, "g");
|
|
return (str) => {
|
|
if (typeof str !== "string") {
|
|
throw new TypeError(`expected an argument of type string, but got ${typeof str}`);
|
|
}
|
|
if (!str.match(regex))
|
|
return str;
|
|
return str.replace(regex, replacer);
|
|
};
|
|
}
|
|
const camelToKebab = createParser(/[A-Z]/, (match) => `-${match.toLowerCase()}`);
|
|
function styleToCSS(styleObj) {
|
|
if (!styleObj || typeof styleObj !== "object" || Array.isArray(styleObj)) {
|
|
throw new TypeError(`expected an argument of type object, but got ${typeof styleObj}`);
|
|
}
|
|
return Object.keys(styleObj).map((property) => `${camelToKebab(property)}: ${styleObj[property]};`).join("\n");
|
|
}
|
|
function styleToString(style = {}) {
|
|
return styleToCSS(style).replace("\n", " ");
|
|
}
|
|
const EVENT_LIST = [
|
|
"onabort",
|
|
"onanimationcancel",
|
|
"onanimationend",
|
|
"onanimationiteration",
|
|
"onanimationstart",
|
|
"onauxclick",
|
|
"onbeforeinput",
|
|
"onbeforetoggle",
|
|
"onblur",
|
|
"oncancel",
|
|
"oncanplay",
|
|
"oncanplaythrough",
|
|
"onchange",
|
|
"onclick",
|
|
"onclose",
|
|
"oncompositionend",
|
|
"oncompositionstart",
|
|
"oncompositionupdate",
|
|
"oncontextlost",
|
|
"oncontextmenu",
|
|
"oncontextrestored",
|
|
"oncopy",
|
|
"oncuechange",
|
|
"oncut",
|
|
"ondblclick",
|
|
"ondrag",
|
|
"ondragend",
|
|
"ondragenter",
|
|
"ondragleave",
|
|
"ondragover",
|
|
"ondragstart",
|
|
"ondrop",
|
|
"ondurationchange",
|
|
"onemptied",
|
|
"onended",
|
|
"onerror",
|
|
"onfocus",
|
|
"onfocusin",
|
|
"onfocusout",
|
|
"onformdata",
|
|
"ongotpointercapture",
|
|
"oninput",
|
|
"oninvalid",
|
|
"onkeydown",
|
|
"onkeypress",
|
|
"onkeyup",
|
|
"onload",
|
|
"onloadeddata",
|
|
"onloadedmetadata",
|
|
"onloadstart",
|
|
"onlostpointercapture",
|
|
"onmousedown",
|
|
"onmouseenter",
|
|
"onmouseleave",
|
|
"onmousemove",
|
|
"onmouseout",
|
|
"onmouseover",
|
|
"onmouseup",
|
|
"onpaste",
|
|
"onpause",
|
|
"onplay",
|
|
"onplaying",
|
|
"onpointercancel",
|
|
"onpointerdown",
|
|
"onpointerenter",
|
|
"onpointerleave",
|
|
"onpointermove",
|
|
"onpointerout",
|
|
"onpointerover",
|
|
"onpointerup",
|
|
"onprogress",
|
|
"onratechange",
|
|
"onreset",
|
|
"onresize",
|
|
"onscroll",
|
|
"onscrollend",
|
|
"onsecuritypolicyviolation",
|
|
"onseeked",
|
|
"onseeking",
|
|
"onselect",
|
|
"onselectionchange",
|
|
"onselectstart",
|
|
"onslotchange",
|
|
"onstalled",
|
|
"onsubmit",
|
|
"onsuspend",
|
|
"ontimeupdate",
|
|
"ontoggle",
|
|
"ontouchcancel",
|
|
"ontouchend",
|
|
"ontouchmove",
|
|
"ontouchstart",
|
|
"ontransitioncancel",
|
|
"ontransitionend",
|
|
"ontransitionrun",
|
|
"ontransitionstart",
|
|
"onvolumechange",
|
|
"onwaiting",
|
|
"onwebkitanimationend",
|
|
"onwebkitanimationiteration",
|
|
"onwebkitanimationstart",
|
|
"onwebkittransitionend",
|
|
"onwheel"
|
|
];
|
|
const EVENT_LIST_SET = new Set(EVENT_LIST);
|
|
function isEventHandler(key) {
|
|
return EVENT_LIST_SET.has(key);
|
|
}
|
|
function mergeProps(...args) {
|
|
const result = { ...args[0] };
|
|
for (let i = 1; i < args.length; i++) {
|
|
const props = args[i];
|
|
if (!props)
|
|
continue;
|
|
for (const key of Object.keys(props)) {
|
|
const a = result[key];
|
|
const b = props[key];
|
|
const aIsFunction = typeof a === "function";
|
|
const bIsFunction = typeof b === "function";
|
|
if (aIsFunction && typeof bIsFunction && isEventHandler(key)) {
|
|
const aHandler = a;
|
|
const bHandler = b;
|
|
result[key] = composeHandlers(aHandler, bHandler);
|
|
} else if (aIsFunction && bIsFunction) {
|
|
result[key] = executeCallbacks(a, b);
|
|
} else if (key === "class") {
|
|
const aIsClassValue = isClassValue(a);
|
|
const bIsClassValue = isClassValue(b);
|
|
if (aIsClassValue && bIsClassValue) {
|
|
result[key] = clsx(a, b);
|
|
} else if (aIsClassValue) {
|
|
result[key] = clsx(a);
|
|
} else if (bIsClassValue) {
|
|
result[key] = clsx(b);
|
|
}
|
|
} else if (key === "style") {
|
|
const aIsObject = typeof a === "object";
|
|
const bIsObject = typeof b === "object";
|
|
const aIsString = typeof a === "string";
|
|
const bIsString = typeof b === "string";
|
|
if (aIsObject && bIsObject) {
|
|
result[key] = { ...a, ...b };
|
|
} else if (aIsObject && bIsString) {
|
|
const parsedStyle = cssToStyleObj(b);
|
|
result[key] = { ...a, ...parsedStyle };
|
|
} else if (aIsString && bIsObject) {
|
|
const parsedStyle = cssToStyleObj(a);
|
|
result[key] = { ...parsedStyle, ...b };
|
|
} else if (aIsString && bIsString) {
|
|
const parsedStyleA = cssToStyleObj(a);
|
|
const parsedStyleB = cssToStyleObj(b);
|
|
result[key] = { ...parsedStyleA, ...parsedStyleB };
|
|
} else if (aIsObject) {
|
|
result[key] = a;
|
|
} else if (bIsObject) {
|
|
result[key] = b;
|
|
} else if (aIsString) {
|
|
result[key] = a;
|
|
} else if (bIsString) {
|
|
result[key] = b;
|
|
}
|
|
} else {
|
|
result[key] = b !== void 0 ? b : a;
|
|
}
|
|
}
|
|
for (const key of Object.getOwnPropertySymbols(props)) {
|
|
const a = result[key];
|
|
const b = props[key];
|
|
result[key] = b !== void 0 ? b : a;
|
|
}
|
|
}
|
|
if (typeof result.style === "object") {
|
|
result.style = styleToString(result.style).replaceAll("\n", " ");
|
|
}
|
|
if (result.hidden === false) {
|
|
result.hidden = void 0;
|
|
delete result.hidden;
|
|
}
|
|
if (result.disabled === false) {
|
|
result.disabled = void 0;
|
|
delete result.disabled;
|
|
}
|
|
return result;
|
|
}
|
|
function attachRef(ref, onChange) {
|
|
return {
|
|
[createAttachmentKey()]: (node) => {
|
|
if (isBox(ref)) {
|
|
ref.current = node;
|
|
run(() => onChange?.(node));
|
|
return () => {
|
|
if ("isConnected" in node && node.isConnected)
|
|
return;
|
|
ref.current = null;
|
|
onChange?.(null);
|
|
};
|
|
}
|
|
ref(node);
|
|
run(() => onChange?.(node));
|
|
return () => {
|
|
if ("isConnected" in node && node.isConnected)
|
|
return;
|
|
ref(null);
|
|
onChange?.(null);
|
|
};
|
|
}
|
|
};
|
|
}
|
|
function boolToStr(condition) {
|
|
return condition ? "true" : "false";
|
|
}
|
|
function boolToEmptyStrOrUndef(condition) {
|
|
return condition ? "" : void 0;
|
|
}
|
|
function boolToTrueOrUndef(condition) {
|
|
return condition ? true : void 0;
|
|
}
|
|
function getDataOpenClosed(condition) {
|
|
return condition ? "open" : "closed";
|
|
}
|
|
function getDataChecked(condition) {
|
|
return condition ? "checked" : "unchecked";
|
|
}
|
|
function getAriaChecked(checked, indeterminate) {
|
|
return checked ? "true" : "false";
|
|
}
|
|
class BitsAttrs {
|
|
#variant;
|
|
#prefix;
|
|
attrs;
|
|
constructor(config) {
|
|
this.#variant = config.getVariant ? config.getVariant() : null;
|
|
this.#prefix = this.#variant ? `data-${this.#variant}-` : `data-${config.component}-`;
|
|
this.getAttr = this.getAttr.bind(this);
|
|
this.selector = this.selector.bind(this);
|
|
this.attrs = Object.fromEntries(config.parts.map((part) => [part, this.getAttr(part)]));
|
|
}
|
|
getAttr(part, variantOverride) {
|
|
if (variantOverride)
|
|
return `data-${variantOverride}-${part}`;
|
|
return `${this.#prefix}${part}`;
|
|
}
|
|
selector(part, variantOverride) {
|
|
return `[${this.getAttr(part, variantOverride)}]`;
|
|
}
|
|
}
|
|
function createBitsAttrs(config) {
|
|
const bitsAttrs = new BitsAttrs(config);
|
|
return {
|
|
...bitsAttrs.attrs,
|
|
selector: bitsAttrs.selector,
|
|
getAttr: bitsAttrs.getAttr
|
|
};
|
|
}
|
|
function createId(prefixOrUid, uid) {
|
|
return `bits-${prefixOrUid}`;
|
|
}
|
|
const labelAttrs = createBitsAttrs({ component: "label", parts: ["root"] });
|
|
class LabelRootState {
|
|
static create(opts) {
|
|
return new LabelRootState(opts);
|
|
}
|
|
opts;
|
|
attachment;
|
|
constructor(opts) {
|
|
this.opts = opts;
|
|
this.attachment = attachRef(this.opts.ref);
|
|
this.onmousedown = this.onmousedown.bind(this);
|
|
}
|
|
onmousedown(e) {
|
|
if (e.detail > 1) e.preventDefault();
|
|
}
|
|
#props = derived(() => ({
|
|
id: this.opts.id.current,
|
|
[labelAttrs.root]: "",
|
|
onmousedown: this.onmousedown,
|
|
...this.attachment
|
|
}));
|
|
get props() {
|
|
return this.#props();
|
|
}
|
|
set props($$value) {
|
|
return this.#props($$value);
|
|
}
|
|
}
|
|
function Label$1($$renderer, $$props) {
|
|
$$renderer.component(($$renderer2) => {
|
|
const uid = props_id($$renderer2);
|
|
let {
|
|
children,
|
|
child,
|
|
id = createId(uid),
|
|
ref = null,
|
|
for: forProp,
|
|
$$slots,
|
|
$$events,
|
|
...restProps
|
|
} = $$props;
|
|
const rootState = LabelRootState.create({
|
|
id: boxWith(() => id),
|
|
ref: boxWith(() => ref, (v) => ref = v)
|
|
});
|
|
const mergedProps = mergeProps(restProps, rootState.props, { for: forProp });
|
|
if (child) {
|
|
$$renderer2.push("<!--[-->");
|
|
child($$renderer2, { props: mergedProps });
|
|
$$renderer2.push(`<!---->`);
|
|
} else {
|
|
$$renderer2.push("<!--[!-->");
|
|
$$renderer2.push(`<label${attributes({ ...mergedProps, for: forProp })}>`);
|
|
children?.($$renderer2);
|
|
$$renderer2.push(`<!----></label>`);
|
|
}
|
|
$$renderer2.push(`<!--]-->`);
|
|
bind_props($$props, { ref });
|
|
});
|
|
}
|
|
function Label($$renderer, $$props) {
|
|
$$renderer.component(($$renderer2) => {
|
|
let {
|
|
ref = null,
|
|
class: className,
|
|
$$slots,
|
|
$$events,
|
|
...restProps
|
|
} = $$props;
|
|
let $$settled = true;
|
|
let $$inner_renderer;
|
|
function $$render_inner($$renderer3) {
|
|
$$renderer3.push("<!---->");
|
|
Label$1?.($$renderer3, spread_props([
|
|
{
|
|
"data-slot": "label",
|
|
class: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className)
|
|
},
|
|
restProps,
|
|
{
|
|
get ref() {
|
|
return ref;
|
|
},
|
|
set ref($$value) {
|
|
ref = $$value;
|
|
$$settled = false;
|
|
}
|
|
}
|
|
]));
|
|
$$renderer3.push(`<!---->`);
|
|
}
|
|
do {
|
|
$$settled = true;
|
|
$$inner_renderer = $$renderer2.copy();
|
|
$$render_inner($$inner_renderer);
|
|
} while (!$$settled);
|
|
$$renderer2.subsume($$inner_renderer);
|
|
bind_props($$props, { ref });
|
|
});
|
|
}
|
|
export {
|
|
BoxSymbol as B,
|
|
Label as L,
|
|
boxWith as a,
|
|
boxFrom as b,
|
|
boxFlatten as c,
|
|
isBox as d,
|
|
isWritableBox as e,
|
|
isObject as f,
|
|
executeCallbacks as g,
|
|
attachRef as h,
|
|
isWritableSymbol as i,
|
|
createBitsAttrs as j,
|
|
getDataOpenClosed as k,
|
|
boolToEmptyStrOrUndef as l,
|
|
boolToStr as m,
|
|
simpleBox as n,
|
|
composeHandlers as o,
|
|
createId as p,
|
|
mergeProps as q,
|
|
cssToStyleObj as r,
|
|
styleToString as s,
|
|
toReadonlyBox as t,
|
|
getDataChecked as u,
|
|
getAriaChecked as v,
|
|
boolToTrueOrUndef as w
|
|
};
|