@easypost/easy-ui 1.0.0-alpha.112 → 1.0.0-alpha.114

package/SearchNav/index.js

@@ -31,21 +31,22 @@ var __objRest = (source, exclude) => {
   return target;
 };
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const utilities_css = require("../utilities/css.js");
 const utilities_react = require("../utilities/react.js");
-const Menu = require("../__chunks__/Menu-Kfc6nxFP.js");
-const Text = require("../__chunks__/Text-CSESKR_s.js");
-const Icon = require("../__chunks__/Icon-W8F9w-jS.js");
-const UnstyledButton = require("../__chunks__/UnstyledButton-BFpQ2Irc.js");
-const SelectOverlay = require("../__chunks__/SelectOverlay-CmbC4zrD.js");
+const Menu = require("../__chunks__/Menu-MGDv1tob.js");
+const Text = require("../__chunks__/Text-DkzMEqky.js");
+const Icon = require("../__chunks__/Icon-BRlbo3RF.js");
+const UnstyledButton = require("../__chunks__/UnstyledButton-DW8CjaXN.js");
+const SelectOverlay = require("../__chunks__/SelectOverlay-Bva0SG8D.js");
 const useTriggerWidth = require("../__chunks__/useTriggerWidth-NhYqZmlX.js");
 const ExpandMore400 = require("../__chunks__/ExpandMore400-CJpvxyJm.js");
 const Close = require("../__chunks__/Close-BQ2IlPyf.js");
 const Menu$1 = require("../__chunks__/Menu-OacI_98l.js");
 const Search$1 = require("../__chunks__/Search-BY7IgEyX.js");
-const HorizontalStack = require("../__chunks__/HorizontalStack-CXpjASZi.js");
-const Button = require("../__chunks__/Button-5AuHgwU3.js");
+const HorizontalStack = require("../__chunks__/HorizontalStack-CWdKKY8L.js");
+const Button = require("../__chunks__/Button-CQdi4TMV.js");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -81,7 +82,7 @@ const styles$7 = {
 };
 function Separator(props) {
   const { group } = props;
-  return React.createElement("div", {
+  return jsxRuntime.jsx("div", {
     className: utilities_css.classNames(styles$7.separator, styles$7[utilities_css.variationName("group", group)])
   });
 }
@@ -99,13 +100,18 @@ function useInternalSearchNavContext() {
 }
 function LogoGroup(_props) {
   const { logo: logo2, title, selector } = useInternalSearchNavContext();
-  return React.createElement("div", {
-    className: utilities_css.classNames(styles$6.logoGroup)
-  }, logo2, title && React.createElement(React.Fragment, null, React.createElement(Separator, {
-    group: "logo"
-  }), title), selector && React.createElement(React.Fragment, null, React.createElement(Separator, {
-    group: "logo"
-  }), selector));
+  return jsxRuntime.jsxs("div", {
+    className: utilities_css.classNames(styles$6.logoGroup),
+    children: [logo2, title && jsxRuntime.jsxs(jsxRuntime.Fragment, {
+      children: [jsxRuntime.jsx(Separator, {
+        group: "logo"
+      }), title]
+    }), selector && jsxRuntime.jsxs(jsxRuntime.Fragment, {
+      children: [jsxRuntime.jsx(Separator, {
+        group: "logo"
+      }), selector]
+    })]
+  });
 }
 LogoGroup.displayName = "SearchNav.LogoGroup";
 const search = "_search_nexql_4";
@@ -114,9 +120,10 @@ const styles$5 = {
 };
 function Search(props) {
   const { children } = props;
-  return React.createElement("div", {
-    className: utilities_css.classNames(styles$5.search)
-  }, children);
+  return jsxRuntime.jsx("div", {
+    className: utilities_css.classNames(styles$5.search),
+    children
+  });
 }
 Search.displayName = "SearchNav.Search";
 var __defProp2 = Object.defineProperty;
@@ -169,40 +176,57 @@ const styles$4 = {
 function CTAGroup(_props) {
   const { menuOverlayProps, ctaMenuSymbol, primaryCTAItem, secondaryCTAItems } = useInternalSearchNavContext();
   const totalItems = (secondaryCTAItems == null ? void 0 : secondaryCTAItems.length) || 0;
-  return React.createElement(React.Fragment, null, React.createElement("div", {
-    className: utilities_css.classNames(styles$4.ctaGroup, styles$4.ctaGroupExpanded)
-  }, secondaryCTAItems == null ? void 0 : secondaryCTAItems.map((item, index) => {
-    const isLastChild = index === totalItems - 1;
-    const itemEle = item;
-    return React.createElement(React.Fragment, {
-      key: itemEle.key
-    }, itemEle, !isLastChild && React.createElement(Separator, {
-      group: "cta"
-    }));
-  }), primaryCTAItem && React.createElement(React.Fragment, null, React.createElement(Separator, {
-    group: "cta"
-  }), primaryCTAItem)), React.createElement("div", {
-    className: utilities_css.classNames(styles$4.ctaGroup, styles$4.ctaGroupMenu)
-  }, React.createElement(Menu.Menu, null, React.createElement(Menu.Menu.Trigger, null, React.createElement(UnstyledButton.UnstyledButton, {
-    className: utilities_css.classNames(styles$4.menuBtn)
-  }, React.createElement(Icon.Icon, {
-    symbol: ctaMenuSymbol ? ctaMenuSymbol : Help
-  }), React.createElement(Text.Text, {
-    visuallyHidden: true
-  }, "menu"))), React.createElement(Menu.Menu.Overlay, __spreadValues({
-    placement: "bottom right"
-  }, menuOverlayProps), React.createElement(Menu.Menu.Section, {
-    "aria-label": "Nav actions"
-  }, secondaryCTAItems == null ? void 0 : secondaryCTAItems.map((item) => {
-    const itemEle = item;
-    return React.createElement(Menu.Menu.Item, {
-      key: utilities_react.getFlattenedKey(itemEle.key),
-      href: itemEle.props.href,
-      target: itemEle.props.target
-    }, itemEle.props.label);
-  })))), primaryCTAItem && React.createElement(React.Fragment, null, React.createElement(Separator, {
-    group: "cta"
-  }), primaryCTAItem)));
+  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [jsxRuntime.jsxs("div", {
+      className: utilities_css.classNames(styles$4.ctaGroup, styles$4.ctaGroupExpanded),
+      children: [secondaryCTAItems == null ? void 0 : secondaryCTAItems.map((item, index) => {
+        const isLastChild = index === totalItems - 1;
+        const itemEle = item;
+        return jsxRuntime.jsxs(React.Fragment, {
+          children: [itemEle, !isLastChild && jsxRuntime.jsx(Separator, {
+            group: "cta"
+          })]
+        }, itemEle.key);
+      }), primaryCTAItem && jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [jsxRuntime.jsx(Separator, {
+          group: "cta"
+        }), primaryCTAItem]
+      })]
+    }), jsxRuntime.jsxs("div", {
+      className: utilities_css.classNames(styles$4.ctaGroup, styles$4.ctaGroupMenu),
+      children: [jsxRuntime.jsxs(Menu.Menu, {
+        children: [jsxRuntime.jsx(Menu.Menu.Trigger, {
+          children: jsxRuntime.jsxs(UnstyledButton.UnstyledButton, {
+            className: utilities_css.classNames(styles$4.menuBtn),
+            children: [jsxRuntime.jsx(Icon.Icon, {
+              symbol: ctaMenuSymbol ? ctaMenuSymbol : Help
+            }), jsxRuntime.jsx(Text.Text, {
+              visuallyHidden: true,
+              children: "menu"
+            })]
+          })
+        }), jsxRuntime.jsx(Menu.Menu.Overlay, __spreadProps(__spreadValues({
+          placement: "bottom right"
+        }, menuOverlayProps), {
+          children: jsxRuntime.jsx(Menu.Menu.Section, {
+            "aria-label": "Nav actions",
+            children: secondaryCTAItems == null ? void 0 : secondaryCTAItems.map((item) => {
+              const itemEle = item;
+              return jsxRuntime.jsx(Menu.Menu.Item, {
+                href: itemEle.props.href,
+                target: itemEle.props.target,
+                children: itemEle.props.label
+              }, utilities_react.getFlattenedKey(itemEle.key));
+            })
+          })
+        }))]
+      }), primaryCTAItem && jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [jsxRuntime.jsx(Separator, {
+          group: "cta"
+        }), primaryCTAItem]
+      })]
+    })]
+  });
 }
 CTAGroup.displayName = "SearchNav.CTAGroup";
 const logo = "_logo_fsmuh_4";
@@ -211,9 +235,10 @@ const styles$3 = {
 };
 function Logo(props) {
   const { children } = props;
-  return React.createElement("div", {
-    className: utilities_css.classNames(styles$3.logo)
-  }, children);
+  return jsxRuntime.jsx("div", {
+    className: utilities_css.classNames(styles$3.logo),
+    children
+  });
 }
 Logo.displayName = "SearchNav.Logo";
 const cta = "_cta_2tjk4_4";
@@ -222,13 +247,15 @@ const styles$2 = {
 };
 function SecondaryCTAItem(props) {
   const _a = props, { symbol, label, hideLabelOnDesktop = false } = _a, restProps = __objRest(_a, ["symbol", "label", "hideLabelOnDesktop"]);
-  return React.createElement(UnstyledButton.UnstyledButton, __spreadProps(__spreadValues({}, restProps), {
-    className: utilities_css.classNames(styles$2.cta)
-  }), symbol && React.createElement(Icon.Icon, {
-    symbol
-  }), hideLabelOnDesktop ? React.createElement(Text.Text, {
-    visuallyHidden: true
-  }, label) : label);
+  return jsxRuntime.jsxs(UnstyledButton.UnstyledButton, __spreadProps(__spreadValues({}, restProps), {
+    className: utilities_css.classNames(styles$2.cta),
+    children: [symbol && jsxRuntime.jsx(Icon.Icon, {
+      symbol
+    }), hideLabelOnDesktop ? jsxRuntime.jsx(Text.Text, {
+      visuallyHidden: true,
+      children: label
+    }) : label]
+  }));
 }
 SecondaryCTAItem.displayName = "SearchNav.SecondaryCTAItem";
 const triggerBtn = "_triggerBtn_87epg_4";
@@ -241,19 +268,23 @@ function SelectorTrigger(props) {
   var _a;
   const { valueProps, label } = props;
   const { triggerProps, triggerRef, selectState } = SelectOverlay.useInternalSelectContext();
-  return React.createElement(React.Fragment, null, React.createElement(SelectOverlay.$bdd25dc72710631f$export$cbd84cdb2e668835, {
-    state: selectState,
-    triggerRef,
-    label
-  }), React.createElement(UnstyledButton.UnstyledButton, __spreadProps(__spreadValues({}, triggerProps), {
-    ref: triggerRef,
-    className: utilities_css.classNames(styles$1.triggerBtn)
-  }), React.createElement("span", __spreadProps(__spreadValues({}, valueProps), {
-    className: utilities_css.classNames(styles$1.text)
-  }), (_a = selectState.selectedItem) == null ? void 0 : _a.rendered), React.createElement(Icon.Icon, {
-    symbol: ExpandMore400.ExpandMore400,
-    size: "xs"
-  })));
+  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [jsxRuntime.jsx(SelectOverlay.$bdd25dc72710631f$export$cbd84cdb2e668835, {
+      state: selectState,
+      triggerRef,
+      label
+    }), jsxRuntime.jsxs(UnstyledButton.UnstyledButton, __spreadProps(__spreadValues({}, triggerProps), {
+      ref: triggerRef,
+      className: utilities_css.classNames(styles$1.triggerBtn),
+      children: [jsxRuntime.jsx("span", __spreadProps(__spreadValues({}, valueProps), {
+        className: utilities_css.classNames(styles$1.text),
+        children: (_a = selectState.selectedItem) == null ? void 0 : _a.rendered
+      })), jsxRuntime.jsx(Icon.Icon, {
+        symbol: ExpandMore400.ExpandMore400,
+        size: "xs"
+      })]
+    }))]
+  });
 }
 function Selector(props) {
   const triggerRef = React.useRef(null);
@@ -270,12 +301,13 @@ function Selector(props) {
       triggerWidth
     };
   }, [triggerProps, listBoxPropsFromSelect, selectState, triggerWidth]);
-  return React.createElement(SelectOverlay.InternalSelectContext.Provider, {
-    value: context
-  }, React.createElement(SelectorTrigger, {
-    valueProps,
-    label
-  }), React.createElement(SelectOverlay.SelectOverlay, null));
+  return jsxRuntime.jsxs(SelectOverlay.InternalSelectContext.Provider, {
+    value: context,
+    children: [jsxRuntime.jsx(SelectorTrigger, {
+      valueProps,
+      label
+    }), jsxRuntime.jsx(SelectOverlay.SelectOverlay, {})]
+  });
 }
 Selector.displayName = "SearchNav.Selector";
 const condensed = "_condensed_1rv4g_4";
@@ -297,69 +329,90 @@ function CondensedSearchNav() {
   const [isSearchOpen, setIsSearchOpen] = React.useState(false);
   const { search: search2, selectorChildren, secondaryCTAItems, primaryCTAItem, selectorLabel, menuOverlayProps, condensedBehavior } = useInternalSearchNavContext();
   const hasMenuToShow = !!selectorChildren || !!secondaryCTAItems;
-  return React.createElement("div", {
-    className: utilities_css.classNames(styles.condensed)
-  }, isSearchOpen ? React.createElement("div", {
-    className: utilities_css.classNames(styles.condensedSearch)
-  }, search2, React.createElement(UnstyledButton.UnstyledButton, {
-    className: utilities_css.classNames(styles.btn),
-    onPress: () => setIsSearchOpen((prev) => !prev)
-  }, React.createElement(Icon.Icon, {
-    symbol: Close.Close,
-    size: "xs"
-  }))) : React.createElement(React.Fragment, null, condensedBehavior === "collapse-to-menu" && hasMenuToShow ? React.createElement(Menu.Menu, {
-    isOpen: isMenuOpen,
-    onOpenChange: setIsMenuOpen
-  }, React.createElement(Menu.Menu.Trigger, null, React.createElement(UnstyledButton.UnstyledButton, {
-    className: utilities_css.classNames(styles.btn, styles.menuBtn, isMenuOpen && styles.menuOpen)
-  }, React.createElement(Icon.Icon, {
-    symbol: Menu$1.Menu
-  }), React.createElement(Text.Text, {
-    visuallyHidden: true
-  }, "menu"))), React.createElement(Menu.Menu.Overlay, __spreadValues({
-    placement: "bottom left"
-  }, menuOverlayProps), React.createElement(Menu.Menu.Section, {
-    "aria-label": selectorLabel
-  }, selectorChildren == null ? void 0 : selectorChildren.map((item) => {
-    const itemEle = item;
-    return React.createElement(Menu.Menu.Item, {
-      key: utilities_react.getFlattenedKey(itemEle.key)
-    }, itemEle.props.children);
-  })), React.createElement(Menu.Menu.Section, {
-    "aria-label": "Nav actions"
-  }, secondaryCTAItems == null ? void 0 : secondaryCTAItems.map((item) => {
-    const itemEle = item;
-    return React.createElement(Menu.Menu.Item, {
-      key: utilities_react.getFlattenedKey(itemEle.key),
-      href: itemEle.props.href,
-      target: itemEle.props.target
-    }, itemEle.props.label);
-  })))) : React.createElement(LogoGroup, null, null), (search2 || primaryCTAItem) && React.createElement(HorizontalStack.HorizontalStack, {
-    gap: "2"
-  }, search2 && React.createElement(UnstyledButton.UnstyledButton, {
-    className: utilities_css.classNames(styles.btn, styles.searchBtn),
-    onPress: () => setIsSearchOpen((prev) => !prev)
-  }, React.createElement(Icon.Icon, {
-    symbol: Search$1.Search
-  }), React.createElement(Text.Text, {
-    visuallyHidden: true
-  }, "search")), primaryCTAItem)));
+  return jsxRuntime.jsx("div", {
+    className: utilities_css.classNames(styles.condensed),
+    children: isSearchOpen ? jsxRuntime.jsxs("div", {
+      className: utilities_css.classNames(styles.condensedSearch),
+      children: [search2, jsxRuntime.jsx(UnstyledButton.UnstyledButton, {
+        className: utilities_css.classNames(styles.btn),
+        onPress: () => setIsSearchOpen((prev) => !prev),
+        children: jsxRuntime.jsx(Icon.Icon, {
+          symbol: Close.Close,
+          size: "xs"
+        })
+      })]
+    }) : jsxRuntime.jsxs(jsxRuntime.Fragment, {
+      children: [condensedBehavior === "collapse-to-menu" && hasMenuToShow ? jsxRuntime.jsxs(Menu.Menu, {
+        isOpen: isMenuOpen,
+        onOpenChange: setIsMenuOpen,
+        children: [jsxRuntime.jsx(Menu.Menu.Trigger, {
+          children: jsxRuntime.jsxs(UnstyledButton.UnstyledButton, {
+            className: utilities_css.classNames(styles.btn, styles.menuBtn, isMenuOpen && styles.menuOpen),
+            children: [jsxRuntime.jsx(Icon.Icon, {
+              symbol: Menu$1.Menu
+            }), jsxRuntime.jsx(Text.Text, {
+              visuallyHidden: true,
+              children: "menu"
+            })]
+          })
+        }), jsxRuntime.jsxs(Menu.Menu.Overlay, __spreadProps(__spreadValues({
+          placement: "bottom left"
+        }, menuOverlayProps), {
+          children: [jsxRuntime.jsx(Menu.Menu.Section, {
+            "aria-label": selectorLabel,
+            children: selectorChildren == null ? void 0 : selectorChildren.map((item) => {
+              const itemEle = item;
+              return jsxRuntime.jsx(Menu.Menu.Item, {
+                children: itemEle.props.children
+              }, utilities_react.getFlattenedKey(itemEle.key));
+            })
+          }), jsxRuntime.jsx(Menu.Menu.Section, {
+            "aria-label": "Nav actions",
+            children: secondaryCTAItems == null ? void 0 : secondaryCTAItems.map((item) => {
+              const itemEle = item;
+              return jsxRuntime.jsx(Menu.Menu.Item, {
+                href: itemEle.props.href,
+                target: itemEle.props.target,
+                children: itemEle.props.label
+              }, utilities_react.getFlattenedKey(itemEle.key));
+            })
+          })]
+        }))]
+      }) : jsxRuntime.jsx(LogoGroup, {
+        children: null
+      }), (search2 || primaryCTAItem) && jsxRuntime.jsxs(HorizontalStack.HorizontalStack, {
+        gap: "2",
+        children: [search2 && jsxRuntime.jsxs(UnstyledButton.UnstyledButton, {
+          className: utilities_css.classNames(styles.btn, styles.searchBtn),
+          onPress: () => setIsSearchOpen((prev) => !prev),
+          children: [jsxRuntime.jsx(Icon.Icon, {
+            symbol: Search$1.Search
+          }), jsxRuntime.jsx(Text.Text, {
+            visuallyHidden: true,
+            children: "search"
+          })]
+        }), primaryCTAItem]
+      })]
+    })
+  });
 }
 function PrimaryCTAItem(props) {
   const _a = props, { label } = _a, restProps = __objRest(_a, ["label"]);
-  return React.createElement(Button.Button, __spreadProps(__spreadValues({}, restProps), {
+  return jsxRuntime.jsx(Button.Button, __spreadProps(__spreadValues({}, restProps), {
     variant: "outlined",
     size: "sm",
-    color: "support"
-  }), label);
+    color: "support",
+    children: label
+  }));
 }
 PrimaryCTAItem.displayName = "SearchNav.PrimaryCTAItem";
 function Title(props) {
   const { children } = props;
-  return React.createElement(Text.Text, {
+  return jsxRuntime.jsx(Text.Text, {
     variant: "subtitle1",
-    transform: "uppercase"
-  }, children);
+    transform: "uppercase",
+    children
+  });
 }
 Title.displayName = "SearchNav.Title";
 function getLogoGroupChildren(logoGroup2) {
@@ -456,13 +509,16 @@ function SearchNav(props) {
       }
     };
   }, [children, menuOverlayProps, ctaMenuSymbol, condensedBehavior]);
-  return React.createElement(InternalSearchNavContext.Provider, {
-    value: context
-  }, React.createElement("nav", {
-    className: utilities_css.classNames(styles$8.nav)
-  }, React.createElement("div", {
-    className: utilities_css.classNames(styles$8.desktop, onlyLogoGroup2 && styles$8.onlyLogoGroup)
-  }, children), !onlyLogoGroup2 && React.createElement(CondensedSearchNav, null)));
+  return jsxRuntime.jsx(InternalSearchNavContext.Provider, {
+    value: context,
+    children: jsxRuntime.jsxs("nav", {
+      className: utilities_css.classNames(styles$8.nav),
+      children: [jsxRuntime.jsx("div", {
+        className: utilities_css.classNames(styles$8.desktop, onlyLogoGroup2 && styles$8.onlyLogoGroup),
+        children
+      }), !onlyLogoGroup2 && jsxRuntime.jsx(CondensedSearchNav, {})]
+    })
+  });
 }
 SearchNav.LogoGroup = LogoGroup;
 SearchNav.Logo = Logo;