@fileverse/ui 4.1.1-patch-1 → 4.1.1-patch-3

package/dist/index.css

@@ -1433,6 +1433,9 @@ video {
 .w-\[8px\] {
   width: 8px;
 }
+.w-auto {
+  width: auto;
+}
 .w-fit {
   width: -moz-fit-content;
   width: fit-content;
@@ -2070,6 +2073,9 @@ video {
   font-size: 0.875rem;
   line-height: 1.25rem;
 }
+.\!font-bold {
+  font-weight: 700 !important;
+}
 .font-\[700\] {
   font-weight: 700;
 }

package/dist/index.es.d.ts

@@ -83,7 +83,12 @@ declare const avatarVariants: (props?: ({
     content?: "image" | "text" | null | undefined;
 } & ClassProp) | undefined) => string;
 
-export declare const BottomDrawer: ({ open, onOpenChange, title, description, content, primaryAction, secondaryAction, className, contentClassName, hasCloseIcon, }: DynamicModalProps) => JSX_2.Element;
+export declare const BottomDrawer: ({ open, onOpenChange, title, description, content, primaryAction, secondaryAction, className, contentClassName, hasCloseIcon, headerClassName, footerClassName, }: BottomDrawerProps) => JSX_2.Element;
+
+export declare interface BottomDrawerProps extends DynamicModalProps {
+    headerClassName?: string;
+    footerClassName?: string;
+}
 
 export declare const Button: React_2.ForwardRefExoticComponent<ButtonProps & React_2.RefAttributes<HTMLButtonElement>>;
 
@@ -237,6 +242,12 @@ export declare const CommandShortcut: {
     displayName: string;
 };
 
+export declare const Counter: default_2.ForwardRefExoticComponent<CounterProps & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare interface CounterProps {
+    count: number;
+}
+
 export declare const Dialog: React_2.FC<DialogPrimitive.DialogProps>;
 
 export declare const DialogClose: React_2.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React_2.RefAttributes<HTMLButtonElement>>;

package/dist/index.es.js

@@ -1,5 +1,5 @@
 import * as y from "react";
-import D, { forwardRef as Ve, createElement as I, useLayoutEffect as Dn, useEffect as se, createContext as Ct, useContext as Me, useRef as ee, useInsertionEffect as Al, useCallback as Te, useMemo as Qe, Fragment as $1, useId as Gi, Component as Sl, useState as ke, cloneElement as ao, Children as p1, isValidElement as yn, memo as Il, createRef as f1, Suspense as h6, useReducer as p6 } from "react";
+import D, { forwardRef as Re, createElement as I, useLayoutEffect as Dn, useEffect as se, createContext as Ct, useContext as Me, useRef as ee, useInsertionEffect as Al, useCallback as Te, useMemo as Qe, Fragment as $1, useId as Gi, Component as Sl, useState as ke, cloneElement as ao, Children as p1, isValidElement as yn, memo as Il, createRef as f1, Suspense as h6, useReducer as p6 } from "react";
 import * as zn from "react-dom";
 import Tl, { flushSync as Nl } from "react-dom";
 var fr = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
@@ -263,18 +263,18 @@ function g6() {
         if (st && _ && typeof st.stack == "string") {
           for (var de = st.stack.split(`
 `), tt = _.stack.split(`
-`), He = de.length - 1, qe = tt.length - 1; He >= 1 && qe >= 0 && de[He] !== tt[qe]; )
+`), Oe = de.length - 1, qe = tt.length - 1; Oe >= 1 && qe >= 0 && de[Oe] !== tt[qe]; )
             qe--;
-          for (; He >= 1 && qe >= 0; He--, qe--)
-            if (de[He] !== tt[qe]) {
-              if (He !== 1 || qe !== 1)
+          for (; Oe >= 1 && qe >= 0; Oe--, qe--)
+            if (de[Oe] !== tt[qe]) {
+              if (Oe !== 1 || qe !== 1)
                 do
-                  if (He--, qe--, qe < 0 || de[He] !== tt[qe]) {
+                  if (Oe--, qe--, qe < 0 || de[Oe] !== tt[qe]) {
                     var vt = `
-` + de[He].replace(" at new ", " at ");
+` + de[Oe].replace(" at new ", " at ");
                     return C.displayName && vt.includes("<anonymous>") && (vt = vt.replace("<anonymous>", C.displayName)), typeof C == "function" && R.set(C, vt), vt;
                   }
-                while (He >= 1 && qe >= 0);
+                while (Oe >= 1 && qe >= 0);
               break;
             }
         }
@@ -340,8 +340,8 @@ function g6() {
                 throw tt.name = "Invariant Violation", tt;
               }
               de = C[pe](P, pe, _, q, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
-            } catch (He) {
-              de = He;
+            } catch (Oe) {
+              de = Oe;
             }
             de && !(de instanceof Error) && (Tt(we), M("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", _ || "React class", q, pe, typeof de), Tt(null)), de instanceof Error && !(de.message in Ot) && (Ot[de.message] = !0, Tt(we), M("Failed %s type: %s", q, de.message), Tt(null));
           }
@@ -458,9 +458,9 @@ function g6() {
         for (be in P)
           ot.call(P, be) && !rr.hasOwnProperty(be) && (pe[be] = P[be]);
         if (C && C.defaultProps) {
-          var He = C.defaultProps;
-          for (be in He)
-            pe[be] === void 0 && (pe[be] = He[be]);
+          var Oe = C.defaultProps;
+          for (be in Oe)
+            pe[be] === void 0 && (pe[be] = Oe[be]);
         }
         if (de || tt) {
           var qe = typeof C == "function" ? C.displayName || C.name || "Unknown" : C;
@@ -588,8 +588,8 @@ Check the top-level render call using <` + q + ">.");
           (C === void 0 || typeof C == "object" && C !== null && Object.keys(C).length === 0) && (de += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
           var tt = Wt();
           tt ? de += tt : de += N1();
-          var He;
-          C === null ? He = "null" : Fa(C) ? He = "array" : C !== void 0 && C.$$typeof === t ? (He = "<" + (G(C.type) || "Unknown") + " />", de = " Did you accidentally export a JSX literal instead of a component?") : He = typeof C, M("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", He, de);
+          var Oe;
+          C === null ? Oe = "null" : Fa(C) ? Oe = "array" : C !== void 0 && C.$$typeof === t ? (Oe = "<" + (G(C.type) || "Unknown") + " />", de = " Did you accidentally export a JSX literal instead of a component?") : Oe = typeof C, M("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", Oe, de);
         }
         var qe = fe(C, P, q, we, be);
         if (qe == null)
@@ -3083,7 +3083,7 @@ const _s = (e) => typeof e == "boolean" ? "".concat(e) : e === 0 ? "0" : e, ef =
   )
 );
 Hr.displayName = "Avatar";
-const gte = Ve(
+const gte = Re(
   ({
     avatars: e,
     size: t = "lg",
@@ -3755,7 +3755,7 @@ const t5 = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
  * See the LICENSE file in the root directory of this source tree.
  */
 const i = (e, t) => {
-  const a = Ve(
+  const a = Re(
     ({
       color: n = "currentColor",
       size: r = 24,
@@ -25228,7 +25228,7 @@ const qO = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   defaultVariants: {
     size: "md"
   }
-}), Ge = Ve(
+}), Ge = Re(
   ({ name: e, className: t, size: a, strokeWidth: n, fill: r, stroke: o, ...s }, f) => {
     const c = BO[e];
     return c ? /* @__PURE__ */ u.jsx(
@@ -25331,7 +25331,7 @@ qt.displayName = "Button";
 const vte = ({ children: e, className: t }) => {
   const a = z("flex space-x-2", t);
   return /* @__PURE__ */ u.jsx("div", { className: a, children: e });
-}, Yi = Ve(
+}, Yi = Re(
   ({
     icon: e,
     variant: t,
@@ -28119,7 +28119,7 @@ function sB({ preloadedFeatures: e, createVisualElement: t, useRender: a, useVis
     }
     return u.jsxs(uo.Provider, { value: p, children: [l && p.visualElement ? u.jsx(l, { visualElement: p.visualElement, ...d }) : null, a(r, f, aB(m, p.visualElement, c), m, h, p.visualElement)] });
   }
-  const s = Ve(o);
+  const s = Re(o);
   return s[iB] = r, s;
 }
 function fB({ layoutId: e }) {
@@ -30866,7 +30866,7 @@ const $f = () => ({
 }), pa = () => ({
   x: $f(),
   y: $f()
-}), _f = () => ({ min: 0, max: 0 }), Oe = () => ({
+}), _f = () => ({ min: 0, max: 0 }), Ve = () => ({
   x: _f(),
   y: _f()
 });
@@ -30958,7 +30958,7 @@ function uG(e, t, a) {
 const Bu = ({ current: e }) => e ? e.ownerDocument.defaultView : null, hG = /* @__PURE__ */ new WeakMap();
 class pG {
   constructor(t) {
-    this.openGlobalLock = null, this.isDragging = !1, this.currentDirection = null, this.originPoint = { x: 0, y: 0 }, this.constraints = !1, this.hasMutatedConstraints = !1, this.elastic = Oe(), this.visualElement = t;
+    this.openGlobalLock = null, this.isDragging = !1, this.currentDirection = null, this.originPoint = { x: 0, y: 0 }, this.constraints = !1, this.hasMutatedConstraints = !1, this.elastic = Ve(), this.visualElement = t;
   }
   start(t, { snapToCursor: a = !1 } = {}) {
     const { presenceContext: n } = this.visualElement;
@@ -31662,7 +31662,7 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
         for (let c = 0; c < this.path.length; c++)
           this.path[c].updateScroll();
       const s = this.layout;
-      this.layout = this.measure(!1), this.layoutCorrected = Oe(), this.isLayoutDirty = !1, this.projectionDelta = void 0, this.notifyListeners("measure", this.layout.layoutBox);
+      this.layout = this.measure(!1), this.layoutCorrected = Ve(), this.isLayoutDirty = !1, this.projectionDelta = void 0, this.notifyListeners("measure", this.layout.layoutBox);
       const { visualElement: f } = this.options;
       f && f.notify("LayoutMeasure", this.layout.layoutBox, s ? s.layoutBox : void 0);
     }
@@ -31700,7 +31700,7 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
       var s;
       const { visualElement: f } = this.options;
       if (!f)
-        return Oe();
+        return Ve();
       const c = f.measureViewportBox();
       if (!(((s = this.scroll) === null || s === void 0 ? void 0 : s.wasRoot) || this.path.some(eU))) {
         const { scroll: d } = this.root;
@@ -31710,7 +31710,7 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
     }
     removeElementScroll(s) {
       var f;
-      const c = Oe();
+      const c = Ve();
       if (kt(c, s), !((f = this.scroll) === null || f === void 0) && f.wasRoot)
         return c;
       for (let l = 0; l < this.path.length; l++) {
@@ -31720,7 +31720,7 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
       return c;
     }
     applyTransform(s, f = !1) {
-      const c = Oe();
+      const c = Ve();
       kt(c, s);
       for (let l = 0; l < this.path.length; l++) {
         const d = this.path[l];
@@ -31732,14 +31732,14 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
       return O1(this.latestValues) && ma(c, this.latestValues), c;
     }
     removeTransform(s) {
-      const f = Oe();
+      const f = Ve();
       kt(f, s);
       for (let c = 0; c < this.path.length; c++) {
         const l = this.path[c];
         if (!l.instance || !O1(l.latestValues))
           continue;
         pi(l.latestValues) && l.updateSnapshot();
-        const d = Oe(), h = l.measurePageBox();
+        const d = Ve(), h = l.measurePageBox();
         kt(d, h), pc(f, l.latestValues, l.snapshot ? l.snapshot.layoutBox : void 0, d);
       }
       return O1(this.latestValues) && pc(f, this.latestValues), f;
@@ -31771,13 +31771,13 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
       if (!(!this.layout || !(h || p))) {
         if (this.resolvedRelativeTargetAt = We.timestamp, !this.targetDelta && !this.relativeTarget) {
           const m = this.getClosestProjectingParent();
-          m && m.layout && this.animationProgress !== 1 ? (this.relativeParent = m, this.forceRelativeParentToResolveTarget(), this.relativeTarget = Oe(), this.relativeTargetOrigin = Oe(), ln(this.relativeTargetOrigin, this.layout.layoutBox, m.layout.layoutBox), kt(this.relativeTarget, this.relativeTargetOrigin)) : this.relativeParent = this.relativeTarget = void 0;
+          m && m.layout && this.animationProgress !== 1 ? (this.relativeParent = m, this.forceRelativeParentToResolveTarget(), this.relativeTarget = Ve(), this.relativeTargetOrigin = Ve(), ln(this.relativeTargetOrigin, this.layout.layoutBox, m.layout.layoutBox), kt(this.relativeTarget, this.relativeTargetOrigin)) : this.relativeParent = this.relativeTarget = void 0;
         }
         if (!(!this.relativeTarget && !this.targetDelta)) {
-          if (this.target || (this.target = Oe(), this.targetWithTransforms = Oe()), this.relativeTarget && this.relativeTargetOrigin && this.relativeParent && this.relativeParent.target ? (this.forceRelativeParentToResolveTarget(), aG(this.target, this.relativeTarget, this.relativeParent.target)) : this.targetDelta ? (this.resumingFrom ? this.target = this.applyTransform(this.layout.layoutBox) : kt(this.target, this.layout.layoutBox), Vu(this.target, this.targetDelta)) : kt(this.target, this.layout.layoutBox), this.attemptToResolveRelativeTarget) {
+          if (this.target || (this.target = Ve(), this.targetWithTransforms = Ve()), this.relativeTarget && this.relativeTargetOrigin && this.relativeParent && this.relativeParent.target ? (this.forceRelativeParentToResolveTarget(), aG(this.target, this.relativeTarget, this.relativeParent.target)) : this.targetDelta ? (this.resumingFrom ? this.target = this.applyTransform(this.layout.layoutBox) : kt(this.target, this.layout.layoutBox), Vu(this.target, this.targetDelta)) : kt(this.target, this.layout.layoutBox), this.attemptToResolveRelativeTarget) {
             this.attemptToResolveRelativeTarget = !1;
             const m = this.getClosestProjectingParent();
-            m && !!m.resumingFrom == !!this.resumingFrom && !m.options.layoutScroll && m.target && this.animationProgress !== 1 ? (this.relativeParent = m, this.forceRelativeParentToResolveTarget(), this.relativeTarget = Oe(), this.relativeTargetOrigin = Oe(), ln(this.relativeTargetOrigin, this.target, m.target), kt(this.relativeTarget, this.relativeTargetOrigin)) : this.relativeParent = this.relativeTarget = void 0;
+            m && !!m.resumingFrom == !!this.resumingFrom && !m.options.layoutScroll && m.target && this.animationProgress !== 1 ? (this.relativeParent = m, this.forceRelativeParentToResolveTarget(), this.relativeTarget = Ve(), this.relativeTargetOrigin = Ve(), ln(this.relativeTargetOrigin, this.target, m.target), kt(this.relativeTarget, this.relativeTargetOrigin)) : this.relativeParent = this.relativeTarget = void 0;
           }
           nn && V1.resolvedTargetDeltas++;
         }
@@ -31801,7 +31801,7 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
         return;
       kt(this.layoutCorrected, this.layout.layoutBox);
       const p = this.treeScale.x, m = this.treeScale.y;
-      dG(this.layoutCorrected, this.treeScale, this.path, c), f.layout && !f.target && (this.treeScale.x !== 1 || this.treeScale.y !== 1) && (f.target = f.layout.layoutBox, f.targetWithTransforms = Oe());
+      dG(this.layoutCorrected, this.treeScale, this.path, c), f.layout && !f.target && (this.treeScale.x !== 1 || this.treeScale.y !== 1) && (f.target = f.layout.layoutBox, f.targetWithTransforms = Ve());
       const { target: v } = f;
       if (!v) {
         this.prevProjectionDelta && (this.createProjectionDeltas(), this.scheduleRender());
@@ -31829,12 +31829,12 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
     setAnimationOrigin(s, f = !1) {
       const c = this.snapshot, l = c ? c.latestValues : {}, d = { ...this.latestValues }, h = pa();
       (!this.relativeParent || !this.relativeParent.options.layoutRoot) && (this.relativeTarget = this.relativeTargetOrigin = void 0), this.attemptToResolveRelativeTarget = !f;
-      const p = Oe(), m = c ? c.source : void 0, v = this.layout ? this.layout.source : void 0, g = m !== v, k = this.getStack(), w = !k || k.members.length <= 1, M = !!(g && !w && this.options.crossfade === !0 && !this.path.some(XG));
+      const p = Ve(), m = c ? c.source : void 0, v = this.layout ? this.layout.source : void 0, g = m !== v, k = this.getStack(), w = !k || k.members.length <= 1, M = !!(g && !w && this.options.crossfade === !0 && !this.path.some(XG));
       this.animationProgress = 0;
       let x;
       this.mixTargetDelta = (b) => {
         const L = b / 1e3;
-        bc(h.x, s.x, L), bc(h.y, s.y, L), this.setTargetDelta(h), this.relativeTarget && this.relativeTargetOrigin && this.layout && this.relativeParent && this.relativeParent.layout && (ln(p, this.layout.layoutBox, this.relativeParent.layout.layoutBox), KG(this.relativeTarget, this.relativeTargetOrigin, p, L), x && IG(this.relativeTarget, x) && (this.isProjectionDirty = !1), x || (x = Oe()), kt(x, this.relativeTarget)), g && (this.animationValues = d, bG(d, l, this.latestValues, L, M, w)), this.root.scheduleUpdateProjection(), this.scheduleRender(), this.animationProgress = L;
+        bc(h.x, s.x, L), bc(h.y, s.y, L), this.setTargetDelta(h), this.relativeTarget && this.relativeTargetOrigin && this.layout && this.relativeParent && this.relativeParent.layout && (ln(p, this.layout.layoutBox, this.relativeParent.layout.layoutBox), KG(this.relativeTarget, this.relativeTargetOrigin, p, L), x && IG(this.relativeTarget, x) && (this.isProjectionDirty = !1), x || (x = Ve()), kt(x, this.relativeTarget)), g && (this.animationValues = d, bG(d, l, this.latestValues, L, M, w)), this.root.scheduleUpdateProjection(), this.scheduleRender(), this.animationProgress = L;
       }, this.mixTargetDelta(this.options.layoutRoot ? 1e3 : 0);
     }
     startAnimation(s) {
@@ -31863,7 +31863,7 @@ function Qu({ attachResizeListener: e, defaultParent: t, measureScroll: a, check
       let { targetWithTransforms: f, target: c, layout: l, latestValues: d } = s;
       if (!(!f || !c || !l)) {
         if (this !== s && this.layout && l && Ju(this.options.animationType, this.layout.layoutBox, l.layoutBox)) {
-          c = this.target || Oe();
+          c = this.target || Ve();
           const h = pt(this.layout.layoutBox.x);
           c.x.min = s.target.x.min, c.x.max = c.x.min + h;
           const p = pt(this.layout.layoutBox.y);
@@ -31995,9 +31995,9 @@ function qG(e) {
       if (h && !h.resumeFrom) {
         const { snapshot: p, layout: m } = h;
         if (p && m) {
-          const v = Oe();
+          const v = Ve();
           ln(v, a.layoutBox, p.layoutBox);
-          const g = Oe();
+          const g = Ve();
           ln(g, n, m.layoutBox), Wu(v, g) || (d = !0), h.options.layoutRoot && (e.relativeTarget = g, e.relativeTargetOrigin = v, e.relativeParent = h);
         }
       }
@@ -32222,7 +32222,7 @@ class fU {
    * removed with a re-render to work.
    */
   measureViewportBox() {
-    return this.current ? this.measureInstanceViewportBox(this.current, this.props) : Oe();
+    return this.current ? this.measureInstanceViewportBox(this.current, this.props) : Ve();
   }
   getStaticValue(t) {
     return this.latestValues[t];
@@ -32404,7 +32404,7 @@ class lU extends $u {
 }
 class dU extends $u {
   constructor() {
-    super(...arguments), this.type = "svg", this.isSVGTag = !1, this.measureInstanceViewportBox = Oe;
+    super(...arguments), this.type = "svg", this.isSVGTag = !1, this.measureInstanceViewportBox = Ve;
   }
   getBaseTargetFromProps(t, a) {
     return t[a];
@@ -34010,7 +34010,7 @@ const DU = {
   defaultVariants: {
     size: "md"
   }
-}), wo = Ve(
+}), wo = Re(
   ({
     name: e,
     size: t = "md",
@@ -39206,7 +39206,7 @@ const QJ = ({
     ),
     /* @__PURE__ */ u.jsx(xU, { initial: !1, children: o && n === r && /* @__PURE__ */ u.jsx(JJ, { content: o }) })
   ] });
-}, qte = Ve(
+}, qte = Re(
   ({ items: e, className: t, size: a = "lg", content: n, selectedValue: r, setSelectedValue: o }, s) => !e || e.length === 0 ? null : /* @__PURE__ */ u.jsx(
     rp,
     {
@@ -39244,7 +39244,7 @@ const QJ = ({
       children: /* @__PURE__ */ u.jsx("div", { className: "p-4 flex flex-col gap-4", children: e })
     }
   );
-}, Bte = Ve(({ label: e, description: t, checked: a, onChange: n, size: r = "lg" }, o) => /* @__PURE__ */ u.jsxs("div", { className: "flex flex-col gap-2 w-full", ref: o, children: [
+}, Bte = Re(({ label: e, description: t, checked: a, onChange: n, size: r = "lg" }, o) => /* @__PURE__ */ u.jsxs("div", { className: "flex flex-col gap-2 w-full", ref: o, children: [
   /* @__PURE__ */ u.jsxs("div", { className: "flex justify-between items-center", children: [
     /* @__PURE__ */ u.jsx(
       Da,
@@ -39470,12 +39470,12 @@ const _J = Et(
           onTouchStart: d,
           onTouchEnd: h,
           children: [
-            n && /* @__PURE__ */ u.jsx(
+            /* @__PURE__ */ u.jsx(
               So,
               {
                 ref: f,
                 className: "absolute right-4 top-3 rounded-sm ring-offset-white hover:color-bg-default-hover p-1 transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-focused focus-visible:ring-offset-2 disabled:pointer-events-none data-[state=open]:color-bg-default-selected data-[state=open]:color-text-default",
-                children: /* @__PURE__ */ u.jsx(wo, { name: "Close", className: "h-5 w-5", fill: "#363B3F" })
+                children: n && /* @__PURE__ */ u.jsx(wo, { name: "Close", className: "h-5 w-5", fill: "#363B3F" })
               }
             ),
             r
@@ -56783,7 +56783,7 @@ function aX(e) {
     Np(n, e) || r(Xc(e));
   }, [(t = e.customEmojis) == null ? void 0 : t.length, e.open, e.emojiVersion, e.reactionsDefaultOpen, e.searchPlaceHolder, e.searchPlaceholder, e.defaultSkinTone, e.skinTonesDisabled, e.autoFocusSearch, e.emojiStyle, e.theme, e.suggestedEmojisMode, e.lazyLoadEmojis, e.className, e.height, e.width, e.searchDisabled, e.skinTonePickerLocation, e.allowExpandReactions]), n;
 }
-function Re() {
+function He() {
   return Me(Vp);
 }
 var qp = /* @__PURE__ */ D.createContext({});
@@ -56810,41 +56810,41 @@ var jn;
   e.REACTIONS = "reactions", e.PICKER = "picker";
 })(jn || (jn = {}));
 function rX() {
-  var e, t = Re(), a = t.searchPlaceHolder, n = t.searchPlaceholder;
+  var e, t = He(), a = t.searchPlaceHolder, n = t.searchPlaceholder;
   return (e = [a, n].find(function(r) {
     return r !== _r;
   })) != null ? e : _r;
 }
 function oX() {
-  var e = Re(), t = e.defaultSkinTone;
+  var e = He(), t = e.defaultSkinTone;
   return t;
 }
 function Zp() {
-  var e = Re(), t = e.allowExpandReactions;
+  var e = He(), t = e.allowExpandReactions;
   return t;
 }
 function Fp() {
-  var e = Re(), t = e.skinTonesDisabled;
+  var e = He(), t = e.skinTonesDisabled;
   return t;
 }
 function ea() {
-  var e = Re(), t = e.emojiStyle;
+  var e = He(), t = e.emojiStyle;
   return t;
 }
 function iX() {
-  var e = Re(), t = e.autoFocusSearch;
+  var e = He(), t = e.autoFocusSearch;
   return t;
 }
 function Gp() {
-  var e = Re(), t = e.categories;
+  var e = He(), t = e.categories;
   return t;
 }
 function sX() {
-  var e = Re(), t = e.customEmojis;
+  var e = He(), t = e.customEmojis;
   return t;
 }
 function fX() {
-  var e = Re(), t = e.open;
+  var e = He(), t = e.open;
   return t;
 }
 function cX(e) {
@@ -56858,58 +56858,58 @@ function lX() {
   };
 }
 function Up() {
-  var e = Re(), t = e.previewConfig;
+  var e = He(), t = e.previewConfig;
   return t;
 }
 function dX() {
-  var e = Re(), t = e.theme;
+  var e = He(), t = e.theme;
   return t;
 }
 function uX() {
-  var e = Re(), t = e.suggestedEmojisMode;
+  var e = He(), t = e.suggestedEmojisMode;
   return t;
 }
 function hX() {
-  var e = Re(), t = e.lazyLoadEmojis;
+  var e = He(), t = e.lazyLoadEmojis;
   return t;
 }
 function pX() {
-  var e = Re(), t = e.className;
+  var e = He(), t = e.className;
   return t;
 }
 function yX() {
-  var e = Re(), t = e.height, a = e.width, n = e.style;
+  var e = He(), t = e.height, a = e.width, n = e.style;
   return Ee({
     height: $c(t),
     width: $c(a)
   }, n);
 }
 function mX() {
-  var e = Re(), t = e.reactionsDefaultOpen;
+  var e = He(), t = e.reactionsDefaultOpen;
   return t;
 }
 function gX() {
-  var e = Re(), t = e.emojiVersion;
+  var e = He(), t = e.emojiVersion;
   return t;
 }
 function Wp() {
-  var e = Re(), t = e.searchDisabled;
+  var e = He(), t = e.searchDisabled;
   return t;
 }
 function Yp() {
-  var e = Re(), t = e.skinTonePickerLocation;
+  var e = He(), t = e.skinTonePickerLocation;
   return t;
 }
 function vX() {
-  var e = Re(), t = e.unicodeToHide;
+  var e = He(), t = e.unicodeToHide;
   return t;
 }
 function kX() {
-  var e = Re(), t = e.reactions;
+  var e = He(), t = e.reactions;
   return t;
 }
 function Ba() {
-  var e = Re(), t = e.getEmojiUrl;
+  var e = He(), t = e.getEmojiUrl;
   return t;
 }
 function $c(e) {
@@ -59491,7 +59491,7 @@ function z_(e) {
     value: t
   }, I(N_, Object.assign({}, e))));
 }
-const Kte = Ve(
+const Kte = Re(
   ({ handleEmojiClick: e, handleAvatarInput: t, onRemove: a, className: n, ...r }, o) => {
     const [s, f] = ke("emojiPicker"), c = ee(null), l = () => {
       c.current && c.current.click();
@@ -59584,9 +59584,11 @@ const Kte = Ve(
   secondaryAction: s,
   className: f,
   contentClassName: c,
-  hasCloseIcon: l
-}) => /* @__PURE__ */ u.jsx(cs, { open: e, onOpenChange: (d) => t(d), children: /* @__PURE__ */ u.jsxs(ds, { className: z("w-full", f), hasCloseIcon: l, children: [
-  /* @__PURE__ */ u.jsx(us, { className: "px-6 pt-6", children: /* @__PURE__ */ u.jsx(ps, { className: "text-left text-heading-md", children: a }) }),
+  hasCloseIcon: l,
+  headerClassName: d,
+  footerClassName: h
+}) => /* @__PURE__ */ u.jsx(cs, { open: e, onOpenChange: (p) => t(p), children: /* @__PURE__ */ u.jsxs(ds, { className: z("w-full", f), hasCloseIcon: l, children: [
+  /* @__PURE__ */ u.jsx(us, { className: z("px-6 pt-6", d), children: /* @__PURE__ */ u.jsx(ps, { className: "text-left text-heading-md", children: a }) }),
   /* @__PURE__ */ u.jsxs(
     "div",
     {
@@ -59603,7 +59605,7 @@ const Kte = Ve(
       ]
     }
   ),
-  /* @__PURE__ */ u.jsxs(hs, { className: "px-5 pb-5 gap-2 w-full", children: [
+  /* @__PURE__ */ u.jsxs(hs, { className: z("px-5 pb-5 gap-2 w-full", h), children: [
     s && /* @__PURE__ */ u.jsx(ls, { asChild: !0, children: /* @__PURE__ */ u.jsx(
       qt,
       {
@@ -59805,7 +59807,7 @@ function J_({ defaultProp: e, onChange: t }) {
     o
   ]), a;
 }
-const Zs = /* @__PURE__ */ Ve((e, t) => {
+const Zs = /* @__PURE__ */ Re((e, t) => {
   const { children: a, ...n } = e, r = p1.toArray(a), o = r.find(X_);
   if (o) {
     const s = o.props.children, f = r.map((c) => c === o ? p1.count(s) > 1 ? p1.only(null) : /* @__PURE__ */ yn(s) ? s.props.children : null : c);
@@ -59818,7 +59820,7 @@ const Zs = /* @__PURE__ */ Ve((e, t) => {
   }), a);
 });
 Zs.displayName = "Slot";
-const Oi = /* @__PURE__ */ Ve((e, t) => {
+const Oi = /* @__PURE__ */ Re((e, t) => {
   const { children: a, ...n } = e;
   return /* @__PURE__ */ yn(a) ? /* @__PURE__ */ ao(a, {
     ...$_(n, a.props),
@@ -59869,7 +59871,7 @@ const __ = [
   "svg",
   "ul"
 ], It = __.reduce((e, t) => {
-  const a = /* @__PURE__ */ Ve((n, r) => {
+  const a = /* @__PURE__ */ Re((n, r) => {
     const { asChild: o, ...s } = n, f = o ? Zs : t;
     return se(() => {
       window[Symbol.for("radix-ui")] = !0;
@@ -59905,7 +59907,7 @@ const ree = /* @__PURE__ */ Ct({
   layers: /* @__PURE__ */ new Set(),
   layersWithOutsidePointerEventsDisabled: /* @__PURE__ */ new Set(),
   branches: /* @__PURE__ */ new Set()
-}), oee = /* @__PURE__ */ Ve((e, t) => {
+}), oee = /* @__PURE__ */ Re((e, t) => {
   var a;
   const { disableOutsidePointerEvents: n = !1, onEscapeKeyDown: r, onPointerDownOutside: o, onFocusOutside: s, onInteractOutside: f, onDismiss: c, ...l } = e, d = Me(ree), [h, p] = ke(null), m = (a = h == null ? void 0 : h.ownerDocument) !== null && a !== void 0 ? a : globalThis == null ? void 0 : globalThis.document, [, v] = ke({}), g = er(
     t,
@@ -60028,7 +60030,7 @@ function Oy(e, t, a, { discrete: n }) {
 const F2 = "focusScope.autoFocusOnMount", G2 = "focusScope.autoFocusOnUnmount", vl = {
   bubbles: !1,
   cancelable: !0
-}, fee = /* @__PURE__ */ Ve((e, t) => {
+}, fee = /* @__PURE__ */ Re((e, t) => {
   const { loop: a = !1, trapped: n = !1, onMountAutoFocus: r, onUnmountAutoFocus: o, ...s } = e, [f, c] = ke(null), l = J1(r), d = J1(o), h = ee(null), p = er(
     t,
     (g) => c(g)
@@ -60195,7 +60197,7 @@ function pee(e) {
     (t) => t.tagName !== "A"
   );
 }
-const yee = /* @__PURE__ */ Ve((e, t) => {
+const yee = /* @__PURE__ */ Re((e, t) => {
   var a;
   const { container: n = globalThis == null || (a = globalThis.document) === null || a === void 0 ? void 0 : a.body, ...r } = e;
   return n ? /* @__PURE__ */ Tl.createPortal(/* @__PURE__ */ I(It.div, nt({}, r, {
@@ -60528,14 +60530,14 @@ const Uy = "Dialog", [Wy, $te] = G_(Uy), [Nee, na] = Wy(Uy), Dee = (e) => {
       container: r
     }, s))
   ));
-}, Bi = "DialogOverlay", Eee = /* @__PURE__ */ Ve((e, t) => {
+}, Bi = "DialogOverlay", Eee = /* @__PURE__ */ Re((e, t) => {
   const a = Qy(Bi, e.__scopeDialog), { forceMount: n = a.forceMount, ...r } = e, o = na(Bi, e.__scopeDialog);
   return o.modal ? /* @__PURE__ */ I(Ko, {
     present: n || o.open
   }, /* @__PURE__ */ I(Ree, nt({}, r, {
     ref: t
   }))) : null;
-}), Ree = /* @__PURE__ */ Ve((e, t) => {
+}), Ree = /* @__PURE__ */ Re((e, t) => {
   const { __scopeDialog: a, ...n } = e, r = na(Bi, a);
   return (
     // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
@@ -60556,7 +60558,7 @@ const Uy = "Dialog", [Wy, $te] = G_(Uy), [Nee, na] = Wy(Uy), Dee = (e) => {
       }
     })))
   );
-}), Tn = "DialogContent", Hee = /* @__PURE__ */ Ve((e, t) => {
+}), Tn = "DialogContent", Hee = /* @__PURE__ */ Re((e, t) => {
   const a = Qy(Tn, e.__scopeDialog), { forceMount: n = a.forceMount, ...r } = e, o = na(Tn, e.__scopeDialog);
   return /* @__PURE__ */ I(Ko, {
     present: n || o.open
@@ -60565,7 +60567,7 @@ const Uy = "Dialog", [Wy, $te] = G_(Uy), [Nee, na] = Wy(Uy), Dee = (e) => {
   })) : /* @__PURE__ */ I(Vee, nt({}, r, {
     ref: t
   })));
-}), Oee = /* @__PURE__ */ Ve((e, t) => {
+}), Oee = /* @__PURE__ */ Re((e, t) => {
   const a = na(Tn, e.__scopeDialog), n = ee(null), r = er(t, a.contentRef, n);
   return se(() => {
     const o = n.current;
@@ -60587,7 +60589,7 @@ const Uy = "Dialog", [Wy, $te] = G_(Uy), [Nee, na] = Wy(Uy), Dee = (e) => {
       (o) => o.preventDefault()
     )
   }));
-}), Vee = /* @__PURE__ */ Ve((e, t) => {
+}), Vee = /* @__PURE__ */ Re((e, t) => {
   const a = na(Tn, e.__scopeDialog), n = ee(!1), r = ee(!1);
   return /* @__PURE__ */ I(Jy, nt({}, e, {
     ref: t,
@@ -60608,7 +60610,7 @@ const Uy = "Dialog", [Wy, $te] = G_(Uy), [Nee, na] = Wy(Uy), Dee = (e) => {
       ((f = a.triggerRef.current) === null || f === void 0 ? void 0 : f.contains(c)) && o.preventDefault(), o.detail.originalEvent.type === "focusin" && r.current && o.preventDefault();
     }
   }));
-}), Jy = /* @__PURE__ */ Ve((e, t) => {
+}), Jy = /* @__PURE__ */ Re((e, t) => {
   const { __scopeDialog: a, trapFocus: n, onOpenAutoFocus: r, onCloseAutoFocus: o, ...s } = e, f = na(Tn, a), c = ee(null), l = er(t, c);
   return vee(), /* @__PURE__ */ I($1, null, /* @__PURE__ */ I(fee, {
     asChild: !0,
@@ -61022,7 +61024,23 @@ const dte = ({
   }
 );
 dte.displayName = "CommandShortcut";
-const r6 = ({
+const e1e = Re(({ count: e = 0 }, t) => {
+  const a = e > 9;
+  return /* @__PURE__ */ u.jsx(
+    "div",
+    {
+      ref: t,
+      className: z(
+        "color-bg-tertiary color-text-default rounded-full h-[18px] !font-bold text-helper-text-sm flex justify-center items-center",
+        {
+          "aspect-square": !a,
+          "w-auto p-2": a
+        }
+      ),
+      children: e
+    }
+  );
+}), r6 = ({
   direction: e = "horizontal",
   size: t = "lg",
   className: a,
@@ -61073,7 +61091,7 @@ const ute = ({
     isActive: t
   };
 };
-function e1e(e, t) {
+function t1e(e, t) {
   const [a, n] = ke(e), [r, o] = ke({
     keyName: (t == null ? void 0 : t.keyName) || null,
     order: (t == null ? void 0 : t.order) || "default"
@@ -61119,6 +61137,7 @@ export {
   ite as CommandList,
   cte as CommandSeparator,
   dte as CommandShortcut,
+  e1e as Counter,
   z3 as Dialog,
   P3 as DialogClose,
   fs as DialogContent,
@@ -61206,5 +61225,5 @@ export {
   yte as formatCounter,
   mte as getTrimmedName,
   ute as useHoverAndLongPress,
-  e1e as useSortableData
+  t1e as useSortableData
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fileverse/ui",
-  "version": "4.1.1-patch-1",
+  "version": "4.1.1-patch-3",
   "files": [
     "/dist"
   ],