@js-empire/emperor-ui 1.2.2 → 1.2.3

package/dist/{index-B3d8-vnJ.js → index-CN4cJ1N7.js}

@@ -1,7 +1,7 @@
-import { i as re, m as T, p as W, a as le, n as B, b as he, c as Ot, d as Ut, r as Ft, t as Nt, f as S, e as b, S as ce, g as Wt, h as E, j as z, k as Gt, l as P, o as M, q as H, s as tt, u as I, v as ue, w as de, L as me, x as fe, y as pe } from "./index-DOwkJus4.js";
-import { A as zs, Z as Hs, B as $s, M as Xs, Q as Ys, R as Ks, N as qs, a7 as _s, P as Zs, z as Js, T as Qs, V as ti, al as ei, ad as si, aO as ii, aQ as ni, aS as oi, E as ai, aN as ri, a8 as li, ae as hi, U as ci, aK as ui, aM as di, aI as mi, aJ as fi, a0 as pi, a1 as gi, ah as yi, ao as vi, af as xi, $ as Pi, H as Ti, ag as Di, au as Si, _ as Ei, at as Vi, ai as Ai, aw as Li, av as Ri, aU as Ci, a9 as wi, aa as Mi, aH as Bi, ay as ji, I as ki, W as bi, X as Ii, az as Oi, aB as Ui, a6 as Fi, aX as Ni, aR as Wi, O as Gi, aC as zi, aA as Hi, aY as $i, C as Xi, D as Yi, am as Ki, aj as qi, F as _i, Y as Zi, a2 as Ji, aL as Qi, aV as tn, ap as en, a3 as sn, aE as nn, ab as on, ac as an, an as rn, aP as ln, aT as hn, ax as cn, as as un, a4 as dn, a5 as mn, ak as fn, aD as pn, J as gn, K as yn, aF as vn, aG as xn, aZ as Pn, aq as Tn, G as Dn, ar as Sn, a_ as En, aW as Vn } from "./index-DOwkJus4.js";
-import { i as L, s as et, p as Z, c as ge, a as zt, g as ye, h as w, t as O, b as U, e as st, f as ve, j as xe, k as Pe, l as Te, m as Q, n as De, o as Se, q as Ht, r as Ee, u as Ve, v as Ae, w as Le, x as Re, y as Ce, z as it, A as we, F as $t, d as Me } from "./features-animation-uyo1KMg-.js";
-import { D as Ln, Z as Rn, aw as Cn, ax as wn, J as Mn, N as Bn, E as jn, ay as kn, P as bn, Q as In, C as On, B as Un, aN as Fn, aF as Nn, a6 as Wn, aG as Gn, aO as zn, aP as Hn, aQ as $n, G as Xn, V as Yn, aK as Kn, az as qn, aR as _n, aS as Zn, a0 as Jn, aA as Qn, X as to, aT as eo, a1 as so, S as io, _ as no, aU as oo, aV as ao, aW as ro, a$ as lo, $ as ho, a7 as co, K as uo, L as mo, aj as fo, H as po, aB as go, a9 as yo, au as vo, R as xo, af as Po, ao as To, aZ as Do, a8 as So, a_ as Eo, Y as Vo, ad as Ao, ab as Lo, M as Ro, av as Co, T as wo, O as Mo, a2 as Bo, W as jo, aI as ko, aM as bo, aX as Io, ag as Oo, ak as Uo, ah as Fo, al as No, an as Wo, ai as Go, am as zo, ap as Ho, I as $o, ae as Xo, aa as Yo, aJ as Ko, aL as qo, aq as _o, aC as Zo, aY as Jo, ac as Qo, aD as ta, U as ea, a4 as sa, a3 as ia, a5 as na, ar as oa, as as aa, at as ra, aH as la, aE as ha } from "./features-animation-uyo1KMg-.js";
+import { i as re, m as T, p as W, a as le, n as B, b as he, c as Ot, d as Ut, r as Ft, t as Nt, f as S, e as b, S as ce, g as Wt, h as E, j as z, k as Gt, l as P, o as M, q as H, s as tt, u as I, v as ue, w as de, L as me, x as fe, y as pe } from "./index-BY47HgaP.js";
+import { A as zs, Z as Hs, B as $s, M as Xs, Q as Ys, R as Ks, N as qs, a7 as _s, P as Zs, z as Js, T as Qs, V as ti, al as ei, ad as si, aO as ii, aQ as ni, aS as oi, E as ai, aN as ri, a8 as li, ae as hi, U as ci, aK as ui, aM as di, aI as mi, aJ as fi, a0 as pi, a1 as gi, ah as yi, ao as vi, af as xi, $ as Pi, H as Ti, ag as Di, au as Si, _ as Ei, at as Vi, ai as Ai, aw as Li, av as Ri, aU as Ci, a9 as wi, aa as Mi, aH as Bi, ay as ji, I as ki, W as bi, X as Ii, az as Oi, aB as Ui, a6 as Fi, aX as Ni, aR as Wi, O as Gi, aC as zi, aA as Hi, aY as $i, C as Xi, D as Yi, am as Ki, aj as qi, F as _i, Y as Zi, a2 as Ji, aL as Qi, aV as tn, ap as en, a3 as sn, aE as nn, ab as on, ac as an, an as rn, aP as ln, aT as hn, ax as cn, as as un, a4 as dn, a5 as mn, ak as fn, aD as pn, J as gn, K as yn, aF as vn, aG as xn, aZ as Pn, aq as Tn, G as Dn, ar as Sn, a_ as En, aW as Vn } from "./index-BY47HgaP.js";
+import { i as L, s as et, p as Z, c as ge, a as zt, g as ye, h as w, t as O, b as U, e as st, f as ve, j as xe, k as Pe, l as Te, m as Q, n as De, o as Se, q as Ht, r as Ee, u as Ve, v as Ae, w as Le, x as Re, y as Ce, z as it, A as we, F as $t, d as Me } from "./features-animation-w9dWMd15.js";
+import { D as Ln, Z as Rn, aw as Cn, ax as wn, J as Mn, N as Bn, E as jn, ay as kn, P as bn, Q as In, C as On, B as Un, aN as Fn, aF as Nn, a6 as Wn, aG as Gn, aO as zn, aP as Hn, aQ as $n, G as Xn, V as Yn, aK as Kn, az as qn, aR as _n, aS as Zn, a0 as Jn, aA as Qn, X as to, aT as eo, a1 as so, S as io, _ as no, aU as oo, aV as ao, aW as ro, a$ as lo, $ as ho, a7 as co, K as uo, L as mo, aj as fo, H as po, aB as go, a9 as yo, au as vo, R as xo, af as Po, ao as To, aZ as Do, a8 as So, a_ as Eo, Y as Vo, ad as Ao, ab as Lo, M as Ro, av as Co, T as wo, O as Mo, a2 as Bo, W as jo, aI as ko, aM as bo, aX as Io, ag as Oo, ak as Uo, ah as Fo, al as No, an as Wo, ai as Go, am as zo, ap as Ho, I as $o, ae as Xo, aa as Yo, aJ as Ko, aL as qo, aq as _o, aC as Zo, aY as Jo, ac as Qo, aD as ta, U as ea, a4 as sa, a3 as ia, a5 as na, ar as oa, as as aa, at as ra, aH as la, aE as ha } from "./features-animation-w9dWMd15.js";
 import { useContext as nt, Component as Be } from "react";
 function je(t) {
   return t === "x" || t === "y" ? L[t] ? null : (L[t] = !0, () => {

package/dist/index-Cr1mc-d4.js

@@ -0,0 +1,5 @@
+import { d as a } from "./features-animation-w9dWMd15.js";
+var o = a;
+export {
+  o as default
+};

package/dist/index.d.ts

@@ -56,7 +56,7 @@ declare const ar: {
     templates: {};
 };
 
-export declare function AvatarLabel(): JSX.Element;
+export declare function AvatarLabel(): JSX.Element | null;
 
 export declare const Brand: ForwardRefExoticComponent<Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
 variant?: null | undefined;
@@ -705,6 +705,7 @@ export declare type UploaderContextState = {
         label?: string;
         avatar?: string;
         listing?: string;
+        listingItem?: string;
         error?: string;
         input?: string;
         title?: string;
@@ -729,9 +730,9 @@ export declare function UploadFileErrorBox(): JSX.Element | null;
 
 export declare function UploadFileInput(): JSX.Element;
 
-export declare function UploadFileLabel(): JSX.Element;
+export declare function UploadFileLabel(): JSX.Element | null;
 
-export declare function UploadFileListing(): (JSX.Element | null)[];
+export declare function UploadFileListing(): JSX.Element;
 
 export declare function useEmperorUI(): ConfigContextState;
 

package/dist/src-UW24ZMRV-nsR4cpiy.js

@@ -0,0 +1,5 @@
+import { d as a } from "./features-animation-w9dWMd15.js";
+var r = a;
+export {
+  r as default
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@js-empire/emperor-ui",
   "description": "They provide the atoms, we provide the empire.",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "author": "JS Empire - Mustafa Alhasanat",
   "license": "ISC",
   "type": "module",

package/src/components/atoms/uploader/avatar-label.tsx

@@ -18,6 +18,7 @@ export function AvatarLabel() {
     placeholderImage,
     files,
     isLoading,
+    isMulti,
   } = useUploaderContext();
 
   const locales = config?.interLocalization?.locales;
@@ -45,6 +46,10 @@ export function AvatarLabel() {
     setDraggableMessage("");
   };
 
+  if (!isMulti && files?.length > 0) {
+    return null;
+  }
+
   if (isLoading)
     return (
       <div className={cn("mx-auto", classNames?.label)}>

package/src/components/atoms/uploader/stories/uploader.stories.tsx

@@ -39,7 +39,7 @@ export const Default: Story = {
   args: {},
   render: () => {
     const uploadProps = useUploader({
-      fileTypes: ["image"],
+      fileTypes: ["image", "pdf"],
       labelId: "image",
     });
 
@@ -51,7 +51,7 @@ export const MultiFiles: Story = {
   args: {},
   render: () => {
     const uploadProps = useUploader({
-      fileTypes: ["image"],
+      fileTypes: ["image", "pdf"],
       labelId: "image",
       isMulti: true,
     });

package/src/components/atoms/uploader/upload-file-label.tsx

@@ -15,6 +15,8 @@ export function UploadFileLabel() {
     isDraggable,
     onInputChange,
     isLoading,
+    isMulti,
+    files,
   } = useUploaderContext();
 
   const locales = config?.interLocalization?.locales;
@@ -42,6 +44,10 @@ export function UploadFileLabel() {
     setDraggableMessage("");
   };
 
+  if (!isMulti && files?.length > 0) {
+    return null;
+  }
+
   if (isLoading)
     return (
       <div className={cn("w-full flex mx-auto", classNames?.label)}>

package/src/components/atoms/uploader/upload-file-listing.tsx

@@ -8,48 +8,56 @@ export function UploadFileListing() {
   const { files, setSelectedFile, handleClearFile, classNames, modal } =
     useUploaderContext();
 
-  return files?.map((file) => {
-    const isFileViewable =
-      modal?.onOpen && file?.view && file?.file?.name && file?.type === "image";
+  return (
+    <ul className={cn("w-full flex flex-col gap-2", classNames?.listing)}>
+      {files?.map((file) => {
+        const isFileViewable =
+          modal?.onOpen &&
+          file?.view &&
+          file?.file?.name &&
+          file?.type === "image";
 
-    if (file)
-      return (
-        <div
-          key={file?.file?.name}
-          className={cn(
-            "flex justify-between items-center p-2 gap-2 w-full border border-black/30 rounded-lg",
-            classNames?.listing,
-          )}
-        >
-          <p className="w-full line-clamp-1 text-xs max-w-60">
-            {file?.file?.name}
-          </p>
+        if (!file) return null;
 
-          <Button
-            isIconOnly
-            variant="flat"
-            className="size-8 min-w-8 rounded-full"
-            color="danger"
-            onPress={() => handleClearFile(file?.file?.name)}
-            startContent={<Trash2 className="rounded-lg size-4" />}
-          />
+        return (
+          <li
+            key={file?.file?.name}
+            className={cn(
+              "flex justify-between items-center p-2 gap-2 w-full border border-black/30 rounded-lg",
+              classNames?.listingItem,
+            )}
+          >
+            <p className="w-full line-clamp-1 text-xs max-w-60">
+              {file?.file?.name}
+            </p>
 
-          {isFileViewable && (
             <Button
               isIconOnly
               variant="flat"
-              className="size-8 min-w-8 rounded-full"
-              color="primary"
-              onPress={() => {
-                setSelectedFile?.(file);
-                modal?.onOpen?.();
-              }}
-              startContent={<Eye className="rounded-lg size-4" />}
+              radius="full"
+              className="size-6 min-w-6"
+              color="danger"
+              onPress={() => handleClearFile(file?.file?.name)}
+              startContent={<Trash2 className="rounded-lg size-3" />}
             />
-          )}
-        </div>
-      );
 
-    return null;
-  });
+            {isFileViewable && (
+              <Button
+                isIconOnly
+                variant="flat"
+                radius="full"
+                className="size-6 min-w-6"
+                color="primary"
+                onPress={() => {
+                  setSelectedFile?.(file);
+                  modal?.onOpen?.();
+                }}
+                startContent={<Eye className="rounded-lg size-3" />}
+              />
+            )}
+          </li>
+        );
+      })}
+    </ul>
+  );
 }

package/src/types/components/atoms/uploader.ts

@@ -86,6 +86,7 @@ export type UploaderContextState = {
     label?: string;
     avatar?: string;
     listing?: string;
+    listingItem?: string;
     error?: string;
     input?: string;
     title?: string;

package/dist/index-DrkA25TM.js

@@ -1,5 +0,0 @@
-import { d as a } from "./features-animation-uyo1KMg-.js";
-var o = a;
-export {
-  o as default
-};

package/dist/src-UW24ZMRV-D6kiVea5.js

@@ -1,5 +0,0 @@
-import { d as a } from "./features-animation-uyo1KMg-.js";
-var r = a;
-export {
-  r as default
-};