@rolster/react-components 18.23.11 → 18.23.12

package/dist/es/assets/{index-9GIW7Ggg.css → index-Dr8-miqn.css}

@@ -2033,15 +2033,18 @@
   padding: 0rem var(--rls-sizing-x8);
   box-sizing: border-box;
 }
-.rls-confirmation__message {
-  color: var(--rls-app-color-600);
-  text-align: center;
+.rls-confirmation__content {
+  display: flex;
+  flex-direction: column;
+  row-gap: var(--rls-sizing-x8);
 }
-.rls-confirmation__message p {
+.rls-confirmation__content > p {
   font-weight: var(--rls-font-weight-medium);
   font-size: var(--pvt-content-font-size);
   line-height: var(--pvt-content-line-height);
   letter-spacing: var(--pvt-content-letter-spacing);
+  text-align: center;
+  color: var(--rls-app-color-600);
 }
 .rls-confirmation__footer {
   position: relative;

package/dist/es/index.js

@@ -2421,11 +2421,11 @@ class ConfirmationResult extends PartialSealed {
         return new ConfirmationResult('reject');
     }
 }
-function RlsConfirmation({ approved, content, reject, rlsTheme, subtitle, title, visible }) {
-    const className = useMemo(() => {
-        return renderClassStatus('rls-confirmation', { visible });
-    }, [visible]);
-    return (jsxRuntimeExports.jsxs("div", { className: className, "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__component", children: [jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__header", children: [title && jsxRuntimeExports.jsx("div", { className: "rls-confirmation__title", children: title }), subtitle && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__subtitle", children: subtitle }))] }), jsxRuntimeExports.jsx("div", { className: "rls-confirmation__body", children: content && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__message", children: content })) }), (approved || reject) && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__footer", children: jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__actions", children: [approved && (jsxRuntimeExports.jsx(RlsButton, { identifier: approved.identifier, type: approved.type, onClick: approved.onClick, rlsTheme: approved.rlsTheme, children: approved.label })), reject && (jsxRuntimeExports.jsx(RlsButton, { identifier: reject.identifier, type: reject.type, onClick: reject.onClick, rlsTheme: reject.rlsTheme, children: reject.label }))] }) }))] }), jsxRuntimeExports.jsx("div", { className: "rls-confirmation__backdrop" })] }));
+function RlsConfirmation({ approved, className, content, reject, rlsTheme, subtitle, title, visible }) {
+    const classConfirmation = useMemo(() => {
+        return renderClassStatus('rls-confirmation', { visible }, className);
+    }, [visible, className]);
+    return (jsxRuntimeExports.jsxs("div", { className: classConfirmation, "rls-theme": rlsTheme, children: [jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__component", children: [jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__header", children: [title && jsxRuntimeExports.jsx("div", { className: "rls-confirmation__title", children: title }), subtitle && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__subtitle", children: subtitle }))] }), jsxRuntimeExports.jsx("div", { className: "rls-confirmation__body", children: content && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__content", children: content })) }), (approved || reject) && (jsxRuntimeExports.jsx("div", { className: "rls-confirmation__footer", children: jsxRuntimeExports.jsxs("div", { className: "rls-confirmation__actions", children: [approved && (jsxRuntimeExports.jsx(RlsButton, { identifier: approved.identifier, type: approved.type, onClick: approved.onClick, disabled: approved.disabled, rlsTheme: approved.rlsTheme, children: approved.label })), reject && (jsxRuntimeExports.jsx(RlsButton, { identifier: reject.identifier, type: reject.type, onClick: reject.onClick, disabled: reject.disabled, rlsTheme: reject.rlsTheme, children: reject.label }))] }) }))] }), jsxRuntimeExports.jsx("div", { className: "rls-confirmation__backdrop" })] }));
 }
 function useConfirmation() {
     const [config, setConfig] = useState({});
@@ -2433,29 +2433,30 @@ function useConfirmation() {
     const component = ReactDOM.createPortal(jsxRuntimeExports.jsx(RlsConfirmation, { ...config, visible: visible }), document.body);
     const confirmation = useCallback((options) => {
         return new Promise((resolve) => {
-            const { approved, reject } = options;
             setConfig({
                 ...options,
                 approved: {
-                    label: approved?.label ?? reactI18n('confirmationActionApproved'),
+                    label: options.approved?.label ?? reactI18n('confirmationActionApproved'),
                     onClick: () => {
                         setVisible(false);
                         resolve(ConfirmationResult.approved());
                     },
-                    identifier: approved?.identifier,
-                    rlsTheme: approved?.rlsTheme,
-                    type: approved?.type ?? 'raised'
+                    type: options.approved?.type ?? 'raised',
+                    disabled: options.approved?.disabled,
+                    identifier: options.approved?.identifier,
+                    rlsTheme: options.approved?.rlsTheme
                 },
-                reject: reject
+                reject: options.reject
                     ? {
-                        label: reject.label,
+                        label: options.reject.label,
                         onClick: () => {
                             setVisible(false);
                             resolve(ConfirmationResult.reject());
                         },
-                        identifier: reject.identifier,
-                        rlsTheme: reject.rlsTheme,
-                        type: reject?.type ?? 'classic'
+                        type: options.reject.type ?? 'outline',
+                        disabled: options.reject.disabled,
+                        identifier: options.reject.identifier,
+                        rlsTheme: options.reject.rlsTheme
                     }
                     : undefined
             });