prom-pal-ui 1.3.7 → 1.3.8

package/build/components/cjs/index.js

@@ -834,8 +834,8 @@ const createLucideIcon = (iconName, iconNode) => {
  */
 
 
-const __iconNode$3 = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$3);
+const __iconNode$5 = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$5);
 
 /**
  * @license lucide-react v0.562.0 - ISC
@@ -845,8 +845,8 @@ const Check = createLucideIcon("check", __iconNode$3);
  */
 
 
-const __iconNode$2 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$2);
+const __iconNode$4 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$4);
 
 /**
  * @license lucide-react v0.562.0 - ISC
@@ -856,8 +856,56 @@ const ChevronDown = createLucideIcon("chevron-down", __iconNode$2);
  */
 
 
-const __iconNode$1 = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
-const ChevronUp = createLucideIcon("chevron-up", __iconNode$1);
+const __iconNode$3 = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
+const ChevronUp = createLucideIcon("chevron-up", __iconNode$3);
+
+/**
+ * @license lucide-react v0.562.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$2 = [
+  [
+    "path",
+    {
+      d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49",
+      key: "ct8e1f"
+    }
+  ],
+  ["path", { d: "M14.084 14.158a3 3 0 0 1-4.242-4.242", key: "151rxh" }],
+  [
+    "path",
+    {
+      d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143",
+      key: "13bj9a"
+    }
+  ],
+  ["path", { d: "m2 2 20 20", key: "1ooewy" }]
+];
+const EyeOff = createLucideIcon("eye-off", __iconNode$2);
+
+/**
+ * @license lucide-react v0.562.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$1 = [
+  [
+    "path",
+    {
+      d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
+      key: "1nclc0"
+    }
+  ],
+  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
+];
+const Eye = createLucideIcon("eye", __iconNode$1);
 
 /**
  * @license lucide-react v0.562.0 - ISC
@@ -21705,6 +21753,11 @@ function PromLabel(_a) {
 var PromInput = function (_a) {
     var name = _a.name, mask = _a.mask, label = _a.label, isLoad = _a.isLoad, styleTitle = _a.styleTitle, styleWrapper = _a.styleWrapper, _b = _a.type, type = _b === void 0 ? "text" : _b, allowedPattern = _a.allowedPattern, props = __rest(_a, ["name", "mask", "label", "isLoad", "styleTitle", "styleWrapper", "type", "allowedPattern"]);
     var _c = reactHookForm.useFormContext(), control = _c.control, setValue = _c.setValue;
+    var _d = React.useState(false), showPassword = _d[0], setShowPassword = _d[1];
+    var togglePasswordVisibility = function () {
+        setShowPassword(!showPassword);
+    };
+    var inputType = type === "password" && showPassword ? "text" : type;
     var handleChange = function (value) {
         var processedValue = value;
         if (mask) {
@@ -21719,7 +21772,7 @@ var PromInput = function (_a) {
     };
     return (jsxRuntimeExports.jsx(PromFormFiled, { control: control, name: name, render: function (_a) {
             var field = _a.field, fieldState = _a.fieldState;
-            return (jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [label && (jsxRuntimeExports.jsx(PromLabel, { className: cn("block text-sm font-medium", styleTitle), children: label })), jsxRuntimeExports.jsx("input", __assign({}, field, props, { onChange: function (e) { return handleChange(e.target.value); }, type: type, disabled: isLoad || props.disabled, className: cn("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", styleWrapper) })), fieldState.error && (jsxRuntimeExports.jsx("p", { className: "text-red-500 text-sm mt-1", children: fieldState.error.message }))] }));
+            return (jsxRuntimeExports.jsxs("div", { className: "space-y-2 relative flex flex-col items-center justify-center", children: [label && (jsxRuntimeExports.jsx(PromLabel, { className: cn("block text-sm font-medium text-center", styleTitle), children: label })), jsxRuntimeExports.jsxs("div", { className: "relative w-full max-w-md", children: [jsxRuntimeExports.jsx("input", __assign({}, field, props, { type: inputType, onChange: function (e) { return handleChange(e.target.value); }, disabled: isLoad || props.disabled, className: cn("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", styleWrapper) })), type === "password" && (jsxRuntimeExports.jsx("button", { type: "button", onClick: togglePasswordVisibility, className: "absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-700 focus:outline-none", tabIndex: -1, disabled: props.disabled, children: showPassword ? (jsxRuntimeExports.jsx(EyeOff, { className: "h-4 w-4" })) : (jsxRuntimeExports.jsx(Eye, { className: "h-4 w-4" })) }))] }), fieldState.error && (jsxRuntimeExports.jsx("p", { className: "text-red-500 text-sm mt-1 text-center w-full", children: fieldState.error.message }))] }));
         } }));
 };
 

package/build/components/esm/index.js

@@ -814,8 +814,8 @@ const createLucideIcon = (iconName, iconNode) => {
  */
 
 
-const __iconNode$3 = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$3);
+const __iconNode$5 = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$5);
 
 /**
  * @license lucide-react v0.562.0 - ISC
@@ -825,8 +825,8 @@ const Check = createLucideIcon("check", __iconNode$3);
  */
 
 
-const __iconNode$2 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$2);
+const __iconNode$4 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$4);
 
 /**
  * @license lucide-react v0.562.0 - ISC
@@ -836,8 +836,56 @@ const ChevronDown = createLucideIcon("chevron-down", __iconNode$2);
  */
 
 
-const __iconNode$1 = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
-const ChevronUp = createLucideIcon("chevron-up", __iconNode$1);
+const __iconNode$3 = [["path", { d: "m18 15-6-6-6 6", key: "153udz" }]];
+const ChevronUp = createLucideIcon("chevron-up", __iconNode$3);
+
+/**
+ * @license lucide-react v0.562.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$2 = [
+  [
+    "path",
+    {
+      d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49",
+      key: "ct8e1f"
+    }
+  ],
+  ["path", { d: "M14.084 14.158a3 3 0 0 1-4.242-4.242", key: "151rxh" }],
+  [
+    "path",
+    {
+      d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143",
+      key: "13bj9a"
+    }
+  ],
+  ["path", { d: "m2 2 20 20", key: "1ooewy" }]
+];
+const EyeOff = createLucideIcon("eye-off", __iconNode$2);
+
+/**
+ * @license lucide-react v0.562.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$1 = [
+  [
+    "path",
+    {
+      d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
+      key: "1nclc0"
+    }
+  ],
+  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
+];
+const Eye = createLucideIcon("eye", __iconNode$1);
 
 /**
  * @license lucide-react v0.562.0 - ISC
@@ -21685,6 +21733,11 @@ function PromLabel(_a) {
 var PromInput = function (_a) {
     var name = _a.name, mask = _a.mask, label = _a.label, isLoad = _a.isLoad, styleTitle = _a.styleTitle, styleWrapper = _a.styleWrapper, _b = _a.type, type = _b === void 0 ? "text" : _b, allowedPattern = _a.allowedPattern, props = __rest(_a, ["name", "mask", "label", "isLoad", "styleTitle", "styleWrapper", "type", "allowedPattern"]);
     var _c = useFormContext(), control = _c.control, setValue = _c.setValue;
+    var _d = useState(false), showPassword = _d[0], setShowPassword = _d[1];
+    var togglePasswordVisibility = function () {
+        setShowPassword(!showPassword);
+    };
+    var inputType = type === "password" && showPassword ? "text" : type;
     var handleChange = function (value) {
         var processedValue = value;
         if (mask) {
@@ -21699,7 +21752,7 @@ var PromInput = function (_a) {
     };
     return (jsxRuntimeExports.jsx(PromFormFiled, { control: control, name: name, render: function (_a) {
             var field = _a.field, fieldState = _a.fieldState;
-            return (jsxRuntimeExports.jsxs("div", { className: "space-y-2", children: [label && (jsxRuntimeExports.jsx(PromLabel, { className: cn("block text-sm font-medium", styleTitle), children: label })), jsxRuntimeExports.jsx("input", __assign({}, field, props, { onChange: function (e) { return handleChange(e.target.value); }, type: type, disabled: isLoad || props.disabled, className: cn("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", styleWrapper) })), fieldState.error && (jsxRuntimeExports.jsx("p", { className: "text-red-500 text-sm mt-1", children: fieldState.error.message }))] }));
+            return (jsxRuntimeExports.jsxs("div", { className: "space-y-2 relative flex flex-col items-center justify-center", children: [label && (jsxRuntimeExports.jsx(PromLabel, { className: cn("block text-sm font-medium text-center", styleTitle), children: label })), jsxRuntimeExports.jsxs("div", { className: "relative w-full max-w-md", children: [jsxRuntimeExports.jsx("input", __assign({}, field, props, { type: inputType, onChange: function (e) { return handleChange(e.target.value); }, disabled: isLoad || props.disabled, className: cn("file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", styleWrapper) })), type === "password" && (jsxRuntimeExports.jsx("button", { type: "button", onClick: togglePasswordVisibility, className: "absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-700 focus:outline-none", tabIndex: -1, disabled: props.disabled, children: showPassword ? (jsxRuntimeExports.jsx(EyeOff, { className: "h-4 w-4" })) : (jsxRuntimeExports.jsx(Eye, { className: "h-4 w-4" })) }))] }), fieldState.error && (jsxRuntimeExports.jsx("p", { className: "text-red-500 text-sm mt-1 text-center w-full", children: fieldState.error.message }))] }));
         } }));
 };
 

package/build/types/components/form/fields/types.d.ts

@@ -1,10 +1,10 @@
 import { ReactNode } from "react";
 export interface PromFieldProps {
-  errorStyle?: "";
-  errorMsg?: string;
-  errorDisplay?: boolean;
-  error?: (error: string) => ReactNode;
-  label?: string;
-  isLoad?: boolean;
-  skeleton?: ReactNode;
+    errorStyle?: "";
+    errorMsg?: string;
+    errorDisplay?: boolean;
+    error?: (error: string) => ReactNode;
+    label?: string;
+    isLoad?: boolean;
+    skeleton?: ReactNode;
 }

package/build/types/components/ui/button.d.ts

@@ -2,11 +2,11 @@ import { type VariantProps } from "class-variance-authority";
 import * as React from "react";
 import { PromComponentProps } from "../types";
 declare const buttonVariants: (props?: {
-    variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost";
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost";
     size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg";
 } & import("class-variance-authority/dist/types").ClassProp) => string;
 declare const skeletonVariants: (props?: {
-    variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost";
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost";
     size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg";
 } & import("class-variance-authority/dist/types").ClassProp) => string;
 interface PromButtonProps extends React.ComponentProps<"button">, VariantProps<typeof buttonVariants>, PromComponentProps {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "prom-pal-ui",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "type": "module",
   "main": "build/cjs/index.js",
   "module": "build/esm/index.js",