@pnkx-lib/ui 1.8.3 → 1.8.7

package/es/chunks/{Checkbox-2LoiNtBe.js → Radio-D2me1zZ-.js}

@@ -1,5 +1,5 @@
-import { g as get, j as jsxRuntimeExports, L as Label, E as ErrorMessage, T as Typography } from './Switch-C3IZzn6L.js';
-import { Select as Select$1, Radio, Checkbox } from 'antd';
+import { g as get, j as jsxRuntimeExports, L as Label, E as ErrorMessage, T as Typography } from './Switch-za5Skgtp.js';
+import { Select as Select$1, Radio } from 'antd';
 
 const Select = (props) => {
   //! State
@@ -100,53 +100,4 @@ const RadioGroup = (props) => {
   ] });
 };
 
-const CheckboxField = (props) => {
-  //! State
-  const {
-    field,
-    formState,
-    label,
-    afterOnChange,
-    customStyleContainer,
-    customStyleCheckbox,
-    ...restProps
-  } = props;
-  const { name, value, onChange, onBlur } = field || {};
-  const { touchedFields, errors, isSubmitted } = formState || {};
-  const isTouched = get(touchedFields, name);
-  const errorMessage = get(errors, name)?.message;
-  //! Function
-  const handleChange = (e) => {
-    const checked = e.target.checked;
-    onChange?.(checked);
-    afterOnChange?.(checked);
-  };
-  const renderErrorMessage = () => {
-    if (!errorMessage) return null;
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      ErrorMessage,
-      {
-        errorMessage,
-        isTouched,
-        isSubmitted
-      }
-    );
-  };
-  //! Render
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: customStyleContainer, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Checkbox,
-      {
-        onBlur,
-        checked: !!value,
-        onChange: handleChange,
-        className: customStyleCheckbox,
-        ...restProps,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx(Typography.Text, { children: label })
-      }
-    ),
-    renderErrorMessage()
-  ] });
-};
-
-export { CheckboxField as C, RadioGroup as R, Select as S };
+export { RadioGroup as R, Select as S };

package/es/chunks/{Switch-C3IZzn6L.js → Switch-za5Skgtp.js}

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import React__default, { useRef, useState, useEffect, useLayoutEffect, useMemo, forwardRef, useCallback, createElement, Component, createRef, createContext, useContext } from 'react';
-import { Typography as Typography$1, Input as Input$1, DatePicker, Upload, Image, Switch } from 'antd';
+import { Typography as Typography$1, Input as Input$1, Checkbox, DatePicker, Upload, Image, Switch } from 'antd';
 import { g as require_baseGetTag, h as requireIsObjectLike, k as requireIsArray, d as require_MapCache, o as require_Symbol, p as getDefaultExportFromCjs, q as commonjsGlobal, T as TINY_API } from './common-b3FKGF0Y.js';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { findDOMNode } from 'react-dom';
@@ -3495,6 +3495,8 @@ var getProxyFormState = (formState, control, localProxyFormState, isRoot = true)
     return result;
 };
 
+const useIsomorphicLayoutEffect$1 = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+
 /**
  * This custom hook allows you to subscribe to each form state, and isolate the re-render at the custom hook level. It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form application.
  *
@@ -3539,10 +3541,8 @@ function useFormState(props) {
         isValid: false,
         errors: false,
     });
-    const _name = React__default.useRef(name);
-    _name.current = name;
-    React__default.useEffect(() => control._subscribe({
-        name: _name.current,
+    useIsomorphicLayoutEffect$1(() => control._subscribe({
+        name: name,
         formState: _localProxyFormState.current,
         exact,
         callback: (formState) => {
@@ -3552,7 +3552,7 @@ function useFormState(props) {
                     ...formState,
                 });
         },
-    }), [control, disabled, exact]);
+    }), [name, disabled, exact]);
     React__default.useEffect(() => {
         _localProxyFormState.current.isValid && control._setValid(true);
     }, [control]);
@@ -3592,19 +3592,17 @@ var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) =>
 function useWatch(props) {
     const methods = useFormContext();
     const { control = methods.control, name, defaultValue, disabled, exact, } = props || {};
-    const _name = React__default.useRef(name);
     const _defaultValue = React__default.useRef(defaultValue);
-    _name.current = name;
-    React__default.useEffect(() => control._subscribe({
-        name: _name.current,
+    const [value, updateValue] = React__default.useState(control._getWatch(name, _defaultValue.current));
+    useIsomorphicLayoutEffect$1(() => control._subscribe({
+        name: name,
         formState: {
             values: true,
         },
         exact,
         callback: (formState) => !disabled &&
-            updateValue(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, _defaultValue.current)),
-    }), [control, disabled, exact]);
-    const [value, updateValue] = React__default.useState(control._getWatch(name, defaultValue));
+            updateValue(generateWatchOutput(name, control._names, formState.values || control._formValues, false, _defaultValue.current)),
+    }), [name, control, disabled, exact]);
     React__default.useEffect(() => control._removeUnmounted());
     return value;
 }
@@ -4420,6 +4418,7 @@ function createFormControl(props = {}) {
     let _formState = {
         submitCount: 0,
         isDirty: false,
+        isReady: false,
         isLoading: isFunction$1(_options.defaultValues),
         isValidating: false,
         isSubmitted: false,
@@ -4434,7 +4433,7 @@ function createFormControl(props = {}) {
     };
     const _fields = {};
     let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values)
-        ? cloneObject(_options.values || _options.defaultValues) || {}
+        ? cloneObject(_options.defaultValues || _options.values) || {}
         : {};
     let _formValues = _options.shouldUnregister
         ? {}
@@ -5485,6 +5484,7 @@ function useForm(props = {}) {
         validatingFields: {},
         errors: props.errors || {},
         disabled: props.disabled || false,
+        isReady: false,
         defaultValues: isFunction$1(props.defaultValues)
             ? undefined
             : props.defaultValues,
@@ -5502,12 +5502,37 @@ function useForm(props = {}) {
     }
     const control = _formControl.current.control;
     control._options = props;
-    React__default.useLayoutEffect(() => control._subscribe({
-        formState: control._proxyFormState,
-        callback: () => updateFormState({ ...control._formState }),
-        reRenderRoot: true,
-    }), [control]);
+    useIsomorphicLayoutEffect$1(() => {
+        const sub = control._subscribe({
+            formState: control._proxyFormState,
+            callback: () => updateFormState({ ...control._formState }),
+            reRenderRoot: true,
+        });
+        updateFormState((data) => ({
+            ...data,
+            isReady: true,
+        }));
+        control._formState.isReady = true;
+        return sub;
+    }, [control]);
     React__default.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
+    React__default.useEffect(() => {
+        if (props.mode) {
+            control._options.mode = props.mode;
+        }
+        if (props.reValidateMode) {
+            control._options.reValidateMode = props.reValidateMode;
+        }
+        if (props.errors && !isEmptyObject(props.errors)) {
+            control._setErrors(props.errors);
+        }
+    }, [control, props.errors, props.mode, props.reValidateMode]);
+    React__default.useEffect(() => {
+        props.shouldUnregister &&
+            control._subjects.state.next({
+                values: control._getWatch(),
+            });
+    }, [control, props.shouldUnregister]);
     React__default.useEffect(() => {
         if (control._proxyFormState.isDirty) {
             const isDirty = control._getDirty();
@@ -5527,12 +5552,7 @@ function useForm(props = {}) {
         else {
             control._resetDefaultValues();
         }
-    }, [props.values, control]);
-    React__default.useEffect(() => {
-        if (props.errors && !isEmptyObject(props.errors)) {
-            control._setErrors(props.errors);
-        }
-    }, [props.errors, control]);
+    }, [control, props.values]);
     React__default.useEffect(() => {
         if (!control._state.mount) {
             control._setValid();
@@ -5544,12 +5564,6 @@ function useForm(props = {}) {
         }
         control._removeUnmounted();
     });
-    React__default.useEffect(() => {
-        props.shouldUnregister &&
-            control._subjects.state.next({
-                values: control._getWatch(),
-            });
-    }, [props.shouldUnregister, control]);
     _formControl.current.formState = getProxyFormState(formState, control);
     return _formControl.current;
 }
@@ -24779,6 +24793,55 @@ const Textarea = forwardRef(
 );
 React__default.memo(Textarea);
 
+const CheckboxField = (props) => {
+  //! State
+  const {
+    field,
+    formState,
+    label,
+    afterOnChange,
+    customStyleContainer,
+    customStyleCheckbox,
+    ...restProps
+  } = props;
+  const { name, value, onChange, onBlur } = field || {};
+  const { touchedFields, errors, isSubmitted } = formState || {};
+  const isTouched = get$1(touchedFields, name);
+  const errorMessage = get$1(errors, name)?.message;
+  //! Function
+  const handleChange = (e) => {
+    const checked = e.target.checked;
+    onChange?.(checked);
+    afterOnChange?.(checked);
+  };
+  const renderErrorMessage = () => {
+    if (!errorMessage) return null;
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      ErrorMessage,
+      {
+        errorMessage,
+        isTouched,
+        isSubmitted
+      }
+    );
+  };
+  //! Render
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: customStyleContainer, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      Checkbox,
+      {
+        onBlur,
+        checked: !!value,
+        onChange: handleChange,
+        className: customStyleCheckbox,
+        ...restProps,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(Typography.Text, { children: label })
+      }
+    ),
+    renderErrorMessage()
+  ] });
+};
+
 function _typeof(o) {
   "@babel/helpers - typeof";
 
@@ -39321,4 +39384,4 @@ const SwitchField = (props) => {
 };
 React__default.memo(SwitchField);
 
-export { _createSuper as A, _assertThisInitialized$1 as B, _objectWithoutProperties as C, DatePickerField as D, ErrorMessage as E, FastColor as F, IconContext as G, Input as I, Label as L, PnkxField as P, RangePickerField as R, Typography as T, _extends as _, TinyMCE as a, Icon as b, _typeof as c, classNames as d, _arrayLikeToArray as e, _unsupportedIterableToArray as f, get$1 as g, _createClass as h, _classCallCheck as i, jsxRuntimeExports as j, _defineProperty as k, _slicedToArray as l, warning$1 as m, canUseDom as n, _objectSpread2 as o, updateCSS as p, _arrayWithHoles as q, removeCSS as r, _nonIterableRest as s, resetWarned as t, useForm as u, generate$1 as v, warningOnce as w, presetPrimaryColors as x, presetPalettes as y, _inherits as z };
+export { _createSuper as A, _assertThisInitialized$1 as B, CheckboxField as C, DatePickerField as D, ErrorMessage as E, FastColor as F, _objectWithoutProperties as G, IconContext as H, Input as I, Label as L, PnkxField as P, RangePickerField as R, Typography as T, _extends as _, TinyMCE as a, Icon as b, _typeof as c, classNames as d, _arrayLikeToArray as e, _unsupportedIterableToArray as f, get$1 as g, _createClass as h, _classCallCheck as i, jsxRuntimeExports as j, _defineProperty as k, _slicedToArray as l, warning$1 as m, canUseDom as n, _objectSpread2 as o, updateCSS as p, _arrayWithHoles as q, removeCSS as r, _nonIterableRest as s, resetWarned as t, useForm as u, generate$1 as v, warningOnce as w, presetPrimaryColors as x, presetPalettes as y, _inherits as z };

package/es/fields/index.js

@@ -1,2 +1,2 @@
-export { D as DatePickerField, I as Input, P as PnkxField, R as RangePickerField, a as TinyMCE } from '../chunks/Switch-C3IZzn6L.js';
-export { C as CheckboxField, R as RadioGroup, S as Select } from '../chunks/Checkbox-2LoiNtBe.js';
+export { C as CheckboxField, D as DatePickerField, I as Input, P as PnkxField, R as RangePickerField, a as TinyMCE } from '../chunks/Switch-za5Skgtp.js';
+export { R as RadioGroup, S as Select } from '../chunks/Radio-D2me1zZ-.js';

package/es/index.js

@@ -1,5 +1,5 @@
-export { A as Alert, E as Anchor, G as Appfix, I as AutoComplete, e as Badge, g as Breadcrumb, U as BulkAction, B as Button, C as CascaderField, f as Col, V as ConfirmModal, d as Container, o as Divider, q as Drawer, D as Dropdown, N as Empty, X as ErrorBoundary, F as Flex, H as Heading, O as Image, L as Layout, j as Menu, M as Modal, k as Pagination, J as PnkxCollapse, K as PnkxColorPicker, r as Popconfirm, P as Popover, Q as QRCode, u as Rate, s as Result, R as Row, c as SearchFiltersForm, v as Segmented, m as Sidebar, S as Skeleton, h as Space, p as Spin, i as Splitter, w as Statistic, l as Steps, T as Table, b as Tabs, n as Tag, x as Timeline, a as Tooltip, y as Tour, z as Tree, W as Watermark, t as typeColorMap } from './chunks/ErrorBoundary-Ja4PIPaU.js';
-export { D as DatePickerField, E as ErrorMessage, I as Input, L as Label, P as PnkxField, R as RangePickerField, a as TinyMCE, T as Typography } from './chunks/Switch-C3IZzn6L.js';
-export { C as CheckboxField, R as RadioGroup, S as Select } from './chunks/Checkbox-2LoiNtBe.js';
+export { A as Alert, E as Anchor, G as Appfix, I as AutoComplete, e as Badge, g as Breadcrumb, U as BulkAction, B as Button, C as CascaderField, f as Col, V as ConfirmModal, d as Container, o as Divider, q as Drawer, D as Dropdown, N as Empty, X as ErrorBoundary, F as Flex, H as Heading, O as Image, L as Layout, j as Menu, M as Modal, k as Pagination, J as PnkxCollapse, K as PnkxColorPicker, r as Popconfirm, P as Popover, Q as QRCode, u as Rate, s as Result, R as Row, c as SearchFiltersForm, v as Segmented, m as Sidebar, S as Skeleton, h as Space, p as Spin, i as Splitter, w as Statistic, l as Steps, T as Table, b as Tabs, n as Tag, x as Timeline, a as Tooltip, y as Tour, z as Tree, W as Watermark, t as typeColorMap } from './chunks/ErrorBoundary-CXESHSc6.js';
+export { C as CheckboxField, D as DatePickerField, E as ErrorMessage, I as Input, L as Label, P as PnkxField, R as RangePickerField, a as TinyMCE, T as Typography } from './chunks/Switch-za5Skgtp.js';
+export { R as RadioGroup, S as Select } from './chunks/Radio-D2me1zZ-.js';
 export { u as useToast } from './chunks/cloneDeep-BLYi2V0G.js';
 export { u as useFiltersHandler, a as useMessage } from './chunks/useMessage-D_-VT5B4.js';

package/es/ui/index.js

@@ -1,2 +1,2 @@
-export { A as Alert, E as Anchor, G as Appfix, I as AutoComplete, e as Badge, g as Breadcrumb, U as BulkAction, B as Button, C as CascaderField, f as Col, V as ConfirmModal, d as Container, o as Divider, q as Drawer, D as Dropdown, N as Empty, X as ErrorBoundary, F as Flex, H as Heading, O as Image, L as Layout, j as Menu, M as Modal, k as Pagination, J as PnkxCollapse, K as PnkxColorPicker, r as Popconfirm, P as Popover, Q as QRCode, u as Rate, s as Result, R as Row, c as SearchFiltersForm, v as Segmented, m as Sidebar, S as Skeleton, h as Space, p as Spin, i as Splitter, w as Statistic, l as Steps, T as Table, b as Tabs, n as Tag, x as Timeline, a as Tooltip, y as Tour, z as Tree, W as Watermark, t as typeColorMap } from '../chunks/ErrorBoundary-Ja4PIPaU.js';
-export { E as ErrorMessage, L as Label, T as Typography } from '../chunks/Switch-C3IZzn6L.js';
+export { A as Alert, E as Anchor, G as Appfix, I as AutoComplete, e as Badge, g as Breadcrumb, U as BulkAction, B as Button, C as CascaderField, f as Col, V as ConfirmModal, d as Container, o as Divider, q as Drawer, D as Dropdown, N as Empty, X as ErrorBoundary, F as Flex, H as Heading, O as Image, L as Layout, j as Menu, M as Modal, k as Pagination, J as PnkxCollapse, K as PnkxColorPicker, r as Popconfirm, P as Popover, Q as QRCode, u as Rate, s as Result, R as Row, c as SearchFiltersForm, v as Segmented, m as Sidebar, S as Skeleton, h as Space, p as Spin, i as Splitter, w as Statistic, l as Steps, T as Table, b as Tabs, n as Tag, x as Timeline, a as Tooltip, y as Tour, z as Tree, W as Watermark, t as typeColorMap } from '../chunks/ErrorBoundary-CXESHSc6.js';
+export { E as ErrorMessage, L as Label, T as Typography } from '../chunks/Switch-za5Skgtp.js';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pnkx-lib/ui",
   "private": false,
-  "version": "1.8.3",
+  "version": "1.8.7",
   "type": "module",
   "main": "./es/index.js",
   "module": "./es/index.js",
@@ -90,6 +90,10 @@
   },
   "dependencies": {
     "@ant-design/icons": "^5.6.1",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
     "@emotion/css": "^11.13.5",
     "@headlessui/react": "^2.2.2",
     "@heroicons/react": "^2.2.0",
@@ -107,4 +111,4 @@
     "yup": "^1.6.1",
     "zustand": "^5.0.3"
   }
-}
+}

package/types/index.d.ts

@@ -202,20 +202,19 @@ export declare type BreadcrumbPropsUnion = BaseProps_6 & BreadcrumbProps;
 
 export declare type BreadcrumbSeparatorType = BreadcrumbSeparatorType_2;
 
-export declare const BulkAction: ({ quantity, handleRestore, handleSendApproval, handleCancelSendApproval, handleRefuseApproval, handleApproval, handleCancelApproval, handleDelete, handleActivate, handleInActivate, status, }: BulkActionProps) => JSX.Element;
+export declare const BulkAction: ({ quantity, handleRefresh, handleSend, handleSlash, handleProhibit, handleCheck, handleClose, handleDelete, handleUnLock, handleLock, }: BulkActionProps) => JSX.Element;
 
 export declare interface BulkActionProps {
     quantity: number;
-    handleRestore?: () => void;
-    handleSendApproval?: () => void;
-    handleCancelSendApproval?: () => void;
-    handleRefuseApproval?: () => void;
-    handleApproval?: () => void;
-    handleCancelApproval?: () => void;
+    handleRefresh?: () => void;
+    handleSend?: () => void;
+    handleSlash?: () => void;
+    handleProhibit?: () => void;
+    handleCheck?: () => void;
+    handleClose?: () => void;
     handleDelete?: () => void;
-    handleActivate?: () => void;
-    handleInActivate?: () => void;
-    status?: number;
+    handleUnLock?: () => void;
+    handleLock?: () => void;
 }
 
 export declare const Button: default_3.FC<ButtonProps>;
@@ -265,13 +264,11 @@ export declare interface ConfirmModalProps extends ModalProps {
     content: string;
     titleCancelBtn?: string;
     titleSubmitBtn?: string;
-    typeIcon: ConfirmModalType;
+    typeIcon: "success" | "error" | "warning" | "info";
     handleCancel?: () => void;
     handleSubmit?: () => void;
 }
 
-export declare type ConfirmModalType = "success" | "error" | "warning" | "info";
-
 export declare const Container: default_3.FC<ContainerProps>;
 
 export declare interface ContainerProps {

package/types/ui.d.ts

@@ -183,20 +183,19 @@ export declare type BreadcrumbPropsUnion = BaseProps_6 & BreadcrumbProps;
 
 export declare type BreadcrumbSeparatorType = BreadcrumbSeparatorType_2;
 
-export declare const BulkAction: ({ quantity, handleRestore, handleSendApproval, handleCancelSendApproval, handleRefuseApproval, handleApproval, handleCancelApproval, handleDelete, handleActivate, handleInActivate, status, }: BulkActionProps) => JSX.Element;
+export declare const BulkAction: ({ quantity, handleRefresh, handleSend, handleSlash, handleProhibit, handleCheck, handleClose, handleDelete, handleUnLock, handleLock, }: BulkActionProps) => JSX.Element;
 
 export declare interface BulkActionProps {
     quantity: number;
-    handleRestore?: () => void;
-    handleSendApproval?: () => void;
-    handleCancelSendApproval?: () => void;
-    handleRefuseApproval?: () => void;
-    handleApproval?: () => void;
-    handleCancelApproval?: () => void;
+    handleRefresh?: () => void;
+    handleSend?: () => void;
+    handleSlash?: () => void;
+    handleProhibit?: () => void;
+    handleCheck?: () => void;
+    handleClose?: () => void;
     handleDelete?: () => void;
-    handleActivate?: () => void;
-    handleInActivate?: () => void;
-    status?: number;
+    handleUnLock?: () => void;
+    handleLock?: () => void;
 }
 
 export declare const Button: default_3.FC<ButtonProps>;
@@ -232,13 +231,11 @@ export declare interface ConfirmModalProps extends ModalProps {
     content: string;
     titleCancelBtn?: string;
     titleSubmitBtn?: string;
-    typeIcon: ConfirmModalType;
+    typeIcon: "success" | "error" | "warning" | "info";
     handleCancel?: () => void;
     handleSubmit?: () => void;
 }
 
-export declare type ConfirmModalType = "success" | "error" | "warning" | "info";
-
 export declare const Container: default_3.FC<ContainerProps>;
 
 export declare interface ContainerProps {