@allxsmith/bestax-bulma 5.15.1 → 5.15.3

package/dist/index.cjs.js

@@ -2002,6 +2002,33 @@ const DropdownComponent = React.forwardRef(function DropdownComponent({ label, c
     const dropdownClasses = classNames(bulmaClasses, bulmaHelperClasses, className);
     return (jsxRuntime.jsxs("div", { className: dropdownClasses, ref: setRefs, id: id, "data-testid": "dropdown-root", ...rest, children: [jsxRuntime.jsx("div", { className: usePrefixedClassNames('dropdown-trigger'), children: jsxRuntime.jsxs("button", { ref: triggerRef, className: buttonClass, "aria-haspopup": "true", "aria-controls": id ? `${id}-menu` : undefined, "aria-expanded": active, onClick: handleToggle, onKeyDown: handleTriggerKeyDown, disabled: disabled, type: "button", children: [jsxRuntime.jsx("span", { children: label }), jsxRuntime.jsx("span", { className: usePrefixedClassNames('icon', 'is-small'), "aria-hidden": "true", children: jsxRuntime.jsx("i", { className: "fas fa-angle-down" }) })] }) }), jsxRuntime.jsx("div", { className: classNames(usePrefixedClassNames('dropdown-menu'), menuClassName), id: id ? `${id}-menu` : undefined, role: "menu", "data-testid": "dropdown-menu", onKeyDown: handleMenuKeyDown, children: jsxRuntime.jsx("div", { className: usePrefixedClassNames('dropdown-content'), onClick: handleMenuClick, tabIndex: -1, children: children }) })] }));
 });
+/**
+ * The anchor-only attributes, withheld from a `<div>` or a `<button>`.
+ *
+ * Mirrors `LINK_ATTRS` in `bestax-migrate/src/sources/_shared/polymorphic.ts`,
+ * which drops the same set when a migration lands one on a non-anchor. `rel` is
+ * absent from both on purpose: React declares it on `HTMLAttributes<T>` — every
+ * element — so withholding it would diverge from React's own typing, the same
+ * call #641 recorded for `Navbar.Link`.
+ */
+const LINK_ONLY_ATTRS = [
+    'href',
+    'target',
+    'download',
+    'hrefLang',
+    'ping',
+    'referrerPolicy',
+    'media',
+];
+/** `props` without any attribute only an anchor can carry. */
+function omitLinkAttrs(props) {
+    const out = {};
+    for (const [key, value] of Object.entries(props)) {
+        if (!LINK_ONLY_ATTRS.includes(key))
+            out[key] = value;
+    }
+    return out;
+}
 /**
  * Bulma Dropdown item.
  *
@@ -2009,12 +2036,34 @@ const DropdownComponent = React.forwardRef(function DropdownComponent({ label, c
  * @param {DropdownItemProps} props - Props for the DropdownItem component.
  * @returns {JSX.Element} The rendered dropdown item.
  */
-const DropdownItem = ({ children, active, className, as: Component = 'a', ...props }) => {
+const DropdownItem = ((itemProps) => {
+    const { children, active, className, as: Component = 'a', ...props } = itemProps;
     const { bulmaHelperClasses, rest } = useBulmaClasses(props);
+    // The anchor's attributes reach an anchor and nothing else — `<div href>` and
+    // `<button target>` are invalid HTML. The same rule Menu applies, for the same
+    // reason: the type now derives these from `as`, and deriving them must not
+    // quietly widen where they land. The type stops a direct caller; this stops a
+    // plain-JS one, a loose `{...props}` spread, and the genericity a wrapping HOC
+    // erases.
+    //
+    // The whole link set, not `href` alone. Menu strips only `href` because its
+    // props never gained the rest; here they all arrive together under `as="a"`,
+    // and `bestax-migrate` already removes exactly this set (`LINK_ATTRS`) when it
+    // migrates onto a non-anchor — so stripping less would leave the codemod
+    // stricter than the component it migrates to.
+    //
+    // Menu's condition also admits a custom component and a custom element, which
+    // own their prop contracts. `as` is closed to three intrinsic tags here, so
+    // neither can arrive and the anchor test is the whole rule.
+    const forwarded = Component === 'a' ? rest : omitLinkAttrs(rest);
     return (jsxRuntime.jsx(Component, { className: classNames(usePrefixedClassNames('dropdown-item', {
             'is-active': active,
-        }), bulmaHelperClasses, className), tabIndex: 0, role: "menuitem", "data-testid": "dropdown-item", ...rest, children: children }));
-};
+        }), bulmaHelperClasses, className), tabIndex: 0, role: "menuitem", "data-testid": "dropdown-item", ...forwarded, ...(Component === 'button'
+            ? {
+                type: forwarded.type ?? 'button',
+            }
+            : {}), children: children }));
+});
 /**
  * Bulma Dropdown divider.
  *
@@ -3130,10 +3179,11 @@ containerClassName, children, ...restProps }) => {
         // component, …) in place of a class-based glyph. Library/variant/features don't apply.
         return (jsxRuntime.jsx("span", { className: iconContainerClasses, "aria-label": ariaLabel, style: style, ...rest, children: children }));
     }
-    // `name` is guaranteed once `children` is absent (`IconProps` is a discriminated union of
-    // the two, and `IconChildrenProps['children']` excludes `undefined` so `children={undefined}`
-    // can't slip past into this branch) — the cast only matters for legacy callers that bypass
-    // the type and rely solely on the deprecated `icon` prop below.
+    // `name` is guaranteed once `children` is absent UNLESS the caller is on the deprecated
+    // `icon` path, which `IconDeprecatedProps` declares with `name?: undefined`.
+    // (`IconChildrenProps['children']` excludes `undefined`, so `children={undefined}` can't
+    // slip past into this branch.) The cast covers that third member, and the `!name && icon`
+    // fallback below is what fills it in.
     let finalName = name;
     if (!name && icon) {
         // If icon prop is provided instead of name, try to parse it
@@ -3157,9 +3207,10 @@ containerClassName, children, ...restProps }) => {
     // library is 'fa'), so `name` behaves identically with or without the prefix.
     finalName = stripRedundantLibraryPrefix(finalName, finalLibrary);
     if (!finalName) {
-        // No glyph to name. Unreachable through the public type, but a plain-JS caller (or one
-        // that casts) can land here, and building a class off an absent name produced a bogus
-        // `fa-undefined` glyph. Render the bare container instead, matching the `children` branch.
+        // No glyph to name. Reachable through the public type only as `icon=""`, and otherwise
+        // by a plain-JS caller (or one that casts). Building a class off an absent name produced
+        // a bogus `fa-undefined` glyph; render the bare container instead, matching the
+        // `children` branch.
         return (jsxRuntime.jsx("span", { className: iconContainerClasses, "aria-label": ariaLabel, style: style, ...rest }));
     }
     // Backward compatibility: if libraryFeatures is provided, parse it for variant and features
@@ -5602,15 +5653,49 @@ const Figure = withSubComponents(FigureComponent, {
 }, 'Figure');
 
 /**
- * Distinguishes an `IconProps` object from a plain custom node (an inline SVG, a `react-icons`
- * component, …) passed to a slot that accepts either.
+ * Distinguishes an `IconProps` object from a plain custom node (an inline SVG, a
+ * `react-icons` component, …) in a slot that accepts either — `Control`'s
+ * `iconLeft`/`iconRight`, `IconText`'s `iconProps`.
+ *
+ * One copy, imported by both consumers: two hand-maintained copies, one per
+ * consumer, is how the deprecated `icon` path came to crash both (#663).
+ *
+ * Its own module rather than `Icon.tsx` because `src/index.ts` wildcard-exports
+ * that file, and everything published there is public forever. `polymorphic.ts`
+ * makes the same call for `isCustomElement`: an internal discriminator is not
+ * something to support for the life of the package.
+ *
+ * It tests each member's VALUE, not merely its key, and only after everything
+ * React owns is out of the way. `'icon' in value` was enough
+ * to claim a Font Awesome `IconDefinition` — `{ prefix, iconName, icon: [w, h, …,
+ * path] }` — whose `icon` is a path array rather than a class string. That object
+ * is not a renderable node either, so the honest outcome is the one this slot has
+ * always had for it: the node branch, and React's own "Objects are not valid as a
+ * React child". Claiming it here instead rendered a blank container that still
+ * reserved layout.
+ *
+ * A member added to `IconProps` needs a line here, and a missed one is a crash
+ * rather than a fallthrough. That is the cost of a slot taking either a props
+ * object or a node; keeping the guard in one place is what keeps the cost to a
+ * single line.
  */
-function isIconProps$1(value) {
-    return (typeof value === 'object' &&
-        value !== null &&
-        !React.isValidElement(value) &&
-        ('name' in value || 'children' in value));
+function isIconProps(value) {
+    if (typeof value !== 'object' || value === null)
+        return false;
+    // Anything React owns. `isValidElement` covers elements only; a PORTAL is a
+    // valid `ReactNode` that fails it and carries a `children` key, so the member
+    // test below claimed it and `Control` spread it into `<Icon>` as props —
+    // rendering the portal's child locally instead of in its container. Every
+    // React internal carries `$$typeof`, so testing for it covers lazy, context
+    // and whatever React adds next, rather than portals alone.
+    if (React.isValidElement(value) || '$$typeof' in value)
+        return false;
+    const candidate = value;
+    return (typeof candidate.name === 'string' ||
+        typeof candidate.icon === 'string' ||
+        'children' in candidate);
 }
+
 /**
  * The `IconText` component provides a Bulma-styled horizontal arrangement of one or more `Icon` components and optional text.
  *
@@ -5631,8 +5716,8 @@ const IconTextComponent = ({ className, textColor, color, bgColor, iconProps, ch
     const bulmaClasses = usePrefixedClassNames('icon-text');
     const iconTextClasses = classNames(bulmaClasses, bulmaHelperClasses, className);
     return (jsxRuntime.jsx("span", { className: iconTextClasses, ...rest, children: items ? (items.map((item, index) => (jsxRuntime.jsxs(React.Fragment, { children: [item.iconProps &&
-                    (isIconProps$1(item.iconProps) ? (jsxRuntime.jsx(Icon, { ...item.iconProps })) : (jsxRuntime.jsx(Icon, { children: item.iconProps }))), item.text && jsxRuntime.jsx("span", { children: item.text })] }, index)))) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [iconProps &&
-                    (isIconProps$1(iconProps) ? (jsxRuntime.jsx(Icon, { ...iconProps })) : (jsxRuntime.jsx(Icon, { children: iconProps }))), children && jsxRuntime.jsx("span", { children: children })] })) }));
+                    (isIconProps(item.iconProps) ? (jsxRuntime.jsx(Icon, { ...item.iconProps })) : (jsxRuntime.jsx(Icon, { children: item.iconProps }))), item.text && jsxRuntime.jsx("span", { children: item.text })] }, index)))) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [iconProps &&
+                    (isIconProps(iconProps) ? (jsxRuntime.jsx(Icon, { ...iconProps })) : (jsxRuntime.jsx(Icon, { children: iconProps }))), children && jsxRuntime.jsx("span", { children: children })] })) }));
 };
 const IconText = withSubComponents(IconTextComponent, { Icon }, 'IconText');
 
@@ -6546,16 +6631,6 @@ const Checkbox = React.forwardRef(({ color, size, className, children, textColor
 });
 Checkbox.displayName = 'Checkbox';
 
-/**
- * Distinguishes an `IconProps` object from a plain custom node (an inline SVG, a `react-icons`
- * component, …) passed to a slot that accepts either.
- */
-function isIconProps(value) {
-    return (typeof value === 'object' &&
-        value !== null &&
-        !React.isValidElement(value) &&
-        ('name' in value || 'children' in value));
-}
 const allowedColors = [...validColors, 'inherit', 'current'];
 /**
  * The `Control` component is a Bulma-styled wrapper for form controls (`Input`, `Select`, `TextArea`, etc.), supporting icons (left/right), loading state, expansion, size, and Bulma helper props for layout and color.
@@ -12921,7 +12996,7 @@ const LevelRight = ({ className, children, color, bgColor, textColor, ...props }
  * @param {LevelItemProps} props - Props for the LevelItem component.
  * @returns {JSX.Element} The rendered level item.
  */
-const LevelItem = ({ as = 'div', hasTextCentered, className, children, href, target, rel, color, bgColor, textColor, ...props }) => {
+const LevelItem = ({ as = 'div', hasTextCentered, className, children, color, bgColor, textColor, ...props }) => {
     const { bulmaHelperClasses, rest } = useBulmaClasses({
         color: textColor ?? color,
         backgroundColor: bgColor,
@@ -12932,11 +13007,37 @@ const LevelItem = ({ as = 'div', hasTextCentered, className, children, href, tar
         'has-text-centered': hasTextCentered,
     });
     const levelItemClasses = classNames(mainClass, bulmaHelperClasses, className);
-    // If rendering as "a", only pass anchor-specific props
+    // The anchor's own attributes reach an `<a>` and nothing else. The type
+    // declares them at every `as` — narrowing that is source-breaking (#672) — so
+    // the runtime is what keeps `<Level.Item as="p" download>` from rendering a
+    // dead attribute.
+    //
+    // Keyed off `AnchorOnlyAttributes` rather than repeated as a list, because a
+    // hand list beside a derived type drifts in the one direction that matters:
+    // the day React adds an anchor attribute, the type would accept it at every
+    // `as` while the list let it leak onto a `<div>`. `Record` makes that a
+    // compile error here until this object catches up. #682 is the issue for
+    // sharing the rule with the two components that keep their own copies.
+    const ANCHOR_ONLY = {
+        href: true,
+        target: true,
+        download: true,
+        hrefLang: true,
+        ping: true,
+        referrerPolicy: true,
+        media: true,
+        type: true,
+        // `rel` is NOT in the subtraction: React declares it on `HTMLAttributes`,
+        // for every element. It is here because this component has always withheld
+        // it from a non-anchor, and it is named separately so the key set above
+        // stays honest about where each name comes from.
+        rel: true,
+    };
     if (Tag === 'a') {
-        return (jsxRuntime.jsx("a", { className: levelItemClasses, href: href, target: target, rel: rel, ...rest, children: children }));
+        return (jsxRuntime.jsx("a", { className: levelItemClasses, ...rest, children: children }));
     }
-    return (jsxRuntime.jsx(Tag, { className: levelItemClasses, ...rest, children: children }));
+    const withoutAnchorAttrs = Object.fromEntries(Object.entries(rest).filter(([key]) => !(key in ANCHOR_ONLY)));
+    return (jsxRuntime.jsx(Tag, { className: levelItemClasses, ...withoutAnchorAttrs, children: children }));
 };
 const Level = withSubComponents(LevelComponent, {
     Left: LevelLeft,