@allxsmith/bestax-bulma 5.56.0 → 5.57.0

package/dist/esm/elements/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../src/elements/Loader.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Loader component.\n *\n * There is no color prop, and the text and background color helpers are left\n * out on purpose: Bulma draws the ring in `--bulma-border`, so a text color\n * never reaches it. For a colored spinner over a region, use `Loading`.\n *\n * @extraProp {React.Ref<HTMLSpanElement>} [ref] - Ref forwarded to the loader element.\n */\nexport interface LoaderProps\n  extends\n    Omit<React.HTMLAttributes<HTMLSpanElement>, 'color' | 'children'>,\n    Omit<\n      BulmaClassesProps,\n      'color' | 'colorShade' | 'backgroundColor' | 'backgroundColorShade'\n    > {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Accessible name of the progress indicator. Name what is loading\n   * (`\"Saving row\"`) when more than one loader can be on screen at once.\n   */\n  ariaLabel?: string;\n}\n\n/**\n * The `Loader` component renders Bulma's `.loader`, a small spinning ring for inline loading states.\n *\n * The ring is `1em` square, so `textSize` scales it. It is exposed as an\n * indeterminate `progressbar` named by `ariaLabel`, and it stops spinning\n * under `prefers-reduced-motion: reduce` while staying drawn. In forced\n * colors its two open sides take the page's color, so it stays open.\n *\n * @function\n * @param {LoaderProps} props - Props for the Loader component.\n * @param {React.Ref<HTMLSpanElement>} ref - Forwarded ref to the loader element.\n * @returns {JSX.Element} The rendered loader element.\n *\n * @example\n * <Loader />\n *\n * @example\n * <Loader textSize=\"3\" ariaLabel=\"Saving\" />\n */\nexport const Loader = forwardRef<HTMLSpanElement, LoaderProps>(\n  ({ className, ariaLabel = 'Loading', ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const loaderClass = usePrefixedClassNames('loader');\n\n    // role=\"progressbar\", not role=\"status\": a status region mounted together\n    // with its text is not reliably announced, so the loader claims only what\n    // it can deliver, a named indicator found by reading the page. No\n    // aria-valuenow, because the progress is indeterminate.\n    return (\n      <span\n        ref={ref}\n        className={classNames(loaderClass, bulmaHelperClasses, className)}\n        role=\"progressbar\"\n        aria-label={ariaLabel}\n        {...rest}\n      />\n    );\n  }\n);\n\nLoader.displayName = 'Loader';\n"],"names":["_jsx"],"mappings":";;;;;;AA6BA;;;;;;;;;;;;;;;;;;AAkBG;MACU,MAAM,GAAG,UAAU,CAC9B,CAAC,EAAE,SAAS,EAAE,SAAS,GAAG,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;IACtD,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,KAAK,CAAC;AAC3D,IAAA,MAAM,WAAW,GAAG,qBAAqB,CAAC,QAAQ,CAAC;;;;;IAMnD,QACEA,GAAA,CAAA,MAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE,kBAAkB,EAAE,SAAS,CAAC,EACjE,IAAI,EAAC,aAAa,EAAA,YAAA,EACN,SAAS,EAAA,GACjB,IAAI,EAAA,CACR;AAEN,CAAC;AAGH,MAAM,CAAC,WAAW,GAAG,QAAQ;;"}
+{"version":3,"file":"Loader.js","sources":["../../../src/elements/Loader.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Loader component.\n *\n * There is no color prop, and the text and background color helpers are left\n * out on purpose: Bulma draws the ring in `--bulma-border`, so a text color\n * never reaches it. For a colored spinner over a region, use `Loading`.\n *\n * @extraProp {React.Ref<HTMLSpanElement>} [ref] - Ref forwarded to the loader element.\n */\nexport interface LoaderProps\n  extends\n    Omit<React.HTMLAttributes<HTMLSpanElement>, 'color' | 'children'>,\n    Omit<\n      BulmaClassesProps,\n      'color' | 'colorShade' | 'backgroundColor' | 'backgroundColorShade'\n    > {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Accessible name of the progress indicator. Name what is loading\n   * (`\"Saving row\"`) when more than one loader can be on screen at once.\n   */\n  ariaLabel?: string;\n}\n\n/**\n * The `Loader` component renders Bulma's `.loader`, a small spinning ring for inline loading states.\n *\n * The ring is `1em` square, so `textSize` scales it. It is exposed as an\n * indeterminate `progressbar` named by `ariaLabel`, and it stops spinning\n * under `prefers-reduced-motion: reduce` while staying drawn. In forced\n * colors its two open sides take the page's color, so it stays open.\n *\n * @function\n * @param {LoaderProps} props - Props for the Loader component.\n * @param {React.Ref<HTMLSpanElement>} ref - Forwarded ref to the loader element.\n * @returns {JSX.Element} The rendered loader element.\n *\n * @example\n * <Loader />\n *\n * @example\n * <Loader textSize=\"3\" ariaLabel=\"Saving\" />\n */\nexport const Loader = forwardRef<HTMLSpanElement, LoaderProps>(\n  ({ className, ariaLabel = 'Loading', ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const loaderClass = usePrefixedClassNames('loader');\n\n    // role=\"progressbar\", not role=\"status\": a status region mounted together\n    // with its text is not reliably announced, so the loader claims only what\n    // it can deliver, a named indicator found by reading the page. No\n    // aria-valuenow, because the progress is indeterminate.\n    return (\n      <span\n        ref={ref}\n        className={classNames(loaderClass, bulmaHelperClasses, className)}\n        role=\"progressbar\"\n        aria-label={ariaLabel}\n        {...rest}\n      />\n    );\n  }\n);\n\nLoader.displayName = 'Loader';\n"],"names":["_jsx"],"mappings":";;;;;;;AA6BA;;;;;;;;;;;;;;;;;;AAkBG;MACU,MAAM,GAAG,UAAU,CAC9B,CAAC,EAAE,SAAS,EAAE,SAAS,GAAG,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;IACtD,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,KAAK,CAAC;AAC3D,IAAA,MAAM,WAAW,GAAG,qBAAqB,CAAC,QAAQ,CAAC;;;;;IAMnD,QACEA,GAAA,CAAA,MAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE,kBAAkB,EAAE,SAAS,CAAC,EACjE,IAAI,EAAC,aAAa,EAAA,YAAA,EACN,SAAS,EAAA,GACjB,IAAI,EAAA,CACR;AAEN,CAAC;AAGH,MAAM,CAAC,WAAW,GAAG,QAAQ;;"}

package/dist/esm/elements/Notification.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useSyncExternalStore, useMemo, useRef, useCallback, useState, useEffect } from 'react';
 import { createPortal } from 'react-dom';

package/dist/esm/elements/Notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","sources":["../../../src/elements/Notification.tsx"],"sourcesContent":["import React, {\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  useCallback,\n  useSyncExternalStore,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { warnUnstyledColor } from '../helpers/colorDeprecations';\nimport { groupIntoPositionStacks } from '../helpers/positionStacks';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { usePortalContainer } from '../helpers/portal';\nimport { LocalePortalScope } from '../helpers/LocaleProvider';\nimport { StatusRegion, spokenText } from '../helpers/statusRegion';\n\n/**\n * Props for the Notification component.\n */\nexport interface NotificationProps\n  extends\n    React.HTMLAttributes<HTMLDivElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Bulma color modifier for the notification (renders `is-<color>`).\n   *\n   * Only `primary`, `link`, `info`, `success`, `warning`, `danger`, `black`,\n   * `white`, `light`, and `dark` have shipped CSS for `.notification`. Every\n   * other value the union accepts emits a class no CSS rule matches, so the\n   * notification renders unstyled; those log a console warning in development\n   * and will be removed from this union in the next major version.\n   */\n  color?: (typeof validColors)[number];\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Use the light color variant. */\n  isLight?: boolean;\n  /**\n   * Shows a close (delete) button in the notification. It renders\n   * `type=\"button\"`, so it does not submit a form around it.\n   *\n   * The notification also takes `has-delete`, which pads its end by\n   * `--bulma-notification-delete-padding-inline-end` so the text clears the\n   * button. That rule ships in bestax's stylesheets, not Bulma's, so an app\n   * styled by Bulma's CSS alone keeps Bulma's padding.\n   */\n  hasDelete?: boolean;\n  /** Callback fired when the delete button is clicked. */\n  onDelete?: () => void;\n  /** Content inside the notification. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Notification` component is a Bulma-styled alert/message area for providing feedback, warnings, or information to users.\n *\n * @function\n * @param {NotificationProps} props - Props for the Notification component.\n * @returns {JSX.Element} The rendered notification element.\n * @see {@link https://bulma.io/documentation/elements/notification/ | Bulma Notification documentation}\n */\nexport const Notification: React.FC<NotificationProps> = ({\n  className,\n  color,\n  textColor,\n  isLight,\n  hasDelete,\n  onDelete,\n  children,\n  ...props\n}) => {\n  warnUnstyledColor('Notification', color);\n\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    ...props,\n  });\n\n  const bulmaClasses = usePrefixedClassNames('notification', {\n    [`is-${color}`]: color && validColors.includes(color),\n    'is-light': isLight,\n    'has-delete': hasDelete,\n  });\n\n  const deleteClasses = usePrefixedClassNames('delete');\n\n  const notificationClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  return (\n    <div className={notificationClasses} {...rest}>\n      {hasDelete && (\n        <button\n          type=\"button\"\n          className={deleteClasses}\n          onClick={onDelete}\n          aria-label=\"Close notification\"\n        />\n      )}\n      {children}\n    </div>\n  );\n};\n\n// Programmatic Notification API\n\n/** Screen positions where programmatic notifications can be displayed. */\nexport type NotificationPosition =\n  'top-left' | 'top' | 'top-right' | 'bottom-left' | 'bottom' | 'bottom-right';\n\n/**\n * Options for showing a programmatic notification.\n */\nexport interface NotificationOptions {\n  /**\n   * The message to display.\n   *\n   * For a notification other than `danger` and `warning`, NotificationContainer\n   * announces the text the message renders, with an element's `aria-label`,\n   * or an image's `alt`, standing in for what's inside it, a break between\n   * block-level elements, and parts that are `aria-hidden`, `hidden` or\n   * inline-styled `display: none` left out. Other ways of naming or hiding\n   * content, such as `aria-labelledby`, CSS-generated content or a\n   * stylesheet's `display: none`, aren't followed, so a message that relies on\n   * them can be announced differently from what a screen reader would read.\n   */\n  message: string | React.ReactNode;\n  /**\n   * Bulma color modifier for the notification (renders `is-<color>`).\n   *\n   * Only `primary`, `link`, `info`, `success`, `warning`, `danger`, `black`,\n   * `white`, `light`, and `dark` have shipped CSS for `.notification`. Every\n   * other value the union accepts emits a class no CSS rule matches, so the\n   * notification renders unstyled; those log a console warning in development\n   * and will be removed from this union in the next major version.\n   */\n  color?: (typeof validColors)[number];\n  /** Use the light color variant. */\n  isLight?: boolean;\n  /** Duration in ms before auto-close. Default 3000. */\n  duration?: number;\n  /**\n   * Position on the screen. A notification shown without one goes to\n   * `NotificationContainer`'s `position`.\n   */\n  position?: NotificationPosition;\n  /**\n   * When true, notifications enter a FIFO queue and display one at a time,\n   * one queue across every `position`. Default false.\n   */\n  queue?: boolean;\n  /** Show a delete (close) button. Default true. */\n  hasDelete?: boolean;\n  /** Stay open until dismissed. */\n  indefinite?: boolean;\n  /** Pause auto-close timer on hover. Default true. */\n  pauseOnHover?: boolean;\n}\n\n/**\n * Internal representation of a notification instance.\n */\ninterface NotificationInstance {\n  /** Unique identifier for this notification. */\n  id: string;\n  /** Configuration options for the notification. */\n  options: NotificationOptions;\n}\n\nlet notificationId = 0;\nconst notificationListeners: Set<(items: NotificationInstance[]) => void> =\n  new Set();\nlet notifications: NotificationInstance[] = [];\n\n// Queue support\nlet queuedNotifications: NotificationInstance[] = [];\nlet currentQueuedNotification: NotificationInstance | null = null;\n\n// The server has nowhere to portal a notification to, and its copy of this\n// module is shared by every request, so server rendering reads an empty list.\n// Hydration reads it too, which keeps the first client render matching the\n// server's.\nconst noNotifications: NotificationInstance[] = [];\nconst getServerNotifications = () => noNotifications;\n\n// What a container shows right now: the stacked notifications, then the queued\n// one on screen. NotificationContainer renders from this rather than from\n// updates alone, so notifications raised before it mounted still appear. It is\n// replaced rather than mutated, and only when listeners are notified, because\n// useSyncExternalStore needs the same array back between changes. An empty\n// list is `noNotifications` itself, so an empty store reads the same snapshot\n// on the client as on the server, and a notify that leaves nothing showing\n// when nothing was showing doesn't render the container again.\nlet visibleNotifications: NotificationInstance[] = noNotifications;\nconst getVisibleNotifications = () => visibleNotifications;\n\nconst notifyNotificationListeners = () => {\n  const allVisible = [...notifications];\n  if (currentQueuedNotification) {\n    allVisible.push(currentQueuedNotification);\n  }\n  visibleNotifications = allVisible.length > 0 ? allVisible : noNotifications;\n  notificationListeners.forEach(listener => listener([...allVisible]));\n};\n\nconst processQueuedNotification = () => {\n  if (currentQueuedNotification || queuedNotifications.length === 0) return;\n  currentQueuedNotification = queuedNotifications.shift()!;\n  notifyNotificationListeners();\n};\n\n/**\n * Programmatic notification API for showing, closing, and managing notifications.\n *\n * @example\n * notification.success('File saved successfully');\n * notification.danger('Something went wrong', { duration: 5000 });\n */\nexport const notification = {\n  /**\n   * Show a notification with the given options.\n   * @param {NotificationOptions} options - Notification configuration.\n   * @returns {string} The unique ID of the created notification.\n   */\n  show: (options: NotificationOptions): string => {\n    const id = `notification-${++notificationId}`;\n    const instance = { id, options };\n\n    if (options.queue) {\n      queuedNotifications.push(instance);\n      processQueuedNotification();\n    } else {\n      notifications.push(instance);\n      notifyNotificationListeners();\n    }\n\n    return id;\n  },\n\n  /**\n   * Show a success notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  success: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'success', ...options });\n  },\n\n  /**\n   * Show a danger notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  danger: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'danger', ...options });\n  },\n\n  /**\n   * Show a warning notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  warning: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'warning', ...options });\n  },\n\n  /**\n   * Show an info notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  info: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'info', ...options });\n  },\n\n  /**\n   * Close a specific notification by ID.\n   * @param {string} id - The notification ID to close.\n   */\n  close: (id: string): void => {\n    if (currentQueuedNotification && currentQueuedNotification.id === id) {\n      currentQueuedNotification = null;\n      processQueuedNotification();\n    } else {\n      queuedNotifications = queuedNotifications.filter(n => n.id !== id);\n      notifications = notifications.filter(n => n.id !== id);\n    }\n    notifyNotificationListeners();\n  },\n\n  /** Close all notifications and clear the queue. */\n  closeAll: (): void => {\n    notifications = [];\n    queuedNotifications = [];\n    currentQueuedNotification = null;\n    notifyNotificationListeners();\n  },\n\n  /**\n   * Subscribe to notification state changes.\n   * @param {(items: NotificationInstance[]) => void} listener - Callback invoked on changes.\n   * @returns {() => void} Unsubscribe function.\n   */\n  subscribe: (\n    listener: (items: NotificationInstance[]) => void\n  ): (() => void) => {\n    notificationListeners.add(listener);\n    return () => notificationListeners.delete(listener);\n  },\n};\n\n/**\n * Whether a notification of this color announces itself as an alert, rather\n * than politely through NotificationContainer's status region.\n *\n * @function isUrgentColor\n * @param {NotificationOptions['color']} color - The notification's color.\n * @returns {boolean} True for `danger` and `warning`.\n */\nconst isUrgentColor = (color: NotificationOptions['color']): boolean =>\n  color === 'danger' || color === 'warning';\n\n/**\n * Single auto-dismissing notification item used by NotificationContainer.\n *\n * @function\n * @param {{ instance: NotificationInstance; onClose: (id: string) => void; registerMessage: (id: string, node: HTMLElement | null) => void }} props - Component props.\n * @returns {JSX.Element} The rendered notification item.\n */\nconst NotificationItem: React.FC<{\n  instance: NotificationInstance;\n  onClose: (id: string) => void;\n  registerMessage: (id: string, node: HTMLElement | null) => void;\n}> = ({ instance, onClose, registerMessage }) => {\n  const {\n    message,\n    color,\n    isLight,\n    duration = 3000,\n    hasDelete = true,\n    indefinite = false,\n    pauseOnHover = true,\n  } = instance.options;\n\n  const [isPaused, setIsPaused] = useState(false);\n  const urgent = isUrgentColor(color);\n\n  const handleClose = useCallback(() => {\n    onClose(instance.id);\n  }, [onClose, instance.id]);\n\n  const messageRef = useCallback(\n    (node: HTMLElement | null) => {\n      registerMessage(instance.id, node);\n    },\n    [registerMessage, instance.id]\n  );\n\n  // Auto-close timer\n  useEffect(() => {\n    if (indefinite || duration === 0 || isPaused) return undefined;\n\n    const timer = setTimeout(handleClose, duration);\n    return () => clearTimeout(timer);\n  }, [duration, indefinite, isPaused, handleClose]);\n\n  const handleMouseEnter = useCallback(() => {\n    if (pauseOnHover) setIsPaused(true);\n  }, [pauseOnHover]);\n\n  const handleMouseLeave = useCallback(() => {\n    if (pauseOnHover) setIsPaused(false);\n  }, [pauseOnHover]);\n\n  return (\n    <Notification\n      color={color}\n      isLight={isLight}\n      hasDelete={hasDelete}\n      onDelete={handleClose}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      style={{ pointerEvents: 'auto' }}\n    >\n      {/* Only the message is announced, not the close button Notification\n          renders ahead of its children. Danger and warning announce\n          themselves as an assertive alert, which a screen reader reliably\n          reads out even when it arrives with its text. The rest are announced\n          through the container's status region, which reads their text from\n          this span, so it carries no role of its own that would announce them\n          a second time. */}\n      {urgent ? (\n        <span role=\"alert\" aria-live=\"assertive\">\n          {message}\n        </span>\n      ) : (\n        <span ref={messageRef}>{message}</span>\n      )}\n    </Notification>\n  );\n};\n\n// The order NotificationContainer renders its stacks in: across the top of the\n// screen, then across the bottom.\nconst notificationStackOrder: readonly NotificationPosition[] = [\n  'top-left',\n  'top',\n  'top-right',\n  'bottom-left',\n  'bottom',\n  'bottom-right',\n];\n\n/**\n * Inline style that fixes a stack of notifications to its place on the screen.\n *\n * @function\n * @param {NotificationPosition} position - Where the stack sits.\n * @returns {React.CSSProperties} The stack's style.\n */\nconst notificationStackStyle = (\n  position: NotificationPosition\n): React.CSSProperties => {\n  const isBottom = position.startsWith('bottom');\n  const isCenter = position === 'top' || position === 'bottom';\n  const isRight = position.endsWith('right');\n\n  return {\n    position: 'fixed',\n    zIndex: 100,\n    display: 'flex',\n    flexDirection: isBottom ? 'column-reverse' : 'column',\n    gap: '0.75rem',\n    padding: '1rem',\n    pointerEvents: 'none',\n    maxWidth: '100%',\n    ...(isBottom ? { bottom: 0 } : { top: 0 }),\n    ...(isCenter\n      ? { left: '50%', transform: 'translateX(-50%)', alignItems: 'center' }\n      : isRight\n        ? { right: 0, alignItems: 'flex-end' }\n        : { left: 0, alignItems: 'flex-start' }),\n  };\n};\n\n/**\n * Container component for rendering programmatic notifications.\n * Place once at your app root to enable the notification API. A notification\n * shown with a `position` appears there, and one shown without goes to the\n * container's `position`, so the container renders a stack for each position\n * in use.\n *\n * It keeps a visually hidden `role=\"status\"` live region in the page from the\n * moment it mounts, even while nothing is showing, and announces every\n * notification other than `danger` and `warning` through it, a moment after\n * the notification appears. Those notifications carry no `role=\"status\"` of\n * their own, so `getByRole('status')` finds the region, not the notification.\n * The text stays in the region briefly, even if the notification closes in\n * the meantime, and while both are up the page holds two copies of it. A\n * polite notification that closes before its announcement is written, a\n * moment after it appears, isn't announced at all. `danger` and `warning`\n * notifications announce themselves as assertive alerts. The region is hidden\n * with inline styles, so it needs no stylesheet.\n *\n * @function\n * @param {{ position?: NotificationPosition }} props - Container props.\n * @returns {JSX.Element | null} The rendered notification container, or null on the server and while hydrating.\n */\nexport const NotificationContainer: React.FC<{\n  /**\n   * Where a notification shown without a `position` of its own appears.\n   * Default: 'top-right'. When it changes, those notifications move without\n   * remounting, but one shown with its own `position` equal to the old or new\n   * value remounts and starts over as if it had just been shown.\n   */\n  position?: NotificationPosition;\n}> = ({ position = 'top-right' }) => {\n  // Starts from the notifications already showing instead of an empty list,\n  // then follows changes.\n  const items = useSyncExternalStore(\n    notification.subscribe,\n    getVisibleNotifications,\n    getServerNotifications\n  );\n  // A portal needs a document, and it has no server-rendered counterpart, so\n  // the server render and the hydrating one render nothing, and the container\n  // portals in from the render after hydration.\n  const isHydrated = useIsHydrated();\n  const resolveContainer = usePortalContainer();\n\n  // The notifications the status region announces. Danger and warning\n  // announce themselves.\n  const politeItems = useMemo(\n    () => items.filter(item => !isUrgentColor(item.options.color)),\n    [items]\n  );\n\n  // Each polite notification's message element, so the text the region\n  // announces is the text on screen, whatever the message renders.\n  const messageNodesRef = useRef(new Map<string, HTMLElement>());\n  const registerMessage = useCallback(\n    (id: string, node: HTMLElement | null) => {\n      if (node) {\n        messageNodesRef.current.set(id, node);\n      } else {\n        messageNodesRef.current.delete(id);\n      }\n    },\n    []\n  );\n  // StatusRegion only describes polite notifications that are on screen, and\n  // each of those registered its message element when it mounted. The\n  // fallback is for a notification announced without being rendered, should\n  // the container ever render fewer than it announces: a plain-text message\n  // still says itself, and anything else is skipped.\n  const describe = useCallback((item: NotificationInstance) => {\n    const node = messageNodesRef.current.get(item.id);\n    /* istanbul ignore if: every polite notification on screen registers its message element when it mounts */\n    if (!node) {\n      const { message } = item.options;\n      return typeof message === 'string' ? message : null;\n    }\n    return spokenText(node);\n  }, []);\n\n  if (typeof document === 'undefined' || !isHydrated) {\n    return null;\n  }\n\n  const stacks = groupIntoPositionStacks(\n    items,\n    item => item.options.position,\n    position,\n    notificationStackOrder\n  );\n\n  const target = resolveContainer();\n  return createPortal(\n    <LocalePortalScope target={target}>\n      {stacks.map(stack => (\n        <div key={stack.key} style={notificationStackStyle(stack.position)}>\n          {stack.items.map(item => (\n            <NotificationItem\n              key={item.id}\n              instance={item}\n              onClose={notification.close}\n              registerMessage={registerMessage}\n            />\n          ))}\n        </div>\n      ))}\n      <StatusRegion items={politeItems} describe={describe} />\n    </LocalePortalScope>,\n    target\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"Notification.js","sources":["../../../src/elements/Notification.tsx"],"sourcesContent":["import React, {\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  useCallback,\n  useSyncExternalStore,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { warnUnstyledColor } from '../helpers/colorDeprecations';\nimport { groupIntoPositionStacks } from '../helpers/positionStacks';\nimport { useIsHydrated } from '../helpers/useIsHydrated';\nimport { usePortalContainer } from '../helpers/portal';\nimport { LocalePortalScope } from '../helpers/LocaleProvider';\nimport { StatusRegion, spokenText } from '../helpers/statusRegion';\n\n/**\n * Props for the Notification component.\n */\nexport interface NotificationProps\n  extends\n    React.HTMLAttributes<HTMLDivElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Bulma color modifier for the notification (renders `is-<color>`).\n   *\n   * Only `primary`, `link`, `info`, `success`, `warning`, `danger`, `black`,\n   * `white`, `light`, and `dark` have shipped CSS for `.notification`. Every\n   * other value the union accepts emits a class no CSS rule matches, so the\n   * notification renders unstyled; those log a console warning in development\n   * and will be removed from this union in the next major version.\n   */\n  color?: (typeof validColors)[number];\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Use the light color variant. */\n  isLight?: boolean;\n  /**\n   * Shows a close (delete) button in the notification. It renders\n   * `type=\"button\"`, so it does not submit a form around it.\n   *\n   * The notification also takes `has-delete`, which pads its end by\n   * `--bulma-notification-delete-padding-inline-end` so the text clears the\n   * button. That rule ships in bestax's stylesheets, not Bulma's, so an app\n   * styled by Bulma's CSS alone keeps Bulma's padding.\n   */\n  hasDelete?: boolean;\n  /** Callback fired when the delete button is clicked. */\n  onDelete?: () => void;\n  /** Content inside the notification. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Notification` component is a Bulma-styled alert/message area for providing feedback, warnings, or information to users.\n *\n * @function\n * @param {NotificationProps} props - Props for the Notification component.\n * @returns {JSX.Element} The rendered notification element.\n * @see {@link https://bulma.io/documentation/elements/notification/ | Bulma Notification documentation}\n */\nexport const Notification: React.FC<NotificationProps> = ({\n  className,\n  color,\n  textColor,\n  isLight,\n  hasDelete,\n  onDelete,\n  children,\n  ...props\n}) => {\n  warnUnstyledColor('Notification', color);\n\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    ...props,\n  });\n\n  const bulmaClasses = usePrefixedClassNames('notification', {\n    [`is-${color}`]: color && validColors.includes(color),\n    'is-light': isLight,\n    'has-delete': hasDelete,\n  });\n\n  const deleteClasses = usePrefixedClassNames('delete');\n\n  const notificationClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  return (\n    <div className={notificationClasses} {...rest}>\n      {hasDelete && (\n        <button\n          type=\"button\"\n          className={deleteClasses}\n          onClick={onDelete}\n          aria-label=\"Close notification\"\n        />\n      )}\n      {children}\n    </div>\n  );\n};\n\n// Programmatic Notification API\n\n/** Screen positions where programmatic notifications can be displayed. */\nexport type NotificationPosition =\n  'top-left' | 'top' | 'top-right' | 'bottom-left' | 'bottom' | 'bottom-right';\n\n/**\n * Options for showing a programmatic notification.\n */\nexport interface NotificationOptions {\n  /**\n   * The message to display.\n   *\n   * For a notification other than `danger` and `warning`, NotificationContainer\n   * announces the text the message renders, with an element's `aria-label`,\n   * or an image's `alt`, standing in for what's inside it, a break between\n   * block-level elements, and parts that are `aria-hidden`, `hidden` or\n   * inline-styled `display: none` left out. Other ways of naming or hiding\n   * content, such as `aria-labelledby`, CSS-generated content or a\n   * stylesheet's `display: none`, aren't followed, so a message that relies on\n   * them can be announced differently from what a screen reader would read.\n   */\n  message: string | React.ReactNode;\n  /**\n   * Bulma color modifier for the notification (renders `is-<color>`).\n   *\n   * Only `primary`, `link`, `info`, `success`, `warning`, `danger`, `black`,\n   * `white`, `light`, and `dark` have shipped CSS for `.notification`. Every\n   * other value the union accepts emits a class no CSS rule matches, so the\n   * notification renders unstyled; those log a console warning in development\n   * and will be removed from this union in the next major version.\n   */\n  color?: (typeof validColors)[number];\n  /** Use the light color variant. */\n  isLight?: boolean;\n  /** Duration in ms before auto-close. Default 3000. */\n  duration?: number;\n  /**\n   * Position on the screen. A notification shown without one goes to\n   * `NotificationContainer`'s `position`.\n   */\n  position?: NotificationPosition;\n  /**\n   * When true, notifications enter a FIFO queue and display one at a time,\n   * one queue across every `position`. Default false.\n   */\n  queue?: boolean;\n  /** Show a delete (close) button. Default true. */\n  hasDelete?: boolean;\n  /** Stay open until dismissed. */\n  indefinite?: boolean;\n  /** Pause auto-close timer on hover. Default true. */\n  pauseOnHover?: boolean;\n}\n\n/**\n * Internal representation of a notification instance.\n */\ninterface NotificationInstance {\n  /** Unique identifier for this notification. */\n  id: string;\n  /** Configuration options for the notification. */\n  options: NotificationOptions;\n}\n\nlet notificationId = 0;\nconst notificationListeners: Set<(items: NotificationInstance[]) => void> =\n  new Set();\nlet notifications: NotificationInstance[] = [];\n\n// Queue support\nlet queuedNotifications: NotificationInstance[] = [];\nlet currentQueuedNotification: NotificationInstance | null = null;\n\n// The server has nowhere to portal a notification to, and its copy of this\n// module is shared by every request, so server rendering reads an empty list.\n// Hydration reads it too, which keeps the first client render matching the\n// server's.\nconst noNotifications: NotificationInstance[] = [];\nconst getServerNotifications = () => noNotifications;\n\n// What a container shows right now: the stacked notifications, then the queued\n// one on screen. NotificationContainer renders from this rather than from\n// updates alone, so notifications raised before it mounted still appear. It is\n// replaced rather than mutated, and only when listeners are notified, because\n// useSyncExternalStore needs the same array back between changes. An empty\n// list is `noNotifications` itself, so an empty store reads the same snapshot\n// on the client as on the server, and a notify that leaves nothing showing\n// when nothing was showing doesn't render the container again.\nlet visibleNotifications: NotificationInstance[] = noNotifications;\nconst getVisibleNotifications = () => visibleNotifications;\n\nconst notifyNotificationListeners = () => {\n  const allVisible = [...notifications];\n  if (currentQueuedNotification) {\n    allVisible.push(currentQueuedNotification);\n  }\n  visibleNotifications = allVisible.length > 0 ? allVisible : noNotifications;\n  notificationListeners.forEach(listener => listener([...allVisible]));\n};\n\nconst processQueuedNotification = () => {\n  if (currentQueuedNotification || queuedNotifications.length === 0) return;\n  currentQueuedNotification = queuedNotifications.shift()!;\n  notifyNotificationListeners();\n};\n\n/**\n * Programmatic notification API for showing, closing, and managing notifications.\n *\n * @example\n * notification.success('File saved successfully');\n * notification.danger('Something went wrong', { duration: 5000 });\n */\nexport const notification = {\n  /**\n   * Show a notification with the given options.\n   * @param {NotificationOptions} options - Notification configuration.\n   * @returns {string} The unique ID of the created notification.\n   */\n  show: (options: NotificationOptions): string => {\n    const id = `notification-${++notificationId}`;\n    const instance = { id, options };\n\n    if (options.queue) {\n      queuedNotifications.push(instance);\n      processQueuedNotification();\n    } else {\n      notifications.push(instance);\n      notifyNotificationListeners();\n    }\n\n    return id;\n  },\n\n  /**\n   * Show a success notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  success: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'success', ...options });\n  },\n\n  /**\n   * Show a danger notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  danger: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'danger', ...options });\n  },\n\n  /**\n   * Show a warning notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  warning: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'warning', ...options });\n  },\n\n  /**\n   * Show an info notification.\n   * @param {string|React.ReactNode} message - The message to display.\n   * @param {Partial<NotificationOptions>} [options] - Additional options.\n   * @returns {string} The notification ID.\n   */\n  info: (\n    message: string | React.ReactNode,\n    options?: Partial<NotificationOptions>\n  ): string => {\n    return notification.show({ message, color: 'info', ...options });\n  },\n\n  /**\n   * Close a specific notification by ID.\n   * @param {string} id - The notification ID to close.\n   */\n  close: (id: string): void => {\n    if (currentQueuedNotification && currentQueuedNotification.id === id) {\n      currentQueuedNotification = null;\n      processQueuedNotification();\n    } else {\n      queuedNotifications = queuedNotifications.filter(n => n.id !== id);\n      notifications = notifications.filter(n => n.id !== id);\n    }\n    notifyNotificationListeners();\n  },\n\n  /** Close all notifications and clear the queue. */\n  closeAll: (): void => {\n    notifications = [];\n    queuedNotifications = [];\n    currentQueuedNotification = null;\n    notifyNotificationListeners();\n  },\n\n  /**\n   * Subscribe to notification state changes.\n   * @param {(items: NotificationInstance[]) => void} listener - Callback invoked on changes.\n   * @returns {() => void} Unsubscribe function.\n   */\n  subscribe: (\n    listener: (items: NotificationInstance[]) => void\n  ): (() => void) => {\n    notificationListeners.add(listener);\n    return () => notificationListeners.delete(listener);\n  },\n};\n\n/**\n * Whether a notification of this color announces itself as an alert, rather\n * than politely through NotificationContainer's status region.\n *\n * @function isUrgentColor\n * @param {NotificationOptions['color']} color - The notification's color.\n * @returns {boolean} True for `danger` and `warning`.\n */\nconst isUrgentColor = (color: NotificationOptions['color']): boolean =>\n  color === 'danger' || color === 'warning';\n\n/**\n * Single auto-dismissing notification item used by NotificationContainer.\n *\n * @function\n * @param {{ instance: NotificationInstance; onClose: (id: string) => void; registerMessage: (id: string, node: HTMLElement | null) => void }} props - Component props.\n * @returns {JSX.Element} The rendered notification item.\n */\nconst NotificationItem: React.FC<{\n  instance: NotificationInstance;\n  onClose: (id: string) => void;\n  registerMessage: (id: string, node: HTMLElement | null) => void;\n}> = ({ instance, onClose, registerMessage }) => {\n  const {\n    message,\n    color,\n    isLight,\n    duration = 3000,\n    hasDelete = true,\n    indefinite = false,\n    pauseOnHover = true,\n  } = instance.options;\n\n  const [isPaused, setIsPaused] = useState(false);\n  const urgent = isUrgentColor(color);\n\n  const handleClose = useCallback(() => {\n    onClose(instance.id);\n  }, [onClose, instance.id]);\n\n  const messageRef = useCallback(\n    (node: HTMLElement | null) => {\n      registerMessage(instance.id, node);\n    },\n    [registerMessage, instance.id]\n  );\n\n  // Auto-close timer\n  useEffect(() => {\n    if (indefinite || duration === 0 || isPaused) return undefined;\n\n    const timer = setTimeout(handleClose, duration);\n    return () => clearTimeout(timer);\n  }, [duration, indefinite, isPaused, handleClose]);\n\n  const handleMouseEnter = useCallback(() => {\n    if (pauseOnHover) setIsPaused(true);\n  }, [pauseOnHover]);\n\n  const handleMouseLeave = useCallback(() => {\n    if (pauseOnHover) setIsPaused(false);\n  }, [pauseOnHover]);\n\n  return (\n    <Notification\n      color={color}\n      isLight={isLight}\n      hasDelete={hasDelete}\n      onDelete={handleClose}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      style={{ pointerEvents: 'auto' }}\n    >\n      {/* Only the message is announced, not the close button Notification\n          renders ahead of its children. Danger and warning announce\n          themselves as an assertive alert, which a screen reader reliably\n          reads out even when it arrives with its text. The rest are announced\n          through the container's status region, which reads their text from\n          this span, so it carries no role of its own that would announce them\n          a second time. */}\n      {urgent ? (\n        <span role=\"alert\" aria-live=\"assertive\">\n          {message}\n        </span>\n      ) : (\n        <span ref={messageRef}>{message}</span>\n      )}\n    </Notification>\n  );\n};\n\n// The order NotificationContainer renders its stacks in: across the top of the\n// screen, then across the bottom.\nconst notificationStackOrder: readonly NotificationPosition[] = [\n  'top-left',\n  'top',\n  'top-right',\n  'bottom-left',\n  'bottom',\n  'bottom-right',\n];\n\n/**\n * Inline style that fixes a stack of notifications to its place on the screen.\n *\n * @function\n * @param {NotificationPosition} position - Where the stack sits.\n * @returns {React.CSSProperties} The stack's style.\n */\nconst notificationStackStyle = (\n  position: NotificationPosition\n): React.CSSProperties => {\n  const isBottom = position.startsWith('bottom');\n  const isCenter = position === 'top' || position === 'bottom';\n  const isRight = position.endsWith('right');\n\n  return {\n    position: 'fixed',\n    zIndex: 100,\n    display: 'flex',\n    flexDirection: isBottom ? 'column-reverse' : 'column',\n    gap: '0.75rem',\n    padding: '1rem',\n    pointerEvents: 'none',\n    maxWidth: '100%',\n    ...(isBottom ? { bottom: 0 } : { top: 0 }),\n    ...(isCenter\n      ? { left: '50%', transform: 'translateX(-50%)', alignItems: 'center' }\n      : isRight\n        ? { right: 0, alignItems: 'flex-end' }\n        : { left: 0, alignItems: 'flex-start' }),\n  };\n};\n\n/**\n * Container component for rendering programmatic notifications.\n * Place once at your app root to enable the notification API. A notification\n * shown with a `position` appears there, and one shown without goes to the\n * container's `position`, so the container renders a stack for each position\n * in use.\n *\n * It keeps a visually hidden `role=\"status\"` live region in the page from the\n * moment it mounts, even while nothing is showing, and announces every\n * notification other than `danger` and `warning` through it, a moment after\n * the notification appears. Those notifications carry no `role=\"status\"` of\n * their own, so `getByRole('status')` finds the region, not the notification.\n * The text stays in the region briefly, even if the notification closes in\n * the meantime, and while both are up the page holds two copies of it. A\n * polite notification that closes before its announcement is written, a\n * moment after it appears, isn't announced at all. `danger` and `warning`\n * notifications announce themselves as assertive alerts. The region is hidden\n * with inline styles, so it needs no stylesheet.\n *\n * @function\n * @param {{ position?: NotificationPosition }} props - Container props.\n * @returns {JSX.Element | null} The rendered notification container, or null on the server and while hydrating.\n */\nexport const NotificationContainer: React.FC<{\n  /**\n   * Where a notification shown without a `position` of its own appears.\n   * Default: 'top-right'. When it changes, those notifications move without\n   * remounting, but one shown with its own `position` equal to the old or new\n   * value remounts and starts over as if it had just been shown.\n   */\n  position?: NotificationPosition;\n}> = ({ position = 'top-right' }) => {\n  // Starts from the notifications already showing instead of an empty list,\n  // then follows changes.\n  const items = useSyncExternalStore(\n    notification.subscribe,\n    getVisibleNotifications,\n    getServerNotifications\n  );\n  // A portal needs a document, and it has no server-rendered counterpart, so\n  // the server render and the hydrating one render nothing, and the container\n  // portals in from the render after hydration.\n  const isHydrated = useIsHydrated();\n  const resolveContainer = usePortalContainer();\n\n  // The notifications the status region announces. Danger and warning\n  // announce themselves.\n  const politeItems = useMemo(\n    () => items.filter(item => !isUrgentColor(item.options.color)),\n    [items]\n  );\n\n  // Each polite notification's message element, so the text the region\n  // announces is the text on screen, whatever the message renders.\n  const messageNodesRef = useRef(new Map<string, HTMLElement>());\n  const registerMessage = useCallback(\n    (id: string, node: HTMLElement | null) => {\n      if (node) {\n        messageNodesRef.current.set(id, node);\n      } else {\n        messageNodesRef.current.delete(id);\n      }\n    },\n    []\n  );\n  // StatusRegion only describes polite notifications that are on screen, and\n  // each of those registered its message element when it mounted. The\n  // fallback is for a notification announced without being rendered, should\n  // the container ever render fewer than it announces: a plain-text message\n  // still says itself, and anything else is skipped.\n  const describe = useCallback((item: NotificationInstance) => {\n    const node = messageNodesRef.current.get(item.id);\n    /* istanbul ignore if: every polite notification on screen registers its message element when it mounts */\n    if (!node) {\n      const { message } = item.options;\n      return typeof message === 'string' ? message : null;\n    }\n    return spokenText(node);\n  }, []);\n\n  if (typeof document === 'undefined' || !isHydrated) {\n    return null;\n  }\n\n  const stacks = groupIntoPositionStacks(\n    items,\n    item => item.options.position,\n    position,\n    notificationStackOrder\n  );\n\n  const target = resolveContainer();\n  return createPortal(\n    <LocalePortalScope target={target}>\n      {stacks.map(stack => (\n        <div key={stack.key} style={notificationStackStyle(stack.position)}>\n          {stack.items.map(item => (\n            <NotificationItem\n              key={item.id}\n              instance={item}\n              onClose={notification.close}\n              registerMessage={registerMessage}\n            />\n          ))}\n        </div>\n      ))}\n      <StatusRegion items={politeItems} describe={describe} />\n    </LocalePortalScope>,\n    target\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/elements/OrderedList.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { withSubComponents } from '../helpers/withSubComponents.js';

package/dist/esm/elements/OrderedList.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrderedList.js","sources":["../../../src/elements/OrderedList.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { ListItem } from './ListItem';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the OrderedList component.\n * @extraProp {'1' | 'a' | 'A' | 'i' | 'I'} [type='1'] - The numbering type for the list.\n * @extraProp {number} [start] - The starting number for the list.\n * @extraProp {boolean} [reversed] - Whether to reverse the list numbering.\n */\nexport interface OrderedListProps\n  extends\n    React.OlHTMLAttributes<HTMLOListElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** List items to render inside the list. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `OrderedList` component renders a styled ordered list (`<ol>`) element with Bulma helper class integration.\n *\n * @function\n * @param {OrderedListProps} props - Props for the OrderedList component.\n * @returns {JSX.Element} The rendered ol element.\n */\nconst OrderedListComponent: React.FC<OrderedListProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const listClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <ol className={listClasses || undefined} {...rest}>\n      {children}\n    </ol>\n  );\n};\n\nexport const OrderedList = withSubComponents(\n  OrderedListComponent,\n  { Item: ListItem },\n  'OrderedList'\n);\n"],"names":["_jsx"],"mappings":";;;;;;;AA8BA;;;;;;AAMG;AACH,MAAM,oBAAoB,GAA+B,CAAC,EACxD,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,WAAW,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE3E,IAAA,QACEA,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAE,WAAW,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAC9C,QAAQ,EAAA,CACN;AAET,CAAC;AAEM,MAAM,WAAW,GAAG,iBAAiB,CAC1C,oBAAoB,EACpB,EAAE,IAAI,EAAE,QAAQ,EAAE,EAClB,aAAa;;"}
+{"version":3,"file":"OrderedList.js","sources":["../../../src/elements/OrderedList.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { ListItem } from './ListItem';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the OrderedList component.\n * @extraProp {'1' | 'a' | 'A' | 'i' | 'I'} [type='1'] - The numbering type for the list.\n * @extraProp {number} [start] - The starting number for the list.\n * @extraProp {boolean} [reversed] - Whether to reverse the list numbering.\n */\nexport interface OrderedListProps\n  extends\n    React.OlHTMLAttributes<HTMLOListElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** List items to render inside the list. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `OrderedList` component renders a styled ordered list (`<ol>`) element with Bulma helper class integration.\n *\n * @function\n * @param {OrderedListProps} props - Props for the OrderedList component.\n * @returns {JSX.Element} The rendered ol element.\n */\nconst OrderedListComponent: React.FC<OrderedListProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const listClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <ol className={listClasses || undefined} {...rest}>\n      {children}\n    </ol>\n  );\n};\n\nexport const OrderedList = withSubComponents(\n  OrderedListComponent,\n  { Item: ListItem },\n  'OrderedList'\n);\n"],"names":["_jsx"],"mappings":";;;;;;;;AA8BA;;;;;;AAMG;AACH,MAAM,oBAAoB,GAA+B,CAAC,EACxD,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,WAAW,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE3E,IAAA,QACEA,GAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAE,WAAW,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAC9C,QAAQ,EAAA,CACN;AAET,CAAC;AAEM,MAAM,WAAW,GAAG,iBAAiB,CAC1C,oBAAoB,EACpB,EAAE,IAAI,EAAE,QAAQ,EAAE,EAClB,aAAa;;"}

package/dist/esm/elements/Paragraph.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/Paragraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"Paragraph.js","sources":["../../../src/elements/Paragraph.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Paragraph component.\n */\nexport interface ParagraphProps\n  extends\n    React.HTMLAttributes<HTMLParagraphElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Content to render inside the paragraph. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Paragraph` component renders a styled `<p>` element with Bulma helper class integration.\n *\n * @function\n * @param {ParagraphProps} props - Props for the Paragraph component.\n * @returns {JSX.Element} The rendered paragraph element.\n */\nexport const Paragraph: React.FC<ParagraphProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const paragraphClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  return (\n    <p className={paragraphClasses || undefined} {...rest}>\n      {children}\n    </p>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAyBA;;;;;;AAMG;AACI,MAAM,SAAS,GAA6B,CAAC,EAClD,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,gBAAgB,GAAG,UAAU,CACjC,YAAY,EACZ,kBAAkB,EAClB,SAAS,CACV;AAED,IAAA,QACEA,GAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAE,gBAAgB,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAClD,QAAQ,EAAA,CACP;AAER;;"}
+{"version":3,"file":"Paragraph.js","sources":["../../../src/elements/Paragraph.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Paragraph component.\n */\nexport interface ParagraphProps\n  extends\n    React.HTMLAttributes<HTMLParagraphElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Content to render inside the paragraph. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Paragraph` component renders a styled `<p>` element with Bulma helper class integration.\n *\n * @function\n * @param {ParagraphProps} props - Props for the Paragraph component.\n * @returns {JSX.Element} The rendered paragraph element.\n */\nexport const Paragraph: React.FC<ParagraphProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const paragraphClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  return (\n    <p className={paragraphClasses || undefined} {...rest}>\n      {children}\n    </p>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAyBA;;;;;;AAMG;AACI,MAAM,SAAS,GAA6B,CAAC,EAClD,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,gBAAgB,GAAG,UAAU,CACjC,YAAY,EACZ,kBAAkB,EAClB,SAAS,CACV;AAED,IAAA,QACEA,GAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAE,gBAAgB,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAClD,QAAQ,EAAA,CACP;AAER;;"}

package/dist/esm/elements/Pre.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/Pre.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pre.js","sources":["../../../src/elements/Pre.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Pre component.\n */\nexport interface PreProps\n  extends\n    React.HTMLAttributes<HTMLPreElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Preformatted content to render. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Pre` component renders a styled `<pre>` element with Bulma helper class integration.\n *\n * @function\n * @param {PreProps} props - Props for the Pre component.\n * @returns {JSX.Element} The rendered pre element.\n */\nexport const Pre: React.FC<PreProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const preClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <pre className={preClasses || undefined} {...rest}>\n      {children}\n    </pre>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAyBA;;;;;;AAMG;AACI,MAAM,GAAG,GAAuB,CAAC,EACtC,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,UAAU,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE1E,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAC9C,QAAQ,EAAA,CACL;AAEV;;"}
+{"version":3,"file":"Pre.js","sources":["../../../src/elements/Pre.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Pre component.\n */\nexport interface PreProps\n  extends\n    React.HTMLAttributes<HTMLPreElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Preformatted content to render. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Pre` component renders a styled `<pre>` element with Bulma helper class integration.\n *\n * @function\n * @param {PreProps} props - Props for the Pre component.\n * @returns {JSX.Element} The rendered pre element.\n */\nexport const Pre: React.FC<PreProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const preClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <pre className={preClasses || undefined} {...rest}>\n      {children}\n    </pre>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAyBA;;;;;;AAMG;AACI,MAAM,GAAG,GAAuB,CAAC,EACtC,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,UAAU,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE1E,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAC9C,QAAQ,EAAA,CACL;AAEV;;"}

package/dist/esm/elements/Progress.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/Progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"Progress.js","sources":["../../../src/elements/Progress.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { warnUnstyledColor } from '../helpers/colorDeprecations';\n\n/**\n * Props for the Progress component.\n */\nexport interface ProgressProps\n  extends\n    React.ProgressHTMLAttributes<HTMLProgressElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Bulma color modifier for the progress bar (renders `is-<color>`).\n   *\n   * Only `primary`, `link`, `info`, `success`, `warning`, `danger`, `black`,\n   * `white`, `light`, and `dark` have shipped CSS for `.progress`. Every\n   * other value the union accepts emits a class no CSS rule matches, so the\n   * bar renders unstyled; those log a console warning in development and will\n   * be removed from this union in the next major version.\n   */\n  color?: (typeof validColors)[number];\n  /** Size modifier for the progress bar. */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Current value of the progress bar. Leave it unset for an indeterminate\n   * bar, which sweeps across the track. Under `prefers-reduced-motion: reduce`\n   * that bar holds still (with bestax's CSS loaded), so it can read as\n   * partly filled.\n   */\n  value?: number;\n  /** Maximum value of the progress bar. */\n  max?: number;\n  /** Optional custom content inside the progress bar. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Progress` component displays a Bulma-styled progress bar.\n *\n * @function\n * @param {ProgressProps} props - Props for the Progress component.\n * @returns {JSX.Element} The rendered progress bar element.\n * @see {@link https://bulma.io/documentation/elements/progress/ | Bulma Progress documentation}\n */\nexport const Progress: React.FC<ProgressProps> = ({\n  className,\n  color,\n  size,\n  value,\n  max,\n  children,\n  ...props\n}) => {\n  warnUnstyledColor('Progress', color);\n\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    ...props,\n  });\n\n  const bulmaClasses = usePrefixedClassNames('progress', {\n    [`is-${color}`]: color && validColors.includes(color),\n    [`is-${size}`]: size,\n  });\n\n  const progressClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  return (\n    <progress className={progressClasses} value={value} max={max} {...rest}>\n      {children}\n    </progress>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;;AA2CA;;;;;;;AAOG;MACU,QAAQ,GAA4B,CAAC,EAChD,SAAS,EACT,KAAK,EACL,IAAI,EACJ,KAAK,EACL,GAAG,EACH,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,iBAAiB,CAAC,UAAU,EAAE,KAAK,CAAC;AAEpC;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,GAAG,KAAK;AACT,KAAA,CAAC;AAEF,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,UAAU,EAAE;AACrD,QAAA,CAAC,CAAA,GAAA,EAAM,KAAK,CAAA,CAAE,GAAG,KAAK,IAAI,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC;AACrD,QAAA,CAAC,CAAA,GAAA,EAAM,IAAI,CAAA,CAAE,GAAG,IAAI;AACrB,KAAA,CAAC;IAEF,MAAM,eAAe,GAAG,UAAU,CAChC,YAAY,EACZ,kBAAkB,EAClB,SAAS,CACV;AAED,IAAA,QACEA,GAAA,CAAA,UAAA,EAAA,EAAU,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAA,GAAM,IAAI,YACnE,QAAQ,EAAA,CACA;AAEf;;"}
+{"version":3,"file":"Progress.js","sources":["../../../src/elements/Progress.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { warnUnstyledColor } from '../helpers/colorDeprecations';\n\n/**\n * Props for the Progress component.\n */\nexport interface ProgressProps\n  extends\n    React.ProgressHTMLAttributes<HTMLProgressElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Bulma color modifier for the progress bar (renders `is-<color>`).\n   *\n   * Only `primary`, `link`, `info`, `success`, `warning`, `danger`, `black`,\n   * `white`, `light`, and `dark` have shipped CSS for `.progress`. Every\n   * other value the union accepts emits a class no CSS rule matches, so the\n   * bar renders unstyled; those log a console warning in development and will\n   * be removed from this union in the next major version.\n   */\n  color?: (typeof validColors)[number];\n  /** Size modifier for the progress bar. */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Current value of the progress bar. Leave it unset for an indeterminate\n   * bar, which sweeps across the track. Under `prefers-reduced-motion: reduce`\n   * that bar holds still (with bestax's CSS loaded), so it can read as\n   * partly filled.\n   */\n  value?: number;\n  /** Maximum value of the progress bar. */\n  max?: number;\n  /** Optional custom content inside the progress bar. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Progress` component displays a Bulma-styled progress bar.\n *\n * @function\n * @param {ProgressProps} props - Props for the Progress component.\n * @returns {JSX.Element} The rendered progress bar element.\n * @see {@link https://bulma.io/documentation/elements/progress/ | Bulma Progress documentation}\n */\nexport const Progress: React.FC<ProgressProps> = ({\n  className,\n  color,\n  size,\n  value,\n  max,\n  children,\n  ...props\n}) => {\n  warnUnstyledColor('Progress', color);\n\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    ...props,\n  });\n\n  const bulmaClasses = usePrefixedClassNames('progress', {\n    [`is-${color}`]: color && validColors.includes(color),\n    [`is-${size}`]: size,\n  });\n\n  const progressClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  return (\n    <progress className={progressClasses} value={value} max={max} {...rest}>\n      {children}\n    </progress>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;;;AA2CA;;;;;;;AAOG;MACU,QAAQ,GAA4B,CAAC,EAChD,SAAS,EACT,KAAK,EACL,IAAI,EACJ,KAAK,EACL,GAAG,EACH,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,iBAAiB,CAAC,UAAU,EAAE,KAAK,CAAC;AAEpC;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,GAAG,KAAK;AACT,KAAA,CAAC;AAEF,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,UAAU,EAAE;AACrD,QAAA,CAAC,CAAA,GAAA,EAAM,KAAK,CAAA,CAAE,GAAG,KAAK,IAAI,WAAW,CAAC,QAAQ,CAAC,KAAK,CAAC;AACrD,QAAA,CAAC,CAAA,GAAA,EAAM,IAAI,CAAA,CAAE,GAAG,IAAI;AACrB,KAAA,CAAC;IAEF,MAAM,eAAe,GAAG,UAAU,CAChC,YAAY,EACZ,kBAAkB,EAClB,SAAS,CACV;AAED,IAAA,QACEA,GAAA,CAAA,UAAA,EAAA,EAAU,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAA,GAAM,IAAI,YACnE,QAAQ,EAAA,CACA;AAEf;;"}

package/dist/esm/elements/RingProgress.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useEffect } from 'react';
 import { usePrefixedClassNames, classNames, prefixedClassNames } from '../helpers/classNames.js';

package/dist/esm/elements/RingProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"RingProgress.js","sources":["../../../src/elements/RingProgress.tsx"],"sourcesContent":["import React, { forwardRef, useEffect } from 'react';\nimport {\n  classNames,\n  prefixedClassNames,\n  usePrefixedClassNames,\n} from '../helpers/classNames';\nimport { useClassPrefix } from '../helpers/Config';\nimport { useNumberFormat } from '../helpers/localeFormat';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\n\nconst validRingProgressColors = [\n  'primary',\n  'link',\n  'info',\n  'success',\n  'warning',\n  'danger',\n  'black',\n  'dark',\n  'light',\n  'white',\n] as const;\n/** The Bulma colors an arc takes, the ones `Progress` takes. */\nexport type RingProgressColor = (typeof validRingProgressColors)[number];\n\nconst validRingProgressSizes = ['small', 'medium', 'large'] as const;\n\n/** One colored part of a ring drawn in sections. */\nexport interface RingProgressSection {\n  /** Its size, in the same units as the ring's `max`. */\n  value: number;\n  /** Its color. Without one, it takes the ring's. */\n  color?: RingProgressColor;\n  /** What it is, such as \"Photos\", read in the ring's name with its share. */\n  label: string;\n}\n\n/**\n * Props for the RingProgress component. The helper props, the other\n * attributes and the `ref` land on its root `<div>`.\n *\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the root `<div>`.\n * @extraProp {string} [aria-labelledby] - The id of a visible heading that names the ring, in place of `label`. With `sections`, use `label`, since a name from here replaces the one that lists the values.\n * @extraProp {string} [aria-valuetext] - What a screen reader says for the value, such as \"7 of 10 tasks\". Without it, the value is read as a percentage.\n */\nexport interface RingProgressProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'role'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * How far along it is, from 0 to `max`. Values outside that range are\n   * drawn, and read, at the nearest end. Ignored with `sections`.\n   */\n  value?: number;\n  /** The value that fills the ring. */\n  max?: number;\n  /**\n   * Several values around one ring, in order clockwise from the top, each\n   * with its own color and label. The ring is then an image whose name\n   * writes them out, such as \"Storage: Documents 40%, Photos 15%\", since a\n   * screen reader can't take several values from one element. Inside a\n   * `LocaleProvider` with a `locale`, the shares are written as that locale\n   * writes a percentage. A total over `max` fills the ring and stops.\n   */\n  sections?: RingProgressSection[];\n  /**\n   * What it shows, such as \"Upload\" or \"Storage\". It names the ring, so it's\n   * read with the value. A development build warns when the ring has no\n   * name.\n   */\n  label?: string;\n  /**\n   * A level within a range, such as storage used or a score, rather than a\n   * task moving toward done: `role=\"meter\"` in place of `role=\"progressbar\"`.\n   * Ignored with `sections`.\n   */\n  isMeter?: boolean;\n  /** The arc's color, and the color of sections without one. */\n  color?: RingProgressColor;\n  /** The ring's size. */\n  size?: (typeof validRingProgressSizes)[number];\n  /** Rounds the ends of the arc. */\n  isRounded?: boolean;\n  /**\n   * What sits in the middle of the ring, such as the value as text. It's\n   * hidden from assistive tech, which reads the value from the ring itself,\n   * so the value isn't heard twice. Say anything more, such as \"7 of 10\n   * tasks\", in `aria-valuetext`.\n   */\n  children?: React.ReactNode;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n}\n\n/** An arc's place on the ring, in percent of the way round. */\ninterface Arc {\n  start: number;\n  length: number;\n  color?: RingProgressColor;\n}\n\nconst clamp = (value: number, low: number, high: number) =>\n  Math.min(Math.max(value, low), high);\n\n/**\n * The `RingProgress` component draws a value as a ring that fills as it grows, with anything you pass shown in the middle.\n *\n * It's a `progressbar` for a task moving toward done, or a `meter` with\n * `isMeter` for a level within a range, named by `label`. With `sections`\n * it draws several values around one ring and is an image whose name lists\n * them. It has no state for work with no value: that's `Loader`.\n *\n * @function\n * @param {RingProgressProps} props - Props for the RingProgress component.\n * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the root `<div>`.\n * @returns {JSX.Element} The rendered ring.\n *\n * @example\n * <RingProgress value={72} label=\"Upload\" color=\"success\">\n *   72%\n * </RingProgress>\n */\nexport const RingProgress = forwardRef<HTMLDivElement, RingProgressProps>(\n  (\n    {\n      className,\n      textColor,\n      bgColor,\n      value,\n      max = 100,\n      sections,\n      label,\n      isMeter,\n      color,\n      size,\n      isRounded,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses({\n      color: textColor,\n      backgroundColor: bgColor,\n      ...props,\n    });\n\n    const named = Boolean(\n      label || rest['aria-label'] || rest['aria-labelledby']\n    );\n    const mixed = sections !== undefined && value !== undefined;\n    useEffect(() => {\n      if (!named) {\n        warnOnce(\n          'RingProgress:unnamed',\n          '[bestax-bulma] <RingProgress> has no accessible name. Pass ' +\n            'label, so a screen reader can say what the ring shows.'\n        );\n      }\n      if (mixed) {\n        warnOnce(\n          'RingProgress:value-and-sections',\n          '[bestax-bulma] <RingProgress> was given both value and sections. ' +\n            'It draws the sections and ignores value.'\n        );\n      }\n    }, [named, mixed]);\n\n    const total = max > 0 ? max : 100;\n    const share = (part: number) => (clamp(part, 0, total) / total) * 100;\n\n    // Each arc starts where the one before ended, and the last stops at the\n    // top, so a total over max fills the ring and no more.\n    const arcs: Arc[] = [];\n    if (sections) {\n      let start = 0;\n      for (const section of sections) {\n        const length = Math.min(share(section.value), 100 - start);\n        arcs.push({ start, length, color: section.color });\n        start += length;\n      }\n    } else {\n      arcs.push({ start: 0, length: share(value ?? 0) });\n    }\n\n    const rootClass = usePrefixedClassNames('ring-progress', {\n      [`is-${size}`]:\n        !!size && (validRingProgressSizes as readonly string[]).includes(size),\n      [`is-${color}`]:\n        !!color &&\n        (validRingProgressColors as readonly string[]).includes(color),\n      'is-rounded': !!isRounded,\n      'has-sections': !!sections,\n    });\n    const ringClass = usePrefixedClassNames('ring-progress-ring');\n    const trackClass = usePrefixedClassNames('ring-progress-track');\n    const arcClass = usePrefixedClassNames('ring-progress-arc');\n    const labelClass = usePrefixedClassNames('ring-progress-label');\n    // A section's color class, prefixed like the rest.\n    const classPrefix = useClassPrefix();\n    const formatNumber = useNumberFormat();\n    const writeShare = (share: number) =>\n      formatNumber\n        ? formatNumber(share / 100, { style: 'percent' })\n        : `${share}%`;\n\n    const roleProps = sections\n      ? {\n          role: 'img',\n          'aria-label': [\n            label || rest['aria-label'],\n            sections\n              .map(\n                (section, i) =>\n                  `${section.label} ${writeShare(Math.round(arcs[i].length))}`\n              )\n              .join(', '),\n          ]\n            .filter(Boolean)\n            .join(': '),\n        }\n      : {\n          role: isMeter ? 'meter' : 'progressbar',\n          'aria-valuenow': clamp(value ?? 0, 0, total),\n          'aria-valuemin': 0,\n          'aria-valuemax': total,\n          'aria-label': label || rest['aria-label'],\n        };\n\n    return (\n      <div\n        ref={ref}\n        className={classNames(rootClass, bulmaHelperClasses, className)}\n        {...rest}\n        {...roleProps}\n      >\n        <svg className={ringClass} viewBox=\"0 0 100 100\" aria-hidden=\"true\">\n          <circle className={trackClass} cx=\"50\" cy=\"50\" r=\"42\" />\n          {arcs.map(\n            (arc, i) =>\n              arc.length > 0 && (\n                <circle\n                  key={i}\n                  className={classNames(\n                    arcClass,\n                    arc.color &&\n                      (validRingProgressColors as readonly string[]).includes(\n                        arc.color\n                      ) &&\n                      prefixedClassNames(classPrefix, `is-${arc.color}`)\n                  )}\n                  cx=\"50\"\n                  cy=\"50\"\n                  r=\"42\"\n                  pathLength={100}\n                  style={\n                    {\n                      '--ring-progress-length': arc.length,\n                      '--ring-progress-start': arc.start,\n                    } as React.CSSProperties\n                  }\n                />\n              )\n          )}\n        </svg>\n        {children !== undefined && children !== null && (\n          // The ring's value is already read from its role, and not every\n          // browser keeps a meter's content out of the tree, so the middle\n          // is for the eye only.\n          <div className={labelClass} aria-hidden=\"true\">\n            {children}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nRingProgress.displayName = 'RingProgress';\n\nexport default RingProgress;\n"],"names":["clamp","_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"RingProgress.js","sources":["../../../src/elements/RingProgress.tsx"],"sourcesContent":["import React, { forwardRef, useEffect } from 'react';\nimport {\n  classNames,\n  prefixedClassNames,\n  usePrefixedClassNames,\n} from '../helpers/classNames';\nimport { useClassPrefix } from '../helpers/Config';\nimport { useNumberFormat } from '../helpers/localeFormat';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { warnOnce } from '../helpers/devWarnings';\n\nconst validRingProgressColors = [\n  'primary',\n  'link',\n  'info',\n  'success',\n  'warning',\n  'danger',\n  'black',\n  'dark',\n  'light',\n  'white',\n] as const;\n/** The Bulma colors an arc takes, the ones `Progress` takes. */\nexport type RingProgressColor = (typeof validRingProgressColors)[number];\n\nconst validRingProgressSizes = ['small', 'medium', 'large'] as const;\n\n/** One colored part of a ring drawn in sections. */\nexport interface RingProgressSection {\n  /** Its size, in the same units as the ring's `max`. */\n  value: number;\n  /** Its color. Without one, it takes the ring's. */\n  color?: RingProgressColor;\n  /** What it is, such as \"Photos\", read in the ring's name with its share. */\n  label: string;\n}\n\n/**\n * Props for the RingProgress component. The helper props, the other\n * attributes and the `ref` land on its root `<div>`.\n *\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the root `<div>`.\n * @extraProp {string} [aria-labelledby] - The id of a visible heading that names the ring, in place of `label`. With `sections`, use `label`, since a name from here replaces the one that lists the values.\n * @extraProp {string} [aria-valuetext] - What a screen reader says for the value, such as \"7 of 10 tasks\". Without it, the value is read as a percentage.\n */\nexport interface RingProgressProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color' | 'role'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * How far along it is, from 0 to `max`. Values outside that range are\n   * drawn, and read, at the nearest end. Ignored with `sections`.\n   */\n  value?: number;\n  /** The value that fills the ring. */\n  max?: number;\n  /**\n   * Several values around one ring, in order clockwise from the top, each\n   * with its own color and label. The ring is then an image whose name\n   * writes them out, such as \"Storage: Documents 40%, Photos 15%\", since a\n   * screen reader can't take several values from one element. Inside a\n   * `LocaleProvider` with a `locale`, the shares are written as that locale\n   * writes a percentage. A total over `max` fills the ring and stops.\n   */\n  sections?: RingProgressSection[];\n  /**\n   * What it shows, such as \"Upload\" or \"Storage\". It names the ring, so it's\n   * read with the value. A development build warns when the ring has no\n   * name.\n   */\n  label?: string;\n  /**\n   * A level within a range, such as storage used or a score, rather than a\n   * task moving toward done: `role=\"meter\"` in place of `role=\"progressbar\"`.\n   * Ignored with `sections`.\n   */\n  isMeter?: boolean;\n  /** The arc's color, and the color of sections without one. */\n  color?: RingProgressColor;\n  /** The ring's size. */\n  size?: (typeof validRingProgressSizes)[number];\n  /** Rounds the ends of the arc. */\n  isRounded?: boolean;\n  /**\n   * What sits in the middle of the ring, such as the value as text. It's\n   * hidden from assistive tech, which reads the value from the ring itself,\n   * so the value isn't heard twice. Say anything more, such as \"7 of 10\n   * tasks\", in `aria-valuetext`.\n   */\n  children?: React.ReactNode;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n}\n\n/** An arc's place on the ring, in percent of the way round. */\ninterface Arc {\n  start: number;\n  length: number;\n  color?: RingProgressColor;\n}\n\nconst clamp = (value: number, low: number, high: number) =>\n  Math.min(Math.max(value, low), high);\n\n/**\n * The `RingProgress` component draws a value as a ring that fills as it grows, with anything you pass shown in the middle.\n *\n * It's a `progressbar` for a task moving toward done, or a `meter` with\n * `isMeter` for a level within a range, named by `label`. With `sections`\n * it draws several values around one ring and is an image whose name lists\n * them. It has no state for work with no value: that's `Loader`.\n *\n * @function\n * @param {RingProgressProps} props - Props for the RingProgress component.\n * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the root `<div>`.\n * @returns {JSX.Element} The rendered ring.\n *\n * @example\n * <RingProgress value={72} label=\"Upload\" color=\"success\">\n *   72%\n * </RingProgress>\n */\nexport const RingProgress = forwardRef<HTMLDivElement, RingProgressProps>(\n  (\n    {\n      className,\n      textColor,\n      bgColor,\n      value,\n      max = 100,\n      sections,\n      label,\n      isMeter,\n      color,\n      size,\n      isRounded,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses({\n      color: textColor,\n      backgroundColor: bgColor,\n      ...props,\n    });\n\n    const named = Boolean(\n      label || rest['aria-label'] || rest['aria-labelledby']\n    );\n    const mixed = sections !== undefined && value !== undefined;\n    useEffect(() => {\n      if (!named) {\n        warnOnce(\n          'RingProgress:unnamed',\n          '[bestax-bulma] <RingProgress> has no accessible name. Pass ' +\n            'label, so a screen reader can say what the ring shows.'\n        );\n      }\n      if (mixed) {\n        warnOnce(\n          'RingProgress:value-and-sections',\n          '[bestax-bulma] <RingProgress> was given both value and sections. ' +\n            'It draws the sections and ignores value.'\n        );\n      }\n    }, [named, mixed]);\n\n    const total = max > 0 ? max : 100;\n    const share = (part: number) => (clamp(part, 0, total) / total) * 100;\n\n    // Each arc starts where the one before ended, and the last stops at the\n    // top, so a total over max fills the ring and no more.\n    const arcs: Arc[] = [];\n    if (sections) {\n      let start = 0;\n      for (const section of sections) {\n        const length = Math.min(share(section.value), 100 - start);\n        arcs.push({ start, length, color: section.color });\n        start += length;\n      }\n    } else {\n      arcs.push({ start: 0, length: share(value ?? 0) });\n    }\n\n    const rootClass = usePrefixedClassNames('ring-progress', {\n      [`is-${size}`]:\n        !!size && (validRingProgressSizes as readonly string[]).includes(size),\n      [`is-${color}`]:\n        !!color &&\n        (validRingProgressColors as readonly string[]).includes(color),\n      'is-rounded': !!isRounded,\n      'has-sections': !!sections,\n    });\n    const ringClass = usePrefixedClassNames('ring-progress-ring');\n    const trackClass = usePrefixedClassNames('ring-progress-track');\n    const arcClass = usePrefixedClassNames('ring-progress-arc');\n    const labelClass = usePrefixedClassNames('ring-progress-label');\n    // A section's color class, prefixed like the rest.\n    const classPrefix = useClassPrefix();\n    const formatNumber = useNumberFormat();\n    const writeShare = (share: number) =>\n      formatNumber\n        ? formatNumber(share / 100, { style: 'percent' })\n        : `${share}%`;\n\n    const roleProps = sections\n      ? {\n          role: 'img',\n          'aria-label': [\n            label || rest['aria-label'],\n            sections\n              .map(\n                (section, i) =>\n                  `${section.label} ${writeShare(Math.round(arcs[i].length))}`\n              )\n              .join(', '),\n          ]\n            .filter(Boolean)\n            .join(': '),\n        }\n      : {\n          role: isMeter ? 'meter' : 'progressbar',\n          'aria-valuenow': clamp(value ?? 0, 0, total),\n          'aria-valuemin': 0,\n          'aria-valuemax': total,\n          'aria-label': label || rest['aria-label'],\n        };\n\n    return (\n      <div\n        ref={ref}\n        className={classNames(rootClass, bulmaHelperClasses, className)}\n        {...rest}\n        {...roleProps}\n      >\n        <svg className={ringClass} viewBox=\"0 0 100 100\" aria-hidden=\"true\">\n          <circle className={trackClass} cx=\"50\" cy=\"50\" r=\"42\" />\n          {arcs.map(\n            (arc, i) =>\n              arc.length > 0 && (\n                <circle\n                  key={i}\n                  className={classNames(\n                    arcClass,\n                    arc.color &&\n                      (validRingProgressColors as readonly string[]).includes(\n                        arc.color\n                      ) &&\n                      prefixedClassNames(classPrefix, `is-${arc.color}`)\n                  )}\n                  cx=\"50\"\n                  cy=\"50\"\n                  r=\"42\"\n                  pathLength={100}\n                  style={\n                    {\n                      '--ring-progress-length': arc.length,\n                      '--ring-progress-start': arc.start,\n                    } as React.CSSProperties\n                  }\n                />\n              )\n          )}\n        </svg>\n        {children !== undefined && children !== null && (\n          // The ring's value is already read from its role, and not every\n          // browser keeps a meter's content out of the tree, so the middle\n          // is for the eye only.\n          <div className={labelClass} aria-hidden=\"true\">\n            {children}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nRingProgress.displayName = 'RingProgress';\n\nexport default RingProgress;\n"],"names":["clamp","_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/elements/Skeleton.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 

package/dist/esm/elements/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","sources":["../../../src/elements/Skeleton.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\n\n/**\n * Props for the Skeleton component.\n */\nexport interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Additional CSS classes to apply */\n  className?: string;\n  /** Skeleton variant: block (single block) or lines. */\n  variant?: 'block' | 'lines';\n  /** Number of lines (only for `lines` variant). */\n  lines?: number;\n  /** Content inside the block (only for block variant). */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Skeleton` component provides a Bulma-styled skeleton loader for React applications, useful for indicating that content is loading.\n *\n * @function\n * @param {SkeletonProps} props - Props for the Skeleton component.\n * @returns {JSX.Element} The rendered skeleton element.\n *\n * @example\n * // Block skeleton\n * <Skeleton />\n *\n * @example\n * // Multi-line skeleton\n * <Skeleton variant=\"lines\" lines={5} />\n */\nexport const Skeleton: React.FC<SkeletonProps> = ({\n  className,\n  variant = 'block',\n  lines = 3,\n  children,\n  ...props\n}) => {\n  const linesClass = usePrefixedClassNames('skeleton-lines');\n  const blockClass = usePrefixedClassNames('skeleton-block');\n\n  if (variant === 'lines') {\n    return (\n      <div className={classNames(linesClass, className)} {...props}>\n        {Array.from({ length: lines }).map((_, i) => (\n          <div key={i} />\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <div className={classNames(blockClass, className)} {...props}>\n      {children}\n    </div>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;AAiBA;;;;;;;;;;;;;;AAcG;MACU,QAAQ,GAA4B,CAAC,EAChD,SAAS,EACT,OAAO,GAAG,OAAO,EACjB,KAAK,GAAG,CAAC,EACT,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,gBAAgB,CAAC;AAC1D,IAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,gBAAgB,CAAC;AAE1D,IAAA,IAAI,OAAO,KAAK,OAAO,EAAE;AACvB,QAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,EAAA,GAAM,KAAK,EAAA,QAAA,EACzD,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,MACtCA,eAAU,CAAC,CAAI,CAChB,CAAC,EAAA,CACE;IAEV;AAEA,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,KAAM,KAAK,EAAA,QAAA,EACzD,QAAQ,EAAA,CACL;AAEV;;"}
+{"version":3,"file":"Skeleton.js","sources":["../../../src/elements/Skeleton.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\n\n/**\n * Props for the Skeleton component.\n */\nexport interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Additional CSS classes to apply */\n  className?: string;\n  /** Skeleton variant: block (single block) or lines. */\n  variant?: 'block' | 'lines';\n  /** Number of lines (only for `lines` variant). */\n  lines?: number;\n  /** Content inside the block (only for block variant). */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Skeleton` component provides a Bulma-styled skeleton loader for React applications, useful for indicating that content is loading.\n *\n * @function\n * @param {SkeletonProps} props - Props for the Skeleton component.\n * @returns {JSX.Element} The rendered skeleton element.\n *\n * @example\n * // Block skeleton\n * <Skeleton />\n *\n * @example\n * // Multi-line skeleton\n * <Skeleton variant=\"lines\" lines={5} />\n */\nexport const Skeleton: React.FC<SkeletonProps> = ({\n  className,\n  variant = 'block',\n  lines = 3,\n  children,\n  ...props\n}) => {\n  const linesClass = usePrefixedClassNames('skeleton-lines');\n  const blockClass = usePrefixedClassNames('skeleton-block');\n\n  if (variant === 'lines') {\n    return (\n      <div className={classNames(linesClass, className)} {...props}>\n        {Array.from({ length: lines }).map((_, i) => (\n          <div key={i} />\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <div className={classNames(blockClass, className)} {...props}>\n      {children}\n    </div>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAiBA;;;;;;;;;;;;;;AAcG;MACU,QAAQ,GAA4B,CAAC,EAChD,SAAS,EACT,OAAO,GAAG,OAAO,EACjB,KAAK,GAAG,CAAC,EACT,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,gBAAgB,CAAC;AAC1D,IAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,gBAAgB,CAAC;AAE1D,IAAA,IAAI,OAAO,KAAK,OAAO,EAAE;AACvB,QAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,EAAA,GAAM,KAAK,EAAA,QAAA,EACzD,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,MACtCA,eAAU,CAAC,CAAI,CAChB,CAAC,EAAA,CACE;IAEV;AAEA,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,KAAM,KAAK,EAAA,QAAA,EACzD,QAAQ,EAAA,CACL;AAEV;;"}

package/dist/esm/elements/Span.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/Span.js.map

@@ -1 +1 @@
-{"version":3,"file":"Span.js","sources":["../../../src/elements/Span.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Span component.\n */\nexport interface SpanProps\n  extends\n    React.HTMLAttributes<HTMLSpanElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Content to render inside the span. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Span` component renders a styled inline `<span>` element with Bulma helper class integration.\n *\n * @function\n * @param {SpanProps} props - Props for the Span component.\n * @returns {JSX.Element} The rendered span element.\n */\nexport const Span: React.FC<SpanProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const spanClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <span className={spanClasses || undefined} {...rest}>\n      {children}\n    </span>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAyBA;;;;;;AAMG;AACI,MAAM,IAAI,GAAwB,CAAC,EACxC,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,WAAW,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE3E,IAAA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,WAAW,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAChD,QAAQ,EAAA,CACJ;AAEX;;"}
+{"version":3,"file":"Span.js","sources":["../../../src/elements/Span.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Span component.\n */\nexport interface SpanProps\n  extends\n    React.HTMLAttributes<HTMLSpanElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Content to render inside the span. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Span` component renders a styled inline `<span>` element with Bulma helper class integration.\n *\n * @function\n * @param {SpanProps} props - Props for the Span component.\n * @returns {JSX.Element} The rendered span element.\n */\nexport const Span: React.FC<SpanProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const spanClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <span className={spanClasses || undefined} {...rest}>\n      {children}\n    </span>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAyBA;;;;;;AAMG;AACI,MAAM,IAAI,GAAwB,CAAC,EACxC,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,WAAW,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE3E,IAAA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,WAAW,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAChD,QAAQ,EAAA,CACJ;AAEX;;"}

package/dist/esm/elements/Strong.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/Strong.js.map

@@ -1 +1 @@
-{"version":3,"file":"Strong.js","sources":["../../../src/elements/Strong.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Strong component.\n */\nexport interface StrongProps\n  extends\n    React.HTMLAttributes<HTMLElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Content to render inside the strong element. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Strong` component renders a styled `<strong>` element with Bulma helper class integration.\n *\n * @function\n * @param {StrongProps} props - Props for the Strong component.\n * @returns {JSX.Element} The rendered strong element.\n */\nexport const Strong: React.FC<StrongProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const strongClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <strong className={strongClasses || undefined} {...rest}>\n      {children}\n    </strong>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAyBA;;;;;;AAMG;AACI,MAAM,MAAM,GAA0B,CAAC,EAC5C,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,aAAa,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE7E,IAAA,QACEA,GAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAE,aAAa,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EACpD,QAAQ,EAAA,CACF;AAEb;;"}
+{"version":3,"file":"Strong.js","sources":["../../../src/elements/Strong.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Strong component.\n */\nexport interface StrongProps\n  extends\n    React.HTMLAttributes<HTMLElement>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Content to render inside the strong element. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Strong` component renders a styled `<strong>` element with Bulma helper class integration.\n *\n * @function\n * @param {StrongProps} props - Props for the Strong component.\n * @returns {JSX.Element} The rendered strong element.\n */\nexport const Strong: React.FC<StrongProps> = ({\n  className,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  } as BulmaClassesProps & typeof props);\n\n  const bulmaClasses = usePrefixedClassNames();\n  const strongClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <strong className={strongClasses || undefined} {...rest}>\n      {children}\n    </strong>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAyBA;;;;;;AAMG;AACI,MAAM,MAAM,GAA0B,CAAC,EAC5C,SAAS,EACT,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AAC2B,KAAA,CAAC;AAEtC,IAAA,MAAM,YAAY,GAAG,qBAAqB,EAAE;IAC5C,MAAM,aAAa,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE7E,IAAA,QACEA,GAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAE,aAAa,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EACpD,QAAQ,EAAA,CACF;AAEb;;"}

package/dist/esm/elements/SubTitle.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/SubTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubTitle.js","sources":["../../../src/elements/SubTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\nconst validSubTitleSizes = ['1', '2', '3', '4', '5', '6'] as const;\n/**\n * Valid size values for the SubTitle component (Bulma subtitle sizes): `'1'`–`'6'` as a string or number (`3` and `'3'` are equivalent).\n */\nexport type SubTitleSize =\n  '1' | '2' | '3' | '4' | '5' | '6' | 1 | 2 | 3 | 4 | 5 | 6;\n\nconst validSubTitleElements = [\n  'h1',\n  'h2',\n  'h3',\n  'h4',\n  'h5',\n  'h6',\n  'p',\n] as const;\n/**\n * Valid HTML elements for the SubTitle component.\n */\nexport type SubTitleElement = (typeof validSubTitleElements)[number];\n\n/**\n * Props for the SubTitle component.\n * @extraProp {boolean} [skeleton] - Applies the `is-skeleton` class to the entire component.\n */\nexport interface SubTitleProps\n  extends\n    Omit<\n      React.HTMLAttributes<HTMLHeadingElement | HTMLParagraphElement>,\n      'color'\n    >,\n    Omit<BulmaClassesProps, 'backgroundColor' | 'color'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Size of the subtitle (Bulma sizes `1`-`6`, as a string or number). It\n   * also picks the heading level: unless `as` is `p`, `size=\"5\"` renders an\n   * `<h5>`, whatever `as` says. For a heading whose level and size differ,\n   * set the level with `as` and the size with the `textSize` helper.\n   */\n  size?: SubTitleSize;\n  /**\n   * HTML element to render as (`h1`-`h6` or `p`). With neither `as` nor\n   * `size` set it's an `<h1>`, so a subtitle that isn't a heading of its own\n   * takes `as=\"p\"`. A `size` overrides `as` unless it's `p`, so\n   * `as=\"h3\" size=\"5\"` renders an `<h5>`. To keep the level `as` sets, size\n   * the subtitle with the `textSize` helper instead.\n   */\n  as?: SubTitleElement;\n  /** Applies the `has-skeleton` class to part of the content. */\n  hasSkeleton?: boolean;\n  /** Subtitle content. */\n  children?: React.ReactNode;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n}\n\n/**\n * The `SubTitle` component renders a Bulma-styled subtitle (secondary heading), supporting sizes `1-6` and rendering as any heading or paragraph element (`h1-h6`, `p`).\n *\n * @function\n * @param {SubTitleProps} props - Props for the SubTitle component.\n * @returns {JSX.Element} The rendered subtitle element.\n * @see {@link https://bulma.io/documentation/elements/title/#subtitle | Bulma Subtitle documentation}\n */\nexport const SubTitle: React.FC<SubTitleProps> = ({\n  className,\n  size,\n  as = 'h1',\n  hasSkeleton,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  });\n\n  // Validate 'as' prop at runtime\n  const element = validSubTitleElements.includes(as) ? as : 'h1';\n\n  // Validate 'size' prop at runtime (numeric sizes normalize to strings)\n  const normalized = size == null ? undefined : String(size);\n  const validSize =\n    normalized && (validSubTitleSizes as readonly string[]).includes(normalized)\n      ? (normalized as (typeof validSubTitleSizes)[number])\n      : undefined;\n\n  const bulmaClasses = usePrefixedClassNames('subtitle', {\n    [`is-${validSize}`]: validSize,\n    'has-skeleton': hasSkeleton,\n  });\n\n  const subTitleClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  // Determine the tag based on 'element' and 'validSize'\n  const Tag: React.ElementType =\n    element === 'p' ? 'p' : validSize ? `h${validSize}` : element;\n\n  return (\n    <Tag className={subTitleClasses} {...rest}>\n      {children}\n    </Tag>\n  );\n};\n\nexport default SubTitle;\n"],"names":["_jsx"],"mappings":";;;;;AAQA,MAAM,kBAAkB,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAU;AAOlE,MAAM,qBAAqB,GAAG;IAC5B,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,GAAG;CACK;AA4CV;;;;;;;AAOG;AACI,MAAM,QAAQ,GAA4B,CAAC,EAChD,SAAS,EACT,IAAI,EACJ,EAAE,GAAG,IAAI,EACT,WAAW,EACX,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AACT,KAAA,CAAC;;AAGF,IAAA,MAAM,OAAO,GAAG,qBAAqB,CAAC,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,IAAI;;AAG9D,IAAA,MAAM,UAAU,GAAG,IAAI,IAAI,IAAI,GAAG,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC;IAC1D,MAAM,SAAS,GACb,UAAU,IAAK,kBAAwC,CAAC,QAAQ,CAAC,UAAU;AACzE,UAAG;UACD,SAAS;AAEf,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,UAAU,EAAE;AACrD,QAAA,CAAC,CAAA,GAAA,EAAM,SAAS,CAAA,CAAE,GAAG,SAAS;AAC9B,QAAA,cAAc,EAAE,WAAW;AAC5B,KAAA,CAAC;IAEF,MAAM,eAAe,GAAG,UAAU,CAChC,YAAY,EACZ,kBAAkB,EAClB,SAAS,CACV;;IAGD,MAAM,GAAG,GACP,OAAO,KAAK,GAAG,GAAG,GAAG,GAAG,SAAS,GAAG,CAAA,CAAA,EAAI,SAAS,EAAE,GAAG,OAAO;AAE/D,IAAA,QACEA,GAAA,CAAC,GAAG,EAAA,EAAC,SAAS,EAAE,eAAe,EAAA,GAAM,IAAI,EAAA,QAAA,EACtC,QAAQ,EAAA,CACL;AAEV;;"}
+{"version":3,"file":"SubTitle.js","sources":["../../../src/elements/SubTitle.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\n\nconst validSubTitleSizes = ['1', '2', '3', '4', '5', '6'] as const;\n/**\n * Valid size values for the SubTitle component (Bulma subtitle sizes): `'1'`–`'6'` as a string or number (`3` and `'3'` are equivalent).\n */\nexport type SubTitleSize =\n  '1' | '2' | '3' | '4' | '5' | '6' | 1 | 2 | 3 | 4 | 5 | 6;\n\nconst validSubTitleElements = [\n  'h1',\n  'h2',\n  'h3',\n  'h4',\n  'h5',\n  'h6',\n  'p',\n] as const;\n/**\n * Valid HTML elements for the SubTitle component.\n */\nexport type SubTitleElement = (typeof validSubTitleElements)[number];\n\n/**\n * Props for the SubTitle component.\n * @extraProp {boolean} [skeleton] - Applies the `is-skeleton` class to the entire component.\n */\nexport interface SubTitleProps\n  extends\n    Omit<\n      React.HTMLAttributes<HTMLHeadingElement | HTMLParagraphElement>,\n      'color'\n    >,\n    Omit<BulmaClassesProps, 'backgroundColor' | 'color'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /**\n   * Size of the subtitle (Bulma sizes `1`-`6`, as a string or number). It\n   * also picks the heading level: unless `as` is `p`, `size=\"5\"` renders an\n   * `<h5>`, whatever `as` says. For a heading whose level and size differ,\n   * set the level with `as` and the size with the `textSize` helper.\n   */\n  size?: SubTitleSize;\n  /**\n   * HTML element to render as (`h1`-`h6` or `p`). With neither `as` nor\n   * `size` set it's an `<h1>`, so a subtitle that isn't a heading of its own\n   * takes `as=\"p\"`. A `size` overrides `as` unless it's `p`, so\n   * `as=\"h3\" size=\"5\"` renders an `<h5>`. To keep the level `as` sets, size\n   * the subtitle with the `textSize` helper instead.\n   */\n  as?: SubTitleElement;\n  /** Applies the `has-skeleton` class to part of the content. */\n  hasSkeleton?: boolean;\n  /** Subtitle content. */\n  children?: React.ReactNode;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n}\n\n/**\n * The `SubTitle` component renders a Bulma-styled subtitle (secondary heading), supporting sizes `1-6` and rendering as any heading or paragraph element (`h1-h6`, `p`).\n *\n * @function\n * @param {SubTitleProps} props - Props for the SubTitle component.\n * @returns {JSX.Element} The rendered subtitle element.\n * @see {@link https://bulma.io/documentation/elements/title/#subtitle | Bulma Subtitle documentation}\n */\nexport const SubTitle: React.FC<SubTitleProps> = ({\n  className,\n  size,\n  as = 'h1',\n  hasSkeleton,\n  textColor,\n  bgColor,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({\n    color: textColor,\n    backgroundColor: bgColor,\n    ...props,\n  });\n\n  // Validate 'as' prop at runtime\n  const element = validSubTitleElements.includes(as) ? as : 'h1';\n\n  // Validate 'size' prop at runtime (numeric sizes normalize to strings)\n  const normalized = size == null ? undefined : String(size);\n  const validSize =\n    normalized && (validSubTitleSizes as readonly string[]).includes(normalized)\n      ? (normalized as (typeof validSubTitleSizes)[number])\n      : undefined;\n\n  const bulmaClasses = usePrefixedClassNames('subtitle', {\n    [`is-${validSize}`]: validSize,\n    'has-skeleton': hasSkeleton,\n  });\n\n  const subTitleClasses = classNames(\n    bulmaClasses,\n    bulmaHelperClasses,\n    className\n  );\n\n  // Determine the tag based on 'element' and 'validSize'\n  const Tag: React.ElementType =\n    element === 'p' ? 'p' : validSize ? `h${validSize}` : element;\n\n  return (\n    <Tag className={subTitleClasses} {...rest}>\n      {children}\n    </Tag>\n  );\n};\n\nexport default SubTitle;\n"],"names":["_jsx"],"mappings":";;;;;;AAQA,MAAM,kBAAkB,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAU;AAOlE,MAAM,qBAAqB,GAAG;IAC5B,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,GAAG;CACK;AA4CV;;;;;;;AAOG;AACI,MAAM,QAAQ,GAA4B,CAAC,EAChD,SAAS,EACT,IAAI,EACJ,EAAE,GAAG,IAAI,EACT,WAAW,EACX,SAAS,EACT,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC;AACnD,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,GAAG,KAAK;AACT,KAAA,CAAC;;AAGF,IAAA,MAAM,OAAO,GAAG,qBAAqB,CAAC,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,IAAI;;AAG9D,IAAA,MAAM,UAAU,GAAG,IAAI,IAAI,IAAI,GAAG,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC;IAC1D,MAAM,SAAS,GACb,UAAU,IAAK,kBAAwC,CAAC,QAAQ,CAAC,UAAU;AACzE,UAAG;UACD,SAAS;AAEf,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,UAAU,EAAE;AACrD,QAAA,CAAC,CAAA,GAAA,EAAM,SAAS,CAAA,CAAE,GAAG,SAAS;AAC9B,QAAA,cAAc,EAAE,WAAW;AAC5B,KAAA,CAAC;IAEF,MAAM,eAAe,GAAG,UAAU,CAChC,YAAY,EACZ,kBAAkB,EAClB,SAAS,CACV;;IAGD,MAAM,GAAG,GACP,OAAO,KAAK,GAAG,GAAG,GAAG,GAAG,SAAS,GAAG,CAAA,CAAA,EAAI,SAAS,EAAE,GAAG,OAAO;AAE/D,IAAA,QACEA,GAAA,CAAC,GAAG,EAAA,EAAC,SAAS,EAAE,eAAe,EAAA,GAAM,IAAI,EAAA,QAAA,EACtC,QAAQ,EAAA,CACL;AAEV;;"}

package/dist/esm/elements/Table.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { withSubComponents } from '../helpers/withSubComponents.js';

package/dist/esm/elements/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../../src/elements/Table.tsx"],"sourcesContent":["/**\n * @group Table\n */\nimport React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { Thead } from './Thead';\nimport { Tbody } from './Tbody';\nimport { Tfoot } from './Tfoot';\nimport { Tr } from './Tr';\nimport { Th } from './Th';\nimport { Td } from './Td';\n\n/**\n * Props for the Table component.\n */\nexport interface TableProps\n  extends\n    Omit<React.TableHTMLAttributes<HTMLTableElement>, 'color'>,\n    Omit<BulmaClassesProps, 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Adds borders to all cells. */\n  isBordered?: boolean;\n  /** Adds zebra-striping to rows. */\n  isStriped?: boolean;\n  /** Makes the table more compact by cutting cell padding in half. */\n  isNarrow?: boolean;\n  /** Adds a hover effect on rows. */\n  isHoverable?: boolean;\n  /** Makes the table span the full width of its parent. */\n  isFullwidth?: boolean;\n  /** Makes the table span the full width of its parent. @deprecated Use `isFullwidth` instead — `isFullwidth` wins if both are set. */\n  isFullWidth?: boolean;\n  /** Makes the table horizontally scrollable on small screens. */\n  isResponsive?: boolean;\n  /** Table content (should use subcomponents). */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Table` component and its subcomponents provide a highly composable, Bulma-styled table system for React.\n *\n * @function\n * @param {TableProps} props - Props for the Table component.\n * @returns {JSX.Element} The rendered table element.\n * @see {@link https://bulma.io/documentation/elements/table/ | Bulma Table documentation}\n */\nconst TableComponent: React.FC<TableProps> = ({\n  className,\n  isBordered,\n  isStriped,\n  isNarrow,\n  isHoverable,\n  isFullwidth,\n  isFullWidth,\n  isResponsive,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const bulmaClasses = usePrefixedClassNames('table', {\n    'is-bordered': isBordered,\n    'is-striped': isStriped,\n    'is-narrow': isNarrow,\n    'is-hoverable': isHoverable,\n    'is-fullwidth': isFullwidth ?? isFullWidth,\n  });\n\n  const containerClass = usePrefixedClassNames('table-container');\n  const tableClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  const tableElement = (\n    <table className={tableClasses} {...rest}>\n      {children}\n    </table>\n  );\n\n  if (isResponsive) {\n    return <div className={containerClass}>{tableElement}</div>;\n  }\n\n  return tableElement;\n};\n\nexport const Table = withSubComponents(\n  TableComponent,\n  {\n    Thead,\n    Tbody,\n    Tfoot,\n    Tr,\n    Th,\n    Td,\n  },\n  'Table'\n);\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;AAyCA;;;;;;;AAOG;AACH,MAAM,cAAc,GAAyB,CAAC,EAC5C,SAAS,EACT,UAAU,EACV,SAAS,EACT,QAAQ,EACR,WAAW,EACX,WAAW,EACX,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;AAElE,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,OAAO,EAAE;AAClD,QAAA,aAAa,EAAE,UAAU;AACzB,QAAA,YAAY,EAAE,SAAS;AACvB,QAAA,WAAW,EAAE,QAAQ;AACrB,QAAA,cAAc,EAAE,WAAW;QAC3B,cAAc,EAAE,WAAW,IAAI,WAAW;AAC3C,KAAA,CAAC;AAEF,IAAA,MAAM,cAAc,GAAG,qBAAqB,CAAC,iBAAiB,CAAC;IAC/D,MAAM,YAAY,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE5E,IAAA,MAAM,YAAY,IAChBA,GAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,YAAY,EAAA,GAAM,IAAI,EAAA,QAAA,EACrC,QAAQ,EAAA,CACH,CACT;IAED,IAAI,YAAY,EAAE;AAChB,QAAA,OAAOA,aAAK,SAAS,EAAE,cAAc,EAAA,QAAA,EAAG,YAAY,GAAO;IAC7D;AAEA,IAAA,OAAO,YAAY;AACrB,CAAC;AAEM,MAAM,KAAK,GAAG,iBAAiB,CACpC,cAAc,EACd;IACE,KAAK;IACL,KAAK;IACL,KAAK;IACL,EAAE;IACF,EAAE;IACF,EAAE;CACH,EACD,OAAO;;"}
+{"version":3,"file":"Table.js","sources":["../../../src/elements/Table.tsx"],"sourcesContent":["/**\n * @group Table\n */\nimport React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { Thead } from './Thead';\nimport { Tbody } from './Tbody';\nimport { Tfoot } from './Tfoot';\nimport { Tr } from './Tr';\nimport { Th } from './Th';\nimport { Td } from './Td';\n\n/**\n * Props for the Table component.\n */\nexport interface TableProps\n  extends\n    Omit<React.TableHTMLAttributes<HTMLTableElement>, 'color'>,\n    Omit<BulmaClassesProps, 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Adds borders to all cells. */\n  isBordered?: boolean;\n  /** Adds zebra-striping to rows. */\n  isStriped?: boolean;\n  /** Makes the table more compact by cutting cell padding in half. */\n  isNarrow?: boolean;\n  /** Adds a hover effect on rows. */\n  isHoverable?: boolean;\n  /** Makes the table span the full width of its parent. */\n  isFullwidth?: boolean;\n  /** Makes the table span the full width of its parent. @deprecated Use `isFullwidth` instead — `isFullwidth` wins if both are set. */\n  isFullWidth?: boolean;\n  /** Makes the table horizontally scrollable on small screens. */\n  isResponsive?: boolean;\n  /** Table content (should use subcomponents). */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Table` component and its subcomponents provide a highly composable, Bulma-styled table system for React.\n *\n * @function\n * @param {TableProps} props - Props for the Table component.\n * @returns {JSX.Element} The rendered table element.\n * @see {@link https://bulma.io/documentation/elements/table/ | Bulma Table documentation}\n */\nconst TableComponent: React.FC<TableProps> = ({\n  className,\n  isBordered,\n  isStriped,\n  isNarrow,\n  isHoverable,\n  isFullwidth,\n  isFullWidth,\n  isResponsive,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const bulmaClasses = usePrefixedClassNames('table', {\n    'is-bordered': isBordered,\n    'is-striped': isStriped,\n    'is-narrow': isNarrow,\n    'is-hoverable': isHoverable,\n    'is-fullwidth': isFullwidth ?? isFullWidth,\n  });\n\n  const containerClass = usePrefixedClassNames('table-container');\n  const tableClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  const tableElement = (\n    <table className={tableClasses} {...rest}>\n      {children}\n    </table>\n  );\n\n  if (isResponsive) {\n    return <div className={containerClass}>{tableElement}</div>;\n  }\n\n  return tableElement;\n};\n\nexport const Table = withSubComponents(\n  TableComponent,\n  {\n    Thead,\n    Tbody,\n    Tfoot,\n    Tr,\n    Th,\n    Td,\n  },\n  'Table'\n);\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;AAyCA;;;;;;;AAOG;AACH,MAAM,cAAc,GAAyB,CAAC,EAC5C,SAAS,EACT,UAAU,EACV,SAAS,EACT,QAAQ,EACR,WAAW,EACX,WAAW,EACX,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;AAElE,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,OAAO,EAAE;AAClD,QAAA,aAAa,EAAE,UAAU;AACzB,QAAA,YAAY,EAAE,SAAS;AACvB,QAAA,WAAW,EAAE,QAAQ;AACrB,QAAA,cAAc,EAAE,WAAW;QAC3B,cAAc,EAAE,WAAW,IAAI,WAAW;AAC3C,KAAA,CAAC;AAEF,IAAA,MAAM,cAAc,GAAG,qBAAqB,CAAC,iBAAiB,CAAC;IAC/D,MAAM,YAAY,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;AAE5E,IAAA,MAAM,YAAY,IAChBA,GAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,YAAY,EAAA,GAAM,IAAI,EAAA,QAAA,EACrC,QAAQ,EAAA,CACH,CACT;IAED,IAAI,YAAY,EAAE;AAChB,QAAA,OAAOA,aAAK,SAAS,EAAE,cAAc,EAAA,QAAA,EAAG,YAAY,GAAO;IAC7D;AAEA,IAAA,OAAO,YAAY;AACrB,CAAC;AAEM,MAAM,KAAK,GAAG,iBAAiB,CACpC,cAAc,EACd;IACE,KAAK;IACL,KAAK;IACL,KAAK;IACL,EAAE;IACF,EAAE;IACF,EAAE;CACH,EACD,OAAO;;"}

package/dist/esm/elements/Tag.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../src/elements/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { buttonType } from '../helpers/buttonType';\n\nconst validTagColors = [\n  'primary',\n  'link',\n  'info',\n  'success',\n  'warning',\n  'danger',\n  'black',\n  'dark',\n  'light',\n  'white',\n] as const;\n\n/**\n * Valid color values for the Tag component (Bulma tag colors).\n */\nexport type TagColor = (typeof validTagColors)[number];\n\nconst validTagSizes = ['normal', 'medium', 'large'] as const;\n/**\n * Valid size values for the Tag component (Bulma tag sizes).\n */\nexport type TagSize = (typeof validTagSizes)[number];\n\n/**\n * Props for the Tag component.\n */\nexport interface TagProps\n  extends\n    Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Bulma color modifier for the tag. */\n  color?: TagColor;\n  /** Tag size. */\n  size?: TagSize;\n  /** Use the light color variant. */\n  isLight?: boolean;\n  /** Renders a rounded tag. */\n  isRounded?: boolean;\n  /**\n   * Renders a delete-style tag (delete button). The button renders\n   * `type=\"button\"`, so it does not submit a form around it, and is named\n   * \"Delete tag\" unless you pass an `aria-label`. An empty one, or a spread\n   * carrying `'aria-label': undefined`, keeps that name rather than leaving\n   * the button unnamed.\n   */\n  isDelete?: boolean;\n  /** Adds hover effect to the tag. */\n  isHoverable?: boolean;\n  /** Callback for delete tag/button. */\n  onDelete?: () => void;\n  /** Tag content. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Tag` component renders a Bulma-styled label or badge.\n *\n * @function\n * @param {TagProps} props - Props for the Tag component.\n * @returns {JSX.Element} The rendered tag element.\n * @see {@link https://bulma.io/documentation/elements/tag/ | Bulma Tag documentation}\n */\nexport const Tag: React.FC<TagProps> = ({\n  className,\n  color,\n  size,\n  isLight,\n  isRounded,\n  isDelete,\n  isHoverable,\n  onDelete,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const bulmaClasses = usePrefixedClassNames('tag', {\n    [`is-${color}`]: color && validTagColors.includes(color),\n    [`is-${size}`]: size && size !== 'normal' && validTagSizes.includes(size),\n    'is-light': isLight,\n    'is-rounded': isRounded,\n    'is-delete': isDelete,\n    'is-hoverable': isHoverable,\n  });\n\n  const tagClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  if (isDelete) {\n    return (\n      <button\n        className={tagClasses}\n        onClick={onDelete}\n        {...rest}\n        // After the spread, reading through it: a key the spread carries with\n        // no value would otherwise erase the default, leaving a nameless\n        // button that submits the form around it. An empty label falls back\n        // too: the button is drawn as an icon, so `''` would leave it unnamed.\n        // A caller's own value still wins; `buttonType` says more.\n        aria-label={rest['aria-label'] || 'Delete tag'}\n        type={buttonType((rest as { type?: unknown }).type)}\n      />\n    );\n  }\n\n  return (\n    <span className={tagClasses} {...rest}>\n      {children}\n    </span>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAKA,MAAM,cAAc,GAAG;IACrB,SAAS;IACT,MAAM;IACN,MAAM;IACN,SAAS;IACT,SAAS;IACT,QAAQ;IACR,OAAO;IACP,MAAM;IACN,OAAO;IACP,OAAO;CACC;AAOV,MAAM,aAAa,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,CAAU;AAuC5D;;;;;;;AAOG;AACI,MAAM,GAAG,GAAuB,CAAC,EACtC,SAAS,EACT,KAAK,EACL,IAAI,EACJ,OAAO,EACP,SAAS,EACT,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;AAElE,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,KAAK,EAAE;AAChD,QAAA,CAAC,CAAA,GAAA,EAAM,KAAK,CAAA,CAAE,GAAG,KAAK,IAAI,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC;AACxD,QAAA,CAAC,MAAM,IAAI,CAAA,CAAE,GAAG,IAAI,IAAI,IAAI,KAAK,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC;AACzE,QAAA,UAAU,EAAE,OAAO;AACnB,QAAA,YAAY,EAAE,SAAS;AACvB,QAAA,WAAW,EAAE,QAAQ;AACrB,QAAA,cAAc,EAAE,WAAW;AAC5B,KAAA,CAAC;IAEF,MAAM,UAAU,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;IAE1E,IAAI,QAAQ,EAAE;AACZ,QAAA,QACEA,GAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAE,UAAU,EACrB,OAAO,EAAE,QAAQ,EAAA,GACb,IAAI,EAAA,YAAA,EAMI,IAAI,CAAC,YAAY,CAAC,IAAI,YAAY,EAC9C,IAAI,EAAE,UAAU,CAAE,IAA2B,CAAC,IAAI,CAAC,EAAA,CACnD;IAEN;IAEA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,UAAU,EAAA,GAAM,IAAI,EAAA,QAAA,EAClC,QAAQ,EAAA,CACJ;AAEX;;"}
+{"version":3,"file":"Tag.js","sources":["../../../src/elements/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { buttonType } from '../helpers/buttonType';\n\nconst validTagColors = [\n  'primary',\n  'link',\n  'info',\n  'success',\n  'warning',\n  'danger',\n  'black',\n  'dark',\n  'light',\n  'white',\n] as const;\n\n/**\n * Valid color values for the Tag component (Bulma tag colors).\n */\nexport type TagColor = (typeof validTagColors)[number];\n\nconst validTagSizes = ['normal', 'medium', 'large'] as const;\n/**\n * Valid size values for the Tag component (Bulma tag sizes).\n */\nexport type TagSize = (typeof validTagSizes)[number];\n\n/**\n * Props for the Tag component.\n */\nexport interface TagProps\n  extends\n    Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Bulma color modifier for the tag. */\n  color?: TagColor;\n  /** Tag size. */\n  size?: TagSize;\n  /** Use the light color variant. */\n  isLight?: boolean;\n  /** Renders a rounded tag. */\n  isRounded?: boolean;\n  /**\n   * Renders a delete-style tag (delete button). The button renders\n   * `type=\"button\"`, so it does not submit a form around it, and is named\n   * \"Delete tag\" unless you pass an `aria-label`. An empty one, or a spread\n   * carrying `'aria-label': undefined`, keeps that name rather than leaving\n   * the button unnamed.\n   */\n  isDelete?: boolean;\n  /** Adds hover effect to the tag. */\n  isHoverable?: boolean;\n  /** Callback for delete tag/button. */\n  onDelete?: () => void;\n  /** Tag content. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Tag` component renders a Bulma-styled label or badge.\n *\n * @function\n * @param {TagProps} props - Props for the Tag component.\n * @returns {JSX.Element} The rendered tag element.\n * @see {@link https://bulma.io/documentation/elements/tag/ | Bulma Tag documentation}\n */\nexport const Tag: React.FC<TagProps> = ({\n  className,\n  color,\n  size,\n  isLight,\n  isRounded,\n  isDelete,\n  isHoverable,\n  onDelete,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const bulmaClasses = usePrefixedClassNames('tag', {\n    [`is-${color}`]: color && validTagColors.includes(color),\n    [`is-${size}`]: size && size !== 'normal' && validTagSizes.includes(size),\n    'is-light': isLight,\n    'is-rounded': isRounded,\n    'is-delete': isDelete,\n    'is-hoverable': isHoverable,\n  });\n\n  const tagClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  if (isDelete) {\n    return (\n      <button\n        className={tagClasses}\n        onClick={onDelete}\n        {...rest}\n        // After the spread, reading through it: a key the spread carries with\n        // no value would otherwise erase the default, leaving a nameless\n        // button that submits the form around it. An empty label falls back\n        // too: the button is drawn as an icon, so `''` would leave it unnamed.\n        // A caller's own value still wins; `buttonType` says more.\n        aria-label={rest['aria-label'] || 'Delete tag'}\n        type={buttonType((rest as { type?: unknown }).type)}\n      />\n    );\n  }\n\n  return (\n    <span className={tagClasses} {...rest}>\n      {children}\n    </span>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;;AAKA,MAAM,cAAc,GAAG;IACrB,SAAS;IACT,MAAM;IACN,MAAM;IACN,SAAS;IACT,SAAS;IACT,QAAQ;IACR,OAAO;IACP,MAAM;IACN,OAAO;IACP,OAAO;CACC;AAOV,MAAM,aAAa,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,CAAU;AAuC5D;;;;;;;AAOG;AACI,MAAM,GAAG,GAAuB,CAAC,EACtC,SAAS,EACT,KAAK,EACL,IAAI,EACJ,OAAO,EACP,SAAS,EACT,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;AAElE,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,KAAK,EAAE;AAChD,QAAA,CAAC,CAAA,GAAA,EAAM,KAAK,CAAA,CAAE,GAAG,KAAK,IAAI,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC;AACxD,QAAA,CAAC,MAAM,IAAI,CAAA,CAAE,GAAG,IAAI,IAAI,IAAI,KAAK,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC;AACzE,QAAA,UAAU,EAAE,OAAO;AACnB,QAAA,YAAY,EAAE,SAAS;AACvB,QAAA,WAAW,EAAE,QAAQ;AACrB,QAAA,cAAc,EAAE,WAAW;AAC5B,KAAA,CAAC;IAEF,MAAM,UAAU,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;IAE1E,IAAI,QAAQ,EAAE;AACZ,QAAA,QACEA,GAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAE,UAAU,EACrB,OAAO,EAAE,QAAQ,EAAA,GACb,IAAI,EAAA,YAAA,EAMI,IAAI,CAAC,YAAY,CAAC,IAAI,YAAY,EAC9C,IAAI,EAAE,UAAU,CAAE,IAA2B,CAAC,IAAI,CAAC,EAAA,CACnD;IAEN;IAEA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,UAAU,EAAA,GAAM,IAAI,EAAA,QAAA,EAClC,QAAQ,EAAA,CACJ;AAEX;;"}

package/dist/esm/elements/Tags.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { withSubComponents } from '../helpers/withSubComponents.js';

package/dist/esm/elements/Tags.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tags.js","sources":["../../../src/elements/Tags.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { Tag } from './Tag';\n\nconst validTagsSizes = ['medium', 'large'] as const;\n/**\n * Valid size values for the Tags component (Bulma tag group sizes).\n */\nexport type TagsSize = (typeof validTagsSizes)[number];\n\n/**\n * Props for the Tags component.\n */\nexport interface TagsProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'backgroundColor' | 'color' | 'size'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Group tags together as add-ons (no spacing). */\n  hasAddons?: boolean;\n  /**\n   * No-op retained for backwards compatibility.\n   *\n   * @deprecated Bulma's `.tags` wraps by default (no shipped `are-multiline`\n   * CSS exists for it) — this prop has never had a visual effect and will be\n   * removed in the next major version.\n   */\n  isMultiline?: boolean;\n  /** Size of every tag in the group. */\n  size?: TagsSize;\n  /** Tag elements to render inside the container. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Tags` component groups multiple `Tag` components together in a Bulma-styled container that wraps onto multiple lines by default.\n *\n * @function\n * @param {TagsProps} props - Props for the Tags component.\n * @returns {JSX.Element} The rendered tags container.\n * @see {@link https://bulma.io/documentation/elements/tag/#list-of-tags | Bulma Tags documentation}\n */\nconst TagsComponent: React.FC<TagsProps> = ({\n  className,\n  hasAddons,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- accepted for backwards compatibility, deprecated no-op (no `are-multiline` CSS ships)\n  isMultiline,\n  size,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const bulmaClasses = usePrefixedClassNames('tags', {\n    'has-addons': hasAddons,\n    [`are-${size}`]: size && validTagsSizes.includes(size),\n  });\n\n  const tagsClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <div className={tagsClasses} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nexport const Tags = withSubComponents(TagsComponent, { Tag }, 'Tags');\n"],"names":["_jsx"],"mappings":";;;;;;;AAMA,MAAM,cAAc,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU;AA+BnD;;;;;;;AAOG;AACH,MAAM,aAAa,GAAwB,CAAC,EAC1C,SAAS,EACT,SAAS;AACT;AACA,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;AAElE,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,MAAM,EAAE;AACjD,QAAA,YAAY,EAAE,SAAS;AACvB,QAAA,CAAC,CAAA,IAAA,EAAO,IAAI,CAAA,CAAE,GAAG,IAAI,IAAI,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC;AACvD,KAAA,CAAC;IAEF,MAAM,WAAW,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;IAE3E,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,WAAW,EAAA,GAAM,IAAI,EAAA,QAAA,EAClC,QAAQ,EAAA,CACL;AAEV,CAAC;AAEM,MAAM,IAAI,GAAG,iBAAiB,CAAC,aAAa,EAAE,EAAE,GAAG,EAAE,EAAE,MAAM;;"}
+{"version":3,"file":"Tags.js","sources":["../../../src/elements/Tags.tsx"],"sourcesContent":["import React from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\nimport { Tag } from './Tag';\n\nconst validTagsSizes = ['medium', 'large'] as const;\n/**\n * Valid size values for the Tags component (Bulma tag group sizes).\n */\nexport type TagsSize = (typeof validTagsSizes)[number];\n\n/**\n * Props for the Tags component.\n */\nexport interface TagsProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'backgroundColor' | 'color' | 'size'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Group tags together as add-ons (no spacing). */\n  hasAddons?: boolean;\n  /**\n   * No-op retained for backwards compatibility.\n   *\n   * @deprecated Bulma's `.tags` wraps by default (no shipped `are-multiline`\n   * CSS exists for it) — this prop has never had a visual effect and will be\n   * removed in the next major version.\n   */\n  isMultiline?: boolean;\n  /** Size of every tag in the group. */\n  size?: TagsSize;\n  /** Tag elements to render inside the container. */\n  children?: React.ReactNode;\n}\n\n/**\n * The `Tags` component groups multiple `Tag` components together in a Bulma-styled container that wraps onto multiple lines by default.\n *\n * @function\n * @param {TagsProps} props - Props for the Tags component.\n * @returns {JSX.Element} The rendered tags container.\n * @see {@link https://bulma.io/documentation/elements/tag/#list-of-tags | Bulma Tags documentation}\n */\nconst TagsComponent: React.FC<TagsProps> = ({\n  className,\n  hasAddons,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- accepted for backwards compatibility, deprecated no-op (no `are-multiline` CSS ships)\n  isMultiline,\n  size,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const bulmaClasses = usePrefixedClassNames('tags', {\n    'has-addons': hasAddons,\n    [`are-${size}`]: size && validTagsSizes.includes(size),\n  });\n\n  const tagsClasses = classNames(bulmaClasses, bulmaHelperClasses, className);\n\n  return (\n    <div className={tagsClasses} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nexport const Tags = withSubComponents(TagsComponent, { Tag }, 'Tags');\n"],"names":["_jsx"],"mappings":";;;;;;;;AAMA,MAAM,cAAc,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU;AA+BnD;;;;;;;AAOG;AACH,MAAM,aAAa,GAAwB,CAAC,EAC1C,SAAS,EACT,SAAS;AACT;AACA,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;AAElE,IAAA,MAAM,YAAY,GAAG,qBAAqB,CAAC,MAAM,EAAE;AACjD,QAAA,YAAY,EAAE,SAAS;AACvB,QAAA,CAAC,CAAA,IAAA,EAAO,IAAI,CAAA,CAAE,GAAG,IAAI,IAAI,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC;AACvD,KAAA,CAAC;IAEF,MAAM,WAAW,GAAG,UAAU,CAAC,YAAY,EAAE,kBAAkB,EAAE,SAAS,CAAC;IAE3E,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,WAAW,EAAA,GAAM,IAAI,EAAA,QAAA,EAClC,QAAQ,EAAA,CACL;AAEV,CAAC;AAEM,MAAM,IAAI,GAAG,iBAAiB,CAAC,aAAa,EAAE,EAAE,GAAG,EAAE,EAAE,MAAM;;"}

package/dist/esm/elements/Tbody.js

@@ -1,4 +1,5 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
+'use client';
 import { jsx } from 'react/jsx-runtime';
 import { classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';

package/dist/esm/elements/Tbody.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tbody.js","sources":["../../../src/elements/Tbody.tsx"],"sourcesContent":["/**\n * @group Table\n */\nimport React from 'react';\nimport classNames from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Tbody component.\n */\nexport interface TbodyProps\n  extends\n    Omit<React.HTMLAttributes<HTMLTableSectionElement>, 'color'>,\n    Omit<BulmaClassesProps, 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Table body content (rows). */\n  children?: React.ReactNode;\n}\n\n/**\n * Tbody component for rendering a styled Bulma table body.\n *\n * Supports Bulma helper classes for additional styling.\n *\n * @function\n * @param {TbodyProps} props - Props for the Tbody component.\n * @returns {JSX.Element} The rendered table body element.\n * @see {@link https://bulma.io/documentation/elements/table/#table-body | Bulma Table documentation}\n */\nexport const Tbody: React.FC<TbodyProps> = ({\n  className,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const tbodyClasses = classNames(className, bulmaHelperClasses);\n\n  return (\n    <tbody className={tbodyClasses || undefined} {...rest}>\n      {children}\n    </tbody>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;AAoBA;;;;;;;;;AASG;AACI,MAAM,KAAK,GAAyB,CAAC,EAC1C,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;IAElE,MAAM,YAAY,GAAG,UAAU,CAAC,SAAS,EAAE,kBAAkB,CAAC;AAE9D,IAAA,QACEA,GAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,YAAY,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAClD,QAAQ,EAAA,CACH;AAEZ;;"}
+{"version":3,"file":"Tbody.js","sources":["../../../src/elements/Tbody.tsx"],"sourcesContent":["/**\n * @group Table\n */\nimport React from 'react';\nimport classNames from '../helpers/classNames';\nimport { useBulmaClasses, BulmaClassesProps } from '../helpers/useBulmaClasses';\n\n/**\n * Props for the Tbody component.\n */\nexport interface TbodyProps\n  extends\n    Omit<React.HTMLAttributes<HTMLTableSectionElement>, 'color'>,\n    Omit<BulmaClassesProps, 'backgroundColor'> {\n  /** Additional CSS classes to apply. */\n  className?: string;\n  /** Table body content (rows). */\n  children?: React.ReactNode;\n}\n\n/**\n * Tbody component for rendering a styled Bulma table body.\n *\n * Supports Bulma helper classes for additional styling.\n *\n * @function\n * @param {TbodyProps} props - Props for the Tbody component.\n * @returns {JSX.Element} The rendered table body element.\n * @see {@link https://bulma.io/documentation/elements/table/#table-body | Bulma Table documentation}\n */\nexport const Tbody: React.FC<TbodyProps> = ({\n  className,\n  children,\n  ...props\n}) => {\n  /**\n   * Generates Bulma helper classes and separates out remaining props.\n   */\n  const { bulmaHelperClasses, rest } = useBulmaClasses({ ...props });\n\n  const tbodyClasses = classNames(className, bulmaHelperClasses);\n\n  return (\n    <tbody className={tbodyClasses || undefined} {...rest}>\n      {children}\n    </tbody>\n  );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAoBA;;;;;;;;;AASG;AACI,MAAM,KAAK,GAAyB,CAAC,EAC1C,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,KAAI;AACH;;AAEG;AACH,IAAA,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,GAAG,eAAe,CAAC,EAAE,GAAG,KAAK,EAAE,CAAC;IAElE,MAAM,YAAY,GAAG,UAAU,CAAC,SAAS,EAAE,kBAAkB,CAAC;AAE9D,IAAA,QACEA,GAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,YAAY,IAAI,SAAS,EAAA,GAAM,IAAI,EAAA,QAAA,EAClD,QAAQ,EAAA,CACH;AAEZ;;"}