mnfst 0.5.68 → 0.5.70

package/README.md

@@ -14,7 +14,7 @@ Manifest is a frontend framework extending HTML for rapid, feature-rich website
 
 ## 💾 Setup
 
-Get [CDN links](https://manifestjs.org/getting-started/setup) for existing projects or try the [starter project](https://manifestjs.org/getting-started/starter-project) for new ones.
+Get [CDN links](https://manifestx.dev/getting-started/setup) for existing projects or try the [starter project](https://manifestx.dev/getting-started/starter-project) for new ones.
 
 <br>
 
@@ -38,7 +38,7 @@ Get [CDN links](https://manifestjs.org/getting-started/setup) for existing proje
 
 ## 📚 Documentation
 
-For full documentation visit [manifestjs.org](https://manifestjs.org).
+For full documentation visit [manifestx.dev](https://manifestx.dev).
 
 <br>
 

package/lib/manifest.accordion.css

@@ -17,8 +17,8 @@
             margin-bottom: calc(var(--spacing, 0.25rem) * 4)
         }
 
-        &> :not(summary, hr, .divider) {
-            padding: var(--spacing-field-padding, 0.625rem) 0
+        &>:last-child {
+            margin-bottom: calc(var(--spacing, 0.25rem) * 8)
         }
 
         /* Content */
@@ -27,6 +27,7 @@
             display: flex;
             justify-content: space-between;
             align-items: center;
+            padding: var(--spacing-field-padding, 0.625rem) 0;
             font-weight: bold;
             color: var(--color-content-stark, oklch(16.6% 0.026 267));
             user-select: none;

package/lib/manifest.appwrite.auth.js

@@ -959,7 +959,7 @@ function initializeAuthMagic() {
         return false;
     }
 
-    // Add $auth magic method (like $locale, $theme)
+    // Add $auth magic method (like $locale, $colors)
     Alpine.magic('auth', () => {
         const store = Alpine.store('auth');
         if (!store) {

package/lib/manifest.code.css

@@ -1,6 +1,6 @@
 /*  Manifest Code CSS
 /*  By Andrew Matlock under MIT license
-/*  https://manifestjs.org/styles/code
+/*  https://manifestx.dev/styles/code
 */
 
 @import url('https://fonts.googleapis.com/css2?family=Gabarito:wght@400..900&family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Lexend+Exa&display=swap');

package/lib/manifest.css

@@ -1,6 +1,6 @@
 /*  Manifest CSS
 /*  By Andrew Matlock under MIT license
-/*  https://manifestjs.org
+/*  https://manifestx.dev
 /*  Modify referenced variables in manifest.theme.css
 */
 
@@ -393,8 +393,8 @@
             margin-bottom: calc(var(--spacing, 0.25rem) * 4)
         }
 
-        &> :not(summary, hr, .divider) {
-            padding: var(--spacing-field-padding, 0.625rem) 0
+        &>:last-child {
+            margin-bottom: calc(var(--spacing, 0.25rem) * 8)
         }
 
         /* Content */
@@ -403,6 +403,7 @@
             display: flex;
             justify-content: space-between;
             align-items: center;
+            padding: var(--spacing-field-padding, 0.625rem) 0;
             font-weight: bold;
             color: var(--color-content-stark, oklch(16.6% 0.026 267));
             user-select: none;

package/lib/manifest.d.ts

@@ -0,0 +1,244 @@
+/**
+ * Manifest ambient type declarations.
+ * https://manifestx.dev
+ *
+ * This file gives editors (VS Code, Cursor, JetBrains) and AI coding assistants
+ * type information for Manifest's magic globals and data-source state. It is
+ * intended to live in the project root and is regenerated by `npx mnfst-types`
+ * to add project-specific augmentations to ManifestSources from manifest.json.
+ *
+ * Hand-edits below the AUGMENTATION marker will be overwritten on regeneration.
+ */
+
+// ---------------------------------------------------------------------------
+// Data-source state and operators (attached to every $x.<source>)
+// ---------------------------------------------------------------------------
+
+/** Appwrite-style query expression returned by helper builders. */
+export type ManifestQueryExpr = string;
+
+/** Appwrite-style query helpers used with `$query([...])`. */
+export interface ManifestQuery {
+    equal(field: string, value: unknown): ManifestQueryExpr;
+    notEqual(field: string, value: unknown): ManifestQueryExpr;
+    lessThan(field: string, value: number | string): ManifestQueryExpr;
+    lessThanEqual(field: string, value: number | string): ManifestQueryExpr;
+    greaterThan(field: string, value: number | string): ManifestQueryExpr;
+    greaterThanEqual(field: string, value: number | string): ManifestQueryExpr;
+    between(field: string, start: number | string, end: number | string): ManifestQueryExpr;
+    contains(field: string, value: string | string[]): ManifestQueryExpr;
+    startsWith(field: string, value: string): ManifestQueryExpr;
+    endsWith(field: string, value: string): ManifestQueryExpr;
+    search(field: string, value: string): ManifestQueryExpr;
+    isNull(field: string): ManifestQueryExpr;
+    isNotNull(field: string): ManifestQueryExpr;
+    select(fields: string[]): ManifestQueryExpr;
+    orderAsc(field: string): ManifestQueryExpr;
+    orderDesc(field: string): ManifestQueryExpr;
+    limit(value: number): ManifestQueryExpr;
+    offset(value: number): ManifestQueryExpr;
+    cursorAfter(id: string): ManifestQueryExpr;
+    cursorBefore(id: string): ManifestQueryExpr;
+}
+
+/** State flags exposed on every data source (array or object). */
+export interface ManifestSourceState {
+    /** True while the source is fetching for the first time or after a mutation. */
+    readonly $loading: boolean;
+    /** Last error from a load or mutation, or null. */
+    readonly $error: Error | string | null;
+    /** True once initial load has completed (success or failure). */
+    readonly $ready: boolean;
+}
+
+/** Operators available on array-shaped sources (CSV tabular, JSON arrays, Appwrite tables). */
+export interface ManifestArrayOps<T> {
+    /** Substring match across the given fields. Returns matching items. */
+    $search(term: string, ...fields: (keyof T & string)[]): T[];
+    /**
+     * Local sources: filter by an array of `Manifest.query.*` expressions and array methods.
+     * Appwrite sources: server-side query, returns a Promise.
+     */
+    $query(expressions: ManifestQueryExpr[]): T[] | Promise<T[]>;
+    /** Look up a single row whose `id` matches the current route param, if any. */
+    $route(path?: string): T | undefined;
+}
+
+/** Mutations available on Appwrite-table sources. */
+export interface ManifestAppwriteTableOps<T> {
+    $create(values: Partial<T>): Promise<T>;
+    $update(id: string, values: Partial<T>): Promise<T>;
+    $delete(id: string): Promise<void>;
+    $duplicate(id: string, overrides?: Partial<T>): Promise<T>;
+}
+
+/** Operations available on Appwrite-bucket (storage) sources. */
+export interface ManifestAppwriteBucketOps {
+    $url(fileId: string): string;
+    $preview(fileId: string, opts?: Record<string, unknown>): string;
+    $download(fileId: string): string;
+    $openUrl(fileId: string): void;
+    $openPreview(fileId: string): void;
+    $openDownload(fileId: string): void;
+    $upload(file: File | Blob, opts?: Record<string, unknown>): Promise<{ $id: string }>;
+    $remove(fileId: string): Promise<void>;
+    $filesFor(parentId: string, fieldName?: string): unknown[];
+    $unlinkFrom(parentId: string, fileId: string): Promise<void>;
+    $removeFrom(parentId: string, fileId: string): Promise<void>;
+}
+
+/**
+ * The shape returned by `$x.<source>` for an array-of-rows source.
+ * Behaves as a regular `T[]` (supports `map`, `filter`, `find`, etc.) plus
+ * Manifest operators and state flags.
+ */
+export type ManifestArraySource<T> =
+    & ReadonlyArray<T>
+    & ManifestSourceState
+    & ManifestArrayOps<T>
+    & Partial<ManifestAppwriteTableOps<T>>;
+
+/** The shape returned by `$x.<source>` for an object-shaped source (CSV key-value, JSON object, YAML map). */
+export type ManifestObjectSource<T> = T & ManifestSourceState;
+
+/** The shape returned by `$x.<source>` for an Appwrite storage bucket. */
+export type ManifestBucketSource = ManifestSourceState & ManifestAppwriteBucketOps;
+
+// ---------------------------------------------------------------------------
+// Magic globals registered by Manifest plugins
+// ---------------------------------------------------------------------------
+
+/**
+ * Project-specific data sources, keyed by the names declared in `manifest.json`'s
+ * `data` property. Augmented by `npx mnfst-types` from manifest.json + sample
+ * data (declarations appended below the AUGMENTATION marker).
+ */
+export interface ManifestSources {
+    [sourceName: string]: ManifestArraySource<any> | ManifestObjectSource<any> | ManifestBucketSource;
+}
+
+/** `$auth` from the Appwrite auth plugin. Loose by design — auth API is broad. */
+export interface ManifestAuth {
+    readonly current: { $id: string; email?: string; name?: string;[k: string]: unknown } | null;
+    readonly isAuthenticated: boolean;
+    readonly isLoading: boolean;
+    readonly currentTeam: { $id: string; name: string;[k: string]: unknown } | null;
+    readonly teams: Array<{ $id: string; name: string;[k: string]: unknown }>;
+    login(email: string, password?: string): Promise<unknown>;
+    loginWithMagic(email: string): Promise<unknown>;
+    loginWithOAuth(provider: string, opts?: Record<string, unknown>): Promise<unknown>;
+    loginAsGuest(): Promise<unknown>;
+    logout(): Promise<unknown>;
+    [extra: string]: unknown;
+}
+
+/** `$locale` from the localization plugin. */
+export interface ManifestLocale {
+    readonly current: string;
+    readonly available: string[];
+    set(locale: string): void;
+}
+
+/** `$toast` from the toasts plugin. */
+export interface ManifestToast {
+    (message: string, opts?: { type?: 'info' | 'success' | 'warning' | 'error'; duration?: number }): void;
+    info(message: string, opts?: Record<string, unknown>): void;
+    success(message: string, opts?: Record<string, unknown>): void;
+    warning(message: string, opts?: Record<string, unknown>): void;
+    error(message: string, opts?: Record<string, unknown>): void;
+    dismiss(id?: string): void;
+}
+
+/** `$colors` from the themes plugin. */
+export interface ManifestTheme {
+    readonly current: 'light' | 'dark' | 'system';
+    set(theme: 'light' | 'dark' | 'system'): void;
+    toggle(): void;
+}
+
+/** `$colors` from the colors plugin. */
+export interface ManifestColors {
+    [name: string]: string | ManifestColors;
+}
+
+/** `$colorpicker` from the colorpicker plugin. */
+export interface ManifestColorpicker {
+    open(opts?: Record<string, unknown>): void;
+    close(): void;
+    [extra: string]: unknown;
+}
+
+/** `$url` from the url-parameters plugin: read/write URL query params reactively. */
+export interface ManifestUrl {
+    get(name: string): string | null;
+    set(name: string, value: string | null): void;
+    has(name: string): boolean;
+    [name: string]: unknown;
+}
+
+/** `$route` magic — true if the current route matches the given pattern. */
+export type ManifestRoute = (pattern: string) => boolean;
+
+/**
+ * `$modify('attr')` — exposed in component HTML. Returns the value of an
+ * attribute set on the parent component instance (Manifest's prop mechanism).
+ */
+export type ManifestModify = (attr: string) => string | undefined;
+
+/** `$try(fn)` — run a callback and swallow any thrown error, returning undefined on failure. */
+export type ManifestTry = <T>(fn: () => T) => T | undefined;
+
+// ---------------------------------------------------------------------------
+// Global declarations (what Alpine exposes inside `x-data`, `x-show`, etc.)
+// ---------------------------------------------------------------------------
+
+declare global {
+    /** Project data sources registered in manifest.json. */
+    const $x: ManifestSources;
+    /** Match the current route against a pattern (e.g. `$route('/about')`). */
+    const $route: ManifestRoute;
+    /** Read a parent component attribute (Manifest's prop mechanism). */
+    const $modify: ManifestModify;
+    /** Run a callback safely, returning undefined on error. */
+    const $try: ManifestTry;
+    /** Appwrite auth plugin (only present when the plugin is loaded). */
+    const $auth: ManifestAuth;
+    /** Localization plugin. */
+    const $locale: ManifestLocale;
+    /** Toasts plugin. */
+    const $toast: ManifestToast;
+    /** Themes plugin. */
+    const $colors: ManifestTheme;
+    /** Colors plugin. */
+    const $colors: ManifestColors;
+    /** Colorpicker plugin. */
+    const $colorpicker: ManifestColorpicker;
+    /** URL parameters plugin. */
+    const $url: ManifestUrl;
+
+    /** Window-level Manifest namespace exposed by the loader. */
+    interface Window {
+        Manifest?: {
+            loadPlugin(name: string, version?: string): Promise<unknown>;
+            loadTailwind(version?: string): Promise<unknown>;
+            getPluginUrl(name: string, version?: string): string;
+        };
+        Alpine?: unknown;
+        __manifestLoaded?: unknown;
+    }
+}
+
+// ---------------------------------------------------------------------------
+// AUGMENTATION:start
+// Project-specific declarations are appended below by `npx mnfst-types`.
+// Do not hand-edit between the start/end markers — re-running the CLI
+// regenerates this section from manifest.json + sample data.
+// ---------------------------------------------------------------------------
+
+// (No project augmentations yet — run `npx mnfst-types` to generate.)
+
+// ---------------------------------------------------------------------------
+// AUGMENTATION:end
+// ---------------------------------------------------------------------------
+
+export { };

package/lib/manifest.dropdowns.js

@@ -164,6 +164,32 @@ function initializeDropdownPlugin() {
                     el.style.setProperty('anchor-name', anchorName);
                     menu.style.setProperty('position-anchor', anchorName);
 
+                    // ----- A11y wiring (WAI-ARIA Menu Button pattern) -----
+                    // The trigger needs `aria-haspopup="menu"`, `aria-controls`, and a
+                    // dynamic `aria-expanded` that follows the popover's open state.
+                    // The menu element gets `role="menu"` and each list item gets
+                    // `role="menuitem"` so screen readers announce the relationship.
+                    //
+                    // We don't apply these for `.context` dropdowns invoked by right-
+                    // click — they're not button-triggered popups in the APG sense.
+                    if (!modifiers.includes('context')) {
+                        if (!menu.id) menu.id = 'mnfst-dropdown-' + Math.random().toString(36).slice(2, 9);
+                        el.setAttribute('aria-haspopup', 'menu');
+                        el.setAttribute('aria-controls', menu.id);
+                        el.setAttribute('aria-expanded', menu.matches(':popover-open') ? 'true' : 'false');
+                        if (!menu.hasAttribute('role')) menu.setAttribute('role', 'menu');
+                        menu.querySelectorAll('li').forEach((li) => {
+                            if (!li.hasAttribute('role')) li.setAttribute('role', 'menuitem');
+                        });
+                        // Keep aria-expanded in sync with the popover's state.
+                        if (!menu.__mnfstAriaToggleBound) {
+                            menu.__mnfstAriaToggleBound = true;
+                            menu.addEventListener('toggle', (e) => {
+                                el.setAttribute('aria-expanded', e.newState === 'open' ? 'true' : 'false');
+                            });
+                        }
+                    }
+
                     // Set up hover functionality after menu is ready
                     if (modifiers.includes('hover')) {
                         const handleShowPopover = () => {

package/lib/manifest.js

@@ -1,6 +1,6 @@
 /*  Manifest JS
 /*  By Andrew Matlock under MIT license
-/*  https://manifestjs.org
+/*  https://manifestx.dev
 /*
 /*  Lightweight loader that dynamically loads Alpine.js and Manifest plugins
 /*  from jsDelivr CDN. Loads all plugins by default, or a subset if specified.
@@ -20,7 +20,7 @@
 	 * innerHTML) of every element that needs runtime hydration.  This
 	 * function runs once on page load BEFORE any plugin or Alpine starts —
 	 * it walks the contract, restores source state, and removes its own
-	 * markers.  Every downstream plugin (themes, router, data, markdown,
+	 * markers.  Every downstream plugin (colors, router, data, markdown,
 	 * icons, …) then sees exactly the DOM the user authored, exactly as it
 	 * would in a live SPA.  No plugin needs a "prerender mode" branch.
 	 *
@@ -100,7 +100,7 @@
 				tmp.innerHTML = newHTML;
 				const parsed = tmp.firstElementChild;
 				if (parsed) {
-					try { el.parentNode.replaceChild(parsed, el); } catch (_) {}
+					try { el.parentNode.replaceChild(parsed, el); } catch (_) { }
 				}
 				continue;
 			}
@@ -132,7 +132,7 @@
 			tmp.innerHTML = newHTML;
 			const parsed = tmp.firstElementChild;
 			if (parsed) {
-				try { el.parentNode.replaceChild(parsed, el); } catch (_) {}
+				try { el.parentNode.replaceChild(parsed, el); } catch (_) { }
 			}
 		}