@akanjs/ui 1.0.7 → 1.0.8

package/DraggableList.d.ts

@@ -17,10 +17,11 @@ interface Cursor {
 interface ItemProps {
     value: any;
     children: ReactNode;
+    removable?: boolean;
 }
 export declare const DraggableList: {
     <V>({ className, mode, children, onChange, onRemove }: DragListProps<V>): import("react/jsx-runtime").JSX.Element;
     Cursor({ className, children }: Cursor): import("react/jsx-runtime").JSX.Element;
-    Item: ({ value, children }: ItemProps) => import("react/jsx-runtime").JSX.Element;
+    Item: ({ value, children, removable }: ItemProps) => import("react/jsx-runtime").JSX.Element;
 };
 export {};

package/Load/Edit_Client.d.ts

@@ -11,6 +11,8 @@ interface DefaultProps {
     children?: ReactNode;
     onSubmit?: string;
     onCancel?: string;
+    submitText?: string;
+    submitClassName?: string;
     submitOption?: CreateOption<any>;
     renderSubmit?: boolean;
 }
@@ -21,5 +23,5 @@ export interface EditProps<T extends string, Full extends {
 }
 export default function Edit_Client<T extends string, Full extends {
     id: string;
-}>({ className, checkSubmit, modalClassName, type, edit, modal, sliceName, children, onSubmit, onCancel, submitOption, renderSubmit, }: EditProps<T, Full>): import("react/jsx-runtime").JSX.Element;
+}>({ className, checkSubmit, modalClassName, type, edit, modal, sliceName, children, onSubmit, onCancel, submitText, submitClassName, submitOption, renderSubmit, }: EditProps<T, Full>): import("react/jsx-runtime").JSX.Element;
 export {};

package/Model/EditModal.d.ts

@@ -22,6 +22,8 @@ interface EditModalProps<Full extends {
     checkSubmit?: boolean;
     modalClassName?: string;
     renderTitle?: ((model: Full) => string | ReactNode) | string;
+    submitText?: string;
+    submitClassName?: string;
     submitOption?: CreateOption<Full>;
     renderSubmit?: boolean | ((any: any) => ReactNode);
     onSubmit?: string | ((model: Full) => void);
@@ -29,5 +31,5 @@ interface EditModalProps<Full extends {
 }
 export default function EditModal<Full extends {
     id: string;
-}>({ type, sliceName, id, className, disabled, checkSubmit, modalClassName, edit, modal, renderTitle, children, submitOption, renderSubmit, loadingWrapper, onSubmit, onCancel, }: EditModalProps<Full>): import("react/jsx-runtime").JSX.Element | undefined;
+}>({ type, sliceName, id, className, disabled, checkSubmit, modalClassName, edit, modal, renderTitle, children, submitText, submitClassName, submitOption, renderSubmit, loadingWrapper, onSubmit, onCancel, }: EditModalProps<Full>): import("react/jsx-runtime").JSX.Element | undefined;
 export {};

package/Model/EditWrapper.d.ts

@@ -5,7 +5,8 @@ interface EditWrapperProps {
     sliceName: string;
     modelId: string;
     modal?: string | null;
+    disabled?: boolean;
     resets?: string[] | null;
 }
-export default function EditWrapper({ children, sliceName, modelId, className, modal, resets }: EditWrapperProps): import("react/jsx-runtime").JSX.Element;
+export default function EditWrapper({ children, sliceName, modelId, className, modal, disabled, resets, }: EditWrapperProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/cjs/Copy.js

@@ -22,15 +22,17 @@ __export(Copy_exports, {
 });
 module.exports = __toCommonJS(Copy_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_client = require("@akanjs/client");
 var import_store = require("@akanjs/store");
 var import_react_copy_to_clipboard = require("react-copy-to-clipboard");
 const Copy = ({ text, copyMessage, children }) => {
+  const { l } = (0, import_client.usePage)();
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_react_copy_to_clipboard.CopyToClipboard,
     {
       text: text ?? "",
       onCopy: () => {
-        import_store.st.do.showMessage({ content: copyMessage ?? "Copied", type: "success" });
+        import_store.st.do.showMessage({ content: copyMessage ?? l.trans({ en: "Copied", ko: "\uBCF5\uC0AC\uB418\uC5C8\uC2B5\uB2C8\uB2E4" }), type: "success" });
       },
       children
     }

package/cjs/DraggableList.js

@@ -133,12 +133,12 @@ DragList.Cursor = ({ className, children }) => {
     }
   );
 };
-const Item = ({ value, children }) => {
+const Item = ({ value, children, removable = false }) => {
   const { onRemove } = useDragList();
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex w-full items-center gap-2", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DraggableList.Cursor, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_md.MdDragIndicator, { className: "text-xl" }) }),
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    removable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "button",
       {
         className: "btn btn-xs btn-error btn-square btn-outline",

package/cjs/Load/Edit_Client.js

@@ -37,6 +37,8 @@ function Render({
   children,
   onSubmit,
   onCancel,
+  submitText,
+  submitClassName,
   submitOption,
   renderSubmit
 }) {
@@ -55,6 +57,8 @@ function Render({
       modal,
       onSubmit,
       onCancel,
+      submitText,
+      submitClassName,
       submitOption,
       renderSubmit,
       children
@@ -72,6 +76,8 @@ function Edit_Client({
   children,
   onSubmit,
   onCancel,
+  submitText,
+  submitClassName,
   submitOption,
   renderSubmit
 }) {
@@ -86,6 +92,8 @@ function Edit_Client({
     children,
     onSubmit,
     onCancel,
+    submitText,
+    submitClassName,
     submitOption,
     renderSubmit
   };

package/cjs/Model/EditModal.js

@@ -89,6 +89,8 @@ function EditModal({
   modal,
   renderTitle,
   children,
+  submitText,
+  submitClassName,
   submitOption,
   renderSubmit,
   loadingWrapper,
@@ -183,19 +185,19 @@ function EditModal({
             if (typeof onSubmit === "function")
               onSubmit(model);
             void submitOption?.onSuccess?.(model);
+            if (onSubmit === "back")
+              import_client.router.back();
+            else if (onSubmit === "reset")
+              void storeDo[names.resetModel]();
+            else if (typeof onSubmit === "string")
+              import_client.router.replace(onSubmit.replace(new RegExp(`\\[${names.model}Id\\]`, "g"), model.id));
           }
         });
-        if (onSubmit === "back")
-          import_client.router.back();
-        else if (onSubmit === "reset")
-          void storeDo[names.resetModel]();
-        else if (typeof onSubmit === "string")
-          import_client.router.replace(onSubmit);
       }, []);
       return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
         import_Button.Button,
         {
-          className: "btn btn-primary w-full gap-2 rounded-2xl",
+          className: (0, import_client.clsx)("btn btn-primary mt-4 w-full gap-2 rounded-2xl", submitClassName),
           disabled: modelSubmit.disabled || !!disabled,
           onClick: async (e, { onError }) => {
             await handleSubmit({ onError });
@@ -204,7 +206,7 @@ function EditModal({
           },
           children: [
             modelFormId ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ai.AiOutlineSave, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ai.AiOutlinePlus, {}),
-            l(modelFormId ? "base.updateModel" : "base.createModel", {
+            submitText ?? l(modelFormId ? "base.updateModel" : "base.createModel", {
               model: l._(`${names.model}.modelName`)
             })
           ]
@@ -253,7 +255,7 @@ function EditModal({
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, {}),
           children,
-          type === "form" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mt-4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Submit, {}) }) : null
+          type === "form" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Submit, {}) : null
         ]
       }
     );

package/cjs/Model/EditWrapper.js

@@ -25,7 +25,15 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var import_client = require("@akanjs/client");
 var import_common = require("@akanjs/common");
 var import_store = require("@akanjs/store");
-function EditWrapper({ children, sliceName, modelId, className, modal, resets }) {
+function EditWrapper({
+  children,
+  sliceName,
+  modelId,
+  className,
+  modal,
+  disabled,
+  resets
+}) {
   const refName = import_store.st.slice[sliceName].refName;
   const modelName = refName;
   const names = {
@@ -37,6 +45,8 @@ function EditWrapper({ children, sliceName, modelId, className, modal, resets })
     {
       className: (0, import_client.clsx)("cursor-pointer", className),
       onClick: (e) => {
+        if (disabled)
+          return;
         e.stopPropagation();
         void storeDo[names.editModel](modelId, { modal });
         resets?.forEach((reset) => {

package/cjs/ToggleSelect.js

@@ -33,7 +33,7 @@ const ToggleSelect = ({
   disabled
 }) => {
   const { l } = (0, import_client.usePage)();
-  const validateResult = value ? validate(value) : false;
+  const validateResult = value !== null ? validate(value) : false;
   const invalidMessage = value === null || typeof value === "string" && !value.length || validateResult === true ? null : validateResult === false ? l("base.invalidValueError") : validateResult;
   const options = items.map(
     (item) => typeof item === "string" || typeof item === "number" ? { label: item.toString(), value: item } : item
@@ -55,7 +55,7 @@ const ToggleSelect = ({
               disabled: isDisabled,
               className: (0, import_client.clsx)(
                 "btn btn-sm",
-                { "bg-success/70 text-success-content": isSelected, "cursor-not-allowed": isDisabled },
+                { "bg-success/70 text-success-content": isSelected, "btn-disabled cursor-not-allowed": isDisabled },
                 // {
                 //   "btn-error": status === "error",
                 //   "btn-warning": status === "warning",

package/esm/Copy.js

@@ -1,14 +1,16 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
+import { usePage } from "@akanjs/client";
 import { st } from "@akanjs/store";
 import { CopyToClipboard } from "react-copy-to-clipboard";
 const Copy = ({ text, copyMessage, children }) => {
+  const { l } = usePage();
   return /* @__PURE__ */ jsx(
     CopyToClipboard,
     {
       text: text ?? "",
       onCopy: () => {
-        st.do.showMessage({ content: copyMessage ?? "Copied", type: "success" });
+        st.do.showMessage({ content: copyMessage ?? l.trans({ en: "Copied", ko: "\uBCF5\uC0AC\uB418\uC5C8\uC2B5\uB2C8\uB2E4" }), type: "success" });
       },
       children
     }

package/esm/DraggableList.js

@@ -101,12 +101,12 @@ DragList.Cursor = ({ className, children }) => {
     }
   );
 };
-const Item = ({ value, children }) => {
+const Item = ({ value, children, removable = false }) => {
   const { onRemove } = useDragList();
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center gap-2", children: [
     /* @__PURE__ */ jsx(DraggableList.Cursor, { children: /* @__PURE__ */ jsx(MdDragIndicator, { className: "text-xl" }) }),
     children,
-    /* @__PURE__ */ jsx(
+    removable && /* @__PURE__ */ jsx(
       "button",
       {
         className: "btn btn-xs btn-error btn-square btn-outline",

package/esm/Load/Edit_Client.js

@@ -15,6 +15,8 @@ function Render({
   children,
   onSubmit,
   onCancel,
+  submitText,
+  submitClassName,
   submitOption,
   renderSubmit
 }) {
@@ -33,6 +35,8 @@ function Render({
       modal,
       onSubmit,
       onCancel,
+      submitText,
+      submitClassName,
       submitOption,
       renderSubmit,
       children
@@ -50,6 +54,8 @@ function Edit_Client({
   children,
   onSubmit,
   onCancel,
+  submitText,
+  submitClassName,
   submitOption,
   renderSubmit
 }) {
@@ -64,6 +70,8 @@ function Edit_Client({
     children,
     onSubmit,
     onCancel,
+    submitText,
+    submitClassName,
     submitOption,
     renderSubmit
   };

package/esm/Model/EditModal.js

@@ -67,6 +67,8 @@ function EditModal({
   modal,
   renderTitle,
   children,
+  submitText,
+  submitClassName,
   submitOption,
   renderSubmit,
   loadingWrapper,
@@ -161,19 +163,19 @@ function EditModal({
             if (typeof onSubmit === "function")
               onSubmit(model);
             void submitOption?.onSuccess?.(model);
+            if (onSubmit === "back")
+              router.back();
+            else if (onSubmit === "reset")
+              void storeDo[names.resetModel]();
+            else if (typeof onSubmit === "string")
+              router.replace(onSubmit.replace(new RegExp(`\\[${names.model}Id\\]`, "g"), model.id));
           }
         });
-        if (onSubmit === "back")
-          router.back();
-        else if (onSubmit === "reset")
-          void storeDo[names.resetModel]();
-        else if (typeof onSubmit === "string")
-          router.replace(onSubmit);
       }, []);
       return /* @__PURE__ */ jsxs(
         Button,
         {
-          className: "btn btn-primary w-full gap-2 rounded-2xl",
+          className: clsx("btn btn-primary mt-4 w-full gap-2 rounded-2xl", submitClassName),
           disabled: modelSubmit.disabled || !!disabled,
           onClick: async (e, { onError }) => {
             await handleSubmit({ onError });
@@ -182,7 +184,7 @@ function EditModal({
           },
           children: [
             modelFormId ? /* @__PURE__ */ jsx(AiOutlineSave, {}) : /* @__PURE__ */ jsx(AiOutlinePlus, {}),
-            l(modelFormId ? "base.updateModel" : "base.createModel", {
+            submitText ?? l(modelFormId ? "base.updateModel" : "base.createModel", {
               model: l._(`${names.model}.modelName`)
             })
           ]
@@ -231,7 +233,7 @@ function EditModal({
         children: [
           /* @__PURE__ */ jsx(Title, {}),
           children,
-          type === "form" ? /* @__PURE__ */ jsx("div", { className: "mt-4", children: /* @__PURE__ */ jsx(Submit, {}) }) : null
+          type === "form" ? /* @__PURE__ */ jsx(Submit, {}) : null
         ]
       }
     );

package/esm/Model/EditWrapper.js

@@ -3,7 +3,15 @@ import { jsx } from "react/jsx-runtime";
 import { clsx } from "@akanjs/client";
 import { capitalize } from "@akanjs/common";
 import { st } from "@akanjs/store";
-function EditWrapper({ children, sliceName, modelId, className, modal, resets }) {
+function EditWrapper({
+  children,
+  sliceName,
+  modelId,
+  className,
+  modal,
+  disabled,
+  resets
+}) {
   const refName = st.slice[sliceName].refName;
   const modelName = refName;
   const names = {
@@ -15,6 +23,8 @@ function EditWrapper({ children, sliceName, modelId, className, modal, resets })
     {
       className: clsx("cursor-pointer", className),
       onClick: (e) => {
+        if (disabled)
+          return;
         e.stopPropagation();
         void storeDo[names.editModel](modelId, { modal });
         resets?.forEach((reset) => {

package/esm/ToggleSelect.js

@@ -11,7 +11,7 @@ const ToggleSelect = ({
   disabled
 }) => {
   const { l } = usePage();
-  const validateResult = value ? validate(value) : false;
+  const validateResult = value !== null ? validate(value) : false;
   const invalidMessage = value === null || typeof value === "string" && !value.length || validateResult === true ? null : validateResult === false ? l("base.invalidValueError") : validateResult;
   const options = items.map(
     (item) => typeof item === "string" || typeof item === "number" ? { label: item.toString(), value: item } : item
@@ -33,7 +33,7 @@ const ToggleSelect = ({
               disabled: isDisabled,
               className: clsx(
                 "btn btn-sm",
-                { "bg-success/70 text-success-content": isSelected, "cursor-not-allowed": isDisabled },
+                { "bg-success/70 text-success-content": isSelected, "btn-disabled cursor-not-allowed": isDisabled },
                 // {
                 //   "btn-error": status === "error",
                 //   "btn-warning": status === "warning",

package/package.json

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