@wix/form-public 0.523.0 → 0.525.0

package/dist/index.cjs

@@ -54093,6 +54093,7 @@ var NonModalPopover = /* @__PURE__ */ React173.forwardRef((props2, forwardedRef)
     shouldCloseOnInteractOutside: isOutsideTrigger
   }));
 });
+var EMPTY_SELECT_PLACEHOLDER = "\u200B";
 var SelectTriggerButton = /* @__PURE__ */ React173.forwardRef((props2, ref) => {
   const overlayState = React173.useContext(reactAriaComponents.OverlayTriggerStateContext);
   const handlePressStart = (event) => {
@@ -54155,17 +54156,16 @@ var hasDropdown = (field, isMobile2) => {
   }
   return DROPDOWN_FIELD_TYPES.includes(field.fieldType);
 };
-var isOpenableDropdown = (field, isMobile2) => hasDropdown(field, isMobile2) && !field.properties.hidden && !field.properties.disabled && !field.properties.readOnly;
-var byLayoutPosition = (first2, second) => first2.layout.row - second.layout.row || first2.layout.column - second.layout.column;
+var isOpenableDropdown = (field, isMobile2) => hasDropdown(field, isMobile2) && !field.properties.disabled && !field.properties.readOnly;
 var useIsForcedOpenDropdown = (fieldId) => {
   const isOpenState = useElementProps().dropdown?.open === true;
   const formView = React173.useContext(FormViewContext);
   const { isMobile: isMobile2 = false } = useConfig();
-  const firstDropdownId = React173.useMemo(() => formView && !formView.parentId ? formView.fields.filter((field) => isOpenableDropdown(field, isMobile2)).sort(byLayoutPosition)[0]?.id : void 0, [
+  const openableDropdownIds = React173.useMemo(() => formView && !formView.parentId ? formView.fields.filter((field) => isOpenableDropdown(field, isMobile2)).map((field) => field.id) : [], [
     formView,
     isMobile2
   ]);
-  return isOpenState && firstDropdownId === fieldId;
+  return isOpenState && openableDropdownIds.includes(fieldId);
 };
 var UNLIMITED_ROWS = Infinity;
 var MAX_HEIGHT_PROBE_STYLE = {
@@ -54331,7 +54331,7 @@ var Month = ({ children, className }) => {
   const [isOpen, setIsOpen] = React173.useState(false);
   const isForcedOpen = useIsForcedOpenDropdown(id6);
   const [container, setContainer] = React173.useState(null);
-  const placeholder = hidePlaceholder ? void 0 : t("field.date.placeholder.month");
+  const placeholder = hidePlaceholder ? EMPTY_SELECT_PLACEHOLDER : t("field.date.placeholder.month");
   const handleMonthChange = React173.useCallback((selectedValue) => {
     if (readOnly) {
       return;
@@ -54697,7 +54697,8 @@ var Input2 = ({ className }) => {
     regionalFormat
   ]);
   return /* @__PURE__ */ React173__default.default.createElement(reactAriaComponents.DateInput, {
-    className
+    className,
+    "data-placeholder-hidden": !placeholder || void 0
   }, (segment) => {
     const showCustomPlaceholder = segment.type === firstSegmentType && segment.isPlaceholder && Boolean(placeholder);
     return /* @__PURE__ */ React173__default.default.createElement(reactAriaComponents.DateSegment, {
@@ -54931,7 +54932,7 @@ var Month2 = ({ children, className }) => {
   const [isOpen, setIsOpen] = React173.useState(false);
   const isForcedOpen = useIsForcedOpenDropdown(id6);
   const [container, setContainer] = React173.useState(null);
-  const placeholder = hidePlaceholder ? void 0 : t("field.date.placeholder.month");
+  const placeholder = hidePlaceholder ? EMPTY_SELECT_PLACEHOLDER : t("field.date.placeholder.month");
   const handleMonthChange = React173.useCallback((selectedValue) => {
     if (readOnly) {
       return;
@@ -55155,12 +55156,14 @@ var TimeLabel = ({ className }) => {
   }, label);
 };
 var TimeInput = ({ children, className }) => {
+  const { hidePlaceholder } = useFieldPropsV2();
   const hourElement = findChildOfType(children, Time.Hour);
   const minuteElement = findChildOfType(children, Time.Minute);
   const periodElement = findChildOfType(children, Time.Period);
   return /* @__PURE__ */ React173__default.default.createElement(reactAriaComponents.DateInput, {
     className,
-    "data-hook": "time"
+    "data-hook": "time",
+    "data-placeholder-hidden": hidePlaceholder || void 0
   }, (segment) => {
     switch (segment.type) {
       case "hour":
@@ -55790,7 +55793,7 @@ var Dropdown = ({ children }) => {
       isDisabled: disabled,
       isInvalid: hasError,
       isRequired: required,
-      placeholder,
+      placeholder: placeholder || EMPTY_SELECT_PLACEHOLDER,
       onBlur,
       onFocus
     }, triggerElement, applyInternalProps(optionsElement, {
@@ -61277,11 +61280,11 @@ var SignaturePad = class _SignaturePad extends SignatureEventTarget {
 var useId2 = typeof React173__default.default.useId === "function" ? React173__default.default.useId : () => React173.useRef(generateUUID()).current;
 var hasUploadTab = ({ properties }) => properties.uploadEnabled === true;
 var isForceableSignature = (field, mode) => field.fieldType === FIELD_TYPES.SIGNATURE && !field.properties.hidden && !field.properties.disabled && !field.properties.readOnly && (mode !== "upload" || hasUploadTab(field));
-var byLayoutPosition2 = (first2, second) => first2.layout.row - second.layout.row || first2.layout.column - second.layout.column;
+var byLayoutPosition = (first2, second) => first2.layout.row - second.layout.row || first2.layout.column - second.layout.column;
 var useForcedSignatureMode = (fieldId) => {
   const forcedMode = useElementProps().signatureContainer?.signatureMode;
   const formView = React173.useContext(FormViewContext);
-  const firstSignatureId = React173.useMemo(() => formView && !formView.parentId && forcedMode ? formView.fields.filter((field) => isForceableSignature(field, forcedMode)).sort(byLayoutPosition2)[0]?.id : void 0, [
+  const firstSignatureId = React173.useMemo(() => formView && !formView.parentId && forcedMode ? formView.fields.filter((field) => isForceableSignature(field, forcedMode)).sort(byLayoutPosition)[0]?.id : void 0, [
     formView,
     forcedMode
   ]);
@@ -62860,13 +62863,14 @@ var TimeInput2 = ({ children }) => {
   });
 };
 var Time2 = ({ children, className }) => {
-  const { hasError } = useFieldPropsV2();
+  const { hasError, hidePlaceholder } = useFieldPropsV2();
   const hourElement = findChildOfType(children, Time2.Hour);
   const minuteElement = findChildOfType(children, Time2.Minute);
   const periodElement = findChildOfType(children, Time2.Period);
   return /* @__PURE__ */ React173__default.default.createElement(reactAriaComponents.DateInput, {
     className,
-    "data-invalid": hasError || void 0
+    "data-invalid": hasError || void 0,
+    "data-placeholder-hidden": hidePlaceholder || void 0
   }, (segment) => {
     switch (segment.type) {
       case "hour":