mnfst 0.5.187 → 0.5.189

package/lib/manifest.d.ts

@@ -139,41 +139,49 @@ export interface ManifestLocale {
     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;
+/** One toast flavor: callable, with `.dismiss` (adds a close button) and `.fixed` (sticky) variants. */
+export interface ManifestToastVariant {
+    (message: string, opts?: Record<string, unknown>): void;
+    dismiss(message: string, opts?: Record<string, unknown>): void;
+    fixed(message: string, opts?: Record<string, unknown>): void;
 }
 
-/** `$colors` from the themes plugin. */
-export interface ManifestTheme {
-    readonly current: 'light' | 'dark' | 'system';
-    set(theme: 'light' | 'dark' | 'system'): void;
-    toggle(): void;
+/** `$toast` from the toasts plugin. Typed variants: `$toast.brand(...)`, `$toast.positive.dismiss(...)`. */
+export interface ManifestToast extends ManifestToastVariant {
+    brand: ManifestToastVariant;
+    accent: ManifestToastVariant;
+    positive: ManifestToastVariant;
+    negative: ManifestToastVariant;
 }
 
-/** `$colors` from the colors plugin. */
-export interface ManifestColors {
-    [name: string]: string | ManifestColors;
+/** `$color` from the color plugin — the current light/dark/system color mode. */
+export interface ManifestColor {
+    current: 'light' | 'dark' | 'system' | string;
 }
 
-/** `$colorpicker` from the colorpicker plugin. */
+/** `$colorpicker` from the colorpicker plugin. Loose by design. */
 export interface ManifestColorpicker {
-    open(opts?: Record<string, unknown>): void;
-    close(): void;
+    (id?: string): Record<string, unknown>;
     [extra: string]: unknown;
 }
 
-/** `$url` from the url-parameters plugin: read/write URL query params reactively. */
+/** One URL query parameter handle from `$url.<name>` (reactive). */
+export interface ManifestUrlParam {
+    /** Current value (get/set; empty string when absent). */
+    value: string;
+    /** First value when the param repeats. */
+    readonly first: string;
+    /** All values for a repeating param. */
+    readonly all: string[];
+    set(value: string): void;
+    add(value: string): void;
+    remove(value?: string): void;
+    clear(): void;
+}
+
+/** `$url` from the url-parameters plugin: `$url.tab.value`, `$url.tag.add('x')`, ... */
 export interface ManifestUrl {
-    get(name: string): string | null;
-    set(name: string, value: string | null): void;
-    has(name: string): boolean;
-    [name: string]: unknown;
+    [param: string]: ManifestUrlParam;
 }
 
 /** `$route` magic — true if the current route matches the given pattern. */
@@ -188,6 +196,152 @@ 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;
 
+/** `$pay` from the payments plugin: callable to start checkout, plus portal/state helpers. */
+export interface ManifestPay {
+    (ref: string, payload?: Record<string, unknown>): Promise<unknown>;
+    portal(ref?: string, payload?: Record<string, unknown>): Promise<unknown>;
+    refresh(): Promise<unknown>;
+    register(name: string, adapter: unknown): void;
+    readonly state: Record<string, unknown> | undefined;
+    readonly loading: boolean | undefined;
+    [extra: string]: unknown;
+}
+
+/** A conversation handle returned by `$chat.open(...)`. Loose by design. */
+export interface ManifestChatHandle {
+    readonly messages: unknown[];
+    readonly participants: unknown[];
+    readonly typing: unknown[];
+    readonly me: unknown;
+    [extra: string]: unknown;
+}
+
+/** `$chat` from the chat plugin — adapter-based conversation projection. */
+export interface ManifestChat {
+    open(conversationId: string, opts?: Record<string, unknown>): ManifestChatHandle;
+    merge(handles: ManifestChatHandle[], opts?: Record<string, unknown>): ManifestChatHandle;
+    adapter(name: string, factory?: unknown): unknown;
+    flatten(tree: unknown): unknown[];
+    /** Shared revision counter — trackable even before any handle resolves. */
+    readonly version: number;
+    [extra: string]: unknown;
+}
+
+/** One `$status.<name>` entry. */
+export interface ManifestStatusEntry {
+    readonly state: string;
+    [extra: string]: unknown;
+}
+
+/** `$status` from the status plugin: `$status.api.state`, iterable, stringifies to the overall state. */
+export interface ManifestStatus extends Iterable<ManifestStatusEntry> {
+    readonly [name: string]: any;
+}
+
+/** `$presence` from the Appwrite presences plugin. */
+export interface ManifestPresence {
+    start(opts?: Record<string, unknown>): Promise<unknown>;
+    stop(): void;
+    set(values: Record<string, unknown>): Promise<unknown>;
+    clear(): Promise<unknown>;
+    of(userId: string): unknown;
+    all(): unknown[];
+    readonly records: Record<string, unknown>;
+    readonly list: unknown[];
+    readonly ready: boolean;
+    readonly error: unknown;
+    readonly me: unknown;
+}
+
+/** `$date(id?)` from the datepicker plugin — the picker API for the nearest (or given) instance. */
+export type ManifestDate = (id?: string) => Record<string, unknown>;
+
+/** `$chart(id?)` from the charts plugin — the chart API for the nearest (or given) instance. */
+export type ManifestChart = (id?: string) => Record<string, unknown>;
+
+/** `$export(opts)` from the export plugin — export the page or a data source (pdf/csv/json/...). */
+export type ManifestExport = (opts?: {
+    format?: string;
+    filename?: string;
+    source?: string;
+    data?: unknown;
+    [extra: string]: unknown;
+}) => Promise<unknown>;
+
+/** `$device` from the utilities plugin (enriched by the native plugin when present). */
+export interface ManifestDevice {
+    readonly os: string;
+    readonly touch: boolean;
+    readonly online: boolean;
+    readonly standalone: boolean;
+    readonly native: boolean;
+    readonly platform: string;
+}
+
+/** `$share` from the native plugin — native sheet, web share, or clipboard fallback. */
+export type ManifestShare = (opts?: { title?: string; text?: string; url?: string }) =>
+    Promise<{ shared: boolean; method: string; cancelled?: boolean }>;
+
+/** `$push` from the native plugin — push/notification permissions and token. */
+export interface ManifestPush {
+    request(): Promise<string>;
+    readonly permission: string;
+    [extra: string]: unknown;
+}
+
+/** `$secure` from the native plugin — secure key-value storage (native keychain or fallback). */
+export interface ManifestSecure {
+    get(key: string): Promise<string | null>;
+    set(key: string, value: string): Promise<void>;
+    remove(key: string): Promise<void>;
+    keys(): Promise<string[]>;
+    clear(): Promise<void>;
+    use(adapter: unknown): void;
+}
+
+/** `$links` from the native plugin — deep/universal link handling. */
+export interface ManifestLinks {
+    on(handler: (url: string) => void): void;
+    open(url: string): void;
+    readonly last: string | null;
+}
+
+/** `$app` from the native plugin — foreground/background state. */
+export interface ManifestApp {
+    readonly active: boolean;
+    onChange(handler: (active: boolean) => void): void;
+}
+
+/** `$haptics` from the native plugin — haptic feedback with web vibration fallback. */
+export interface ManifestHaptics {
+    impact(style?: string): Promise<unknown>;
+    notification(type?: string): Promise<unknown>;
+    [extra: string]: unknown;
+}
+
+/** `$biometric` from the native plugin. */
+export interface ManifestBiometric {
+    available(): Promise<boolean>;
+    verify(opts?: Record<string, unknown>): Promise<unknown>;
+}
+
+/** `$camera` from the native plugin. */
+export interface ManifestCamera {
+    photo(opts?: Record<string, unknown>): Promise<unknown>;
+    pick(opts?: Record<string, unknown>): Promise<unknown>;
+}
+
+/**
+ * Manifest's custom-element/attribute authoring surface (documentation aid —
+ * these are HTML attributes, not JS globals). Element styles pair with most.
+ */
+export type ManifestDirective =
+    | 'x-route' | 'x-anchors'
+    | 'x-icon' | 'x-svg' | 'x-markdown' | 'x-code' | 'x-code-group'
+    | 'x-toast' | 'x-tooltip' | 'x-carousel' | 'x-virtual' | 'x-resize'
+    | 'x-chart' | 'x-date' | 'x-color' | 'x-colorpicker' | 'x-combobox'
+    | 'x-export' | 'x-pay' | 'x-files' | 'x-data-files';
+
 // ---------------------------------------------------------------------------
 // Global declarations (what Alpine exposes inside `x-data`, `x-show`, etc.)
 // ---------------------------------------------------------------------------
@@ -201,20 +355,50 @@ declare global {
     const $modify: ManifestModify;
     /** Run a callback safely, returning undefined on error. */
     const $try: ManifestTry;
-    /** Appwrite auth plugin (only present when the plugin is loaded). */
+    /** Appwrite auth plugin (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;
+    /** Color-mode plugin (`$color.current = 'dark'`). */
+    const $color: ManifestColor;
     /** Colorpicker plugin. */
     const $colorpicker: ManifestColorpicker;
-    /** URL parameters plugin. */
+    /** URL parameters plugin (`$url.tab.value`). */
     const $url: ManifestUrl;
+    /** Payments plugin. */
+    const $pay: ManifestPay;
+    /** Chat plugin. */
+    const $chat: ManifestChat;
+    /** Status plugin. */
+    const $status: ManifestStatus;
+    /** Appwrite presences plugin. */
+    const $presence: ManifestPresence;
+    /** Datepicker plugin. */
+    const $date: ManifestDate;
+    /** Charts plugin. */
+    const $chart: ManifestChart;
+    /** Export plugin. */
+    const $export: ManifestExport;
+    /** Device/platform info (utilities; enriched by the native plugin). */
+    const $device: ManifestDevice;
+    /** Native share (native plugin). */
+    const $share: ManifestShare;
+    /** Push permissions (native plugin). */
+    const $push: ManifestPush;
+    /** Secure storage (native plugin). */
+    const $secure: ManifestSecure;
+    /** Deep links (native plugin). */
+    const $links: ManifestLinks;
+    /** App foreground state (native plugin). */
+    const $app: ManifestApp;
+    /** Haptics (native plugin). */
+    const $haptics: ManifestHaptics;
+    /** Biometric auth (native plugin). */
+    const $biometric: ManifestBiometric;
+    /** Camera (native plugin). */
+    const $camera: ManifestCamera;
 
     /** Window-level Manifest namespace exposed by the loader. */
     interface Window {

package/lib/manifest.data.js

@@ -1845,18 +1845,6 @@ window.ManifestDataAPI = {
 
 
 
-/* Manifest Data Sources - Error Handling & Loading States */
-
-// Placeholder for Phase 4: Error handling and loading states
-// This will be implemented in Phase 4
-
-// Export empty object for now
-window.ManifestDataErrors = {
-    // Phase 4: Error handling will be added here
-};
-
-
-
 /* Manifest Data Sources - Unified Mutation System */
 // Handles optimistic updates, scoped updates, rollback, and background sync
 
@@ -3221,6 +3209,40 @@ function attachArrayMethods(array, dataSourceName, reloadDataSource) {
             }
 
             const term = searchTerm.toLowerCase().trim();
+
+            // Weighted mode: $search(term, { title: 3, body: 1 }) — ranks by the
+            // best-matching field's weight per whitespace-separated term (prefix
+            // match gets a small boost); every term must match somewhere.
+            const first = attributes[0];
+            if (attributes.length === 1 && first && typeof first === 'object' && !Array.isArray(first)) {
+                const fields = Object.keys(first);
+                const terms = term.split(/\s+/).filter(Boolean);
+                const scored = [];
+                for (const item of array) {
+                    if (!item || typeof item !== 'object') continue;
+                    let total = 0, ok = true;
+                    for (const t of terms) {
+                        let best = 0;
+                        for (const f of fields) {
+                            const v = item[f];
+                            if (v == null) continue;
+                            const s = String(v).toLowerCase();
+                            if (!s.includes(t)) continue;
+                            let w = Number(first[f]) || 0;
+                            if (s.startsWith(t)) w *= 1.2;
+                            if (w > best) best = w;
+                        }
+                        if (!best) { ok = false; break; }
+                        total += best;
+                    }
+                    if (ok) scored.push([total, item]);
+                }
+                scored.sort((a, b) => b[0] - a[0]);
+                const ranked = scored.map(e => e[1]);
+                attachArrayMethods(ranked, dataSourceName, reloadDataSource);
+                return ranked;
+            }
+
             const attrs = attributes.length > 0 ? attributes : Object.keys(array[0] || {});
 
             const filtered = array.filter(item => {
@@ -8423,6 +8445,19 @@ function registerXMagicMethod(loadDataSource) {
                         return undefined;
                     }
 
+                    // $x.$register(name, data) — install/replace a client-side source at
+                    // runtime (array or object). Reactive like any manifest.json source.
+                    if (prop === '$register') {
+                        return (name, data) => {
+                            if (!name || typeof name !== 'string') return undefined;
+                            const stamped = Array.isArray(data)
+                                ? data.map(d => (d && typeof d === 'object' && !('contentType' in d)) ? { contentType: name, ...d } : d)
+                                : data;
+                            window.ManifestDataStore?.updateStore?.(name, stamped, { loading: false, error: null, ready: true, allowDuringInit: true });
+                            return true;
+                        };
+                    }
+
                     // Resolve+cache from raw data BEFORE reading Alpine.store('data'):
                     // the store read registers a reactive dep that can re-run this
                     // effect and re-enter get() → stack overflow. Caching first makes

package/lib/manifest.datepicker.css

@@ -8,7 +8,7 @@
         min-width: 17rem;
         background: var(--color-popover-surface, oklch(98.5% 0 0));
         color: var(--color-content-stark, oklch(20.5% 0 0));
-        border: 1px solid var(--color-line, color-mix(oklch(20.5% 0 0) 10%, transparent));
+        border: 1px solid var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent));
         border-radius: var(--radius, 0.5rem);
 
         /* Shell */
@@ -43,7 +43,7 @@
                 transition: var(--transition, all .05s ease-in-out);
 
                 &:hover {
-                    background: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent));
+                    background: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent));
                     color: var(--color-content-stark, oklch(20.5% 0 0))
                 }
             }
@@ -135,7 +135,7 @@
                 transition: var(--transition, all .05s ease-in-out);
 
                 &:hover:not(:disabled):not([aria-selected=true]) {
-                    background: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+                    background: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
                 }
 
                 &:focus-visible {
@@ -151,7 +151,7 @@
 
                 /* Today marker */
                 &[aria-current=date]:not([aria-selected=true]) {
-                    border-color: var(--color-line, color-mix(oklch(20.5% 0 0) 18%, transparent));
+                    border-color: var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 18%, transparent));
                     font-weight: 600
                 }
 
@@ -212,11 +212,11 @@
                 transition: var(--transition, all .05s ease-in-out);
 
                 &:hover:not(:disabled) {
-                    background: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+                    background: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
                 }
 
                 &[aria-current=true] {
-                    border-color: var(--color-line, color-mix(oklch(20.5% 0 0) 18%, transparent));
+                    border-color: var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 18%, transparent));
                     font-weight: 600
                 }
 
@@ -251,7 +251,7 @@
             padding-bottom: 0.5rem;
             padding-inline-start: 0.5rem;
             border: none;
-            border-top: 1px solid var(--color-line, color-mix(oklch(20.5% 0 0) 10%, transparent));
+            border-top: 1px solid var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent));
 
             /* "Time" label */
             &>label {
@@ -307,7 +307,7 @@
 
                     &:hover,
                     &:focus {
-                        background: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+                        background: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
                     }
                 }
 
@@ -334,7 +334,7 @@
                     transition: var(--transition, all .05s ease-in-out);
 
                     &:hover {
-                        background: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+                        background: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
                     }
                 }
 
@@ -380,7 +380,7 @@
             width: 100%;
             contain: inline-size;
             padding: 0.5rem 0;
-            border-top: 1px solid var(--color-line, color-mix(oklch(20.5% 0 0) 10%, transparent));
+            border-top: 1px solid var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent));
 
             /* Today | Clear buttons */
             &>button {
@@ -417,7 +417,7 @@
                     padding: 0.25rem 0.625rem;
                     font-size: 0.75rem;
                     white-space: nowrap;
-                    background: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent));
+                    background: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent));
                     color: var(--color-content-stark, oklch(20.5% 0 0));
                     border: none;
                     border-radius: calc(var(--radius, 0.5rem) * 2);
@@ -425,7 +425,7 @@
                     transition: var(--transition, all .05s ease-in-out);
 
                     &:hover {
-                        background: var(--color-field-surface-hover, color-mix(oklch(20.5% 0 0) 16%, transparent))
+                        background: var(--color-field-surface-hover, color-mix(in oklch, oklch(20.5% 0 0) 16%, transparent))
                     }
                 }
             }
@@ -480,7 +480,7 @@
             transition: var(--transition, all .05s ease-in-out);
 
             &:hover {
-                background: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+                background: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
             }
 
             &[aria-selected=true] {

package/lib/manifest.divider.css

@@ -22,7 +22,7 @@
             flex: 1;
             width: auto;
             height: 1px;
-            background-color: var(--color-line, color-mix(oklch(20.5% 0 0) 10%, transparent))
+            background-color: var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
         }
 
         /* Space between lines and content */

package/lib/manifest.dropdown.css

@@ -71,12 +71,12 @@
             &:hover {
                 color: var(--color-field-inverse, oklch(43.9% 0 0));
                 text-decoration: inherit;
-                background-color: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+                background-color: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
             }
 
             &:active {
                 color: var(--color-field-inverse, oklch(43.9% 0 0));
-                background-color: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+                background-color: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
             }
 
             & span,
@@ -103,7 +103,7 @@
             margin-inline-start: calc(0.25rem * -1);
             margin-top: 0.25rem;
             margin-bottom: 0.25rem;
-            background-color: var(--color-line, color-mix(oklch(20.5% 0 0) 10%, transparent))
+            background-color: var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
         }
 
         /* Labels (not inner field-surface wrappers) */
@@ -153,7 +153,7 @@
 
     /* Dark theme */
     :where(.dark menu[popover]) :where(li, a, button, label:not(:has(input:not([type=checkbox], [type=radio], [type=hidden]), select, textarea, .combobox, .label, label))):hover {
-        background-color: var(--color-field-surface-hover, color-mix(oklch(20.5% 0 0) 15%, transparent))
+        background-color: var(--color-field-surface-hover, color-mix(in oklch, oklch(20.5% 0 0) 15%, transparent))
     }
 
     /* Nested menu alignment (not combobox listboxes, which anchor to their field) */

package/lib/manifest.dropdowns.js

@@ -3,8 +3,12 @@
 // Most recent input modality, so we only move focus into a menu for keyboard opens.
 // Capture-phase so no handler can stop it first.
 let lastInputModality = 'mouse';
+// Also the last pressed node: the router claims internal link clicks with
+// stopImmediatePropagation, so pointerdown is our only view of which row a
+// navigating item came from.
+let lastPointerTarget = null;
 document.addEventListener('keydown', () => { lastInputModality = 'keyboard'; }, true);
-document.addEventListener('pointerdown', () => { lastInputModality = 'mouse'; }, true);
+document.addEventListener('pointerdown', (e) => { lastInputModality = 'mouse'; lastPointerTarget = e.target; }, true);
 
 function initializeDropdownPlugin() {
     // Ensure an Alpine context exists. Keep the scope empty — seeding properties
@@ -542,4 +546,18 @@ document.addEventListener('click', (event) => {
             }
         });
     }
-}); 
+});
+
+// Auto-close for rows that navigate. The router claims internal link clicks with
+// stopImmediatePropagation, so the menu's own click handler never runs — close on
+// the route change it dispatches instead. Hash links aren't intercepted and still
+// close via the normal path.
+window.addEventListener('manifest:route-change', () => {
+    const pressed = lastPointerTarget;
+    document.querySelectorAll('[popover]:popover-open').forEach((menu) => {
+        if (!menu.__mnfstCloseBound) return;
+        const row = pressed && menu.contains(pressed) ? pressed : null;
+        if (row && row.closest('[keep-open]')) return;
+        if (menu.__mnfstAutoClose || (row && row.closest('[close]'))) menu.hidePopover();
+    });
+});

package/lib/manifest.form.css

@@ -148,7 +148,7 @@
     :where(fieldset:has(legend)):not(.unstyle) {
         padding: 1ch 1.5ch 1.5ch 1.5ch;
         border-radius: var(--radius, 0.5rem);
-        border-color: var(--color-line, color-mix(oklch(20.5% 0 0) 10%, transparent));
+        border-color: var(--color-line, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent));
         border-style: solid;
         border-width: 1px;
 

package/lib/manifest.input.css

@@ -13,7 +13,7 @@
         width: 100%;
         max-width: 100%;
         color: var(--color-field-inverse, oklch(43.9% 0 0));
-        background-color: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent));
+        background-color: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent));
         border-width: 0;
         border-style: solid;
         border-color: transparent;
@@ -23,15 +23,15 @@
         appearance: none;
 
         &:hover {
-            background-color: var(--color-field-surface-hover, color-mix(oklch(20.5% 0 0) 15%, transparent))
+            background-color: var(--color-field-surface-hover, color-mix(in oklch, oklch(20.5% 0 0) 15%, transparent))
         }
 
         &:active {
-            background-color: var(--color-field-surface-hover, color-mix(oklch(20.5% 0 0) 15%, transparent))
+            background-color: var(--color-field-surface-hover, color-mix(in oklch, oklch(20.5% 0 0) 15%, transparent))
         }
 
         &:focus-visible {
-            background-color: var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent))
+            background-color: var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent))
         }
 
         &::placeholder {
@@ -39,7 +39,7 @@
         }
 
         &::selection {
-            background-color: color-mix(in oklch, var(--color-field-surface, color-mix(oklch(20.5% 0 0) 10%, transparent)) 80%, var(--color-field-inverse, oklch(43.9% 0 0)))
+            background-color: color-mix(in oklch, var(--color-field-surface, color-mix(in oklch, oklch(20.5% 0 0) 10%, transparent)) 80%, var(--color-field-inverse, oklch(43.9% 0 0)))
         }
 
         &[type=file] {

package/lib/manifest.integrity.json

@@ -7,11 +7,11 @@
   "manifest.code.js": "sha384-G3MNfvQRWWY+gm4SGGrSsgQbDeil9MP+ON2DTk6Rcq9Nsex8woHMDt5EJHrFH0Nj",
   "manifest.color.js": "sha384-6Rv3LxyTcZNjrhtayQfqRdCx0uSZ4BiEbgEI98I62eTvp8Aw7LBIoNJ0Je1oktwL",
   "manifest.colorpicker.js": "sha384-N5ezEwgKrDodV4YdURxhdyZKmg1n/QhqvmAC4SEG03mw1pEAZAA8Gphp+NLAOxts",
-  "manifest.combobox.js": "sha384-CqMe9F/Aw0fAwNCevlWOTOX+jl2yVz0zejztF97wvEu9uXH3zg2v87fceBlTXCq0",
-  "manifest.components.js": "sha384-eZDib+RFdwd9mOUdi6o53eNS0LBlEEkZPDegxtkAcE+GrGIFxsuB4O0ymfixGNfM",
-  "manifest.data.js": "sha384-3lLvGnqcQr4Ium80MdaQTr8RytjVbs5rnxd0q41BF3ppcoQccMFAcvgFSyZP/0sl",
+  "manifest.combobox.js": "sha384-rCSqpwzVLwr6alHPmAgW5sEVJylfK3XReyG475O1N9dkyMy/XA8hBCYILc+4qblU",
+  "manifest.components.js": "sha384-N9RY5uBUIULem7WT5/TRGxSXsrYr7gTZeaaOoS/+xYmvgdXmqpS4rJ+tqbcX2i++",
+  "manifest.data.js": "sha384-v5R+3pBJxHCQCmIzn2QLK0z9htnCYk8uKeWhl6rn+AAekA1XjQiLgpq5wOTKJ205",
   "manifest.datepicker.js": "sha384-52BBZdlLN+EATiUorwTEQOWGJZiSNu0voy9q+WQxxWpUeYsGGkuS0QPPXGx2akxG",
-  "manifest.dropdowns.js": "sha384-5NccbUMdqSi/T4+Z/rUBRZl/UVtW4pqvXxbNqKgyiR3LtyYsb0JQ12ZkjK0uq1p9",
+  "manifest.dropdowns.js": "sha384-NfZU+U1oEEBnh1dEFANyoUrpGm3SJ/np/b6lczh+wTqJLjNpXd+LDP54db3b64cG",
   "manifest.export.js": "sha384-NkqOydcrdQ6qFEcpBKc80JCbeSCuybASrTUGajuTMBrHMzt1OIe8b3ndNn9VfqSh",
   "manifest.icons.js": "sha384-kKOINpX70YzNO3FvkV6umrmO3f0KIu0DNbwB+ej55a7y/lhU7v/myQtXL0bwCTbt",
   "manifest.localization.js": "sha384-MUetuW8PllIM+9JDMw/tx+qGem8t+ZUN5WZpycsTDKtz+LaX4DJehsfh/YZt9J7L",