@plexui/vue 0.0.0-stage → 0.1.1

package/dist/es/components/Tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../src/components/Tooltip/Tooltip.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Text,\n  computed,\n  defineComponent,\n  h,\n  inject,\n  markRaw,\n  normalizeStyle,\n  onBeforeUnmount,\n  provide,\n  ref,\n  watch,\n  type InjectionKey,\n  type PropType,\n  type Ref,\n  type VNode,\n  type VNodeArrayChildren,\n} from \"vue\"\nimport {\n  TooltipContent as RekaTooltipContent,\n  TooltipPortal as RekaTooltipPortal,\n  TooltipProvider as RekaTooltipProvider,\n  TooltipRoot as RekaTooltipRoot,\n  TooltipTrigger as RekaTooltipTrigger,\n  injectTooltipProviderContext,\n  injectTooltipRootContext,\n  useId,\n} from \"reka-ui\"\nimport { useEscCloseStack } from \"../../composables/useEscCloseStack.js\"\nimport { preventDefaultHandler } from \"../../lib/helpers.js\"\nimport { composeEventHandlers, concatAriaDescribedby, firstElementChild, flattenSlot, mergeSlotProps } from \"./slot.js\"\nimport s from \"@plexui/styles/components/Tooltip/Tooltip.module.css\"\n\n// Vue port of packages/ui/src/components/Tooltip/Tooltip.tsx on Reka UI.\n// Exports are flat (`TooltipRoot`, `TooltipTrigger`, ...) because\n// runtime-compiled templates cannot resolve `Tooltip.Root`; the static\n// properties are kept for render functions and SFCs.\n//\n// Reka keeps the open/close timers, the provider's skip delay, positioning,\n// the dismissable layer and the hover grace area. Where Radix and Reka\n// differ, the port follows Radix so the DOM and behaviour match React:\n// - Triggers run their handlers after the child's and skip them when one\n//   called preventDefault() (Radix's composeEventHandlers). Reka's trigger\n//   listeners are switched off (`disabled`) and re-implemented here.\n// - Radix tells the provider about open changes (skip delay, the\n//   \"tooltip.open\" event that closes other tooltips) only when the tooltip\n//   asks for one; Reka also does it for any change of the `open` prop, which\n//   Plex uses to close on Escape and after a copy.\n// - The state attribute is computed when `open` changes, as Radix memoizes it.\n// - The content element is rendered here (Reka's `as`) the radix-ui 1.8 way:\n//   it is the `role=\"tooltip\"` element itself, without the visually hidden\n//   copy of the text Reka adds; an `id` on the content becomes the id the\n//   trigger points at, and only an `aria-label` gets a visually hidden\n//   element. Radix's custom property names, no `dir` and no\n//   `data-grace-area-trigger`.\n\nexport type TooltipSide = \"top\" | \"right\" | \"bottom\" | \"left\"\nexport type TooltipAlign = \"start\" | \"center\" | \"end\"\nexport type TooltipGutterSize = \"sm\" | \"md\" | \"lg\"\ntype StateAttribute = \"closed\" | \"delayed-open\" | \"instant-open\"\n\nconst TOOLTIP_OPEN = \"tooltip.open\"\n\n// Radix's VisuallyHidden styles (Reka's add clip-path, top and left)\nconst VISUALLY_HIDDEN_STYLE = {\n  position: \"absolute\",\n  border: \"0\",\n  width: \"1px\",\n  height: \"1px\",\n  padding: \"0\",\n  margin: \"-1px\",\n  overflow: \"hidden\",\n  clip: \"rect(0, 0, 0, 0)\",\n  whiteSpace: \"nowrap\",\n  wordWrap: \"normal\",\n}\n\n/** React adds `px` to unitless numbers in style objects; Vue does not. */\nconst toCssLength = (value: number | string | undefined) => (typeof value === \"number\" ? `${value}px` : value)\n\n/**\n * The content custom properties under Radix's names (`--radix-tooltip-*`,\n * `--radix-popover-*`), which the shared CSS reads. They still point at the\n * `--reka-popper-*` values Reka sets on its positioning wrapper.\n */\nexport const withRadixVariableNames = (style: unknown, part: string) => {\n  const from = `--reka-${part}-`\n  const result: Record<string, unknown> = {}\n  for (const [key, value] of Object.entries(normalizeStyle([style]) as Record<string, unknown>)) {\n    result[key.startsWith(from) ? `--radix-${part}-${key.slice(from.length)}` : key] = value\n  }\n  return result\n}\n\ntype ProviderHooks = { onOpen: () => void; onClose: () => void }\n\n// The content's own `id`, which Radix uses as the content id (Reka's\n// `contentId` is a plain string the trigger reads once)\nconst ContentIdKey: InjectionKey<Ref<string | undefined>> = Symbol(\"PlexUITooltipContentId\")\n\nconst REKA_PROVIDER_HOOKS = Symbol(\"rekaProviderHooks\")\nconst REKA_STATE = Symbol(\"rekaStateAttribute\")\n\n// Rendered inside Reka's root: adjusts the provider and root contexts the\n// Radix way (see the notes at the top).\nconst TooltipContextBridge = defineComponent({\n  name: \"TooltipContextBridge\",\n  props: {\n    hooks: { type: Object as PropType<ProviderHooks>, required: true },\n  },\n  setup(props, { slots }) {\n    // Reka's originals are kept on the contexts, so a second setup against\n    // the same provider and root (a remount, HMR) still finds them\n    const providerContext = injectTooltipProviderContext() as ReturnType<typeof injectTooltipProviderContext> & {\n      [REKA_PROVIDER_HOOKS]?: ProviderHooks\n    }\n    const rekaHooks = (providerContext[REKA_PROVIDER_HOOKS] ??= {\n      onOpen: providerContext.onOpen,\n      onClose: providerContext.onClose,\n    })\n    props.hooks.onOpen = rekaHooks.onOpen\n    props.hooks.onClose = rekaHooks.onClose\n    // Reka's root skips its own provider calls when there is no `onClose`\n    ;(providerContext as { onClose?: () => void }).onClose = undefined\n\n    const rootContext = injectTooltipRootContext() as ReturnType<typeof injectTooltipRootContext> & {\n      [REKA_STATE]?: Ref<StateAttribute>\n    }\n    const rekaState = (rootContext[REKA_STATE] ??= rootContext.stateAttribute)\n    const state = ref<StateAttribute>(rekaState.value)\n    watch(\n      () => rootContext.open.value,\n      () => {\n        state.value = rekaState.value\n      },\n      { flush: \"sync\" },\n    )\n    rootContext.stateAttribute = computed(() => state.value) as unknown as Ref<StateAttribute>\n\n    return () => slots.default?.()\n  },\n})\n\n/** Low-level tooltip root (`Tooltip.Root` in React). Always controlled: bind `v-model:open`. */\nexport const TooltipRoot = defineComponent({\n  name: \"TooltipRoot\",\n  props: {\n    open: { type: Boolean, required: true },\n    /** Delay before the tooltip opens on hover, in milliseconds. @default 700 */\n    delayDuration: Number,\n    /** Closes the tooltip as soon as the pointer leaves the trigger. @default false */\n    disableHoverableContent: { type: Boolean, default: undefined },\n  },\n  emits: {\n    \"update:open\": (_open: boolean) => true,\n  },\n  setup(props, { slots, emit }) {\n    const hooks: ProviderHooks = { onOpen: () => {}, onClose: () => {} }\n    const onOpenChange = (nextState: boolean) => emit(\"update:open\", nextState)\n    provide(ContentIdKey, ref<string>())\n\n    useEscCloseStack(\n      () => props.open,\n      () => onOpenChange(false),\n    )\n\n    // Radix's controlled state: only real changes are reported\n    const handleOpenChange = (nextState: boolean) => {\n      if (nextState === props.open) return\n      if (nextState) {\n        hooks.onOpen()\n        document.dispatchEvent(new CustomEvent(TOOLTIP_OPEN))\n      } else {\n        hooks.onClose()\n      }\n      onOpenChange(nextState)\n    }\n\n    return () =>\n      h(RekaTooltipProvider, null, {\n        default: () =>\n          h(\n            RekaTooltipRoot,\n            {\n              \"open\": props.open,\n              \"delayDuration\": props.delayDuration,\n              \"disableHoverableContent\": props.disableHoverableContent,\n              // The trigger listeners are this port's (TooltipTrigger)\n              \"disabled\": true,\n              \"onUpdate:open\": handleOpenChange,\n            },\n            { default: () => h(TooltipContextBridge, { hooks }, { default: () => slots.default?.() }) },\n          ),\n      })\n  },\n})\n\n/**\n * Low-level trigger (`Tooltip.Trigger` in React). Renders its child with the\n * tooltip wiring merged in; `as-child=\"false\"` renders a `<button>` instead.\n */\nexport const TooltipTrigger = defineComponent({\n  name: \"TooltipTrigger\",\n  inheritAttrs: false,\n  props: {\n    /** Merges into the child instead of rendering a `<button>`. @default true */\n    asChild: { type: Boolean, default: true },\n  },\n  setup(props, { slots, attrs }) {\n    const rootContext = injectTooltipRootContext()\n    const providerContext = injectTooltipProviderContext()\n    // Set before the first render, which describes the trigger by it\n    rootContext.contentId ||= useId(undefined, \"reka-tooltip-content\")\n    const contentIdProp = inject(ContentIdKey, undefined)\n    let isPointerDown = false\n    let hasPointerMoveOpened = false\n\n    const handlePointerUp = () => {\n      isPointerDown = false\n    }\n    onBeforeUnmount(() => document.removeEventListener(\"pointerup\", handlePointerUp))\n\n    // Radix's TooltipTrigger handlers\n    const handlers: Record<string, (event: Event) => void> = {\n      onPointermove: (event) => {\n        if ((event as PointerEvent).pointerType === \"touch\") return\n        if (!hasPointerMoveOpened && !providerContext.isPointerInTransitRef.value) {\n          rootContext.onTriggerEnter()\n          hasPointerMoveOpened = true\n        }\n      },\n      onPointerleave: () => {\n        rootContext.onTriggerLeave()\n        hasPointerMoveOpened = false\n      },\n      onPointerdown: () => {\n        if (rootContext.open.value) {\n          rootContext.onClose()\n        }\n        isPointerDown = true\n        document.addEventListener(\"pointerup\", handlePointerUp, { once: true })\n      },\n      onFocus: () => {\n        if (!isPointerDown) rootContext.onOpen()\n      },\n      onBlur: () => rootContext.onClose(),\n      onClick: () => rootContext.onClose(),\n    }\n\n    return () => {\n      const child = props.asChild ? firstElementChild(slots.default?.()) : h(\"button\", null, slots.default?.())\n      if (!child) return null\n\n      const contentId = contentIdProp?.value ?? rootContext.contentId\n      const triggerProps: Record<string, unknown> = {\n        ...attrs,\n        // Radix adds the content id to the trigger's own while open (the\n        // child's own ids come first, as in Radix's Slot)\n        \"aria-describedby\": rootContext.open.value\n          ? concatAriaDescribedby(attrs[\"aria-describedby\"], contentId)\n          : attrs[\"aria-describedby\"],\n        \"data-grace-area-trigger\": undefined,\n      }\n      for (const [key, handler] of Object.entries(handlers)) {\n        triggerProps[key] = composeEventHandlers(attrs[key], handler)\n      }\n\n      return h(RekaTooltipTrigger, { asChild: true }, { default: () => mergeSlotProps(child, triggerProps) })\n    }\n  },\n})\n\ntype ContentChildren = {\n  render: () => VNodeArrayChildren | undefined\n  ariaLabel: () => unknown\n}\n\nconst ContentChildrenKey: InjectionKey<ContentChildren> = Symbol(\"PlexUITooltipContent\")\n\n// The element Reka's content renders (`as`), in place of Reka's visually\n// hidden copy of the text. Raw, as Reka may pass `as` through reactive props.\nconst TooltipContentElement = markRaw(defineComponent({\n  name: \"TooltipContentElement\",\n  inheritAttrs: false,\n  setup(_props, { attrs }) {\n    const rootContext = injectTooltipRootContext()\n    const content = inject(ContentChildrenKey)!\n    const contentIdProp = inject(ContentIdKey, undefined)\n\n    return () => {\n      const { dir: _dir, style, id: _id, ...rest } = attrs\n      const ariaLabel = content.ariaLabel() as string | undefined\n      const contentId = contentIdProp?.value ?? (rootContext.contentId || undefined)\n      return h(\n        \"div\",\n        {\n          role: ariaLabel ? undefined : \"tooltip\",\n          id: ariaLabel ? undefined : contentId,\n          ...rest,\n          style: withRadixVariableNames(style, \"tooltip\"),\n        },\n        [\n          content.render(),\n          ariaLabel ? h(\"span\", { id: contentId, role: \"tooltip\", style: VISUALLY_HIDDEN_STYLE }, ariaLabel) : null,\n        ],\n      )\n    }\n  },\n}))\n\nconst sideProp = String as PropType<TooltipSide>\nconst alignProp = String as PropType<TooltipAlign>\nconst gutterSizeProp = { type: String as PropType<TooltipGutterSize>, default: \"md\" }\nconst maxWidthProp = { type: [Number, String] as PropType<number | \"none\">, default: 300 }\n\n/** Low-level content (`Tooltip.Content` in React). `class` lands on the tooltip. */\nexport const TooltipContent = defineComponent({\n  name: \"TooltipContent\",\n  inheritAttrs: false,\n  props: {\n    /** `max-width` of the tooltip; `\"none\"` sizes it to a single line. @default 300 */\n    maxWidth: maxWidthProp,\n    /** Short, 1-3 word tooltips, stylized inversely from normal tooltips. @default false */\n    compact: { type: Boolean, default: false },\n    /** Whether the tooltip content responds to clicks */\n    clickable: { type: Boolean, default: undefined },\n    /** Preferred side of the trigger. @default \"top\" */\n    side: sideProp,\n    /** Distance from the trigger, in pixels. @default 5 */\n    sideOffset: { type: Number, default: 5 },\n    /** Preferred alignment against the trigger. @default \"center\" */\n    align: alignProp,\n    /** Offset from the \"start\" or \"end\" alignment, in pixels. @default 0 */\n    alignOffset: { type: Number, default: 0 },\n    /** Gutter sizing inside the tooltip. @default \"md\" */\n    gutterSize: gutterSizeProp,\n  },\n  setup(props, { slots, attrs }) {\n    provide(ContentChildrenKey, {\n      render: () => slots.default?.(),\n      ariaLabel: () => attrs[\"aria-label\"],\n    })\n\n    // Radix's content `id` replaces the generated content id while mounted\n    const contentIdProp = inject(ContentIdKey, undefined)\n    if (contentIdProp) {\n      watch(\n        () => attrs.id as string | undefined,\n        (id) => {\n          contentIdProp.value = id || undefined\n        },\n        { immediate: true },\n      )\n      onBeforeUnmount(() => {\n        contentIdProp.value = undefined\n      })\n    }\n\n    return () => {\n      const { class: className, style, \"aria-label\": _ariaLabel, id: _id, ...restProps } = attrs\n\n      return h(RekaTooltipPortal, null, {\n        default: () =>\n          h(\n            RekaTooltipContent,\n            {\n              ...restProps,\n              \"as\": TooltipContentElement,\n              \"side\": props.side,\n              \"align\": props.align,\n              \"class\": [s.Tooltip, className],\n              \"data-compact\": String(props.compact),\n              \"data-clickable\": props.clickable === undefined ? undefined : String(props.clickable),\n              \"data-gutter-size\": props.gutterSize,\n              \"alignOffset\": props.alignOffset,\n              \"sideOffset\": props.sideOffset,\n              \"collisionPadding\": 15,\n              \"hideWhenDetached\": true,\n              \"style\": [style, { maxWidth: toCssLength(props.maxWidth) }],\n              // Escape is handled by the Escape stack in TooltipRoot\n              \"onEscapeKeyDown\": preventDefaultHandler,\n            },\n            // Rendered by TooltipContentElement from the injected slot\n            { default: () => [] },\n          ),\n      })\n    }\n  },\n})\n\nconst isPlainText = (nodes: VNode[]) => nodes.length === 1 && nodes[0]!.type === Text\n\n/**\n * Optional trigger wrapper (`Tooltip.TriggerDecorator` in React) for content\n * that is not accessible or visibly interactive on its own. Plain text is\n * wrapped in a focusable `<span>`; an element child gets the props merged in.\n */\nexport const TooltipTriggerDecorator = defineComponent({\n  name: \"TooltipTriggerDecorator\",\n  inheritAttrs: false,\n  props: {\n    /** Applies `tabindex=\"0\"` to the trigger. @default true */\n    focusable: { type: Boolean, default: true },\n  },\n  setup(props, { slots, attrs }) {\n    return () => {\n      const { class: className, ...restProps } = attrs\n      const slotProps = {\n        ...restProps,\n        class: [s.TriggerDecorator, className],\n        tabindex: props.focusable ? 0 : undefined,\n      }\n      const children = flattenSlot(slots.default?.())\n\n      if (isPlainText(children)) {\n        return h(\"span\", slotProps, String(children[0]!.children ?? \"\"))\n      }\n\n      const child = firstElementChild(children)\n      return child ? mergeSlotProps(child, slotProps) : null\n    }\n  },\n})\n\nconst TooltipComponent = defineComponent({\n  name: \"Tooltip\",\n  inheritAttrs: false,\n  props: {\n    /**\n     * The content of the tooltip (or the `#content` slot). `null` renders no\n     * tooltip.\n     */\n    content: { type: [String, Number, Object] as PropType<string | number | VNode | null>, default: undefined },\n    /** `max-width` of the tooltip; `\"none\"` sizes it to a single line. @default 300 */\n    maxWidth: maxWidthProp,\n    /** Forces the tooltip to remain open or closed */\n    forceOpen: { type: Boolean, default: undefined },\n    /** Delay before the tooltip opens from the first interaction, in milliseconds. @default 150 */\n    openDelay: { type: Number, default: 150 },\n    /** The tooltip has interactive content and stays open while hovered. @default false */\n    interactive: { type: Boolean, default: false },\n    /** Short, 1-3 word tooltips, stylized inversely from normal tooltips. @default false */\n    compact: { type: Boolean, default: false },\n    /** Keeps the tooltip open when the trigger is clicked right after it opened. @default false */\n    preventUnintentionalClickToClose: { type: Boolean, default: undefined },\n    /** Preferred alignment against the trigger. @default \"center\" */\n    align: alignProp,\n    /** Offset from the \"start\" or \"end\" alignment, in pixels. @default 0 */\n    alignOffset: { type: Number, default: 0 },\n    /** Preferred side of the trigger. @default \"top\" */\n    side: sideProp,\n    /** Distance from the trigger, in pixels. @default 5 */\n    sideOffset: { type: Number, default: 5 },\n    /** Gutter sizing inside the tooltip. @default \"md\" */\n    gutterSize: gutterSizeProp,\n    /** Class applied to the tooltip content */\n    contentClassName: String,\n  },\n  emits: {\n    pointerdown: (_event: PointerEvent) => true,\n    click: (_event: MouseEvent) => true,\n  },\n  setup(props, { slots, attrs, emit }) {\n    const visible = ref(false)\n    const temporarilyPreventClickToClose = ref(false)\n\n    watch(temporarilyPreventClickToClose, (prevent, _, onCleanup) => {\n      if (!prevent) return\n      const id = setTimeout(() => {\n        temporarilyPreventClickToClose.value = false\n      }, 400)\n      onCleanup(() => clearTimeout(id))\n    })\n\n    const hasContent = () => !(props.content === null && !slots.content)\n    const forceOpen = () => props.forceOpen ?? (hasContent() ? undefined : false)\n\n    const handleOpenChange = (nextState: boolean) => {\n      // When forceOpen is passed, don't manage internal state\n      if (typeof forceOpen() === \"boolean\") return\n\n      visible.value = nextState\n\n      if (props.preventUnintentionalClickToClose) {\n        temporarilyPreventClickToClose.value = nextState\n      }\n    }\n\n    const maybePreventClickClose = (evt: Event) => {\n      if (props.preventUnintentionalClickToClose && temporarilyPreventClickToClose.value) {\n        // Prevents tooltip listeners from closing\n        evt.preventDefault()\n        evt.stopPropagation()\n      }\n    }\n\n    const onPointerdown = (evt: PointerEvent) => {\n      maybePreventClickClose(evt)\n      emit(\"pointerdown\", evt)\n    }\n\n    const onClick = (evt: MouseEvent) => {\n      maybePreventClickClose(evt)\n      emit(\"click\", evt)\n    }\n\n    return () => {\n      const child = firstElementChild(slots.default?.())\n\n      return h(\n        TooltipRoot,\n        {\n          \"open\": forceOpen() ?? visible.value,\n          \"delayDuration\": props.openDelay,\n          \"onUpdate:open\": handleOpenChange,\n          \"disableHoverableContent\": !props.interactive,\n        },\n        {\n          default: () => [\n            h(TooltipTrigger, null, {\n              default: () => (child ? mergeSlotProps(child, { ...attrs, onPointerdown, onClick }) : null),\n            }),\n            h(\n              TooltipContent,\n              {\n                maxWidth: props.maxWidth,\n                compact: props.compact,\n                align: props.align,\n                alignOffset: props.alignOffset,\n                side: props.side,\n                sideOffset: props.sideOffset,\n                gutterSize: props.gutterSize,\n                class: props.contentClassName,\n              },\n              { default: () => (slots.content ? slots.content() : props.content) },\n            ),\n          ],\n        },\n      )\n    }\n  },\n})\n\n/**\n * Tooltip for any trigger element (the default slot). Content comes from the\n * `content` prop or the `#content` slot; `null` disables the tooltip.\n */\n// Typed explicitly so the published declaration refers to the parts instead of\n// expanding them (an expanded component type fails consumers' type checks)\nexport const Tooltip: typeof TooltipComponent & {\n  Root: typeof TooltipRoot\n  Content: typeof TooltipContent\n  Trigger: typeof TooltipTrigger\n  TriggerDecorator: typeof TooltipTriggerDecorator\n} = Object.assign(TooltipComponent, {\n  Root: TooltipRoot,\n  Content: TooltipContent,\n  Trigger: TooltipTrigger,\n  TriggerDecorator: TooltipTriggerDecorator,\n})\n\nexport type TooltipProps = InstanceType<typeof TooltipComponent>[\"$props\"]\n"]}

package/dist/es/components/Tooltip/index.js

@@ -0,0 +1,3 @@
+export { CopyTooltip } from "./CopyTooltip.js";
+export { Tooltip, TooltipContent, TooltipRoot, TooltipTrigger, TooltipTriggerDecorator, } from "./Tooltip.js";
+//# sourceMappingURL=index.js.map

package/dist/es/components/Tooltip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAyB,MAAM,kBAAkB,CAAA;AACrE,OAAO,EACL,OAAO,EACP,cAAc,EACd,WAAW,EACX,cAAc,EACd,uBAAuB,GAKxB,MAAM,cAAc,CAAA","sourcesContent":["export { CopyTooltip, type CopyTooltipProps } from \"./CopyTooltip.js\"\nexport {\n  Tooltip,\n  TooltipContent,\n  TooltipRoot,\n  TooltipTrigger,\n  TooltipTriggerDecorator,\n  type TooltipAlign,\n  type TooltipGutterSize,\n  type TooltipProps,\n  type TooltipSide,\n} from \"./Tooltip.js\"\n"]}

package/dist/es/components/Tooltip/slot.js

@@ -0,0 +1,87 @@
+import { Comment, Fragment, Text, cloneVNode } from "vue";
+import { isDev } from "../../lib/environment.js";
+const isHandler = (key) => /^on[A-Z]/.test(key);
+const toHandlers = (value) => value == null ? [] : Array.isArray(value) ? value.flatMap(toHandlers) : [value];
+/**
+ * Radix's `composeEventHandlers`: runs the caller's handler(s), then `ours`
+ * unless one of them called `preventDefault()`.
+ */
+export const composeEventHandlers = (theirs, ours) => (event) => {
+    for (const handler of toHandlers(theirs))
+        handler(event);
+    if (!event.defaultPrevented)
+        ours(event);
+};
+const isWhitespaceText = (node) => node.type === Text && !String(node.children ?? "").trim();
+const flatten = (nodes, out) => {
+    for (const node of nodes) {
+        if (node == null || typeof node === "boolean")
+            continue;
+        if (Array.isArray(node))
+            flatten(node, out);
+        else if (typeof node !== "object")
+            out.push({ type: Text, children: String(node) });
+        else if (node.type === Fragment && Array.isArray(node.children))
+            flatten(node.children, out);
+        else if (node.type !== Comment && !isWhitespaceText(node))
+            out.push(node);
+    }
+    return out;
+};
+/** Slot content without fragments, comments and whitespace-only text. */
+export const flattenSlot = (nodes) => flatten(nodes ?? [], []);
+/**
+ * The element a Radix slot clones: the first child, when it is an element or
+ * a component. React's Slot throws for a text child (radix-ui 1.8); this
+ * renders nothing instead and warns in development.
+ */
+export const firstElementChild = (nodes) => {
+    const [first] = flattenSlot(nodes);
+    if (first?.type !== Text)
+        return first;
+    if (isDev) {
+        // eslint-disable-next-line no-console
+        console.warn("[plexui] Slot failed to slot onto its children. Expected a single element or component child, not text.");
+    }
+    return undefined;
+};
+/** Radix's `concatAriaDescribedby`: the ids of every value, once each, in order. */
+export const concatAriaDescribedby = (...values) => {
+    const ids = new Set();
+    for (const value of values) {
+        if (typeof value !== "string")
+            continue;
+        for (const id of value.trim().split(/\s+/)) {
+            if (id)
+                ids.add(id);
+        }
+    }
+    return ids.size > 0 ? Array.from(ids).join(" ") : undefined;
+};
+/**
+ * Clones `child` with `slotProps` merged in the way Radix's Slot does it: the
+ * child's own props win, classes are joined (slot first), styles are merged
+ * (child last), `aria-describedby` ids are joined (child first, radix-ui 1.8)
+ * and handlers both run, the child's first.
+ */
+export const mergeSlotProps = (child, slotProps) => {
+    const merged = { ...slotProps };
+    for (const [key, childValue] of Object.entries(child.props ?? {})) {
+        const slotValue = slotProps[key];
+        if (isHandler(key) && slotValue != null && childValue != null) {
+            merged[key] = [...toHandlers(childValue), ...toHandlers(slotValue)];
+        }
+        else if (key === "class" || key === "style") {
+            merged[key] = [slotValue, childValue];
+        }
+        else if (key === "aria-describedby") {
+            merged[key] = concatAriaDescribedby(childValue, slotValue);
+        }
+        else {
+            merged[key] = childValue;
+        }
+    }
+    // Start from empty props so the child's own values are not merged twice
+    return cloneVNode({ ...child, props: {} }, merged);
+};
+//# sourceMappingURL=slot.js.map

package/dist/es/components/Tooltip/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../../../src/components/Tooltip/slot.ts"],"names":[],"mappings":"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","sourcesContent":["import { Comment, Fragment, Text, cloneVNode, type VNode, type VNodeArrayChildren } from \"vue\"\nimport { isDev } from \"../../lib/environment.js\"\n\n// Internal: Radix's `asChild` / `Slot` merge for slot vnodes, shared by the\n// Tooltip and Popover triggers. Reka's slot merges the other way round (its\n// handlers run first and cannot be cancelled), so the triggers merge their\n// props onto the child themselves before Reka's parts see it.\n\ntype Handler = (...args: never[]) => unknown\ntype Props = Record<string, unknown>\n\nconst isHandler = (key: string) => /^on[A-Z]/.test(key)\n\nconst toHandlers = (value: unknown): Handler[] =>\n  value == null ? [] : Array.isArray(value) ? value.flatMap(toHandlers) : [value as Handler]\n\n/**\n * Radix's `composeEventHandlers`: runs the caller's handler(s), then `ours`\n * unless one of them called `preventDefault()`.\n */\nexport const composeEventHandlers =\n  <E extends Event>(theirs: unknown, ours: (event: E) => void) =>\n  (event: E) => {\n    for (const handler of toHandlers(theirs)) (handler as (event: E) => unknown)(event)\n    if (!event.defaultPrevented) ours(event)\n  }\n\nconst isWhitespaceText = (node: VNode) => node.type === Text && !String(node.children ?? \"\").trim()\n\nconst flatten = (nodes: VNodeArrayChildren, out: VNode[]) => {\n  for (const node of nodes) {\n    if (node == null || typeof node === \"boolean\") continue\n    if (Array.isArray(node)) flatten(node, out)\n    else if (typeof node !== \"object\") out.push({ type: Text, children: String(node) } as VNode)\n    else if (node.type === Fragment && Array.isArray(node.children)) flatten(node.children, out)\n    else if (node.type !== Comment && !isWhitespaceText(node)) out.push(node)\n  }\n  return out\n}\n\n/** Slot content without fragments, comments and whitespace-only text. */\nexport const flattenSlot = (nodes: VNodeArrayChildren | undefined) => flatten(nodes ?? [], [])\n\n/**\n * The element a Radix slot clones: the first child, when it is an element or\n * a component. React's Slot throws for a text child (radix-ui 1.8); this\n * renders nothing instead and warns in development.\n */\nexport const firstElementChild = (nodes: VNodeArrayChildren | undefined): VNode | undefined => {\n  const [first] = flattenSlot(nodes)\n  if (first?.type !== Text) return first\n  if (isDev) {\n    // eslint-disable-next-line no-console\n    console.warn(\n      \"[plexui] Slot failed to slot onto its children. Expected a single element or component child, not text.\",\n    )\n  }\n  return undefined\n}\n\n/** Radix's `concatAriaDescribedby`: the ids of every value, once each, in order. */\nexport const concatAriaDescribedby = (...values: unknown[]) => {\n  const ids = new Set<string>()\n  for (const value of values) {\n    if (typeof value !== \"string\") continue\n    for (const id of value.trim().split(/\\s+/)) {\n      if (id) ids.add(id)\n    }\n  }\n  return ids.size > 0 ? Array.from(ids).join(\" \") : undefined\n}\n\n/**\n * Clones `child` with `slotProps` merged in the way Radix's Slot does it: the\n * child's own props win, classes are joined (slot first), styles are merged\n * (child last), `aria-describedby` ids are joined (child first, radix-ui 1.8)\n * and handlers both run, the child's first.\n */\nexport const mergeSlotProps = (child: VNode, slotProps: Props): VNode => {\n  const merged: Props = { ...slotProps }\n\n  for (const [key, childValue] of Object.entries(child.props ?? {})) {\n    const slotValue = slotProps[key]\n\n    if (isHandler(key) && slotValue != null && childValue != null) {\n      merged[key] = [...toHandlers(childValue), ...toHandlers(slotValue)]\n    } else if (key === \"class\" || key === \"style\") {\n      merged[key] = [slotValue, childValue]\n    } else if (key === \"aria-describedby\") {\n      merged[key] = concatAriaDescribedby(childValue, slotValue)\n    } else {\n      merged[key] = childValue\n    }\n  }\n\n  // Start from empty props so the child's own values are not merged twice\n  return cloneVNode({ ...child, props: {} } as VNode, merged)\n}\n"]}

package/dist/es/components/Transition/Animate.js

@@ -0,0 +1,89 @@
+import clsx from "clsx";
+import { defineComponent, h } from "vue";
+import { toCssVariables, toFilterProperty, toMsDurationProperty, toOpacityProperty, toTransformProperty, } from "../../lib/helpers.js";
+import { TransitionGroup } from "./TransitionGroup.js";
+import s from "@plexui/styles/components/Transition/Animate.module.css";
+/** Port of packages/ui/src/components/Transition/Animate.tsx. */
+export const Animate = defineComponent({
+    name: "Animate",
+    props: {
+        /** Determines the tag used by the container and wrapping elements. @default "span" */
+        as: { type: String, default: "span" },
+        /** Determines how new children are added to the children array */
+        insertMethod: String,
+        /** Determines if children should have an enter transition applied during mounting. @default true */
+        preventInitialTransition: { type: Boolean, default: undefined },
+        /** Class applied to the inner TransitionGroup */
+        transitionClassName: String,
+        /** Styles applied to the enter transition */
+        enter: Object,
+        /** Styles applied to the exit transition */
+        exit: Object,
+        /** Styles applied before the enter transition occurs */
+        initial: Object,
+        /** Determines how transition states are positioned. @default "absolute" */
+        transitionPosition: { type: String, default: "absolute" },
+        /** Applies `will-change` to force animating elements to composite layers. Use with caution! */
+        forceCompositeLayer: Boolean,
+    },
+    setup(props, { slots }) {
+        return () => {
+            const { enterTotalDuration, exitTotalDuration, variables } = getAnimationProperties(props);
+            return h(props.as, {
+                "class": clsx("block", props.transitionPosition === "absolute" && "relative"),
+                "data-transition-position": props.transitionPosition,
+                "style": variables,
+            }, [
+                h(TransitionGroup, {
+                    as: props.as,
+                    class: clsx(s.TransitionItem, props.transitionClassName),
+                    enterDuration: enterTotalDuration,
+                    exitDuration: exitTotalDuration,
+                    insertMethod: props.insertMethod,
+                    preventInitialTransition: props.preventInitialTransition,
+                }, slots),
+            ]);
+        };
+    },
+});
+// Keep in sync with default values in Animate.module.css
+const DEFAULT_ENTER_DURATION_MS_EASE = 400;
+const DEFAULT_ENTER_DURATION_MS_CUBIC = 500;
+const DEFAULT_EXIT_DURATION_MS_EASE = 200;
+const DEFAULT_EXIT_DURATION_MS_CUBIC = 300;
+function getAnimationProperties({ initial: initial, enter: enter, exit: exit, forceCompositeLayer, }) {
+    // Dynamically inspect if we're transitioning transform properties, and apply cubic curves and timings as defaults
+    const initialTransform = toTransformProperty(initial);
+    const enterTransform = toTransformProperty(enter);
+    const exitTransform = toTransformProperty(exit);
+    const isCubicTransition = [initialTransform, exitTransform, enterTransform].some((t) => t !== "none");
+    const enterDuration = enter?.duration ??
+        (isCubicTransition ? DEFAULT_ENTER_DURATION_MS_CUBIC : DEFAULT_ENTER_DURATION_MS_EASE);
+    const enterTimingFunction = enter?.timingFunction ?? (isCubicTransition ? "var(--cubic-enter)" : "ease");
+    const exitDuration = exit?.duration ??
+        (isCubicTransition ? DEFAULT_EXIT_DURATION_MS_CUBIC : DEFAULT_EXIT_DURATION_MS_EASE);
+    const exitTimingFunction = exit?.timingFunction ?? (isCubicTransition ? "var(--cubic-exit)" : "ease");
+    // Generate variable overrides from props
+    const variables = toCssVariables({
+        "tg-will-change": forceCompositeLayer ? "transform, opacity" : "auto",
+        "tg-enter-opacity": toOpacityProperty(enter?.opacity ?? 1),
+        "tg-enter-transform": enterTransform,
+        "tg-enter-filter": toFilterProperty(enter),
+        "tg-enter-duration": toMsDurationProperty(enterDuration),
+        "tg-enter-delay": toMsDurationProperty(enter?.delay ?? 0),
+        "tg-enter-timing-function": enterTimingFunction,
+        "tg-exit-opacity": toOpacityProperty(exit?.opacity ?? 0),
+        "tg-exit-transform": exitTransform,
+        "tg-exit-filter": toFilterProperty(exit),
+        "tg-exit-duration": toMsDurationProperty(exitDuration),
+        "tg-exit-delay": toMsDurationProperty(exit?.delay ?? 0),
+        "tg-exit-timing-function": exitTimingFunction,
+        "tg-initial-opacity": toOpacityProperty(initial?.opacity ?? exit?.opacity ?? 0),
+        "tg-initial-transform": initialTransform === "none" ? exitTransform : initialTransform,
+        "tg-initial-filter": toFilterProperty(initial ?? exit ?? {}),
+    });
+    const enterTotalDuration = (enter?.delay ?? 0) + enterDuration;
+    const exitTotalDuration = (exit?.delay ?? 0) + exitDuration;
+    return { enterTotalDuration, exitTotalDuration, variables };
+}
+//# sourceMappingURL=Animate.js.map

package/dist/es/components/Transition/Animate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Animate.js","sourceRoot":"","sources":["../../../../src/components/Transition/Animate.ts"],"names":[],"mappings":"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","sourcesContent":["import clsx from \"clsx\"\nimport { defineComponent, h, type PropType } from \"vue\"\nimport {\n  toCssVariables,\n  toFilterProperty,\n  toMsDurationProperty,\n  toOpacityProperty,\n  toTransformProperty,\n} from \"../../lib/helpers.js\"\nimport type { InitialTransitionDefinition, InsertMethod, TransitionDefinition } from \"./shared.js\"\nimport { TransitionGroup } from \"./TransitionGroup.js\"\nimport s from \"@plexui/styles/components/Transition/Animate.module.css\"\n\ntype AnimationOptions = {\n  initial?: InitialTransitionDefinition\n  enter?: TransitionDefinition\n  exit?: TransitionDefinition\n  forceCompositeLayer?: boolean\n}\n\n/** Port of packages/ui/src/components/Transition/Animate.tsx. */\nexport const Animate = defineComponent({\n  name: \"Animate\",\n  props: {\n    /** Determines the tag used by the container and wrapping elements. @default \"span\" */\n    as: { type: String as PropType<\"div\" | \"span\">, default: \"span\" },\n    /** Determines how new children are added to the children array */\n    insertMethod: String as PropType<InsertMethod>,\n    /** Determines if children should have an enter transition applied during mounting. @default true */\n    preventInitialTransition: { type: Boolean, default: undefined },\n    /** Class applied to the inner TransitionGroup */\n    transitionClassName: String,\n    /** Styles applied to the enter transition */\n    enter: Object as PropType<TransitionDefinition>,\n    /** Styles applied to the exit transition */\n    exit: Object as PropType<TransitionDefinition>,\n    /** Styles applied before the enter transition occurs */\n    initial: Object as PropType<InitialTransitionDefinition>,\n    /** Determines how transition states are positioned. @default \"absolute\" */\n    transitionPosition: { type: String as PropType<\"absolute\" | \"static\">, default: \"absolute\" },\n    /** Applies `will-change` to force animating elements to composite layers. Use with caution! */\n    forceCompositeLayer: Boolean,\n  },\n  setup(props, { slots }) {\n    return () => {\n      const { enterTotalDuration, exitTotalDuration, variables } = getAnimationProperties(props)\n      return h(\n        props.as,\n        {\n          \"class\": clsx(\"block\", props.transitionPosition === \"absolute\" && \"relative\"),\n          \"data-transition-position\": props.transitionPosition,\n          \"style\": variables,\n        },\n        [\n          h(\n            TransitionGroup,\n            {\n              as: props.as,\n              class: clsx(s.TransitionItem, props.transitionClassName),\n              enterDuration: enterTotalDuration,\n              exitDuration: exitTotalDuration,\n              insertMethod: props.insertMethod,\n              preventInitialTransition: props.preventInitialTransition,\n            },\n            slots,\n          ),\n        ],\n      )\n    }\n  },\n})\n\n// Keep in sync with default values in Animate.module.css\nconst DEFAULT_ENTER_DURATION_MS_EASE = 400\nconst DEFAULT_ENTER_DURATION_MS_CUBIC = 500\nconst DEFAULT_EXIT_DURATION_MS_EASE = 200\nconst DEFAULT_EXIT_DURATION_MS_CUBIC = 300\n\nfunction getAnimationProperties({\n  initial: initial,\n  enter: enter,\n  exit: exit,\n  forceCompositeLayer,\n}: AnimationOptions): {\n  enterTotalDuration: number\n  exitTotalDuration: number\n  variables: Record<string, string>\n} {\n  // Dynamically inspect if we're transitioning transform properties, and apply cubic curves and timings as defaults\n  const initialTransform = toTransformProperty(initial)\n  const enterTransform = toTransformProperty(enter)\n  const exitTransform = toTransformProperty(exit)\n  const isCubicTransition = [initialTransform, exitTransform, enterTransform].some(\n    (t) => t !== \"none\",\n  )\n  const enterDuration =\n    enter?.duration ??\n    (isCubicTransition ? DEFAULT_ENTER_DURATION_MS_CUBIC : DEFAULT_ENTER_DURATION_MS_EASE)\n  const enterTimingFunction =\n    enter?.timingFunction ?? (isCubicTransition ? \"var(--cubic-enter)\" : \"ease\")\n  const exitDuration =\n    exit?.duration ??\n    (isCubicTransition ? DEFAULT_EXIT_DURATION_MS_CUBIC : DEFAULT_EXIT_DURATION_MS_EASE)\n  const exitTimingFunction =\n    exit?.timingFunction ?? (isCubicTransition ? \"var(--cubic-exit)\" : \"ease\")\n\n  // Generate variable overrides from props\n  const variables = toCssVariables({\n    \"tg-will-change\": forceCompositeLayer ? \"transform, opacity\" : \"auto\",\n    \"tg-enter-opacity\": toOpacityProperty(enter?.opacity ?? 1),\n    \"tg-enter-transform\": enterTransform,\n    \"tg-enter-filter\": toFilterProperty(enter),\n    \"tg-enter-duration\": toMsDurationProperty(enterDuration),\n    \"tg-enter-delay\": toMsDurationProperty(enter?.delay ?? 0),\n    \"tg-enter-timing-function\": enterTimingFunction,\n    \"tg-exit-opacity\": toOpacityProperty(exit?.opacity ?? 0),\n    \"tg-exit-transform\": exitTransform,\n    \"tg-exit-filter\": toFilterProperty(exit),\n    \"tg-exit-duration\": toMsDurationProperty(exitDuration),\n    \"tg-exit-delay\": toMsDurationProperty(exit?.delay ?? 0),\n    \"tg-exit-timing-function\": exitTimingFunction,\n    \"tg-initial-opacity\": toOpacityProperty(initial?.opacity ?? exit?.opacity ?? 0),\n    \"tg-initial-transform\": initialTransform === \"none\" ? exitTransform : initialTransform,\n    \"tg-initial-filter\": toFilterProperty(initial ?? exit ?? {}),\n  } satisfies Record<string, string>)\n\n  const enterTotalDuration = (enter?.delay ?? 0) + enterDuration\n  const exitTotalDuration = (exit?.delay ?? 0) + exitDuration\n\n  return { enterTotalDuration, exitTotalDuration, variables }\n}\n\nexport type AnimateProps = InstanceType<typeof Animate>[\"$props\"]\n"]}

package/dist/es/components/Transition/AnimateLayout.js

@@ -0,0 +1,201 @@
+import clsx from "clsx";
+import { defineComponent, h, ref } from "vue";
+import { toCssVariables, toFilterProperty, toMsDurationProperty, toOpacityProperty, toTransformProperty, waitForAnimationFrame, } from "../../lib/helpers.js";
+import { TransitionGroup } from "./TransitionGroup.js";
+import s from "@plexui/styles/components/Transition/AnimateLayout.module.css";
+/** Port of packages/ui/src/components/Transition/AnimateLayout.tsx. */
+export const AnimateLayout = defineComponent({
+    name: "AnimateLayout",
+    props: {
+        as: { type: String, default: "span" },
+        insertMethod: String,
+        /** An initial height animation will almost never be correct. Consider carefully when overriding. @default true */
+        preventInitialTransition: { type: Boolean, default: true },
+        /** Determines if `overflow: hidden` is applied to the wrapper element */
+        hideOverflow: { type: Boolean, default: false },
+        /** Determines which side of the container the items will pin to during enter/exit. @default "start" */
+        itemAnchor: { type: String, default: "start" },
+        /** Determines which property will be animated during transitions. @default "height" */
+        dimension: { type: String, default: "height" },
+        layoutEnter: Object,
+        layoutExit: Object,
+        layoutMove: Object,
+        enter: Object,
+        exit: Object,
+        initial: Object,
+        /** Class applied to the inner TransitionGroup */
+        transitionClassName: String,
+        forceCompositeLayer: Boolean,
+    },
+    setup(props, { slots }) {
+        const containerRef = ref(null);
+        let captain = null;
+        let exitTimestamp = null;
+        const handleEnter = (element) => {
+            const container = containerRef.value;
+            if (!container)
+                return;
+            // If handleExit() was called >50ms ago, consider this a "move" and don't touch "interrupted" state
+            const justExited = exitTimestamp && Date.now() - exitTimestamp < 50;
+            const anotherCaptain = !!captain;
+            // Look at me, I'm the captain now
+            captain = element;
+            // Recent exits are a near guarantee we are "moving" states
+            container.dataset.direction = justExited || anotherCaptain ? "move" : "in";
+            // If we just exited, don't touch the interrupted state. Exit just set it with the correct state of things
+            if (!justExited) {
+                container.dataset.interrupted = String(!!container.style[props.dimension]);
+            }
+            const clientRect = container.getBoundingClientRect();
+            container.style[props.dimension] = `${clientRect[props.dimension]}px`;
+        };
+        const handleEnterActive = (element) => {
+            const container = containerRef.value;
+            // ~Impossible to not be the captain at this point, but check anyway.
+            if (!container || captain !== element)
+                return;
+            // IMPORTANT: Use clientHeight/clientWidth to measure children, in case they have scale() applied
+            const value = props.dimension === "width" ? element.clientWidth : element.clientHeight;
+            container.style[props.dimension] = `${value}px`;
+        };
+        const handleEnterComplete = (element) => {
+            const container = containerRef.value;
+            // Wait for the next tick, to ensure `[data-entering*]` state is cleared from the DOM
+            waitForAnimationFrame(() => {
+                if (!container || captain !== element)
+                    return;
+                // Restore natural height to the DOM node
+                container.style[props.dimension] = "";
+            });
+        };
+        const handleExit = (element) => {
+            const container = containerRef.value;
+            const amICaptain = !captain || captain === element;
+            if (!container || !amICaptain)
+                return;
+            // o7
+            captain = null;
+            exitTimestamp = Date.now();
+            container.dataset.direction = "out";
+            container.dataset.interrupted = String(!!container.style[props.dimension]);
+            const clientRect = container.getBoundingClientRect();
+            container.style[props.dimension] = `${clientRect[props.dimension]}px`;
+        };
+        const handleExitActive = () => {
+            const container = containerRef.value;
+            // If another component has become the captain, exit early
+            if (!container || captain)
+                return;
+            // Animate to zero layout
+            container.style[props.dimension] = "0";
+        };
+        const handleExitComplete = () => {
+            // Wait for the next tick, to ensure `[data-exiting*]` state is cleared from the DOM
+            waitForAnimationFrame(() => {
+                const container = containerRef.value;
+                if (!container || captain)
+                    return;
+                // Restore natural height to the DOM node
+                container.style[props.dimension] = "";
+            });
+        };
+        return () => {
+            const { enterTotalDuration, exitTotalDuration, variables } = getAnimationProperties(props);
+            return h(props.as, {
+                "ref": containerRef,
+                "class": s.Layout,
+                "style": variables,
+                "data-item-anchor": props.itemAnchor,
+                "data-clip": props.hideOverflow,
+                "data-dimension": props.dimension,
+            }, [
+                h(TransitionGroup, {
+                    as: props.as,
+                    class: clsx(s.TransitionItem, props.transitionClassName),
+                    insertMethod: props.insertMethod,
+                    enterDuration: enterTotalDuration,
+                    exitDuration: exitTotalDuration,
+                    preventInitialTransition: props.preventInitialTransition,
+                    onEnter: handleEnter,
+                    onEnterActive: handleEnterActive,
+                    onEnterComplete: handleEnterComplete,
+                    onExit: handleExit,
+                    onExitActive: handleExitActive,
+                    onExitComplete: handleExitComplete,
+                }, slots),
+            ]);
+        };
+    },
+});
+// Keep in sync with default values in AnimateLayout.module.css
+const DEFAULT_LAYOUT_ENTER_DURATION_MS = 300;
+const DEFAULT_LAYOUT_ENTER_DELAY_MS = 0;
+const DEFAULT_LAYOUT_EXIT_DURATION_MS = 300;
+const DEFAULT_LAYOUT_EXIT_DELAY_MS = 0;
+const DEFAULT_LAYOUT_MOVE_DURATION_MS = 300;
+const DEFAULT_LAYOUT_MOVE_DELAY_MS = 0;
+const DEFAULT_ENTER_DURATION_MS_EASE = 300;
+const DEFAULT_ENTER_DURATION_MS_CUBIC = 300;
+const DEFAULT_ENTER_DELAY_MS = 100;
+const DEFAULT_EXIT_DURATION_MS_EASE = 200;
+const DEFAULT_EXIT_DURATION_MS_CUBIC = 200;
+const DEFAULT_EXIT_DELAY_MS = 0;
+function getAnimationProperties({ initial, enter, exit, forceCompositeLayer, layoutEnter, layoutExit, layoutMove, }) {
+    // Dynamically inspect if we're transitioning transform properties, and apply cubic curves and timings as defaults
+    const initialTransform = toTransformProperty(initial);
+    const enterTransform = toTransformProperty(enter);
+    const exitTransform = toTransformProperty(exit);
+    const isCubicTransition = [initialTransform, exitTransform, enterTransform].some((t) => t !== "none");
+    const enterDuration = enter?.duration ??
+        (isCubicTransition ? DEFAULT_ENTER_DURATION_MS_CUBIC : DEFAULT_ENTER_DURATION_MS_EASE);
+    const enterTimingFunction = enter?.timingFunction ?? (isCubicTransition ? "var(--cubic-enter)" : "ease");
+    const exitDuration = exit?.duration ??
+        (isCubicTransition ? DEFAULT_EXIT_DURATION_MS_CUBIC : DEFAULT_EXIT_DURATION_MS_EASE);
+    const exitTimingFunction = exit?.timingFunction ?? (isCubicTransition ? "var(--cubic-exit)" : "ease");
+    // Generate variable overrides from props
+    const variables = toCssVariables({
+        "tg-will-change": forceCompositeLayer ? "transform, opacity" : "auto",
+        "tg-enter-opacity": toOpacityProperty(enter?.opacity ?? 1),
+        "tg-enter-transform": enterTransform,
+        "tg-enter-filter": toFilterProperty(enter),
+        "tg-enter-duration": toMsDurationProperty(enterDuration),
+        "tg-enter-delay": toMsDurationProperty(enter?.delay ?? DEFAULT_ENTER_DELAY_MS),
+        "tg-enter-timing-function": enterTimingFunction,
+        "tg-exit-opacity": toOpacityProperty(exit?.opacity ?? 0),
+        "tg-exit-transform": exitTransform,
+        "tg-exit-filter": toFilterProperty(exit ?? {}),
+        "tg-exit-duration": toMsDurationProperty(exitDuration),
+        "tg-exit-delay": toMsDurationProperty(exit?.delay ?? DEFAULT_EXIT_DELAY_MS),
+        "tg-exit-timing-function": exitTimingFunction,
+        "tg-initial-opacity": toOpacityProperty(initial?.opacity ?? exit?.opacity ?? 0),
+        "tg-initial-transform": initialTransform === "none" ? exitTransform : initialTransform,
+        "tg-initial-filter": toFilterProperty(initial ?? exit ?? {}),
+        "tg-layout-enter-duration": toMsDurationProperty(layoutEnter?.duration ?? DEFAULT_LAYOUT_ENTER_DURATION_MS),
+        "tg-layout-enter-delay": toMsDurationProperty(layoutEnter?.delay ?? DEFAULT_LAYOUT_ENTER_DELAY_MS),
+        "tg-layout-enter-timing-function": layoutEnter?.timingFunction ?? "var(--cubic-move)",
+        "tg-layout-exit-duration": toMsDurationProperty(layoutExit?.duration ?? DEFAULT_LAYOUT_EXIT_DURATION_MS),
+        "tg-layout-exit-delay": toMsDurationProperty(layoutExit?.delay ?? DEFAULT_LAYOUT_EXIT_DELAY_MS),
+        "tg-layout-exit-timing-function": layoutExit?.timingFunction ?? "var(--cubic-move)",
+        "tg-layout-move-duration": toMsDurationProperty(layoutMove?.duration ?? DEFAULT_LAYOUT_MOVE_DURATION_MS),
+        "tg-layout-move-delay": toMsDurationProperty(layoutMove?.delay ?? DEFAULT_LAYOUT_MOVE_DELAY_MS),
+        "tg-layout-move-timing-function": layoutMove?.timingFunction ?? "var(--cubic-move)",
+    });
+    const enterTotalDuration = (enter?.delay ?? DEFAULT_ENTER_DELAY_MS) + (enterDuration ?? DEFAULT_ENTER_DURATION_MS_EASE);
+    const exitTotalDuration = (exit?.delay ?? DEFAULT_EXIT_DELAY_MS) + (exitDuration ?? DEFAULT_EXIT_DURATION_MS_EASE);
+    const layoutEnterTotalDuration = (layoutEnter?.delay ?? DEFAULT_LAYOUT_ENTER_DELAY_MS) +
+        (layoutEnter?.duration ?? DEFAULT_LAYOUT_ENTER_DURATION_MS);
+    const layoutExitTotalDuration = (layoutExit?.delay ?? DEFAULT_LAYOUT_EXIT_DELAY_MS) +
+        (layoutExit?.duration ?? DEFAULT_LAYOUT_EXIT_DURATION_MS);
+    const layoutMoveTotalDuration = (layoutMove?.delay ?? DEFAULT_LAYOUT_MOVE_DELAY_MS) +
+        (layoutMove?.duration ?? DEFAULT_LAYOUT_MOVE_DURATION_MS);
+    return {
+        // In order for us to release layout dimensions (e.g., height) to the natural DOM state,
+        // we must ensure the behaviors from the TransitionGroup callbacks are synced with the outer layout `transitions`.
+        // Setting TransitionGroup timing to the max of these durations is the simplest approach.
+        // In practice, these should only vary by about 50-200ms at most; imperceivable to end-users.
+        enterTotalDuration: Math.max(enterTotalDuration, layoutEnterTotalDuration, layoutMoveTotalDuration),
+        exitTotalDuration: Math.max(exitTotalDuration, layoutExitTotalDuration, layoutMoveTotalDuration),
+        variables,
+    };
+}
+//# sourceMappingURL=AnimateLayout.js.map

package/dist/es/components/Transition/AnimateLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimateLayout.js","sourceRoot":"","sources":["../../../../src/components/Transition/AnimateLayout.ts"],"names":[],"mappings":"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","sourcesContent":["import clsx from \"clsx\"\nimport { defineComponent, h, ref, type PropType } from \"vue\"\nimport {\n  toCssVariables,\n  toFilterProperty,\n  toMsDurationProperty,\n  toOpacityProperty,\n  toTransformProperty,\n  waitForAnimationFrame,\n} from \"../../lib/helpers.js\"\nimport type {\n  InitialTransitionDefinition,\n  InsertMethod,\n  LayoutTransitionDefinition,\n  TransitionDefinition,\n  TransitionElement,\n} from \"./shared.js\"\nimport { TransitionGroup } from \"./TransitionGroup.js\"\nimport s from \"@plexui/styles/components/Transition/AnimateLayout.module.css\"\n\ntype AnimationOptions = {\n  initial?: InitialTransitionDefinition\n  enter?: TransitionDefinition\n  exit?: TransitionDefinition\n  forceCompositeLayer?: boolean\n  layoutEnter?: LayoutTransitionDefinition\n  layoutExit?: LayoutTransitionDefinition\n  layoutMove?: LayoutTransitionDefinition\n}\n\n/** Port of packages/ui/src/components/Transition/AnimateLayout.tsx. */\nexport const AnimateLayout = defineComponent({\n  name: \"AnimateLayout\",\n  props: {\n    as: { type: String as PropType<\"div\" | \"span\">, default: \"span\" },\n    insertMethod: String as PropType<InsertMethod>,\n    /** An initial height animation will almost never be correct. Consider carefully when overriding. @default true */\n    preventInitialTransition: { type: Boolean, default: true },\n    /** Determines if `overflow: hidden` is applied to the wrapper element */\n    hideOverflow: { type: Boolean, default: false },\n    /** Determines which side of the container the items will pin to during enter/exit. @default \"start\" */\n    itemAnchor: { type: String as PropType<\"start\" | \"end\">, default: \"start\" },\n    /** Determines which property will be animated during transitions. @default \"height\" */\n    dimension: { type: String as PropType<\"width\" | \"height\">, default: \"height\" },\n    layoutEnter: Object as PropType<LayoutTransitionDefinition>,\n    layoutExit: Object as PropType<LayoutTransitionDefinition>,\n    layoutMove: Object as PropType<LayoutTransitionDefinition>,\n    enter: Object as PropType<TransitionDefinition>,\n    exit: Object as PropType<TransitionDefinition>,\n    initial: Object as PropType<InitialTransitionDefinition>,\n    /** Class applied to the inner TransitionGroup */\n    transitionClassName: String,\n    forceCompositeLayer: Boolean,\n  },\n  setup(props, { slots }) {\n    const containerRef = ref<HTMLElement | null>(null)\n    let captain: TransitionElement | null = null\n    let exitTimestamp: number | null = null\n\n    const handleEnter = (element: TransitionElement) => {\n      const container = containerRef.value\n      if (!container) return\n\n      // If handleExit() was called >50ms ago, consider this a \"move\" and don't touch \"interrupted\" state\n      const justExited = exitTimestamp && Date.now() - exitTimestamp < 50\n      const anotherCaptain = !!captain\n      // Look at me, I'm the captain now\n      captain = element\n\n      // Recent exits are a near guarantee we are \"moving\" states\n      container.dataset.direction = justExited || anotherCaptain ? \"move\" : \"in\"\n\n      // If we just exited, don't touch the interrupted state. Exit just set it with the correct state of things\n      if (!justExited) {\n        container.dataset.interrupted = String(!!container.style[props.dimension])\n      }\n\n      const clientRect = container.getBoundingClientRect()\n      container.style[props.dimension] = `${clientRect[props.dimension]}px`\n    }\n\n    const handleEnterActive = (element: TransitionElement) => {\n      const container = containerRef.value\n      // ~Impossible to not be the captain at this point, but check anyway.\n      if (!container || captain !== element) return\n\n      // IMPORTANT: Use clientHeight/clientWidth to measure children, in case they have scale() applied\n      const value = props.dimension === \"width\" ? element.clientWidth : element.clientHeight\n      container.style[props.dimension] = `${value}px`\n    }\n\n    const handleEnterComplete = (element: TransitionElement) => {\n      const container = containerRef.value\n      // Wait for the next tick, to ensure `[data-entering*]` state is cleared from the DOM\n      waitForAnimationFrame(() => {\n        if (!container || captain !== element) return\n        // Restore natural height to the DOM node\n        container.style[props.dimension] = \"\"\n      })\n    }\n\n    const handleExit = (element: TransitionElement) => {\n      const container = containerRef.value\n      const amICaptain = !captain || captain === element\n      if (!container || !amICaptain) return\n\n      // o7\n      captain = null\n      exitTimestamp = Date.now()\n\n      container.dataset.direction = \"out\"\n      container.dataset.interrupted = String(!!container.style[props.dimension])\n\n      const clientRect = container.getBoundingClientRect()\n      container.style[props.dimension] = `${clientRect[props.dimension]}px`\n    }\n\n    const handleExitActive = () => {\n      const container = containerRef.value\n      // If another component has become the captain, exit early\n      if (!container || captain) return\n      // Animate to zero layout\n      container.style[props.dimension] = \"0\"\n    }\n\n    const handleExitComplete = () => {\n      // Wait for the next tick, to ensure `[data-exiting*]` state is cleared from the DOM\n      waitForAnimationFrame(() => {\n        const container = containerRef.value\n        if (!container || captain) return\n        // Restore natural height to the DOM node\n        container.style[props.dimension] = \"\"\n      })\n    }\n\n    return () => {\n      const { enterTotalDuration, exitTotalDuration, variables } = getAnimationProperties(props)\n      return h(\n        props.as,\n        {\n          \"ref\": containerRef,\n          \"class\": s.Layout,\n          \"style\": variables,\n          \"data-item-anchor\": props.itemAnchor,\n          \"data-clip\": props.hideOverflow,\n          \"data-dimension\": props.dimension,\n        },\n        [\n          h(\n            TransitionGroup,\n            {\n              as: props.as,\n              class: clsx(s.TransitionItem, props.transitionClassName),\n              insertMethod: props.insertMethod,\n              enterDuration: enterTotalDuration,\n              exitDuration: exitTotalDuration,\n              preventInitialTransition: props.preventInitialTransition,\n              onEnter: handleEnter,\n              onEnterActive: handleEnterActive,\n              onEnterComplete: handleEnterComplete,\n              onExit: handleExit,\n              onExitActive: handleExitActive,\n              onExitComplete: handleExitComplete,\n            },\n            slots,\n          ),\n        ],\n      )\n    }\n  },\n})\n\n// Keep in sync with default values in AnimateLayout.module.css\nconst DEFAULT_LAYOUT_ENTER_DURATION_MS = 300\nconst DEFAULT_LAYOUT_ENTER_DELAY_MS = 0\nconst DEFAULT_LAYOUT_EXIT_DURATION_MS = 300\nconst DEFAULT_LAYOUT_EXIT_DELAY_MS = 0\nconst DEFAULT_LAYOUT_MOVE_DURATION_MS = 300\nconst DEFAULT_LAYOUT_MOVE_DELAY_MS = 0\nconst DEFAULT_ENTER_DURATION_MS_EASE = 300\nconst DEFAULT_ENTER_DURATION_MS_CUBIC = 300\nconst DEFAULT_ENTER_DELAY_MS = 100\nconst DEFAULT_EXIT_DURATION_MS_EASE = 200\nconst DEFAULT_EXIT_DURATION_MS_CUBIC = 200\nconst DEFAULT_EXIT_DELAY_MS = 0\n\nfunction getAnimationProperties({\n  initial,\n  enter,\n  exit,\n  forceCompositeLayer,\n  layoutEnter,\n  layoutExit,\n  layoutMove,\n}: AnimationOptions): {\n  enterTotalDuration: number\n  exitTotalDuration: number\n  variables: Record<string, string>\n} {\n  // Dynamically inspect if we're transitioning transform properties, and apply cubic curves and timings as defaults\n  const initialTransform = toTransformProperty(initial)\n  const enterTransform = toTransformProperty(enter)\n  const exitTransform = toTransformProperty(exit)\n  const isCubicTransition = [initialTransform, exitTransform, enterTransform].some(\n    (t) => t !== \"none\",\n  )\n  const enterDuration =\n    enter?.duration ??\n    (isCubicTransition ? DEFAULT_ENTER_DURATION_MS_CUBIC : DEFAULT_ENTER_DURATION_MS_EASE)\n  const enterTimingFunction =\n    enter?.timingFunction ?? (isCubicTransition ? \"var(--cubic-enter)\" : \"ease\")\n  const exitDuration =\n    exit?.duration ??\n    (isCubicTransition ? DEFAULT_EXIT_DURATION_MS_CUBIC : DEFAULT_EXIT_DURATION_MS_EASE)\n  const exitTimingFunction =\n    exit?.timingFunction ?? (isCubicTransition ? \"var(--cubic-exit)\" : \"ease\")\n\n  // Generate variable overrides from props\n  const variables = toCssVariables({\n    \"tg-will-change\": forceCompositeLayer ? \"transform, opacity\" : \"auto\",\n    \"tg-enter-opacity\": toOpacityProperty(enter?.opacity ?? 1),\n    \"tg-enter-transform\": enterTransform,\n    \"tg-enter-filter\": toFilterProperty(enter),\n    \"tg-enter-duration\": toMsDurationProperty(enterDuration),\n    \"tg-enter-delay\": toMsDurationProperty(enter?.delay ?? DEFAULT_ENTER_DELAY_MS),\n    \"tg-enter-timing-function\": enterTimingFunction,\n    \"tg-exit-opacity\": toOpacityProperty(exit?.opacity ?? 0),\n    \"tg-exit-transform\": exitTransform,\n    \"tg-exit-filter\": toFilterProperty(exit ?? {}),\n    \"tg-exit-duration\": toMsDurationProperty(exitDuration),\n    \"tg-exit-delay\": toMsDurationProperty(exit?.delay ?? DEFAULT_EXIT_DELAY_MS),\n    \"tg-exit-timing-function\": exitTimingFunction,\n    \"tg-initial-opacity\": toOpacityProperty(initial?.opacity ?? exit?.opacity ?? 0),\n    \"tg-initial-transform\": initialTransform === \"none\" ? exitTransform : initialTransform,\n    \"tg-initial-filter\": toFilterProperty(initial ?? exit ?? {}),\n    \"tg-layout-enter-duration\": toMsDurationProperty(\n      layoutEnter?.duration ?? DEFAULT_LAYOUT_ENTER_DURATION_MS,\n    ),\n    \"tg-layout-enter-delay\": toMsDurationProperty(\n      layoutEnter?.delay ?? DEFAULT_LAYOUT_ENTER_DELAY_MS,\n    ),\n    \"tg-layout-enter-timing-function\": layoutEnter?.timingFunction ?? \"var(--cubic-move)\",\n    \"tg-layout-exit-duration\": toMsDurationProperty(\n      layoutExit?.duration ?? DEFAULT_LAYOUT_EXIT_DURATION_MS,\n    ),\n    \"tg-layout-exit-delay\": toMsDurationProperty(layoutExit?.delay ?? DEFAULT_LAYOUT_EXIT_DELAY_MS),\n    \"tg-layout-exit-timing-function\": layoutExit?.timingFunction ?? \"var(--cubic-move)\",\n    \"tg-layout-move-duration\": toMsDurationProperty(\n      layoutMove?.duration ?? DEFAULT_LAYOUT_MOVE_DURATION_MS,\n    ),\n    \"tg-layout-move-delay\": toMsDurationProperty(layoutMove?.delay ?? DEFAULT_LAYOUT_MOVE_DELAY_MS),\n    \"tg-layout-move-timing-function\": layoutMove?.timingFunction ?? \"var(--cubic-move)\",\n  } satisfies Record<string, string>)\n\n  const enterTotalDuration =\n    (enter?.delay ?? DEFAULT_ENTER_DELAY_MS) + (enterDuration ?? DEFAULT_ENTER_DURATION_MS_EASE)\n  const exitTotalDuration =\n    (exit?.delay ?? DEFAULT_EXIT_DELAY_MS) + (exitDuration ?? DEFAULT_EXIT_DURATION_MS_EASE)\n  const layoutEnterTotalDuration =\n    (layoutEnter?.delay ?? DEFAULT_LAYOUT_ENTER_DELAY_MS) +\n    (layoutEnter?.duration ?? DEFAULT_LAYOUT_ENTER_DURATION_MS)\n  const layoutExitTotalDuration =\n    (layoutExit?.delay ?? DEFAULT_LAYOUT_EXIT_DELAY_MS) +\n    (layoutExit?.duration ?? DEFAULT_LAYOUT_EXIT_DURATION_MS)\n  const layoutMoveTotalDuration =\n    (layoutMove?.delay ?? DEFAULT_LAYOUT_MOVE_DELAY_MS) +\n    (layoutMove?.duration ?? DEFAULT_LAYOUT_MOVE_DURATION_MS)\n\n  return {\n    // In order for us to release layout dimensions (e.g., height) to the natural DOM state,\n    // we must ensure the behaviors from the TransitionGroup callbacks are synced with the outer layout `transitions`.\n    // Setting TransitionGroup timing to the max of these durations is the simplest approach.\n    // In practice, these should only vary by about 50-200ms at most; imperceivable to end-users.\n    enterTotalDuration: Math.max(\n      enterTotalDuration,\n      layoutEnterTotalDuration,\n      layoutMoveTotalDuration,\n    ),\n    exitTotalDuration: Math.max(\n      exitTotalDuration,\n      layoutExitTotalDuration,\n      layoutMoveTotalDuration,\n    ),\n    variables,\n  }\n}\n\nexport type AnimateLayoutProps = InstanceType<typeof AnimateLayout>[\"$props\"]\n"]}