bubble-toolbar 0.0.0-stage → 0.1.0

package/dist/index.js

@@ -0,0 +1,487 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  BubbleArea: () => BubbleArea,
+  BubbleGroup: () => BubbleGroup,
+  BubbleIconButton: () => BubbleIconButton,
+  BubbleToolbar: () => BubbleToolbar,
+  BubbleToolbarContext: () => BubbleToolbarContext,
+  formatPx: () => formatPx,
+  getGlassStyles: () => getGlassStyles,
+  getValidChildren: () => getValidChildren,
+  resolveSize: () => resolveSize,
+  useBubbleToolbar: () => useBubbleToolbar
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/BubbleToolbar.tsx
+var import_react4 = require("react");
+
+// src/context.ts
+var import_react = require("react");
+var defaultContextValue = {
+  size: "md",
+  theme: "glass",
+  blurred: true,
+  blurAmount: 16,
+  itemGap: 8,
+  bordered: true,
+  shadow: true
+};
+var BubbleToolbarContext = (0, import_react.createContext)(defaultContextValue);
+var useBubbleToolbar = () => {
+  return (0, import_react.useContext)(BubbleToolbarContext);
+};
+
+// src/BubbleGroup.tsx
+var import_react3 = require("react");
+
+// src/utils/children.ts
+var import_react2 = __toESM(require("react"));
+function getValidChildren(children) {
+  const result = [];
+  import_react2.default.Children.forEach(children, (child) => {
+    if (child === null || child === void 0 || typeof child === "boolean") {
+      return;
+    }
+    if (import_react2.default.isValidElement(child) && child.type === import_react2.default.Fragment) {
+      const fragmentChildren = getValidChildren(
+        child.props.children
+      );
+      result.push(...fragmentChildren);
+    } else {
+      result.push(child);
+    }
+  });
+  return result;
+}
+
+// src/utils/styles.ts
+function resolveSize(size) {
+  if (typeof size === "number") return size;
+  switch (size) {
+    case "sm":
+      return 40;
+    case "lg":
+      return 56;
+    case "md":
+    default:
+      return 48;
+  }
+}
+function formatPx(val) {
+  return typeof val === "number" ? `${val}px` : val;
+}
+function getGlassStyles(theme, blurred, blurAmount, bordered, shadow) {
+  const blurVal = formatPx(blurAmount);
+  let background;
+  let borderColor;
+  let color;
+  switch (theme) {
+    case "dark":
+      background = blurred ? "rgba(24, 24, 27, 0.72)" : "rgba(24, 24, 27, 0.95)";
+      borderColor = "rgba(255, 255, 255, 0.12)";
+      color = "#f4f4f5";
+      break;
+    case "light":
+      background = blurred ? "rgba(255, 255, 255, 0.75)" : "rgba(255, 255, 255, 0.95)";
+      borderColor = "rgba(0, 0, 0, 0.08)";
+      color = "#18181b";
+      break;
+    case "auto":
+      background = "var(--bubble-bg, rgba(255, 255, 255, 0.75))";
+      borderColor = "var(--bubble-border, rgba(0, 0, 0, 0.08))";
+      color = "var(--bubble-fg, #18181b)";
+      break;
+    case "glass":
+    default:
+      background = blurred ? "rgba(255, 255, 255, 0.65)" : "rgba(255, 255, 255, 0.92)";
+      borderColor = "rgba(255, 255, 255, 0.4)";
+      color = "#09090b";
+      break;
+  }
+  const boxShadow = typeof shadow === "string" ? shadow : shadow ? "0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.06)" : "none";
+  return {
+    backgroundColor: background,
+    backdropFilter: blurred ? `blur(${blurVal}) saturate(180%)` : void 0,
+    WebkitBackdropFilter: blurred ? `blur(${blurVal}) saturate(180%)` : void 0,
+    border: bordered ? `1px solid ${borderColor}` : "none",
+    boxShadow,
+    color,
+    transition: "all 0.25s cubic-bezier(0.16, 1, 0.3, 1)"
+  };
+}
+
+// src/BubbleGroup.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var BubbleGroup = (0, import_react3.forwardRef)(
+  ({
+    children,
+    shape: explicitShape,
+    size: explicitSize,
+    itemGap: explicitItemGap,
+    className = "",
+    style,
+    ...rest
+  }, ref) => {
+    const context = useBubbleToolbar();
+    const validChildren = getValidChildren(children);
+    const count = validChildren.length;
+    const computedShape = explicitShape || (count <= 1 ? "circle" : "pill");
+    const effectiveSize = resolveSize(explicitSize || context.size);
+    const effectiveItemGap = explicitItemGap !== void 0 ? explicitItemGap : context.itemGap;
+    const glassStyles = getGlassStyles(
+      context.theme,
+      context.blurred,
+      context.blurAmount,
+      context.bordered,
+      context.shadow
+    );
+    const isCircle = computedShape === "circle";
+    const groupStyles = {
+      ...glassStyles,
+      height: `${effectiveSize}px`,
+      boxSizing: "border-box",
+      display: "inline-flex",
+      alignItems: "center",
+      flexShrink: 0,
+      userSelect: "none",
+      ...isCircle ? {
+        width: `${effectiveSize}px`,
+        minWidth: `${effectiveSize}px`,
+        borderRadius: "9999px",
+        justifyContent: "center",
+        padding: 0
+      } : {
+        width: "auto",
+        minWidth: `${effectiveSize}px`,
+        borderRadius: "9999px",
+        flexDirection: "row",
+        justifyContent: "flex-start",
+        paddingLeft: `${Math.max(12, Math.round(effectiveSize * 0.28))}px`,
+        paddingRight: `${Math.max(12, Math.round(effectiveSize * 0.28))}px`,
+        gap: formatPx(effectiveItemGap)
+      },
+      ...style
+    };
+    const combinedClassName = [
+      "bubble-group",
+      `bubble-group--${computedShape}`,
+      className
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "div",
+      {
+        ref,
+        role: "group",
+        className: combinedClassName,
+        style: groupStyles,
+        "data-shape": computedShape,
+        "data-items-count": count,
+        ...rest,
+        children: validChildren
+      }
+    );
+  }
+);
+BubbleGroup.displayName = "BubbleGroup";
+
+// src/BubbleToolbar.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var BubbleToolbar = (0, import_react4.forwardRef)(
+  ({
+    groups,
+    children,
+    position = "bottom",
+    theme = "glass",
+    size = "md",
+    blurred = true,
+    blurAmount = 16,
+    groupGap = 8,
+    itemGap = 8,
+    bordered = true,
+    shadow = true,
+    className = "",
+    style,
+    ariaLabel = "Toolbar",
+    ...rest
+  }, ref) => {
+    const contextValue = (0, import_react4.useMemo)(
+      () => ({
+        size,
+        theme,
+        blurred,
+        blurAmount,
+        itemGap,
+        bordered,
+        shadow
+      }),
+      [size, theme, blurred, blurAmount, itemGap, bordered, shadow]
+    );
+    const getPositionStyles = () => {
+      switch (position) {
+        case "bottom":
+          return {
+            position: "fixed",
+            bottom: "24px",
+            left: "50%",
+            transform: "translateX(-50%)",
+            zIndex: 1e3
+          };
+        case "top":
+          return {
+            position: "fixed",
+            top: "24px",
+            left: "50%",
+            transform: "translateX(-50%)",
+            zIndex: 1e3
+          };
+        case "static":
+          return {
+            position: "relative"
+          };
+        case "custom":
+        default:
+          return {};
+      }
+    };
+    const containerStyles = {
+      ...getPositionStyles(),
+      display: "inline-flex",
+      alignItems: "center",
+      gap: formatPx(groupGap),
+      maxWidth: "calc(100vw - 32px)",
+      overflowX: "auto",
+      overflowY: "hidden",
+      padding: "4px",
+      boxSizing: "border-box",
+      scrollbarWidth: "none",
+      // Firefox
+      msOverflowStyle: "none",
+      // IE/Edge
+      WebkitOverflowScrolling: "touch",
+      pointerEvents: "auto",
+      ...style
+    };
+    const combinedClassName = [
+      "bubble-toolbar",
+      `bubble-toolbar--${position}`,
+      `bubble-toolbar--${theme}`,
+      className
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BubbleToolbarContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+      "div",
+      {
+        ref,
+        role: "toolbar",
+        "aria-label": ariaLabel,
+        className: combinedClassName,
+        style: containerStyles,
+        ...rest,
+        children: [
+          groups && groups.length > 0 ? groups.map((groupItems, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BubbleGroup, { children: groupItems }, index)) : null,
+          children
+        ]
+      }
+    ) });
+  }
+);
+BubbleToolbar.displayName = "BubbleToolbar";
+BubbleToolbar.Group = BubbleGroup;
+
+// src/components/BubbleIconButton.tsx
+var import_react5 = require("react");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var ICONS = {
+  search: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("circle", { cx: "11", cy: "11", r: "8" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
+  ] }),
+  theme: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("circle", { cx: "12", cy: "12", r: "5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "12", y1: "1", x2: "12", y2: "3" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "12", y1: "21", x2: "12", y2: "23" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "4.22", y1: "4.22", x2: "5.64", y2: "5.64" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "18.36", y1: "18.36", x2: "19.78", y2: "19.78" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "1", y1: "12", x2: "3", y2: "12" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "21", y1: "12", x2: "23", y2: "12" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "4.22", y1: "19.78", x2: "5.64", y2: "18.36" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "18.36", y1: "5.64", x2: "19.78", y2: "4.22" })
+  ] }),
+  chat: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" }) }),
+  notifications: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M13.73 21a2 2 0 0 1-3.46 0" })
+  ] }),
+  logo: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("polygon", { points: "12 2 2 7 12 12 22 7 12 2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("polyline", { points: "2 17 12 22 22 17" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("polyline", { points: "2 12 12 17 22 12" })
+  ] }),
+  close: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+  ] })
+};
+var BubbleIconButton = (0, import_react5.forwardRef)(
+  ({
+    name,
+    icon,
+    active = false,
+    badge,
+    tooltip,
+    children,
+    className = "",
+    style,
+    onMouseEnter,
+    onMouseLeave,
+    ariaLabel,
+    ...rest
+  }, ref) => {
+    const [isHovered, setIsHovered] = (0, import_react5.useState)(false);
+    const iconContent = icon || (name ? ICONS[name] : null) || children;
+    const computedAriaLabel = ariaLabel || tooltip || (name ? `${name} button` : "button");
+    const buttonStyles = {
+      position: "relative",
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      width: "36px",
+      height: "36px",
+      borderRadius: "50%",
+      border: "none",
+      background: active ? "rgba(0, 0, 0, 0.08)" : isHovered ? "rgba(0, 0, 0, 0.05)" : "transparent",
+      color: "inherit",
+      cursor: "pointer",
+      padding: 0,
+      margin: 0,
+      outline: "none",
+      transition: "background-color 0.15s ease, transform 0.15s ease",
+      transform: isHovered ? "scale(1.06)" : "scale(1)",
+      flexShrink: 0,
+      ...style
+    };
+    const badgeStyles = {
+      position: "absolute",
+      top: "4px",
+      right: "4px",
+      minWidth: "7px",
+      height: "7px",
+      padding: typeof badge === "number" || typeof badge === "string" ? "1px 3px" : 0,
+      borderRadius: "9999px",
+      backgroundColor: "#ef4444",
+      color: "#ffffff",
+      fontSize: "9px",
+      fontWeight: "bold",
+      lineHeight: "1",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      boxShadow: "0 0 0 1.5px rgba(255, 255, 255, 0.9)"
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "button",
+      {
+        ref,
+        type: "button",
+        title: tooltip,
+        "aria-label": computedAriaLabel,
+        className: `bubble-icon-button ${active ? "bubble-icon-button--active" : ""} ${className}`.trim(),
+        style: buttonStyles,
+        onMouseEnter: (e) => {
+          setIsHovered(true);
+          onMouseEnter?.(e);
+        },
+        onMouseLeave: (e) => {
+          setIsHovered(false);
+          onMouseLeave?.(e);
+        },
+        ...rest,
+        children: [
+          iconContent,
+          badge ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "bubble-icon-button__badge", style: badgeStyles, children: typeof badge !== "boolean" ? badge : null }) : null
+        ]
+      }
+    );
+  }
+);
+BubbleIconButton.displayName = "BubbleIconButton";
+
+// src/components/BubbleArea.tsx
+var import_react6 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var BubbleArea = (0, import_react6.forwardRef)(
+  ({
+    children,
+    minWidth = 120,
+    maxWidth,
+    className = "",
+    style,
+    ...rest
+  }, ref) => {
+    const areaStyles = {
+      display: "inline-flex",
+      alignItems: "center",
+      minWidth: formatPx(minWidth),
+      maxWidth: maxWidth ? formatPx(maxWidth) : void 0,
+      flex: "1 1 auto",
+      fontSize: "14px",
+      color: "inherit",
+      ...style
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "div",
+      {
+        ref,
+        className: `bubble-area ${className}`.trim(),
+        style: areaStyles,
+        ...rest,
+        children
+      }
+    );
+  }
+);
+BubbleArea.displayName = "BubbleArea";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BubbleArea,
+  BubbleGroup,
+  BubbleIconButton,
+  BubbleToolbar,
+  BubbleToolbarContext,
+  formatPx,
+  getGlassStyles,
+  getValidChildren,
+  resolveSize,
+  useBubbleToolbar
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/BubbleToolbar.tsx","../src/context.ts","../src/BubbleGroup.tsx","../src/utils/children.ts","../src/utils/styles.ts","../src/components/BubbleIconButton.tsx","../src/components/BubbleArea.tsx"],"sourcesContent":["export { BubbleToolbar } from './BubbleToolbar';\nexport type { BubbleToolbarComponent } from './BubbleToolbar';\nexport { BubbleGroup } from './BubbleGroup';\nexport { BubbleIconButton } from './components/BubbleIconButton';\nexport { BubbleArea } from './components/BubbleArea';\nexport { BubbleToolbarContext, useBubbleToolbar } from './context';\nexport { getValidChildren } from './utils/children';\nexport { resolveSize, formatPx, getGlassStyles } from './utils/styles';\n\nexport type {\n  BubbleToolbarProps,\n  BubbleGroupProps,\n  BubbleIconButtonProps,\n  BubbleAreaProps,\n  BubbleToolbarTheme,\n  BubbleToolbarPosition,\n  BubbleToolbarSize,\n  BubbleShape,\n} from './types';\n\n","import React, { forwardRef, useMemo } from 'react';\nimport type { BubbleToolbarProps } from './types';\nimport { BubbleToolbarContext, BubbleToolbarContextValue } from './context';\nimport { BubbleGroup } from './BubbleGroup';\nimport { formatPx } from './utils/styles';\n\nexport interface BubbleToolbarComponent\n  extends React.ForwardRefExoticComponent<\n    BubbleToolbarProps & React.RefAttributes<HTMLDivElement>\n  > {\n  Group: typeof BubbleGroup;\n}\n\nexport const BubbleToolbar = forwardRef<HTMLDivElement, BubbleToolbarProps>(\n  (\n    {\n      groups,\n      children,\n      position = 'bottom',\n      theme = 'glass',\n      size = 'md',\n      blurred = true,\n      blurAmount = 16,\n      groupGap = 8,\n      itemGap = 8,\n      bordered = true,\n      shadow = true,\n      className = '',\n      style,\n      ariaLabel = 'Toolbar',\n      ...rest\n    },\n    ref\n  ) => {\n    const contextValue = useMemo<BubbleToolbarContextValue>(\n      () => ({\n        size,\n        theme,\n        blurred,\n        blurAmount,\n        itemGap,\n        bordered,\n        shadow,\n      }),\n      [size, theme, blurred, blurAmount, itemGap, bordered, shadow]\n    );\n\n    // Compute positioning styles\n    const getPositionStyles = (): React.CSSProperties => {\n      switch (position) {\n        case 'bottom':\n          return {\n            position: 'fixed',\n            bottom: '24px',\n            left: '50%',\n            transform: 'translateX(-50%)',\n            zIndex: 1000,\n          };\n        case 'top':\n          return {\n            position: 'fixed',\n            top: '24px',\n            left: '50%',\n            transform: 'translateX(-50%)',\n            zIndex: 1000,\n          };\n        case 'static':\n          return {\n            position: 'relative',\n          };\n        case 'custom':\n        default:\n          return {};\n      }\n    };\n\n    const containerStyles: React.CSSProperties = {\n      ...getPositionStyles(),\n      display: 'inline-flex',\n      alignItems: 'center',\n      gap: formatPx(groupGap),\n      maxWidth: 'calc(100vw - 32px)',\n      overflowX: 'auto',\n      overflowY: 'hidden',\n      padding: '4px',\n      boxSizing: 'border-box',\n      scrollbarWidth: 'none', // Firefox\n      msOverflowStyle: 'none', // IE/Edge\n      WebkitOverflowScrolling: 'touch',\n      pointerEvents: 'auto',\n      ...style,\n    };\n\n    const combinedClassName = [\n      'bubble-toolbar',\n      `bubble-toolbar--${position}`,\n      `bubble-toolbar--${theme}`,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <BubbleToolbarContext.Provider value={contextValue}>\n        <div\n          ref={ref}\n          role=\"toolbar\"\n          aria-label={ariaLabel}\n          className={combinedClassName}\n          style={containerStyles}\n          {...rest}\n        >\n          {groups && groups.length > 0\n            ? groups.map((groupItems, index) => (\n                <BubbleGroup key={index}>\n                  {groupItems}\n                </BubbleGroup>\n              ))\n            : null}\n          {children}\n        </div>\n      </BubbleToolbarContext.Provider>\n    );\n  }\n) as BubbleToolbarComponent;\n\nBubbleToolbar.displayName = 'BubbleToolbar';\nBubbleToolbar.Group = BubbleGroup;\n\n","import { createContext, useContext } from 'react';\nimport type { BubbleToolbarTheme, BubbleToolbarSize } from './types';\n\nexport interface BubbleToolbarContextValue {\n  size: BubbleToolbarSize;\n  theme: BubbleToolbarTheme;\n  blurred: boolean;\n  blurAmount: number | string;\n  itemGap: number | string;\n  bordered: boolean;\n  shadow: boolean | string;\n}\n\nexport const defaultContextValue: BubbleToolbarContextValue = {\n  size: 'md',\n  theme: 'glass',\n  blurred: true,\n  blurAmount: 16,\n  itemGap: 8,\n  bordered: true,\n  shadow: true,\n};\n\nexport const BubbleToolbarContext = createContext<BubbleToolbarContextValue>(defaultContextValue);\n\nexport const useBubbleToolbar = (): BubbleToolbarContextValue => {\n  return useContext(BubbleToolbarContext);\n};\n\n","import React, { forwardRef } from 'react';\nimport type { BubbleGroupProps, BubbleShape } from './types';\nimport { useBubbleToolbar } from './context';\nimport { getValidChildren } from './utils/children';\nimport { resolveSize, formatPx, getGlassStyles } from './utils/styles';\n\nexport const BubbleGroup = forwardRef<HTMLDivElement, BubbleGroupProps>(\n  (\n    {\n      children,\n      shape: explicitShape,\n      size: explicitSize,\n      itemGap: explicitItemGap,\n      className = '',\n      style,\n      ...rest\n    },\n    ref\n  ) => {\n    const context = useBubbleToolbar();\n\n    const validChildren = getValidChildren(children);\n    const count = validChildren.length;\n\n    // Morphological logic:\n    // 1 node => circle\n    // > 1 node => pill / rounded rectangle\n    const computedShape: BubbleShape =\n      explicitShape || (count <= 1 ? 'circle' : 'pill');\n\n    const effectiveSize = resolveSize(explicitSize || context.size);\n    const effectiveItemGap =\n      explicitItemGap !== undefined ? explicitItemGap : context.itemGap;\n\n    const glassStyles = getGlassStyles(\n      context.theme,\n      context.blurred,\n      context.blurAmount,\n      context.bordered,\n      context.shadow\n    );\n\n    const isCircle = computedShape === 'circle';\n\n    const groupStyles: React.CSSProperties = {\n      ...glassStyles,\n      height: `${effectiveSize}px`,\n      boxSizing: 'border-box',\n      display: 'inline-flex',\n      alignItems: 'center',\n      flexShrink: 0,\n      userSelect: 'none',\n      ...(isCircle\n        ? {\n            width: `${effectiveSize}px`,\n            minWidth: `${effectiveSize}px`,\n            borderRadius: '9999px',\n            justifyContent: 'center',\n            padding: 0,\n          }\n        : {\n            width: 'auto',\n            minWidth: `${effectiveSize}px`,\n            borderRadius: '9999px',\n            flexDirection: 'row',\n            justifyContent: 'flex-start',\n            paddingLeft: `${Math.max(12, Math.round(effectiveSize * 0.28))}px`,\n            paddingRight: `${Math.max(12, Math.round(effectiveSize * 0.28))}px`,\n            gap: formatPx(effectiveItemGap),\n          }),\n      ...style,\n    };\n\n    const combinedClassName = [\n      'bubble-group',\n      `bubble-group--${computedShape}`,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div\n        ref={ref}\n        role=\"group\"\n        className={combinedClassName}\n        style={groupStyles}\n        data-shape={computedShape}\n        data-items-count={count}\n        {...rest}\n      >\n        {validChildren}\n      </div>\n    );\n  }\n);\n\nBubbleGroup.displayName = 'BubbleGroup';\n\n","import React, { ReactNode } from 'react';\n\n/**\n * Returns an array of non-null, non-undefined, non-boolean child elements.\n * Unpacks React.Fragment if encountered at the top level.\n */\nexport function getValidChildren(children: ReactNode): ReactNode[] {\n  const result: ReactNode[] = [];\n\n  React.Children.forEach(children, (child) => {\n    if (child === null || child === undefined || typeof child === 'boolean') {\n      return;\n    }\n\n    if (React.isValidElement(child) && child.type === React.Fragment) {\n      const fragmentChildren = getValidChildren(\n        (child.props as { children?: ReactNode }).children\n      );\n      result.push(...fragmentChildren);\n    } else {\n      result.push(child);\n    }\n  });\n\n  return result;\n}\n\n","import type { CSSProperties } from 'react';\nimport type { BubbleToolbarTheme, BubbleToolbarSize } from '../types';\n\nexport function resolveSize(size: BubbleToolbarSize): number {\n  if (typeof size === 'number') return size;\n  switch (size) {\n    case 'sm':\n      return 40;\n    case 'lg':\n      return 56;\n    case 'md':\n    default:\n      return 48;\n  }\n}\n\nexport function formatPx(val: number | string): string {\n  return typeof val === 'number' ? `${val}px` : val;\n}\n\nexport function getGlassStyles(\n  theme: BubbleToolbarTheme,\n  blurred: boolean,\n  blurAmount: number | string,\n  bordered: boolean,\n  shadow: boolean | string\n): CSSProperties {\n  const blurVal = formatPx(blurAmount);\n\n  // Background and border tint based on theme\n  let background: string;\n  let borderColor: string;\n  let color: string;\n\n  switch (theme) {\n    case 'dark':\n      background = blurred ? 'rgba(24, 24, 27, 0.72)' : 'rgba(24, 24, 27, 0.95)';\n      borderColor = 'rgba(255, 255, 255, 0.12)';\n      color = '#f4f4f5';\n      break;\n    case 'light':\n      background = blurred ? 'rgba(255, 255, 255, 0.75)' : 'rgba(255, 255, 255, 0.95)';\n      borderColor = 'rgba(0, 0, 0, 0.08)';\n      color = '#18181b';\n      break;\n    case 'auto':\n      background = 'var(--bubble-bg, rgba(255, 255, 255, 0.75))';\n      borderColor = 'var(--bubble-border, rgba(0, 0, 0, 0.08))';\n      color = 'var(--bubble-fg, #18181b)';\n      break;\n    case 'glass':\n    default:\n      // Neutral luminous frosted glass\n      background = blurred ? 'rgba(255, 255, 255, 0.65)' : 'rgba(255, 255, 255, 0.92)';\n      borderColor = 'rgba(255, 255, 255, 0.4)';\n      color = '#09090b';\n      break;\n  }\n\n  const boxShadow =\n    typeof shadow === 'string'\n      ? shadow\n      : shadow\n      ? '0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.06)'\n      : 'none';\n\n  return {\n    backgroundColor: background,\n    backdropFilter: blurred ? `blur(${blurVal}) saturate(180%)` : undefined,\n    WebkitBackdropFilter: blurred ? `blur(${blurVal}) saturate(180%)` : undefined,\n    border: bordered ? `1px solid ${borderColor}` : 'none',\n    boxShadow,\n    color,\n    transition: 'all 0.25s cubic-bezier(0.16, 1, 0.3, 1)',\n  };\n}\n\n","import React, { forwardRef, useState } from 'react';\nimport type { BubbleIconButtonProps } from '../types';\n\n/**\n * Standard inline SVG icons for quick prototyping out-of-the-box\n */\nconst ICONS: Record<string, React.ReactNode> = {\n  search: (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <circle cx=\"11\" cy=\"11\" r=\"8\" />\n      <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\" />\n    </svg>\n  ),\n  theme: (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <circle cx=\"12\" cy=\"12\" r=\"5\" />\n      <line x1=\"12\" y1=\"1\" x2=\"12\" y2=\"3\" />\n      <line x1=\"12\" y1=\"21\" x2=\"12\" y2=\"23\" />\n      <line x1=\"4.22\" y1=\"4.22\" x2=\"5.64\" y2=\"5.64\" />\n      <line x1=\"18.36\" y1=\"18.36\" x2=\"19.78\" y2=\"19.78\" />\n      <line x1=\"1\" y1=\"12\" x2=\"3\" y2=\"12\" />\n      <line x1=\"21\" y1=\"12\" x2=\"23\" y2=\"12\" />\n      <line x1=\"4.22\" y1=\"19.78\" x2=\"5.64\" y2=\"18.36\" />\n      <line x1=\"18.36\" y1=\"5.64\" x2=\"19.78\" y2=\"4.22\" />\n    </svg>\n  ),\n  chat: (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\" />\n    </svg>\n  ),\n  notifications: (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9\" />\n      <path d=\"M13.73 21a2 2 0 0 1-3.46 0\" />\n    </svg>\n  ),\n  logo: (\n    <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <polygon points=\"12 2 2 7 12 12 22 7 12 2\" />\n      <polyline points=\"2 17 12 22 22 17\" />\n      <polyline points=\"2 12 12 17 22 12\" />\n    </svg>\n  ),\n  close: (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  ),\n};\n\nexport const BubbleIconButton = forwardRef<HTMLButtonElement, BubbleIconButtonProps>(\n  (\n    {\n      name,\n      icon,\n      active = false,\n      badge,\n      tooltip,\n      children,\n      className = '',\n      style,\n      onMouseEnter,\n      onMouseLeave,\n      ariaLabel,\n      ...rest\n    },\n    ref\n  ) => {\n    const [isHovered, setIsHovered] = useState(false);\n\n    const iconContent = icon || (name ? ICONS[name] : null) || children;\n    const computedAriaLabel = ariaLabel || tooltip || (name ? `${name} button` : 'button');\n\n    const buttonStyles: React.CSSProperties = {\n      position: 'relative',\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      width: '36px',\n      height: '36px',\n      borderRadius: '50%',\n      border: 'none',\n      background: active\n        ? 'rgba(0, 0, 0, 0.08)'\n        : isHovered\n        ? 'rgba(0, 0, 0, 0.05)'\n        : 'transparent',\n      color: 'inherit',\n      cursor: 'pointer',\n      padding: 0,\n      margin: 0,\n      outline: 'none',\n      transition: 'background-color 0.15s ease, transform 0.15s ease',\n      transform: isHovered ? 'scale(1.06)' : 'scale(1)',\n      flexShrink: 0,\n      ...style,\n    };\n\n    const badgeStyles: React.CSSProperties = {\n      position: 'absolute',\n      top: '4px',\n      right: '4px',\n      minWidth: '7px',\n      height: '7px',\n      padding: typeof badge === 'number' || typeof badge === 'string' ? '1px 3px' : 0,\n      borderRadius: '9999px',\n      backgroundColor: '#ef4444',\n      color: '#ffffff',\n      fontSize: '9px',\n      fontWeight: 'bold',\n      lineHeight: '1',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      boxShadow: '0 0 0 1.5px rgba(255, 255, 255, 0.9)',\n    };\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        title={tooltip}\n        aria-label={computedAriaLabel}\n        className={`bubble-icon-button ${active ? 'bubble-icon-button--active' : ''} ${className}`.trim()}\n        style={buttonStyles}\n        onMouseEnter={(e) => {\n          setIsHovered(true);\n          onMouseEnter?.(e);\n        }}\n        onMouseLeave={(e) => {\n          setIsHovered(false);\n          onMouseLeave?.(e);\n        }}\n        {...rest}\n      >\n        {iconContent}\n        {badge ? (\n          <span className=\"bubble-icon-button__badge\" style={badgeStyles}>\n            {typeof badge !== 'boolean' ? badge : null}\n          </span>\n        ) : null}\n      </button>\n    );\n  }\n);\n\nBubbleIconButton.displayName = 'BubbleIconButton';\n\n","import React, { forwardRef } from 'react';\nimport type { BubbleAreaProps } from '../types';\nimport { formatPx } from '../utils/styles';\n\nexport const BubbleArea = forwardRef<HTMLDivElement, BubbleAreaProps>(\n  (\n    {\n      children,\n      minWidth = 120,\n      maxWidth,\n      className = '',\n      style,\n      ...rest\n    },\n    ref\n  ) => {\n    const areaStyles: React.CSSProperties = {\n      display: 'inline-flex',\n      alignItems: 'center',\n      minWidth: formatPx(minWidth),\n      maxWidth: maxWidth ? formatPx(maxWidth) : undefined,\n      flex: '1 1 auto',\n      fontSize: '14px',\n      color: 'inherit',\n      ...style,\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={`bubble-area ${className}`.trim()}\n        style={areaStyles}\n        {...rest}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n\nBubbleArea.displayName = 'BubbleArea';\n\n"],"mappings":"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","names":["import_react","import_react","import_react","React","import_jsx_runtime","import_react","import_jsx_runtime","import_react","import_jsx_runtime"]}