@threadlabs/looma 0.4.0 → 0.5.0

package/vue/chunks/UiAffordanceScope.js

@@ -0,0 +1,112 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { computed, createElementBlock, defineComponent, mergeProps, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, shallowRef, watchEffect } from "vue";
+import * as controllerModule from "@threadlabs/looma/components/ui-affordance-scope/ui-affordance-scope.js";
+//#region .build/vue/UiAffordanceScope.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["data-ui-affordance-scope-state"];
+//#endregion
+//#region .build/vue/UiAffordanceScope.vue
+var UiAffordanceScope_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiAffordanceScope",
+	props: { nearRadius: { default: 16 } },
+	setup(__props) {
+		const hn = { t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false) };
+		const props = __props;
+		const root = ref(null);
+		const refs = {};
+		const state_engaged = ref(false);
+		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
+		const dispatch = (name, detail) => {
+			return root.value?.dispatchEvent(new CustomEvent(name, {
+				bubbles: true,
+				composed: true,
+				detail
+			})) ?? true;
+		};
+		/** The resolved values the styles' :host-state() rules test. */
+		const hostState = computed(() => ["engaged"].flatMap((name) => {
+			const value = read(name);
+			const tokens = hn.t(value) ? [name] : [];
+			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
+			return tokens;
+		}).join(" "));
+		function read(name) {
+			if (name === "engaged") return state_engaged.value;
+			return props[name];
+		}
+		function write(name, value) {
+			if (name === "engaged") {
+				state_engaged.value = value;
+				return true;
+			}
+			throw new TypeError(`Only declared state is writable; \`${name}\` is not.`);
+		}
+		const stops = [];
+		const host = {
+			get element() {
+				return root.value;
+			},
+			state: new Proxy({}, {
+				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
+				set: (_target, name, value) => typeof name === "string" && write(name, value)
+			}),
+			refs,
+			elements: new Proxy({}, { get: (_target, name) => {
+				if (typeof name !== "string" || root.value === null) return void 0;
+				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
+			} }),
+			signal(initialValue) {
+				const value = shallowRef(initialValue);
+				return {
+					get: () => value.value,
+					set: (next) => {
+						if (!Object.is(value.value, next)) value.value = next;
+					},
+					update: (next) => {
+						const updated = next(value.value);
+						if (!Object.is(value.value, updated)) value.value = updated;
+					}
+				};
+			},
+			computed(compute) {
+				const value = computed(compute);
+				return { get: () => value.value };
+			},
+			effect(run) {
+				const stop = watchEffect((onCleanup) => {
+					const cleanup = run();
+					if (typeof cleanup === "function") onCleanup(cleanup);
+				}, { flush: "post" });
+				stops.push(stop);
+				return stop;
+			},
+			on(event, listener) {
+				const element = root.value;
+				element?.addEventListener(event, listener);
+				const off = () => element?.removeEventListener(event, listener);
+				stops.push(off);
+				return off;
+			},
+			dispatch
+		};
+		let cleanup;
+		onMounted(() => {
+			Promise.resolve(controllerModule.default(host)).then((result) => {
+				cleanup = result;
+			});
+		});
+		onBeforeUnmount(() => {
+			for (const stop of stops.splice(0)) stop();
+			if (typeof cleanup === "function") cleanup();
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", mergeProps({ "data-component": "ui-affordance-scope" }, _ctx.$attrs, {
+				"data-ui-affordance-scope-state": hostState.value || void 0,
+				ref_key: "root",
+				ref: root
+			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-650ceaf5"]]);
+//#endregion
+export { UiAffordanceScope_default as t };

package/vue/chunks/UiAvatar.js

@@ -0,0 +1,144 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { computed, createElementBlock, createElementVNode, defineComponent, mergeProps, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, shallowRef, toDisplayString, watchEffect } from "vue";
+import * as controllerModule from "@threadlabs/looma/components/ui-avatar/ui-avatar.js";
+//#region .build/vue/UiAvatar.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["src", "hidden"];
+var _hoisted_2 = ["aria-hidden", "hidden"];
+//#endregion
+//#region .build/vue/UiAvatar.vue
+var UiAvatar_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiAvatar",
+	props: {
+		alt: { default: "" },
+		fallback: { default: "" },
+		name: { default: "" },
+		src: {}
+	},
+	setup(__props) {
+		const hn = {
+			t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false),
+			text: (v) => v === void 0 || v === null ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? "" : String(v),
+			attr: (v) => v === void 0 || v === null || v === false ? void 0 : v === true ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? void 0 : String(v),
+			enumerated: (v) => typeof v === "boolean" ? String(v) : hn.attr(v)
+		};
+		const props = __props;
+		const root = ref(null);
+		const refs = {};
+		const state_hasImage = ref(false);
+		const state_hasAuthoredImage = ref(false);
+		const state_initials = ref("?");
+		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
+		const dispatch = (name, detail) => {
+			return root.value?.dispatchEvent(new CustomEvent(name, {
+				bubbles: true,
+				composed: true,
+				detail
+			})) ?? true;
+		};
+		function read(name) {
+			if (name === "hasImage") return state_hasImage.value;
+			if (name === "hasAuthoredImage") return state_hasAuthoredImage.value;
+			if (name === "initials") return state_initials.value;
+			return props[name];
+		}
+		function write(name, value) {
+			if (name === "hasImage") {
+				state_hasImage.value = value;
+				return true;
+			}
+			if (name === "hasAuthoredImage") {
+				state_hasAuthoredImage.value = value;
+				return true;
+			}
+			if (name === "initials") {
+				state_initials.value = value;
+				return true;
+			}
+			throw new TypeError(`Only declared state is writable; \`${name}\` is not.`);
+		}
+		const stops = [];
+		const host = {
+			get element() {
+				return root.value;
+			},
+			state: new Proxy({}, {
+				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
+				set: (_target, name, value) => typeof name === "string" && write(name, value)
+			}),
+			refs,
+			elements: new Proxy({}, { get: (_target, name) => {
+				if (typeof name !== "string" || root.value === null) return void 0;
+				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
+			} }),
+			signal(initialValue) {
+				const value = shallowRef(initialValue);
+				return {
+					get: () => value.value,
+					set: (next) => {
+						if (!Object.is(value.value, next)) value.value = next;
+					},
+					update: (next) => {
+						const updated = next(value.value);
+						if (!Object.is(value.value, updated)) value.value = updated;
+					}
+				};
+			},
+			computed(compute) {
+				const value = computed(compute);
+				return { get: () => value.value };
+			},
+			effect(run) {
+				const stop = watchEffect((onCleanup) => {
+					const cleanup = run();
+					if (typeof cleanup === "function") onCleanup(cleanup);
+				}, { flush: "post" });
+				stops.push(stop);
+				return stop;
+			},
+			on(event, listener) {
+				const element = root.value;
+				element?.addEventListener(event, listener);
+				const off = () => element?.removeEventListener(event, listener);
+				stops.push(off);
+				return off;
+			},
+			dispatch
+		};
+		let cleanup;
+		onMounted(() => {
+			Promise.resolve(controllerModule.default(host)).then((result) => {
+				cleanup = result;
+			});
+		});
+		onBeforeUnmount(() => {
+			for (const stop of stops.splice(0)) stop();
+			if (typeof cleanup === "function") cleanup();
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", mergeProps({ "data-component": "ui-avatar" }, _ctx.$attrs, {
+				ref_key: "root",
+				ref: root
+			}), [
+				renderSlot(_ctx.$slots, "default"),
+				createElementVNode("img", {
+					class: "image",
+					alt: "",
+					"aria-hidden": "true",
+					src: hn.attr(props.src),
+					hidden: hn.attr(hn.t(state_hasAuthoredImage.value) || hn.t(!hn.t(state_hasImage.value))),
+					ref: (element) => {
+						refs["image"] = element;
+					}
+				}, null, 8, _hoisted_1),
+				createElementVNode("span", {
+					class: "fallback",
+					"aria-hidden": hn.enumerated(state_hasImage.value),
+					hidden: hn.attr(state_hasImage.value)
+				}, toDisplayString(hn.text(state_initials.value)), 9, _hoisted_2)
+			], 16);
+		};
+	}
+}), [["__scopeId", "data-v-110795c3"]]);
+//#endregion
+export { UiAvatar_default as t };

package/vue/chunks/UiAvatarGroup.js

@@ -0,0 +1,142 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { computed, createElementBlock, createElementVNode, defineComponent, mergeProps, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, shallowRef, toDisplayString, watchEffect } from "vue";
+import * as controllerModule from "@threadlabs/looma/components/ui-avatar-group/ui-avatar-group.js";
+//#region .build/vue/UiAvatarGroup.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label"];
+var _hoisted_2 = ["hidden", "aria-label"];
+//#endregion
+//#region .build/vue/UiAvatarGroup.vue
+var UiAvatarGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiAvatarGroup",
+	props: {
+		label: { default: "People" },
+		max: { default: 5 }
+	},
+	setup(__props) {
+		const hn = {
+			t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false),
+			n: (v) => typeof v === "number" && v === v ? v : void 0,
+			text: (v) => v === void 0 || v === null ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? "" : String(v),
+			attr: (v) => v === void 0 || v === null || v === false ? void 0 : v === true ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? void 0 : String(v),
+			enumerated: (v) => typeof v === "boolean" ? String(v) : hn.attr(v),
+			call: (fn, ...args) => {
+				if (fn === "format") {
+					let index = 1;
+					return typeof args[0] === "string" ? args[0].replace(/%s/g, () => index < args.length ? hn.text(args[index++]) : "%s") : void 0;
+				}
+				const n = args.map(hn.n);
+				if (n.some((value) => value === void 0)) return void 0;
+				const v = n;
+				switch (fn) {
+					case "abs": return v.length === 1 ? Math.abs(v[0]) : void 0;
+					case "round": return v.length === 1 ? Math.round(v[0]) : void 0;
+					case "min": return v.length > 0 ? Math.min(...v) : void 0;
+					case "max": return v.length > 0 ? Math.max(...v) : void 0;
+					case "clamp": return v.length === 3 ? Math.min(Math.max(v[0], v[1]), v[2]) : void 0;
+				}
+			}
+		};
+		const props = __props;
+		const root = ref(null);
+		const refs = {};
+		const state_overflowCount = ref(0);
+		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
+		const dispatch = (name, detail) => {
+			return root.value?.dispatchEvent(new CustomEvent(name, {
+				bubbles: true,
+				composed: true,
+				detail
+			})) ?? true;
+		};
+		function read(name) {
+			if (name === "overflowCount") return state_overflowCount.value;
+			return props[name];
+		}
+		function write(name, value) {
+			if (name === "overflowCount") {
+				state_overflowCount.value = value;
+				return true;
+			}
+			throw new TypeError(`Only declared state is writable; \`${name}\` is not.`);
+		}
+		const stops = [];
+		const host = {
+			get element() {
+				return root.value;
+			},
+			state: new Proxy({}, {
+				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
+				set: (_target, name, value) => typeof name === "string" && write(name, value)
+			}),
+			refs,
+			elements: new Proxy({}, { get: (_target, name) => {
+				if (typeof name !== "string" || root.value === null) return void 0;
+				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
+			} }),
+			signal(initialValue) {
+				const value = shallowRef(initialValue);
+				return {
+					get: () => value.value,
+					set: (next) => {
+						if (!Object.is(value.value, next)) value.value = next;
+					},
+					update: (next) => {
+						const updated = next(value.value);
+						if (!Object.is(value.value, updated)) value.value = updated;
+					}
+				};
+			},
+			computed(compute) {
+				const value = computed(compute);
+				return { get: () => value.value };
+			},
+			effect(run) {
+				const stop = watchEffect((onCleanup) => {
+					const cleanup = run();
+					if (typeof cleanup === "function") onCleanup(cleanup);
+				}, { flush: "post" });
+				stops.push(stop);
+				return stop;
+			},
+			on(event, listener) {
+				const element = root.value;
+				element?.addEventListener(event, listener);
+				const off = () => element?.removeEventListener(event, listener);
+				stops.push(off);
+				return off;
+			},
+			dispatch
+		};
+		let cleanup;
+		onMounted(() => {
+			Promise.resolve(controllerModule.default(host)).then((result) => {
+				cleanup = result;
+			});
+		});
+		onBeforeUnmount(() => {
+			for (const stop of stops.splice(0)) stop();
+			if (typeof cleanup === "function") cleanup();
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({
+				"data-component": "ui-avatar-group",
+				role: "group"
+			}, _ctx.$attrs, {
+				"aria-label": hn.enumerated(props.label),
+				ref_key: "root",
+				ref: root
+			}), [renderSlot(_ctx.$slots, "default"), createElementVNode("span", {
+				class: "overflow",
+				role: "img",
+				hidden: hn.attr(!hn.t(state_overflowCount.value)),
+				"aria-label": hn.enumerated(hn.call("format", "%s more", state_overflowCount.value)),
+				ref: (element) => {
+					refs["overflow"] = element;
+				}
+			}, toDisplayString(hn.text(hn.call("format", "+%s", state_overflowCount.value))), 9, _hoisted_2)], 16, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-e211803c"]]);
+//#endregion
+export { UiAvatarGroup_default as t };

package/vue/chunks/UiBadge.js

@@ -0,0 +1,33 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot } from "vue";
+//#region .build/vue/UiBadge.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["data-ui-badge-state"];
+//#endregion
+//#region .build/vue/UiBadge.vue
+var UiBadge_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiBadge",
+	props: {
+		tone: { default: "neutral" },
+		variant: { default: "subtle" }
+	},
+	setup(__props) {
+		const hn = { t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false) };
+		const props = __props;
+		/** The resolved values the styles' :host-state() rules test. */
+		const hostState = computed(() => ["tone", "variant"].flatMap((name) => {
+			const value = read(name);
+			const tokens = hn.t(value) ? [name] : [];
+			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
+			return tokens;
+		}).join(" "));
+		function read(name) {
+			return props[name];
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("span", mergeProps({ "data-component": "ui-badge" }, _ctx.$attrs, { "data-ui-badge-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-35c8472c"]]);
+//#endregion
+export { UiBadge_default as t };

package/vue/chunks/UiButton.js

@@ -0,0 +1,47 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot } from "vue";
+//#region .build/vue/UiButton.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["disabled", "data-ui-button-state"];
+//#endregion
+//#region .build/vue/UiButton.vue
+var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiButton",
+	props: {
+		disabled: {
+			type: [Boolean, null],
+			default: false
+		},
+		size: { default: "md" },
+		variant: { default: "outline" }
+	},
+	setup(__props) {
+		const hn = {
+			t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false),
+			text: (v) => v === void 0 || v === null ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? "" : String(v),
+			attr: (v) => v === void 0 || v === null || v === false ? void 0 : v === true ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? void 0 : String(v)
+		};
+		const props = __props;
+		/** The resolved values the styles' :host-state() rules test. */
+		const hostState = computed(() => ["variant", "size"].flatMap((name) => {
+			const value = read(name);
+			const tokens = hn.t(value) ? [name] : [];
+			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
+			return tokens;
+		}).join(" "));
+		function read(name) {
+			return props[name];
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("button", mergeProps({
+				"data-component": "ui-button",
+				type: "button"
+			}, _ctx.$attrs, {
+				disabled: hn.attr(props.disabled),
+				"data-ui-button-state": hostState.value || void 0
+			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-c8f3a3fb"]]);
+//#endregion
+export { UiButton_default as t };

package/vue/chunks/UiCallout.js

@@ -0,0 +1,117 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, openBlock, renderSlot } from "vue";
+//#region .build/vue/UiCallout.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["data-ui-callout-state"];
+var _hoisted_2 = {
+	class: "icon",
+	"aria-hidden": "true"
+};
+var _hoisted_3 = {
+	key: 0,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round"
+};
+var _hoisted_4 = {
+	key: 1,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round"
+};
+var _hoisted_5 = {
+	key: 2,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round"
+};
+var _hoisted_6 = {
+	key: 3,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round"
+};
+var _hoisted_7 = {
+	key: 4,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round"
+};
+var _hoisted_8 = { class: "content" };
+//#endregion
+//#region .build/vue/UiCallout.vue
+var UiCallout_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiCallout",
+	props: { tone: { default: "info" } },
+	setup(__props) {
+		const hn = { t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false) };
+		const props = __props;
+		/** The resolved values the styles' :host-state() rules test. */
+		const hostState = computed(() => ["tone"].flatMap((name) => {
+			const value = read(name);
+			const tokens = hn.t(value) ? [name] : [];
+			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
+			return tokens;
+		}).join(" "));
+		function read(name) {
+			return props[name];
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({
+				"data-component": "ui-callout",
+				role: "note"
+			}, _ctx.$attrs, { "data-ui-callout-state": hostState.value || void 0 }), [createElementVNode("span", _hoisted_2, [
+				hn.t(props.tone === "info") ? (openBlock(), createElementBlock("svg", _hoisted_3, [..._cache[0] || (_cache[0] = [
+					createElementVNode("circle", {
+						cx: "12",
+						cy: "12",
+						r: "10"
+					}, null, -1),
+					createElementVNode("path", { d: "M12 16v-4" }, null, -1),
+					createElementVNode("path", { d: "M12 8h.01" }, null, -1)
+				])])) : createCommentVNode("v-if", true),
+				hn.t(props.tone === "note") ? (openBlock(), createElementBlock("svg", _hoisted_4, [..._cache[1] || (_cache[1] = [
+					createElementVNode("path", { d: "M13.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8.5L13.5 2Z" }, null, -1),
+					createElementVNode("path", { d: "M13 2v7h7" }, null, -1),
+					createElementVNode("path", { d: "m9.5 17.5 4-4 2 2-4 4H9.5v-2Z" }, null, -1)
+				])])) : createCommentVNode("v-if", true),
+				hn.t(props.tone === "warning") ? (openBlock(), createElementBlock("svg", _hoisted_5, [..._cache[2] || (_cache[2] = [
+					createElementVNode("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z" }, null, -1),
+					createElementVNode("path", { d: "M12 9v4" }, null, -1),
+					createElementVNode("path", { d: "M12 17h.01" }, null, -1)
+				])])) : createCommentVNode("v-if", true),
+				hn.t(props.tone === "success") ? (openBlock(), createElementBlock("svg", _hoisted_6, [..._cache[3] || (_cache[3] = [createElementVNode("circle", {
+					cx: "12",
+					cy: "12",
+					r: "10"
+				}, null, -1), createElementVNode("path", { d: "m9 12 2 2 4-4" }, null, -1)])])) : createCommentVNode("v-if", true),
+				hn.t(props.tone === "danger") ? (openBlock(), createElementBlock("svg", _hoisted_7, [..._cache[4] || (_cache[4] = [
+					createElementVNode("circle", {
+						cx: "12",
+						cy: "12",
+						r: "10"
+					}, null, -1),
+					createElementVNode("path", { d: "m15 9-6 6" }, null, -1),
+					createElementVNode("path", { d: "m9 9 6 6" }, null, -1)
+				])])) : createCommentVNode("v-if", true)
+			]), createElementVNode("div", _hoisted_8, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])], 16, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-347d550e"]]);
+//#endregion
+export { UiCallout_default as t };