@bysages/svelte 0.3.0 → 0.4.0

package/dist/mentions-DjhgNRmY.mjs

@@ -1,204 +0,0 @@
-import { Field } from "./components/field/index.mjs";
-import { t as useMentions } from "./use-mentions-DeF_38di.mjs";
-import { injectComponentStyle } from "@bysages/core";
-import "svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
-import { Popover } from "@ark-ui/svelte/popover";
-import { Portal } from "@ark-ui/svelte/portal";
-//#region src/components/mentions/MentionsVessel.svelte
-var root$1 = $.from_html(`<div data-scope="mentions" data-part="option"> </div>`);
-var root_1 = $.from_html(`<div></div>`);
-function MentionsVessel$1($$anchor, $$props) {
-	$.push($$props, true);
-	injectComponentStyle("mentions");
-	let open = $.prop($$props, "open", 3, false), matches = $.prop($$props, "matches", 19, () => []), active = $.prop($$props, "active", 3, 0), anchor = $.prop($$props, "anchor", 3, null), size = $.prop($$props, "size", 3, "md");
-	var fragment = $.comment();
-	var node = $.first_child(fragment);
-	$.component(node, () => Popover.Root, ($$anchor, ArkPopover_Root) => {
-		ArkPopover_Root($$anchor, {
-			get open() {
-				return open();
-			},
-			positioning: {
-				placement: "bottom-start",
-				getAnchorRect: () => anchor()?.getBoundingClientRect() ?? null
-			},
-			onOpenChange: (details) => $$props.onOpenChange?.(details.open),
-			children: ($$anchor, $$slotProps) => {
-				Portal($$anchor, {
-					children: ($$anchor, $$slotProps) => {
-						var fragment_2 = $.comment();
-						var node_1 = $.first_child(fragment_2);
-						$.component(node_1, () => Popover.Positioner, ($$anchor, ArkPopover_Positioner) => {
-							ArkPopover_Positioner($$anchor, {
-								children: ($$anchor, $$slotProps) => {
-									var fragment_3 = $.comment();
-									var node_2 = $.first_child(fragment_3);
-									{
-										const asChild = ($$anchor, contentProps = $.noop) => {
-											var div = root_1();
-											$.attribute_effect(div, ($0) => ({
-												...$0,
-												"data-scope": "mentions",
-												"data-part": "popup",
-												"data-size": size()
-											}), [() => contentProps()()]);
-											$.each(div, 23, matches, (entry) => entry.value, ($$anchor, entry, index) => {
-												var div_1 = root$1();
-												var text = $.only_child(div_1, true);
-												$.template_effect(() => {
-													$.set_attribute(div_1, "data-active", $.get(index) === active() ? "" : void 0);
-													$.set_text(text, $.get(entry).label);
-												});
-												$.event("mouseenter", div_1, () => $$props.onActiveChange?.($.get(index)));
-												$.delegated("mousedown", div_1, (event) => event.preventDefault());
-												$.delegated("click", div_1, () => $$props.onInsert?.($.get(entry)));
-												$.append($$anchor, div_1);
-											});
-											$.reset(div);
-											$.append($$anchor, div);
-										};
-										$.component(node_2, () => Popover.Content, ($$anchor, ArkPopover_Content) => {
-											ArkPopover_Content($$anchor, {
-												asChild,
-												$$slots: { asChild: true }
-											});
-										});
-									}
-									$.append($$anchor, fragment_3);
-								},
-								$$slots: { default: true }
-							});
-						});
-						$.append($$anchor, fragment_2);
-					},
-					$$slots: { default: true }
-				});
-			},
-			$$slots: { default: true }
-		});
-	});
-	$.append($$anchor, fragment);
-	$.pop();
-}
-$.delegate(["mousedown", "click"]);
-//#endregion
-//#region src/components/mentions/Mentions.svelte
-var rest_excludes = /* @__PURE__ */ new Set([
-	"$$slots",
-	"$$events",
-	"$$legacy",
-	"items",
-	"value",
-	"trigger",
-	"placeholder",
-	"autoresize",
-	"invalid",
-	"size",
-	"onValueChange"
-]);
-var root = $.from_html(`<div><!> <!></div>`);
-function Mentions$1($$anchor, $$props) {
-	$.push($$props, true);
-	injectComponentStyle("mentions");
-	let items = $.prop($$props, "items", 19, () => []), value = $.prop($$props, "value", 15, ""), trigger = $.prop($$props, "trigger", 3, "@"), autoresize = $.prop($$props, "autoresize", 3, false), invalid = $.prop($$props, "invalid", 3, false), size = $.prop($$props, "size", 3, "md"), rest = $.rest_props($$props, rest_excludes);
-	let textareaEl = $.state(null);
-	const mentions = useMentions(() => ({
-		items: items(),
-		trigger: trigger()
-	}), () => $.get(textareaEl), {
-		getText: () => $.get(textareaEl)?.value ?? value(),
-		setText: (next) => {
-			value(next);
-			$$props.onValueChange?.(next);
-		}
-	});
-	function onInput(event) {
-		$$props.onValueChange?.(event.currentTarget.value);
-		mentions.onInput();
-	}
-	var div = root();
-	$.attribute_effect(div, () => ({
-		...rest,
-		"data-scope": "mentions",
-		"data-part": "root",
-		"data-size": size()
-	}));
-	var node = $.child(div);
-	{
-		let $0 = $.derived(() => invalid() ? "true" : void 0);
-		$.component(node, () => Field.Textarea, ($$anchor, Field_Textarea) => {
-			Field_Textarea($$anchor, {
-				get autoresize() {
-					return autoresize();
-				},
-				rows: 3,
-				get placeholder() {
-					return $$props.placeholder;
-				},
-				get "aria-invalid"() {
-					return $.get($0);
-				},
-				"data-scope": "mentions",
-				"data-part": "textarea",
-				oninput: onInput,
-				get onkeydown() {
-					return mentions.onKeydown;
-				},
-				get ref() {
-					return $.get(textareaEl);
-				},
-				set ref($$value) {
-					$.set(textareaEl, $$value, true);
-				},
-				get value() {
-					return value();
-				},
-				set value($$value) {
-					value($$value);
-				}
-			});
-		});
-	}
-	MentionsVessel$1($.sibling(node, 2), {
-		get open() {
-			return mentions.open;
-		},
-		get matches() {
-			return mentions.matches;
-		},
-		get active() {
-			return mentions.active;
-		},
-		get anchor() {
-			return $.get(textareaEl);
-		},
-		get size() {
-			return size();
-		},
-		get onInsert() {
-			return mentions.insert;
-		},
-		onActiveChange: (index) => mentions.active = index,
-		onOpenChange: (open) => {
-			if (!open) mentions.close();
-		}
-	});
-	$.reset(div);
-	$.append($$anchor, div);
-	$.pop();
-}
-//#endregion
-//#region src/components/mentions/index.ts
-/** @-mentions: a plain textarea that, when the text before the caret
-* ends with the trigger character followed by a token, offers the
-* matching candidates in a small anchored vessel; choosing one replaces
-* the token with `trigger + label` and hands the whole text back
-* through `bind:value`. Arrows move, Enter inserts, Escape dismisses. */
-const Mentions = Mentions$1;
-/** The vessel: the candidates themselves as a floating card. Composers
-* that keep their own field anatomy wire it up with `useMentions`
-* directly. */
-const MentionsVessel = MentionsVessel$1;
-//#endregion
-export { MentionsVessel as n, Mentions as t };