@multiplatform.one/forms 7.7.6 → 7.10.0

package/dist/cjs/fields/Checkbox/CheckboxFieldFrame.cjs

@@ -26,7 +26,9 @@ __export(CheckboxFieldFrame_exports, {
 });
 module.exports = __toCommonJS(CheckboxFieldFrame_exports);
 var import_tamagui = require("tamagui");
-const CheckboxFieldFrame = (0, import_tamagui.styled)(import_tamagui.Checkbox, {
+var import_fieldLayout = require("../../fieldLayout.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+const CheckboxFieldFrameBase = (0, import_tamagui.styled)(import_tamagui.Checkbox, {
   backgroundColor: "transparent",
   borderColor: "transparent",
   borderWidth: 0,
@@ -54,4 +56,9 @@ const CheckboxFieldFrame = (0, import_tamagui.styled)(import_tamagui.Checkbox, {
     backgroundColor: "transparent",
     borderColor: "transparent"
   }
-});
+});
+const CheckboxFieldFrame = CheckboxFieldFrameBase.styleable((props, ref) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(CheckboxFieldFrameBase, {
+  "aria-describedby": (0, import_fieldLayout.useFieldDescribedBy)(),
+  ...props,
+  ref
+}));

package/dist/cjs/fields/Checkbox/CheckboxFieldFrame.native.js

@@ -27,8 +27,10 @@ __export(CheckboxFieldFrame_exports, {
   CheckboxFieldFrame: () => CheckboxFieldFrame
 });
 module.exports = __toCommonJS(CheckboxFieldFrame_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_tamagui = require("tamagui");
-var CheckboxFieldFrame = (0, import_tamagui.styled)(import_tamagui.Checkbox, {
+var import_fieldLayout = require("../../fieldLayout.native.js");
+var CheckboxFieldFrameBase = (0, import_tamagui.styled)(import_tamagui.Checkbox, {
   backgroundColor: "transparent",
   borderColor: "transparent",
   borderWidth: 0,
@@ -57,4 +59,11 @@ var CheckboxFieldFrame = (0, import_tamagui.styled)(import_tamagui.Checkbox, {
     borderColor: "transparent"
   }
 });
+var CheckboxFieldFrame = CheckboxFieldFrameBase.styleable(function (props, ref) {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(CheckboxFieldFrameBase, {
+    "aria-describedby": (0, import_fieldLayout.useFieldDescribedBy)(),
+    ...props,
+    ref
+  });
+});
 //# sourceMappingURL=CheckboxFieldFrame.native.js.map

package/dist/cjs/fields/Checkbox/CheckboxFieldFrame.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","CheckboxFieldFrame_exports","__export","CheckboxFieldFrame","module","exports","import_tamagui","require","styled","Checkbox","backgroundColor","borderColor","borderWidth","borderRadius","outlineWidth","hoverStyle","pressStyle","focusStyle"],"sources":["../../../../src/fields/Checkbox/CheckboxFieldFrame.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,0BAAA;AAAAC,QAAA,CAAAD,0BAAA;EAAAE,kBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAAoD,CAAAK,0BAAA;AAG7C,IAAAK,cAAM,GAAAC,OAAA,UAAqB;AAAwB,IACxDJ,kBAAiB,OAAAG,cAAA,CAAAE,MAAA,EAAAF,cAAA,CAAAG,QAAA;EACjBC,eAAa;EACbC,WAAA,EAAa;EACbC,WAAA,GAAc;EACdC,YAAA,EAAc;EACdC,YAAY,EAAE;EACdC,UAAA,EAAY;IACZL,eAAY;IACVC,WAAA;EAAiB;EACJK,UACb;IACFN,eAAA;IACAC,WAAA;EAAmB;EACAM,UACjB;IACAP,eAAc;IAChBC,WAAA;IACAG,YAAa,EAAE;EAChB","ignoreList":[]}
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","CheckboxFieldFrame_exports","__export","CheckboxFieldFrame","module","exports","import_jsx_runtime","require","import_tamagui","import_fieldLayout","CheckboxFieldFrameBase","styled","Checkbox","backgroundColor","borderColor","borderWidth","borderRadius","outlineWidth","hoverStyle","pressStyle","focusStyle","focusVisibleStyle"],"sources":["../../../../src/fields/Checkbox/CheckboxFieldFrame.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,0BAAA;AAAAC,QAAA,CAAAD,0BAAA;EAAAE,kBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAAoD,CAAAK,0BAAA;AACpD,IAAAK,kBAAA,GAAoCC,OAAA;AAyBlC,IAAAC,cAAA,GAAAD,OAAA;AAtBF,IAAAE,kBAAM,GAAAF,OAAA,8BAAyB;AAAwB,IACrDG,sBAAiB,OAAAF,cAAA,CAAAG,MAAA,EAAAH,cAAA,CAAAI,QAAA;EACjBC,eAAa;EACbC,WAAA,EAAa;EACbC,WAAA,GAAc;EACdC,YAAA,EAAc;EACdC,YAAY,EAAE;EACdC,UAAA,EAAY;IACZL,eAAY;IACVC,WAAA;EAAiB;EACJK,UACb;IACFN,eAAA;IACAC,WAAA;EAAmB;EACAM,UACjB;IACAP,eAAc;IAChBC,WAAA;IACAG,YAAa,EAAE;EAChB;EAEMI,iBAAM","ignoreList":[]}

package/dist/cjs/fields/Combobox/index.cjs

@@ -274,6 +274,7 @@ function FloatingComboboxCore({
   tabIndexOverride,
   popoverWidth,
   trigger: triggerRender,
+  triggerSizing = "stretch",
   knobProps,
   multiple,
   selectedOrder,
@@ -968,7 +969,7 @@ function FloatingComboboxCore({
   (0, import_jsx_runtime.jsx)(import_tamagui.View, {
     ...boxEventProps,
     "data-testid": "combobox-trigger",
-    width: "100%",
+    width: triggerSizing === "content" ? "auto" : "100%",
     alignSelf: "stretch",
     flexShrink: 0,
     outlineWidth: 0,
@@ -978,7 +979,7 @@ function FloatingComboboxCore({
     style: {
       display: "flex",
       alignItems: "stretch",
-      width: "100%"
+      width: triggerSizing === "content" ? "auto" : "100%"
     },
     children: triggerRender(multiple ? selectedOptions : selectedOption, open)
   }) : /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_InputParts.Input.Box, {
@@ -1332,6 +1333,7 @@ function NativeComboboxCore({
   "aria-label": ariaLabel,
   hasLabel,
   trigger: triggerRender,
+  triggerSizing = "stretch",
   knobProps,
   multiple,
   selectedOrder,
@@ -1769,9 +1771,34 @@ function NativeComboboxCore({
       })
     })]
   });
+  const triggerProps = {
+    id,
+    ...(import_tamagui.isWeb ? {
+      role: "combobox",
+      "aria-haspopup": "listbox",
+      "aria-expanded": open,
+      "aria-controls": listboxId,
+      "aria-activedescendant": hideSearch ? activeDescendant : void 0,
+      "aria-autocomplete": hideSearch ? "list" : void 0,
+      "aria-label": ariaLabel ?? (!hasLabel ? placeholder : void 0),
+      "aria-describedby": describedBy,
+      tabIndex: disabled ? -1 : 0
+    } : {
+      importantForAccessibility: "no"
+    }),
+    onPress: import_tamagui.isWeb && !disabled ? () => handleOpenChange(true) : void 0,
+    onKeyDown: event => {
+      if (disabled) return;
+      if (["Enter", " ", "ArrowDown", "ArrowUp", "j", "k"].includes(event.key) || event.code === "Space") {
+        event.preventDefault();
+        setKeyboardNav(true);
+        if (!open) handleOpenChange(true);
+      }
+    }
+  };
   const triggerContent = triggerRender ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
     "data-testid": "combobox-trigger",
-    width: "100%",
+    width: triggerSizing === "content" ? "auto" : "100%",
     alignSelf: "stretch",
     flexShrink: 0,
     outlineWidth: 0,
@@ -1781,8 +1808,9 @@ function NativeComboboxCore({
     style: {
       display: "flex",
       alignItems: "stretch",
-      width: "100%"
+      width: triggerSizing === "content" ? "auto" : "100%"
     },
+    ...triggerProps,
     children: triggerRender(multiple ? selectedOptions : selectedOption, open)
   }) : /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_InputParts.Input.Box, {
     "data-testid": "combobox-trigger",
@@ -1797,31 +1825,7 @@ function NativeComboboxCore({
       borderRadius: knobProps.borderRadius.borderRadius,
       borderWidth: knobProps.borderRadius.borderWidth
     }),
-    id,
-    ...(import_tamagui.isWeb ? {
-      role: "combobox",
-      "aria-haspopup": "listbox",
-      "aria-expanded": open,
-      "aria-controls": listboxId,
-      "aria-activedescendant": hideSearch ? activeDescendant : void 0,
-      "aria-autocomplete": hideSearch ? "list" : void 0,
-      // Standalone (no label): fall back to placeholder for the name.
-      // Labelled: the sibling Label wires `aria-labelledby` onto this id
-      // itself — naming it here too doubles the spoken name.
-      "aria-label": ariaLabel ?? (!hasLabel ? placeholder : void 0),
-      "aria-describedby": describedBy,
-      tabIndex: disabled ? -1 : 0
-    } : {
-      importantForAccessibility: "no"
-    }),
-    onPress: import_tamagui.isWeb && !disabled ? () => handleOpenChange(true) : void 0,
-    onKeyDown: e => {
-      if (["Enter", " ", "ArrowDown", "ArrowUp", "j", "k"].includes(e.key) || e.code === "Space") {
-        e.preventDefault();
-        setKeyboardNav(true);
-        if (!open) handleOpenChange(true);
-      }
-    },
+    ...triggerProps,
     children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
       flex: 1,
       paddingHorizontal: "$3",
@@ -1870,6 +1874,7 @@ function NativeComboboxCore({
     sheet: true,
     sheetFill: Boolean(onSearch),
     trigger: triggerContent,
+    triggerSizing,
     triggerEnd: clearable && !multiple && !disabled && typeof value === "string" && value !== "" ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
       size: knobProps.sizeToken,
       chromeless: true,
@@ -1925,6 +1930,7 @@ function Combobox({
   onLoadMore,
   hasMore,
   trigger,
+  triggerSizing,
   name,
   form: formProp,
   validators,
@@ -2048,6 +2054,7 @@ function Combobox({
       tabIndexOverride: tabIndexProp,
       popoverWidth,
       trigger,
+      triggerSizing,
       knobProps,
       multiple,
       selectedOrder,

package/dist/cjs/fields/Combobox/index.native.js

@@ -367,6 +367,7 @@ function FloatingComboboxCore(param) {
     tabIndexOverride,
     popoverWidth,
     trigger: triggerRender,
+    triggerSizing = "stretch",
     knobProps,
     multiple,
     selectedOrder,
@@ -1152,7 +1153,7 @@ function FloatingComboboxCore(param) {
   (0, import_jsx_runtime.jsx)(import_tamagui.View, {
     ...boxEventProps,
     "data-testid": "combobox-trigger",
-    width: "100%",
+    width: triggerSizing === "content" ? "auto" : "100%",
     alignSelf: "stretch",
     flexShrink: 0,
     outlineWidth: 0,
@@ -1162,7 +1163,7 @@ function FloatingComboboxCore(param) {
     style: {
       display: "flex",
       alignItems: "stretch",
-      width: "100%"
+      width: triggerSizing === "content" ? "auto" : "100%"
     },
     children: triggerRender(multiple ? selectedOptions : selectedOption, open)
   }) : /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_InputParts.Input.Box, {
@@ -1544,6 +1545,7 @@ function NativeComboboxCore(param) {
     "aria-label": ariaLabel,
     hasLabel,
     trigger: triggerRender,
+    triggerSizing = "stretch",
     knobProps,
     multiple,
     selectedOrder,
@@ -2046,9 +2048,36 @@ function NativeComboboxCore(param) {
       })
     })]
   });
+  var triggerProps = {
+    id,
+    ...(import_tamagui.isWeb ? {
+      role: "combobox",
+      "aria-haspopup": "listbox",
+      "aria-expanded": open,
+      "aria-controls": listboxId,
+      "aria-activedescendant": hideSearch ? activeDescendant : void 0,
+      "aria-autocomplete": hideSearch ? "list" : void 0,
+      "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : !hasLabel ? placeholder : void 0,
+      "aria-describedby": describedBy,
+      tabIndex: disabled ? -1 : 0
+    } : {
+      importantForAccessibility: "no"
+    }),
+    onPress: import_tamagui.isWeb && !disabled ? function () {
+      return handleOpenChange(true);
+    } : void 0,
+    onKeyDown: function onKeyDown(event) {
+      if (disabled) return;
+      if (["Enter", " ", "ArrowDown", "ArrowUp", "j", "k"].includes(event.key) || event.code === "Space") {
+        event.preventDefault();
+        setKeyboardNav(true);
+        if (!open) handleOpenChange(true);
+      }
+    }
+  };
   var triggerContent = triggerRender ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
     "data-testid": "combobox-trigger",
-    width: "100%",
+    width: triggerSizing === "content" ? "auto" : "100%",
     alignSelf: "stretch",
     flexShrink: 0,
     outlineWidth: 0,
@@ -2058,8 +2087,9 @@ function NativeComboboxCore(param) {
     style: {
       display: "flex",
       alignItems: "stretch",
-      width: "100%"
+      width: triggerSizing === "content" ? "auto" : "100%"
     },
+    ...triggerProps,
     children: triggerRender(multiple ? selectedOptions : selectedOption, open)
   }) : /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_InputParts.Input.Box, {
     "data-testid": "combobox-trigger",
@@ -2080,40 +2110,7 @@ function NativeComboboxCore(param) {
       borderRadius: knobProps.borderRadius.borderRadius,
       borderWidth: knobProps.borderRadius.borderWidth
     }),
-    id,
-    // Web: the box is the combobox control (ARIA + keyboard). Native:
-    // FloatingPanel's trigger Pressable (triggerA11y) is the single
-    // accessible node — role/aria props here surface the box as a
-    // duplicate TalkBack stop on Android, so exclude it from the tree
-    // (descendants stay reachable; "no", not "no-hide-descendants").
-    ...(import_tamagui.isWeb ? {
-      role: "combobox",
-      "aria-haspopup": "listbox",
-      "aria-expanded": open,
-      "aria-controls": listboxId,
-      "aria-activedescendant": hideSearch ? activeDescendant : void 0,
-      "aria-autocomplete": hideSearch ? "list" : void 0,
-      // Standalone (no label): fall back to placeholder for the name.
-      // Labelled: the sibling Label wires `aria-labelledby` onto this id
-      // itself — naming it here too doubles the spoken name.
-      "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : !hasLabel ? placeholder : void 0,
-      "aria-describedby": describedBy,
-      tabIndex: disabled ? -1 : 0
-    } : {
-      importantForAccessibility: "no"
-    }),
-    // Sheet capture opens first on web, so this opener is idempotent.
-    // Native delegates the gesture to FloatingPanel.
-    onPress: import_tamagui.isWeb && !disabled ? function () {
-      return handleOpenChange(true);
-    } : void 0,
-    onKeyDown: function onKeyDown(e) {
-      if (["Enter", " ", "ArrowDown", "ArrowUp", "j", "k"].includes(e.key) || e.code === "Space") {
-        e.preventDefault();
-        setKeyboardNav(true);
-        if (!open) handleOpenChange(true);
-      }
-    },
+    ...triggerProps,
     children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
       flex: 1,
       paddingHorizontal: "$3",
@@ -2169,6 +2166,7 @@ function NativeComboboxCore(param) {
     // the user types, so a content-fit sheet would open as a sliver.
     sheetFill: Boolean(onSearch),
     trigger: triggerContent,
+    triggerSizing,
     triggerEnd: clearable && !multiple && !disabled && typeof value === "string" && value !== "" ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
       size: knobProps.sizeToken,
       chromeless: true,
@@ -2227,6 +2225,7 @@ function Combobox(param) {
     onLoadMore,
     hasMore,
     trigger,
+    triggerSizing,
     name,
     form: formProp,
     validators,
@@ -2359,6 +2358,7 @@ function Combobox(param) {
       tabIndexOverride: tabIndexProp,
       popoverWidth,
       trigger,
+      triggerSizing,
       knobProps,
       multiple,
       selectedOrder,