npm - @plexui/vue - Versions diffs - 0.1.1 → 0.1.2 - Mend

@plexui/vue 0.1.1 → 0.1.2

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 (4) hide show

package/dist/es/components/Dialog/Dialog.js +6 -0
package/dist/es/components/Dialog/Dialog.js.map +1 -1
package/dist/types/components/Dialog/Dialog.d.ts +17 -0
package/package.json +1 -1

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

@@ -88,6 +88,11 @@ export const DialogContent = defineComponent({
         width: { type: [Number, String], default: 480 },
         /** Renders the close button in the top corner. @default true */
         showClose: { type: Boolean, default: true },
+        /**
+         * Rounder panel and a round close button, for dialogs that sit beside pill controls.
+         * @default false
+         */
+        pill: { type: Boolean, default: false },
         /**
          * Where the panel sits: centered, near the top, a sheet along the bottom,
          * a full-height panel on the start or end side, or the whole screen.
@@ -140,6 +145,7 @@ export const DialogContent = defineComponent({
                 "style": toCssVariables({ "dialog-width": props.width }),
                 "data-placement": props.placement === "center" ? undefined : props.placement,
                 "data-mobile-placement": props.mobilePlacement,
+                "data-pill": props.pill ? "" : undefined,
                 "onOpenAutoFocus": props.onOpenAutoFocus,
                 "onCloseAutoFocus": props.onCloseAutoFocus,
                 // Radix labels and describes the content only by mounted parts

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 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 \"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 { 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"]}

package/dist/types/components/Dialog/Dialog.d.ts CHANGED Viewed

@@ -34,6 +34,14 @@ export declare const DialogContent: import("vue").DefineComponent<import("vue").
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Rounder panel and a round close button, for dialogs that sit beside pill controls.
+     * @default false
+     */
+    pill: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Where the panel sits: centered, near the top, a sheet along the bottom,
      * a full-height panel on the start or end side, or the whole screen.
@@ -62,6 +70,14 @@ export declare const DialogContent: import("vue").DefineComponent<import("vue").
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Rounder panel and a round close button, for dialogs that sit beside pill controls.
+     * @default false
+     */
+    pill: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Where the panel sits: centered, near the top, a sheet along the bottom,
      * a full-height panel on the start or end side, or the whole screen.
@@ -79,6 +95,7 @@ export declare const DialogContent: import("vue").DefineComponent<import("vue").
     onCloseAutoFocus: PropType<(event: Event) => void>;
 }>> & Readonly<{}>, {
     width: string | number;
+    pill: boolean;
     showClose: boolean;
     placement: DialogPlacement;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@plexui/vue",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Plex UI components for Vue 3, built on Reka UI and the shared @plexui/styles CSS",
   "type": "module",
   "license": "MIT",