@manhphi1309/drawer 0.2.2 → 0.2.4

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/index.cjs +12 -15
  2. package/dist/index.mjs +13 -16
  3. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -83,30 +83,27 @@ function DrawerContent({ className, children, ...props }) {
83
83
  });
84
84
  }
85
85
  function DrawerHeader({ className, leftAction, rightAction, children, ...props }) {
86
- if (leftAction || rightAction) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
86
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
87
87
  "data-slot": "drawer-header",
88
- className: (0, _manhphi1309_utils.cn)("grid grid-cols-[1fr_auto_1fr] items-center gap-2 px-4 py-2", className),
88
+ 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", className),
89
89
  ...props,
90
- children: [
90
+ children: leftAction || rightAction ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
91
91
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
92
- className: "flex justify-start",
92
+ className: "flex flex-1 justify-start min-w-0",
93
93
  children: leftAction
94
94
  }),
95
95
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
96
- className: "flex flex-col gap-0.5 text-center",
96
+ className: "flex flex-col gap-0.5 text-center shrink min-w-0 max-w-[70%] px-2",
97
97
  children
98
98
  }),
99
99
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
100
- className: "flex justify-end",
100
+ className: "flex flex-1 justify-end min-w-0",
101
101
  children: rightAction
102
102
  })
103
- ]
104
- });
105
- return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
106
- "data-slot": "drawer-header",
107
- className: (0, _manhphi1309_utils.cn)("flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-left", className),
108
- ...props,
109
- children
103
+ ] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
104
+ className: "flex w-full flex-col gap-0.5",
105
+ children
106
+ })
110
107
  });
111
108
  }
112
109
  function DrawerFooter({ className, ...props }) {
@@ -119,14 +116,14 @@ function DrawerFooter({ className, ...props }) {
119
116
  function DrawerTitle({ className, ...props }) {
120
117
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(vaul.Drawer.Title, {
121
118
  "data-slot": "drawer-title",
122
- className: (0, _manhphi1309_utils.cn)("text-base font-medium text-foreground", className),
119
+ className: (0, _manhphi1309_utils.cn)("text-base font-medium text-foreground line-clamp-2", className),
123
120
  ...props
124
121
  });
125
122
  }
126
123
  function DrawerDescription({ className, ...props }) {
127
124
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(vaul.Drawer.Description, {
128
125
  "data-slot": "drawer-description",
129
- className: (0, _manhphi1309_utils.cn)("text-sm text-muted-foreground", className),
126
+ className: (0, _manhphi1309_utils.cn)("text-sm text-muted-foreground line-clamp-2", className),
130
127
  ...props
131
128
  });
132
129
  }
package/dist/index.mjs CHANGED
@@ -3,7 +3,7 @@ import * as React from "react";
3
3
  import { Drawer as Drawer$1 } from "vaul";
4
4
  import { useThemeColorAnimation } from "@manhphi1309/hooks";
5
5
  import { cn } from "@manhphi1309/utils";
6
- import { jsx, jsxs } from "react/jsx-runtime";
6
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
7
7
  //#region index.tsx
8
8
  function Drawer({ ...props }) {
9
9
  const [internalOpen, setInternalOpen] = React.useState(props.defaultOpen ?? false);
@@ -59,30 +59,27 @@ function DrawerContent({ className, children, ...props }) {
59
59
  });
60
60
  }
61
61
  function DrawerHeader({ className, leftAction, rightAction, children, ...props }) {
62
- if (leftAction || rightAction) return /* @__PURE__ */ jsxs("div", {
62
+ return /* @__PURE__ */ jsx("div", {
63
63
  "data-slot": "drawer-header",
64
- className: cn("grid grid-cols-[1fr_auto_1fr] items-center gap-2 px-4 py-2", className),
64
+ 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", className),
65
65
  ...props,
66
- children: [
66
+ children: leftAction || rightAction ? /* @__PURE__ */ jsxs(Fragment, { children: [
67
67
  /* @__PURE__ */ jsx("div", {
68
- className: "flex justify-start",
68
+ className: "flex flex-1 justify-start min-w-0",
69
69
  children: leftAction
70
70
  }),
71
71
  /* @__PURE__ */ jsx("div", {
72
- className: "flex flex-col gap-0.5 text-center",
72
+ className: "flex flex-col gap-0.5 text-center shrink min-w-0 max-w-[70%] px-2",
73
73
  children
74
74
  }),
75
75
  /* @__PURE__ */ jsx("div", {
76
- className: "flex justify-end",
76
+ className: "flex flex-1 justify-end min-w-0",
77
77
  children: rightAction
78
78
  })
79
- ]
80
- });
81
- return /* @__PURE__ */ jsx("div", {
82
- "data-slot": "drawer-header",
83
- className: cn("flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-left", className),
84
- ...props,
85
- children
79
+ ] }) : /* @__PURE__ */ jsx("div", {
80
+ className: "flex w-full flex-col gap-0.5",
81
+ children
82
+ })
86
83
  });
87
84
  }
88
85
  function DrawerFooter({ className, ...props }) {
@@ -95,14 +92,14 @@ function DrawerFooter({ className, ...props }) {
95
92
  function DrawerTitle({ className, ...props }) {
96
93
  return /* @__PURE__ */ jsx(Drawer$1.Title, {
97
94
  "data-slot": "drawer-title",
98
- className: cn("text-base font-medium text-foreground", className),
95
+ className: cn("text-base font-medium text-foreground line-clamp-2", className),
99
96
  ...props
100
97
  });
101
98
  }
102
99
  function DrawerDescription({ className, ...props }) {
103
100
  return /* @__PURE__ */ jsx(Drawer$1.Description, {
104
101
  "data-slot": "drawer-description",
105
- className: cn("text-sm text-muted-foreground", className),
102
+ className: cn("text-sm text-muted-foreground line-clamp-2", className),
106
103
  ...props
107
104
  });
108
105
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@manhphi1309/drawer",
3
- "version": "0.2.2",
3
+ "version": "0.2.4",
4
4
  "sideEffects": false,
5
5
  "main": "./dist/index.cjs",
6
6
  "module": "./dist/index.mjs",