saasufy-components 3.15.1 → 3.15.2

package/README.md

@@ -315,7 +315,8 @@ OR (with confirmation step)
 **Attributes**
 
 - `model-id` (required): Specifies the ID of the resource to delete from the parent collection when this component is activated. This can be achieved by invoking either the `deleteItem()` or `confirmDeleteItem()` function from inside an event handler. The example above shows how to achieve deletion via the `onclick` event. You can either invoke `deleteItem()` to delete the resource immediately or you can invoke `confirmDeleteItem()` to require additional confirmation prior to deletion.
-- `confirm-message`: The confirmation message to show the user when this component's `confirmDeleteItem()` function is invoked,
+- `onclick` (required): The logic to execute to delete the item. Should be either `deleteItem()` or `confirmDeleteItem()`.
+- `confirm-message`: The confirmation message to show the user when this component's `confirmDeleteItem()` function is invoked.
 
 If `confirmDeleteItem()` is used, then the parent `collection-browser` must have a `confirm-modal` element slotted into it as shown here:
 

package/overlay-modal.js

@@ -39,6 +39,7 @@ class OverlayModal extends HTMLElement {
         .modal-title-bar {
           display: var(--title-bar-display, flex);
           justify-content: space-between;
+          align-items: center;
           width: 100%;
           padding: 10px;
           color: #ffffff;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "saasufy-components",
-  "version": "3.15.1",
+  "version": "3.15.2",
   "description": "Components for Saasufy.",
   "main": "index.js",
   "scripts": {

package/styles.css

@@ -178,6 +178,19 @@ collection-browser > [slot=next-page] {
   width: auto;
 }
 
+.confirm-modal-content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 20px;
+  padding: 20px;
+}
+
+.confirm-modal-buttons-container {
+  display: flex;
+  gap: 5px;
+}
+
 .container-vertical {
   display: flex;
   flex-direction: column;