@wistia/ui 0.14.36 → 0.14.37

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.14.36
+ * @license @wistia/ui v0.14.37
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -142,6 +142,7 @@ __export(index_exports, {
   SelectOption: () => SelectOption,
   SelectOptionGroup: () => SelectOptionGroup,
   Slider: () => Slider,
+  SplitButton: () => SplitButton,
   Stack: () => Stack,
   SubMenu: () => SubMenu,
   Switch: () => Switch,
@@ -7559,6 +7560,7 @@ var Button = (0, import_react23.forwardRef)(
         type: "button",
         ...props,
         ...commonProps,
+        "data-wui-button": true,
         children: unstyled ? children : /* @__PURE__ */ (0, import_jsx_runtime198.jsx)(
           ButtonContent,
           {
@@ -11343,14 +11345,14 @@ var Input = (0, import_react47.forwardRef)(
     if ((0, import_type_guards35.isNil)(leftIcon) && type === "search") {
       leftIconToDisplay = /* @__PURE__ */ (0, import_jsx_runtime247.jsx)(Icon, { type: "search" });
     }
-    if ((0, import_type_guards35.isNotNil)(leftIconToDisplay)) {
+    if ((0, import_type_guards35.isNotNil)(leftIconToDisplay) && (0, import_react47.isValidElement)(leftIconToDisplay)) {
       leftIconToDisplay = (0, import_react47.cloneElement)(leftIconToDisplay, {
         size: "md",
         className: "wui-input-left-icon"
       });
     }
     let rightIconToDisplay = rightIcon;
-    if ((0, import_type_guards35.isNotNil)(rightIconToDisplay)) {
+    if ((0, import_type_guards35.isNotNil)(rightIconToDisplay) && (0, import_react47.isValidElement)(rightIconToDisplay)) {
       rightIconToDisplay = (0, import_react47.cloneElement)(rightIconToDisplay, {
         size: "md",
         className: "wui-input-right-icon"
@@ -12823,10 +12825,10 @@ var MenuItemButton = (0, import_react57.forwardRef)(({ children, appearance, com
       fullWidth: true,
       unstyled: true,
       children: [
-        props.leftIcon ? /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(StyledLeftIconContainer, { children: props.leftIcon }) : null,
+        (0, import_type_guards38.isNotNil)(props.leftIcon) ? /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(StyledLeftIconContainer, { children: props.leftIcon }) : null,
         /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(StyledLabelAndDescriptionContainer, { children }),
         (0, import_type_guards38.isNotNil)(badge) || (0, import_type_guards38.isNotNil)(command) ? /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(StyledBadgeContainer, { children: badge ?? command }) : null,
-        props.rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(StyledRightIconContainer, { children: props.rightIcon }) : null
+        (0, import_type_guards38.isNotNil)(props.rightIcon) ? /* @__PURE__ */ (0, import_jsx_runtime257.jsx)(StyledRightIconContainer, { children: props.rightIcon }) : null
       ]
     }
   );
@@ -17743,6 +17745,76 @@ var WistiaLogo = ({
   return href !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime326.jsx)("a", { href, children: Logo }) : Logo;
 };
 WistiaLogo.displayName = "WistiaLogo_UI";
+
+// src/components/SplitButton/SplitButton.tsx
+var import_styled_components128 = __toESM(require("styled-components"));
+var import_type_guards75 = require("@wistia/type-guards");
+var import_jsx_runtime327 = require("react/jsx-runtime");
+var StyledSplitButton = import_styled_components128.default.span`
+  white-space: nowrap;
+
+  > [data-wui-button='true']:first-child {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
+  > [data-wui-button='true']:last-child {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+    display: inline-flex;
+  }
+`;
+var SplitButton = ({
+  children,
+  menuLabel = "Select an option",
+  menuIcon = /* @__PURE__ */ (0, import_jsx_runtime327.jsx)(Icon, { type: "caret-down" }),
+  menuItems,
+  disabled = false,
+  colorScheme = "default",
+  variant = "solid",
+  secondaryAction,
+  size = "md",
+  unstyled = false,
+  menuProps = {},
+  ...props
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime327.jsxs)(StyledSplitButton, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime327.jsx)(
+      Button,
+      {
+        colorScheme,
+        disabled,
+        size,
+        unstyled,
+        variant,
+        ...props,
+        children
+      }
+    ),
+    (0, import_type_guards75.isNotNil)(menuItems) && /* @__PURE__ */ (0, import_jsx_runtime327.jsx)(
+      Menu,
+      {
+        ...menuProps,
+        disabled,
+        trigger: /* @__PURE__ */ (0, import_jsx_runtime327.jsx)(
+          IconButton,
+          {
+            colorScheme,
+            disabled,
+            label: menuLabel,
+            size,
+            unstyled,
+            variant,
+            children: menuIcon
+          }
+        ),
+        children: menuItems
+      }
+    ),
+    (0, import_type_guards75.isNotNil)(secondaryAction) && secondaryAction
+  ] });
+};
+SplitButton.displayName = "SplitButton_UI";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ActionButton,
@@ -17848,6 +17920,7 @@ WistiaLogo.displayName = "WistiaLogo_UI";
   SelectOption,
   SelectOptionGroup,
   Slider,
+  SplitButton,
   Stack,
   SubMenu,
   Switch,