@comfyorg/design-system 1.1.0 → 1.3.0-alpha.0

package/dist/common/VirtualGrid.vue.d.ts

@@ -0,0 +1,38 @@
+import { CSSProperties } from 'vue';
+declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<{
+        items: (T & {
+            key: string;
+        })[];
+        gridStyle: CSSProperties;
+        bufferRows?: number;
+        resizeDebounce?: number;
+        defaultItemHeight?: number;
+        defaultItemWidth?: number;
+        maxColumns?: number;
+        onLoadMore?: () => unknown;
+        canLoadMore?: boolean;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        item?: (props: {
+            item: T & {
+                key: string;
+            };
+            index: number;
+        }) => any;
+    };
+    emit: {};
+}>) => import('vue').VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/common/VirtualGrid.vue.js

@@ -0,0 +1,105 @@
+import { Fragment, computed, createElementBlock, createElementVNode, defineComponent, normalizeStyle, onBeforeUnmount, openBlock, ref, renderList, renderSlot, watch } from "vue";
+import { useElementSize, useInfiniteScroll, useScroll, whenever } from "@vueuse/core";
+import { clamp, debounce } from "es-toolkit/compat";
+// src/components/common/VirtualGrid.vue
+var VirtualGrid_default = /* @__PURE__ */ defineComponent({
+	__name: "VirtualGrid",
+	props: {
+		items: {},
+		gridStyle: {},
+		bufferRows: { default: 1 },
+		resizeDebounce: { default: 64 },
+		defaultItemHeight: { default: 200 },
+		defaultItemWidth: { default: 200 },
+		maxColumns: { default: () => Infinity },
+		onLoadMore: { type: Function },
+		canLoadMore: {
+			type: Boolean,
+			default: false
+		}
+	},
+	setup(__props) {
+		const itemHeight = ref(__props.defaultItemHeight);
+		const itemWidth = ref(__props.defaultItemWidth);
+		const container = ref(null);
+		const { width, height } = useElementSize(container);
+		const { y: scrollY } = useScroll(container, { eventListenerOptions: { passive: true } });
+		const cols = computed(() => {
+			if (__props.maxColumns !== Infinity) return __props.maxColumns;
+			return Math.floor(width.value / itemWidth.value) || 1;
+		});
+		const mergedGridStyle = computed(() => {
+			if (__props.maxColumns === Infinity) return __props.gridStyle;
+			return {
+				...__props.gridStyle,
+				gridTemplateColumns: `repeat(${__props.maxColumns}, minmax(0, 1fr))`
+			};
+		});
+		const viewRows = computed(() => Math.ceil(height.value / itemHeight.value));
+		const offsetRows = computed(() => Math.floor(scrollY.value / itemHeight.value));
+		const isValidGrid = computed(() => height.value && width.value && __props.items?.length);
+		const state = computed(() => {
+			const fromRow = offsetRows.value - __props.bufferRows;
+			const toRow = offsetRows.value + __props.bufferRows + viewRows.value;
+			const fromCol = fromRow * cols.value;
+			const toCol = toRow * cols.value;
+			const total = __props.items?.length ?? 0;
+			const windowSize = Math.max(toCol - fromCol, 0);
+			const end = clamp(toCol, 0, total);
+			let start = clamp(fromCol, 0, end);
+			if (start === end && total > 0) start = Math.max(0, end - windowSize);
+			return {
+				start,
+				end
+			};
+		});
+		const renderedItems = computed(() => isValidGrid.value ? __props.items.slice(state.value.start, state.value.end) : []);
+		function rowsToHeight(itemsCount) {
+			return `${Math.ceil(itemsCount / cols.value) * itemHeight.value}px`;
+		}
+		const topSpacerStyle = computed(() => ({ height: rowsToHeight(state.value.start) }));
+		const bottomSpacerStyle = computed(() => ({ height: rowsToHeight(__props.items.length - state.value.end) }));
+		const distance = 2 * __props.defaultItemHeight * (1 + __props.bufferRows);
+		useInfiniteScroll(container, async () => {
+			await __props.onLoadMore?.();
+		}, {
+			canLoadMore: () => __props.canLoadMore,
+			distance
+		});
+		function updateItemSize() {
+			if (container.value) {
+				const firstItem = container.value.querySelector("[data-virtual-grid-item]");
+				if (!firstItem?.clientHeight || !firstItem?.clientWidth) return;
+				if (itemHeight.value !== firstItem.clientHeight) itemHeight.value = firstItem.clientHeight;
+				if (itemWidth.value !== firstItem.clientWidth) itemWidth.value = firstItem.clientWidth;
+			}
+		}
+		const onResize = debounce(updateItemSize, __props.resizeDebounce);
+		watch([width, height], onResize, { flush: "post" });
+		watch(() => __props.gridStyle, updateItemSize, { flush: "post" });
+		whenever(() => __props.items, updateItemSize, { flush: "post" });
+		onBeforeUnmount(() => {
+			onResize.cancel();
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "container",
+				ref: container,
+				class: "h-full scrollbar-thin scrollbar-thumb-(--muted) scrollbar-track-transparent scrollbar-gutter-stable overflow-y-auto [overflow-anchor:none]"
+			}, [
+				createElementVNode("div", { style: normalizeStyle(topSpacerStyle.value) }, null, 4),
+				createElementVNode("div", { style: normalizeStyle(mergedGridStyle.value) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(renderedItems.value, (item, i) => {
+					return openBlock(), createElementBlock("div", {
+						key: item.key,
+						"data-virtual-grid-item": ""
+					}, [renderSlot(_ctx.$slots, "item", {
+						item,
+						index: state.value.start + i
+					})]);
+				}), 128))], 4),
+				createElementVNode("div", { style: normalizeStyle(bottomSpacerStyle.value) }, null, 4)
+			], 512);
+		};
+	}
+});
+export { VirtualGrid_default as default };

package/dist/common/highlightQuery.d.ts

@@ -0,0 +1,6 @@
+interface HighlightQueryPart {
+    text: string;
+    highlighted: boolean;
+}
+export declare function highlightQuery(text: string, query: string): HighlightQueryPart[];
+export {};

package/dist/common/textTickerUtils.d.ts

@@ -0,0 +1 @@
+export declare function splitTextAtWordBoundary(text: string, ratio: number): [string, string];

package/dist/components.css

@@ -0,0 +1,44 @@
+
+.content-divider[data-v-dcb6a1f4] {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border: none;
+  flex-shrink: 0;
+  position: relative;
+  z-index: 1;
+}
+.content-divider--horizontal[data-v-dcb6a1f4] {
+  width: 100%;
+  height: var(--v5581bd6e);
+}
+.content-divider--vertical[data-v-dcb6a1f4] {
+  height: 100%;
+  width: var(--v5581bd6e);
+}
+
+.dot-animation[data-v-8e668792] {
+  animation: dot-pulse-8e668792 1s ease-in-out infinite;
+}
+@keyframes dot-pulse-8e668792 {
+0%,
+  80%,
+  100% {
+    opacity: 0.3;
+}
+40% {
+    opacity: 1;
+}
+}
+
+@keyframes marquee-scroll {
+0%,
+  20% {
+    transform: translateX(0);
+}
+80%,
+  100% {
+    transform: translateX(var(--_marquee-end));
+}
+}
+/*$vite$:1*/

package/dist/composables/useAttrsClass.d.ts

@@ -0,0 +1,12 @@
+import { ClassValue } from 'clsx';
+/**
+ * Splits `class` out of `$attrs` so wrappers can merge it with `cn()` onto an
+ * inner element while the remaining attrs fall through untouched.
+ */
+export declare function useAttrsClass(): {
+    attrsClass: import('vue').ComputedRef<ClassValue>;
+    attrsWithoutClass: import('vue').ComputedRef<{
+        [x: string]: unknown;
+        style?: import('vue').StyleValue;
+    }>;
+};

package/dist/composables/useAttrsClass.js

@@ -0,0 +1,17 @@
+import { computed, useAttrs } from "vue";
+// src/components/composables/useAttrsClass.ts
+/**
+* Splits `class` out of `$attrs` so wrappers can merge it with `cn()` onto an
+* inner element while the remaining attrs fall through untouched.
+*/
+function useAttrsClass() {
+	const attrs = useAttrs();
+	return {
+		attrsClass: computed(() => attrs.class),
+		attrsWithoutClass: computed(() => {
+			const { class: _class, ...rest } = attrs;
+			return rest;
+		})
+	};
+}
+export { useAttrsClass };

package/dist/composables/usePopoverSizing.d.ts

@@ -0,0 +1,12 @@
+import { CSSProperties, ComputedRef } from 'vue';
+interface PopoverSizeOptions {
+    minWidth?: string;
+    maxWidth?: string;
+}
+/**
+ * Composable for managing popover sizing styles
+ * @param options Popover size configuration
+ * @returns Computed style object for popover sizing
+ */
+export declare function usePopoverSizing(options: PopoverSizeOptions): ComputedRef<CSSProperties>;
+export {};

package/dist/composables/usePopoverSizing.js

@@ -0,0 +1,17 @@
+import { computed } from "vue";
+// src/components/composables/usePopoverSizing.ts
+/**
+* Composable for managing popover sizing styles
+* @param options Popover size configuration
+* @returns Computed style object for popover sizing
+*/
+function usePopoverSizing(options) {
+	return computed(() => {
+		const { minWidth, maxWidth } = options;
+		const style = {};
+		if (minWidth) style.minWidth = minWidth;
+		if (maxWidth) style.maxWidth = maxWidth;
+		return style;
+	});
+}
+export { usePopoverSizing };

package/dist/confirm/ConfirmBody.vue.d.ts

@@ -0,0 +1,8 @@
+import { MaybeRefOrGetter } from 'vue';
+type __VLS_Props = {
+    promptText?: MaybeRefOrGetter<string>;
+    preserveNewlines?: boolean;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/confirm/ConfirmBody.vue.js

@@ -0,0 +1,25 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { computed, createCommentVNode, createElementBlock, defineComponent, normalizeClass, openBlock, toDisplayString, toValue, unref } from "vue";
+// src/components/confirm/ConfirmBody.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex flex-col border-t p-4 text-sm/5 wrap-break-word text-muted-foreground" };
+// src/components/confirm/ConfirmBody.vue
+var ConfirmBody_default = /* @__PURE__ */ defineComponent({
+	__name: "ConfirmBody",
+	props: {
+		promptText: {},
+		preserveNewlines: {
+			type: Boolean,
+			default: false
+		}
+	},
+	setup(__props) {
+		const promptTextReal = computed(() => toValue(__props.promptText));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [promptTextReal.value ? (openBlock(), createElementBlock("p", {
+				key: 0,
+				class: normalizeClass(unref(cn)("m-0", __props.preserveNewlines && "whitespace-pre-line"))
+			}, toDisplayString(promptTextReal.value), 3)) : createCommentVNode("", true)]);
+		};
+	}
+});
+export { ConfirmBody_default as default };

package/dist/confirm/ConfirmFooter.vue.d.ts

@@ -0,0 +1,18 @@
+import { MaybeRefOrGetter } from 'vue';
+import { ButtonVariants } from '@comfyorg/design-system/button.variants';
+type __VLS_Props = {
+    cancelText: string;
+    confirmText: string;
+    confirmClass?: string;
+    confirmVariant?: ButtonVariants['variant'];
+    optionsDisabled?: MaybeRefOrGetter<boolean>;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    cancel: () => any;
+    confirm: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onCancel?: (() => any) | undefined;
+    onConfirm?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/confirm/ConfirmFooter.vue.js

@@ -0,0 +1,53 @@
+import { t as Button_default } from "../shared/Button-Dj_H5v3V.js";
+import { computed, createElementBlock, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, toDisplayString, toValue, unref, withCtx } from "vue";
+// src/components/confirm/ConfirmFooter.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex w-full flex-wrap items-center justify-end gap-4 p-4" };
+// src/components/confirm/ConfirmFooter.vue
+var ConfirmFooter_default = /* @__PURE__ */ defineComponent({
+	__name: "ConfirmFooter",
+	props: {
+		cancelText: {},
+		confirmText: {},
+		confirmClass: {},
+		confirmVariant: {},
+		optionsDisabled: {}
+	},
+	emits: ["cancel", "confirm"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const settled = ref(false);
+		const disabled = computed(() => settled.value || toValue(__props.optionsDisabled));
+		function settle(choice) {
+			if (settled.value) return;
+			settled.value = true;
+			if (choice === "cancel") emit("cancel");
+			else emit("confirm");
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("section", _hoisted_1, [createVNode(unref(Button_default), {
+				disabled: disabled.value,
+				variant: "muted-textonly",
+				size: "lg",
+				autofocus: "",
+				onClick: _cache[0] || (_cache[0] = ($event) => settle("cancel"))
+			}, {
+				default: withCtx(() => [createTextVNode(toDisplayString(__props.cancelText), 1)]),
+				_: 1
+			}, 8, ["disabled"]), createVNode(unref(Button_default), {
+				disabled: disabled.value,
+				variant: __props.confirmVariant ?? "textonly",
+				size: "lg",
+				class: normalizeClass(__props.confirmClass),
+				onClick: _cache[1] || (_cache[1] = ($event) => settle("confirm"))
+			}, {
+				default: withCtx(() => [createTextVNode(toDisplayString(__props.confirmText), 1)]),
+				_: 1
+			}, 8, [
+				"disabled",
+				"variant",
+				"class"
+			])]);
+		};
+	}
+});
+export { ConfirmFooter_default as default };

package/dist/confirm/ConfirmHeader.vue.d.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    title?: string;
+    icon?: string;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/confirm/ConfirmHeader.vue.js

@@ -0,0 +1,25 @@
+import { createCommentVNode, createElementBlock, defineComponent, normalizeClass, openBlock, toDisplayString } from "vue";
+// src/components/confirm/ConfirmHeader.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex items-center gap-2 p-4 text-sm font-normal" };
+var _hoisted_2 = {
+	key: 1,
+	class: "flex-auto"
+};
+// src/components/confirm/ConfirmHeader.vue
+var ConfirmHeader_default = /* @__PURE__ */ defineComponent({
+	__name: "ConfirmHeader",
+	props: {
+		title: {},
+		icon: {}
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [__props.icon ? (openBlock(), createElementBlock("i", {
+				key: 0,
+				class: normalizeClass(__props.icon),
+				"aria-hidden": "true"
+			}, null, 2)) : createCommentVNode("", true), __props.title ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.title), 1)) : createCommentVNode("", true)]);
+		};
+	}
+});
+export { ConfirmHeader_default as default };

package/dist/content-card/CardBottom.vue.d.ts

@@ -0,0 +1,16 @@
+type __VLS_Props = {
+    fullHeight?: boolean;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/content-card/CardBottom.vue.js

@@ -0,0 +1,17 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { computed, createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot } from "vue";
+// src/components/content-card/CardBottom.vue
+var CardBottom_default = /* @__PURE__ */ defineComponent({
+	__name: "CardBottom",
+	props: { fullHeight: {
+		type: Boolean,
+		default: true
+	} },
+	setup(__props) {
+		const containerClasses = computed(() => cn("w-full flex-1", __props.fullHeight && "h-full"));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(containerClasses.value) }, [renderSlot(_ctx.$slots, "default")], 2);
+		};
+	}
+});
+export { CardBottom_default as default };

package/dist/content-card/CardContainer.vue.d.ts

@@ -0,0 +1,26 @@
+type __VLS_Props = {
+    size?: 'mini' | 'compact' | 'regular' | 'portrait' | 'tall' | 'auto';
+    variant?: 'default' | 'ghost' | 'outline';
+    rounded?: 'none' | 'md' | 'lg' | 'xl';
+    customAspectRatio?: string;
+    hasBorder?: boolean;
+    hasBackground?: boolean;
+    hasShadow?: boolean;
+    hasCursor?: boolean;
+    class?: string;
+};
+declare var __VLS_1: {}, __VLS_3: {};
+type __VLS_Slots = {} & {
+    top?: (props: typeof __VLS_1) => any;
+} & {
+    bottom?: (props: typeof __VLS_3) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/content-card/CardContainer.vue.js

@@ -0,0 +1,59 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { computed, createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot } from "vue";
+// src/components/content-card/CardContainer.vue?vue&type=script&setup=true&lang.ts
+var structureClasses = "flex flex-col overflow-hidden";
+// src/components/content-card/CardContainer.vue
+var CardContainer_default = /* @__PURE__ */ defineComponent({
+	__name: "CardContainer",
+	props: {
+		size: { default: "regular" },
+		variant: { default: "default" },
+		rounded: { default: "md" },
+		customAspectRatio: {},
+		hasBorder: {
+			type: Boolean,
+			default: true
+		},
+		hasBackground: {
+			type: Boolean,
+			default: true
+		},
+		hasShadow: {
+			type: Boolean,
+			default: true
+		},
+		hasCursor: {
+			type: Boolean,
+			default: true
+		},
+		class: { default: "" }
+	},
+	setup(__props) {
+		const roundedClasses = {
+			none: "rounded-none",
+			md: "rounded",
+			lg: "rounded-lg",
+			xl: "rounded-xl"
+		};
+		const containerClasses = computed(() => {
+			const variantClasses = {
+				default: cn(__props.hasBackground && "bg-secondary", __props.hasBorder && "border border-border", __props.hasShadow && "shadow-sm", __props.hasCursor && "cursor-pointer"),
+				ghost: cn(__props.hasCursor && "cursor-pointer", "p-2 transition-colors duration-200"),
+				outline: cn(__props.hasBorder && "border-2 border-border/50", __props.hasCursor && "cursor-pointer", "transition-colors hover:border-border/25")
+			};
+			const aspectRatio = __props.customAspectRatio ? `aspect-[${__props.customAspectRatio}]` : {
+				mini: "aspect-100/120",
+				compact: "aspect-240/311",
+				regular: "aspect-256/308",
+				portrait: "aspect-256/325",
+				tall: "aspect-256/353",
+				auto: ""
+			}[__props.size];
+			return cn(structureClasses, roundedClasses[__props.rounded], variantClasses[__props.variant], aspectRatio, __props.class);
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(containerClasses.value) }, [renderSlot(_ctx.$slots, "top"), renderSlot(_ctx.$slots, "bottom")], 2);
+		};
+	}
+});
+export { CardContainer_default as default };

package/dist/content-card/CardTop.vue.d.ts

@@ -0,0 +1,36 @@
+type __VLS_Props = {
+    ratio?: 'square' | 'landscape';
+    topLeftClass?: string;
+    topRightClass?: string;
+    centerLeftClass?: string;
+    centerRightClass?: string;
+    bottomLeftClass?: string;
+    bottomRightClass?: string;
+};
+declare var __VLS_1: {
+    class: string;
+}, __VLS_3: {}, __VLS_5: {}, __VLS_7: {}, __VLS_9: {}, __VLS_11: {}, __VLS_13: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    'top-left'?: (props: typeof __VLS_3) => any;
+} & {
+    'top-right'?: (props: typeof __VLS_5) => any;
+} & {
+    'center-left'?: (props: typeof __VLS_7) => any;
+} & {
+    'center-right'?: (props: typeof __VLS_9) => any;
+} & {
+    'bottom-left'?: (props: typeof __VLS_11) => any;
+} & {
+    'bottom-right'?: (props: typeof __VLS_13) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/content-card/CardTop.vue.js

@@ -0,0 +1,70 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { computed, createCommentVNode, createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot, unref, useSlots } from "vue";
+// src/components/content-card/CardTop.vue
+var CardTop_default = /* @__PURE__ */ defineComponent({
+	__name: "CardTop",
+	props: {
+		ratio: { default: "square" },
+		topLeftClass: {},
+		topRightClass: {},
+		centerLeftClass: {},
+		centerRightClass: {},
+		bottomLeftClass: {},
+		bottomRightClass: {}
+	},
+	setup(__props) {
+		const slots = useSlots();
+		const topStyle = computed(() => {
+			return `relative p-0 overflow-hidden ${{
+				square: "aspect-square",
+				landscape: "aspect-48/27"
+			}[__props.ratio]}`;
+		});
+		const defaultSlotClasses = {
+			"top-left": "absolute top-2 left-2 flex flex-wrap justify-start gap-2",
+			"top-right": "absolute top-2 right-2 flex flex-wrap justify-end gap-2",
+			"center-left": "absolute top-1/2 left-2 flex -translate-y-1/2 flex-wrap justify-start gap-2",
+			"center-right": "absolute top-1/2 right-2 flex -translate-y-1/2 flex-wrap justify-end gap-2",
+			"bottom-left": "absolute bottom-2 left-2 flex flex-wrap justify-start gap-2",
+			"bottom-right": "absolute right-2 bottom-2 flex flex-wrap justify-end gap-2"
+		};
+		const slotClasses = computed(() => ({
+			"top-left": cn(defaultSlotClasses["top-left"], __props.topLeftClass),
+			"top-right": cn(defaultSlotClasses["top-right"], __props.topRightClass),
+			"center-left": cn(defaultSlotClasses["center-left"], __props.centerLeftClass),
+			"center-right": cn(defaultSlotClasses["center-right"], __props.centerRightClass),
+			"bottom-left": cn(defaultSlotClasses["bottom-left"], __props.bottomLeftClass),
+			"bottom-right": cn(defaultSlotClasses["bottom-right"], __props.bottomRightClass)
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(topStyle.value) }, [
+				renderSlot(_ctx.$slots, "default", { class: "absolute top-0 left-0 size-full" }),
+				unref(slots)["top-left"] ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(slotClasses.value["top-left"])
+				}, [renderSlot(_ctx.$slots, "top-left")], 2)) : createCommentVNode("", true),
+				unref(slots)["top-right"] ? (openBlock(), createElementBlock("div", {
+					key: 1,
+					class: normalizeClass(slotClasses.value["top-right"])
+				}, [renderSlot(_ctx.$slots, "top-right")], 2)) : createCommentVNode("", true),
+				unref(slots)["center-left"] ? (openBlock(), createElementBlock("div", {
+					key: 2,
+					class: normalizeClass(slotClasses.value["center-left"])
+				}, [renderSlot(_ctx.$slots, "center-left")], 2)) : createCommentVNode("", true),
+				unref(slots)["center-right"] ? (openBlock(), createElementBlock("div", {
+					key: 3,
+					class: normalizeClass(slotClasses.value["center-right"])
+				}, [renderSlot(_ctx.$slots, "center-right")], 2)) : createCommentVNode("", true),
+				unref(slots)["bottom-left"] ? (openBlock(), createElementBlock("div", {
+					key: 4,
+					class: normalizeClass(slotClasses.value["bottom-left"])
+				}, [renderSlot(_ctx.$slots, "bottom-left")], 2)) : createCommentVNode("", true),
+				unref(slots)["bottom-right"] ? (openBlock(), createElementBlock("div", {
+					key: 5,
+					class: normalizeClass(slotClasses.value["bottom-right"])
+				}, [renderSlot(_ctx.$slots, "bottom-right")], 2)) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+export { CardTop_default as default };

package/dist/dialog/Dialog.vue.d.ts

@@ -0,0 +1,21 @@
+import { DialogRootProps } from 'reka-ui';
+declare var __VLS_8: {
+    open: boolean;
+    close: () => void;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<DialogRootProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<DialogRootProps> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};