@oneplatformdev/ui 0.0.1-beta.60 → 0.0.1-beta.61

package/Input/Input.mjs

@@ -1,66 +1,67 @@
-import { jsxs as f, jsx as s } from "react/jsx-runtime";
-import u, { useState as N } from "react";
-import { Eye as g, EyeOff as b } from "lucide-react";
-import { inputVariants as v } from "./inputVariants.mjs";
-import { cn as h } from "@oneplatformdev/utils";
-const c = u.forwardRef(
-  (t, a) => {
+import { jsxs as y, jsx as a } from "react/jsx-runtime";
+import d, { useState as b } from "react";
+import { Eye as v, EyeOff as w } from "lucide-react";
+import { inputVariants as h } from "./inputVariants.mjs";
+import { cn as f } from "@oneplatformdev/utils";
+const p = d.forwardRef(
+  (t, e) => {
     const {
-      className: e,
+      className: s,
       variant: o,
-      type: i,
-      slotProps: { input: l } = {},
-      onChange: m,
-      onTransform: n,
-      ...y
-    } = t, { startAdornment: p } = l || {};
-    return /* @__PURE__ */ f("div", { className: "relative", children: [
-      !!p && /* @__PURE__ */ s("span", { className: "absolute left-[10px] top-1/2 -translate-y-1/2", children: p }),
-      /* @__PURE__ */ s(
+      type: c,
+      slotProps: { input: u, wrapper: n } = {},
+      onChange: l,
+      onTransform: i,
+      ...g
+    } = t, { startAdornment: m } = u || {};
+    return /* @__PURE__ */ y("div", { ...n || {}, className: f("relative", n == null ? void 0 : n.className), children: [
+      !!m && /* @__PURE__ */ a("span", { className: "absolute left-[10px] top-1/2 -translate-y-1/2", children: m }),
+      /* @__PURE__ */ a(
         "input",
         {
-          type: i,
-          className: h(
-            v({ variant: o, className: e }),
-            !!p && "pl-8"
+          type: c,
+          className: f(
+            h({ variant: o, className: s }),
+            !!m && "pl-8"
           ),
-          ref: a,
-          ...y,
+          ref: e,
+          ...g,
           onChange: (r) => {
-            typeof (n == null ? void 0 : n(r.target.value, r)) == "string" && (r.target.value = n(r.target.value, r)), m && m(r);
+            typeof (i == null ? void 0 : i(r.target.value, r)) == "string" && (r.target.value = i(r.target.value, r)), l && l(r);
           }
         }
       )
     ] });
   }
 );
-c.displayName = "Input";
-const d = u.forwardRef(
-  (t, a) => {
-    const [e, o] = N(!1), i = e ? "text" : "password", l = () => {
-      o(!e);
+p.displayName = "Input";
+const N = d.forwardRef(
+  (t, e) => {
+    var n, l, i;
+    const [s, o] = b(!1), c = s ? "text" : "password", u = () => {
+      o(!s);
     };
-    return /* @__PURE__ */ f("div", { className: "relative", children: [
-      /* @__PURE__ */ s(c, { ...t, type: i, className: "pr-8", ref: a }),
-      /* @__PURE__ */ s(w, { isVisible: e, onClick: l })
+    return /* @__PURE__ */ y("div", { ...((n = t == null ? void 0 : t.slotProps) == null ? void 0 : n.wrapper) || {}, className: f("relative", (i = (l = t == null ? void 0 : t.slotProps) == null ? void 0 : l.wrapper) == null ? void 0 : i.className), children: [
+      /* @__PURE__ */ a(p, { ...t, type: c, className: "pr-8", ref: e }),
+      /* @__PURE__ */ a(I, { isVisible: s, onClick: u })
     ] });
   }
 );
-d.displayName = "PasswordInput";
-const w = ({ isVisible: t, onClick: a }) => /* @__PURE__ */ s(
+N.displayName = "PasswordInput";
+const I = ({ isVisible: t, onClick: e }) => /* @__PURE__ */ a(
   "button",
   {
     type: "button",
-    onClick: a,
+    onClick: e,
     className: "absolute top-1/2 right-3 transform -translate-y-1/2",
-    children: t ? /* @__PURE__ */ s(g, { size: 16 }) : /* @__PURE__ */ s(b, { size: 16 })
+    children: t ? /* @__PURE__ */ a(v, { size: 16 }) : /* @__PURE__ */ a(w, { size: 16 })
   }
-), I = u.forwardRef(
-  ({ type: t, ...a }, e) => t === "password" ? /* @__PURE__ */ s(d, { type: t, ...a, ref: e }) : /* @__PURE__ */ s(c, { type: t, ...a, ref: e })
+), x = d.forwardRef(
+  ({ type: t, ...e }, s) => t === "password" ? /* @__PURE__ */ a(N, { type: t, ...e, ref: s }) : /* @__PURE__ */ a(p, { type: t, ...e, ref: s })
 );
-I.displayName = "Input";
+x.displayName = "Input";
 export {
-  c as BaseInput,
-  I as Input,
-  d as PasswordInput
+  p as BaseInput,
+  x as Input,
+  N as PasswordInput
 };

package/Input/Input.types.d.ts

@@ -1,12 +1,13 @@
 import { inputVariants } from './inputVariants';
 import { VariantProps } from 'class-variance-authority';
-import { default as React, ChangeEvent, ReactNode } from 'react';
+import { default as React, ChangeEvent, HTMLAttributes, ReactNode } from 'react';
 
 export interface InputSlotInputProps {
     startAdornment?: ReactNode;
 }
 export interface InputSlotProps {
     input?: InputSlotInputProps;
+    wrapper?: HTMLAttributes<HTMLDivElement>;
 }
 export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>, VariantProps<typeof inputVariants> {
     slotProps?: InputSlotProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oneplatformdev/ui",
-  "version": "0.0.1-beta.60",
+  "version": "0.0.1-beta.61",
   "description": "UI React Components.",
   "author": "One Platform Development Team",
   "keywords": [

package/tailwind.config.mjs

@@ -14,20 +14,20 @@ const r = (a, e = "hsl") => `${e}(var(${a}))`, d = {
   // 	'&:is(.dark *)',
   // ] ],
   theme: {
-    screens: {
-      sm: "480px",
-      md: "768px",
-      lg: "976px",
-      xl: "1440px"
-    },
-    container: {
-      center: !0,
-      padding: "2rem",
-      screens: {
-        "2xl": "1536px"
-      }
-    },
     extend: {
+      screens: {
+        sm: "480px",
+        md: "768px",
+        lg: "976px",
+        xl: "1440px"
+      },
+      container: {
+        center: !0,
+        padding: "2rem",
+        screens: {
+          "2xl": "1536px"
+        }
+      },
       borderRadius: {
         sm: "calc(var(--radius) - 4px)",
         md: "calc(var(--radius) - 2px)",