@ajuarezso/capacitor-liquid-glass 0.1.1 → 0.3.0

package/dist/esm/definitions.d.ts

@@ -16,8 +16,11 @@ export interface LiquidGlassTabItem {
  *    more see-through than default.
  *  - `'transparent'`: no background, no blur — content behind shows through 100%.
  *    Trade-off: legibilidad puede sufrir sobre contenido caótico.
+ *  - `'liquidGlass'`: REAL iOS 26 `UIGlassEffect` — el mismo material que usan
+ *    Music y App Store. En iOS < 26 cae a `UIBlurEffect.systemThinMaterial`
+ *    (aproximación cercana con system vibrancy).
  */
-export type TabBarStyle = 'default' | 'ultraThin' | 'transparent';
+export type TabBarStyle = 'default' | 'ultraThin' | 'transparent' | 'liquidGlass';
 export interface ShowTabBarOptions {
     items: LiquidGlassTabItem[];
     /** Index of the initially selected item. Defaults to 0. */
@@ -48,6 +51,33 @@ export interface TabBarLayoutEvent {
     /** Safe-area bottom inset the tab bar is sitting on (pt). */
     bottomSafeArea: number;
 }
+/**
+ * Options for the native iOS Liquid Glass search bar overlay (top of window).
+ *
+ * On iOS 26+ the underlying `UISearchBar` adopts the system Liquid Glass look
+ * automatically; on earlier iOS we wrap it in a `systemUltraThinMaterial`
+ * blurred container so the visual is as close as possible.
+ */
+export interface ShowSearchBarOptions {
+    /** Placeholder shown when the field is empty. */
+    placeholder?: string;
+    /** Initial text the field opens with. */
+    initialText?: string;
+    /** Custom label for the trailing "Cancel" button. */
+    cancelText?: string;
+    /** Tint color for the cursor + Cancel button, hex `"#RRGGBB"`. */
+    tintColor?: string;
+    /** Hide the trailing Cancel button (defaults to `false`). */
+    hideCancelButton?: boolean;
+}
+export interface SearchTextChangedEvent {
+    /** Current text in the search field. */
+    text: string;
+}
+export interface SearchSubmittedEvent {
+    /** Text the user submitted (return key on the keyboard). */
+    text: string;
+}
 export interface LiquidGlassPlugin {
     /** Creates (or updates) and shows the native Liquid Glass tab bar. */
     showTabBar(options: ShowTabBarOptions): Promise<void>;
@@ -63,5 +93,17 @@ export interface LiquidGlassPlugin {
     addListener(eventName: 'tabSelected', listenerFunc: (event: TabSelectedEvent) => void): Promise<PluginListenerHandle>;
     /** Emitted when the tab bar's height or safe-area changes (rotation, etc.). */
     addListener(eventName: 'tabBarLayoutChanged', listenerFunc: (event: TabBarLayoutEvent) => void): Promise<PluginListenerHandle>;
+    /** Shows the native Liquid Glass search bar overlay anchored to the top. */
+    showSearchBar(options?: ShowSearchBarOptions): Promise<void>;
+    /** Hides the search bar without destroying configuration. */
+    hideSearchBar(): Promise<void>;
+    /** Clears the text in the search field without dismissing the overlay. */
+    clearSearchText(): Promise<void>;
+    /** Emitted on every keystroke while the user types in the search field. */
+    addListener(eventName: 'searchTextChanged', listenerFunc: (event: SearchTextChangedEvent) => void): Promise<PluginListenerHandle>;
+    /** Emitted when the user taps the keyboard's "Search" / return key. */
+    addListener(eventName: 'searchSubmitted', listenerFunc: (event: SearchSubmittedEvent) => void): Promise<PluginListenerHandle>;
+    /** Emitted when the user taps the trailing Cancel button. */
+    addListener(eventName: 'searchCancelled', listenerFunc: () => void): Promise<PluginListenerHandle>;
     removeAllListeners(): Promise<void>;
 }

package/dist/esm/web.d.ts

@@ -1,5 +1,5 @@
 import { WebPlugin } from '@capacitor/core';
-import type { LiquidGlassPlugin, SetSelectedTabOptions, ShowTabBarOptions, TabBarLayoutEvent, UpdateTabBadgeOptions } from './definitions';
+import type { LiquidGlassPlugin, SetSelectedTabOptions, ShowSearchBarOptions, ShowTabBarOptions, TabBarLayoutEvent, UpdateTabBadgeOptions } from './definitions';
 /**
  * Web fallback — real Liquid Glass requires native iOS 26. On the web we
  * resolve no-ops so the app can run in the browser during development; the
@@ -12,4 +12,7 @@ export declare class LiquidGlassWeb extends WebPlugin implements LiquidGlassPlug
     setSelectedTab(_options: SetSelectedTabOptions): Promise<void>;
     updateTabBadge(_options: UpdateTabBadgeOptions): Promise<void>;
     getTabBarLayout(): Promise<TabBarLayoutEvent>;
+    showSearchBar(_options?: ShowSearchBarOptions): Promise<void>;
+    hideSearchBar(): Promise<void>;
+    clearSearchText(): Promise<void>;
 }

package/dist/esm/web.js

@@ -21,4 +21,13 @@ export class LiquidGlassWeb extends WebPlugin {
     async getTabBarLayout() {
         return { height: 0, bottomSafeArea: 0 };
     }
+    async showSearchBar(_options) {
+        // no-op on web — caller should render its own DOM search input.
+    }
+    async hideSearchBar() {
+        // no-op on web
+    }
+    async clearSearchText() {
+        // no-op on web
+    }
 }

package/dist/plugin.cjs.js

@@ -28,6 +28,15 @@ class LiquidGlassWeb extends core.WebPlugin {
     async getTabBarLayout() {
         return { height: 0, bottomSafeArea: 0 };
     }
+    async showSearchBar(_options) {
+        // no-op on web — caller should render its own DOM search input.
+    }
+    async hideSearchBar() {
+        // no-op on web
+    }
+    async clearSearchText() {
+        // no-op on web
+    }
 }
 
 var web = /*#__PURE__*/Object.freeze({

package/dist/plugin.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"plugin.cjs.js","sources":["esm/index.js","esm/web.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst LiquidGlass = registerPlugin('LiquidGlass', {\n    web: () => import('./web').then((m) => new m.LiquidGlassWeb()),\n});\nexport * from './definitions';\nexport { LiquidGlass };\n","import { WebPlugin } from '@capacitor/core';\n/**\n * Web fallback — real Liquid Glass requires native iOS 26. On the web we\n * resolve no-ops so the app can run in the browser during development; the\n * Angular shell is expected to render its own CSS glassmorphism tab bar when\n * `isNativePlatform()` is false.\n */\nexport class LiquidGlassWeb extends WebPlugin {\n    async showTabBar(_options) {\n        // no-op on web\n    }\n    async hideTabBar() {\n        // no-op on web\n    }\n    async setSelectedTab(_options) {\n        // no-op on web\n    }\n    async updateTabBadge(_options) {\n        // no-op on web\n    }\n    async getTabBarLayout() {\n        return { height: 0, bottomSafeArea: 0 };\n    }\n}\n"],"names":["registerPlugin","WebPlugin"],"mappings":";;;;AACK,MAAC,WAAW,GAAGA,mBAAc,CAAC,aAAa,EAAE;AAClD,IAAI,GAAG,EAAE,MAAM,mDAAe,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,cAAc,EAAE,CAAC;AAClE,CAAC;;ACFD;AACA;AACA;AACA;AACA;AACA;AACO,MAAM,cAAc,SAASC,cAAS,CAAC;AAC9C,IAAI,MAAM,UAAU,CAAC,QAAQ,EAAE;AAC/B;AACA,IAAI;AACJ,IAAI,MAAM,UAAU,GAAG;AACvB;AACA,IAAI;AACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;AACnC;AACA,IAAI;AACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;AACnC;AACA,IAAI;AACJ,IAAI,MAAM,eAAe,GAAG;AAC5B,QAAQ,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE;AAC/C,IAAI;AACJ;;;;;;;;;"}
+{"version":3,"file":"plugin.cjs.js","sources":["esm/index.js","esm/web.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst LiquidGlass = registerPlugin('LiquidGlass', {\n    web: () => import('./web').then((m) => new m.LiquidGlassWeb()),\n});\nexport * from './definitions';\nexport { LiquidGlass };\n","import { WebPlugin } from '@capacitor/core';\n/**\n * Web fallback — real Liquid Glass requires native iOS 26. On the web we\n * resolve no-ops so the app can run in the browser during development; the\n * Angular shell is expected to render its own CSS glassmorphism tab bar when\n * `isNativePlatform()` is false.\n */\nexport class LiquidGlassWeb extends WebPlugin {\n    async showTabBar(_options) {\n        // no-op on web\n    }\n    async hideTabBar() {\n        // no-op on web\n    }\n    async setSelectedTab(_options) {\n        // no-op on web\n    }\n    async updateTabBadge(_options) {\n        // no-op on web\n    }\n    async getTabBarLayout() {\n        return { height: 0, bottomSafeArea: 0 };\n    }\n    async showSearchBar(_options) {\n        // no-op on web — caller should render its own DOM search input.\n    }\n    async hideSearchBar() {\n        // no-op on web\n    }\n    async clearSearchText() {\n        // no-op on web\n    }\n}\n"],"names":["registerPlugin","WebPlugin"],"mappings":";;;;AACK,MAAC,WAAW,GAAGA,mBAAc,CAAC,aAAa,EAAE;AAClD,IAAI,GAAG,EAAE,MAAM,mDAAe,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,cAAc,EAAE,CAAC;AAClE,CAAC;;ACFD;AACA;AACA;AACA;AACA;AACA;AACO,MAAM,cAAc,SAASC,cAAS,CAAC;AAC9C,IAAI,MAAM,UAAU,CAAC,QAAQ,EAAE;AAC/B;AACA,IAAI;AACJ,IAAI,MAAM,UAAU,GAAG;AACvB;AACA,IAAI;AACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;AACnC;AACA,IAAI;AACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;AACnC;AACA,IAAI;AACJ,IAAI,MAAM,eAAe,GAAG;AAC5B,QAAQ,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE;AAC/C,IAAI;AACJ,IAAI,MAAM,aAAa,CAAC,QAAQ,EAAE;AAClC;AACA,IAAI;AACJ,IAAI,MAAM,aAAa,GAAG;AAC1B;AACA,IAAI;AACJ,IAAI,MAAM,eAAe,GAAG;AAC5B;AACA,IAAI;AACJ;;;;;;;;;"}

package/dist/plugin.js

@@ -27,6 +27,15 @@ var capacitorLiquidGlass = (function (exports, core) {
         async getTabBarLayout() {
             return { height: 0, bottomSafeArea: 0 };
         }
+        async showSearchBar(_options) {
+            // no-op on web — caller should render its own DOM search input.
+        }
+        async hideSearchBar() {
+            // no-op on web
+        }
+        async clearSearchText() {
+            // no-op on web
+        }
     }
 
     var web = /*#__PURE__*/Object.freeze({

package/dist/plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"plugin.js","sources":["esm/index.js","esm/web.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst LiquidGlass = registerPlugin('LiquidGlass', {\n    web: () => import('./web').then((m) => new m.LiquidGlassWeb()),\n});\nexport * from './definitions';\nexport { LiquidGlass };\n","import { WebPlugin } from '@capacitor/core';\n/**\n * Web fallback — real Liquid Glass requires native iOS 26. On the web we\n * resolve no-ops so the app can run in the browser during development; the\n * Angular shell is expected to render its own CSS glassmorphism tab bar when\n * `isNativePlatform()` is false.\n */\nexport class LiquidGlassWeb extends WebPlugin {\n    async showTabBar(_options) {\n        // no-op on web\n    }\n    async hideTabBar() {\n        // no-op on web\n    }\n    async setSelectedTab(_options) {\n        // no-op on web\n    }\n    async updateTabBadge(_options) {\n        // no-op on web\n    }\n    async getTabBarLayout() {\n        return { height: 0, bottomSafeArea: 0 };\n    }\n}\n"],"names":["registerPlugin","WebPlugin"],"mappings":";;;AACK,UAAC,WAAW,GAAGA,mBAAc,CAAC,aAAa,EAAE;IAClD,IAAI,GAAG,EAAE,MAAM,mDAAe,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,cAAc,EAAE,CAAC;IAClE,CAAC;;ICFD;IACA;IACA;IACA;IACA;IACA;IACO,MAAM,cAAc,SAASC,cAAS,CAAC;IAC9C,IAAI,MAAM,UAAU,CAAC,QAAQ,EAAE;IAC/B;IACA,IAAI;IACJ,IAAI,MAAM,UAAU,GAAG;IACvB;IACA,IAAI;IACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;IACnC;IACA,IAAI;IACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;IACnC;IACA,IAAI;IACJ,IAAI,MAAM,eAAe,GAAG;IAC5B,QAAQ,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE;IAC/C,IAAI;IACJ;;;;;;;;;;;;;;;"}
+{"version":3,"file":"plugin.js","sources":["esm/index.js","esm/web.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst LiquidGlass = registerPlugin('LiquidGlass', {\n    web: () => import('./web').then((m) => new m.LiquidGlassWeb()),\n});\nexport * from './definitions';\nexport { LiquidGlass };\n","import { WebPlugin } from '@capacitor/core';\n/**\n * Web fallback — real Liquid Glass requires native iOS 26. On the web we\n * resolve no-ops so the app can run in the browser during development; the\n * Angular shell is expected to render its own CSS glassmorphism tab bar when\n * `isNativePlatform()` is false.\n */\nexport class LiquidGlassWeb extends WebPlugin {\n    async showTabBar(_options) {\n        // no-op on web\n    }\n    async hideTabBar() {\n        // no-op on web\n    }\n    async setSelectedTab(_options) {\n        // no-op on web\n    }\n    async updateTabBadge(_options) {\n        // no-op on web\n    }\n    async getTabBarLayout() {\n        return { height: 0, bottomSafeArea: 0 };\n    }\n    async showSearchBar(_options) {\n        // no-op on web — caller should render its own DOM search input.\n    }\n    async hideSearchBar() {\n        // no-op on web\n    }\n    async clearSearchText() {\n        // no-op on web\n    }\n}\n"],"names":["registerPlugin","WebPlugin"],"mappings":";;;AACK,UAAC,WAAW,GAAGA,mBAAc,CAAC,aAAa,EAAE;IAClD,IAAI,GAAG,EAAE,MAAM,mDAAe,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,cAAc,EAAE,CAAC;IAClE,CAAC;;ICFD;IACA;IACA;IACA;IACA;IACA;IACO,MAAM,cAAc,SAASC,cAAS,CAAC;IAC9C,IAAI,MAAM,UAAU,CAAC,QAAQ,EAAE;IAC/B;IACA,IAAI;IACJ,IAAI,MAAM,UAAU,GAAG;IACvB;IACA,IAAI;IACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;IACnC;IACA,IAAI;IACJ,IAAI,MAAM,cAAc,CAAC,QAAQ,EAAE;IACnC;IACA,IAAI;IACJ,IAAI,MAAM,eAAe,GAAG;IAC5B,QAAQ,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,EAAE;IAC/C,IAAI;IACJ,IAAI,MAAM,aAAa,CAAC,QAAQ,EAAE;IAClC;IACA,IAAI;IACJ,IAAI,MAAM,aAAa,GAAG;IAC1B;IACA,IAAI;IACJ,IAAI,MAAM,eAAe,GAAG;IAC5B;IACA,IAAI;IACJ;;;;;;;;;;;;;;;"}

package/ios/Sources/LiquidGlassPlugin/LiquidGlassPlugin.swift

@@ -12,9 +12,13 @@ public class LiquidGlassPlugin: CAPPlugin, CAPBridgedPlugin {
         CAPPluginMethod(name: "setSelectedTab", returnType: CAPPluginReturnPromise),
         CAPPluginMethod(name: "updateTabBadge", returnType: CAPPluginReturnPromise),
         CAPPluginMethod(name: "getTabBarLayout", returnType: CAPPluginReturnPromise),
+        CAPPluginMethod(name: "showSearchBar", returnType: CAPPluginReturnPromise),
+        CAPPluginMethod(name: "hideSearchBar", returnType: CAPPluginReturnPromise),
+        CAPPluginMethod(name: "clearSearchText", returnType: CAPPluginReturnPromise),
     ]
 
     private var tabBarOverlay: LiquidGlassTabBarOverlay?
+    private var searchOverlay: LiquidGlassSearchOverlay?
 
     @objc func showTabBar(_ call: CAPPluginCall) {
         guard let rawItems = call.getArray("items") as? [[String: Any]] else {
@@ -86,6 +90,67 @@ public class LiquidGlassPlugin: CAPPlugin, CAPBridgedPlugin {
         }
     }
 
+    // MARK: - Search Bar
+
+    @objc func showSearchBar(_ call: CAPPluginCall) {
+        let placeholder = call.getString("placeholder")
+        let initialText = call.getString("initialText")
+        let cancelText = call.getString("cancelText")
+        let tintHex = call.getString("tintColor")
+        let hideCancelButton = call.getBool("hideCancelButton") ?? false
+
+        DispatchQueue.main.async { [weak self] in
+            guard let self else { return }
+            self.presentSearchBar(
+                placeholder: placeholder,
+                initialText: initialText,
+                cancelText: cancelText,
+                tintHex: tintHex,
+                hideCancelButton: hideCancelButton
+            )
+            call.resolve()
+        }
+    }
+
+    @objc func hideSearchBar(_ call: CAPPluginCall) {
+        DispatchQueue.main.async { [weak self] in
+            self?.searchOverlay?.hide()
+            call.resolve()
+        }
+    }
+
+    @objc func clearSearchText(_ call: CAPPluginCall) {
+        DispatchQueue.main.async { [weak self] in
+            self?.searchOverlay?.clearText()
+            call.resolve()
+        }
+    }
+
+    private func presentSearchBar(
+        placeholder: String?,
+        initialText: String?,
+        cancelText: String?,
+        tintHex: String?,
+        hideCancelButton: Bool
+    ) {
+        guard let window = UIApplication.shared.capacitorWindow else { return }
+
+        if searchOverlay == nil {
+            let overlay = LiquidGlassSearchOverlay()
+            overlay.delegate = self
+            searchOverlay = overlay
+        }
+
+        searchOverlay?.configure(
+            placeholder: placeholder,
+            initialText: initialText,
+            cancelText: cancelText,
+            tintHex: tintHex,
+            hideCancelButton: hideCancelButton
+        )
+        searchOverlay?.show(on: window)
+    }
+
     private func presentTabBar(items: [LiquidGlassTabItem], selectedIndex: Int, tintHex: String?, styleRaw: String) {
         guard let window = UIApplication.shared.capacitorWindow else { return }
 
@@ -110,6 +175,21 @@ public class LiquidGlassPlugin: CAPPlugin, CAPBridgedPlugin {
     }
 }
 
+// MARK: - LiquidGlassSearchOverlayDelegate
+extension LiquidGlassPlugin: LiquidGlassSearchOverlayDelegate {
+    func searchOverlayDidChangeText(_ text: String) {
+        notifyListeners("searchTextChanged", data: ["text": text])
+    }
+
+    func searchOverlayDidSubmit(_ text: String) {
+        notifyListeners("searchSubmitted", data: ["text": text])
+    }
+
+    func searchOverlayDidCancel() {
+        notifyListeners("searchCancelled", data: [:])
+    }
+}
+
 // MARK: - UIApplication helper
 private extension UIApplication {
     var capacitorWindow: UIWindow? {

package/ios/Sources/LiquidGlassPlugin/LiquidGlassSearchOverlay.swift

@@ -0,0 +1,172 @@
+import UIKit
+
+/// Callbacks emitted from the search overlay back to the plugin so it can
+/// `notifyListeners(...)` to JS land.
+protocol LiquidGlassSearchOverlayDelegate: AnyObject {
+    func searchOverlayDidChangeText(_ text: String)
+    func searchOverlayDidSubmit(_ text: String)
+    func searchOverlayDidCancel()
+}
+
+/// A floating UISearchBar overlay wrapped in a UIVisualEffectView so it
+/// inherits the iOS 26 Liquid Glass look (and falls back to
+/// `systemUltraThinMaterial` blur on earlier iOS).
+///
+/// Auto-layout pin: top of the keyWindow, respecting the safe area, full width.
+final class LiquidGlassSearchOverlay: NSObject {
+
+    weak var delegate: LiquidGlassSearchOverlayDelegate?
+
+    // Internal state
+    private weak var window: UIWindow?
+    private var container: UIVisualEffectView?
+    private var searchBar: UISearchBar?
+
+    // Cached config (so re-configures persist across show/hide)
+    private var placeholder: String?
+    private var initialText: String?
+    private var cancelText: String?
+    private var tintHex: String?
+    private var hideCancelButton: Bool = false
+
+    /// Stores the configuration; safe to call before `show()`.
+    func configure(
+        placeholder: String?,
+        initialText: String?,
+        cancelText: String?,
+        tintHex: String?,
+        hideCancelButton: Bool
+    ) {
+        self.placeholder = placeholder
+        self.initialText = initialText
+        self.cancelText = cancelText
+        self.tintHex = tintHex
+        self.hideCancelButton = hideCancelButton
+        // If already attached, push config to live UI right away.
+        applyConfigToSearchBar()
+    }
+
+    /// Attach + show the overlay on the given window. Idempotent: re-attaching
+    /// to the same window is a no-op (just re-applies the config + first responder).
+    func show(on window: UIWindow) {
+        if self.window === window, container != nil {
+            applyConfigToSearchBar()
+            container?.isHidden = false
+            searchBar?.becomeFirstResponder()
+            return
+        }
+        self.window = window
+
+        // Container with blur — auto-becomes Liquid Glass on iOS 26 SDK.
+        let blur = UIBlurEffect(style: .systemUltraThinMaterial)
+        let container = UIVisualEffectView(effect: blur)
+        container.translatesAutoresizingMaskIntoConstraints = false
+
+        let searchBar = UISearchBar()
+        searchBar.translatesAutoresizingMaskIntoConstraints = false
+        searchBar.delegate = self
+        searchBar.searchBarStyle = .minimal
+        searchBar.backgroundImage = UIImage() // strip default chrome so blur shows through
+        searchBar.autocorrectionType = .no
+        searchBar.autocapitalizationType = .none
+        searchBar.returnKeyType = .search
+
+        container.contentView.addSubview(searchBar)
+        window.addSubview(container)
+
+        NSLayoutConstraint.activate([
+            container.leadingAnchor.constraint(equalTo: window.leadingAnchor),
+            container.trailingAnchor.constraint(equalTo: window.trailingAnchor),
+            container.topAnchor.constraint(equalTo: window.topAnchor),
+
+            searchBar.leadingAnchor.constraint(equalTo: container.contentView.leadingAnchor, constant: 8),
+            searchBar.trailingAnchor.constraint(equalTo: container.contentView.trailingAnchor, constant: -8),
+            searchBar.topAnchor.constraint(equalTo: window.safeAreaLayoutGuide.topAnchor),
+            searchBar.bottomAnchor.constraint(equalTo: container.contentView.bottomAnchor, constant: -8),
+        ])
+
+        self.container = container
+        self.searchBar = searchBar
+
+        applyConfigToSearchBar()
+        searchBar.becomeFirstResponder()
+    }
+
+    /// Hide overlay (don't tear down — keep config so next `show()` is fast).
+    func hide() {
+        searchBar?.resignFirstResponder()
+        UIView.animate(withDuration: 0.18, animations: { [weak self] in
+            self?.container?.alpha = 0
+        }, completion: { [weak self] _ in
+            self?.container?.isHidden = true
+            self?.container?.alpha = 1
+        })
+    }
+
+    /// Clear text without dismissing the overlay.
+    func clearText() {
+        searchBar?.text = ""
+        // Notify delegate so JS land sees the empty value.
+        delegate?.searchOverlayDidChangeText("")
+    }
+
+    // MARK: - Private
+
+    private func applyConfigToSearchBar() {
+        guard let searchBar else { return }
+        searchBar.placeholder = placeholder
+        if let initialText { searchBar.text = initialText }
+        searchBar.showsCancelButton = !hideCancelButton
+        if let tintHex, let tint = UIColor(searchBarHex: tintHex) {
+            searchBar.tintColor = tint
+        }
+        // Override the system "Cancel" label if a custom one was provided.
+        if let cancelText, !hideCancelButton {
+            // Walk subviews to find the cancel button (UIKit private path is
+            // historically how this is done; safe enough — falls through to no-op
+            // if the button can't be located on a future iOS).
+            if let button = findCancelButton(in: searchBar) {
+                button.setTitle(cancelText, for: .normal)
+            }
+        }
+    }
+
+    private func findCancelButton(in view: UIView) -> UIButton? {
+        for sub in view.subviews {
+            if let btn = sub as? UIButton { return btn }
+            if let nested = findCancelButton(in: sub) { return nested }
+        }
+        return nil
+    }
+}
+
+// MARK: - UISearchBarDelegate
+extension LiquidGlassSearchOverlay: UISearchBarDelegate {
+    func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
+        delegate?.searchOverlayDidChangeText(searchText)
+    }
+
+    func searchBarSearchButtonClicked(_ searchBar: UISearchBar) {
+        delegate?.searchOverlayDidSubmit(searchBar.text ?? "")
+        searchBar.resignFirstResponder()
+    }
+
+    func searchBarCancelButtonClicked(_ searchBar: UISearchBar) {
+        searchBar.text = ""
+        searchBar.resignFirstResponder()
+        delegate?.searchOverlayDidCancel()
+    }
+}
+
+// MARK: - UIColor+hex (scoped to this file to avoid duplicate-symbol with TabBarOverlay)
+private extension UIColor {
+    convenience init?(searchBarHex hex: String) {
+        var value = hex.trimmingCharacters(in: .whitespacesAndNewlines).uppercased()
+        if value.hasPrefix("#") { value.removeFirst() }
+        guard value.count == 6, let rgb = UInt64(value, radix: 16) else { return nil }
+        let r = CGFloat((rgb & 0xFF0000) >> 16) / 255
+        let g = CGFloat((rgb & 0x00FF00) >> 8) / 255
+        let b = CGFloat(rgb & 0x0000FF) / 255
+        self.init(red: r, green: g, blue: b, alpha: 1.0)
+    }
+}

package/ios/Sources/LiquidGlassPlugin/LiquidGlassTabBarOverlay.swift

@@ -29,6 +29,9 @@ enum LiquidGlassTabBarStyle: String {
     case ultraThin
     /// No background, no blur — content behind shows through 100%.
     case transparent
+    /// REAL iOS 26 `UIGlassEffect` (Music + App Store material).
+    /// Fallback en iOS < 26 → `UIBlurEffect.systemThinMaterial`.
+    case liquidGlass
 }
 
 /// A floating UITabBar overlay that adopts iOS 26 Liquid Glass automatically
@@ -87,6 +90,23 @@ final class LiquidGlassTabBarOverlay: NSObject {
             appearance.backgroundEffect = nil
             appearance.backgroundColor = UIColor.clear
             appearance.shadowColor = UIColor.clear
+        case .liquidGlass:
+            // REAL iOS 26 Liquid Glass — el mismo material que usan Music y
+            // App Store. `UIGlassEffect` solo está disponible compilando con
+            // el SDK iOS 26+ (Xcode 26+). En iOS < 26 runtime cae a
+            // `systemThinMaterial`, que es la mejor aproximación legacy con
+            // vibrancy del sistema.
+            appearance.configureWithDefaultBackground()
+            #if compiler(>=6.1)
+            if #available(iOS 26.0, *) {
+                appearance.backgroundEffect = UIGlassEffect()
+            } else {
+                appearance.backgroundEffect = UIBlurEffect(style: .systemThinMaterial)
+            }
+            #else
+            appearance.backgroundEffect = UIBlurEffect(style: .systemThinMaterial)
+            #endif
+            appearance.backgroundColor = UIColor.clear
         }
         tabBar.standardAppearance = appearance
         if #available(iOS 15.0, *) {
@@ -121,9 +141,13 @@ final class LiquidGlassTabBarOverlay: NSObject {
 
         tabBar.setItems(uiItems, animated: false)
 
-        if let previousSelectedId, let restoreIdx = items.firstIndex(where: { $0.id == previousSelectedId }) {
+        // Si el caller pidió explícitamente "no selection" (selectedIndex < 0),
+        // respetar eso y NO restaurar la selección previa — deja selectedItem = nil.
+        if selectedIndex < 0 {
+            tabBar.selectedItem = nil
+        } else if let previousSelectedId, let restoreIdx = items.firstIndex(where: { $0.id == previousSelectedId }) {
             tabBar.selectedItem = uiItems[restoreIdx]
-        } else if selectedIndex >= 0, selectedIndex < uiItems.count {
+        } else if selectedIndex < uiItems.count {
             tabBar.selectedItem = uiItems[selectedIndex]
         }
 
@@ -185,7 +209,13 @@ final class LiquidGlassTabBarOverlay: NSObject {
     }
 
     func setSelectedIndex(_ index: Int) {
-        guard let tabBar, let items = tabBar.items, index >= 0, index < items.count else { return }
+        guard let tabBar, let items = tabBar.items else { return }
+        // index < 0 → deseleccionar todos los tabs (selectedItem = nil)
+        if index < 0 {
+            tabBar.selectedItem = nil
+            return
+        }
+        guard index < items.count else { return }
         tabBar.selectedItem = items[index]
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ajuarezso/capacitor-liquid-glass",
-  "version": "0.1.1",
+  "version": "0.3.0",
   "description": "iOS 26 Liquid Glass native chrome (TabBar, NavigationBar, Alerts, Sheets) for Capacitor apps. Falls back gracefully on iOS < 26 and Android.",
   "main": "dist/plugin.cjs.js",
   "module": "dist/esm/index.js",