@manhphi1309/drawer 0.2.10 → 0.2.11

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.
package/dist/index.cjs CHANGED
@@ -69,9 +69,14 @@ function DrawerPortal({ ...props }) {
69
69
  ...props
70
70
  });
71
71
  }
72
- function DrawerClose({ ...props }) {
72
+ function DrawerClose({ onClick, ...props }) {
73
+ const context = react.useContext(DrawerContext);
73
74
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(vaul.Drawer.Close, {
74
75
  "data-slot": "drawer-close",
76
+ onClick: (e) => {
77
+ onClick?.(e);
78
+ context?.onOpenChange?.(false);
79
+ },
75
80
  ...props
76
81
  });
77
82
  }
@@ -153,7 +158,7 @@ function DrawerContent({ className, children, panels, activePanelIndex = 0, onPa
153
158
  "data-slot": "drawer-portal",
154
159
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(DrawerOverlay, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(vaul.Drawer.Content, {
155
160
  "data-slot": "drawer-content",
156
- className: (0, _manhphi1309_utils.cn)("group/drawer-content fixed z-50 flex h-auto flex-col bg-popover text-sm text-popover-foreground data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:mx-auto data-[vaul-drawer-direction=top]:sm:max-w-sm data-[vaul-drawer-direction=top]:sm:mx-auto", className),
161
+ className: (0, _manhphi1309_utils.cn)("group/drawer-content fixed z-50 flex h-auto flex-col bg-popover text-sm text-popover-foreground data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:mx-auto data-[vaul-drawer-direction=top]:sm:max-w-sm data-[vaul-drawer-direction=top]:sm:mx-auto", "after:absolute after:inset-x-0 after:top-full after:h-[50vh] after:bg-inherit", className),
157
162
  ...props,
158
163
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "mx-auto mt-4 hidden h-1 w-[40px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }), !panels ? children : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
159
164
  className: "overflow-hidden",
@@ -173,7 +178,7 @@ function DrawerContent({ className, children, panels, activePanelIndex = 0, onPa
173
178
  function DrawerHeader({ className, leftAction, rightAction, withSeparator = false, children, ...props }) {
174
179
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
175
180
  "data-slot": "drawer-header",
176
- className: (0, _manhphi1309_utils.cn)("flex items-center px-4 py-2 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:text-left", withSeparator && "border-b border-border", className),
181
+ className: (0, _manhphi1309_utils.cn)("flex items-center p-2 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:text-left", withSeparator && "border-b border-border", className),
177
182
  ...props,
178
183
  children: leftAction || rightAction ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
179
184
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
package/dist/index.d.cts CHANGED
@@ -19,6 +19,7 @@ declare function DrawerPortal({
19
19
  ...props
20
20
  }: React.ComponentProps<typeof Drawer$1.Portal>): React.JSX.Element;
21
21
  declare function DrawerClose({
22
+ onClick,
22
23
  ...props
23
24
  }: React.ComponentProps<typeof Drawer$1.Close>): React.JSX.Element;
24
25
  declare function DrawerOverlay({
package/dist/index.d.mts CHANGED
@@ -19,6 +19,7 @@ declare function DrawerPortal({
19
19
  ...props
20
20
  }: React.ComponentProps<typeof Drawer$1.Portal>): React.JSX.Element;
21
21
  declare function DrawerClose({
22
+ onClick,
22
23
  ...props
23
24
  }: React.ComponentProps<typeof Drawer$1.Close>): React.JSX.Element;
24
25
  declare function DrawerOverlay({
package/dist/index.mjs CHANGED
@@ -45,9 +45,14 @@ function DrawerPortal({ ...props }) {
45
45
  ...props
46
46
  });
47
47
  }
48
- function DrawerClose({ ...props }) {
48
+ function DrawerClose({ onClick, ...props }) {
49
+ const context = React.useContext(DrawerContext);
49
50
  return /* @__PURE__ */ jsx(Drawer$1.Close, {
50
51
  "data-slot": "drawer-close",
52
+ onClick: (e) => {
53
+ onClick?.(e);
54
+ context?.onOpenChange?.(false);
55
+ },
51
56
  ...props
52
57
  });
53
58
  }
@@ -129,7 +134,7 @@ function DrawerContent({ className, children, panels, activePanelIndex = 0, onPa
129
134
  "data-slot": "drawer-portal",
130
135
  children: [/* @__PURE__ */ jsx(DrawerOverlay, {}), /* @__PURE__ */ jsxs(Drawer$1.Content, {
131
136
  "data-slot": "drawer-content",
132
- className: cn("group/drawer-content fixed z-50 flex h-auto flex-col bg-popover text-sm text-popover-foreground data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:mx-auto data-[vaul-drawer-direction=top]:sm:max-w-sm data-[vaul-drawer-direction=top]:sm:mx-auto", className),
137
+ className: cn("group/drawer-content fixed z-50 flex h-auto flex-col bg-popover text-sm text-popover-foreground data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=bottom]:rounded-t-xl data-[vaul-drawer-direction=bottom]:border-t data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:rounded-r-xl data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:rounded-l-xl data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[calc(100%-1.5rem-env(safe-area-inset-top))] data-[vaul-drawer-direction=top]:rounded-b-xl data-[vaul-drawer-direction=top]:border-b data-[vaul-drawer-direction=left]:sm:max-w-sm data-[vaul-drawer-direction=right]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:max-w-sm data-[vaul-drawer-direction=bottom]:sm:mx-auto data-[vaul-drawer-direction=top]:sm:max-w-sm data-[vaul-drawer-direction=top]:sm:mx-auto", "after:absolute after:inset-x-0 after:top-full after:h-[50vh] after:bg-inherit", className),
133
138
  ...props,
134
139
  children: [/* @__PURE__ */ jsx("div", { className: "mx-auto mt-4 hidden h-1 w-[40px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }), !panels ? children : /* @__PURE__ */ jsx("div", {
135
140
  className: "overflow-hidden",
@@ -149,7 +154,7 @@ function DrawerContent({ className, children, panels, activePanelIndex = 0, onPa
149
154
  function DrawerHeader({ className, leftAction, rightAction, withSeparator = false, children, ...props }) {
150
155
  return /* @__PURE__ */ jsx("div", {
151
156
  "data-slot": "drawer-header",
152
- className: cn("flex items-center px-4 py-2 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:text-left", withSeparator && "border-b border-border", className),
157
+ className: cn("flex items-center p-2 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:text-left", withSeparator && "border-b border-border", className),
153
158
  ...props,
154
159
  children: leftAction || rightAction ? /* @__PURE__ */ jsxs(Fragment, { children: [
155
160
  /* @__PURE__ */ jsx("div", {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@manhphi1309/drawer",
3
- "version": "0.2.10",
3
+ "version": "0.2.11",
4
4
  "sideEffects": false,
5
5
  "main": "./dist/index.cjs",
6
6
  "module": "./dist/index.mjs",