"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Field = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _useTheme = require("../theme/use-theme.js");
var _index = require("../typography/index.js");
var _index2 = require("../label/index.js");
var _index3 = require("../styles/index.js");
var _tokens = require("../styles/tokens.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
/**
 * Standalone form-field wrapper: an optional `Label`, the control (passed as
 * `children`), and a description **or** error message below it. Composes
 * Bloom's `Label`. Unlike `TextField` — which bakes its label/error into the
 * input chrome — `Field` wraps any arbitrary control (a `Switch`, a
 * `SegmentedControl`, a custom picker, etc.).
 */
const FieldComponent = function Field({
  children,
  label,
  description,
  error,
  required = false,
  disabled = false,
  nativeID,
  style,
  testID
}) {
  const theme = (0, _useTheme.useTheme)();
  const hasError = typeof error === 'string' && error.length > 0;
  const descriptionID = nativeID ? `${nativeID}-description` : undefined;
  const errorID = nativeID ? `${nativeID}-error` : undefined;
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
    style: [_index3.atoms.w_full, style],
    testID: testID,
    children: [label != null ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.Label, {
      htmlFor: nativeID,
      required: required,
      disabled: disabled,
      children: label
    }) : null, children, hasError ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
      nativeID: errorID,
      accessibilityRole: "alert",
      style: [{
        fontSize: _tokens.fontSize.sm,
        color: theme.colors.negative,
        marginTop: _tokens.space.xs
      }],
      children: error
    }) : description != null ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
      nativeID: descriptionID,
      style: [{
        fontSize: _tokens.fontSize.sm,
        color: disabled ? theme.colors.textTertiary : theme.colors.textSecondary,
        marginTop: _tokens.space.xs
      }],
      children: description
    }) : null]
  });
};
const Field = exports.Field = /*#__PURE__*/(0, _react.memo)(FieldComponent);
Field.displayName = 'Field';
//# sourceMappingURL=Field.js.map