origam 2.14.1 → 2.16.0

package/dist/src/components/Tabs/OrigamTab.vue

@@ -17,10 +17,19 @@
 			@click="handleClick"
 	>
 		<span
-				v-if="icon"
+				v-if="hasPrependMedia"
 				class="origam-tab__prepend"
 		>
-			<origam-icon :icon="icon"/>
+			<origam-avatar
+					v-if="prependAvatar"
+					key="prepend-avatar"
+					:image="prependAvatar"
+			/>
+			<origam-icon
+					v-if="resolvedPrependIcon"
+					key="prepend-icon"
+					:icon="resolvedPrependIcon"
+			/>
 		</span>
 
 		<span class="origam-tab__label">
@@ -33,10 +42,19 @@
 		</span>
 
 		<span
-				v-if="appendIcon"
+				v-if="hasAppendMedia"
 				class="origam-tab__append"
 		>
-			<origam-icon :icon="appendIcon"/>
+			<origam-avatar
+					v-if="appendAvatar"
+					key="append-avatar"
+					:image="appendAvatar"
+			/>
+			<origam-icon
+					v-if="appendIcon"
+					key="append-icon"
+					:icon="appendIcon"
+			/>
 		</span>
 
 		<span
@@ -48,9 +66,10 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, inject, ref, StyleValue } from "vue";
-import { OrigamIcon } from "../../components";
+import { computed, inject, ref, StyleValue, toRef } from "vue";
+import { OrigamAvatar, OrigamIcon } from "../../components";
 import {
+  useAdjacent,
   useDefaults,
   useGroupItem,
   useProps,
@@ -60,26 +79,35 @@ import {
 import { vContrast } from "../../directives";
 import { ORIGAM_TABS_KEY, ORIGAM_TAB_PANELS_KEY } from "../../consts";
 const _props = defineProps({
+  tag: { type: String, required: false, default: "button" },
   text: { type: String, required: false, default: "" },
   variant: { type: null, required: false, default: void 0 },
-  tag: { type: String, required: false, default: "button" },
   icon: { type: null, required: false },
-  appendIcon: { type: null, required: false },
   id: { type: String, required: false },
   class: { type: [String, Array, Object], required: false },
   style: { type: [String, Array, Object, Boolean, null], required: false, skipCheck: true },
   value: { type: null, required: false, default: void 0 },
   disabled: { type: Boolean, required: false },
   selectedClass: { type: String, required: false },
-  fontFamily: { type: String, required: false },
-  fontSize: { type: String, required: false },
-  fontWeight: { type: String, required: false },
-  lineHeight: { type: String, required: false },
-  letterSpacing: { type: String, required: false }
+  fontFamily: { type: null, required: false },
+  fontSize: { type: null, required: false },
+  fontWeight: { type: null, required: false },
+  lineHeight: { type: null, required: false },
+  letterSpacing: { type: null, required: false },
+  appendAvatar: { type: String, required: false },
+  appendIcon: { type: null, required: false },
+  prependAvatar: { type: String, required: false },
+  prependIcon: { type: null, required: false }
 });
 const props = useDefaults(_props);
+defineSlots();
 const { filterProps } = useProps(props);
 const rootRef = ref();
+const resolvedPrependIcon = computed(() => props.prependIcon ?? props.icon);
+const {
+  hasPrependMedia,
+  hasAppendMedia
+} = useAdjacent(props, resolvedPrependIcon, toRef(props, "appendIcon"));
 const groupItem = useGroupItem(props, ORIGAM_TABS_KEY);
 const panelsGroup = inject(ORIGAM_TAB_PANELS_KEY, null);
 if (!groupItem) {
@@ -123,8 +151,8 @@ const tabClasses = computed(() => {
     groupItem.selectedClass.value,
     {
       "origam-tab--disabled": isDisabled.value,
-      "origam-tab--with-prepend": !!props.icon,
-      "origam-tab--with-append": !!props.appendIcon
+      "origam-tab--with-prepend": hasPrependMedia.value,
+      "origam-tab--with-append": hasAppendMedia.value
     },
     props.class
   ];

package/dist/src/components/Tabs/OrigamTabPanel.vue

@@ -43,6 +43,7 @@ const props = defineProps({
   eager: { type: Boolean, required: false, default: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const rootRef = ref();
 const groupItem = useGroupItem(props, ORIGAM_TAB_PANELS_KEY);
 const tabsGroup = inject(ORIGAM_TABS_KEY, null);

package/dist/src/components/Tabs/OrigamTabPanels.vue

@@ -21,10 +21,12 @@ import { computed, provide, ref, shallowRef, StyleValue, watch } from "vue";
 import { OrigamDefaultsProvider } from "../../components";
 import {
   useGroup,
+  usePassedProps,
   useProps,
   useStyle
 } from "../../composables";
 import { ORIGAM_TAB_PANELS_KEY, ORIGAM_TAB_PANELS_CTX_KEY } from "../../consts";
+import { omitUndefined } from "../../utils";
 import { vTouch } from "../../directives";
 import { DIRECTION } from "../../enums";
 const props = defineProps({
@@ -43,6 +45,7 @@ const props = defineProps({
   selectedClass: { type: String, required: false, default: "origam-tab-panel--active" }
 });
 defineEmits(["update:modelValue"]);
+defineSlots();
 const { filterProps } = useProps(props);
 const { isSelected, select, next, prev, selected, items } = useGroup(props, ORIGAM_TAB_PANELS_KEY);
 const rootRef = ref();
@@ -77,10 +80,11 @@ const slotProps = computed(() => ({
   selected,
   items: items.value
 }));
+const wasPropPassed = usePassedProps(props);
 const slotDefaults = computed(() => ({
-  "origam-tab-panel": {
-    transition: props.transition
-  }
+  "origam-tab-panel": omitUndefined({
+    transition: wasPropPassed("transition") ? props.transition : void 0
+  })
 }));
 const panelsStyles = computed(() => {
   return [

package/dist/src/components/Tabs/OrigamTabs.vue

@@ -1,6 +1,6 @@
 <template>
 	<component
-			:is="props.tag"
+			:is="tag"
 			:id="id"
 			ref="rootRef"
 			role="tablist"
@@ -25,11 +25,13 @@ import {
   useDefaults,
   useDensity,
   useGroup,
+  usePassedProps,
   useProps,
   useRounded,
   useStyle
 } from "../../composables";
 import { ORIGAM_TABS_KEY } from "../../consts";
+import { omitUndefined } from "../../utils";
 import { DENSITY, DIRECTION, TAB_VARIANT } from "../../enums";
 const _props = defineProps({
   tag: { type: String, required: false, default: "div" },
@@ -57,6 +59,7 @@ const _props = defineProps({
 });
 const props = useDefaults(_props);
 defineEmits(["update:modelValue"]);
+defineSlots();
 const { filterProps } = useProps(props);
 const { isSelected, select, next, prev, selected, items } = useGroup(props, ORIGAM_TABS_KEY);
 const rootRef = ref();
@@ -68,13 +71,14 @@ const slotProps = computed(() => ({
   selected,
   items: items.value
 }));
+const wasPropPassed = usePassedProps(props);
 const slotDefaults = computed(() => ({
-  "origam-tab": {
-    density: props.density,
-    color: props.color,
+  "origam-tab": omitUndefined({
     variant: props.variant,
-    fixed: props.fixed
-  }
+    density: wasPropPassed("density") ? props.density : void 0,
+    color: wasPropPassed("color") ? props.color : void 0,
+    fixed: wasPropPassed("fixed") ? props.fixed : void 0
+  })
 }));
 const ariaOrientation = computed(() => props.direction === DIRECTION.VERTICAL ? "vertical" : "horizontal");
 const focusTab = (id2) => {

package/dist/src/components/TextField/OrigamTextField.vue

@@ -279,11 +279,11 @@ const _props = defineProps({
   roundedTopLeft: { type: [Boolean, Number, String], required: false },
   roundedBottomLeft: { type: [Boolean, Number, String], required: false },
   roundedBottomRight: { type: [Boolean, Number, String], required: false },
-  fontFamily: { type: String, required: false },
-  fontSize: { type: String, required: false },
-  fontWeight: { type: String, required: false },
-  lineHeight: { type: String, required: false },
-  letterSpacing: { type: String, required: false },
+  fontFamily: { type: null, required: false },
+  fontSize: { type: null, required: false },
+  fontWeight: { type: null, required: false },
+  lineHeight: { type: null, required: false },
+  letterSpacing: { type: null, required: false },
   active: { type: [Boolean, Object], required: false },
   activeClass: { type: String, required: false },
   variant: { type: null, required: false },

package/dist/src/components/TextMask/OrigamTextMask.vue

@@ -22,18 +22,19 @@ const props = defineProps({
   background: { type: [String, Object], required: true },
   animated: { type: Boolean, required: false, default: false },
   animationDuration: { type: String, required: false, default: "3s" },
-  animationType: { type: String, required: false, default: "pan" },
-  align: { type: String, required: false, default: "left" },
+  animationType: { type: null, required: false, default: "pan" },
+  align: { type: null, required: false, default: "left" },
   id: { type: String, required: false },
   class: { type: [String, Array, Object], required: false },
   style: { type: [String, Array, Object, Boolean, null], required: false, skipCheck: true },
   tag: { type: String, required: false, default: "span" },
-  fontFamily: { type: String, required: false },
-  fontSize: { type: String, required: false },
-  fontWeight: { type: String, required: false },
-  lineHeight: { type: String, required: false },
-  letterSpacing: { type: String, required: false }
+  fontFamily: { type: null, required: false },
+  fontSize: { type: null, required: false },
+  fontWeight: { type: null, required: false },
+  lineHeight: { type: null, required: false },
+  letterSpacing: { type: null, required: false }
 });
+defineSlots();
 const slots = useSlots();
 const resolvedBackground = computed(() => {
   const fromGradient = resolveGradient(props.background);

package/dist/src/components/TextareaField/OrigamTextareaField.vue

@@ -275,6 +275,7 @@ import {
   useProps,
   useStyle,
   useTextareaRich,
+  useTheme,
   useTypography,
   useVModel
 } from "../../composables";
@@ -371,11 +372,11 @@ const _props = defineProps({
   roundedTopLeft: { type: [Boolean, Number, String], required: false },
   roundedBottomLeft: { type: [Boolean, Number, String], required: false },
   roundedBottomRight: { type: [Boolean, Number, String], required: false },
-  fontFamily: { type: String, required: false },
-  fontSize: { type: String, required: false },
-  fontWeight: { type: String, required: false },
-  lineHeight: { type: String, required: false },
-  letterSpacing: { type: String, required: false },
+  fontFamily: { type: null, required: false },
+  fontSize: { type: null, required: false },
+  fontWeight: { type: null, required: false },
+  lineHeight: { type: null, required: false },
+  letterSpacing: { type: null, required: false },
   active: { type: [Boolean, Object], required: false },
   activeClass: { type: String, required: false },
   variant: { type: null, required: false },
@@ -585,7 +586,8 @@ const calculateInputHeight = () => {
     emits("update:height", controlHeight.value);
   });
 };
-watch([model, () => props.maxRows, () => props.density, () => props.rows], () => {
+const { theme: activeTheme, mode: activeMode } = useTheme();
+watch([model, () => props.maxRows, () => props.density, () => props.rows, activeTheme, activeMode], () => {
   calculateInputHeight();
 }, { immediate: true });
 watch(minHeight, () => {

package/dist/src/components/ThemeProvider/OrigamThemeProvider.vue

@@ -15,10 +15,11 @@ import { provideDefaults } from "../../composables";
 import { ORIGAM_DEFAULTS_KEY, ORIGAM_THEME_DEFAULTS_KEY } from "../../consts";
 defineOptions({ inheritAttrs: false });
 const props = defineProps({
-  theme: { type: [String, Object], required: false, default: "auto" },
-  mode: { type: String, required: false, default: "auto" },
+  theme: { type: null, required: false, default: "auto" },
+  mode: { type: null, required: false, default: "auto" },
   tag: { type: String, required: false, default: "div" }
 });
+defineSlots();
 const attrs = useAttrs();
 const dataTheme = computed(() => props.theme === "auto" ? void 0 : props.theme);
 const dataMode = computed(() => props.mode === "auto" ? void 0 : props.mode);

package/dist/src/components/Timeline/OrigamTimeline.vue

@@ -7,7 +7,7 @@
 		:aria-label="ariaLabel"
 	>
 		<div
-				v-if="orientation === 'horizontal'"
+				v-if="isHorizontal"
 				class="origam-timeline__track-wrapper"
 		>
 			<slot name="default">
@@ -21,7 +21,7 @@
 					:intent="entry.intent"
 					:is-last="index === (items?.length ?? 0) - 1"
 					:truncate-line="truncateLine ?? false"
-					:side="side ?? 'start'"
+					:side="side ?? TIMELINE_SIDE.START"
 					:orientation="orientation"
 					:index="index"
 					:data-cy="`timeline-item-${index}`"
@@ -59,10 +59,11 @@ import {
   useStyle
 } from "../../composables";
 import { TIMELINE_CONTEXT_KEY } from "../../consts";
+import { DIRECTION, TIMELINE_SIDE } from "../../enums";
 const props = defineProps({
   items: { type: Array, required: false },
-  orientation: { type: String, required: false, default: "vertical" },
-  side: { type: String, required: false, default: "start" },
+  orientation: { type: null, required: false, default: "vertical" },
+  side: { type: null, required: false, default: "start" },
   truncateLine: { type: Boolean, required: false, default: false },
   ariaLabel: { type: String, required: false },
   id: { type: String, required: false },
@@ -74,12 +75,14 @@ const props = defineProps({
   density: { type: null, required: false }
 });
 const { filterProps } = useProps(props);
-const orientation = computed(() => props.orientation ?? "vertical");
+defineSlots();
+const orientation = computed(() => props.orientation ?? DIRECTION.VERTICAL);
+const isHorizontal = computed(() => orientation.value === DIRECTION.HORIZONTAL);
 const { densityClasses } = useDensity(props);
 const { sizeClasses } = useSize(props);
 provide(TIMELINE_CONTEXT_KEY, {
   get side() {
-    return props.side ?? "start";
+    return props.side ?? TIMELINE_SIDE.START;
   },
   get truncateLine() {
     return props.truncateLine ?? false;

package/dist/src/components/Timeline/OrigamTimelineItem.vue

@@ -50,15 +50,16 @@ import {
   useStyle
 } from "../../composables";
 import { TIMELINE_CONTEXT_KEY } from "../../consts";
+import { DIRECTION, TIMELINE_SIDE } from "../../enums";
 const props = defineProps({
   title: { type: String, required: false },
   subtitle: { type: String, required: false },
   icon: { type: null, required: false },
-  intent: { type: String, required: false },
+  intent: { type: null, required: false },
   isLast: { type: Boolean, required: false, default: false },
   truncateLine: { type: Boolean, required: false, default: false },
-  side: { type: String, required: false, default: "start" },
-  orientation: { type: String, required: false, default: "vertical" },
+  side: { type: null, required: false, default: "start" },
+  orientation: { type: null, required: false, default: "vertical" },
   index: { type: Number, required: false, default: 0 },
   id: { type: String, required: false },
   class: { type: [String, Array, Object], required: false },
@@ -70,6 +71,7 @@ const props = defineProps({
 });
 const timelineCtx = inject(TIMELINE_CONTEXT_KEY, null);
 const { filterProps } = useProps(props);
+defineSlots();
 const { densityClasses } = useDensity(props);
 const { sizeClasses } = useSize(props);
 const effectiveSide = computed(() => {
@@ -78,7 +80,7 @@ const effectiveSide = computed(() => {
 });
 const effectiveOrientation = computed(() => {
   if (timelineCtx?.orientation) return timelineCtx.orientation;
-  return props.orientation ?? "vertical";
+  return props.orientation ?? DIRECTION.VERTICAL;
 });
 const effectiveTruncateLine = computed(() => {
   if (timelineCtx?.truncateLine !== void 0) return timelineCtx.truncateLine;
@@ -99,7 +101,7 @@ const dotStyles = computed(() => {
   };
 });
 const connectorStyles = computed(() => {
-  const isH = effectiveOrientation.value === "horizontal";
+  const isH = effectiveOrientation.value === DIRECTION.HORIZONTAL;
   return {
     "background-color": "var(--origam-timeline---connector-color, var(--origam-color__border---subtle))",
     [isH ? "height" : "width"]: "var(--origam-timeline---connector-thickness, var(--origam-border__width---thin, 1px))"
@@ -125,8 +127,8 @@ function intentToFgToken(intent) {
 }
 const contentSide = computed(() => {
   const side = effectiveSide.value;
-  if (side === "alternating") {
-    return props.index % 2 === 0 ? "start" : "end";
+  if (side === TIMELINE_SIDE.ALTERNATING) {
+    return props.index % 2 === 0 ? TIMELINE_SIDE.START : TIMELINE_SIDE.END;
   }
   return side;
 });
@@ -134,10 +136,10 @@ const itemClasses = computed(() => [
   "origam-timeline-item",
   `origam-timeline-item--orientation-${effectiveOrientation.value}`,
   {
-    "origam-timeline-item--side-start": effectiveSide.value === "start" || contentSide.value === "start",
-    "origam-timeline-item--side-end": effectiveSide.value === "end" || contentSide.value === "end",
-    "origam-timeline-item--alternating": effectiveSide.value === "alternating",
-    "origam-timeline-item--content-end": contentSide.value === "end",
+    "origam-timeline-item--side-start": effectiveSide.value === TIMELINE_SIDE.START || contentSide.value === TIMELINE_SIDE.START,
+    "origam-timeline-item--side-end": effectiveSide.value === TIMELINE_SIDE.END || contentSide.value === TIMELINE_SIDE.END,
+    "origam-timeline-item--alternating": effectiveSide.value === TIMELINE_SIDE.ALTERNATING,
+    "origam-timeline-item--content-end": contentSide.value === TIMELINE_SIDE.END,
     "origam-timeline-item--last": props.isLast
   },
   densityClasses.value,

package/dist/src/components/Title/OrigamTitle.vue

@@ -65,14 +65,15 @@ const _props = defineProps({
   borderRightColor: { type: [String, Object, Boolean, null], required: false, skipCheck: true },
   borderBottomColor: { type: [String, Object, Boolean, null], required: false, skipCheck: true },
   borderLeftColor: { type: [String, Object, Boolean, null], required: false, skipCheck: true },
-  fontFamily: { type: String, required: false },
-  fontSize: { type: String, required: false },
-  fontWeight: { type: String, required: false },
-  lineHeight: { type: String, required: false },
-  letterSpacing: { type: String, required: false }
+  fontFamily: { type: null, required: false },
+  fontSize: { type: null, required: false },
+  fontWeight: { type: null, required: false },
+  lineHeight: { type: null, required: false },
+  letterSpacing: { type: null, required: false }
 });
 const props = useDefaults(_props);
 const { filterProps } = useProps(props);
+defineSlots();
 const { colorClasses, colorStyles } = useBothColor(toRef(props, "bgColor"), toRef(props, "color"));
 const { densityClasses } = useDensity(props);
 const slots = useSlots();

package/dist/src/components/Toolbar/OrigamToolbar.vue

@@ -113,12 +113,13 @@ const props = defineProps({
   active: { type: [Boolean, Object], required: false },
   activeClass: { type: String, required: false },
   hover: { type: [Boolean, Object], required: false },
-  fontFamily: { type: String, required: false },
-  fontSize: { type: String, required: false },
-  fontWeight: { type: String, required: false },
-  lineHeight: { type: String, required: false },
-  letterSpacing: { type: String, required: false }
+  fontFamily: { type: null, required: false },
+  fontSize: { type: null, required: false },
+  fontWeight: { type: null, required: false },
+  lineHeight: { type: null, required: false },
+  letterSpacing: { type: null, required: false }
 });
+defineSlots();
 const { filterProps } = useProps(props);
 const slots = useSlots();
 const hasPrepend = computed(() => {

package/dist/src/components/Tooltip/OrigamTooltip.vue

@@ -94,13 +94,14 @@ const props = defineProps({
   scrim: { type: [Boolean, String], required: false, default: false },
   color: { type: [String, Object, Boolean, null], required: false, skipCheck: true },
   bgColor: { type: [String, Object, Boolean, null], required: false, skipCheck: true },
-  fontFamily: { type: String, required: false },
-  fontSize: { type: String, required: false },
-  fontWeight: { type: String, required: false },
-  lineHeight: { type: String, required: false },
-  letterSpacing: { type: String, required: false }
+  fontFamily: { type: null, required: false },
+  fontSize: { type: null, required: false },
+  fontWeight: { type: null, required: false },
+  lineHeight: { type: null, required: false },
+  letterSpacing: { type: null, required: false }
 });
 defineEmits(["update:modelValue"]);
+defineSlots();
 const { filterProps } = useProps(props);
 const { colorClasses, colorStyles } = useBothColor(toRef(props, "bgColor"), toRef(props, "color"));
 const { typographyStyles } = useTypography(props, "tooltip");

package/dist/src/components/Transition/OrigamExpandX.vue

@@ -28,6 +28,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const expandedParentClass = "";
 const sizeProperty = "width";
 const offsetProperty = camelize(`offset-${sizeProperty}`);

package/dist/src/components/Transition/OrigamExpandY.vue

@@ -28,6 +28,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const expandedParentClass = "";
 const sizeProperty = "height";
 const offsetProperty = camelize(`offset-${sizeProperty}`);

package/dist/src/components/Transition/OrigamFade.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamReverseTranslatePicker.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamScaleRotate.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamSlideX.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamSlideY.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamSnack.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamTransition.vue

@@ -17,6 +17,7 @@ const props = defineProps({
   disabled: { type: Boolean, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const attrs = useAttrs();
 const { isDisabled } = useTransition(props);
 const component = computed(() => {

package/dist/src/components/Transition/OrigamTranslateBottom.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamTranslatePicker.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useCssTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamTranslateScale.vue

@@ -23,6 +23,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const hasTarget = computed(() => {
   return !!props.target;
 });

package/dist/src/components/Transition/OrigamWindowXReverseTranslate.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useWindowTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamWindowXTranslate.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useWindowTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamWindowYReverseTranslate.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useWindowTransition(props);
 defineExpose({
   filterProps

package/dist/src/components/Transition/OrigamWindowYTranslate.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   origin: { type: String, required: false }
 });
 const { filterProps } = useProps(props);
+defineSlots();
 const { name, tag, transitionProps } = useWindowTransition(props);
 defineExpose({
   filterProps