@tenorlab/react-dashboard 1.1.8 → 1.2.1

package/dist/components/dashboard-primitives/Wrappers.d.ts

@@ -1,6 +1,7 @@
-export declare function WrapperColumnContent({ children }: {
+type TProps = {
     children: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function WrapperColumnContentListItem({ children }: {
-    children: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
+    addCssClasses?: string;
+};
+export declare function WrapperColumnContent({ children, addCssClasses }: TProps): import("react/jsx-runtime").JSX.Element;
+export declare function WrapperColumnContentListItem({ children, addCssClasses }: TProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/interfaces/core-react.interfaces.d.ts

@@ -6,7 +6,7 @@ export type TWidgetMetaInfo = TWidgetMetaInfoBase<TFrameworkElementType | undefi
 export interface IDashboardGridProps extends IDashboardGridPropsBase {
     children?: ReactNode;
 }
-export interface IDashboardWidgetProps extends IDashboardWidgetPropsBase {
+export interface IDashboardWidgetProps<TExtraProps = any> extends IDashboardWidgetPropsBase<TExtraProps> {
     children?: ReactNode;
     onRemoveClick?: (widgetKey: TDashboardWidgetKey, parentWidgetKey?: TDashboardWidgetKey) => void;
     onMoveClick?: (direction: -1 | 1, widgetKey: TDashboardWidgetKey, parentWidgetKey?: TDashboardWidgetKey) => void;

package/dist/react-dashboard.es.js

@@ -817,7 +817,7 @@ function nn({ className: e }) {
     }
   );
 }
-const Z = (e, ...n) => [
+const G = (e, ...n) => [
   ...new Set(
     [e || "", ...n].join(" ").trim().replace(/\n+/gi, " ").replace(/\s+/gi, " ").split(" ")
   )
@@ -863,7 +863,7 @@ const Z = (e, ...n) => [
   onKeyDown: i,
   placeholder: s = ""
 }) => {
-  const d = st(() => t === "small" ? "py-1.5 px-3 text-sm" : "py-2.5 px-4 text-base", [t]), b = Z("flex flex-col mb-4", n || ""), h = `${Z(`
+  const d = st(() => t === "small" ? "py-1.5 px-3 text-sm" : "py-2.5 px-4 text-base", [t]), b = G("flex flex-col mb-4", n || ""), h = `${G(`
     block w-full rounded-md px-3 py-1.5 text-base 
     bg-formfield content-formfield
     outline-1 -outline-offset-1 outline-primary 
@@ -914,7 +914,7 @@ function J(e) {
     S = S.length > 0 ? S : "";
     const c = Number((e.borderHover || 0) > 0 ? e.borderHover : 0), E = e.shadow || "sm", l = e.shadowHover || "md", f = (e.addCss || "").trim(), M = e.justifyCss || "justify-center";
     if (y)
-      return Z(
+      return G(
         "flex flex-row items-center",
         v ? "text-disabled" : `text-${D} hover:brightness-110 cursor-pointer`,
         w || ""
@@ -944,14 +944,14 @@ function J(e) {
   };
   return /* @__PURE__ */ a("button", { type: "button", disabled: t, className: u(), style: m(), ...h, children: g });
 }
-const rn = (e) => e.direction === "row" ? Z("flex flex-row items-center gap-2", e.classNames || "") : Z("flex flex-col gap-2 w-full", e.classNames || "");
+const rn = (e) => e.direction === "row" ? G("flex flex-row items-center gap-2", e.classNames || "") : G("flex flex-col gap-2 w-full", e.classNames || "");
 function on(e) {
   const { children: n, testId: t, classNames: r, direction: o, ...i } = e, s = rn(e);
   return /* @__PURE__ */ a("div", { "data-testid": t || "not-set", className: s, ...i, children: n });
 }
 const Gn = ce(
   (e, n) => {
-    const { classNames: t, innerClass: r, ...o } = e, i = Z(t || "", "w-full"), s = Z(
+    const { classNames: t, innerClass: r, ...o } = e, i = G(t || "", "w-full"), s = G(
       `w-full flex overflow-hidden justify-between items-center gap-0 
       rounded-md border`,
       r || ""
@@ -1138,10 +1138,10 @@ function ln() {
     function V(_) {
       return S(_) === o;
     }
-    function G(_) {
+    function Z(_) {
       return S(_) === u;
     }
-    q.AsyncMode = c, q.ConcurrentMode = E, q.ContextConsumer = l, q.ContextProvider = f, q.Element = M, q.ForwardRef = $, q.Fragment = I, q.Lazy = T, q.Memo = z, q.Portal = X, q.Profiler = Q, q.StrictMode = K, q.Suspense = ee, q.isAsyncMode = de, q.isConcurrentMode = x, q.isContextConsumer = P, q.isContextProvider = A, q.isElement = k, q.isForwardRef = O, q.isFragment = L, q.isLazy = R, q.isMemo = j, q.isPortal = F, q.isProfiler = Y, q.isStrictMode = V, q.isSuspense = G, q.isValidElementType = C, q.typeOf = S;
+    q.AsyncMode = c, q.ConcurrentMode = E, q.ContextConsumer = l, q.ContextProvider = f, q.Element = M, q.ForwardRef = $, q.Fragment = I, q.Lazy = T, q.Memo = z, q.Portal = X, q.Profiler = Q, q.StrictMode = K, q.Suspense = ee, q.isAsyncMode = de, q.isConcurrentMode = x, q.isContextConsumer = P, q.isContextProvider = A, q.isElement = k, q.isForwardRef = O, q.isFragment = L, q.isLazy = R, q.isMemo = j, q.isPortal = F, q.isProfiler = Y, q.isStrictMode = V, q.isSuspense = Z, q.isValidElementType = C, q.typeOf = S;
   })()), q;
 }
 var qe;
@@ -1309,8 +1309,8 @@ function un() {
     function v(x) {
       if (process.env.NODE_ENV !== "production")
         var P = {}, A = 0;
-      function k(L, R, j, F, Y, V, G) {
-        if (F = F || m, V = V || j, G !== t) {
+      function k(L, R, j, F, Y, V, Z) {
+        if (F = F || m, V = V || j, Z !== t) {
           if (b) {
             var _ = new Error(
               "Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types"
@@ -1405,7 +1405,7 @@ function un() {
         for (var j = A[k], F = 0; F < x.length; F++)
           if (D(j, x[F]))
             return null;
-        var Y = JSON.stringify(x, function(G, _) {
+        var Y = JSON.stringify(x, function(Z, _) {
           var te = ee(_);
           return te === "symbol" ? String(_) : _;
         });
@@ -1442,7 +1442,7 @@ function un() {
       }
       function k(O, L, R, j, F) {
         for (var Y = [], V = 0; V < x.length; V++) {
-          var G = x[V], _ = G(O, L, R, j, F, t);
+          var Z = x[V], _ = Z(O, L, R, j, F, t);
           if (_ == null)
             return null;
           _.data && r(_.data, "expectedType") && Y.push(_.data.expectedType);
@@ -1472,9 +1472,9 @@ function un() {
           var V = x[Y];
           if (typeof V != "function")
             return I(O, L, R, Y, ee(V));
-          var G = V(j, Y, O, L, R + "." + Y, t);
-          if (G)
-            return G;
+          var Z = V(j, Y, O, L, R + "." + Y, t);
+          if (Z)
+            return Z;
         }
         return null;
       }
@@ -1487,15 +1487,15 @@ function un() {
           return new p("Invalid " + L + " `" + R + "` of type `" + F + "` " + ("supplied to `" + O + "`, expected `object`."));
         var Y = n({}, A[k], x);
         for (var V in Y) {
-          var G = x[V];
-          if (r(x, V) && typeof G != "function")
-            return I(O, L, R, V, ee(G));
-          if (!G)
+          var Z = x[V];
+          if (r(x, V) && typeof Z != "function")
+            return I(O, L, R, V, ee(Z));
+          if (!Z)
             return new p(
               "Invalid " + L + " `" + R + "` key `" + V + "` supplied to `" + O + "`.\nBad object: " + JSON.stringify(A[k], null, "  ") + `
 Valid keys: ` + JSON.stringify(Object.keys(x), null, "  ")
             );
-          var _ = G(j, V, O, L, R + "." + V, t);
+          var _ = Z(j, V, O, L, R + "." + V, t);
           if (_)
             return _;
         }
@@ -2618,11 +2618,15 @@ const vn = /* @__PURE__ */ an(bn), xn = ce((e, n) => {
     )
   );
 });
-function tr({ children: e }) {
+function tr({ children: e, addCssClasses: n }) {
+  const t = G(
+    "w-full h-full flex-1 flex flex-col",
+    (n || "gap-2 items-end justify-end content-end").trim()
+  );
   return /* @__PURE__ */ a(
     "div",
     {
-      className: "w-full h-full flex-1 flex flex-col gap-2 items-end justify-end content-end",
+      className: t,
       style: {
         minHeight: "140px"
       },
@@ -2630,8 +2634,12 @@ function tr({ children: e }) {
     }
   );
 }
-function nr({ children: e }) {
-  return /* @__PURE__ */ a("div", { className: "w-full flex flex-col items-end", children: e });
+function nr({ children: e, addCssClasses: n }) {
+  const t = G(
+    "w-full flex flex-col",
+    (n || "items-end").trim()
+  );
+  return /* @__PURE__ */ a("div", { className: t, children: e });
 }
 const rr = (e) => {
   console.warn("showToast TODO", e);
@@ -2640,7 +2648,7 @@ const rr = (e) => {
   const r = e.responsiveGrid || !1, o = e.isEditing || !1, i = {
     "--bwj-dashboard-transform-scale": t,
     "--bwj-dashboard-add-cols": wn(t)
-  }, s = Z(
+  }, s = G(
     "dashboard-main-grid w-full",
     o ? "editing" : "",
     r ? "responsive-grid" : "",
@@ -2655,7 +2663,7 @@ const rr = (e) => {
     e.onRemoveClick && e.widgetKey && e.onRemoveClick(e.widgetKey, e.parentWidgetKey);
   }, s = (b) => {
     e.onMoveClick && e.widgetKey && e.onMoveClick(b, e.widgetKey, e.parentWidgetKey);
-  }, d = Z(
+  }, d = G(
     "widget-header",
     t ? "hidden" : "flex items-center justify-between border-b border-solid border-card-invert",
     t ? "border-opacity-0" : "border-opacity-20"
@@ -2861,7 +2869,7 @@ function ke(e) {
   ["large", "xlarge"].indexOf(e.size || "") > -1 && (g = `${e.size}-widget`);
   let h = "";
   t === "row" && !r ? h = "min-h-48" : t === "column" && !r && (h = "min-h-96");
-  let u = Z(
+  let u = G(
     "dashboard-widget-container relative ",
     r ? "" : "has-no-children",
     o ? "editing" : "",
@@ -2973,7 +2981,7 @@ function We({
   alreadyAdded: n,
   addWidget: t
 }) {
-  const [r, o] = le(!1), i = e.icon || nn, s = e.displayName || "Unknown", d = e.description || "---", g = (e.noDuplicatedWidgets || !1) && n, h = Z(`
+  const [r, o] = le(!1), i = e.icon || nn, s = e.displayName || "Unknown", d = e.description || "---", g = (e.noDuplicatedWidgets || !1) && n, h = G(`
     flex flex-row gap-2 p-2 rounded-md border text-sm bg-card content-card backdrop-opacity-100
     ${g ? "border-disabled fill-disabled text-disabled" : "cursor-pointer border-primary fill-danger hover:fill-primary content-primary hover:brightness-110"}
   `);
@@ -3003,7 +3011,7 @@ function Tn({
   item: e,
   onSettingItemChanged: n
 }) {
-  const t = e.displayName || "Unknown", r = e.description || "---", o = Z(`
+  const t = e.displayName || "Unknown", r = e.description || "---", o = G(`
     flex flex-row gap-2 p-2 rounded-md border text-sm bg-card content-card backdrop-opacity-100
   `), i = (d) => {
     const b = d.key;
@@ -3067,7 +3075,7 @@ function lr({
   }, S = (T) => {
     const z = D.trim().toLowerCase();
     return z.length < 1 ? !0 : T.displayName.trim().toLowerCase().includes(z) || T.description.toLowerCase().includes(z);
-  }, c = (T) => Z(
+  }, c = (T) => G(
     "px-4 py-2 font-medium cursor-pointer border-b-2 border-transparent hover:border-primary focus:outline-none",
     T === m ? "text-primary border-primary" : ""
   ), E = !!e;
@@ -3296,7 +3304,7 @@ export {
   ct as ensureZoomScaleIsWithinRange,
   ge as getDefaultWidgetMetaFromKey,
   Wn as getDefaultWidgetMetaFromMap,
-  Z as getDistinctCssClasses,
+  G as getDistinctCssClasses,
   Ot as getMetaInfoFromFile,
   Pn as getNewZoomScaleWithinRange,
   $t as getWidgetMetaFromCatalog,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tenorlab/react-dashboard",
-  "version": "1.1.8",
+  "version": "1.2.1",
   "description": "Foundation components for creating user-configurable dashboards in React",
   "author": "Damiano Fusco",
   "type": "module",