@pixpilot/shadcn 1.0.0 → 1.2.0

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 (3) hide show
  1. package/dist/components/ui/dialog.d.ts +6 -0
  2. package/dist/components/ui/dialog.js +42 -9
  3. package/package.json +1 -1
package/dist/components/ui/dialog.d.ts CHANGED
@@ -4,6 +4,7 @@ import * as DialogPrimitive from "@radix-ui/react-dialog";
4
4
 
5
5
  //#region src/components/ui/dialog.d.ts
6
6
  declare function Dialog({
7
+ modal,
7
8
  ...props
8
9
  }: React.ComponentProps<typeof DialogPrimitive.Root>): react_jsx_runtime60.JSX.Element;
9
10
  declare function DialogTrigger({
@@ -23,9 +24,14 @@ declare function DialogContent({
23
24
  className,
24
25
  children,
25
26
  showCloseButton,
27
+ disableOutsideClick,
28
+ container,
29
+ onPointerDownOutside,
26
30
  ...props
27
31
  }: React.ComponentProps<typeof DialogPrimitive.Content> & {
28
32
  showCloseButton?: boolean;
33
+ disableOutsideClick?: boolean;
34
+ container?: HTMLElement | null;
29
35
  }): react_jsx_runtime60.JSX.Element;
30
36
  declare function DialogHeader({
31
37
  className,
package/dist/components/ui/dialog.js CHANGED
@@ -1,14 +1,27 @@
1
1
  import { cn } from "../../lib/utils.js";
2
- import "react";
2
+ import * as React from "react";
3
3
  import { jsx, jsxs } from "react/jsx-runtime";
4
4
  import { XIcon } from "lucide-react";
5
5
  import * as DialogPrimitive from "@radix-ui/react-dialog";
6
6
 
7
7
  //#region src/components/ui/dialog.tsx
8
- function Dialog({ ...props }) {
9
- return /* @__PURE__ */ jsx(DialogPrimitive.Root, {
10
- "data-slot": "dialog",
11
- ...props
8
+ const dialogOverlayBaseClass = "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50";
9
+ const DialogContainerContext = React.createContext(null);
10
+ const DialogContentPrimitive = DialogPrimitive.Content;
11
+ function Dialog({ modal,...props }) {
12
+ const [hasContainer, setHasContainer] = React.useState(false);
13
+ const contextValue = React.useMemo(() => ({
14
+ hasContainer,
15
+ modal,
16
+ setHasContainer
17
+ }), [hasContainer, modal]);
18
+ return /* @__PURE__ */ jsx(DialogContainerContext.Provider, {
19
+ value: contextValue,
20
+ children: /* @__PURE__ */ jsx(DialogPrimitive.Root, {
21
+ "data-slot": "dialog",
22
+ modal: hasContainer ? false : modal,
23
+ ...props
24
+ })
12
25
  });
13
26
  }
14
27
  function DialogTrigger({ ...props }) {
@@ -32,16 +45,36 @@ function DialogClose({ ...props }) {
32
45
  function DialogOverlay({ className,...props }) {
33
46
  return /* @__PURE__ */ jsx(DialogPrimitive.Overlay, {
34
47
  "data-slot": "dialog-overlay",
35
- className: cn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50", className),
48
+ className: cn(dialogOverlayBaseClass, className),
36
49
  ...props
37
50
  });
38
51
  }
39
- function DialogContent({ className, children, showCloseButton = true,...props }) {
52
+ function DialogContent({ className, children, showCloseButton = true, disableOutsideClick = false, container, onPointerDownOutside,...props }) {
53
+ const dialogContainer = React.use(DialogContainerContext);
54
+ React.useEffect(() => {
55
+ if (!dialogContainer) return;
56
+ dialogContainer.setHasContainer(Boolean(container));
57
+ }, [container, dialogContainer]);
40
58
  return /* @__PURE__ */ jsxs(DialogPortal, {
59
+ container: container ?? void 0,
41
60
  "data-slot": "dialog-portal",
42
- children: [/* @__PURE__ */ jsx(DialogOverlay, {}), /* @__PURE__ */ jsxs(DialogPrimitive.Content, {
61
+ children: [container ? /* @__PURE__ */ jsx("div", {
62
+ "aria-hidden": "true",
63
+ "data-slot": "dialog-overlay",
64
+ "data-state": "open",
65
+ className: cn(dialogOverlayBaseClass, "absolute")
66
+ }) : /* @__PURE__ */ jsx(DialogOverlay, {}), /* @__PURE__ */ jsxs(DialogContentPrimitive, {
43
67
  "data-slot": "dialog-content",
44
- className: cn("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg", className),
68
+ disableOutsidePointerEvents: container ? false : void 0,
69
+ onPointerDownOutside: (event) => {
70
+ onPointerDownOutside?.(event);
71
+ if (disableOutsideClick) {
72
+ event.preventDefault();
73
+ return;
74
+ }
75
+ if (container && !container.contains(event.target)) event.preventDefault();
76
+ },
77
+ className: cn("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg", container && "absolute", className),
45
78
  ...props,
46
79
  children: [children, showCloseButton && /* @__PURE__ */ jsxs(DialogPrimitive.Close, {
47
80
  "data-slot": "dialog-close",
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pixpilot/shadcn",
3
3
  "type": "module",
4
- "version": "1.0.0",
4
+ "version": "1.2.0",
5
5
  "description": "A collection of reusable UI components built with shadcn/ui and Radix UI primitives.",
6
6
  "author": "m.doaie <m.doaie@hotmail.com>",
7
7
  "license": "MIT",