pesona-ui 1.0.2 → 1.0.4

package/dist/index.cjs.js

@@ -7910,6 +7910,31 @@ const FormRadio = ({ className = '', children }) => {
     return React.createElement("div", { className: `form-radio ${className}` }, children);
 };
 
+const ListView = ({ className = '', children }) => {
+    return React.createElement("ul", { className: `block-list ${className}` }, children);
+};
+const ListItem = ({ children }) => {
+    return React.createElement("li", null, children);
+};
+
+const CheckboxAgreement = React.forwardRef(({ name, label, error, checked = false, onChange, ...rest }, ref) => {
+    const uniqueCheckboxId = v4();
+    const handleChange = (event) => {
+        onChange(event);
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement(ListView, { className: `${error ? 'has-error' : ''}` },
+            React.createElement(ListItem, null,
+                React.createElement("div", { className: "d-flex align-items-center" },
+                    React.createElement(FormCheckbox, { className: `${error ? 'has-error' : ''}` },
+                        React.createElement("label", { className: `custom-checkbox`, htmlFor: uniqueCheckboxId },
+                            React.createElement("input", { className: "form-control", type: "checkbox", id: uniqueCheckboxId, name: name, ref: ref, role: "checkbox", checked: checked, onChange: handleChange, ...rest }),
+                            React.createElement("span", { className: "checkmark" })))),
+                React.createElement("div", { className: "d-flex align-items-center pl-10" },
+                    React.createElement("p", { className: `mb-0 ${error ? 'text-danger' : ''}` }, label && React.createElement("span", { className: rest.required ? 'required' : '' }, label)))))));
+});
+CheckboxAgreement.displayName = 'CheckboxAgreement';
+
 // Convert date to local format, e.g., '2024-12-31' local Indonesia
 const dateToDb = (date) => {
     return date
@@ -8536,6 +8561,13 @@ const Switch = React.forwardRef(({ name, className = '', error, checked = false,
 });
 Switch.displayName = 'Switch';
 
+const LoadingBar = ({ progress, visible }) => {
+    if (!visible)
+        return null;
+    return (React.createElement("div", { className: "loading-bar-container" },
+        React.createElement("div", { className: "loading-bar", style: { width: `${progress}%`, transition: 'width 300ms ease-in-out' } })));
+};
+
 const DivTable = ({ children, className = '', view = 'list', gridColumn = 1 }) => {
     return (React.createElement("div", { className: `divcard-table ${view === 'grid' ? 'grid-mode' : ''} ${className}`, style: view === 'grid' ? { gridTemplateColumns: `repeat(${gridColumn}, 1fr)` } : {} }, children));
 };
@@ -8593,6 +8625,7 @@ exports.CardBody = CardBody;
 exports.CardFooter = CardFooter;
 exports.CardHeader = CardHeader;
 exports.Checkbox = Checkbox;
+exports.CheckboxAgreement = CheckboxAgreement;
 exports.CircularProgress = CircularProgress;
 exports.CircularProgressWithLabel = CircularProgressWithLabel;
 exports.ClearInput = ClearInput;
@@ -8620,6 +8653,9 @@ exports.InputImageSize = InputImageSize;
 exports.InputTextArea = InputTextArea;
 exports.InputWysiwyg = InputWysiwyg;
 exports.LinearProgress = LinearProgress;
+exports.ListItem = ListItem;
+exports.ListView = ListView;
+exports.LoadingBar = LoadingBar;
 exports.Modal = Modal;
 exports.ModalBody = ModalBody;
 exports.ModalFooter = ModalFooter;