react-native-tinyui 0.1.1 → 0.3.0

package/README.md

@@ -73,6 +73,7 @@ import { Menu } from 'react-native-tinyui';
 
 <Menu
   accessibilityLabel="Document actions"
+  title="Document actions"
   onPrimaryAction={() => openDocument()}
   options={[
     {

package/ios/Menu/TinyuiMenuProvider.swift

@@ -38,6 +38,12 @@ import UIKit
     }
   }
 
+  @objc public var title: String = "" {
+    didSet {
+      props.title = title
+    }
+  }
+
   @objc public var disabled: Bool = false {
     didSet {
       props.disabled = disabled

package/ios/Menu/TinyuiMenuView.mm

@@ -84,6 +84,9 @@ using namespace facebook::react;
   if (oldMenuProps.menuConfig != newMenuProps.menuConfig) {
     _menuProvider.menuConfig = RCTNSStringFromString(newMenuProps.menuConfig);
   }
+  if (oldMenuProps.title != newMenuProps.title) {
+    _menuProvider.title = RCTNSStringFromString(newMenuProps.title);
+  }
   if (oldMenuProps.hasPrimaryAction != newMenuProps.hasPrimaryAction) {
     _menuProvider.hasPrimaryAction = newMenuProps.hasPrimaryAction;
   }

package/ios/Menu/TinyuiMenuViewSwift.swift

@@ -7,6 +7,7 @@ import UIKit
  */
 class TinyuiMenuProps: ObservableObject {
   @Published var menuConfig: String = "{}"
+  @Published var title: String = ""
   @Published var disabled: Bool = false
   @Published var hasPrimaryAction: Bool = false
   @Published var triggerView: UIView?
@@ -55,6 +56,19 @@ struct TinyuiMenuSwiftUIView: View {
 
   @ViewBuilder
   private var menuContent: some View {
+    if props.title.isEmpty {
+      elementsContent
+    } else {
+      Section {
+        elementsContent
+      } header: {
+        Text(props.title)
+      }
+    }
+  }
+
+  @ViewBuilder
+  private var elementsContent: some View {
     ForEach(buildElements(from: props.menuConfig)) { element in
       element.buildView(delegate: delegate)
     }
@@ -98,11 +112,32 @@ struct TinyuiMenuElement: Identifiable {
     case "action":
       let destructive = inheritedDestructive || (dictionary["destructive"] as? Bool ?? false)
       let keepOpen = dictionary["keepOpen"] as? Bool ?? false
+      let id = dictionary["id"] as? String ?? ""
+      let state = dictionary["state"] as? String ?? "off"
+
+      // `on`/`off` use SwiftUI's native `Toggle` support inside `Menu`,
+      // which renders the system checkmark. `mixed` has no native SwiftUI
+      // equivalent, so it falls back to the minus indicator.
+      if state == "on" || state == "off" {
+        let isOn = Binding<Bool>(
+          get: { state == "on" },
+          set: { _ in delegate?.onItemPress(id: id) }
+        )
+        return AnyView(
+          Toggle(isOn: isOn) {
+            TinyuiMenuLabel(
+              dictionary: dictionary,
+              destructive: destructive,
+              showsState: false
+            )
+          }
+          .disabled(dictionary["disabled"] as? Bool ?? false)
+        )
+      }
+
       return AnyView(
         Button(role: destructive ? .destructive : nil) {
-          if let id = dictionary["id"] as? String {
-            delegate?.onItemPress(id: id)
-          }
+          delegate?.onItemPress(id: id)
         } label: {
           TinyuiMenuLabel(
             dictionary: dictionary,
@@ -192,42 +227,47 @@ private struct TinyuiMenuLabel: View {
   let showsState: Bool
 
   var body: some View {
-    HStack {
+    // SwiftUI only extracts a proper title from a menu Button's label when
+    // the label is a single `Text` (optionally with an icon). Rendering the
+    // title through a computed @ViewBuilder property or wrapping it in
+    // nested containers breaks that extraction, so the title must be a
+    // direct `Text` in the label hierarchy.
+    HStack(spacing: 6) {
       menuIcon
-
-      VStack(alignment: .leading, spacing: 1) {
-        title
-
-        if let subtitle = dictionary["subtitle"] as? String,
-           !subtitle.isEmpty {
-          Text(subtitle)
-            .font(.caption)
-            .foregroundStyle(.secondary)
-        }
-      }
-
+      title
       if showsState {
-        switch dictionary["state"] as? String {
-        case "on":
-          Image(systemName: "checkmark")
-        case "mixed":
-          Image(systemName: "minus")
-        default:
-          EmptyView()
-        }
+        stateIndicator
       }
     }
   }
 
-  @ViewBuilder
-  private var title: some View {
-    let text = Text(dictionary["title"] as? String ?? "")
-    if let color = TinyuiMenuColor.uiColor(from: dictionary["titleColor"]) {
-      text.foregroundStyle(Color(uiColor: color))
-    } else if destructive {
-      text.foregroundStyle(Color.red)
+  private var stateIndicator: some View {
+    // Only `mixed` reaches here; `on`/`off` are handled natively by `Toggle`.
+    // UIKit's menu system renders "mixed" state with a minus/dash mark.
+    if dictionary["state"] as? String == "mixed" {
+      return AnyView(
+        Image(systemName: "minus")
+          .font(.system(size: 13, weight: .semibold))
+      )
+    }
+    return AnyView(EmptyView())
+  }
+
+  private var title: Text {
+    let title = dictionary["title"] as? String ?? ""
+    let subtitle = (dictionary["subtitle"] as? String).flatMap {
+      $0.isEmpty ? nil : $0
+    }
+    let text = subtitle.map { subtitle in
+      Text("\(title)\n\(subtitle)")
+    } ?? Text(title)
+
+    if destructive {
+      return text.foregroundColor(.red)
+    } else if let color = TinyuiMenuColor.uiColor(from: dictionary["titleColor"]) {
+      return text.foregroundColor(Color(uiColor: color))
     } else {
-      text
+      return text
     }
   }
 

package/lib/module/Menu.js

@@ -12,6 +12,7 @@ const MenuRoot = /*#__PURE__*/forwardRef(function Menu({
   disabled,
   onPrimaryAction,
   options,
+  title,
   testID,
   ...viewProps
 }, ref) {
@@ -32,6 +33,7 @@ const MenuRoot = /*#__PURE__*/forwardRef(function Menu({
       onItemPress: event => callbacks.get(event.nativeEvent.id)?.(),
       onPrimaryAction: onPrimaryAction,
       testID: testID,
+      title: title,
       children: /*#__PURE__*/_jsx(View, {
         collapsable: false,
         children: children

package/lib/module/Menu.js.map

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","View","assertComponentEnabled","NativeMenuView","serializeMenuOptions","jsx","_jsx","MenuRoot","Menu","accessibilityLabel","children","disabled","onPrimaryAction","options","testID","viewProps","ref","config","callbacks","collapsable","hasPrimaryAction","menuConfig","onItemPress","event","get","nativeEvent","id"],"sourceRoot":"../../src","sources":["Menu.tsx"],"mappings":";;AAAA,SAASA,UAAU,QAA2B,OAAO;AACrD,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,sBAAsB,QAAQ,sBAAmB;AAE1D,OAAOC,cAAc,MAAM,uBAAuB;AAClD,SAASC,oBAAoB,QAAQ,kBAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAErD,MAAMC,QAAQ,gBAAGP,UAAU,CAAuC,SAASQ,IAAIA,CAC7E;EACEC,kBAAkB;EAClBC,QAAQ;EACRC,QAAQ;EACRC,eAAe;EACfC,OAAO;EACPC,MAAM;EACN,GAAGC;AACL,CAAC,EACDC,GAAG,EACH;EACAd,sBAAsB,CAAC,MAAM,CAAC;EAE9B,MAAM;IAAEe,MAAM;IAAEC;EAAU,CAAC,GAAGd,oBAAoB,CAACS,OAAO,CAAC;EAE3D,oBACEP,IAAA,CAACL,IAAI;IAAA,GAAKc,SAAS;IAAEC,GAAG,EAAEA,GAAI;IAACG,WAAW,EAAE,KAAM;IAAAT,QAAA,eAChDJ,IAAA,CAACH,cAAc;MACbM,kBAAkB,EAAEA,kBAAmB;MACvCE,QAAQ,EAAEA,QAAS;MACnBS,gBAAgB,EAAER,eAAe,IAAI,IAAK;MAC1CS,UAAU,EAAEJ,MAAO;MACnBK,WAAW,EAAGC,KAAK,IAAKL,SAAS,CAACM,GAAG,CAACD,KAAK,CAACE,WAAW,CAACC,EAAE,CAAC,GAAG,CAAE;MAChEd,eAAe,EAAEA,eAAgB;MACjCE,MAAM,EAAEA,MAAO;MAAAJ,QAAA,eAEfJ,IAAA,CAACL,IAAI;QAACkB,WAAW,EAAE,KAAM;QAAAT,QAAA,EAAEA;MAAQ,CAAO;IAAC,CAC7B;EAAC,CACb,CAAC;AAEX,CAAC,CAAC;AAEF,OAAO,MAAMF,IAAI,GAAGD,QAAyB","ignoreList":[]}
+{"version":3,"names":["forwardRef","View","assertComponentEnabled","NativeMenuView","serializeMenuOptions","jsx","_jsx","MenuRoot","Menu","accessibilityLabel","children","disabled","onPrimaryAction","options","title","testID","viewProps","ref","config","callbacks","collapsable","hasPrimaryAction","menuConfig","onItemPress","event","get","nativeEvent","id"],"sourceRoot":"../../src","sources":["Menu.tsx"],"mappings":";;AAAA,SAASA,UAAU,QAA2B,OAAO;AACrD,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,sBAAsB,QAAQ,sBAAmB;AAE1D,OAAOC,cAAc,MAAM,uBAAuB;AAClD,SAASC,oBAAoB,QAAQ,kBAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAErD,MAAMC,QAAQ,gBAAGP,UAAU,CAAuC,SAASQ,IAAIA,CAC7E;EACEC,kBAAkB;EAClBC,QAAQ;EACRC,QAAQ;EACRC,eAAe;EACfC,OAAO;EACPC,KAAK;EACLC,MAAM;EACN,GAAGC;AACL,CAAC,EACDC,GAAG,EACH;EACAf,sBAAsB,CAAC,MAAM,CAAC;EAE9B,MAAM;IAAEgB,MAAM;IAAEC;EAAU,CAAC,GAAGf,oBAAoB,CAACS,OAAO,CAAC;EAE3D,oBACEP,IAAA,CAACL,IAAI;IAAA,GAAKe,SAAS;IAAEC,GAAG,EAAEA,GAAI;IAACG,WAAW,EAAE,KAAM;IAAAV,QAAA,eAChDJ,IAAA,CAACH,cAAc;MACbM,kBAAkB,EAAEA,kBAAmB;MACvCE,QAAQ,EAAEA,QAAS;MACnBU,gBAAgB,EAAET,eAAe,IAAI,IAAK;MAC1CU,UAAU,EAAEJ,MAAO;MACnBK,WAAW,EAAGC,KAAK,IAAKL,SAAS,CAACM,GAAG,CAACD,KAAK,CAACE,WAAW,CAACC,EAAE,CAAC,GAAG,CAAE;MAChEf,eAAe,EAAEA,eAAgB;MACjCG,MAAM,EAAEA,MAAO;MACfD,KAAK,EAAEA,KAAM;MAAAJ,QAAA,eAEbJ,IAAA,CAACL,IAAI;QAACmB,WAAW,EAAE,KAAM;QAAAV,QAAA,EAAEA;MAAQ,CAAO;IAAC,CAC7B;EAAC,CACb,CAAC;AAEX,CAAC,CAAC;AAEF,OAAO,MAAMF,IAAI,GAAGD,QAAyB","ignoreList":[]}

package/lib/module/MenuNativeComponent.ts

@@ -3,6 +3,7 @@ import type { DirectEventHandler } from 'react-native/Libraries/Types/CodegenTyp
 
 export interface NativeMenuProps extends ViewProps {
   menuConfig: string;
+  title?: string;
   disabled?: boolean;
   hasPrimaryAction?: boolean;
   onItemPress?: DirectEventHandler<Readonly<{ id: string }>>;

package/lib/typescript/src/Menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../src/Menu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAa,MAAM,iBAAc,CAAC;AAqC7D,eAAO,MAAM,IAAI,EAAe,aAAa,CAAC;AAE9C,YAAY,EACV,gBAAgB,EAChB,iBAAiB,EACjB,aAAa,EACb,UAAU,EACV,SAAS,EACT,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,iBAAc,CAAC"}
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../src/Menu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAa,MAAM,iBAAc,CAAC;AAuC7D,eAAO,MAAM,IAAI,EAAe,aAAa,CAAC;AAE9C,YAAY,EACV,gBAAgB,EAChB,iBAAiB,EACjB,aAAa,EACb,UAAU,EACV,SAAS,EACT,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,iBAAc,CAAC"}

package/lib/typescript/src/Menu.types.d.ts

@@ -50,6 +50,8 @@ export type MenuOption = MenuActionOption | MenuSubmenuOption | MenuSectionOptio
 export interface MenuProps extends Omit<ViewProps, 'children'> {
     /** The trigger element. */
     children: ReactNode;
+    /** Optional title displayed at the top of the native menu. */
+    title?: string;
     /** Native menu actions, submenus, sections, and dividers. */
     options: readonly MenuOption[];
     /** Prevents the trigger from opening the menu. */

package/lib/typescript/src/Menu.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../../src/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,YAAY,EACZ,yBAAyB,EACzB,SAAS,EACT,aAAa,EACd,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEhE,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,IAAI,GAAG,OAAO,CAAC;AAEnD,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sBAAsB;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,oDAAoD;IACpD,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD,mEAAmE;IACnE,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,gEAAgE;IAChE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,IAAI,EAAE,SAAS,CAAC;IAChB,yDAAyD;IACzD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,qEAAqE;IACrE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;CAChC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;CAChC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,MAAM,UAAU,GACpB,gBAAgB,GAAG,iBAAiB,GAAG,iBAAiB,GAAG,iBAAiB,CAAC;AAE/E,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC5D,2BAA2B;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,6DAA6D;IAC7D,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,kDAAkD;IAClD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,MAAM,WAAW,aAAc,SAAQ,yBAAyB,CAC9D,SAAS,GAAG,aAAa,CAAC,YAAY,CAAC,OAAO,IAAI,CAAC,CAAC,CACrD;CAAG"}
+{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../../src/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,YAAY,EACZ,yBAAyB,EACzB,SAAS,EACT,aAAa,EACd,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEhE,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,IAAI,GAAG,OAAO,CAAC;AAEnD,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sBAAsB;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,oDAAoD;IACpD,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD,mEAAmE;IACnE,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,gEAAgE;IAChE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,IAAI,EAAE,SAAS,CAAC;IAChB,yDAAyD;IACzD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,qEAAqE;IACrE,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;CAChC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;CAChC;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,MAAM,UAAU,GACpB,gBAAgB,GAAG,iBAAiB,GAAG,iBAAiB,GAAG,iBAAiB,CAAC;AAE/E,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC5D,2BAA2B;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6DAA6D;IAC7D,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,kDAAkD;IAClD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,MAAM,WAAW,aAAc,SAAQ,yBAAyB,CAC9D,SAAS,GAAG,aAAa,CAAC,YAAY,CAAC,OAAO,IAAI,CAAC,CAAC,CACrD;CAAG"}

package/lib/typescript/src/MenuNativeComponent.d.ts

@@ -2,6 +2,7 @@ import { type ViewProps } from 'react-native';
 import type { DirectEventHandler } from 'react-native/Libraries/Types/CodegenTypes';
 export interface NativeMenuProps extends ViewProps {
     menuConfig: string;
+    title?: string;
     disabled?: boolean;
     hasPrimaryAction?: boolean;
     onItemPress?: DirectEventHandler<Readonly<{

package/lib/typescript/src/MenuNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/MenuNativeComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAA0B,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACtE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAC;AAEpF,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IAC3D,eAAe,CAAC,EAAE,kBAAkB,CAAC,IAAI,CAAC,CAAC;CAC5C;;AAED,wBAEG"}
+{"version":3,"file":"MenuNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/MenuNativeComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAA0B,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACtE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2CAA2C,CAAC;AAEpF,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAAC;IAC3D,eAAe,CAAC,EAAE,kBAAkB,CAAC,IAAI,CAAC,CAAC;CAC5C;;AAED,wBAEG"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-tinyui",
-  "version": "0.1.1",
+  "version": "0.3.0",
   "description": "Dependency-free native iOS Menu and Popover components for React Native",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/Menu.tsx

@@ -13,6 +13,7 @@ const MenuRoot = forwardRef<ComponentRef<typeof View>, MenuProps>(function Menu(
     disabled,
     onPrimaryAction,
     options,
+    title,
     testID,
     ...viewProps
   },
@@ -32,6 +33,7 @@ const MenuRoot = forwardRef<ComponentRef<typeof View>, MenuProps>(function Menu(
         onItemPress={(event) => callbacks.get(event.nativeEvent.id)?.()}
         onPrimaryAction={onPrimaryAction}
         testID={testID}
+        title={title}
       >
         <View collapsable={false}>{children}</View>
       </NativeMenuView>

package/src/Menu.types.ts

@@ -64,6 +64,8 @@ export type MenuOption =
 export interface MenuProps extends Omit<ViewProps, 'children'> {
   /** The trigger element. */
   children: ReactNode;
+  /** Optional title displayed at the top of the native menu. */
+  title?: string;
   /** Native menu actions, submenus, sections, and dividers. */
   options: readonly MenuOption[];
   /** Prevents the trigger from opening the menu. */

package/src/MenuNativeComponent.ts

@@ -3,6 +3,7 @@ import type { DirectEventHandler } from 'react-native/Libraries/Types/CodegenTyp
 
 export interface NativeMenuProps extends ViewProps {
   menuConfig: string;
+  title?: string;
   disabled?: boolean;
   hasPrimaryAction?: boolean;
   onItemPress?: DirectEventHandler<Readonly<{ id: string }>>;