@akanjs/ui 0.9.42 → 0.9.43

package/Data/CardList.d.ts

@@ -21,7 +21,7 @@ interface CardListProps<T extends string, Input, Full extends {
     init?: FetchInitForm<Input, Full, Filter>;
     sliceName: string;
     columns: DataColumn<any>[];
-    actions?: DataAction<Light>[] | ((item: Light, idx: number) => DataAction<Light>[]);
+    actions?: DataAction[] | ((item: Light, idx: number) => DataAction[]);
     renderItem: (args: DataItemProps<T, Full, Light>) => ReactNode;
     renderLoading?: () => ReactNode;
     renderTemplate?: (props: any) => ReactNode | null;

package/Data/Dashboard.d.ts

@@ -1,5 +1,4 @@
-import { StoreOf } from "@akanjs/store";
-export interface DashboardProps<T extends string, State, SL extends StoreOf<T, State>> {
+export interface DashboardProps<T extends string, State> {
     className?: string;
     summary: {
         [key: string]: any;
@@ -12,4 +11,4 @@ export interface DashboardProps<T extends string, State, SL extends StoreOf<T, S
     presents?: string[];
     hidePresents?: boolean;
 }
-export default function Dashboard<T extends string, State, SL extends StoreOf<T, State>>({ className, summary, sliceName, queryMap, columns, presents, hidePresents, }: DashboardProps<T, State, SL>): import("react/jsx-runtime").JSX.Element;
+export default function Dashboard<T extends string, State>({ className, summary, sliceName, queryMap, columns, presents, hidePresents, }: DashboardProps<T, State>): import("react/jsx-runtime").JSX.Element;

package/Data/Item.d.ts

@@ -1,6 +1,6 @@
 import { Dayjs } from "@akanjs/base";
 import { DataAction, DataColumn } from "@akanjs/client";
-import React, { ReactNode } from "react";
+import { ReactNode } from "react";
 export declare const convToAntdColumn: (column: DataColumn<any>) => {
     key: string;
     dataIndex: string;
@@ -37,7 +37,7 @@ interface ItemProps<T extends string, Full extends {
     onClick?: () => void;
     cover?: ReactNode;
     title?: ReactNode;
-    actions?: DataAction<Light>[];
+    actions?: DataAction[];
     columns?: DataColumn<any>[];
     children?: ReactNode;
 }
@@ -61,7 +61,7 @@ interface ActionProps<T extends string, M extends {
 }, L extends {
     id: string;
 }> {
-    action: DataAction<L>;
+    action: DataAction;
     model: L;
     sliceName: string;
 }
@@ -71,4 +71,4 @@ export declare const Action: <T extends string, M extends {
     id: string;
 }>({ action, model, sliceName, outline, }: ActionProps<T, M, L> & {
     outline?: boolean;
-}) => string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+}) => import("react/jsx-runtime").JSX.Element | null | undefined;

package/Data/ListContainer.d.ts

@@ -2,7 +2,7 @@ import { DataAction, DataColumn, DataTool, ModelInsightProps, ModelProps } from
 import { SortType } from "@akanjs/constant";
 import { type FetchInitForm } from "@akanjs/signal";
 import { ReactNode } from "react";
-interface ListContainerProps<T extends string, State, Input, Full extends {
+export interface ListContainerProps<T extends string, State, Input, Full extends {
     id: string;
 }, Light extends {
     id: string;
@@ -14,20 +14,25 @@ interface ListContainerProps<T extends string, State, Input, Full extends {
         [key: string]: any;
     };
     init?: FetchInitForm<Input, Full, Sort>;
-    sliceName: string;
+    sliceName: T;
     create?: boolean;
     title?: string;
     sort?: SortType;
     columns?: DataColumn<any>[];
     tools?: DataTool[] | ((modelList: Light[]) => DataTool[]);
-    actions?: DataAction<Light>[] | ((item: Light, idx: number) => DataAction<Light>[]);
-    renderDashboard?: ({ summary, hidePresents }: any) => ReactNode;
+    actions?: DataAction[] | ((item: Light, idx: number) => DataAction[]);
+    renderDashboard?: ({ summary, hidePresents, }: {
+        summary: {
+            [key: string]: any;
+        };
+        hidePresents?: boolean;
+    }) => ReactNode;
     renderItem?: (props: ModelProps<any, any>) => ReactNode;
     renderTemplate?: (props: any) => ReactNode | null;
     renderTitle?: (model: Full) => string | ReactNode;
     renderView?: (model: Full) => ReactNode | null;
     renderQueryMaker?: () => ReactNode;
-    renderInsight?: (props: ModelInsightProps<any>) => ReactNode;
+    renderInsight?: (props: ModelInsightProps) => ReactNode;
     renderLoading?: () => ReactNode;
 }
 export default function ListContainer<T extends string, State, Input, Full extends {
@@ -35,4 +40,3 @@ export default function ListContainer<T extends string, State, Input, Full exten
 }, Light extends {
     id: string;
 }, Sort extends SortType>({ className, cardListClassName, type, query, init, create, sliceName, title, sort, columns, actions, tools, renderDashboard, renderItem, renderTemplate, renderTitle, renderView, renderQueryMaker, renderInsight, renderLoading, }: ListContainerProps<T, State, Input, Full, Light, Sort>): import("react/jsx-runtime").JSX.Element;
-export {};

package/Data/TableList.d.ts

@@ -15,7 +15,7 @@ interface TableListProps<T extends string, Input, Full extends {
     renderTemplate?: (props: any) => ReactNode | null;
     renderTitle?: (model: Full) => string | ReactNode;
     renderView?: (model: Full) => ReactNode | null;
-    actions?: DataAction<Light>[] | ((item: Light, idx: number) => DataAction<Light>[]);
+    actions?: DataAction[] | ((item: Light, idx: number) => DataAction[]);
     onItemClick?: (item: Light, idx: number) => void;
 }
 export default function TableList<T extends string, Input, Full extends {

package/Model/AdminPanel.d.ts

@@ -0,0 +1,31 @@
+import { type SortType } from "@akanjs/constant";
+import type { ListContainerProps } from "../Data/ListContainer";
+interface AdminPanelProps<T extends string, State, Input, Full extends {
+    id: string;
+}, Light extends {
+    id: string;
+}, Sort extends SortType> extends ListContainerProps<T, State, Input, Full, Light, Sort> {
+    sliceName: T;
+    components: {
+        Template: {
+            [key: string]: any;
+        };
+        Unit: {
+            [key: string]: any;
+        };
+        View: {
+            [key: string]: any;
+        };
+    };
+    queryMap?: {
+        [key: string]: any;
+    };
+    summaryColumns?: string[];
+    insightColumns?: string[];
+}
+export default function AdminPanel<T extends string, State, Input, Full extends {
+    id: string;
+}, Light extends {
+    id: string;
+}, Sort extends SortType>({ sliceName, components, queryMap, summaryColumns, insightColumns, renderInsight, renderDashboard, ...props }: AdminPanelProps<T, State, Input, Full, Light, Sort>): import("react/jsx-runtime").JSX.Element;
+export {};

package/Model/index.d.ts

@@ -12,4 +12,5 @@ export declare const Model: {
     ViewEditModal: typeof import("./ViewEditModal").default;
     Edit: typeof import("./Edit").default;
     New: typeof import("./New").default;
+    AdminPanel: typeof import("./AdminPanel").default;
 };

package/Model/index_.d.ts

@@ -11,3 +11,4 @@ export declare const ViewWrapper: typeof import("./ViewWrapper").default;
 export declare const ViewEditModal: typeof import("./ViewEditModal").default;
 export declare const Edit: typeof import("./Edit").default;
 export declare const New: typeof import("./New").default;
+export declare const AdminPanel: typeof import("./AdminPanel").default;

package/cjs/Data/Item.js

@@ -89,10 +89,7 @@ function Item({
 }) {
   const { l } = (0, import_next.usePage)();
   const strActions = actions.filter((action) => typeof action === "string").map((action, idx) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Action, { action, outline: false, model, sliceName }, idx));
-  const customActions = actions.filter((action) => typeof action !== "string").map((action, idx) => ({
-    key: idx,
-    label: typeof action !== "string" ? action.render() : null
-  }));
+  const customActions = actions.filter((action) => typeof action !== "string").map((action, idx) => ({ key: idx, label: action }));
   const extraCols = columns.filter((column) => {
     const key = typeof column === "string" ? column : column.key;
     return !["id", "status", "createdAt"].includes(key);
@@ -184,7 +181,7 @@ const Action = ({
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `btn btn-square btn-ghost btn-sm m-1 text-center ${outline && "btn-outline border-dashed"}`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ai.AiOutlineDelete, {}) })
     },
     action
-  ) : action.render();
+  ) : action;
 };
 const statusColors = {
   active: "badge-info badge-outline",

package/cjs/Data/ListContainer.js

@@ -57,19 +57,12 @@ function ListContainer({
   title,
   sort,
   columns = ["id", "createdAt", "updatedAt"],
-  actions,
+  actions = ["remove", "edit", "view"],
   tools = [],
   renderDashboard,
   renderItem,
   renderTemplate,
-  renderTitle = (model) => model.id ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h2", { className: "flex items-center justify-center py-3 text-lg sm:justify-start md:text-2xl", children: [
-    sliceName,
-    " - ",
-    model.id
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h2", { className: "flex items-center justify-center py-3 text-lg sm:justify-start md:text-2xl", children: [
-    "New ",
-    sliceName
-  ] }),
+  renderTitle,
   renderView,
   renderQueryMaker = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {}),
   renderInsight,
@@ -78,7 +71,6 @@ function ListContainer({
   const { l } = (0, import_next.usePage)();
   const storeUse = import_store.st.use;
   const storeDo = import_store.st.do;
-  const storeGet = import_store.st.get;
   const refName = import_store.st.slice[sliceName].refName;
   const [modelName, modelClassName] = [refName, (0, import_common.capitalize)(refName)];
   if (refName !== sliceName)
@@ -111,6 +103,7 @@ function ListContainer({
   const cnst = (0, import_constant.getCnstMeta)(sliceName);
   const limitOfModel = storeUse[namesOfSlice.limitOfModel]();
   const sortOfModel = storeUse[namesOfSlice.sortOfModel]();
+  const RenderTitle = renderTitle ?? ((model) => `${l(`${refName}.modelName`)} - ${model.id ? model.id : "New"}`);
   const ModelDashboard = () => {
     const summary = storeUse.summary();
     const summaryLoading = storeUse.summaryLoading();
@@ -260,11 +253,11 @@ ${body}`], { type: "text/csv;charset=utf-8" });
       import_CardList.default,
       {
         sliceName,
-        renderItem: renderItem ?? (({ [sliceName]: model }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: model.id }, model.id)),
+        renderItem: renderItem ?? (({ [sliceName]: model }) => null),
         renderLoading,
         renderTemplate,
         renderView,
-        renderTitle,
+        renderTitle: RenderTitle,
         columns,
         actions,
         cardListClassName
@@ -276,10 +269,10 @@ ${body}`], { type: "text/csv;charset=utf-8" });
         sliceName,
         actions,
         renderTemplate,
-        renderTitle,
+        renderTitle: RenderTitle,
         renderView
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Model.Model.EditModal, { sliceName, renderTitle, children: RenderTemplate ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RenderTemplate, {}) : null })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Model.Model.EditModal, { sliceName, renderTitle: RenderTitle, children: RenderTemplate ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RenderTemplate, {}) : null })
   ] });
 }

package/cjs/Data/QueryMaker.js

@@ -92,7 +92,7 @@ function QueryMaker({ className, sliceName, query }) {
         {
           value: querySetting.queryKey,
           options: Object.keys(summaryQueryMap).map((queryKey) => ({
-            label: l.qry(sliceName, queryKey),
+            label: l.field("summary", queryKey),
             value: queryKey
           })),
           onChange: (queryKey) => {

package/cjs/Model/AdminPanel.js

@@ -0,0 +1,49 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var AdminPanel_exports = {};
+__export(AdminPanel_exports, {
+  default: () => AdminPanel
+});
+module.exports = __toCommonJS(AdminPanel_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_common = require("@akanjs/common");
+var import_constant = require("@akanjs/constant");
+var import_Data = require("../Data");
+function AdminPanel({
+  sliceName,
+  components,
+  queryMap = (0, import_constant.getQueryMap)((0, import_constant.getScalarModelRef)(`${(0, import_common.capitalize)(sliceName)}Summary`)),
+  summaryColumns = ["totalAdmin"],
+  insightColumns = ["count"],
+  renderInsight = ({ insight }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Data.Data.Insight, { insight, sliceName, columns: insightColumns }),
+  renderDashboard = ({ summary }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Data.Data.Dashboard, { summary, sliceName, columns: summaryColumns, queryMap }),
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_Data.Data.ListContainer,
+    {
+      sliceName,
+      renderItem: components.Unit.General,
+      renderInsight,
+      renderDashboard,
+      renderTemplate: components.Template.General,
+      renderView: (model) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(components.View.General, { ...{ [sliceName]: model } }),
+      ...props
+    }
+  );
+}

package/cjs/Model/index.js

@@ -34,5 +34,6 @@ const Model = {
   ViewWrapper: import_index.ViewWrapper,
   ViewEditModal: import_index.ViewEditModal,
   Edit: import_index.Edit,
-  New: import_index.New
+  New: import_index.New,
+  AdminPanel: import_index.AdminPanel
 };

package/cjs/Model/index_.js

@@ -27,6 +27,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var index_exports = {};
 __export(index_exports, {
+  AdminPanel: () => AdminPanel,
   Edit: () => Edit,
   EditModal: () => EditModal,
   EditWrapper: () => EditWrapper,
@@ -56,3 +57,4 @@ const ViewWrapper = (0, import_next.lazy)(() => import("./ViewWrapper"));
 const ViewEditModal = (0, import_next.lazy)(() => import("./ViewEditModal"));
 const Edit = (0, import_next.lazy)(() => import("./Edit"));
 const New = (0, import_next.lazy)(() => import("./New"));
+const AdminPanel = (0, import_next.lazy)(() => import("./AdminPanel"));

package/esm/Data/Item.js

@@ -65,10 +65,7 @@ function Item({
 }) {
   const { l } = usePage();
   const strActions = actions.filter((action) => typeof action === "string").map((action, idx) => /* @__PURE__ */ jsx(Action, { action, outline: false, model, sliceName }, idx));
-  const customActions = actions.filter((action) => typeof action !== "string").map((action, idx) => ({
-    key: idx,
-    label: typeof action !== "string" ? action.render() : null
-  }));
+  const customActions = actions.filter((action) => typeof action !== "string").map((action, idx) => ({ key: idx, label: action }));
   const extraCols = columns.filter((column) => {
     const key = typeof column === "string" ? column : column.key;
     return !["id", "status", "createdAt"].includes(key);
@@ -160,7 +157,7 @@ const Action = ({
       children: /* @__PURE__ */ jsx("button", { className: `btn btn-square btn-ghost btn-sm m-1 text-center ${outline && "btn-outline border-dashed"}`, children: /* @__PURE__ */ jsx(AiOutlineDelete, {}) })
     },
     action
-  ) : action.render();
+  ) : action;
 };
 const statusColors = {
   active: "badge-info badge-outline",

package/esm/Data/ListContainer.js

@@ -31,19 +31,12 @@ function ListContainer({
   title,
   sort,
   columns = ["id", "createdAt", "updatedAt"],
-  actions,
+  actions = ["remove", "edit", "view"],
   tools = [],
   renderDashboard,
   renderItem,
   renderTemplate,
-  renderTitle = (model) => model.id ? /* @__PURE__ */ jsxs("h2", { className: "flex items-center justify-center py-3 text-lg sm:justify-start md:text-2xl", children: [
-    sliceName,
-    " - ",
-    model.id
-  ] }) : /* @__PURE__ */ jsxs("h2", { className: "flex items-center justify-center py-3 text-lg sm:justify-start md:text-2xl", children: [
-    "New ",
-    sliceName
-  ] }),
+  renderTitle,
   renderView,
   renderQueryMaker = () => /* @__PURE__ */ jsx(Fragment, {}),
   renderInsight,
@@ -52,7 +45,6 @@ function ListContainer({
   const { l } = usePage();
   const storeUse = st.use;
   const storeDo = st.do;
-  const storeGet = st.get;
   const refName = st.slice[sliceName].refName;
   const [modelName, modelClassName] = [refName, capitalize(refName)];
   if (refName !== sliceName)
@@ -85,6 +77,7 @@ function ListContainer({
   const cnst = getCnstMeta(sliceName);
   const limitOfModel = storeUse[namesOfSlice.limitOfModel]();
   const sortOfModel = storeUse[namesOfSlice.sortOfModel]();
+  const RenderTitle = renderTitle ?? ((model) => `${l(`${refName}.modelName`)} - ${model.id ? model.id : "New"}`);
   const ModelDashboard = () => {
     const summary = storeUse.summary();
     const summaryLoading = storeUse.summaryLoading();
@@ -234,11 +227,11 @@ ${body}`], { type: "text/csv;charset=utf-8" });
       DataCardList,
       {
         sliceName,
-        renderItem: renderItem ?? (({ [sliceName]: model }) => /* @__PURE__ */ jsx("div", { children: model.id }, model.id)),
+        renderItem: renderItem ?? (({ [sliceName]: model }) => null),
         renderLoading,
         renderTemplate,
         renderView,
-        renderTitle,
+        renderTitle: RenderTitle,
         columns,
         actions,
         cardListClassName
@@ -250,11 +243,11 @@ ${body}`], { type: "text/csv;charset=utf-8" });
         sliceName,
         actions,
         renderTemplate,
-        renderTitle,
+        renderTitle: RenderTitle,
         renderView
       }
     ),
-    /* @__PURE__ */ jsx(Model.EditModal, { sliceName, renderTitle, children: RenderTemplate ? /* @__PURE__ */ jsx(RenderTemplate, {}) : null })
+    /* @__PURE__ */ jsx(Model.EditModal, { sliceName, renderTitle: RenderTitle, children: RenderTemplate ? /* @__PURE__ */ jsx(RenderTemplate, {}) : null })
   ] });
 }
 export {

package/esm/Data/QueryMaker.js

@@ -78,7 +78,7 @@ function QueryMaker({ className, sliceName, query }) {
         {
           value: querySetting.queryKey,
           options: Object.keys(summaryQueryMap).map((queryKey) => ({
-            label: l.qry(sliceName, queryKey),
+            label: l.field("summary", queryKey),
             value: queryKey
           })),
           onChange: (queryKey) => {

package/esm/Model/AdminPanel.js

@@ -0,0 +1,30 @@
+import { jsx } from "react/jsx-runtime";
+import { capitalize } from "@akanjs/common";
+import { getQueryMap, getScalarModelRef } from "@akanjs/constant";
+import { Data } from "../Data";
+function AdminPanel({
+  sliceName,
+  components,
+  queryMap = getQueryMap(getScalarModelRef(`${capitalize(sliceName)}Summary`)),
+  summaryColumns = ["totalAdmin"],
+  insightColumns = ["count"],
+  renderInsight = ({ insight }) => /* @__PURE__ */ jsx(Data.Insight, { insight, sliceName, columns: insightColumns }),
+  renderDashboard = ({ summary }) => /* @__PURE__ */ jsx(Data.Dashboard, { summary, sliceName, columns: summaryColumns, queryMap }),
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Data.ListContainer,
+    {
+      sliceName,
+      renderItem: components.Unit.General,
+      renderInsight,
+      renderDashboard,
+      renderTemplate: components.Template.General,
+      renderView: (model) => /* @__PURE__ */ jsx(components.View.General, { ...{ [sliceName]: model } }),
+      ...props
+    }
+  );
+}
+export {
+  AdminPanel as default
+};

package/esm/Model/index.js

@@ -1,4 +1,5 @@
 import {
+  AdminPanel,
   Edit,
   EditModal,
   EditWrapper,
@@ -26,7 +27,8 @@ const Model = {
   ViewWrapper,
   ViewEditModal,
   Edit,
-  New
+  New,
+  AdminPanel
 };
 export {
   Model

package/esm/Model/index_.js

@@ -12,7 +12,9 @@ const ViewWrapper = lazy(() => import("./ViewWrapper"));
 const ViewEditModal = lazy(() => import("./ViewEditModal"));
 const Edit = lazy(() => import("./Edit"));
 const New = lazy(() => import("./New"));
+const AdminPanel = lazy(() => import("./AdminPanel"));
 export {
+  AdminPanel,
   Edit,
   EditModal,
   EditWrapper,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akanjs/ui",
-  "version": "0.9.42",
+  "version": "0.9.43",
   "sourceType": "module",
   "publishConfig": {
     "access": "public"