@oneplatformdev/ui 0.0.1-beta.87 → 0.0.1-beta.89

package/Dialog/Dialog.d.ts

@@ -5,7 +5,9 @@ declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.Dia
 declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
 declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
 declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    showCloseButton?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
 declare const DialogHeader: {
     ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/Dialog/Dialog.mjs

@@ -1,9 +1,9 @@
 import { jsx as o, jsxs as d } from "react/jsx-runtime";
 import * as l from "react";
 import * as e from "@radix-ui/react-dialog";
-import { X as c } from "lucide-react";
+import { X as m } from "lucide-react";
 import { cn as i } from "@oneplatformdev/utils";
-const b = e.Root, h = e.Trigger, m = e.Portal, w = e.Close, n = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
+const h = e.Root, w = e.Trigger, f = e.Portal, v = e.Close, n = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
   e.Overlay,
   {
     ref: s,
@@ -15,12 +15,12 @@ const b = e.Root, h = e.Trigger, m = e.Portal, w = e.Close, n = l.forwardRef(({
   }
 ));
 n.displayName = e.Overlay.displayName;
-const f = l.forwardRef(({ className: a, children: t, ...s }, r) => /* @__PURE__ */ d(m, { children: [
+const p = l.forwardRef(({ className: a, children: t, showCloseButton: s = !0, ...r }, c) => /* @__PURE__ */ d(f, { children: [
   /* @__PURE__ */ o(n, {}),
   /* @__PURE__ */ d(
     e.Content,
     {
-      ref: r,
+      ref: c,
       className: i(
         "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg",
         "duration-200 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 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
@@ -28,19 +28,19 @@ const f = l.forwardRef(({ className: a, children: t, ...s }, r) => /* @__PURE__
         "bg-[#FCFCFC] border border-[#E8E9EB] rounded-[16px]",
         a
       ),
-      ...s,
+      ...r,
       children: [
         t,
-        /* @__PURE__ */ d(e.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
-          /* @__PURE__ */ o(c, { className: "h-4 w-4" }),
+        s && /* @__PURE__ */ d(e.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground w-10 aspect-square", children: [
+          /* @__PURE__ */ o(m, { className: "h-4 w-4" }),
           /* @__PURE__ */ o("span", { className: "sr-only", children: "Close" })
         ] })
       ]
     }
   )
 ] }));
-f.displayName = e.Content.displayName;
-const p = ({
+p.displayName = e.Content.displayName;
+const g = ({
   className: a,
   ...t
 }) => /* @__PURE__ */ o(
@@ -53,8 +53,8 @@ const p = ({
     ...t
   }
 );
-p.displayName = "DialogHeader";
-const g = ({
+g.displayName = "DialogHeader";
+const u = ({
   className: a,
   ...t
 }) => /* @__PURE__ */ o(
@@ -67,8 +67,8 @@ const g = ({
     ...t
   }
 );
-g.displayName = "DialogFooter";
-const u = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
+u.displayName = "DialogFooter";
+const x = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
   e.Title,
   {
     ref: s,
@@ -79,8 +79,8 @@ const u = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
     ...t
   }
 ));
-u.displayName = e.Title.displayName;
-const x = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
+x.displayName = e.Title.displayName;
+const y = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
   e.Description,
   {
     ref: s,
@@ -88,16 +88,16 @@ const x = l.forwardRef(({ className: a, ...t }, s) => /* @__PURE__ */ o(
     ...t
   }
 ));
-x.displayName = e.Description.displayName;
+y.displayName = e.Description.displayName;
 export {
-  b as Dialog,
-  w as DialogClose,
-  f as DialogContent,
-  x as DialogDescription,
-  g as DialogFooter,
-  p as DialogHeader,
+  h as Dialog,
+  v as DialogClose,
+  p as DialogContent,
+  y as DialogDescription,
+  u as DialogFooter,
+  g as DialogHeader,
   n as DialogOverlay,
-  m as DialogPortal,
-  u as DialogTitle,
-  h as DialogTrigger
+  f as DialogPortal,
+  x as DialogTitle,
+  w as DialogTrigger
 };

package/Dropzone/Dropzone.d.ts

@@ -1,4 +1,4 @@
-import { DropzoneProps } from './Dropzone.types';
+import { DropzoneControl, DropzoneProps } from './Dropzone.types';
 
 /**
  * Dropzone component - A drag-and-drop file upload area with image previews, error handling, and localization.
@@ -19,4 +19,4 @@ import { DropzoneProps } from './Dropzone.types';
  * @param {React.Ref<HTMLDivElement>} ref - Ref for the root dropzone container.
  * @returns {JSX.Element} The rendered Dropzone component.
  */
-export declare const Dropzone: import('react').ForwardRefExoticComponent<DropzoneProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const Dropzone: import('react').ForwardRefExoticComponent<DropzoneProps & import('react').RefAttributes<DropzoneControl>>;

package/Dropzone/Dropzone.mjs

@@ -1,56 +1,57 @@
 import { jsxs as r, jsx as i, Fragment as U } from "react/jsx-runtime";
-import { forwardRef as j, useState as g } from "react";
-import { useDropzone as O } from "react-dropzone";
-import { Card as X } from "../Card/Card.mjs";
-import { X as Y } from "lucide-react";
+import { X as j } from "lucide-react";
+import { forwardRef as H, useState as w, useImperativeHandle as O } from "react";
+import { useDropzone as X } from "react-dropzone";
 import { cn as f } from "@oneplatformdev/utils";
+import { Card as Y } from "../Card/Card.mjs";
 import { F as q, D as G } from "../DropzoneFilePreview-Dhtv8F4u.js";
-import { DefaultFileIcon as H, isFile as u, extractName as J } from "./DropzoneUtils.mjs";
-import { DropzoneSinglePickPreview as K } from "./DropzoneSinglePickPreview.mjs";
-const Q = j(
+import { DropzoneSinglePickPreview as J } from "./DropzoneSinglePickPreview.mjs";
+import { DefaultFileIcon as K, isFile as g, extractName as Q } from "./DropzoneUtils.mjs";
+const R = H(
   ({
     acceptTypes: y = G,
     maxSizeMB: F,
-    maxFiles: h = 1,
+    maxFiles: v = 1,
     onErrors: a,
     hideErrors: D = !1,
     disabled: p = !1,
     classNames: o,
     value: z = [],
     onChangeValue: s,
-    className: E,
-    labelDropzonePrompt: I = "Drop files here or click to select",
+    className: I,
+    labelDropzonePrompt: E = "Drop files here or click to select",
     labelDropzoneSubPrompt: b = "",
-    labelOrClickToSelect: R = "Click to select files",
+    labelOrClickToSelect: Z = "Click to select files",
     labelSelectedFiles: S = "Selected Files",
     labelUploadErrors: N = "Upload Errors",
     labelFileTooLarge: W = "File is too large",
     labelInvalidFileType: k = "Invalid file type",
     singlePick: c = !1,
-    ...T
-  }, _) => {
-    const [n, v] = g(z), [m, A] = g([]), B = (e, l) => {
-      A(l), a == null || a(l);
-      const t = c ? e.slice(0, 1) : [...n, ...e].slice(0, h);
-      v(t), s == null || s(t);
-    }, w = (e, l) => {
+    ...B
+  }, T) => {
+    const [n, x] = w(z), [m, _] = w([]), A = (e, l) => {
+      _(l), a == null || a(l);
+      const t = c ? e.slice(0, 1) : [...n, ...e].slice(0, v);
+      x(t), s == null || s(t);
+    }, u = (e, l) => {
       if (p) return;
       e.stopPropagation();
-      const t = n.filter((d, x) => x !== l);
-      v(t), s == null || s(t);
-    }, { getRootProps: L, getInputProps: M, isDragActive: P } = O({
-      onDrop: B,
+      const t = n.filter((d, h) => h !== l);
+      x(t), s == null || s(t);
+    }, { getRootProps: L, getInputProps: M, isDragActive: P } = X({
+      onDrop: A,
       accept: y.reduce((e, l) => (e[l] = [], e), {}),
       maxSize: F * 1024 * 1024,
-      maxFiles: c ? 1 : h,
+      maxFiles: c ? 1 : v,
       disabled: p
     });
-    return /* @__PURE__ */ r(
-      X,
+    return O(T, () => ({
+      setItems: x
+    }), []), /* @__PURE__ */ r(
+      Y,
       {
         ...L(),
-        ...T,
-        ref: _,
+        ...B,
         className: f(
           "border-dashed p-2 text-center flex flex-col items-center justify-center cursor-pointer",
           p && "border-[#E4E4E7] pointer-events-none",
@@ -58,7 +59,7 @@ const Q = j(
           P && "bg-gray-100",
           c && "!shadow-none",
           c && n.length > 0 && "!p-0 !shadow-none",
-          E
+          I
         ),
         children: [
           /* @__PURE__ */ i("input", { ...M() }),
@@ -70,9 +71,9 @@ const Q = j(
                 o == null ? void 0 : o.idleWrapper
               ),
               children: [
-                /* @__PURE__ */ i(H, {}),
+                /* @__PURE__ */ i(K, {}),
                 !p && /* @__PURE__ */ r(U, { children: [
-                  /* @__PURE__ */ i("span", { className: "font-medium text-md text-foreground max-w-[200px]", children: I }),
+                  /* @__PURE__ */ i("span", { className: "font-medium text-md text-foreground max-w-[200px]", children: E }),
                   /* @__PURE__ */ i("span", { className: "font-normal text-xs text-foreground max-w-[250px]", children: b })
                 ] })
               ]
@@ -95,11 +96,11 @@ const Q = j(
               ] }, d)) })
             ] }, l)) })
           ] }),
-          c && n.length > 0 && /* @__PURE__ */ i(
-            K,
+          !!(c && n.length) && /* @__PURE__ */ i(
+            J,
             {
               item: n[0],
-              onRemoveClick: (e) => w(e, 0),
+              onRemoveClick: (e) => u(e, 0),
               disabled: p
             }
           ),
@@ -109,7 +110,7 @@ const Q = j(
               ":"
             ] }),
             /* @__PURE__ */ i("ul", { className: "mt-2 text-sm text-gray-500 flex flex-wrap gap-4 items-start justify-center", children: n.map((e, l) => {
-              const t = u(e) ? e.name : J(e), d = u(e) ? (e.size / (1024 * 1024)).toFixed(2) + " MB" : "";
+              const t = g(e) ? e.name : Q(e), d = g(e) ? (e.size / (1024 * 1024)).toFixed(2) + " MB" : "";
               return /* @__PURE__ */ r(
                 "li",
                 {
@@ -121,8 +122,8 @@ const Q = j(
                         "div",
                         {
                           className: "absolute top-0 right-0 cursor-pointer bg-gray-300 rounded-sm",
-                          onClick: (x) => w(x, l),
-                          children: /* @__PURE__ */ i(Y, { size: 16, strokeWidth: 1, color: "black" })
+                          onClick: (h) => u(h, l),
+                          children: /* @__PURE__ */ i(j, { size: 16, strokeWidth: 1, color: "black" })
                         }
                       )
                     ] }),
@@ -145,7 +146,7 @@ const Q = j(
     );
   }
 );
-Q.displayName = "Dropzone";
+R.displayName = "Dropzone";
 export {
-  Q as Dropzone
+  R as Dropzone
 };

package/Dropzone/Dropzone.types.d.ts

@@ -1,3 +1,4 @@
+import { Dispatch, SetStateAction } from 'react';
 import { FileRejection } from 'react-dropzone';
 
 export type DropzoneValueItem = File | string;
@@ -36,3 +37,6 @@ export interface DropzoneStyles {
 }
 export declare const DEFAULT_FILE_TYPES: string[];
 export declare const DEFAULT_IMAGES_TYPES: string[];
+export interface DropzoneControl {
+    setItems: Dispatch<SetStateAction<DropzoneValueItem[]>>;
+}

package/package.json

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