npm - @plexui/vue - Versions diffs - 0.1.3 → 0.1.5 - Mend

@plexui/vue 0.1.3 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (44) hide show

package/dist/es/components/Dialog/Dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../src/components/Dialog/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n cloneVNode,\n computed,\n createCommentVNode,\n defineComponent,\n h,\n inject,\n onBeforeUnmount,\n onMounted,\n provide,\n ref,\n watch,\n type ComputedRef,\n type HTMLAttributes,\n type InjectionKey,\n type PropType,\n type Ref,\n type VNode,\n} from \"vue\"\nimport {\n DialogContent as RekaDialogContent,\n DialogDescription as RekaDialogDescription,\n DialogOverlay as RekaDialogOverlay,\n DialogPortal as RekaDialogPortal,\n DialogRoot as RekaDialogRoot,\n DialogTitle as RekaDialogTitle,\n injectDialogRootContext,\n useForwardExpose,\n useId,\n} from \"reka-ui\"\nimport { useEscCloseStack } from \"../../composables/useEscCloseStack.js\"\nimport { preventDefaultHandler, toCssVariables } from \"../../lib/helpers.js\"\nimport { dismissableSurfaces, useDeferredPointerDownOutside } from \"../Popover/deferredPointerDownOutside.js\"\nimport { firstElementChild } from \"../Tooltip/slot.js\"\nimport { TransitionGroup } from \"../Transition/index.js\"\nimport s from \"@plexui/styles/components/Dialog/Dialog.module.css\"\n\n// Vue port of packages/ui/src/components/Dialog/Dialog.tsx on Reka UI\n// (the Vue lineage of Radix, same anatomy). Exports are flat (`Dialog`,\n// `DialogTrigger`, ...) because runtime-compiled templates cannot resolve\n// `Dialog.Trigger` from the `components` option.\n//\n// Where Reka differs from Radix (radix-ui 1.8), the port follows Radix:\n// - The content is labelled and described only while a DialogTitle /\n// DialogDescription is mounted.\n// - A press outside (the overlay) closes it on the click that follows\n// (../Popover/deferredPointerDownOutside.ts); the overlay is a dismiss\n// surface.\n// - The portal renders once mounted, so a closed dialog server-renders\n// nothing.\n\ntype DialogContextValue = {\n open: ComputedRef<boolean>\n setOpen: (nextState: boolean) => void\n /** Mounted DialogTitle / DialogDescription parts (Radix's title and description counts) /\n titleCount: Ref<number>\n descriptionCount: Ref<number>\n}\n\nconst DialogContextKey: InjectionKey<DialogContextValue> = Symbol(\"PlexUIDialog\")\n\nconst useDialogContext = () => {\n const context = inject(DialogContextKey, null)\n\n if (!context) {\n throw new Error(\"Dialog compound components must be used inside <Dialog>\")\n }\n\n return context\n}\n\n/* Modal dialog root. Uncontrolled by default; bind `v-model:open` to control it. /\nexport const Dialog = defineComponent({\n name: \"Dialog\",\n props: {\n open: { type: Boolean, default: undefined },\n },\n emits: {\n \"update:open\": (_open: boolean) => true,\n },\n setup(props, { slots, emit }) {\n const internalOpen = ref(false)\n const isOpen = computed(() => props.open ?? internalOpen.value)\n\n const setOpen = (nextState: boolean) => {\n emit(\"update:open\", nextState)\n internalOpen.value = nextState\n }\n\n provide(DialogContextKey, { open: isOpen, setOpen, titleCount: ref(0), descriptionCount: ref(0) })\n\n return () =>\n h(RekaDialogRoot, { \"open\": isOpen.value, \"onUpdate:open\": setOpen }, { default: () => slots.default?.() })\n },\n})\n\n// Trigger and Close render their child with the dialog wiring merged in,\n// like Reka's `asChild` parts, but run the dialog action after the child's\n// own click handlers and skip it when one called preventDefault() (Radix's\n// composeEventHandlers). Reka's parts run first and cannot be cancelled.\n// Attributes the child sets itself win, as with Radix and Reka slots. The\n// child is the first element, also through a forwarded `<slot />`.\nconst withDialogProps = (\n child: VNode \| undefined,\n props: Record<string, unknown>,\n onClick: (event: Event) => void,\n ref?: (el: unknown) => void,\n) => {\n if (!child) return null\n const own = child.props ?? {}\n const extra = Object.fromEntries(Object.entries(props).filter(([key]) => !(key in own)))\n return cloneVNode(child, { ...extra, onClick, ...(ref ? { ref } : {}) }, true)\n}\n\nexport const DialogTrigger = defineComponent({\n name: \"DialogTrigger\",\n setup(_props, { slots }) {\n const rootContext = injectDialogRootContext()\n const { forwardRef, currentElement } = useForwardExpose()\n rootContext.contentId \|\|= useId(undefined, \"reka-dialog-content\")\n // Focus returns here when the dialog closes\n onMounted(() => {\n rootContext.triggerElement.value = currentElement.value\n })\n\n const onClick = (event: Event) => {\n if (!event.defaultPrevented) rootContext.onOpenToggle()\n }\n\n return () => {\n const open = rootContext.open.value\n return withDialogProps(\n firstElementChild(slots.default?.()),\n {\n \"type\": \"button\",\n \"aria-haspopup\": \"dialog\",\n \"aria-expanded\": open \|\| false,\n \"aria-controls\": open ? rootContext.contentId : undefined,\n \"data-state\": open ? \"open\" : \"closed\",\n },\n onClick,\n forwardRef as (el: unknown) => void,\n )\n }\n },\n})\n\nconst CloseIcon = () =>\n h(\"svg\", { \"class\": s.CloseIcon, \"viewBox\": \"0 0 20 20\", \"width\": \"20\", \"height\": \"20\", \"aria-hidden\": \"true\" }, [\n h(\"path\", {\n fill: \"currentColor\",\n d: \"M5.22 5.22a.75.75 0 0 1 1.06 0L10 8.94l3.72-3.72a.75.75 0 1 1 1.06 1.06L11.06 10l3.72 3.72a.75.75 0 1 1-1.06 1.06L10 11.06l-3.72 3.72a.75.75 0 1 1-1.06-1.06L8.94 10 5.22 6.28a.75.75 0 0 1 0-1.06\",\n }),\n ])\n\n/* Overlay and panel. `class` lands on the panel, like `className` in React. /\nexport const DialogContent = defineComponent({\n name: \"DialogContent\",\n inheritAttrs: false,\n props: {\n /* Panel width; numbers are pixels. @default 480 /\n width: { type: [Number, String] as PropType<number \| string>, default: 480 },\n /* Renders the close button in the top corner. @default true /\n showClose: { type: Boolean, default: true },\n /\n Rounder panel and a round close button, for dialogs that sit beside pill controls.\n * @default false\n /\n pill: { type: Boolean, default: false },\n /\n Where the panel sits: centered, near the top, a sheet along the bottom,\n * a full-height panel on the start or end side, or the whole screen.\n * @default \"center\"\n /\n placement: { type: String as PropType<DialogPlacement>, default: \"center\" },\n /* Placement at 640px and below, such as a bottom sheet on phones. @default placement /\n mobilePlacement: String as PropType<Extract<DialogPlacement, \"center\" \| \"bottom\" \| \"fullscreen\">>,\n /* Called when focus moves into the dialog on open; `event.preventDefault()` keeps it for you to place. /\n onOpenAutoFocus: Function as PropType<(event: Event) => void>,\n /* Called when focus returns on close; `event.preventDefault()` keeps it elsewhere. /\n onCloseAutoFocus: Function as PropType<(event: Event) => void>,\n },\n setup(props, { slots, attrs }) {\n const { open, setOpen, titleCount, descriptionCount } = useDialogContext()\n // Radix's root makes the content id; Reka's trigger does, so a dialog\n // without one would render `id=\"\"`\n injectDialogRootContext().contentId \|\|= useId(undefined, \"reka-dialog-content\")\n\n // Escape goes through the shared stack, as in React, so the dialog\n // closes before overlays opened earlier (a forced-open Tooltip)\n useEscCloseStack(open, () => {\n setOpen(false)\n })\n\n // Radix's modal content: a Ctrl+click (macOS right click) does not dismiss\n const outsidePress = useDeferredPointerDownOutside((originalEvent) => {\n if (!originalEvent.ctrlKey) setOpen(false)\n })\n watch(open, (isOpen) => {\n if (!isOpen) outsidePress.reset()\n })\n\n let overlayElement: Element \| undefined\n const setOverlayRef = (instance: unknown) => {\n const el = (instance as { $el?: unknown } \| null)?.$el\n const element = el instanceof Element ? el : undefined\n if (element === overlayElement) return\n if (overlayElement) dismissableSurfaces.delete(overlayElement)\n overlayElement = element\n if (element) dismissableSurfaces.add(element)\n }\n\n const renderDialog = () =>\n h(\"div\", { key: \"dialog\" }, [\n h(RekaDialogOverlay, { class: s.Overlay, ref: setOverlayRef }),\n h(\n RekaDialogContent,\n {\n \"forceMount\": true,\n \"class\": s.Content,\n \"style\": toCssVariables({ \"dialog-width\": props.width }),\n \"data-placement\": props.placement === \"center\" ? undefined : props.placement,\n \"data-mobile-placement\": props.mobilePlacement,\n \"data-pill\": props.pill ? \"\" : undefined,\n \"onOpenAutoFocus\": props.onOpenAutoFocus,\n \"onCloseAutoFocus\": props.onCloseAutoFocus,\n // Radix labels and describes the content only by mounted parts\n ...(titleCount.value > 0 ? {} : { \"aria-labelledby\": undefined }),\n ...(descriptionCount.value > 0 ? {} : { \"aria-describedby\": undefined }),\n \"onEscapeKeyDown\": preventDefaultHandler,\n \"onPointerDownOutside\": outsidePress.onPointerDownOutside,\n \"onFocusOutside\": outsidePress.onFocusOutside,\n },\n {\n default: () => [\n h(\"div\", { class: [s.Panel, attrs.class] }, [\n props.showClose\n ? h(DialogClose, null, {\n default: () => [\n h(\"button\", { \"type\": \"button\", \"class\": s.CloseButton, \"aria-label\": \"Close dialog\" }, [\n h(CloseIcon),\n ]),\n ],\n })\n : null,\n slots.default?.(),\n ]),\n ],\n },\n ),\n ])\n\n return () =>\n h(RekaDialogPortal, null, {\n default: () => [\n h(\n TransitionGroup,\n { class: s.Transition, enterDuration: 250, exitDuration: 150, disableAnimations: true },\n // `open && <div>` in React: closed still renders the empty wrapper\n { default: () => [open.value ? renderDialog() : createCommentVNode()] },\n ),\n ],\n })\n },\n})\n\nexport const DialogHeader = defineComponent({\n name: \"DialogHeader\",\n setup(_props, { slots }) {\n return () => h(\"div\", { class: s.Header }, slots.default?.())\n },\n})\n\n/* The scrolling part between DialogHeader and DialogFooter: with it, only the body scrolls. /\nexport const DialogBody = defineComponent({\n name: \"DialogBody\",\n inheritAttrs: false,\n setup(_props, { slots, attrs }) {\n return () => h(\"div\", { class: [s.Body, attrs.class] }, slots.default?.())\n },\n})\n\nexport const DialogFooter = defineComponent({\n name: \"DialogFooter\",\n setup(_props, { slots }) {\n return () => h(\"div\", { class: s.Footer }, slots.default?.())\n },\n})\n\n/* Counts a mounted part, as Radix's title and description counts do. /\nconst useMountedCount = (count: Ref<number>) => {\n onMounted(() => {\n count.value++\n })\n onBeforeUnmount(() => {\n count.value--\n })\n}\n\nexport const DialogTitle = defineComponent({\n name: \"DialogTitle\",\n setup(_props, { slots }) {\n useMountedCount(useDialogContext().titleCount)\n return () => h(RekaDialogTitle, { class: s.Title }, { default: () => slots.default?.() })\n },\n})\n\nexport const DialogDescription = defineComponent({\n name: \"DialogDescription\",\n setup(_props, { slots }) {\n useMountedCount(useDialogContext().descriptionCount)\n return () => h(RekaDialogDescription, { class: s.Description }, { default: () => slots.default?.() })\n },\n})\n\nexport const DialogClose = defineComponent({\n name: \"DialogClose\",\n setup(_props, { slots }) {\n const rootContext = injectDialogRootContext()\n const onClick = (event: Event) => {\n if (!event.defaultPrevented) rootContext.onOpenChange(false)\n }\n return () => withDialogProps(firstElementChild(slots.default?.()), { type: \"button\" }, onClick)\n },\n})\n\nexport type DialogProps = InstanceType<typeof Dialog>[\"$props\"]\n\nexport type DialogPlacement = \"center\" \| \"top\" \| \"bottom\" \| \"start\" \| \"end\" \| \"fullscreen\"\n\n/* DialogContent props; `class` lands on the panel, like `className` in React. */\nexport type DialogContentProps = InstanceType<typeof DialogContent>[\"$props\"] & { class?: HTMLAttributes[\"class\"] }\n"]}
1	+ {"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../../src/components/Dialog/Dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n cloneVNode,\n computed,\n createCommentVNode,\n defineComponent,\n h,\n inject,\n onBeforeUnmount,\n onMounted,\n provide,\n ref,\n watch,\n type ComputedRef,\n type HTMLAttributes,\n type InjectionKey,\n type PropType,\n type Ref,\n type VNode,\n} from \"vue\"\nimport {\n DialogContent as RekaDialogContent,\n DialogDescription as RekaDialogDescription,\n DialogOverlay as RekaDialogOverlay,\n DialogPortal as RekaDialogPortal,\n DialogRoot as RekaDialogRoot,\n DialogTitle as RekaDialogTitle,\n injectDialogRootContext,\n useForwardExpose,\n useId,\n} from \"reka-ui\"\nimport { useEscCloseStack } from \"../../composables/useEscCloseStack.js\"\nimport { keepMovedFocus, preventDefaultHandler, toCssVariables } from \"../../lib/helpers.js\"\nimport { dismissableSurfaces, useDeferredPointerDownOutside } from \"../Popover/deferredPointerDownOutside.js\"\nimport { firstElementChild } from \"../Tooltip/slot.js\"\nimport { TransitionGroup } from \"../Transition/index.js\"\nimport { overlayTiming, overlayTimingLarge } from \"../Transition/shared.js\"\nimport s from \"@plexui/styles/components/Dialog/Dialog.module.css\"\n\n// Vue port of packages/ui/src/components/Dialog/Dialog.tsx on Reka UI\n// (the Vue lineage of Radix, same anatomy). Exports are flat (`Dialog`,\n// `DialogTrigger`, ...) because runtime-compiled templates cannot resolve\n// `Dialog.Trigger` from the `components` option.\n//\n// Where Reka differs from Radix (radix-ui 1.8), the port follows Radix:\n// - The content is labelled and described only while a DialogTitle /\n// DialogDescription is mounted.\n// - A press outside (the overlay) closes it on the click that follows\n// (../Popover/deferredPointerDownOutside.ts); the overlay is a dismiss\n// surface.\n// - The portal renders once mounted, so a closed dialog server-renders\n// nothing.\n\ntype DialogContextValue = {\n open: ComputedRef<boolean>\n setOpen: (nextState: boolean) => void\n /** Mounted DialogTitle / DialogDescription parts (Radix's title and description counts) /\n titleCount: Ref<number>\n descriptionCount: Ref<number>\n}\n\nconst DialogContextKey: InjectionKey<DialogContextValue> = Symbol(\"PlexUIDialog\")\n\nconst useDialogContext = () => {\n const context = inject(DialogContextKey, null)\n\n if (!context) {\n throw new Error(\"Dialog compound components must be used inside <Dialog>\")\n }\n\n return context\n}\n\n/* Modal dialog root. Uncontrolled by default; bind `v-model:open` to control it. /\nexport const Dialog = defineComponent({\n name: \"Dialog\",\n props: {\n open: { type: Boolean, default: undefined },\n },\n emits: {\n \"update:open\": (_open: boolean) => true,\n },\n setup(props, { slots, emit }) {\n const internalOpen = ref(false)\n const isOpen = computed(() => props.open ?? internalOpen.value)\n\n const setOpen = (nextState: boolean) => {\n emit(\"update:open\", nextState)\n internalOpen.value = nextState\n }\n\n provide(DialogContextKey, { open: isOpen, setOpen, titleCount: ref(0), descriptionCount: ref(0) })\n\n return () =>\n h(RekaDialogRoot, { \"open\": isOpen.value, \"onUpdate:open\": setOpen }, { default: () => slots.default?.() })\n },\n})\n\n// Trigger and Close render their child with the dialog wiring merged in,\n// like Reka's `asChild` parts, but run the dialog action after the child's\n// own click handlers and skip it when one called preventDefault() (Radix's\n// composeEventHandlers). Reka's parts run first and cannot be cancelled.\n// Attributes the child sets itself win, as with Radix and Reka slots. The\n// child is the first element, also through a forwarded `<slot />`.\nconst withDialogProps = (\n child: VNode \| undefined,\n props: Record<string, unknown>,\n onClick: (event: Event) => void,\n ref?: (el: unknown) => void,\n) => {\n if (!child) return null\n const own = child.props ?? {}\n const extra = Object.fromEntries(Object.entries(props).filter(([key]) => !(key in own)))\n return cloneVNode(child, { ...extra, onClick, ...(ref ? { ref } : {}) }, true)\n}\n\nexport const DialogTrigger = defineComponent({\n name: \"DialogTrigger\",\n setup(_props, { slots }) {\n const rootContext = injectDialogRootContext()\n const { forwardRef, currentElement } = useForwardExpose()\n rootContext.contentId \|\|= useId(undefined, \"reka-dialog-content\")\n // Focus returns here when the dialog closes\n onMounted(() => {\n rootContext.triggerElement.value = currentElement.value\n })\n\n const onClick = (event: Event) => {\n if (!event.defaultPrevented) rootContext.onOpenToggle()\n }\n\n return () => {\n const open = rootContext.open.value\n return withDialogProps(\n firstElementChild(slots.default?.()),\n {\n \"type\": \"button\",\n \"aria-haspopup\": \"dialog\",\n \"aria-expanded\": open \|\| false,\n \"aria-controls\": open ? rootContext.contentId : undefined,\n \"data-state\": open ? \"open\" : \"closed\",\n },\n onClick,\n forwardRef as (el: unknown) => void,\n )\n }\n },\n})\n\nconst CloseIcon = () =>\n h(\"svg\", { \"class\": s.CloseIcon, \"viewBox\": \"0 0 20 20\", \"width\": \"20\", \"height\": \"20\", \"aria-hidden\": \"true\" }, [\n h(\"path\", {\n fill: \"currentColor\",\n d: \"M5.22 5.22a.75.75 0 0 1 1.06 0L10 8.94l3.72-3.72a.75.75 0 1 1 1.06 1.06L11.06 10l3.72 3.72a.75.75 0 1 1-1.06 1.06L10 11.06l-3.72 3.72a.75.75 0 1 1-1.06-1.06L8.94 10 5.22 6.28a.75.75 0 0 1 0-1.06\",\n }),\n ])\n\n/* Overlay and panel. `class` lands on the panel, like `className` in React. /\nexport const DialogContent = defineComponent({\n name: \"DialogContent\",\n inheritAttrs: false,\n props: {\n /* Panel width; numbers are pixels. @default 480 /\n width: { type: [Number, String] as PropType<number \| string>, default: 480 },\n /* Renders the close button in the top corner. @default true /\n showClose: { type: Boolean, default: true },\n /\n Rounder panel and a round close button, for dialogs that sit beside pill controls.\n * @default false\n /\n pill: { type: Boolean, default: false },\n /\n Where the panel sits: centered, near the top, a sheet along the bottom,\n * a full-height panel on the start or end side, or the whole screen.\n * @default \"center\"\n /\n placement: { type: String as PropType<DialogPlacement>, default: \"center\" },\n /* Placement at 640px and below, such as a bottom sheet on phones. @default placement /\n mobilePlacement: String as PropType<Extract<DialogPlacement, \"center\" \| \"bottom\" \| \"fullscreen\">>,\n /* Called when focus moves into the dialog on open; `event.preventDefault()` keeps it for you to place. /\n onOpenAutoFocus: Function as PropType<(event: Event) => void>,\n /* Called when focus returns on close; `event.preventDefault()` keeps it elsewhere. /\n onCloseAutoFocus: Function as PropType<(event: Event) => void>,\n },\n setup(props, { slots, attrs }) {\n const { open, setOpen, titleCount, descriptionCount } = useDialogContext()\n const rootContext = injectDialogRootContext()\n // Radix's root makes the content id; Reka's trigger does, so a dialog\n // without one would render `id=\"\"`\n rootContext.contentId \|\|= useId(undefined, \"reka-dialog-content\")\n\n // Force-mounted content refocuses Reka's trigger the moment it closes.\n // Focus waits for the exit, as in Radix: the trigger is held back until\n // the content unmounts, where Reka's own close auto focus uses it.\n let closingTrigger: HTMLElement \| undefined\n watch(\n open,\n (isOpen) => {\n if (isOpen) {\n if (closingTrigger) rootContext.triggerElement.value = closingTrigger\n closingTrigger = undefined\n } else {\n closingTrigger = rootContext.triggerElement.value\n rootContext.triggerElement.value = undefined\n }\n },\n { flush: \"sync\" },\n )\n const handleCloseAutoFocus = (event: Event) => {\n props.onCloseAutoFocus?.(event)\n keepMovedFocus(event)\n if (closingTrigger) rootContext.triggerElement.value = closingTrigger\n closingTrigger = undefined\n }\n\n // Escape goes through the shared stack, as in React, so the dialog\n // closes before overlays opened earlier (a forced-open Tooltip)\n useEscCloseStack(open, () => {\n setOpen(false)\n })\n\n // Radix's modal content: a Ctrl+click (macOS right click) does not dismiss\n const outsidePress = useDeferredPointerDownOutside((originalEvent) => {\n if (!originalEvent.ctrlKey) setOpen(false)\n })\n watch(open, (isOpen) => {\n if (!isOpen) outsidePress.reset()\n })\n\n let overlayElement: Element \| undefined\n const setOverlayRef = (instance: unknown) => {\n const el = (instance as { $el?: unknown } \| null)?.$el\n const element = el instanceof Element ? el : undefined\n if (element === overlayElement) return\n if (overlayElement) dismissableSurfaces.delete(overlayElement)\n overlayElement = element\n if (element) dismissableSurfaces.add(element)\n }\n\n const renderDialog = () =>\n h(\"div\", { key: \"dialog\" }, [\n h(RekaDialogOverlay, { class: s.Overlay, forceMount: true, ref: setOverlayRef }),\n h(\n RekaDialogContent,\n {\n \"forceMount\": true,\n \"class\": s.Content,\n \"style\": toCssVariables({ \"dialog-width\": props.width }),\n \"data-placement\": props.placement === \"center\" ? undefined : props.placement,\n \"data-mobile-placement\": props.mobilePlacement,\n \"data-pill\": props.pill ? \"\" : undefined,\n \"onOpenAutoFocus\": props.onOpenAutoFocus,\n \"onCloseAutoFocus\": handleCloseAutoFocus,\n // Radix labels and describes the content only by mounted parts\n ...(titleCount.value > 0 ? {} : { \"aria-labelledby\": undefined }),\n ...(descriptionCount.value > 0 ? {} : { \"aria-describedby\": undefined }),\n \"onEscapeKeyDown\": preventDefaultHandler,\n \"onPointerDownOutside\": outsidePress.onPointerDownOutside,\n \"onFocusOutside\": outsidePress.onFocusOutside,\n },\n {\n default: () => [\n h(\"div\", { class: [s.Panel, attrs.class] }, [\n props.showClose\n ? h(DialogClose, null, {\n default: () => [\n h(\"button\", { \"type\": \"button\", \"class\": s.CloseButton, \"aria-label\": \"Close dialog\" }, [\n h(CloseIcon),\n ]),\n ],\n })\n : null,\n slots.default?.(),\n ]),\n ],\n },\n ),\n ])\n\n return () => {\n const { placement, mobilePlacement } = props\n const crossesScreen =\n placement === \"bottom\" \|\| placement === \"start\" \|\| placement === \"end\" \|\| mobilePlacement === \"bottom\"\n return h(RekaDialogPortal, null, {\n default: () => [\n h(\n TransitionGroup,\n // A dialog mounted open enters too, as `v-if` and `open` together do\n {\n class: s.Transition,\n ...(crossesScreen ? overlayTimingLarge : overlayTiming),\n overlay: true,\n preventInitialTransition: false,\n },\n // `open && <div>` in React: closed still renders the empty wrapper\n { default: () => [open.value ? renderDialog() : createCommentVNode()] },\n ),\n ],\n })\n }\n },\n})\n\nexport const DialogHeader = defineComponent({\n name: \"DialogHeader\",\n setup(_props, { slots }) {\n return () => h(\"div\", { class: s.Header }, slots.default?.())\n },\n})\n\n/* The scrolling part between DialogHeader and DialogFooter: with it, only the body scrolls. /\nexport const DialogBody = defineComponent({\n name: \"DialogBody\",\n inheritAttrs: false,\n setup(_props, { slots, attrs }) {\n return () => h(\"div\", { class: [s.Body, attrs.class] }, slots.default?.())\n },\n})\n\nexport const DialogFooter = defineComponent({\n name: \"DialogFooter\",\n setup(_props, { slots }) {\n return () => h(\"div\", { class: s.Footer }, slots.default?.())\n },\n})\n\n/* Counts a mounted part, as Radix's title and description counts do. /\nconst useMountedCount = (count: Ref<number>) => {\n onMounted(() => {\n count.value++\n })\n onBeforeUnmount(() => {\n count.value--\n })\n}\n\nexport const DialogTitle = defineComponent({\n name: \"DialogTitle\",\n setup(_props, { slots }) {\n useMountedCount(useDialogContext().titleCount)\n return () => h(RekaDialogTitle, { class: s.Title }, { default: () => slots.default?.() })\n },\n})\n\nexport const DialogDescription = defineComponent({\n name: \"DialogDescription\",\n setup(_props, { slots }) {\n useMountedCount(useDialogContext().descriptionCount)\n return () => h(RekaDialogDescription, { class: s.Description }, { default: () => slots.default?.() })\n },\n})\n\nexport const DialogClose = defineComponent({\n name: \"DialogClose\",\n setup(_props, { slots }) {\n const rootContext = injectDialogRootContext()\n const onClick = (event: Event) => {\n if (!event.defaultPrevented) rootContext.onOpenChange(false)\n }\n return () => withDialogProps(firstElementChild(slots.default?.()), { type: \"button\" }, onClick)\n },\n})\n\nexport type DialogProps = InstanceType<typeof Dialog>[\"$props\"]\n\nexport type DialogPlacement = \"center\" \| \"top\" \| \"bottom\" \| \"start\" \| \"end\" \| \"fullscreen\"\n\n/* DialogContent props; `class` lands on the panel, like `className` in React. */\nexport type DialogContentProps = InstanceType<typeof DialogContent>[\"$props\"] & { class?: HTMLAttributes[\"class\"] }\n"]}

package/dist/es/components/Field/Field.js CHANGED Viewed

@@ -114,7 +114,7 @@ const FieldComponent = defineComponent({
         required: { type: Boolean, default: false },
         /** Layout direction of label and control. @default "vertical" */
         orientation: { type: String, default: "vertical" },
-        /** Overrides the generated id set on the control and the label's `for`. */
+        /** Overrides the generated id set on the control and the label's `for`. A child's own `id` wins over both. */
         id: String,
         /** Optically aligns the control's text with surrounding content; passed to the control. */
         opticallyAlign: String,
@@ -145,17 +145,20 @@ const FieldComponent = defineComponent({
             // Resolve the children
             let resolvedChildren;
             let childSize;
+            // The control's id, which the label's `for` has to match
+            let controlId = fieldId;
             if (slots.default) {
                 const { proxy, state } = trackUse({ ...fieldChildProps, "aria-labelledby": labelId });
                 const nodes = slots.default(proxy);
                 const child = state.used ? undefined : singleElement(nodes);
                 childSize = child?.props?.size;
-                resolvedChildren = child ? [cloneWithFieldProps(child, fieldChildProps, labelId)] : nodes;
+                controlId = child?.props?.id || fieldId;
+                resolvedChildren = child ? [cloneWithFieldProps(child, { ...fieldChildProps, id: controlId }, labelId)] : nodes;
             }
             const size = props.size ?? (CONTROL_SIZES.has(childSize) ? childSize : "md");
             const labelAction = slots.labelAction ? slots.labelAction() : props.labelAction;
             const hasLabelAction = slots.labelAction ? hasContent(labelAction) : !!labelAction;
-            const labelElement = h("label", { class: s.Label, id: labelId, for: fieldId }, [
+            const labelElement = h("label", { class: s.Label, id: labelId, for: controlId }, [
                 slots.label ? slots.label() : props.label,
                 required ? h("span", { "class": s.RequiredIndicator, "aria-hidden": "true" }, "*") : null,
             ]);

package/dist/es/components/Field/Field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Field.js","sourceRoot":"","sources":["../../../../src/components/Field/Field.ts"],"names":[],"mappings":"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","sourcesContent":["import clsx, { type ClassValue } from \"clsx\"\nimport {\n Comment,\n Fragment,\n Static,\n Text,\n camelize,\n cloneVNode,\n defineComponent,\n h,\n isVNode,\n useId,\n type PropType,\n type SlotsType,\n type VNode,\n type VNodeArrayChildren,\n type VNodeChild,\n} from \"vue\"\nimport type { ControlSize } from \"@plexui/styles/types\"\nimport { FieldError } from \"../FieldError/index.js\"\nimport { hasContent } from \"../../lib/slotContent.js\"\nimport s from \"@plexui/styles/components/Field/Field.module.css\"\n\n// Vue port of packages/ui/src/components/Field/Field.tsx.\n//\n// - `label`, `description` and `errorMessage` take a string prop or a slot of\n// the same name (the slot wins), like React's ReactNode props.\n// - Children: React accepts an element, which Field clones with the field\n// props, or a render prop `(fieldProps) => ReactNode`, which it leaves alone.\n// Both are the default slot here, which receives the field props:\n// - a slot that reads them (`v-slot=\"fieldProps\"` + `v-bind=\"fieldProps\"`,\n// `v-slot=\"{ id }\"`, `(fieldProps) => h(...)`) is the render prop: its\n// content renders as it is.\n// - a slot that does not read them and holds exactly one element or\n// component gets it cloned like React's `cloneElement`: `id` and\n// `opticallyAlign` replace the child's own, `aria-describedby` is joined\n// after the child's own ids, and an explicit `aria-invalid` on the child\n// wins. Template comments do not count as children (JSX comments); the\n// placeholder of a `v-if` that renders nothing does, like `{false}` in a\n// React children array, so `<A v-if=\"x\" /><Input />` is not cloned.\n// - anything else (text, several roots, a `v-for` list) renders as it is,\n// like a React child that is not a single element.\n// - content a wrapper forwards with `<slot />` counts as its own roots, as\n// React's `children` passed on to Field are the elements themselves.\n// - As in React only `class` reaches the root element; other attributes are\n// dropped.\n\nexport type FieldChildProps = {\n id: string\n /** The label's id. Bind it to a control that the label's `for` cannot name, such as a Select trigger. /\n \"aria-labelledby\"?: string\n \"aria-describedby\"?: string\n \"aria-invalid\"?: boolean\n opticallyAlign?: \"start\" \| \"end\"\n}\n\ntype Props = Record<string, unknown>\n\nconst CONTROL_SIZES: ReadonlySet<unknown> = new Set([\"3xs\", \"2xs\", \"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"2xl\", \"3xl\"])\n\n/* The slot props, recording whether the slot read them (the render-prop form). /\nconst trackUse = (target: FieldChildProps) => {\n const state = { used: false }\n const proxy = new Proxy(target, {\n get(object, key, receiver) {\n state.used = true\n return Reflect.get(object, key, receiver)\n },\n has(object, key) {\n state.used = true\n return Reflect.has(object, key)\n },\n ownKeys(object) {\n state.used = true\n return Reflect.ownKeys(object)\n },\n getOwnPropertyDescriptor(object, key) {\n state.used = true\n return Reflect.getOwnPropertyDescriptor(object, key)\n },\n })\n return { proxy, state }\n}\n\n/* Like React's `isValidElement` for a slot root: an element or a component. /\nconst isElementVNode = (node: VNode) => {\n const { type } = node\n if (type === Fragment \|\| type === Text \|\| type === Comment \|\| type === Static) return false\n if (typeof type === \"object\" && type !== null && (\"__isTeleport\" in type \|\| \"__isSuspense\" in type)) return false\n return true\n}\n\n/\n Template comments (`<!-- note -->`) are no children, like JSX comments.\n * The empty placeholder of a `v-if` that renders nothing (or of a `false`\n * child) still counts, like `{false}` in a React children array.\n /\nconst isTemplateComment = (node: VNodeArrayChildren[number]) =>\n isVNode(node) && node.type === Comment && !!node.children && node.children !== \"v-if\"\n\n/\n Unwraps content forwarded through a wrapper's `<slot />`: the fragment\n * `renderSlot` creates, keyed `_<slot name>`.\n /\nconst unwrapForwardedSlots = (nodes: VNodeArrayChildren): VNodeArrayChildren =>\n nodes.flatMap((node) =>\n isVNode(node) &&\n node.type === Fragment &&\n typeof node.key === \"string\" &&\n node.key.startsWith(\"_\") &&\n Array.isArray(node.children)\n ? unwrapForwardedSlots(node.children)\n : [node],\n )\n\n/* The one element a non-render-prop slot holds, if it holds exactly one. /\nconst singleElement = (nodes: VNodeArrayChildren): VNode \| undefined => {\n const roots = unwrapForwardedSlots(nodes).filter((node) => !isTemplateComment(node))\n if (roots.length !== 1) return undefined\n const [root] = roots\n return isVNode(root) && isElementVNode(root) ? root : undefined\n}\n\n/* A child prop under its attribute name or its camelCase prop name. /\nconst childProp = (props: Props, name: string) => props[name] ?? props[camelize(name)]\n\n/\n `cloneElement(child, fieldProps)` with React Field's merging rules. A child\n * without its own name (`aria-label`, `aria-labelledby`, `label`, a `#label`\n * slot) is also labelled by the field's label, which names triggers `for`\n * cannot reach.\n /\nconst cloneWithFieldProps = (child: VNode, fieldChildProps: FieldChildProps, labelId: string): VNode => {\n const own: Props = { ...(child.props ?? {}) }\n const childDescribedBy = childProp(own, \"aria-describedby\") as string \| undefined\n const childInvalid = childProp(own, \"aria-invalid\")\n const childSlots = child.children\n const childNamed =\n childProp(own, \"aria-label\") != null \|\|\n childProp(own, \"aria-labelledby\") != null \|\|\n own.label != null \|\|\n (childSlots != null && typeof childSlots === \"object\" && !Array.isArray(childSlots) && \"label\" in childSlots)\n\n const overrides: Props = {\n ...fieldChildProps,\n // Merge with the child's own associations instead of overwriting them\n \"aria-describedby\": [childDescribedBy, fieldChildProps[\"aria-describedby\"]].filter(Boolean).join(\" \") \|\| undefined,\n \"aria-invalid\": childInvalid ?? fieldChildProps[\"aria-invalid\"],\n ...(!childNamed && { \"aria-labelledby\": labelId }),\n }\n\n // One spelling per prop, so the field's value is the one that applies\n for (const key of Object.keys(overrides)) {\n for (const spelling of [key, camelize(key), key.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`)]) {\n delete own[spelling]\n }\n }\n\n return cloneVNode({ ...child, props: own } as VNode, overrides)\n}\n\nconst FieldComponent = defineComponent({\n name: \"Field\",\n inheritAttrs: false,\n props: {\n /* Label text for the field (or the `label` slot) /\n label: String,\n /* Helper text below the label, linked via `aria-describedby` (or the `description` slot) /\n description: String,\n /\n Error message below the control (or the `errorMessage` slot). When set,\n * the control gets `aria-invalid=\"true\"`. Rendered with FieldError.\n /\n errorMessage: String,\n /* Content at the end of the label row, such as a link that acts on the field (or the `labelAction` slot) /\n labelAction: String,\n /* Font size of the label, to match the control's size. @default the child control's `size`, else \"md\" /\n size: String as PropType<ControlSize>,\n /* Shows a required asterisk after the label. Visual only: no `required` attribute. @default false /\n required: { type: Boolean, default: false },\n /* Layout direction of label and control. @default \"vertical\" /\n orientation: { type: String as PropType<\"vertical\" \| \"horizontal\">, default: \"vertical\" },\n /* Overrides the generated id set on the control and the label's `for`. /\n id: String,\n /* Optically aligns the control's text with surrounding content; passed to the control. /\n opticallyAlign: String as PropType<\"start\" \| \"end\">,\n },\n slots: Object as SlotsType<{\n /* The control. Read the props to render them yourself (React's render prop). /\n default?: (fieldProps: FieldChildProps) => VNodeChild\n label?: () => VNodeChild\n labelAction?: () => VNodeChild\n description?: () => VNodeChild\n errorMessage?: () => VNodeChild\n }>,\n setup(props, { attrs, slots }) {\n const generatedId = useId()\n\n return () => {\n const { required, orientation, opticallyAlign } = props\n const fieldId = props.id \|\| `field-${generatedId}`\n const labelId = `${fieldId}-label`\n\n const description = slots.description ? slots.description() : props.description\n const hasDescription = slots.description ? hasContent(description as VNodeArrayChildren) : !!description\n const errorMessage = slots.errorMessage ? slots.errorMessage() : props.errorMessage\n const hasError = slots.errorMessage ? hasContent(errorMessage as VNodeArrayChildren) : !!errorMessage\n\n const descriptionId = hasDescription ? `${fieldId}-description` : undefined\n const errorId = hasError ? `${fieldId}-error` : undefined\n\n // Build aria-describedby from description + error IDs\n const ariaDescribedBy = [descriptionId, errorId].filter(Boolean).join(\" \") \|\| undefined\n const invalid = hasError\n\n // Props to inject into the child control\n const fieldChildProps: FieldChildProps = {\n \"id\": fieldId,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-invalid\": invalid \|\| undefined,\n ...(opticallyAlign && { opticallyAlign }),\n }\n\n // Resolve the children\n let resolvedChildren: VNodeArrayChildren \| undefined\n let childSize: unknown\n if (slots.default) {\n const { proxy, state } = trackUse({ ...fieldChildProps, \"aria-labelledby\": labelId })\n const nodes = slots.default(proxy) as VNodeArrayChildren\n const child = state.used ? undefined : singleElement(nodes)\n childSize = child?.props?.size\n resolvedChildren = child ? [cloneWithFieldProps(child, fieldChildProps, labelId)] : nodes\n }\n const size = props.size ?? (CONTROL_SIZES.has(childSize) ? (childSize as ControlSize) : \"md\")\n\n const labelAction = slots.labelAction ? slots.labelAction() : props.labelAction\n const hasLabelAction = slots.labelAction ? hasContent(labelAction as VNodeArrayChildren) : !!labelAction\n const labelElement = h(\"label\", { class: s.Label, id: labelId, for: fieldId }, [\n slots.label ? slots.label() : props.label,\n required ? h(\"span\", { \"class\": s.RequiredIndicator, \"aria-hidden\": \"true\" }, \"\") : null,\n ])\n\n return h(\n \"div\",\n {\n \"class\": clsx(s.Field, attrs.class as ClassValue),\n \"data-size\": size,\n \"data-orientation\": orientation,\n \"data-optically-align\": opticallyAlign,\n },\n [\n h(\"div\", { class: s.LabelGroup }, [\n hasLabelAction\n ? h(\"div\", { class: s.LabelRow }, [labelElement, h(\"div\", { class: s.LabelAction }, [labelAction as VNodeChild])])\n : labelElement,\n hasDescription ? h(\"div\", { class: s.Description, id: descriptionId }, [description as VNodeChild]) : null,\n ]),\n h(\"div\", { class: s.Content }, [\n h(\"div\", { class: s.Control }, resolvedChildren),\n hasError ? h(FieldError, { id: errorId }, () => [errorMessage as VNodeChild]) : null,\n ]),\n ],\n )\n }\n },\n})\n\ntype FieldOwnProps = InstanceType<typeof FieldComponent>[\"$props\"]\n\n/** Field props; `class` reaches the root element. /\nexport type FieldProps = FieldOwnProps & { class?: ClassValue }\n\n/* Form field wrapper with label, description, error and accessibility linking. */\nexport const Field = FieldComponent as typeof FieldComponent & { new (): { $props: FieldProps } }\n"]}
1	+ {"version":3,"file":"Field.js","sourceRoot":"","sources":["../../../../src/components/Field/Field.ts"],"names":[],"mappings":"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","sourcesContent":["import clsx, { type ClassValue } from \"clsx\"\nimport {\n Comment,\n Fragment,\n Static,\n Text,\n camelize,\n cloneVNode,\n defineComponent,\n h,\n isVNode,\n useId,\n type PropType,\n type SlotsType,\n type VNode,\n type VNodeArrayChildren,\n type VNodeChild,\n} from \"vue\"\nimport type { ControlSize } from \"@plexui/styles/types\"\nimport { FieldError } from \"../FieldError/index.js\"\nimport { hasContent } from \"../../lib/slotContent.js\"\nimport s from \"@plexui/styles/components/Field/Field.module.css\"\n\n// Vue port of packages/ui/src/components/Field/Field.tsx.\n//\n// - `label`, `description` and `errorMessage` take a string prop or a slot of\n// the same name (the slot wins), like React's ReactNode props.\n// - Children: React accepts an element, which Field clones with the field\n// props, or a render prop `(fieldProps) => ReactNode`, which it leaves alone.\n// Both are the default slot here, which receives the field props:\n// - a slot that reads them (`v-slot=\"fieldProps\"` + `v-bind=\"fieldProps\"`,\n// `v-slot=\"{ id }\"`, `(fieldProps) => h(...)`) is the render prop: its\n// content renders as it is.\n// - a slot that does not read them and holds exactly one element or\n// component gets it cloned like React's `cloneElement`: `opticallyAlign`\n// replaces the child's own, the child's own `id` stays and the label's\n// `for` follows it, `aria-describedby` is joined after the child's own\n// ids, and an explicit `aria-invalid` on the child wins. Template\n// comments do not count as children (JSX comments); the\n// placeholder of a `v-if` that renders nothing does, like `{false}` in a\n// React children array, so `<A v-if=\"x\" /><Input />` is not cloned.\n// - anything else (text, several roots, a `v-for` list) renders as it is,\n// like a React child that is not a single element.\n// - content a wrapper forwards with `<slot />` counts as its own roots, as\n// React's `children` passed on to Field are the elements themselves.\n// - As in React only `class` reaches the root element; other attributes are\n// dropped.\n\nexport type FieldChildProps = {\n id: string\n /** The label's id. Bind it to a control that the label's `for` cannot name, such as a Select trigger. /\n \"aria-labelledby\"?: string\n \"aria-describedby\"?: string\n \"aria-invalid\"?: boolean\n opticallyAlign?: \"start\" \| \"end\"\n}\n\ntype Props = Record<string, unknown>\n\nconst CONTROL_SIZES: ReadonlySet<unknown> = new Set([\"3xs\", \"2xs\", \"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"2xl\", \"3xl\"])\n\n/* The slot props, recording whether the slot read them (the render-prop form). /\nconst trackUse = (target: FieldChildProps) => {\n const state = { used: false }\n const proxy = new Proxy(target, {\n get(object, key, receiver) {\n state.used = true\n return Reflect.get(object, key, receiver)\n },\n has(object, key) {\n state.used = true\n return Reflect.has(object, key)\n },\n ownKeys(object) {\n state.used = true\n return Reflect.ownKeys(object)\n },\n getOwnPropertyDescriptor(object, key) {\n state.used = true\n return Reflect.getOwnPropertyDescriptor(object, key)\n },\n })\n return { proxy, state }\n}\n\n/* Like React's `isValidElement` for a slot root: an element or a component. /\nconst isElementVNode = (node: VNode) => {\n const { type } = node\n if (type === Fragment \|\| type === Text \|\| type === Comment \|\| type === Static) return false\n if (typeof type === \"object\" && type !== null && (\"__isTeleport\" in type \|\| \"__isSuspense\" in type)) return false\n return true\n}\n\n/\n Template comments (`<!-- note -->`) are no children, like JSX comments.\n * The empty placeholder of a `v-if` that renders nothing (or of a `false`\n * child) still counts, like `{false}` in a React children array.\n /\nconst isTemplateComment = (node: VNodeArrayChildren[number]) =>\n isVNode(node) && node.type === Comment && !!node.children && node.children !== \"v-if\"\n\n/\n Unwraps content forwarded through a wrapper's `<slot />`: the fragment\n * `renderSlot` creates, keyed `_<slot name>`.\n /\nconst unwrapForwardedSlots = (nodes: VNodeArrayChildren): VNodeArrayChildren =>\n nodes.flatMap((node) =>\n isVNode(node) &&\n node.type === Fragment &&\n typeof node.key === \"string\" &&\n node.key.startsWith(\"_\") &&\n Array.isArray(node.children)\n ? unwrapForwardedSlots(node.children)\n : [node],\n )\n\n/* The one element a non-render-prop slot holds, if it holds exactly one. /\nconst singleElement = (nodes: VNodeArrayChildren): VNode \| undefined => {\n const roots = unwrapForwardedSlots(nodes).filter((node) => !isTemplateComment(node))\n if (roots.length !== 1) return undefined\n const [root] = roots\n return isVNode(root) && isElementVNode(root) ? root : undefined\n}\n\n/* A child prop under its attribute name or its camelCase prop name. /\nconst childProp = (props: Props, name: string) => props[name] ?? props[camelize(name)]\n\n/\n `cloneElement(child, fieldProps)` with React Field's merging rules. A child\n * without its own name (`aria-label`, `aria-labelledby`, `label`, a `#label`\n * slot) is also labelled by the field's label, which names triggers `for`\n * cannot reach.\n /\nconst cloneWithFieldProps = (child: VNode, fieldChildProps: FieldChildProps, labelId: string): VNode => {\n const own: Props = { ...(child.props ?? {}) }\n const childDescribedBy = childProp(own, \"aria-describedby\") as string \| undefined\n const childInvalid = childProp(own, \"aria-invalid\")\n const childSlots = child.children\n const childNamed =\n childProp(own, \"aria-label\") != null \|\|\n childProp(own, \"aria-labelledby\") != null \|\|\n own.label != null \|\|\n (childSlots != null && typeof childSlots === \"object\" && !Array.isArray(childSlots) && \"label\" in childSlots)\n\n const overrides: Props = {\n ...fieldChildProps,\n // Merge with the child's own associations instead of overwriting them\n \"aria-describedby\": [childDescribedBy, fieldChildProps[\"aria-describedby\"]].filter(Boolean).join(\" \") \|\| undefined,\n \"aria-invalid\": childInvalid ?? fieldChildProps[\"aria-invalid\"],\n ...(!childNamed && { \"aria-labelledby\": labelId }),\n }\n\n // One spelling per prop, so the field's value is the one that applies\n for (const key of Object.keys(overrides)) {\n for (const spelling of [key, camelize(key), key.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`)]) {\n delete own[spelling]\n }\n }\n\n return cloneVNode({ ...child, props: own } as VNode, overrides)\n}\n\nconst FieldComponent = defineComponent({\n name: \"Field\",\n inheritAttrs: false,\n props: {\n /* Label text for the field (or the `label` slot) /\n label: String,\n /* Helper text below the label, linked via `aria-describedby` (or the `description` slot) /\n description: String,\n /\n Error message below the control (or the `errorMessage` slot). When set,\n * the control gets `aria-invalid=\"true\"`. Rendered with FieldError.\n /\n errorMessage: String,\n /* Content at the end of the label row, such as a link that acts on the field (or the `labelAction` slot) /\n labelAction: String,\n /* Font size of the label, to match the control's size. @default the child control's `size`, else \"md\" /\n size: String as PropType<ControlSize>,\n /* Shows a required asterisk after the label. Visual only: no `required` attribute. @default false /\n required: { type: Boolean, default: false },\n /* Layout direction of label and control. @default \"vertical\" /\n orientation: { type: String as PropType<\"vertical\" \| \"horizontal\">, default: \"vertical\" },\n /* Overrides the generated id set on the control and the label's `for`. A child's own `id` wins over both. /\n id: String,\n /* Optically aligns the control's text with surrounding content; passed to the control. /\n opticallyAlign: String as PropType<\"start\" \| \"end\">,\n },\n slots: Object as SlotsType<{\n /* The control. Read the props to render them yourself (React's render prop). /\n default?: (fieldProps: FieldChildProps) => VNodeChild\n label?: () => VNodeChild\n labelAction?: () => VNodeChild\n description?: () => VNodeChild\n errorMessage?: () => VNodeChild\n }>,\n setup(props, { attrs, slots }) {\n const generatedId = useId()\n\n return () => {\n const { required, orientation, opticallyAlign } = props\n const fieldId = props.id \|\| `field-${generatedId}`\n const labelId = `${fieldId}-label`\n\n const description = slots.description ? slots.description() : props.description\n const hasDescription = slots.description ? hasContent(description as VNodeArrayChildren) : !!description\n const errorMessage = slots.errorMessage ? slots.errorMessage() : props.errorMessage\n const hasError = slots.errorMessage ? hasContent(errorMessage as VNodeArrayChildren) : !!errorMessage\n\n const descriptionId = hasDescription ? `${fieldId}-description` : undefined\n const errorId = hasError ? `${fieldId}-error` : undefined\n\n // Build aria-describedby from description + error IDs\n const ariaDescribedBy = [descriptionId, errorId].filter(Boolean).join(\" \") \|\| undefined\n const invalid = hasError\n\n // Props to inject into the child control\n const fieldChildProps: FieldChildProps = {\n \"id\": fieldId,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-invalid\": invalid \|\| undefined,\n ...(opticallyAlign && { opticallyAlign }),\n }\n\n // Resolve the children\n let resolvedChildren: VNodeArrayChildren \| undefined\n let childSize: unknown\n // The control's id, which the label's `for` has to match\n let controlId = fieldId\n if (slots.default) {\n const { proxy, state } = trackUse({ ...fieldChildProps, \"aria-labelledby\": labelId })\n const nodes = slots.default(proxy) as VNodeArrayChildren\n const child = state.used ? undefined : singleElement(nodes)\n childSize = child?.props?.size\n controlId = (child?.props?.id as string \| undefined) \|\| fieldId\n resolvedChildren = child ? [cloneWithFieldProps(child, { ...fieldChildProps, id: controlId }, labelId)] : nodes\n }\n const size = props.size ?? (CONTROL_SIZES.has(childSize) ? (childSize as ControlSize) : \"md\")\n\n const labelAction = slots.labelAction ? slots.labelAction() : props.labelAction\n const hasLabelAction = slots.labelAction ? hasContent(labelAction as VNodeArrayChildren) : !!labelAction\n const labelElement = h(\"label\", { class: s.Label, id: labelId, for: controlId }, [\n slots.label ? slots.label() : props.label,\n required ? h(\"span\", { \"class\": s.RequiredIndicator, \"aria-hidden\": \"true\" }, \"\") : null,\n ])\n\n return h(\n \"div\",\n {\n \"class\": clsx(s.Field, attrs.class as ClassValue),\n \"data-size\": size,\n \"data-orientation\": orientation,\n \"data-optically-align\": opticallyAlign,\n },\n [\n h(\"div\", { class: s.LabelGroup }, [\n hasLabelAction\n ? h(\"div\", { class: s.LabelRow }, [labelElement, h(\"div\", { class: s.LabelAction }, [labelAction as VNodeChild])])\n : labelElement,\n hasDescription ? h(\"div\", { class: s.Description, id: descriptionId }, [description as VNodeChild]) : null,\n ]),\n h(\"div\", { class: s.Content }, [\n h(\"div\", { class: s.Control }, resolvedChildren),\n hasError ? h(FieldError, { id: errorId }, () => [errorMessage as VNodeChild]) : null,\n ]),\n ],\n )\n }\n },\n})\n\ntype FieldOwnProps = InstanceType<typeof FieldComponent>[\"$props\"]\n\n/** Field props; `class` reaches the root element. /\nexport type FieldProps = FieldOwnProps & { class?: ClassValue }\n\n/* Form field wrapper with label, description, error and accessibility linking. */\nexport const Field = FieldComponent as typeof FieldComponent & { new (): { $props: FieldProps } }\n"]}

package/dist/es/components/InputGroup/InputGroup.js CHANGED Viewed

@@ -71,7 +71,6 @@ const InputGroupComponent = defineComponent({
         return () => {
             const { class: className, onMousedown: _onMousedown, ...restAttrs } = attrs;
             return h("div", {
-                "role": "group",
                 "data-slot": "input-group",
                 "data-variant": props.variant,
                 "data-size": props.size,

package/dist/es/components/InputGroup/InputGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InputGroup.js","sourceRoot":"","sources":["../../../../src/components/InputGroup/InputGroup.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n defineComponent,\n h,\n inject,\n nextTick,\n onMounted,\n provide,\n ref,\n watch,\n withDirectives,\n type HTMLAttributes,\n type InjectionKey,\n type InputHTMLAttributes,\n type PropType,\n type TextareaHTMLAttributes,\n} from \"vue\"\nimport type { ControlSize, Variants } from \"@plexui/styles/types\"\nimport { Button, type ButtonColor, type ButtonProps } from \"../Button/index.js\"\nimport { vDefaultValue, vServerText } from \"../../lib/defaultValue.js\"\nimport s from \"@plexui/styles/components/InputGroup/InputGroup.module.css\"\n\n// Vue port of packages/ui/src/components/InputGroup/InputGroup.tsx.\n// Exports are flat (`InputGroupInput` for `InputGroup.Input`, ...). The group\n// provides its size, pill, disabled and invalid state to the parts, as the\n// React context does. React spreads the remaining props after its own\n// attributes, so caller attributes win; Vue's attribute fallthrough merges\n// them the same way. `InputGroupInput` / `InputGroupTextarea` take\n// `v-model:value` and `default-value` like Input and Textarea (the textarea's\n// text content follows the value and its value is set imperatively, as in\n// Textarea).\n\ntype InputGroupContext = {\n readonly size: ControlSize\n readonly pill: boolean\n readonly disabled: boolean\n readonly invalid: boolean\n}\n\nconst InputGroupKey: InjectionKey<InputGroupContext> = Symbol(\"InputGroup\")\n\nconst CONTROL_SELECTOR = \"[data-slot='input-group-control']\"\n\n// A fallthrough listener is a function or, when merged, an array of them\nconst callListeners = (listener: unknown, evt: Event) => {\n for (const fn of Array.isArray(listener) ? listener : [listener]) {\n if (typeof fn === \"function\") fn(evt)\n }\n}\n\n/** Button size for each group size: the closest Button that fits inside the control /\nconst BUTTON_SIZE: Record<ControlSize, ControlSize> = {\n \"3xs\": \"3xs\",\n \"2xs\": \"3xs\",\n \"xs\": \"3xs\",\n \"sm\": \"3xs\",\n \"md\": \"2xs\",\n \"lg\": \"sm\",\n \"xl\": \"md\",\n \"2xl\": \"lg\",\n \"3xl\": \"xl\",\n}\n\nconst InputGroupComponent = defineComponent({\n name: \"InputGroup\",\n inheritAttrs: false,\n props: {\n /* Visual style of the group. @default \"outline\" /\n variant: { type: String as PropType<Variants<\"outline\" \| \"soft\">>, default: \"outline\" },\n /* Controls the size of the group, on the same scale as Input: `3xs` 22px up to `3xl` 48px. @default \"md\" /\n size: { type: String as PropType<ControlSize>, default: \"md\" },\n /* Fully rounded group, with pill buttons inside. @default false /\n pill: { type: Boolean, default: false },\n /* Disables the control and the buttons inside the group. @default false /\n disabled: { type: Boolean, default: false },\n /* Mark the group as invalid. @default false /\n invalid: { type: Boolean, default: false },\n },\n setup(props, { attrs, slots }) {\n provide(InputGroupKey, {\n get size() {\n return props.size\n },\n get pill() {\n return props.pill\n },\n get disabled() {\n return props.disabled\n },\n get invalid() {\n return props.invalid\n },\n })\n\n // Clicks on the frame, icons and text focus the control, as in Input\n const handleMouseDown = (evt: MouseEvent) => {\n callListeners(attrs.onMousedown, evt)\n const control = (evt.currentTarget as HTMLElement).querySelector<HTMLElement>(CONTROL_SELECTOR)\n const { target } = evt\n if (evt.defaultPrevented \|\| !control \|\| !(target instanceof Element) \|\| control.contains(target)) {\n return\n }\n // Buttons, links, menus and other controls in the addons take their own clicks\n if (target.closest(\"button, a, input, textarea, select, [role='button'], [role='menuitem']\")) {\n return\n }\n evt.preventDefault()\n control.focus()\n }\n\n return () => {\n const { class: className, onMousedown: _onMousedown, ...restAttrs } = attrs\n return h(\n \"div\",\n {\n \"role\": \"group\",\n \"data-slot\": \"input-group\",\n \"data-variant\": props.variant,\n \"data-size\": props.size,\n \"data-pill\": props.pill ? \"\" : undefined,\n \"data-disabled\": props.disabled ? \"\" : undefined,\n \"data-invalid\": props.invalid ? \"\" : undefined,\n \"class\": [s.InputGroup, className],\n \"onMousedown\": handleMouseDown,\n ...restAttrs,\n },\n slots.default?.(),\n )\n }\n },\n})\n\ntype InputGroupOwnProps = InstanceType<typeof InputGroupComponent>[\"$props\"]\n\n/* InputGroup props plus the native <div> attributes that fall through to it, as in React. /\nexport type InputGroupProps = InputGroupOwnProps & Omit<HTMLAttributes, keyof InputGroupOwnProps>\n\n/* An input or textarea with icons, text, buttons and menus attached inside one frame. /\nexport const InputGroup = InputGroupComponent as typeof InputGroupComponent & {\n new (): { $props: InputGroupProps }\n}\n\n// `value` / `default-value` / `update:value` for the native control, as in Input\nconst controlProps = {\n /* Controlled value; use with `v-model:value` /\n value: { type: [String, Number] as PropType<string \| number>, default: undefined },\n /* Initial value of an uncontrolled control /\n defaultValue: { type: [String, Number] as PropType<string \| number>, default: undefined },\n /* Disables the control; defaults to the group's `disabled` /\n disabled: { type: Boolean, default: undefined },\n}\n\nconst useControl = (props: { value?: string \| number }, emit: (event: \"update:value\", value: string) => void) => {\n const group = inject(InputGroupKey, null)\n const handleInput = (evt: Event) => {\n const target = evt.currentTarget as HTMLInputElement \| HTMLTextAreaElement\n emit(\"update:value\", target.value)\n // Like a React controlled input, a `value` the parent does not update is put back\n void nextTick(() => {\n if (props.value === undefined) return\n const value = String(props.value)\n if (target.value !== value) target.value = value\n })\n }\n return { group, handleInput }\n}\n\nconst InputGroupInputComponent = defineComponent({\n name: \"InputGroupInput\",\n props: {\n ...controlProps,\n /* @default \"text\" /\n type: { type: String, default: \"text\" },\n },\n emits: {\n \"update:value\": (_value: string) => true,\n },\n setup(props, { emit }) {\n const { group, handleInput } = useControl(props, emit)\n return () =>\n withDirectives(\n h(\"input\", {\n \"type\": props.type,\n \"data-slot\": \"input-group-control\",\n \"class\": s.Control,\n \"disabled\": props.disabled ?? group?.disabled,\n // Expose the group's invalid state to assistive tech; an explicit aria-invalid wins\n \"aria-invalid\": group?.invalid \|\| undefined,\n ...(props.value !== undefined ? { value: props.value } : {}),\n \"onInput\": handleInput,\n }),\n [[vDefaultValue, props.value === undefined ? props.defaultValue : undefined]],\n )\n },\n})\n\ntype InputGroupInputOwnProps = InstanceType<typeof InputGroupInputComponent>[\"$props\"]\n\n/* InputGroupInput props plus the native <input> attributes that fall through to it. /\nexport type InputGroupInputProps = InputGroupInputOwnProps &\n Omit<InputHTMLAttributes, keyof InputGroupInputOwnProps \| \"size\">\n\n/* The native <input> of the group, without its own frame (React `InputGroup.Input`). /\nexport const InputGroupInput = InputGroupInputComponent as typeof InputGroupInputComponent & {\n new (): { $props: InputGroupInputProps }\n}\n\nconst InputGroupTextareaComponent = defineComponent({\n name: \"InputGroupTextarea\",\n props: {\n ...controlProps,\n /* @default 3 /\n rows: { type: [Number, String] as PropType<number \| string>, default: 3 },\n },\n emits: {\n \"update:value\": (_value: string) => true,\n },\n setup(props, { emit }) {\n const group = inject(InputGroupKey, null)\n const textareaRef = ref<HTMLTextAreaElement \| null>(null)\n\n // Set imperatively, like React DOM: a `value` prop would make Vue mirror\n // it into a `value` attribute, which React never renders\n const syncValue = () => {\n const textarea = textareaRef.value\n if (!textarea \|\| props.value === undefined) return\n const value = String(props.value)\n if (textarea.value !== value) textarea.value = value\n }\n onMounted(() => {\n // React's initTextarea: the initial text becomes the (dirty) value\n const textarea = textareaRef.value\n const initialValue = textarea?.textContent ?? \"\"\n if (textarea && initialValue !== \"\") textarea.value = initialValue\n })\n watch(() => props.value, syncValue, { flush: \"post\" })\n\n const handleInput = (evt: Event) => {\n emit(\"update:value\", (evt.currentTarget as HTMLTextAreaElement).value)\n // A controlled value the parent did not update wins over the typed text\n void nextTick(syncValue)\n }\n\n return () => {\n // React keeps the textarea's text content in sync with the controlled\n // value, else with `defaultValue`\n const textContent = String(props.value ?? props.defaultValue ?? \"\")\n return withDirectives(\n h(\"textarea\", {\n \"ref\": textareaRef,\n \"rows\": props.rows,\n \"data-slot\": \"input-group-control\",\n \"class\": s.Control,\n \"disabled\": props.disabled ?? group?.disabled,\n \"aria-invalid\": group?.invalid \|\| undefined,\n textContent,\n \"onInput\": handleInput,\n }),\n [[vServerText, textContent]],\n )\n }\n },\n})\n\ntype InputGroupTextareaOwnProps = InstanceType<typeof InputGroupTextareaComponent>[\"$props\"]\n\n/* InputGroupTextarea props plus the native <textarea> attributes that fall through to it. /\nexport type InputGroupTextareaProps = InputGroupTextareaOwnProps &\n Omit<TextareaHTMLAttributes, keyof InputGroupTextareaOwnProps>\n\n/* The native <textarea> of the group (React `InputGroup.Textarea`). /\nexport const InputGroupTextarea = InputGroupTextareaComponent as typeof InputGroupTextareaComponent & {\n new (): { $props: InputGroupTextareaProps }\n}\n\nexport type InputGroupAddonAlign = \"inline-start\" \| \"inline-end\" \| \"block-start\" \| \"block-end\"\n\n/* Icons, text and buttons beside, above or below the control (React `InputGroup.Addon`). /\nexport const InputGroupAddon = defineComponent({\n name: \"InputGroupAddon\",\n props: {\n /\n Where the addon sits: before or after the control on its line, or as a\n * row above or below it.\n * @default \"inline-start\"\n /\n align: { type: String as PropType<InputGroupAddonAlign>, default: \"inline-start\" },\n },\n setup(props, { slots }) {\n return () =>\n h(\n \"div\",\n { \"data-slot\": \"input-group-addon\", \"data-align\": props.align, \"class\": s.Addon },\n slots.default?.(),\n )\n },\n})\n\nexport type InputGroupAddonProps = InstanceType<typeof InputGroupAddon>[\"$props\"] &\n Omit<HTMLAttributes, keyof InstanceType<typeof InputGroupAddon>[\"$props\"]>\n\nconst InputGroupButtonComponent = defineComponent({\n name: \"InputGroupButton\",\n props: {\n /* Color for the button. @default \"secondary\" /\n color: { type: String as PropType<ButtonColor>, default: \"secondary\" },\n /* Style variant. @default \"ghost\" /\n variant: { type: String as PropType<Variants<\"solid\" \| \"soft\" \| \"outline\" \| \"ghost\">>, default: \"ghost\" },\n pill: { type: Boolean, default: undefined },\n disabled: { type: Boolean, default: undefined },\n },\n setup(props, { slots }) {\n const group = inject(InputGroupKey, null)\n return () =>\n h(\n Button,\n {\n color: props.color,\n variant: props.variant,\n size: BUTTON_SIZE[group?.size ?? \"md\"],\n pill: props.pill ?? group?.pill,\n disabled: props.disabled ?? group?.disabled,\n class: s.Button,\n },\n slots,\n )\n },\n})\n\ntype InputGroupButtonOwnProps = InstanceType<typeof InputGroupButtonComponent>[\"$props\"]\n\n/* InputGroupButton props plus the Button props (except `size`) that fall through to it, as in React. /\nexport type InputGroupButtonProps = InputGroupButtonOwnProps &\n Omit<ButtonProps, keyof InputGroupButtonOwnProps \| \"size\">\n\n/\n A ghost `Button` sized from the group (React `InputGroup.Button`). Takes the\n * Button props except `size`; `pill` and `disabled` default to the group's.\n /\nexport const InputGroupButton = InputGroupButtonComponent as typeof InputGroupButtonComponent & {\n new (): { $props: InputGroupButtonProps }\n}\n\n/* Text and icons inside an addon: prefixes, units, counters (React `InputGroup.Text`). */\nexport const InputGroupText = defineComponent({\n name: \"InputGroupText\",\n setup(_props, { slots }) {\n return () => h(\"span\", { \"data-slot\": \"input-group-text\", \"class\": s.Text }, slots.default?.())\n },\n})\n\nexport type InputGroupTextProps = HTMLAttributes\n"]}
1	+ {"version":3,"file":"InputGroup.js","sourceRoot":"","sources":["../../../../src/components/InputGroup/InputGroup.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,CAAC,EACD,MAAM,EACN,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,EACH,KAAK,EACL,cAAc,GAMf,MAAM,KAAK,CAAA;AAEZ,OAAO,EAAE,MAAM,EAAsC,MAAM,oBAAoB,CAAA;AAC/E,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACtE,OAAO,CAAC,MAAM,4DAA4D,CAAA;AAmB1E,MAAM,aAAa,GAAoC,MAAM,CAAC,YAAY,CAAC,CAAA;AAE3E,MAAM,gBAAgB,GAAG,mCAAmC,CAAA;AAE5D,yEAAyE;AACzE,MAAM,aAAa,GAAG,CAAC,QAAiB,EAAE,GAAU,EAAE,EAAE;IACtD,KAAK,MAAM,EAAE,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC;QACjE,IAAI,OAAO,EAAE,KAAK,UAAU;YAAE,EAAE,CAAC,GAAG,CAAC,CAAA;IACvC,CAAC;AACH,CAAC,CAAA;AAED,uFAAuF;AACvF,MAAM,WAAW,GAAqC;IACpD,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,KAAK;IACZ,IAAI,EAAE,KAAK;IACX,IAAI,EAAE,KAAK;IACX,IAAI,EAAE,KAAK;IACX,IAAI,EAAE,IAAI;IACV,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;IACX,KAAK,EAAE,IAAI;CACZ,CAAA;AAED,MAAM,mBAAmB,GAAG,eAAe,CAAC;IAC1C,IAAI,EAAE,YAAY;IAClB,YAAY,EAAE,KAAK;IACnB,KAAK,EAAE;QACL,oDAAoD;QACpD,OAAO,EAAE,EAAE,IAAI,EAAE,MAAgD,EAAE,OAAO,EAAE,SAAS,EAAE;QACvF,6GAA6G;QAC7G,IAAI,EAAE,EAAE,IAAI,EAAE,MAA+B,EAAE,OAAO,EAAE,IAAI,EAAE;QAC9D,oEAAoE;QACpE,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE;QACvC,4EAA4E;QAC5E,QAAQ,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE;QAC3C,gDAAgD;QAChD,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE;KAC3C;IACD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,OAAO,CAAC,aAAa,EAAE;YACrB,IAAI,IAAI;gBACN,OAAO,KAAK,CAAC,IAAI,CAAA;YACnB,CAAC;YACD,IAAI,IAAI;gBACN,OAAO,KAAK,CAAC,IAAI,CAAA;YACnB,CAAC;YACD,IAAI,QAAQ;gBACV,OAAO,KAAK,CAAC,QAAQ,CAAA;YACvB,CAAC;YACD,IAAI,OAAO;gBACT,OAAO,KAAK,CAAC,OAAO,CAAA;YACtB,CAAC;SACF,CAAC,CAAA;QAEF,qEAAqE;QACrE,MAAM,eAAe,GAAG,CAAC,GAAe,EAAE,EAAE;YAC1C,aAAa,CAAC,KAAK,CAAC,WAAW,EAAE,GAAG,CAAC,CAAA;YACrC,MAAM,OAAO,GAAI,GAAG,CAAC,aAA6B,CAAC,aAAa,CAAc,gBAAgB,CAAC,CAAA;YAC/F,MAAM,EAAE,MAAM,EAAE,GAAG,GAAG,CAAA;YACtB,IAAI,GAAG,CAAC,gBAAgB,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,YAAY,OAAO,CAAC,IAAI,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;gBACjG,OAAM;YACR,CAAC;YACD,+EAA+E;YAC/E,IAAI,MAAM,CAAC,OAAO,CAAC,wEAAwE,CAAC,EAAE,CAAC;gBAC7F,OAAM;YACR,CAAC;YACD,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,OAAO,CAAC,KAAK,EAAE,CAAA;QACjB,CAAC,CAAA;QAED,OAAO,GAAG,EAAE;YACV,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAA;YAC3E,OAAO,CAAC,CACN,KAAK,EACL;gBACE,WAAW,EAAE,aAAa;gBAC1B,cAAc,EAAE,KAAK,CAAC,OAAO;gBAC7B,WAAW,EAAE,KAAK,CAAC,IAAI;gBACvB,WAAW,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS;gBACxC,eAAe,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS;gBAChD,cAAc,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS;gBAC9C,OAAO,EAAE,CAAC,CAAC,CAAC,UAAU,EAAE,SAAS,CAAC;gBAClC,aAAa,EAAE,eAAe;gBAC9B,GAAG,SAAS;aACb,EACD,KAAK,CAAC,OAAO,EAAE,EAAE,CAClB,CAAA;QACH,CAAC,CAAA;IACH,CAAC;CACF,CAAC,CAAA;AAOF,0FAA0F;AAC1F,MAAM,CAAC,MAAM,UAAU,GAAG,mBAEzB,CAAA;AAED,iFAAiF;AACjF,MAAM,YAAY,GAAG;IACnB,iDAAiD;IACjD,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAA8B,EAAE,OAAO,EAAE,SAAS,EAAE;IAClF,+CAA+C;IAC/C,YAAY,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAA8B,EAAE,OAAO,EAAE,SAAS,EAAE;IACzF,+DAA+D;IAC/D,QAAQ,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE;CAChD,CAAA;AAED,MAAM,UAAU,GAAG,CAAC,KAAkC,EAAE,IAAoD,EAAE,EAAE;IAC9G,MAAM,KAAK,GAAG,MAAM,CAAC,aAAa,EAAE,IAAI,CAAC,CAAA;IACzC,MAAM,WAAW,GAAG,CAAC,GAAU,EAAE,EAAE;QACjC,MAAM,MAAM,GAAG,GAAG,CAAC,aAAuD,CAAA;QAC1E,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,KAAK,CAAC,CAAA;QAClC,kFAAkF;QAClF,KAAK,QAAQ,CAAC,GAAG,EAAE;YACjB,IAAI,KAAK,CAAC,KAAK,KAAK,SAAS;gBAAE,OAAM;YACrC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;YACjC,IAAI,MAAM,CAAC,KAAK,KAAK,KAAK;gBAAE,MAAM,CAAC,KAAK,GAAG,KAAK,CAAA;QAClD,CAAC,CAAC,CAAA;IACJ,CAAC,CAAA;IACD,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,CAAA;AAC/B,CAAC,CAAA;AAED,MAAM,wBAAwB,GAAG,eAAe,CAAC;IAC/C,IAAI,EAAE,iBAAiB;IACvB,KAAK,EAAE;QACL,GAAG,YAAY;QACf,sBAAsB;QACtB,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE;KACxC;IACD,KAAK,EAAE;QACL,cAAc,EAAE,CAAC,MAAc,EAAE,EAAE,CAAC,IAAI;KACzC;IACD,KAAK,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE;QACnB,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,CAAA;QACtD,OAAO,GAAG,EAAE,CACV,cAAc,CACZ,CAAC,CAAC,OAAO,EAAE;YACT,MAAM,EAAE,KAAK,CAAC,IAAI;YAClB,WAAW,EAAE,qBAAqB;YAClC,OAAO,EAAE,CAAC,CAAC,OAAO;YAClB,UAAU,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,EAAE,QAAQ;YAC7C,oFAAoF;YACpF,cAAc,EAAE,KAAK,EAAE,OAAO,IAAI,SAAS;YAC3C,GAAG,CAAC,KAAK,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;YAC5D,SAAS,EAAE,WAAW;SACvB,CAAC,EACF,CAAC,CAAC,aAAa,EAAE,KAAK,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAC9E,CAAA;IACL,CAAC;CACF,CAAC,CAAA;AAQF,yFAAyF;AACzF,MAAM,CAAC,MAAM,eAAe,GAAG,wBAE9B,CAAA;AAED,MAAM,2BAA2B,GAAG,eAAe,CAAC;IAClD,IAAI,EAAE,oBAAoB;IAC1B,KAAK,EAAE;QACL,GAAG,YAAY;QACf,iBAAiB;QACjB,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAA8B,EAAE,OAAO,EAAE,CAAC,EAAE;KAC1E;IACD,KAAK,EAAE;QACL,cAAc,EAAE,CAAC,MAAc,EAAE,EAAE,CAAC,IAAI;KACzC;IACD,KAAK,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE;QACnB,MAAM,KAAK,GAAG,MAAM,CAAC,aAAa,EAAE,IAAI,CAAC,CAAA;QACzC,MAAM,WAAW,GAAG,GAAG,CAA6B,IAAI,CAAC,CAAA;QAEzD,yEAAyE;QACzE,yDAAyD;QACzD,MAAM,SAAS,GAAG,GAAG,EAAE;YACrB,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAA;YAClC,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,KAAK,KAAK,SAAS;gBAAE,OAAM;YAClD,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;YACjC,IAAI,QAAQ,CAAC,KAAK,KAAK,KAAK;gBAAE,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAA;QACtD,CAAC,CAAA;QACD,SAAS,CAAC,GAAG,EAAE;YACb,mEAAmE;YACnE,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAA;YAClC,MAAM,YAAY,GAAG,QAAQ,EAAE,WAAW,IAAI,EAAE,CAAA;YAChD,IAAI,QAAQ,IAAI,YAAY,KAAK,EAAE;gBAAE,QAAQ,CAAC,KAAK,GAAG,YAAY,CAAA;QACpE,CAAC,CAAC,CAAA;QACF,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAA;QAEtD,MAAM,WAAW,GAAG,CAAC,GAAU,EAAE,EAAE;YACjC,IAAI,CAAC,cAAc,EAAG,GAAG,CAAC,aAAqC,CAAC,KAAK,CAAC,CAAA;YACtE,wEAAwE;YACxE,KAAK,QAAQ,CAAC,SAAS,CAAC,CAAA;QAC1B,CAAC,CAAA;QAED,OAAO,GAAG,EAAE;YACV,sEAAsE;YACtE,kCAAkC;YAClC,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,YAAY,IAAI,EAAE,CAAC,CAAA;YACnE,OAAO,cAAc,CACnB,CAAC,CAAC,UAAU,EAAE;gBACZ,KAAK,EAAE,WAAW;gBAClB,MAAM,EAAE,KAAK,CAAC,IAAI;gBAClB,WAAW,EAAE,qBAAqB;gBAClC,OAAO,EAAE,CAAC,CAAC,OAAO;gBAClB,UAAU,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,EAAE,QAAQ;gBAC7C,cAAc,EAAE,KAAK,EAAE,OAAO,IAAI,SAAS;gBAC3C,WAAW;gBACX,SAAS,EAAE,WAAW;aACvB,CAAC,EACF,CAAC,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC,CAC7B,CAAA;QACH,CAAC,CAAA;IACH,CAAC;CACF,CAAC,CAAA;AAQF,wEAAwE;AACxE,MAAM,CAAC,MAAM,kBAAkB,GAAG,2BAEjC,CAAA;AAID,6FAA6F;AAC7F,MAAM,CAAC,MAAM,eAAe,GAAG,eAAe,CAAC;IAC7C,IAAI,EAAE,iBAAiB;IACvB,KAAK,EAAE;QACL;;;;WAIG;QACH,KAAK,EAAE,EAAE,IAAI,EAAE,MAAwC,EAAE,OAAO,EAAE,cAAc,EAAE;KACnF;IACD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE;QACpB,OAAO,GAAG,EAAE,CACV,CAAC,CACC,KAAK,EACL,EAAE,WAAW,EAAE,mBAAmB,EAAE,YAAY,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC,KAAK,EAAE,EACjF,KAAK,CAAC,OAAO,EAAE,EAAE,CAClB,CAAA;IACL,CAAC;CACF,CAAC,CAAA;AAKF,MAAM,yBAAyB,GAAG,eAAe,CAAC;IAChD,IAAI,EAAE,kBAAkB;IACxB,KAAK,EAAE;QACL,iDAAiD;QACjD,KAAK,EAAE,EAAE,IAAI,EAAE,MAA+B,EAAE,OAAO,EAAE,WAAW,EAAE;QACtE,sCAAsC;QACtC,OAAO,EAAE,EAAE,IAAI,EAAE,MAAoE,EAAE,OAAO,EAAE,OAAO,EAAE;QACzG,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE;QAC3C,QAAQ,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE;KAChD;IACD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE;QACpB,MAAM,KAAK,GAAG,MAAM,CAAC,aAAa,EAAE,IAAI,CAAC,CAAA;QACzC,OAAO,GAAG,EAAE,CACV,CAAC,CACC,MAAM,EACN;YACE,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,OAAO,EAAE,KAAK,CAAC,OAAO;YACtB,IAAI,EAAE,WAAW,CAAC,KAAK,EAAE,IAAI,IAAI,IAAI,CAAC;YACtC,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,KAAK,EAAE,IAAI;YAC/B,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,KAAK,EAAE,QAAQ;YAC3C,KAAK,EAAE,CAAC,CAAC,MAAM;SAChB,EACD,KAAK,CACN,CAAA;IACL,CAAC;CACF,CAAC,CAAA;AAQF;;;GAGG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,yBAE/B,CAAA;AAED,2FAA2F;AAC3F,MAAM,CAAC,MAAM,cAAc,GAAG,eAAe,CAAC;IAC5C,IAAI,EAAE,gBAAgB;IACtB,KAAK,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE;QACrB,OAAO,GAAG,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,WAAW,EAAE,kBAAkB,EAAE,OAAO,EAAE,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,CAAC,OAAO,EAAE,EAAE,CAAC,CAAA;IACjG,CAAC;CACF,CAAC,CAAA","sourcesContent":["import {\n defineComponent,\n h,\n inject,\n nextTick,\n onMounted,\n provide,\n ref,\n watch,\n withDirectives,\n type HTMLAttributes,\n type InjectionKey,\n type InputHTMLAttributes,\n type PropType,\n type TextareaHTMLAttributes,\n} from \"vue\"\nimport type { ControlSize, Variants } from \"@plexui/styles/types\"\nimport { Button, type ButtonColor, type ButtonProps } from \"../Button/index.js\"\nimport { vDefaultValue, vServerText } from \"../../lib/defaultValue.js\"\nimport s from \"@plexui/styles/components/InputGroup/InputGroup.module.css\"\n\n// Vue port of packages/ui/src/components/InputGroup/InputGroup.tsx.\n// Exports are flat (`InputGroupInput` for `InputGroup.Input`, ...). The group\n// provides its size, pill, disabled and invalid state to the parts, as the\n// React context does. React spreads the remaining props after its own\n// attributes, so caller attributes win; Vue's attribute fallthrough merges\n// them the same way. `InputGroupInput` / `InputGroupTextarea` take\n// `v-model:value` and `default-value` like Input and Textarea (the textarea's\n// text content follows the value and its value is set imperatively, as in\n// Textarea).\n\ntype InputGroupContext = {\n readonly size: ControlSize\n readonly pill: boolean\n readonly disabled: boolean\n readonly invalid: boolean\n}\n\nconst InputGroupKey: InjectionKey<InputGroupContext> = Symbol(\"InputGroup\")\n\nconst CONTROL_SELECTOR = \"[data-slot='input-group-control']\"\n\n// A fallthrough listener is a function or, when merged, an array of them\nconst callListeners = (listener: unknown, evt: Event) => {\n for (const fn of Array.isArray(listener) ? listener : [listener]) {\n if (typeof fn === \"function\") fn(evt)\n }\n}\n\n/** Button size for each group size: the closest Button that fits inside the control /\nconst BUTTON_SIZE: Record<ControlSize, ControlSize> = {\n \"3xs\": \"3xs\",\n \"2xs\": \"3xs\",\n \"xs\": \"3xs\",\n \"sm\": \"3xs\",\n \"md\": \"2xs\",\n \"lg\": \"sm\",\n \"xl\": \"md\",\n \"2xl\": \"lg\",\n \"3xl\": \"xl\",\n}\n\nconst InputGroupComponent = defineComponent({\n name: \"InputGroup\",\n inheritAttrs: false,\n props: {\n /* Visual style of the group. @default \"outline\" /\n variant: { type: String as PropType<Variants<\"outline\" \| \"soft\">>, default: \"outline\" },\n /* Controls the size of the group, on the same scale as Input: `3xs` 22px up to `3xl` 48px. @default \"md\" /\n size: { type: String as PropType<ControlSize>, default: \"md\" },\n /* Fully rounded group, with pill buttons inside. @default false /\n pill: { type: Boolean, default: false },\n /* Disables the control and the buttons inside the group. @default false /\n disabled: { type: Boolean, default: false },\n /* Mark the group as invalid. @default false /\n invalid: { type: Boolean, default: false },\n },\n setup(props, { attrs, slots }) {\n provide(InputGroupKey, {\n get size() {\n return props.size\n },\n get pill() {\n return props.pill\n },\n get disabled() {\n return props.disabled\n },\n get invalid() {\n return props.invalid\n },\n })\n\n // Clicks on the frame, icons and text focus the control, as in Input\n const handleMouseDown = (evt: MouseEvent) => {\n callListeners(attrs.onMousedown, evt)\n const control = (evt.currentTarget as HTMLElement).querySelector<HTMLElement>(CONTROL_SELECTOR)\n const { target } = evt\n if (evt.defaultPrevented \|\| !control \|\| !(target instanceof Element) \|\| control.contains(target)) {\n return\n }\n // Buttons, links, menus and other controls in the addons take their own clicks\n if (target.closest(\"button, a, input, textarea, select, [role='button'], [role='menuitem']\")) {\n return\n }\n evt.preventDefault()\n control.focus()\n }\n\n return () => {\n const { class: className, onMousedown: _onMousedown, ...restAttrs } = attrs\n return h(\n \"div\",\n {\n \"data-slot\": \"input-group\",\n \"data-variant\": props.variant,\n \"data-size\": props.size,\n \"data-pill\": props.pill ? \"\" : undefined,\n \"data-disabled\": props.disabled ? \"\" : undefined,\n \"data-invalid\": props.invalid ? \"\" : undefined,\n \"class\": [s.InputGroup, className],\n \"onMousedown\": handleMouseDown,\n ...restAttrs,\n },\n slots.default?.(),\n )\n }\n },\n})\n\ntype InputGroupOwnProps = InstanceType<typeof InputGroupComponent>[\"$props\"]\n\n/* InputGroup props plus the native <div> attributes that fall through to it, as in React. /\nexport type InputGroupProps = InputGroupOwnProps & Omit<HTMLAttributes, keyof InputGroupOwnProps>\n\n/* An input or textarea with icons, text, buttons and menus attached inside one frame. /\nexport const InputGroup = InputGroupComponent as typeof InputGroupComponent & {\n new (): { $props: InputGroupProps }\n}\n\n// `value` / `default-value` / `update:value` for the native control, as in Input\nconst controlProps = {\n /* Controlled value; use with `v-model:value` /\n value: { type: [String, Number] as PropType<string \| number>, default: undefined },\n /* Initial value of an uncontrolled control /\n defaultValue: { type: [String, Number] as PropType<string \| number>, default: undefined },\n /* Disables the control; defaults to the group's `disabled` /\n disabled: { type: Boolean, default: undefined },\n}\n\nconst useControl = (props: { value?: string \| number }, emit: (event: \"update:value\", value: string) => void) => {\n const group = inject(InputGroupKey, null)\n const handleInput = (evt: Event) => {\n const target = evt.currentTarget as HTMLInputElement \| HTMLTextAreaElement\n emit(\"update:value\", target.value)\n // Like a React controlled input, a `value` the parent does not update is put back\n void nextTick(() => {\n if (props.value === undefined) return\n const value = String(props.value)\n if (target.value !== value) target.value = value\n })\n }\n return { group, handleInput }\n}\n\nconst InputGroupInputComponent = defineComponent({\n name: \"InputGroupInput\",\n props: {\n ...controlProps,\n /* @default \"text\" /\n type: { type: String, default: \"text\" },\n },\n emits: {\n \"update:value\": (_value: string) => true,\n },\n setup(props, { emit }) {\n const { group, handleInput } = useControl(props, emit)\n return () =>\n withDirectives(\n h(\"input\", {\n \"type\": props.type,\n \"data-slot\": \"input-group-control\",\n \"class\": s.Control,\n \"disabled\": props.disabled ?? group?.disabled,\n // Expose the group's invalid state to assistive tech; an explicit aria-invalid wins\n \"aria-invalid\": group?.invalid \|\| undefined,\n ...(props.value !== undefined ? { value: props.value } : {}),\n \"onInput\": handleInput,\n }),\n [[vDefaultValue, props.value === undefined ? props.defaultValue : undefined]],\n )\n },\n})\n\ntype InputGroupInputOwnProps = InstanceType<typeof InputGroupInputComponent>[\"$props\"]\n\n/* InputGroupInput props plus the native <input> attributes that fall through to it. /\nexport type InputGroupInputProps = InputGroupInputOwnProps &\n Omit<InputHTMLAttributes, keyof InputGroupInputOwnProps \| \"size\">\n\n/* The native <input> of the group, without its own frame (React `InputGroup.Input`). /\nexport const InputGroupInput = InputGroupInputComponent as typeof InputGroupInputComponent & {\n new (): { $props: InputGroupInputProps }\n}\n\nconst InputGroupTextareaComponent = defineComponent({\n name: \"InputGroupTextarea\",\n props: {\n ...controlProps,\n /* @default 3 /\n rows: { type: [Number, String] as PropType<number \| string>, default: 3 },\n },\n emits: {\n \"update:value\": (_value: string) => true,\n },\n setup(props, { emit }) {\n const group = inject(InputGroupKey, null)\n const textareaRef = ref<HTMLTextAreaElement \| null>(null)\n\n // Set imperatively, like React DOM: a `value` prop would make Vue mirror\n // it into a `value` attribute, which React never renders\n const syncValue = () => {\n const textarea = textareaRef.value\n if (!textarea \|\| props.value === undefined) return\n const value = String(props.value)\n if (textarea.value !== value) textarea.value = value\n }\n onMounted(() => {\n // React's initTextarea: the initial text becomes the (dirty) value\n const textarea = textareaRef.value\n const initialValue = textarea?.textContent ?? \"\"\n if (textarea && initialValue !== \"\") textarea.value = initialValue\n })\n watch(() => props.value, syncValue, { flush: \"post\" })\n\n const handleInput = (evt: Event) => {\n emit(\"update:value\", (evt.currentTarget as HTMLTextAreaElement).value)\n // A controlled value the parent did not update wins over the typed text\n void nextTick(syncValue)\n }\n\n return () => {\n // React keeps the textarea's text content in sync with the controlled\n // value, else with `defaultValue`\n const textContent = String(props.value ?? props.defaultValue ?? \"\")\n return withDirectives(\n h(\"textarea\", {\n \"ref\": textareaRef,\n \"rows\": props.rows,\n \"data-slot\": \"input-group-control\",\n \"class\": s.Control,\n \"disabled\": props.disabled ?? group?.disabled,\n \"aria-invalid\": group?.invalid \|\| undefined,\n textContent,\n \"onInput\": handleInput,\n }),\n [[vServerText, textContent]],\n )\n }\n },\n})\n\ntype InputGroupTextareaOwnProps = InstanceType<typeof InputGroupTextareaComponent>[\"$props\"]\n\n/* InputGroupTextarea props plus the native <textarea> attributes that fall through to it. /\nexport type InputGroupTextareaProps = InputGroupTextareaOwnProps &\n Omit<TextareaHTMLAttributes, keyof InputGroupTextareaOwnProps>\n\n/* The native <textarea> of the group (React `InputGroup.Textarea`). /\nexport const InputGroupTextarea = InputGroupTextareaComponent as typeof InputGroupTextareaComponent & {\n new (): { $props: InputGroupTextareaProps }\n}\n\nexport type InputGroupAddonAlign = \"inline-start\" \| \"inline-end\" \| \"block-start\" \| \"block-end\"\n\n/* Icons, text and buttons beside, above or below the control (React `InputGroup.Addon`). /\nexport const InputGroupAddon = defineComponent({\n name: \"InputGroupAddon\",\n props: {\n /\n Where the addon sits: before or after the control on its line, or as a\n * row above or below it.\n * @default \"inline-start\"\n /\n align: { type: String as PropType<InputGroupAddonAlign>, default: \"inline-start\" },\n },\n setup(props, { slots }) {\n return () =>\n h(\n \"div\",\n { \"data-slot\": \"input-group-addon\", \"data-align\": props.align, \"class\": s.Addon },\n slots.default?.(),\n )\n },\n})\n\nexport type InputGroupAddonProps = InstanceType<typeof InputGroupAddon>[\"$props\"] &\n Omit<HTMLAttributes, keyof InstanceType<typeof InputGroupAddon>[\"$props\"]>\n\nconst InputGroupButtonComponent = defineComponent({\n name: \"InputGroupButton\",\n props: {\n /* Color for the button. @default \"secondary\" /\n color: { type: String as PropType<ButtonColor>, default: \"secondary\" },\n /* Style variant. @default \"ghost\" /\n variant: { type: String as PropType<Variants<\"solid\" \| \"soft\" \| \"outline\" \| \"ghost\">>, default: \"ghost\" },\n pill: { type: Boolean, default: undefined },\n disabled: { type: Boolean, default: undefined },\n },\n setup(props, { slots }) {\n const group = inject(InputGroupKey, null)\n return () =>\n h(\n Button,\n {\n color: props.color,\n variant: props.variant,\n size: BUTTON_SIZE[group?.size ?? \"md\"],\n pill: props.pill ?? group?.pill,\n disabled: props.disabled ?? group?.disabled,\n class: s.Button,\n },\n slots,\n )\n },\n})\n\ntype InputGroupButtonOwnProps = InstanceType<typeof InputGroupButtonComponent>[\"$props\"]\n\n/* InputGroupButton props plus the Button props (except `size`) that fall through to it, as in React. /\nexport type InputGroupButtonProps = InputGroupButtonOwnProps &\n Omit<ButtonProps, keyof InputGroupButtonOwnProps \| \"size\">\n\n/\n A ghost `Button` sized from the group (React `InputGroup.Button`). Takes the\n * Button props except `size`; `pill` and `disabled` default to the group's.\n /\nexport const InputGroupButton = InputGroupButtonComponent as typeof InputGroupButtonComponent & {\n new (): { $props: InputGroupButtonProps }\n}\n\n/* Text and icons inside an addon: prefixes, units, counters (React `InputGroup.Text`). */\nexport const InputGroupText = defineComponent({\n name: \"InputGroupText\",\n setup(_props, { slots }) {\n return () => h(\"span\", { \"data-slot\": \"input-group-text\", \"class\": s.Text }, slots.default?.())\n },\n})\n\nexport type InputGroupTextProps = HTMLAttributes\n"]}

package/dist/es/components/Menu/Menu.js CHANGED Viewed

@@ -1,13 +1,14 @@
-import { cloneVNode, computed, createCommentVNode, defineComponent, h, inject, onBeforeUnmount, onMounted, provide, ref, shallowRef, watch, withCtx, } from "vue";
+import { cloneVNode, computed, createCommentVNode, defineComponent, h, inject, markRaw, onBeforeUnmount, onMounted, provide, ref, shallowRef, watch, withCtx, } from "vue";
 import { DropdownMenuContent as RekaDropdownMenuContent, DropdownMenuPortal as RekaDropdownMenuPortal, DropdownMenuRoot as RekaDropdownMenuRoot, Presence, injectDropdownMenuRootContext, useDirection, useId, } from "reka-ui";
 import { useEscCloseStack } from "../../composables/useEscCloseStack.js";
 import { firstElementChild } from "../Tooltip/slot.js";
-import { preventDefaultHandler, toCssVariables } from "../../lib/helpers.js";
+import { keepMovedFocus, preventDefaultHandler, toCssVariables } from "../../lib/helpers.js";
 import { Button } from "../Button/index.js";
 import { Check, ChevronRight } from "../Icon/index.js";
 import { useLinkComponent } from "../PlexUIProvider/internal.js";
 import { composeEventHandlers, mergeSlotProps } from "../Tooltip/slot.js";
 import { TransitionGroup } from "../Transition/index.js";
+import { createExitGuard, overlayTiming } from "../Transition/shared.js";
 import { MenuLevelKey, MenuRootInternalsKey, MenuSubInternalsKey, SUB_CLOSE_KEYS, SUB_OPEN_KEYS, box, compose, getCheckedState, getOpenState, isIndeterminate, provideMenuContentContext, selectableItemListeners, splitListeners, trackKeyboardUse, useMenuItemImpl, useMenuItemSelect, useMenuLevel, useMenuRootInternals, useMenuSubInternals, whenMouse, } from "./internal.js";
 import s from "@plexui/styles/components/Menu/Menu.module.css";
 const MenuContextKey = Symbol("PlexUIMenu");
@@ -196,6 +197,19 @@ const contentVariables = {
     "--reka-dropdown-menu-trigger-height": null,
 };
 const sizeProp = [Number, String];
+// The element Reka's content renders (`as`), without the `forceMount` Reka
+// forwards down to it. Raw: Reka passes `as` through reactive props, and Vue
+// warns about a component made reactive.
+const MenuContentElement = markRaw(defineComponent({
+    name: "MenuContentElement",
+    inheritAttrs: false,
+    setup(_props, { slots, attrs }) {
+        return () => {
+            const { forceMount: _forceMount, ...rest } = attrs;
+            return h("div", rest, slots.default?.());
+        };
+    },
+}));
 /** Content of the root menu, mounted while it is open (Radix's DropdownMenuContent). */
 const MenuRootContentImpl = defineComponent({
     name: "MenuRootContentImpl",
@@ -211,6 +225,7 @@ const MenuRootContentImpl = defineComponent({
         size: String,
         pill: Boolean,
         onCloseAutoFocus: { type: Function, required: true },
+        exitGuard: { type: Object, required: true },
     },
     setup(props, { slots }) {
         const rootContext = injectDropdownMenuRootContext();
@@ -236,6 +251,7 @@ const MenuRootContentImpl = defineComponent({
                 const event = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, { bubbles: false, cancelable: true });
                 const handleCloseAutoFocus = (closeEvent) => {
                     props.onCloseAutoFocus(closeEvent);
+                    keepMovedFocus(closeEvent);
                     if (closeEvent.defaultPrevented)
                         return;
                     if (!hasInteractedOutside)
@@ -252,6 +268,7 @@ const MenuRootContentImpl = defineComponent({
             }, 0);
         };
         const onInteractOutside = (event) => {
+            props.exitGuard.onInteractOutside(event);
             if (event.defaultPrevented)
                 return;
             const originalEvent = event.detail.originalEvent;
@@ -269,6 +286,8 @@ const MenuRootContentImpl = defineComponent({
         return () => {
             const isHorizontal = props.layout === "horizontal";
             return h(RekaDropdownMenuContent, {
+                "forceMount": true,
+                "as": MenuContentElement,
                 "side": props.side,
                 "sideOffset": props.sideOffset,
                 "align": props.align,
@@ -357,12 +376,13 @@ export const MenuContent = defineComponent({
     setup(props, { slots, emit }) {
         const { open } = useMenuContext();
         const onCloseAutoFocus = (event) => emit("closeAutoFocus", event);
+        const exitGuard = createExitGuard();
         return () => h(RekaDropdownMenuPortal, null, {
             default: () => [
-                h(TransitionGroup, { class: s.Menu, enterDuration: 350, exitDuration: 200, disableAnimations: true }, {
+                h(TransitionGroup, { class: s.Menu, ...overlayTiming, ...exitGuard.transition, overlay: true }, {
                     default: () => [
                         open.value
-                            ? h(MenuRootContentImpl, { key: "dropdown", ...props, onCloseAutoFocus }, { default: () => slots.default?.() })
+                            ? h(MenuRootContentImpl, { key: "dropdown", ...props, onCloseAutoFocus, exitGuard }, { default: () => slots.default?.() })
                             : createCommentVNode(),
                     ],
                 }),
@@ -817,6 +837,8 @@ const MenuSubContentImpl = defineComponent({
             handlers.onKeydown(event);
         };
         return () => h(RekaDropdownMenuContent, {
+            "forceMount": true,
+            "as": MenuContentElement,
             "side": internals.dir.value === "rtl" ? "left" : "right",
             "align": "start",
             "sideOffset": props.sideOffset,
@@ -889,7 +911,7 @@ export const MenuSubContent = defineComponent({
         const { open } = useSubmenuContext();
         return () => h(RekaDropdownMenuPortal, null, {
             default: () => [
-                h(TransitionGroup, { class: s.Menu, enterDuration: 350, exitDuration: 200, disableAnimations: true }, {
+                h(TransitionGroup, { class: s.Menu, ...overlayTiming, overlay: true }, {
                     default: () => [
                         open.value
                             ? h(MenuSubContentImpl, { key: "submenu", ...props }, { default: () => slots.default?.() })