@bagelink/vue 1.12.19 → 1.12.25

package/src/form-flow/FormFlow.vue

@@ -348,7 +348,7 @@ defineExpose({
 </script>
 
 <template>
-	<form ref="formElement" :class="schema._class" @submit="handleSubmit">
+	<form ref="formElement" class="grid-form" :class="schema._class" @submit="handleSubmit">
 		<template v-if="formState === 'success'">
 			<slot name="success" :form-data="formData" />
 		</template>
@@ -376,6 +376,19 @@ defineExpose({
 						</ArrayInput>
 					</template>
 
+					<!-- Array field with primitive string item type e.g. $.array('Label', 'text') -->
+					<template v-else-if="field._type === 'array' && typeof field._config.schema === 'string'">
+						<ArrayInput v-bind="getFieldProps(field, key)">
+							<template #default="{ item }">
+								<component
+									:is="getFieldComponent(field._config.schema as string)"
+									:model-value="(item.value as string | number | undefined)"
+									@update:model-value="(val: any) => { item.value = val }"
+								/>
+							</template>
+						</ArrayInput>
+					</template>
+
 					<!-- Array field with custom component -->
 					<template v-else-if="field._type === 'array' && field._config.schema">
 						<ArrayInput v-bind="getFieldProps(field, key)">

package/src/form-flow/MultiStepForm.vue

@@ -360,7 +360,7 @@ defineExpose({
 				<!-- Default: Use FormFlow -->
 				<FormFlow v-model="formData" :schema="currentStepSchema" :components="components" :errors="stepErrors">
 					<!-- Pass through field slots -->
-					<template v-for="(_, name) in $slots" #[name]="slotProps">
+					<template v-for="(_, name) in ($slots as Record<string, unknown>)" #[name]="slotProps">
 						<slot :name="name" v-bind="slotProps" />
 					</template>
 				</FormFlow>

package/src/form-flow/form-flow.ts

@@ -285,8 +285,8 @@ export const $ = {
 	},
 
 	richtext(
-		labelOrConfig?: string | (BaseFieldConfig & { autoheight?: boolean, basic?: boolean }),
-		config?: BaseFieldConfig & { autoheight?: boolean, basic?: boolean }
+		labelOrConfig?: string | (BaseFieldConfig & { autoheight?: boolean, basic?: boolean, simple?: boolean }),
+		config?: BaseFieldConfig & { autoheight?: boolean, basic?: boolean, simple?: boolean }
 	): FieldBuilder<string> {
 		return new Field('richtext', parseArgs(labelOrConfig, config))
 	},

package/src/i18n/locales/en.json

@@ -182,6 +182,7 @@
     "closeEditor": "Close Editor (ESC)",
     "blockNotEditable": "This block's content comes from a data source",
     "blockNotEditableDesc": "and cannot be edited here.",
+    "dataSourceHint": "Some content in this block may come from a data source. To change it, edit the data directly.",
     "screenTooSmall": "The screen is too small for this editor. Try reducing zoom or using a larger screen.",
     "cancel": "Cancel",
     "publish": "Publish",
@@ -210,6 +211,53 @@
     "production": "Production",
     "publishFailed": "Publish failed"
   },
+  "collection": {
+    "loadError": "Loading failed",
+    "newItemTitle": "New item — {label}",
+    "createSubmit": "Create",
+    "editTitle": "Edit",
+    "saveSubmit": "Save",
+    "importTitle": "Import JSON — {label}",
+    "importSubmit": "Import",
+    "importJsonLabel": "JSON content",
+    "importJsonHint": "Array of objects [ {...}, {...} ] or a single object",
+    "importSummary": "{imported} imported · {failed} failed",
+    "deleteItemTitle": "Delete item",
+    "deleteItemMessage": "Delete this item?",
+    "deleteConfirm": "Delete",
+    "batchDeleteTitle": "Batch delete",
+    "batchDeleteMessage": "Delete {count} items?",
+    "batchDeleteSummary": "{deleted} deleted · {failed} failed",
+    "batchUpdateTitle": "Batch update — {count} items",
+    "updateAllSubmit": "Update all",
+    "batchUpdateSummary": "Updated · {failed} failed",
+    "selectedCount": "{count} selected",
+    "updateBtn": "Update",
+    "deleteBtn": "Delete",
+    "searchPlaceholder": "Search...",
+    "refreshTooltip": "Refresh",
+    "importTooltip": "Import JSON",
+    "newItemBtn": "New item",
+    "deleteTooltip": "Delete",
+    "reorderTooltip": "Reorder",
+    "reorderSaving": "Saving order..."
+  },
+  "datastores": {
+    "selectCollection": "Select a collection from the list",
+    "fieldName": "Name",
+    "fieldStore": "Store",
+    "fieldStoreHint": "e.g.: default",
+    "fieldCollection": "Collection",
+    "fieldCollectionHint": "e.g.: my_collection",
+    "fieldDescription": "Description",
+    "createTitle": "Create new Datastore",
+    "createSubmit": "Create",
+    "editTitle": "Edit {name}",
+    "saveSubmit": "Save",
+    "addBtn": "Add Datastore",
+    "empty": "No Datastores yet",
+    "deleteConfirm": "Delete \"{name}\"?"
+  },
   "admin": {
     "content": "Content",
     "blox": "Blox",

package/src/i18n/locales/es.json

@@ -182,6 +182,7 @@
     "closeEditor": "Cerrar editor (ESC)",
     "blockNotEditable": "El contenido de este bloque proviene de una fuente de datos",
     "blockNotEditableDesc": "y no se puede editar aquí.",
+    "dataSourceHint": "Parte del contenido de este bloque proviene de una fuente de datos. Para cambiarlo, edita los datos directamente.",
     "screenTooSmall": "La pantalla es demasiado pequeña para este editor. Prueba reducir el zoom o usar una pantalla más grande.",
     "cancel": "Cancelar",
     "publish": "Publicar",

package/src/i18n/locales/fr.json

@@ -182,6 +182,7 @@
     "closeEditor": "Fermer l'éditeur (ESC)",
     "blockNotEditable": "Le contenu de ce bloc provient d'une source de données",
     "blockNotEditableDesc": "et ne peut pas être édité ici.",
+    "dataSourceHint": "Une partie du contenu de ce bloc provient d'une source de données. Pour le modifier, éditez les données directement.",
     "screenTooSmall": "L'écran est trop petit pour cet éditeur. Essayez de réduire le zoom ou d'utiliser un écran plus grand.",
     "cancel": "Annuler",
     "publish": "Publier",

package/src/i18n/locales/he.json

@@ -203,6 +203,7 @@
     "closeEditor": "סגור עורך (ESC)",
     "blockNotEditable": "תוכן הבלוק הזה מגיע ממקור נתונים",
     "blockNotEditableDesc": "ואינו ניתן לעריכה כאן.",
+    "dataSourceHint": "ייתכן שחלק מהתוכן בבלוק זה מגיע ממקור נתונים. כדי לשנות אותו, ערוך את הדאטה ישירות.",
     "screenTooSmall": "המסך קטן מדי לעורך הזה. נסו להקטין זום או להשתמש במסך גדול יותר.",
     "cancel": "ביטול",
     "publish": "פרסום",
@@ -231,6 +232,53 @@
     "production": "פרודקשן",
     "publishFailed": "פרסום נכשל"
   },
+  "collection": {
+    "loadError": "טעינה נכשלה",
+    "newItemTitle": "פריט חדש — {label}",
+    "createSubmit": "יצירה",
+    "editTitle": "עריכה",
+    "saveSubmit": "שמירה",
+    "importTitle": "ייבוא JSON — {label}",
+    "importSubmit": "ייבוא",
+    "importJsonLabel": "תוכן JSON",
+    "importJsonHint": "מערך של אובייקטים [ {...}, {...} ] או אובייקט בודד",
+    "importSummary": "{imported} יובאו · {failed} נכשלו",
+    "deleteItemTitle": "מחיקת פריט",
+    "deleteItemMessage": "האם למחוק פריט זה?",
+    "deleteConfirm": "מחיקה",
+    "batchDeleteTitle": "מחיקה קבוצתית",
+    "batchDeleteMessage": "האם למחוק {count} פריטים?",
+    "batchDeleteSummary": "{deleted} נמחקו · {failed} נכשלו",
+    "batchUpdateTitle": "עדכון קבוצתי — {count} פריטים",
+    "updateAllSubmit": "עדכן הכל",
+    "batchUpdateSummary": "עודכנו · {failed} נכשלו",
+    "selectedCount": "{count} נבחרו",
+    "updateBtn": "עדכון",
+    "deleteBtn": "מחיקה",
+    "searchPlaceholder": "חיפוש...",
+    "refreshTooltip": "ריענון",
+    "importTooltip": "ייבוא JSON",
+    "newItemBtn": "פריט חדש",
+    "deleteTooltip": "מחיקה",
+    "reorderTooltip": "שינוי סדר",
+    "reorderSaving": "שומר סדר..."
+  },
+  "datastores": {
+    "selectCollection": "בחרו קולקציה מהרשימה",
+    "fieldName": "שם",
+    "fieldStore": "Store",
+    "fieldStoreHint": "לדוגמה: default",
+    "fieldCollection": "Collection",
+    "fieldCollectionHint": "לדוגמה: my_collection",
+    "fieldDescription": "תיאור",
+    "createTitle": "יצירת Datastore חדש",
+    "createSubmit": "יצירה",
+    "editTitle": "עריכת {name}",
+    "saveSubmit": "שמירה",
+    "addBtn": "הוספת Datastore",
+    "empty": "אין Datastores עדיין",
+    "deleteConfirm": "למחוק את \"{name}\"?"
+  },
   "admin": {
     "content": "תוכן",
     "blox": "בלוקס",

package/src/i18n/locales/it.json

@@ -182,6 +182,7 @@
     "closeEditor": "Chiudi editor (ESC)",
     "blockNotEditable": "Il contenuto di questo blocco proviene da una fonte di dati",
     "blockNotEditableDesc": "e non può essere modificato qui.",
+    "dataSourceHint": "Parte del contenuto di questo blocco proviene da una fonte di dati. Per modificarlo, modifica i dati direttamente.",
     "screenTooSmall": "Lo schermo è troppo piccolo per questo editor. Prova a ridurre lo zoom o utilizzare uno schermo più grande.",
     "cancel": "Annulla",
     "publish": "Pubblica",

package/src/i18n/locales/ru.json

@@ -182,6 +182,7 @@
     "closeEditor": "Закрыть редактор (ESC)",
     "blockNotEditable": "Содержимое этого блока поступает из источника данных",
     "blockNotEditableDesc": "и не может быть отредактировано здесь.",
+    "dataSourceHint": "Часть содержимого этого блока поступает из источника данных. Чтобы изменить его, отредактируйте данные напрямую.",
     "screenTooSmall": "Экран слишком мал для этого редактора. Попробуйте уменьшить масштаб или использовать большой экран.",
     "cancel": "Отмена",
     "publish": "Опубликовать",

package/src/plugins/bagel.ts

@@ -5,6 +5,7 @@ import type { BagelToastOptions } from './useToast'
 import { configure } from '@bagelink/utils'
 import FloatingVue from 'floating-vue'
 import lightboxPlugin from '../components/lightbox/index'
+import { DialogPlugin } from '../dialog/useDialog'
 import { ripple, pattern } from '../directives'
 import { createI18n, getI18n } from '../i18n'
 import clickOutside from '../utils/clickOutside'
@@ -27,6 +28,7 @@ export const BagelVue: Plugin<BagelOptions> = {
 
 		// Install UI plugins
 		app.use(lightboxPlugin)
+		app.use(DialogPlugin)
 		app.use(ModalPlugin)
 		app.use(ToastPlugin, options.toast || {})
 

package/src/plugins/useModal.ts

@@ -9,7 +9,7 @@ import type {
 	ConfirmModalUserOptions,
 	ModalConfirmOptions
 } from './modalTypes'
-import { createApp, defineComponent, h, inject, reactive } from 'vue'
+import { createApp, defineComponent, h, inject, reactive, shallowReactive } from 'vue'
 import { Modal, ModalConfirm, ModalForm } from '../components'
 
 export interface ModalApi {
@@ -65,7 +65,7 @@ export const ModalPlugin: Plugin = {
 			return new Promise((resolve) => {
 				const confirmOptions = typeof options === 'string' ? { title: '', message: options } : options
 				modalStack.push({
-					modalOptions: reactive({ ...confirmOptions, resolve }),
+					modalOptions: shallowReactive({ ...confirmOptions, resolve }),
 					modalType: 'confirmModal',
 					componentSlots: {},
 				})

package/src/styles/buttons.css

@@ -57,10 +57,16 @@
     filter: brightness(90%);
 }
 
+
 .hover:active {
     filter: brightness(80%);
 }
 
+.hover-transparent:hover,
+.hover-transparent:active {
+    background: var(--bgl-black-10);
+}
+
 .line-hover,
 .underline-hover,
 .hover-line,
@@ -83,10 +89,6 @@
     border: 1px solid var(--border-color);
 }
 
-.border-primary {
-    border: 1px solid var(--bgl-primary);
-}
-
 .outline {
     outline: 1px solid var(--border-color);
 }

package/src/styles/layout.css

@@ -198,7 +198,8 @@
 }
 
 .justify-content,
-.justify-content-center {
+.justify-content-center,
+.justify-center {
     justify-content: center;
 }
 
@@ -226,7 +227,8 @@
     align-items: flex-start !important;
 }
 
-.align-items-center {
+.align-items-center,
+.align-center {
     align-items: center !important;
 }
 
@@ -3364,6 +3366,46 @@
     height: 10px !important;
 }
 
+.max-h-10p {
+    max-height: 10%;
+}
+
+.max-h-20p {
+    max-height: 20%;
+}
+
+.max-h-30p {
+    max-height: 30%;
+}
+
+.max-h-40p {
+    max-height: 40%;
+}
+
+.max-h-50p {
+    max-height: 50%;
+}
+
+.max-h-60p {
+    max-height: 60%;
+}
+
+.max-h-70p {
+    max-height: 70%;
+}
+
+.max-h-80p {
+    max-height: 80%;
+}
+
+.max-h-90p {
+    max-height: 90%;
+}
+
+.max-h-100p {
+    max-height: 100%;
+}
+
 .hm-10px,
 .max-h-10px,
 .h-max-10px,
@@ -3651,6 +3693,10 @@
     max-height: 100px;
 }
 
+.max-h-100p {
+    max-height: 100%;
+}
+
 .hm-100vh,
 .max-h-100vh,
 .h-max-100vh,

package/src/styles/mobilLayout.css

@@ -2609,6 +2609,47 @@
         height: 10vh !important;
     }
 
+
+    .m_max-h-10p {
+        max-height: 10%;
+    }
+
+    .m_max-h-20p {
+        max-height: 20%;
+    }
+
+    .m_max-h-30p {
+        max-height: 30%;
+    }
+
+    .m_max-h-40p {
+        max-height: 40%;
+    }
+
+    .m_max-h-50p {
+        max-height: 50%;
+    }
+
+    .m_max-h-60p {
+        max-height: 60%;
+    }
+
+    .m_max-h-70p {
+        max-height: 70%;
+    }
+
+    .m_max-h-80p {
+        max-height: 80%;
+    }
+
+    .m_max-h-90p {
+        max-height: 90%;
+    }
+
+    .m_max-h-100p {
+        max-height: 100%;
+    }
+
     .m_h-10px,
     .m_h10px {
         height: 10px !important;