@bagelink/vue 1.15.188 → 1.15.192

package/src/components/layout/appLayoutContext.ts

@@ -12,14 +12,34 @@ export interface RegionState {
 	/** Expanded (reserves full `size`) vs collapsed/hidden (reserves `collapsedSize`). */
 	open: boolean
 	/**
-	 * push    → reserves room; center content is inset by `size` (or `collapsedSize`).
-	 * overlay → floats above center; reserves nothing (floating/full chat, mobile drawer).
+	 * push    → AppLayout renders a real IN-FLOW, reserved-width box in the row and
+	 *           the child fills it (`width/height: 100%`). Single source of truth for
+	 *           the size; AppLayout owns the box + resize. No `fixed`/margin trick.
+	 * overlay → the child floats `position: fixed` above the center and reserves
+	 *           nothing (mobile sidebar drawer, floating/full chat).
 	 */
 	mode: 'push' | 'overlay'
 	/** Inline-size for start/end, block-size for top/bottom. Any CSS length. */
 	size: string
 	/** Size when `open === false`. `'0'` fully collapses the region away. */
 	collapsedSize: string
+	/**
+	 * What kind of thing occupies this region. Lets consumers tell an actual
+	 * navigation sidebar apart from another panel that merely docks into the same
+	 * rail (e.g. a chat dock in `start`). AppContent's menu-toggle only appears for
+	 * a real `'sidebar'`. Default undefined (treated as a sidebar for back-compat).
+	 */
+	role?: 'sidebar' | 'dock'
+	/**
+	 * Opt in to drag-resize (start/end only). AppLayout renders a thin handle on
+	 * the region's inner edge and mutates `size` live during the drag, clamped to
+	 * `[minSize, maxSize]`. `size` MUST be a px value (e.g. '440px') while resizable.
+	 */
+	resizable?: boolean
+	/** Min resize bound (px string, e.g. '320px'). Defaults to '0'. */
+	minSize?: string
+	/** Max resize bound (px string, e.g. '900px'). Defaults to '100vw' worth of px. */
+	maxSize?: string
 }
 
 export type RegionPatch = Partial<RegionState>

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

@@ -27,6 +27,7 @@ export type FormFieldType =
 export interface SelectOption {
 	label: string
 	value: string
+	imgSrc?: string
 }
 
 export interface FormFieldValidation {
@@ -83,6 +84,10 @@ export interface FormField {
 	radioAlign?: 'start' | 'center' | 'end'
 	/** Lay radio options out horizontally (inline) instead of stacked. */
 	radioInline?: boolean
+	/** Size of radio options. */
+	radioSize?: 's' | 'm' | 'l'
+	/** Align the content inside inline radio options. */
+	radioTextAlign?: 'left' | 'center' | 'right'
 	textIcon?: string
 	textIconStart?: string
 	validation?: FormFieldValidation
@@ -110,6 +115,10 @@ export interface JSONSchemaProperty {
 		condition?: string
 		/** Field kept in form data / submitted but never displayed. */
 		hidden?: boolean
+		/** Vertical alignment of radio option content. */
+		radioAlign?: 'start' | 'center' | 'end'
+		/** Horizontal alignment of radio option text. */
+		radioTextAlign?: 'left' | 'center' | 'right'
 		[key: string]: any
 	}
 	'x-field-type'?: FormFieldType
@@ -136,6 +145,8 @@ export interface JSONSchemaProperty {
 	'x-radio-hide-radio'?: boolean
 	'x-radio-align'?: 'start' | 'center' | 'end'
 	'x-radio-inline'?: boolean
+	'x-radio-size'?: 's' | 'm' | 'l'
+	'x-radio-text-align'?: 'left' | 'center' | 'right'
 	'x-text-icon'?: string
 	'x-text-icon-start'?: string
 	'x-hide-label'?: boolean
@@ -241,8 +252,10 @@ export function schemaToFields(schema: JSONSchemaObject | undefined): FormField[
 			rangeMulti: prop['x-range-multi'],
 			radioThin: prop['x-radio-thin'],
 			radioHideRadio: prop['x-radio-hide-radio'],
-			radioAlign: prop['x-radio-align'],
+			radioAlign: prop['x-ui']?.radioAlign ?? prop['x-radio-align'],
 			radioInline: prop['x-radio-inline'],
+			radioSize: prop['x-radio-size'],
+			radioTextAlign: prop['x-ui']?.radioTextAlign ?? prop['x-radio-text-align'],
 			textIcon: prop['x-text-icon'],
 			textIconStart: prop['x-text-icon-start'],
 			validation: Object.keys(validation).length > 0 ? validation : undefined,
@@ -377,8 +390,10 @@ export function fieldsToSchema(fields: FormField[]): JSONSchemaObject {
 		if (field.rangeMulti === true) prop['x-range-multi'] = true
 		if (field.radioThin === true) prop['x-radio-thin'] = true
 		if (field.radioHideRadio === true) prop['x-radio-hide-radio'] = true
-		if (field.radioAlign) prop['x-radio-align'] = field.radioAlign
+		if (field.radioAlign) prop['x-ui'] = { ...prop['x-ui'], radioAlign: field.radioAlign }
 		if (field.radioInline === true) prop['x-radio-inline'] = true
+		if (field.radioSize) prop['x-radio-size'] = field.radioSize
+		if (field.radioTextAlign) prop['x-ui'] = { ...prop['x-ui'], radioTextAlign: field.radioTextAlign }
 		if (field.textIcon) prop['x-text-icon'] = field.textIcon
 		if (field.textIconStart) prop['x-text-icon-start'] = field.textIconStart
 

package/src/utils/index.ts

@@ -259,6 +259,15 @@ export type { ShowdownConverter, ShowdownOptions } from './showdown'
 
 const URL_REGEX = /^https?:\/\/|^\/\/|^blob:|^data:/
 
+// Base URL for uploaded files. Defaults to the public file server, but can be
+// overridden per-app (e.g. to '/files' to route through a dev/prod proxy).
+let fileBaseUrl = 'https://files.bagel.design'
+
+/** Override the base URL used to resolve uploaded file path keys. */
+export function setFileBaseUrl(baseUrl: string): void {
+	fileBaseUrl = baseUrl.replace(/\/$/, '')
+}
+
 export function pathKeyToURL(pathKey?: string | null): string | undefined {
 	if (pathKey == null || pathKey === '') {
 		return undefined
@@ -284,10 +293,8 @@ export function pathKeyToURL(pathKey?: string | null): string | undefined {
 		return `/${pathKey}`
 	}
 
-	// For uploaded files, use the default file server
-	// TODO: Make this configurable via SDK init
-	const baseUrl = 'https://files.bagel.design'
-	return `${baseUrl}/${pathKey}`
+	// For uploaded files, use the configured file server (see setFileBaseUrl)
+	return `${fileBaseUrl}/${pathKey}`
 }
 
 export function getNestedValue(obj: any, path?: string, defaultValue: any = undefined): any {