@allxsmith/bestax-bulma 5.27.0 → 5.27.1

package/dist/esm/components/Collapse.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapse.js","sources":["../../../src/components/Collapse.tsx"],"sourcesContent":["import React, {\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  useContext,\n  useId,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { inertProps } from '../helpers/inertProps';\nimport { CollapsesItemContext } from './collapsesContext';\n\n/**\n * Props for the Collapse component.\n * @extraProp {React.ReactNode} [children] - The collapsible content.\n * @extraProp {string} [className] - Additional CSS classes.\n */\nexport interface CollapseProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * Controlled open state. If provided, component is controlled, and the\n   * trigger only reports through `onOpenChange`. Inside a `Collapses` group, a\n   * Collapse that sets `open` stays yours: the group neither overrides it nor\n   * closes it when another item opens.\n   */\n  open?: boolean;\n  /** Initial open state for uncontrolled usage. Ignored inside a `Collapses` group, whose `defaultValue` decides. */\n  defaultOpen?: boolean;\n  /** Called when the trigger opens the Collapse. Fires only while the Collapse keeps its own state: not when `open` is set, and not when a `Collapses` group manages it. `onOpenChange` reports in every mode. */\n  onOpen?: () => void;\n  /** Called when the trigger closes the Collapse. Fires only while the Collapse keeps its own state: not when `open` is set, and not when a `Collapses` group manages it. `onOpenChange` reports in every mode. */\n  onClose?: () => void;\n  /** Called with the state the trigger asks for (`true` to open) each time it is clicked or activated with Enter or Space, in every mode. Pair it with `open` to let the trigger drive a controlled Collapse. */\n  onOpenChange?: (open: boolean) => void;\n  /** The clickable trigger element (header/button). */\n  trigger?: React.ReactNode;\n  /** Animation style, or `false` to disable. */\n  animation?: 'fade' | 'slide' | false;\n  /** Position of the trigger relative to content. */\n  position?: 'top' | 'bottom';\n  /**\n   * Custom aria id for accessibility.\n   * @defaultValue auto\n   */\n  ariaId?: string;\n  /** Adds a border around the collapse. */\n  bordered?: boolean;\n  /** Additional classes for the trigger wrapper. */\n  triggerClassName?: string;\n  /** Additional classes for the content wrapper. */\n  contentClassName?: string;\n}\n\n/**\n * The `Collapse` component provides an expandable/collapsible content panel.\n *\n * @function\n * @param {CollapseProps} props - Props for the Collapse component.\n * @returns {JSX.Element} The rendered collapse component.\n *\n * @example\n * // Basic uncontrolled collapse\n * <Collapse trigger={<button>Click to toggle</button>}>\n *   <p>Collapsible content here</p>\n * </Collapse>\n *\n * @example\n * // Controlled collapse, driven by its own trigger\n * const [isOpen, setIsOpen] = useState(false);\n * <Collapse open={isOpen} onOpenChange={setIsOpen} trigger={<strong>Toggle</strong>}>\n *   <p>Content</p>\n * </Collapse>\n *\n * @example\n * // With callbacks\n * <Collapse\n *   trigger={<button>Toggle</button>}\n *   onOpen={() => console.log('Opened!')}\n *   onClose={() => console.log('Closed!')}\n * >\n *   <p>Content</p>\n * </Collapse>\n */\nexport const Collapse: React.FC<CollapseProps> = ({\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpen,\n  onClose,\n  onOpenChange,\n  trigger,\n  animation = 'fade',\n  position = 'top',\n  ariaId,\n  bordered,\n  children,\n  className,\n  triggerClassName,\n  contentClassName,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n  const contentRef = useRef<HTMLDivElement>(null);\n\n  // Three possible owners of the open state, in order: the caller when `open`\n  // is set, an enclosing Collapses group, and this Collapse itself. A caller's\n  // `open` wins over the group, which is how the group leaves such an item\n  // alone.\n  const isControlled = controlledOpen !== undefined;\n  const group = useContext(CollapsesItemContext);\n  const groupItem = isControlled ? null : group;\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const isOpen = controlledOpen ?? groupItem?.open ?? internalOpen;\n\n  // A group owns the state of the items it manages, so these props do\n  // nothing there. That is easy to miss, so development says which ones and\n  // what to use instead, once per combination (the way Avatar keys its\n  // warning), and `warnOnce` keeps production silent.\n  if (groupItem) {\n    const ignored = [\n      defaultOpen && 'defaultOpen',\n      onOpen && 'onOpen',\n      onClose && 'onClose',\n    ].filter((name): name is string => Boolean(name));\n    if (ignored.length > 0) {\n      const callbacks = ignored.filter(name => name !== 'defaultOpen');\n      warnOnce(\n        `Collapse:ignored-in-Collapses:${ignored.join('+')}`,\n        `[bestax-bulma] <Collapse ${ignored.join(' ')}> inside <Collapses>: ` +\n          [\n            ignored.includes('defaultOpen') &&\n              `defaultOpen has no effect, because the group decides which ` +\n                `items start open. Pass the item's index in the group's ` +\n                `defaultValue instead.`,\n            callbacks.length > 0 &&\n              `${callbacks.join(' and ')} never fire${callbacks.length > 1 ? '' : 's'}, ` +\n                `because the group holds the item's open state. Use the ` +\n                `item's onOpenChange, or the group's onChange, instead.`,\n          ]\n            .filter(Boolean)\n            .join(' ')\n      );\n    }\n  }\n\n  // Start from the resolved state rather than `defaultOpen`, so an item that\n  // mounts open through `open` or a group is not first painted (or rendered\n  // on the server) at height 0 under the slide animation.\n  const [height, setHeight] = useState<number | 'auto'>(isOpen ? 'auto' : 0);\n\n  // Generate unique ID for accessibility (useId is SSR-safe and stable across\n  // renders; works in React 18 and 19).\n  const generatedId = useId();\n  const uniqueId = ariaId || generatedId;\n\n  // Update height when open state changes (for 'slide' animation)\n  useEffect(() => {\n    if (!contentRef.current) return undefined;\n    if (animation !== 'slide') return undefined;\n\n    if (isOpen) {\n      // Opening: set height to content's scrollHeight\n      const contentHeight = contentRef.current.scrollHeight;\n      setHeight(contentHeight);\n\n      // After animation completes, set to auto for dynamic content\n      const timer = setTimeout(() => {\n        setHeight('auto');\n      }, 300); // Match CSS transition duration\n      return () => clearTimeout(timer);\n    } else {\n      // Closing: first set to current height, then to 0\n      if (height === 'auto') {\n        // Read scrollHeight and offsetHeight to capture the current size and\n        // force a layout flush, then schedule the height transition to 0.\n        // (Reading offsetHeight after assignment is the standard reflow trick;\n        // assigning into a state setter avoids a bare expression statement.)\n        const currentHeight = contentRef.current.scrollHeight;\n        const reflowHeight = contentRef.current.offsetHeight;\n        setHeight(Math.max(currentHeight, reflowHeight));\n        requestAnimationFrame(() => {\n          setHeight(0);\n        });\n      } else {\n        setHeight(0);\n      }\n    }\n    return undefined;\n    // `height` is read here but is an output of this effect; re-running when it\n    // changes would re-trigger the open/close animation, so it's intentionally\n    // excluded from the deps.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isOpen, animation]);\n\n  // The trigger reports in every mode, then changes only the state this\n  // Collapse owns. `onOpen`/`onClose` belong to that last case alone.\n  const handleToggle = useCallback(() => {\n    const next = !isOpen;\n    onOpenChange?.(next);\n    if (isControlled) return;\n    if (groupItem) {\n      groupItem.setOpen(next);\n      return;\n    }\n    setInternalOpen(next);\n    if (next) {\n      onOpen?.();\n    } else {\n      onClose?.();\n    }\n  }, [isOpen, isControlled, groupItem, onOpenChange, onOpen, onClose]);\n\n  // Handle keyboard interaction\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault();\n        handleToggle();\n      }\n    },\n    [handleToggle]\n  );\n\n  // Generate Bulma classes\n  const collapseClasses = usePrefixedClassNames('collapse', {\n    'is-active': isOpen,\n    'is-bordered': bordered,\n  });\n\n  const combinedClasses = classNames(\n    collapseClasses,\n    bulmaHelperClasses,\n    className\n  );\n  const combinedTriggerClasses = classNames(\n    usePrefixedClassNames('collapse-trigger'),\n    triggerClassName\n  );\n  const combinedContentClasses = classNames(\n    usePrefixedClassNames('collapse-content', {\n      'is-active': isOpen,\n    }),\n    contentClassName\n  );\n\n  // Content wrapper styles based on animation type\n  let contentWrapperStyle: React.CSSProperties;\n\n  if (animation === 'slide') {\n    contentWrapperStyle = {\n      height: height === 'auto' ? 'auto' : `${height}px`,\n      overflow: 'hidden',\n      transition: 'height 0.3s ease-in-out',\n    };\n  } else if (animation === 'fade') {\n    contentWrapperStyle = {\n      opacity: isOpen ? 1 : 0,\n      overflow: 'hidden',\n      height: isOpen ? 'auto' : 0,\n      transition: 'opacity 0.3s ease-in-out',\n    };\n  } else {\n    contentWrapperStyle = {\n      display: isOpen ? 'block' : 'none',\n    };\n  }\n\n  const triggerElement = (\n    <div\n      className={combinedTriggerClasses}\n      onClick={handleToggle}\n      onKeyDown={handleKeyDown}\n      role=\"button\"\n      tabIndex={0}\n      aria-expanded={isOpen}\n      aria-controls={uniqueId}\n    >\n      {trigger}\n    </div>\n  );\n\n  const contentElement = (\n    <div style={contentWrapperStyle}>\n      {/* A closed panel under `fade` or `slide` is only squeezed to height 0,\n          so its links and fields would stay in the tab order. `inert` takes\n          them out (and from pointer and find-in-page), matching\n          `aria-hidden`, and costs the animations nothing. */}\n      <div\n        ref={contentRef}\n        id={uniqueId}\n        className={combinedContentClasses}\n        aria-hidden={!isOpen}\n        {...inertProps(!isOpen)}\n      >\n        {children}\n      </div>\n    </div>\n  );\n\n  // The group's item context stops here: a Collapse nested in this one's\n  // content is not an item of this one's group.\n  return (\n    <CollapsesItemContext.Provider value={null}>\n      <div className={combinedClasses} {...rest}>\n        {position === 'bottom' ? (\n          <>\n            {contentElement}\n            {triggerElement}\n          </>\n        ) : (\n          <>\n            {triggerElement}\n            {contentElement}\n          </>\n        )}\n      </div>\n    </CollapsesItemContext.Provider>\n  );\n};\n\nexport default Collapse;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":";;;;;;;;;AAyDA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BG;MACU,QAAQ,GAA4B,CAAC,EAChD,IAAI,EAAE,cAAc,EACpB,WAAW,GAAG,KAAK,EACnB,MAAM,EACN,OAAO,EACP,YAAY,EACZ,OAAO,EACP,SAAS,GAAG,MAAM,EAClB,QAAQ,GAAG,KAAK,EAChB,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,gBAAgB,EAChB,GAAG,KAAK,EACT,KAAI;IACH,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,KAAK,CAAC;AAC3D,IAAA,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC;;;;;AAM/C,IAAA,MAAM,YAAY,GAAG,cAAc,KAAK,SAAS;AACjD,IAAA,MAAM,KAAK,GAAG,UAAU,CAAC,oBAAoB,CAAC;IAC9C,MAAM,SAAS,GAAG,YAAY,GAAG,IAAI,GAAG,KAAK;IAC7C,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC;IAC7D,MAAM,MAAM,GAAG,cAAc,IAAI,SAAS,EAAE,IAAI,IAAI,YAAY;;;;;IAMhE,IAAI,SAAS,EAAE;AACb,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,WAAW,IAAI,aAAa;AAC5B,YAAA,MAAM,IAAI,QAAQ;AAClB,YAAA,OAAO,IAAI,SAAS;AACrB,SAAA,CAAC,MAAM,CAAC,CAAC,IAAI,KAAqB,OAAO,CAAC,IAAI,CAAC,CAAC;AACjD,QAAA,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;AACtB,YAAA,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,KAAK,aAAa,CAAC;AAChE,YAAA,QAAQ,CACN,CAAA,8BAAA,EAAiC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA,CAAE,EACpD,4BAA4B,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA,sBAAA,CAAwB;AACnE,gBAAA;AACE,oBAAA,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC;wBAC7B,CAAA,2DAAA,CAA6D;4BAC3D,CAAA,uDAAA,CAAyD;4BACzD,CAAA,qBAAA,CAAuB;oBAC3B,SAAS,CAAC,MAAM,GAAG,CAAC;wBAClB,CAAA,EAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA,WAAA,EAAc,SAAS,CAAC,MAAM,GAAG,CAAC,GAAG,EAAE,GAAG,GAAG,CAAA,EAAA,CAAI;4BACzE,CAAA,uDAAA,CAAyD;4BACzD,CAAA,sDAAA,CAAwD;AAC7D;qBACE,MAAM,CAAC,OAAO;AACd,qBAAA,IAAI,CAAC,GAAG,CAAC,CACf;QACH;IACF;;;;AAKA,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAkB,MAAM,GAAG,MAAM,GAAG,CAAC,CAAC;;;AAI1E,IAAA,MAAM,WAAW,GAAG,KAAK,EAAE;AAC3B,IAAA,MAAM,QAAQ,GAAG,MAAM,IAAI,WAAW;;IAGtC,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,UAAU,CAAC,OAAO;AAAE,YAAA,OAAO,SAAS;QACzC,IAAI,SAAS,KAAK,OAAO;AAAE,YAAA,OAAO,SAAS;QAE3C,IAAI,MAAM,EAAE;;AAEV,YAAA,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,CAAC,YAAY;YACrD,SAAS,CAAC,aAAa,CAAC;;AAGxB,YAAA,MAAM,KAAK,GAAG,UAAU,CAAC,MAAK;gBAC5B,SAAS,CAAC,MAAM,CAAC;AACnB,YAAA,CAAC,EAAE,GAAG,CAAC,CAAC;AACR,YAAA,OAAO,MAAM,YAAY,CAAC,KAAK,CAAC;QAClC;aAAO;;AAEL,YAAA,IAAI,MAAM,KAAK,MAAM,EAAE;;;;;AAKrB,gBAAA,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,CAAC,YAAY;AACrD,gBAAA,MAAM,YAAY,GAAG,UAAU,CAAC,OAAO,CAAC,YAAY;gBACpD,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC;gBAChD,qBAAqB,CAAC,MAAK;oBACzB,SAAS,CAAC,CAAC,CAAC;AACd,gBAAA,CAAC,CAAC;YACJ;iBAAO;gBACL,SAAS,CAAC,CAAC,CAAC;YACd;QACF;AACA,QAAA,OAAO,SAAS;;;;;AAKlB,IAAA,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;;;AAIvB,IAAA,MAAM,YAAY,GAAG,WAAW,CAAC,MAAK;AACpC,QAAA,MAAM,IAAI,GAAG,CAAC,MAAM;AACpB,QAAA,YAAY,GAAG,IAAI,CAAC;AACpB,QAAA,IAAI,YAAY;YAAE;QAClB,IAAI,SAAS,EAAE;AACb,YAAA,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC;YACvB;QACF;QACA,eAAe,CAAC,IAAI,CAAC;QACrB,IAAI,IAAI,EAAE;YACR,MAAM,IAAI;QACZ;aAAO;YACL,OAAO,IAAI;QACb;AACF,IAAA,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;;AAGpE,IAAA,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,CAAsB,KAAI;AACzB,QAAA,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE;YACtC,CAAC,CAAC,cAAc,EAAE;AAClB,YAAA,YAAY,EAAE;QAChB;AACF,IAAA,CAAC,EACD,CAAC,YAAY,CAAC,CACf;;AAGD,IAAA,MAAM,eAAe,GAAG,qBAAqB,CAAC,UAAU,EAAE;AACxD,QAAA,WAAW,EAAE,MAAM;AACnB,QAAA,aAAa,EAAE,QAAQ;AACxB,KAAA,CAAC;IAEF,MAAM,eAAe,GAAG,UAAU,CAChC,eAAe,EACf,kBAAkB,EAClB,SAAS,CACV;IACD,MAAM,sBAAsB,GAAG,UAAU,CACvC,qBAAqB,CAAC,kBAAkB,CAAC,EACzC,gBAAgB,CACjB;AACD,IAAA,MAAM,sBAAsB,GAAG,UAAU,CACvC,qBAAqB,CAAC,kBAAkB,EAAE;AACxC,QAAA,WAAW,EAAE,MAAM;KACpB,CAAC,EACF,gBAAgB,CACjB;;AAGD,IAAA,IAAI,mBAAwC;AAE5C,IAAA,IAAI,SAAS,KAAK,OAAO,EAAE;AACzB,QAAA,mBAAmB,GAAG;AACpB,YAAA,MAAM,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,GAAG,CAAA,EAAG,MAAM,CAAA,EAAA,CAAI;AAClD,YAAA,QAAQ,EAAE,QAAQ;AAClB,YAAA,UAAU,EAAE,yBAAyB;SACtC;IACH;AAAO,SAAA,IAAI,SAAS,KAAK,MAAM,EAAE;AAC/B,QAAA,mBAAmB,GAAG;YACpB,OAAO,EAAE,MAAM,GAAG,CAAC,GAAG,CAAC;AACvB,YAAA,QAAQ,EAAE,QAAQ;YAClB,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,CAAC;AAC3B,YAAA,UAAU,EAAE,0BAA0B;SACvC;IACH;SAAO;AACL,QAAA,mBAAmB,GAAG;YACpB,OAAO,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM;SACnC;IACH;AAEA,IAAA,MAAM,cAAc,IAClBA,GAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,sBAAsB,EACjC,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,aAAa,EACxB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EAAA,eAAA,EACI,MAAM,EAAA,eAAA,EACN,QAAQ,EAAA,QAAA,EAEtB,OAAO,EAAA,CACJ,CACP;AAED,IAAA,MAAM,cAAc,IAClBA,GAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,mBAAmB,EAAA,QAAA,EAK7BA,GAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,UAAU,EACf,EAAE,EAAE,QAAQ,EACZ,SAAS,EAAE,sBAAsB,EAAA,aAAA,EACpB,CAAC,MAAM,KAChB,UAAU,CAAC,CAAC,MAAM,CAAC,EAAA,QAAA,EAEtB,QAAQ,EAAA,CACL,EAAA,CACF,CACP;;;AAID,IAAA,QACEA,GAAA,CAAC,oBAAoB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,IAAI,YACxCA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,eAAe,EAAA,GAAM,IAAI,EAAA,QAAA,EACtC,QAAQ,KAAK,QAAQ,IACpBC,4BACG,cAAc,EACd,cAAc,CAAA,EAAA,CACd,KAEHA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACG,cAAc,EACd,cAAc,CAAA,EAAA,CACd,CACJ,EAAA,CACG,EAAA,CACwB;AAEpC;;"}

package/dist/esm/components/Collapses.js

@@ -0,0 +1,99 @@
+/* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+import { jsx } from 'react/jsx-runtime';
+import React, { useState } from 'react';
+import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
+import { withSubComponents } from '../helpers/withSubComponents.js';
+import { useBulmaClasses } from '../helpers/useBulmaClasses.js';
+import { Collapse } from './Collapse.js';
+import { CollapsesItemContext } from './collapsesContext.js';
+
+/** Either mode's value as the list of open indexes. */
+function toIndexes(value) {
+    if (Array.isArray(value))
+        return value;
+    return typeof value === 'number' ? [value] : [];
+}
+/**
+ * Flattens Fragment children (recursively) so each item inside one gets its
+ * own index rather than sharing the fragment's. Children.toArray keys restart
+ * at ".0" inside each fragment, so those children are re-keyed with the
+ * fragment's own key as a prefix, the way Avatars does it.
+ */
+function flattenChildren(children, keyPrefix = '') {
+    return React.Children.toArray(children).flatMap(child => {
+        if (!React.isValidElement(child))
+            return [child];
+        if (child.type === React.Fragment) {
+            return flattenChildren(child.props.children, keyPrefix + child.key);
+        }
+        return [
+            keyPrefix
+                ? React.cloneElement(child, { key: keyPrefix + child.key })
+                : child,
+        ];
+    });
+}
+/**
+ * The `Collapses` component groups `Collapse` items into an accordion that keeps one item open at a time, or any number with `multiple`.
+ *
+ * @function
+ * @param {CollapsesProps} props - Props for the Collapses component.
+ * @returns {JSX.Element} The rendered group.
+ *
+ * @example
+ * // Accordion: one item open at a time, the first to start with
+ * <Collapses defaultValue={0}>
+ *   <Collapse bordered trigger={<strong>Shipping</strong>}>…</Collapse>
+ *   <Collapse bordered trigger={<strong>Returns</strong>}>…</Collapse>
+ * </Collapses>
+ *
+ * @example
+ * // Controlled, with items that open independently
+ * const [open, setOpen] = useState<number[]>([]);
+ * <Collapses multiple value={open} onChange={setOpen}>…</Collapses>
+ */
+const CollapsesComponent = ({ multiple = false, value, defaultValue, onChange, seamless = false, className, children, ...props }) => {
+    const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });
+    // Controlled vs uncontrolled, as in Tabs. State is held as a list of open
+    // indexes in both modes; `multiple` only decides how a change is computed
+    // and which shape `onChange` receives.
+    const isControlled = value !== undefined;
+    const [internalOpen, setInternalOpen] = useState(() => toIndexes(defaultValue));
+    const openIndexes = isControlled ? toIndexes(value) : internalOpen;
+    // Each mode types `onChange` for its own shape, and the value built below
+    // always matches `multiple`, the union's discriminant.
+    const reportChange = onChange;
+    const setItemOpen = (index, open) => {
+        const others = openIndexes.filter(i => i !== index);
+        // Single mode keeps at most one item open, so opening one drops the rest.
+        // Ascending order, whatever order the items were opened in, so the value
+        // reads and compares the same way however the user got there.
+        const next = (open ? (multiple ? [...others, index] : [index]) : others).sort((a, b) => a - b);
+        if (!isControlled)
+            setInternalOpen(next);
+        reportChange?.(multiple ? next : (next[0] ?? null));
+    };
+    const groupClasses = usePrefixedClassNames('collapses', {
+        'is-seamless': seamless,
+    });
+    const combinedClasses = classNames(groupClasses, bulmaHelperClasses, className);
+    const items = [];
+    let index = 0;
+    for (const child of flattenChildren(children)) {
+        if (!React.isValidElement(child)) {
+            items.push(child);
+            continue;
+        }
+        const itemIndex = index;
+        index += 1;
+        items.push(jsx(CollapsesItemContext.Provider, { value: {
+                open: openIndexes.includes(itemIndex),
+                setOpen: open => setItemOpen(itemIndex, open),
+            }, children: child }, child.key));
+    }
+    return (jsx("div", { className: combinedClasses, ...rest, children: items }));
+};
+const Collapses = withSubComponents(CollapsesComponent, { Collapse }, 'Collapses');
+
+export { Collapses };
+//# sourceMappingURL=Collapses.js.map

package/dist/esm/components/Collapses.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapses.js","sources":["../../../src/components/Collapses.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { Collapse } from './Collapse';\nimport { CollapsesItemContext } from './collapsesContext';\n\n/**\n * Props shared by both modes of the Collapses component.\n */\ninterface CollapsesBaseProps\n  extends\n    Omit<\n      React.HTMLAttributes<HTMLDivElement>,\n      'color' | 'defaultValue' | 'onChange'\n    >,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Joins the items into one block, with no gap between them and only the outer corners rounded. The joins show on `bordered` items. */\n  seamless?: boolean;\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** The `Collapse` items. Each child element is one item, indexed from 0 in order, with the children of a fragment counted one by one. A child that sets its own `open` keeps it: the group leaves that item alone. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for Collapses in single mode, the accordion: opening one item closes the others.\n */\nexport interface CollapsesSingleProps extends CollapsesBaseProps {\n  /**\n   * Lets items open independently. Without it, opening one item closes the others.\n   * @defaultValue false\n   */\n  multiple?: false;\n  /** Controlled open items: the index of the open item, or `null` for none. With `multiple`, an array of indexes. An index is a position among the children, so rendering an item conditionally or reordering them moves the open state onto a neighbour: render every item and hide one with `visibility=\"hidden\"`, or keep `value` in step yourself. */\n  value?: number | null;\n  /** Open items for uncontrolled use, as an index or `null` (the default, none open). With `multiple`, an array of indexes, empty by default. Indexes are positions among the children, as for `value`. */\n  defaultValue?: number | null;\n  /** Called with the new open items each time a trigger asks for a change, whether or not `value` is set: an index or `null`, or with `multiple` an array of indexes in ascending order. Indexes are positions among the children, as for `value`. */\n  onChange?: (value: number | null) => void;\n}\n\n/**\n * Props for Collapses with `multiple`: items open and close independently.\n */\nexport interface CollapsesMultipleProps extends CollapsesBaseProps {\n  /**\n   * Lets items open independently. Without it, opening one item closes the others.\n   * @defaultValue false\n   */\n  multiple: true;\n  /** Controlled open items: the index of the open item, or `null` for none. With `multiple`, an array of indexes. An index is a position among the children, so rendering an item conditionally or reordering them moves the open state onto a neighbour: render every item and hide one with `visibility=\"hidden\"`, or keep `value` in step yourself. */\n  value?: number[];\n  /** Open items for uncontrolled use, as an index or `null` (the default, none open). With `multiple`, an array of indexes, empty by default. Indexes are positions among the children, as for `value`. */\n  defaultValue?: number[];\n  /** Called with the new open items each time a trigger asks for a change, whether or not `value` is set: an index or `null`, or with `multiple` an array of indexes in ascending order. Indexes are positions among the children, as for `value`. */\n  onChange?: (value: number[]) => void;\n}\n\n/**\n * Props for the Collapses component, a discriminated union on `multiple`: the open items are an index (or `null`) in single mode and an array of indexes with `multiple`.\n */\nexport type CollapsesProps = CollapsesSingleProps | CollapsesMultipleProps;\n\n/** Either mode's value as the list of open indexes. */\nfunction toIndexes(value: number | number[] | null | undefined): number[] {\n  if (Array.isArray(value)) return value;\n  return typeof value === 'number' ? [value] : [];\n}\n\n/**\n * Flattens Fragment children (recursively) so each item inside one gets its\n * own index rather than sharing the fragment's. Children.toArray keys restart\n * at \".0\" inside each fragment, so those children are re-keyed with the\n * fragment's own key as a prefix, the way Avatars does it.\n */\nfunction flattenChildren(\n  children: React.ReactNode,\n  keyPrefix = ''\n): React.ReactNode[] {\n  return React.Children.toArray(children).flatMap(child => {\n    if (!React.isValidElement(child)) return [child];\n    if (child.type === React.Fragment) {\n      return flattenChildren(\n        (child.props as { children?: React.ReactNode }).children,\n        keyPrefix + child.key\n      );\n    }\n    return [\n      keyPrefix\n        ? React.cloneElement(child, { key: keyPrefix + child.key })\n        : child,\n    ];\n  });\n}\n\n/**\n * The `Collapses` component groups `Collapse` items into an accordion that keeps one item open at a time, or any number with `multiple`.\n *\n * @function\n * @param {CollapsesProps} props - Props for the Collapses component.\n * @returns {JSX.Element} The rendered group.\n *\n * @example\n * // Accordion: one item open at a time, the first to start with\n * <Collapses defaultValue={0}>\n *   <Collapse bordered trigger={<strong>Shipping</strong>}>…</Collapse>\n *   <Collapse bordered trigger={<strong>Returns</strong>}>…</Collapse>\n * </Collapses>\n *\n * @example\n * // Controlled, with items that open independently\n * const [open, setOpen] = useState<number[]>([]);\n * <Collapses multiple value={open} onChange={setOpen}>…</Collapses>\n */\nconst CollapsesComponent: React.FC<CollapsesProps> = ({\n  multiple = false,\n  value,\n  defaultValue,\n  onChange,\n  seamless = false,\n  className,\n  children,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  // Controlled vs uncontrolled, as in Tabs. State is held as a list of open\n  // indexes in both modes; `multiple` only decides how a change is computed\n  // and which shape `onChange` receives.\n  const isControlled = value !== undefined;\n  const [internalOpen, setInternalOpen] = useState(() =>\n    toIndexes(defaultValue)\n  );\n  const openIndexes = isControlled ? toIndexes(value) : internalOpen;\n\n  // Each mode types `onChange` for its own shape, and the value built below\n  // always matches `multiple`, the union's discriminant.\n  const reportChange = onChange as\n    ((next: number | number[] | null) => void) | undefined;\n\n  const setItemOpen = (index: number, open: boolean) => {\n    const others = openIndexes.filter(i => i !== index);\n    // Single mode keeps at most one item open, so opening one drops the rest.\n    // Ascending order, whatever order the items were opened in, so the value\n    // reads and compares the same way however the user got there.\n    const next = (\n      open ? (multiple ? [...others, index] : [index]) : others\n    ).sort((a, b) => a - b);\n    if (!isControlled) setInternalOpen(next);\n    reportChange?.(multiple ? next : (next[0] ?? null));\n  };\n\n  const groupClasses = usePrefixedClassNames('collapses', {\n    'is-seamless': seamless,\n  });\n  const combinedClasses = classNames(\n    groupClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  const items: React.ReactNode[] = [];\n  let index = 0;\n  for (const child of flattenChildren(children)) {\n    if (!React.isValidElement(child)) {\n      items.push(child);\n      continue;\n    }\n    const itemIndex = index;\n    index += 1;\n    items.push(\n      <CollapsesItemContext.Provider\n        key={child.key}\n        value={{\n          open: openIndexes.includes(itemIndex),\n          setOpen: open => setItemOpen(itemIndex, open),\n        }}\n      >\n        {child}\n      </CollapsesItemContext.Provider>\n    );\n  }\n\n  return (\n    <div className={combinedClasses} {...rest}>\n      {items}\n    </div>\n  );\n};\n\nexport const Collapses = withSubComponents(\n  CollapsesComponent,\n  { Collapse },\n  'Collapses'\n);\n\nexport default Collapses;\n"],"names":["_jsx"],"mappings":"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"}

package/dist/esm/components/Dialog.js

@@ -0,0 +1,230 @@
+/* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef, useRef, useCallback, useEffect, useSyncExternalStore } from 'react';
+import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
+import { useBulmaClasses } from '../helpers/useBulmaClasses.js';
+import { useIsHydrated } from '../helpers/useIsHydrated.js';
+import { Modal } from './Modal.js';
+
+/**
+ * The `Dialog` component provides ready-made confirm and alert dialogs, so a destructive action stays one `await dialog.confirm()` call away.
+ *
+ * @function
+ * @param {DialogProps} props - Props for the Dialog component.
+ * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the dialog element.
+ * @returns {JSX.Element | null} The rendered dialog component.
+ *
+ * @example
+ * // Alert dialog
+ * <Dialog
+ *   isOpen={showAlert}
+ *   title="Success"
+ *   message="Operation completed successfully!"
+ *   type="success"
+ *   onConfirm={() => setShowAlert(false)}
+ *   showCancel={false}
+ * />
+ *
+ * @example
+ * // Confirm dialog
+ * <Dialog
+ *   isOpen={showConfirm}
+ *   title="Delete Item?"
+ *   message="This action cannot be undone."
+ *   type="danger"
+ *   confirmText="Delete"
+ *   onConfirm={handleDelete}
+ *   onCancel={() => setShowConfirm(false)}
+ * />
+ */
+const Dialog = forwardRef(({ isOpen, title, message, type = 'default', confirmText = 'OK', cancelText = 'Cancel', onConfirm, onCancel, showCancel = true, canCancel = true, focusCancel = false, icon, portal, className, ...props }, ref) => {
+    const { bulmaHelperClasses, rest } = useBulmaClasses(props);
+    const dialogRef = useRef(null);
+    // Cleanup returned by a consumer's callback ref on attach, held until detach.
+    const consumerCleanupRef = useRef(null);
+    const confirmRef = useRef(null);
+    const cancelRef = useRef(null);
+    // Handle cancel
+    const handleCancel = useCallback(() => {
+        if (canCancel) {
+            onCancel?.();
+        }
+    }, [canCancel, onCancel]);
+    // Handle confirm
+    const handleConfirm = useCallback(() => {
+        onConfirm?.();
+    }, [onConfirm]);
+    // Handle background click
+    const handleBackgroundClick = useCallback(() => {
+        if (canCancel) {
+            handleCancel();
+        }
+    }, [canCancel, handleCancel]);
+    // Moving into the portal remounts the Modal's subtree — these buttons
+    // included — so the focus effect below has to re-run against the new
+    // nodes, exactly as the Modal's own focus effect does.
+    const isHydrated = useIsHydrated();
+    const isPortaled = Boolean(portal) && isHydrated;
+    // Focus management — Dialog picks a specific button rather than the
+    // Modal's default (first focusable/root); this effect runs after the
+    // inner Modal's own focus-on-open effect, so it wins.
+    useEffect(() => {
+        if (isOpen) {
+            const buttonToFocus = focusCancel && showCancel ? cancelRef.current : confirmRef.current;
+            buttonToFocus?.focus();
+        }
+    }, [isOpen, focusCancel, showCancel, isPortaled]);
+    // Use combined ref
+    const combinedRef = useCallback((node) => {
+        dialogRef.current =
+            node;
+        if (typeof ref === 'function') {
+            // React 19 lets a callback ref return a cleanup function and detaches by
+            // running it instead of calling the ref with `null`; React 18 discards the
+            // return value entirely. Returning it from here would be a React-19-only
+            // contract, so we hold the cleanup and run it ourselves on detach — the
+            // same shape as `Dropdown`, `Modal`, `Sidebar`, `Toast` and `Carousel`.
+            // The form controls that merge a forwarded ref still discard the cleanup
+            // and detach with `ref(null)`, so this is not yet library-wide — grep
+            // `typeof ref === 'function'` for the current split.
+            if (node === null) {
+                const consumerCleanup = consumerCleanupRef.current;
+                consumerCleanupRef.current = null;
+                if (consumerCleanup) {
+                    consumerCleanup();
+                }
+                else {
+                    ref(null);
+                }
+                return;
+            }
+            const cleanup = ref(node);
+            consumerCleanupRef.current =
+                typeof cleanup === 'function' ? cleanup : null;
+        }
+        else if (ref) {
+            ref.current = node;
+        }
+    }, [ref]);
+    // Generate classes
+    const dialogClasses = usePrefixedClassNames('dialog', {
+        [`is-${type}`]: type !== 'default',
+    });
+    const headerClass = usePrefixedClassNames('dialog-header');
+    const iconClass = usePrefixedClassNames('dialog-icon');
+    const titleClass = usePrefixedClassNames('dialog-title');
+    const bodyClass = usePrefixedClassNames('dialog-body');
+    const footerClass = usePrefixedClassNames('dialog-footer');
+    const cancelButtonClass = usePrefixedClassNames('button');
+    const confirmButtonClass = usePrefixedClassNames('button', {
+        'is-success': type === 'success',
+        'is-danger': type === 'danger',
+        'is-warning': type === 'warning',
+        'is-info': type === 'info',
+        'is-primary': type === 'default',
+    });
+    const combinedClasses = classNames(dialogClasses, bulmaHelperClasses, className);
+    // Get default icon based on type
+    const getDefaultIcon = () => {
+        switch (type) {
+            case 'success':
+                return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: jsx("path", { d: "M20 6L9 17l-5-5" }) }));
+            case 'danger':
+                return (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [jsx("circle", { cx: "12", cy: "12", r: "10" }), jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }), jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })] }));
+            case 'warning':
+                return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", stroke: "none", children: jsx("path", { d: "M12 2L1 21h22L12 2zm0 3.99L19.53 19H4.47L12 5.99zM11 16h2v2h-2zm0-6h2v4h-2z" }) }));
+            case 'info':
+                return (jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", stroke: "none", children: jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-1-9h2v6h-2zm0-4h2v2h-2z" }) }));
+            default:
+                return null;
+        }
+    };
+    const displayIcon = icon !== undefined ? icon : getDefaultIcon();
+    if (!isOpen) {
+        return null;
+    }
+    return (jsxs(Modal, { isActive: isOpen, onClose: handleCancel, role: "presentation", portal: portal, children: [jsx(Modal.Background, { onClick: handleBackgroundClick }), jsxs("div", { ref: combinedRef, className: combinedClasses, role: "alertdialog", "aria-modal": "true", "aria-labelledby": title ? 'dialog-title' : undefined, "aria-describedby": "dialog-message", ...rest, children: [title && (jsxs("div", { className: headerClass, children: [displayIcon && jsx("span", { className: iconClass, children: displayIcon }), jsx("h3", { id: "dialog-title", className: titleClass, children: title })] })), jsx("div", { id: "dialog-message", className: bodyClass, children: message }), jsxs("div", { className: footerClass, children: [showCancel && (jsx("button", { ref: cancelRef, type: "button", className: cancelButtonClass, onClick: handleCancel, children: cancelText })), jsx("button", { ref: confirmRef, type: "button", className: confirmButtonClass, onClick: handleConfirm, children: confirmText })] })] })] }));
+});
+Dialog.displayName = 'Dialog';
+let dialogListeners = new Set();
+let currentDialog = null;
+// DialogContainer renders from the open dialog rather than from updates alone,
+// so a dialog raised before it mounted still opens once it does.
+const getCurrentDialog = () => currentDialog;
+// The server renders no dialog: its copy of this module is shared by every
+// request, so the dialog it holds may belong to another page. Hydration reads
+// the same empty value, which keeps the first client render matching the
+// server's, and the dialog opens right after.
+const getServerDialog = () => null;
+const notifyDialogListeners = () => {
+    dialogListeners.forEach(listener => listener(currentDialog));
+};
+/**
+ * Programmatic dialog API for showing dialogs from anywhere.
+ */
+const dialog = {
+    /**
+     * Show an alert dialog. Returns a promise that resolves when closed.
+     */
+    alert: (options) => {
+        return new Promise(resolve => {
+            const opts = typeof options === 'string' ? { message: options } : options;
+            currentDialog = {
+                type: 'alert',
+                options: opts,
+                resolve: () => resolve(),
+            };
+            notifyDialogListeners();
+        });
+    },
+    /**
+     * Show a confirm dialog. Returns a promise that resolves to true/false.
+     */
+    confirm: (options) => {
+        return new Promise(resolve => {
+            const opts = typeof options === 'string' ? { message: options } : options;
+            currentDialog = {
+                type: 'confirm',
+                options: opts,
+                resolve: value => resolve(Boolean(value)),
+            };
+            notifyDialogListeners();
+        });
+    },
+    /**
+     * Close the current dialog.
+     */
+    close: (value) => {
+        if (currentDialog) {
+            currentDialog.resolve(value);
+            currentDialog = null;
+            notifyDialogListeners();
+        }
+    },
+    /**
+     * Subscribe to dialog changes.
+     */
+    subscribe: (listener) => {
+        dialogListeners.add(listener);
+        return () => dialogListeners.delete(listener);
+    },
+};
+/**
+ * DialogContainer component to render programmatic dialogs.
+ * Place this once at the root of your app.
+ *
+ * @function
+ * @returns {JSX.Element | null} The rendered dialog, or null if none is active.
+ */
+const DialogContainer = () => {
+    // Starts from the dialog already open instead of none, then follows changes.
+    const current = useSyncExternalStore(dialog.subscribe, getCurrentDialog, getServerDialog);
+    if (!current) {
+        return null;
+    }
+    const { type, options } = current;
+    return (jsx(Dialog, { isOpen: true, title: options.title, message: options.message, type: options.type, confirmText: options.confirmText, cancelText: options.cancelText, icon: options.icon, showCancel: type === 'confirm', focusCancel: options.focusCancel, onConfirm: () => dialog.close(type === 'confirm' ? true : undefined), onCancel: () => dialog.close(type === 'confirm' ? false : undefined) }));
+};
+
+export { Dialog, DialogContainer, dialog };
+//# sourceMappingURL=Dialog.js.map

package/dist/esm/components/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","sources":["../../../src/components/Dialog.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n  useSyncExternalStore,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { Modal } from './Modal';\n\n/** Valid dialog type/color values. */\nexport type DialogType = 'default' | 'success' | 'danger' | 'warning' | 'info';\n\n/**\n * Props for the Dialog component.\n * @extraProp {string} [className] - Additional CSS classes.\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the dialog element.\n */\nexport interface DialogProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color'> {\n  /** Whether the dialog is open (required). */\n  isOpen: boolean;\n  /** Dialog title. */\n  title?: string;\n  /** Dialog message/content (required). */\n  message: string | React.ReactNode;\n  /** The type/color of the dialog. Default: 'default'. */\n  type?: DialogType;\n  /** Text for confirm button. Default: 'OK'. */\n  confirmText?: string;\n  /** Text for cancel button. Default: 'Cancel'. */\n  cancelText?: string;\n  /** Callback when confirm button is clicked. */\n  onConfirm?: () => void;\n  /** Callback when cancel button is clicked or dismissed. */\n  onCancel?: () => void;\n  /** Whether to show cancel button. Default: true for confirm dialogs. */\n  showCancel?: boolean;\n  /** Whether the dialog can be dismissed. Default: true. */\n  canCancel?: boolean;\n  /** Focus cancel button instead of confirm. Default: false. */\n  focusCancel?: boolean;\n  /** Custom icon to display. */\n  icon?: React.ReactNode;\n  /**\n   * Renders the dialog into a portal target instead of inline. Forwarded to\n   * the underlying `Modal`; see its `portal` prop for the accepted values.\n   * @defaultValue false\n   */\n  portal?: boolean | string | HTMLElement;\n}\n\n/**\n * The `Dialog` component provides ready-made confirm and alert dialogs, so a destructive action stays one `await dialog.confirm()` call away.\n *\n * @function\n * @param {DialogProps} props - Props for the Dialog component.\n * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the dialog element.\n * @returns {JSX.Element | null} The rendered dialog component.\n *\n * @example\n * // Alert dialog\n * <Dialog\n *   isOpen={showAlert}\n *   title=\"Success\"\n *   message=\"Operation completed successfully!\"\n *   type=\"success\"\n *   onConfirm={() => setShowAlert(false)}\n *   showCancel={false}\n * />\n *\n * @example\n * // Confirm dialog\n * <Dialog\n *   isOpen={showConfirm}\n *   title=\"Delete Item?\"\n *   message=\"This action cannot be undone.\"\n *   type=\"danger\"\n *   confirmText=\"Delete\"\n *   onConfirm={handleDelete}\n *   onCancel={() => setShowConfirm(false)}\n * />\n */\nexport const Dialog = forwardRef<HTMLDivElement, DialogProps>(\n  (\n    {\n      isOpen,\n      title,\n      message,\n      type = 'default',\n      confirmText = 'OK',\n      cancelText = 'Cancel',\n      onConfirm,\n      onCancel,\n      showCancel = true,\n      canCancel = true,\n      focusCancel = false,\n      icon,\n      portal,\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const dialogRef = useRef<HTMLDivElement>(null);\n    // Cleanup returned by a consumer's callback ref on attach, held until detach.\n    const consumerCleanupRef = useRef<(() => void) | null>(null);\n    const confirmRef = useRef<HTMLButtonElement>(null);\n    const cancelRef = useRef<HTMLButtonElement>(null);\n\n    // Handle cancel\n    const handleCancel = useCallback(() => {\n      if (canCancel) {\n        onCancel?.();\n      }\n    }, [canCancel, onCancel]);\n\n    // Handle confirm\n    const handleConfirm = useCallback(() => {\n      onConfirm?.();\n    }, [onConfirm]);\n\n    // Handle background click\n    const handleBackgroundClick = useCallback(() => {\n      if (canCancel) {\n        handleCancel();\n      }\n    }, [canCancel, handleCancel]);\n\n    // Moving into the portal remounts the Modal's subtree — these buttons\n    // included — so the focus effect below has to re-run against the new\n    // nodes, exactly as the Modal's own focus effect does.\n    const isHydrated = useIsHydrated();\n    const isPortaled = Boolean(portal) && isHydrated;\n\n    // Focus management — Dialog picks a specific button rather than the\n    // Modal's default (first focusable/root); this effect runs after the\n    // inner Modal's own focus-on-open effect, so it wins.\n    useEffect(() => {\n      if (isOpen) {\n        const buttonToFocus =\n          focusCancel && showCancel ? cancelRef.current : confirmRef.current;\n        buttonToFocus?.focus();\n      }\n    }, [isOpen, focusCancel, showCancel, isPortaled]);\n\n    // Use combined ref\n    const combinedRef = useCallback(\n      (node: HTMLDivElement | null) => {\n        (dialogRef as React.MutableRefObject<HTMLDivElement | null>).current =\n          node;\n        if (typeof ref === 'function') {\n          // React 19 lets a callback ref return a cleanup function and detaches by\n          // running it instead of calling the ref with `null`; React 18 discards the\n          // return value entirely. Returning it from here would be a React-19-only\n          // contract, so we hold the cleanup and run it ourselves on detach — the\n          // same shape as `Dropdown`, `Modal`, `Sidebar`, `Toast` and `Carousel`.\n          // The form controls that merge a forwarded ref still discard the cleanup\n          // and detach with `ref(null)`, so this is not yet library-wide — grep\n          // `typeof ref === 'function'` for the current split.\n          if (node === null) {\n            const consumerCleanup = consumerCleanupRef.current;\n            consumerCleanupRef.current = null;\n            if (consumerCleanup) {\n              consumerCleanup();\n            } else {\n              ref(null);\n            }\n            return;\n          }\n          const cleanup: unknown = ref(node);\n          consumerCleanupRef.current =\n            typeof cleanup === 'function' ? (cleanup as () => void) : null;\n        } else if (ref) {\n          (ref as React.MutableRefObject<HTMLDivElement | null>).current = node;\n        }\n      },\n      [ref]\n    );\n\n    // Generate classes\n    const dialogClasses = usePrefixedClassNames('dialog', {\n      [`is-${type}`]: type !== 'default',\n    });\n    const headerClass = usePrefixedClassNames('dialog-header');\n    const iconClass = usePrefixedClassNames('dialog-icon');\n    const titleClass = usePrefixedClassNames('dialog-title');\n    const bodyClass = usePrefixedClassNames('dialog-body');\n    const footerClass = usePrefixedClassNames('dialog-footer');\n    const cancelButtonClass = usePrefixedClassNames('button');\n    const confirmButtonClass = usePrefixedClassNames('button', {\n      'is-success': type === 'success',\n      'is-danger': type === 'danger',\n      'is-warning': type === 'warning',\n      'is-info': type === 'info',\n      'is-primary': type === 'default',\n    });\n\n    const combinedClasses = classNames(\n      dialogClasses,\n      bulmaHelperClasses,\n      className\n    );\n\n    // Get default icon based on type\n    const getDefaultIcon = () => {\n      switch (type) {\n        case 'success':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth=\"2\"\n            >\n              <path d=\"M20 6L9 17l-5-5\" />\n            </svg>\n          );\n        case 'danger':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth=\"2\"\n            >\n              <circle cx=\"12\" cy=\"12\" r=\"10\" />\n              <line x1=\"15\" y1=\"9\" x2=\"9\" y2=\"15\" />\n              <line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"15\" />\n            </svg>\n          );\n        case 'warning':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 24 24\"\n              fill=\"currentColor\"\n              stroke=\"none\"\n            >\n              <path d=\"M12 2L1 21h22L12 2zm0 3.99L19.53 19H4.47L12 5.99zM11 16h2v2h-2zm0-6h2v4h-2z\" />\n            </svg>\n          );\n        case 'info':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              viewBox=\"0 0 24 24\"\n              fill=\"currentColor\"\n              stroke=\"none\"\n            >\n              <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-1-9h2v6h-2zm0-4h2v2h-2z\" />\n            </svg>\n          );\n        default:\n          return null;\n      }\n    };\n\n    const displayIcon = icon !== undefined ? icon : getDefaultIcon();\n\n    if (!isOpen) {\n      return null;\n    }\n\n    return (\n      <Modal\n        isActive={isOpen}\n        onClose={handleCancel}\n        role=\"presentation\"\n        portal={portal}\n      >\n        <Modal.Background onClick={handleBackgroundClick} />\n        <div\n          ref={combinedRef}\n          className={combinedClasses}\n          role=\"alertdialog\"\n          aria-modal=\"true\"\n          aria-labelledby={title ? 'dialog-title' : undefined}\n          aria-describedby=\"dialog-message\"\n          {...rest}\n        >\n          {title && (\n            <div className={headerClass}>\n              {displayIcon && <span className={iconClass}>{displayIcon}</span>}\n              <h3 id=\"dialog-title\" className={titleClass}>\n                {title}\n              </h3>\n            </div>\n          )}\n          <div id=\"dialog-message\" className={bodyClass}>\n            {message}\n          </div>\n          <div className={footerClass}>\n            {showCancel && (\n              <button\n                ref={cancelRef}\n                type=\"button\"\n                className={cancelButtonClass}\n                onClick={handleCancel}\n              >\n                {cancelText}\n              </button>\n            )}\n            <button\n              ref={confirmRef}\n              type=\"button\"\n              className={confirmButtonClass}\n              onClick={handleConfirm}\n            >\n              {confirmText}\n            </button>\n          </div>\n        </div>\n      </Modal>\n    );\n  }\n);\n\nDialog.displayName = 'Dialog';\n\n// Dialog Manager for programmatic dialogs\n\n/**\n * Options for showing a programmatic alert dialog.\n */\nexport interface AlertOptions {\n  /** Dialog title. */\n  title?: string;\n  /** Dialog message/content. */\n  message: string | React.ReactNode;\n  /** Dialog type/color. */\n  type?: DialogType;\n  /** Text for the confirm button. */\n  confirmText?: string;\n  /** Custom icon to display. */\n  icon?: React.ReactNode;\n}\n\n/**\n * Options for showing a programmatic confirm dialog.\n */\nexport interface ConfirmOptions extends AlertOptions {\n  /** Text for the cancel button. */\n  cancelText?: string;\n  /** Focus cancel button instead of confirm. */\n  focusCancel?: boolean;\n}\n\n/**\n * Options for showing a programmatic prompt dialog.\n */\nexport interface PromptOptions extends ConfirmOptions {\n  /** Input placeholder text. */\n  placeholder?: string;\n  /** Default input value. */\n  defaultValue?: string;\n}\n\ntype DialogResolve = (value?: void | boolean | string) => void;\n\ntype DialogState = {\n  type: 'alert' | 'confirm' | 'prompt';\n  options: PromptOptions;\n  resolve: DialogResolve;\n};\n\nlet dialogListeners: Set<(dialog: DialogState | null) => void> = new Set();\nlet currentDialog: DialogState | null = null;\n\n// DialogContainer renders from the open dialog rather than from updates alone,\n// so a dialog raised before it mounted still opens once it does.\nconst getCurrentDialog = () => currentDialog;\n\n// The server renders no dialog: its copy of this module is shared by every\n// request, so the dialog it holds may belong to another page. Hydration reads\n// the same empty value, which keeps the first client render matching the\n// server's, and the dialog opens right after.\nconst getServerDialog = (): DialogState | null => null;\n\nconst notifyDialogListeners = () => {\n  dialogListeners.forEach(listener => listener(currentDialog));\n};\n\n/**\n * Programmatic dialog API for showing dialogs from anywhere.\n */\nexport const dialog = {\n  /**\n   * Show an alert dialog. Returns a promise that resolves when closed.\n   */\n  alert: (options: AlertOptions | string): Promise<void> => {\n    return new Promise<void>(resolve => {\n      const opts = typeof options === 'string' ? { message: options } : options;\n      currentDialog = {\n        type: 'alert',\n        options: opts,\n        resolve: () => resolve(),\n      };\n      notifyDialogListeners();\n    });\n  },\n\n  /**\n   * Show a confirm dialog. Returns a promise that resolves to true/false.\n   */\n  confirm: (options: ConfirmOptions | string): Promise<boolean> => {\n    return new Promise<boolean>(resolve => {\n      const opts = typeof options === 'string' ? { message: options } : options;\n      currentDialog = {\n        type: 'confirm',\n        options: opts,\n        resolve: value => resolve(Boolean(value)),\n      };\n      notifyDialogListeners();\n    });\n  },\n\n  /**\n   * Close the current dialog.\n   */\n  close: (value?: void | boolean | string): void => {\n    if (currentDialog) {\n      currentDialog.resolve(value);\n      currentDialog = null;\n      notifyDialogListeners();\n    }\n  },\n\n  /**\n   * Subscribe to dialog changes.\n   */\n  subscribe: (listener: (dialog: DialogState | null) => void): (() => void) => {\n    dialogListeners.add(listener);\n    return () => dialogListeners.delete(listener);\n  },\n};\n\n/**\n * DialogContainer component to render programmatic dialogs.\n * Place this once at the root of your app.\n *\n * @function\n * @returns {JSX.Element | null} The rendered dialog, or null if none is active.\n */\nexport const DialogContainer: React.FC = () => {\n  // Starts from the dialog already open instead of none, then follows changes.\n  const current = useSyncExternalStore(\n    dialog.subscribe,\n    getCurrentDialog,\n    getServerDialog\n  );\n\n  if (!current) {\n    return null;\n  }\n\n  const { type, options } = current;\n\n  return (\n    <Dialog\n      isOpen\n      title={options.title}\n      message={options.message}\n      type={options.type}\n      confirmText={options.confirmText}\n      cancelText={options.cancelText}\n      icon={options.icon}\n      showCancel={type === 'confirm'}\n      focusCancel={options.focusCancel}\n      onConfirm={() => dialog.close(type === 'confirm' ? true : undefined)}\n      onCancel={() => dialog.close(type === 'confirm' ? false : undefined)}\n    />\n  );\n};\n\nexport default Dialog;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}