@duskmoon-dev/components 0.1.2

package/dist/components/mentions/index.js

@@ -0,0 +1,321 @@
+"use client";
+
+// src/components/mentions/Mentions.tsx
+import React, {
+  forwardRef,
+  useId,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+
+// ../../node_modules/.bun/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if (typeof e == "string" || typeof e == "number")
+    n += e;
+  else if (typeof e == "object")
+    if (Array.isArray(e)) {
+      var o = e.length;
+      for (t = 0;t < o; t++)
+        e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+    } else
+      for (f in e)
+        e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length;f < o; f++)
+    (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return clsx(inputs);
+}
+// src/classes/mentions.ts
+var mentionsBaseClass = "mentions";
+var mentionsTextareaClass = "mentions-textarea";
+var mentionsDropdownClass = "mentions-dropdown";
+var mentionsOptionsClass = "mentions-options";
+var mentionsOptionClass = "mentions-option";
+var mentionsOptionSelectedClass = "mentions-option-selected";
+var mentionsOptionFocusedClass = "mentions-option-focused";
+var mentionsOptionDisabledClass = "mentions-option-disabled";
+var mentionsNoOptionsClass = "mentions-no-options";
+var mentionsPlacementClasses = {
+  bottom: "mentions-placement-bottom",
+  top: "mentions-placement-top"
+};
+function getMentionsClasses({
+  disabled,
+  open,
+  placement = "bottom",
+  className
+}) {
+  return cn(mentionsBaseClass, disabled && "mentions-disabled", open && "mentions-open", mentionsPlacementClasses[placement], className);
+}
+function getMentionsDropdownClasses({
+  placement = "bottom",
+  className
+}) {
+  return cn(mentionsDropdownClass, mentionsPlacementClasses[placement], className);
+}
+function getMentionsOptionClasses({
+  selected,
+  focused,
+  disabled,
+  className
+}) {
+  return cn(mentionsOptionClass, selected && mentionsOptionSelectedClass, focused && mentionsOptionFocusedClass, disabled && mentionsOptionDisabledClass, className);
+}
+
+// src/components/mentions/Mentions.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function optionLabel(option) {
+  return option.label ?? option.value;
+}
+function optionText(option) {
+  const label = optionLabel(option);
+  return typeof label === "string" || typeof label === "number" ? String(label) : option.value;
+}
+function optionsFromChildren(children) {
+  const result = [];
+  React.Children.forEach(children, (child) => {
+    if (!React.isValidElement(child) || child.type !== Option) {
+      return;
+    }
+    const props = child.props;
+    result.push({
+      value: props.value,
+      label: props.children,
+      disabled: props.disabled,
+      className: props.className
+    });
+  });
+  return result;
+}
+function normalizePrefixes(prefix = "@") {
+  return Array.isArray(prefix) ? prefix : [prefix];
+}
+function findMentionSearch(value, cursor, prefixes, split) {
+  const beforeCursor = value.slice(0, cursor);
+  const matches = prefixes.map((prefix) => ({ prefix, index: beforeCursor.lastIndexOf(prefix) })).filter(({ index }) => index >= 0).sort((left, right) => right.index - left.index);
+  for (const match of matches) {
+    const textStart = match.index + match.prefix.length;
+    const text = beforeCursor.slice(textStart);
+    if (text.includes(split) || /\s/.test(text)) {
+      continue;
+    }
+    return {
+      prefix: match.prefix,
+      text,
+      start: match.index,
+      end: cursor
+    };
+  }
+  return null;
+}
+function filterOptions(options, searchText, filterOption) {
+  if (filterOption === false) {
+    return options;
+  }
+  if (typeof filterOption === "function") {
+    return options.filter((option) => filterOption(searchText, option));
+  }
+  const query = searchText.trim().toLowerCase();
+  if (query.length === 0) {
+    return options;
+  }
+  return options.filter((option) => optionText(option).toLowerCase().includes(query));
+}
+var Option = forwardRef(({ children, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+  ...props,
+  ref,
+  children
+}));
+Option.displayName = "Mentions.Option";
+var MentionsRoot = forwardRef(({
+  children,
+  className,
+  defaultValue = "",
+  disabled,
+  filterOption,
+  notFoundContent = "No data",
+  onChange,
+  onSearch,
+  onSelect,
+  options,
+  placement = "bottom",
+  prefix = "@",
+  split = " ",
+  value,
+  ...props
+}, ref) => {
+  const listboxId = useId();
+  const textareaRef = useRef(null);
+  const sourceOptions = useMemo(() => options ?? optionsFromChildren(children), [children, options]);
+  const prefixes = useMemo(() => normalizePrefixes(prefix), [prefix]);
+  const [internalValue, setInternalValue] = useState(defaultValue);
+  const [search, setSearch] = useState(null);
+  const [focusedIndex, setFocusedIndex] = useState(0);
+  const controlled = value !== undefined;
+  const currentValue = controlled ? value : internalValue;
+  const visibleOptions = useMemo(() => filterOptions(sourceOptions, search?.text ?? "", filterOption), [filterOption, search?.text, sourceOptions]);
+  const isOpen = Boolean(search) && !disabled;
+  const activeOption = isOpen && visibleOptions.length > 0 ? visibleOptions[Math.min(focusedIndex, visibleOptions.length - 1)] : undefined;
+  const activeIndex = activeOption ? visibleOptions.indexOf(activeOption) : -1;
+  const activeDescendant = activeIndex >= 0 ? `${listboxId}-option-${activeIndex}` : undefined;
+  function setTextareaRef(node) {
+    textareaRef.current = node;
+    if (typeof ref === "function") {
+      ref(node);
+    } else if (ref) {
+      ref.current = node;
+    }
+  }
+  function updateSearch(nextValue, cursor) {
+    const nextSearch = findMentionSearch(nextValue, cursor, prefixes, split);
+    setSearch(nextSearch);
+    setFocusedIndex(0);
+    if (nextSearch) {
+      onSearch?.(nextSearch.text, nextSearch.prefix);
+    }
+  }
+  function emitChange(nextValue) {
+    if (!controlled) {
+      setInternalValue(nextValue);
+    }
+    onChange?.(nextValue);
+  }
+  function handleChange(event) {
+    const nextValue = event.currentTarget.value;
+    const cursor = event.currentTarget.selectionStart ?? nextValue.length;
+    emitChange(nextValue);
+    updateSearch(nextValue, cursor);
+  }
+  function selectOption(option) {
+    if (!search || disabled || option.disabled) {
+      return;
+    }
+    const nextValue = currentValue.slice(0, search.start) + `${search.prefix}${option.value}${split}` + currentValue.slice(search.end);
+    const nextCursor = search.start + search.prefix.length + option.value.length + split.length;
+    emitChange(nextValue);
+    onSelect?.(option, search.prefix);
+    setSearch(null);
+    setFocusedIndex(0);
+    window.setTimeout(() => {
+      textareaRef.current?.focus();
+      textareaRef.current?.setSelectionRange(nextCursor, nextCursor);
+    }, 0);
+  }
+  function moveFocus(step) {
+    if (!isOpen || visibleOptions.length === 0) {
+      return;
+    }
+    setFocusedIndex((current) => {
+      const next = current + step;
+      if (next < 0) {
+        return visibleOptions.length - 1;
+      }
+      if (next >= visibleOptions.length) {
+        return 0;
+      }
+      return next;
+    });
+  }
+  function handleKeyDown(event) {
+    if (disabled || !isOpen) {
+      return;
+    }
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      moveFocus(1);
+      return;
+    }
+    if (event.key === "ArrowUp") {
+      event.preventDefault();
+      moveFocus(-1);
+      return;
+    }
+    if (event.key === "Enter" && activeOption) {
+      event.preventDefault();
+      selectOption(activeOption);
+      return;
+    }
+    if (event.key === "Escape") {
+      setSearch(null);
+    }
+  }
+  function handleClick(event) {
+    const cursor = event.currentTarget.selectionStart ?? currentValue.length;
+    updateSearch(currentValue, cursor);
+    props.onClick?.(event);
+  }
+  function renderOption(option, index) {
+    const focused = index === activeIndex;
+    return /* @__PURE__ */ jsx("button", {
+      type: "button",
+      id: `${listboxId}-option-${index}`,
+      role: "option",
+      "aria-selected": focused,
+      "aria-disabled": option.disabled || undefined,
+      disabled: option.disabled,
+      className: getMentionsOptionClasses({
+        focused,
+        selected: focused,
+        disabled: option.disabled,
+        className: option.className
+      }),
+      onMouseDown: (event) => event.preventDefault(),
+      onMouseEnter: () => setFocusedIndex(index),
+      onClick: () => selectOption(option),
+      children: optionLabel(option)
+    }, option.value);
+  }
+  return /* @__PURE__ */ jsxs("div", {
+    className: getMentionsClasses({
+      disabled,
+      open: isOpen,
+      placement,
+      className
+    }),
+    children: [
+      /* @__PURE__ */ jsx("textarea", {
+        ...props,
+        ref: setTextareaRef,
+        role: "combobox",
+        "aria-autocomplete": "list",
+        "aria-controls": isOpen ? listboxId : undefined,
+        "aria-expanded": isOpen,
+        "aria-activedescendant": activeDescendant,
+        "aria-disabled": disabled || undefined,
+        className: mentionsTextareaClass,
+        disabled,
+        value: currentValue,
+        onChange: handleChange,
+        onClick: handleClick,
+        onKeyDown: handleKeyDown
+      }),
+      isOpen ? /* @__PURE__ */ jsx("div", {
+        id: listboxId,
+        role: "listbox",
+        className: getMentionsDropdownClasses({ placement }),
+        children: visibleOptions.length > 0 ? /* @__PURE__ */ jsx("div", {
+          className: mentionsOptionsClass,
+          children: visibleOptions.map(renderOption)
+        }) : notFoundContent != null ? /* @__PURE__ */ jsx("div", {
+          className: mentionsNoOptionsClass,
+          children: notFoundContent
+        }) : null
+      }) : null
+    ]
+  });
+});
+MentionsRoot.displayName = "Mentions";
+var Mentions = MentionsRoot;
+Mentions.Option = Option;
+export {
+  Mentions
+};

package/dist/components/menu/Menu.d.ts

@@ -0,0 +1,2 @@
+import type { MenuComponent } from "./Menu.types";
+export declare const Menu: MenuComponent;

package/dist/components/menu/Menu.types.d.ts

@@ -0,0 +1,58 @@
+import type { ComponentProps, ForwardRefExoticComponent, KeyboardEvent, MouseEvent, ReactNode, RefAttributes } from "react";
+export type MenuKey = string | number;
+export type MenuMode = "vertical" | "horizontal" | "inline";
+export type MenuTheme = "light" | "dark";
+export type MenuSize = "sm" | "md" | "lg";
+export interface MenuItemType {
+    key?: MenuKey;
+    label?: ReactNode;
+    title?: ReactNode;
+    icon?: ReactNode;
+    extra?: ReactNode;
+    children?: MenuItemType[];
+    disabled?: boolean;
+    danger?: boolean;
+    type?: "item" | "group" | "divider";
+    className?: string;
+}
+export interface MenuClickInfo {
+    key: string;
+    keyPath: string[];
+    item: MenuItemType;
+    selectedKeys: string[];
+    domEvent: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>;
+}
+export interface MenuProps extends Omit<ComponentProps<"ul">, "onClick" | "onSelect"> {
+    items?: MenuItemType[];
+    selectedKeys?: MenuKey[];
+    defaultSelectedKeys?: MenuKey[];
+    openKeys?: MenuKey[];
+    defaultOpenKeys?: MenuKey[];
+    mode?: MenuMode;
+    theme?: MenuTheme;
+    size?: MenuSize;
+    selectable?: boolean;
+    multiple?: boolean;
+    inlineCollapsed?: boolean;
+    disabled?: boolean;
+    onClick?: (info: MenuClickInfo) => void;
+    onSelect?: (info: MenuClickInfo) => void;
+    onDeselect?: (info: MenuClickInfo) => void;
+    onOpenChange?: (openKeys: string[]) => void;
+}
+export interface MenuItemProps extends ComponentProps<"li"> {
+    disabled?: boolean;
+    danger?: boolean;
+    active?: boolean;
+    icon?: ReactNode;
+    extra?: ReactNode;
+}
+export type MenuDividerProps = ComponentProps<"li">;
+export interface MenuItemGroupProps extends Omit<ComponentProps<"li">, "title"> {
+    title?: ReactNode;
+}
+export interface MenuComponent extends ForwardRefExoticComponent<MenuProps & RefAttributes<HTMLUListElement>> {
+    Item: ForwardRefExoticComponent<MenuItemProps & RefAttributes<HTMLLIElement>>;
+    Divider: ForwardRefExoticComponent<MenuDividerProps & RefAttributes<HTMLLIElement>>;
+    ItemGroup: ForwardRefExoticComponent<MenuItemGroupProps & RefAttributes<HTMLLIElement>>;
+}

package/dist/components/menu/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Menu";
+export * from "./Menu.types";

package/dist/components/menu/index.js

@@ -0,0 +1,317 @@
+"use client";
+
+// src/components/menu/Menu.tsx
+import { forwardRef, useState } from "react";
+
+// ../../node_modules/.bun/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if (typeof e == "string" || typeof e == "number")
+    n += e;
+  else if (typeof e == "object")
+    if (Array.isArray(e)) {
+      var o = e.length;
+      for (t = 0;t < o; t++)
+        e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+    } else
+      for (f in e)
+        e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length;f < o; f++)
+    (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return clsx(inputs);
+}
+// src/classes/menu.ts
+var menuBaseClass = "menu";
+var menuShowClass = "menu-show";
+var menuItemClass = "menu-item";
+var menuItemActiveClass = "menu-item-active";
+var menuItemDisabledClass = "menu-item-disabled";
+var menuItemIconClass = "menu-item-icon";
+var menuItemTrailingClass = "menu-item-trailing";
+var menuItemSubmenuClass = "menu-item-submenu";
+var menuDividerClass = "menu-divider";
+var menuLabelClass = "menu-label";
+var menuSubmenuClass = "menu-submenu";
+var menuCompactClass = "menu-compact";
+var menuWideClass = "menu-wide";
+var menuModeClasses = {
+  vertical: "menu-vertical",
+  horizontal: "menu-horizontal",
+  inline: "menu-inline"
+};
+var menuThemeClasses = {
+  light: "",
+  dark: "menu-dark menu-surface-container-highest"
+};
+var menuSizeClasses = {
+  sm: menuCompactClass,
+  md: "",
+  lg: menuWideClass
+};
+function getMenuClasses({
+  mode = "vertical",
+  theme = "light",
+  size = "md",
+  inlineCollapsed,
+  disabled,
+  className
+}) {
+  return cn(menuBaseClass, menuShowClass, menuModeClasses[mode], menuThemeClasses[theme], menuSizeClasses[size], inlineCollapsed && "menu-inline-collapsed", disabled && menuItemDisabledClass, className);
+}
+function getMenuItemClasses({
+  active,
+  disabled,
+  danger,
+  submenu,
+  className
+}) {
+  return cn(menuItemClass, active && menuItemActiveClass, disabled && menuItemDisabledClass, danger && "menu-item-danger", submenu && menuItemSubmenuClass, className);
+}
+
+// src/components/menu/Menu.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function normalizeKeys(keys) {
+  return keys?.map(String) ?? [];
+}
+function hasNode(node) {
+  return node !== undefined && node !== null && node !== false;
+}
+function keyForItem(item, indexPath) {
+  return String(item.key ?? indexPath.join("-"));
+}
+function isActivationKey(key) {
+  return key === "Enter" || key === " ";
+}
+var MenuItem = forwardRef(({
+  children,
+  icon,
+  extra,
+  active,
+  disabled,
+  danger,
+  className,
+  role,
+  ...props
+}, ref) => /* @__PURE__ */ jsxs("li", {
+  ...props,
+  ref,
+  role: role ?? "menuitem",
+  "aria-disabled": disabled || undefined,
+  className: getMenuItemClasses({
+    active,
+    disabled,
+    danger,
+    className
+  }),
+  children: [
+    icon ? /* @__PURE__ */ jsx("span", {
+      className: menuItemIconClass,
+      children: icon
+    }) : null,
+    /* @__PURE__ */ jsx("span", {
+      children
+    }),
+    extra ? /* @__PURE__ */ jsx("span", {
+      className: menuItemTrailingClass,
+      children: extra
+    }) : null
+  ]
+}));
+MenuItem.displayName = "Menu.Item";
+var MenuDivider = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("li", {
+  ...props,
+  ref,
+  role: "separator",
+  className: cn(menuDividerClass, className)
+}));
+MenuDivider.displayName = "Menu.Divider";
+var MenuItemGroup = forwardRef(({ title, children, className, ...props }, ref) => /* @__PURE__ */ jsxs("li", {
+  ...props,
+  ref,
+  className: cn("menu-group", className),
+  children: [
+    hasNode(title) ? /* @__PURE__ */ jsx("div", {
+      className: menuLabelClass,
+      children: title
+    }) : null,
+    /* @__PURE__ */ jsx("ul", {
+      className: cn(menuSubmenuClass, "menu-show"),
+      children
+    })
+  ]
+}));
+MenuItemGroup.displayName = "Menu.ItemGroup";
+var MenuRoot = forwardRef(({
+  items,
+  children,
+  selectedKeys,
+  defaultSelectedKeys,
+  openKeys,
+  defaultOpenKeys,
+  mode = "vertical",
+  theme = "light",
+  size = "md",
+  selectable = true,
+  multiple,
+  inlineCollapsed,
+  disabled,
+  onClick,
+  onSelect,
+  onDeselect,
+  onOpenChange,
+  className,
+  ...props
+}, ref) => {
+  const selectedControlled = selectedKeys !== undefined;
+  const openControlled = openKeys !== undefined;
+  const [internalSelectedKeys, setInternalSelectedKeys] = useState(() => normalizeKeys(defaultSelectedKeys));
+  const [internalOpenKeys, setInternalOpenKeys] = useState(() => normalizeKeys(defaultOpenKeys));
+  const currentSelectedKeys = selectedControlled ? normalizeKeys(selectedKeys) : internalSelectedKeys;
+  const currentOpenKeys = openControlled ? normalizeKeys(openKeys) : internalOpenKeys;
+  function setNextSelectedKeys(nextSelectedKeys) {
+    if (!selectedControlled) {
+      setInternalSelectedKeys(nextSelectedKeys);
+    }
+  }
+  function setNextOpenKeys(nextOpenKeys) {
+    if (!openControlled) {
+      setInternalOpenKeys(nextOpenKeys);
+    }
+    onOpenChange?.(nextOpenKeys);
+  }
+  function buildInfo(item, key, keyPath, domEvent, nextSelectedKeys = currentSelectedKeys) {
+    return {
+      key,
+      keyPath,
+      item,
+      selectedKeys: nextSelectedKeys,
+      domEvent
+    };
+  }
+  function activateItem(item, key, keyPath, event) {
+    if (disabled || item.disabled) {
+      event.preventDefault();
+      return;
+    }
+    let nextSelectedKeys = currentSelectedKeys;
+    const selected = currentSelectedKeys.includes(key);
+    if (selectable) {
+      if (selected && multiple) {
+        nextSelectedKeys = currentSelectedKeys.filter((selectedKey) => selectedKey !== key);
+        setNextSelectedKeys(nextSelectedKeys);
+        onDeselect?.(buildInfo(item, key, keyPath, event, nextSelectedKeys));
+      } else if (!selected) {
+        nextSelectedKeys = multiple ? [...currentSelectedKeys, key] : [key];
+        setNextSelectedKeys(nextSelectedKeys);
+        onSelect?.(buildInfo(item, key, keyPath, event, nextSelectedKeys));
+      }
+    }
+    onClick?.(buildInfo(item, key, keyPath, event, nextSelectedKeys));
+  }
+  function toggleSubmenu(key) {
+    const open = currentOpenKeys.includes(key);
+    setNextOpenKeys(open ? currentOpenKeys.filter((openKey) => openKey !== key) : [...currentOpenKeys, key]);
+  }
+  function renderItem(item, indexPath, parentKeyPath = []) {
+    if (item.type === "divider") {
+      return /* @__PURE__ */ jsx(MenuDivider, {}, `divider-${indexPath.join("-")}`);
+    }
+    const key = keyForItem(item, indexPath);
+    const keyPath = [key, ...parentKeyPath];
+    if (item.type === "group") {
+      return /* @__PURE__ */ jsx(MenuItemGroup, {
+        title: item.label ?? item.title,
+        children: item.children?.map((child, childIndex) => renderItem(child, [...indexPath, childIndex], keyPath))
+      }, key);
+    }
+    const hasChildren = Boolean(item.children?.length);
+    const selected = currentSelectedKeys.includes(key);
+    const open = currentOpenKeys.includes(key);
+    const itemDisabled = disabled || item.disabled;
+    if (hasChildren) {
+      return /* @__PURE__ */ jsxs("li", {
+        className: cn("menu-submenu-wrapper", item.className),
+        children: [
+          /* @__PURE__ */ jsxs("button", {
+            type: "button",
+            className: getMenuItemClasses({
+              active: selected,
+              disabled: itemDisabled,
+              danger: item.danger,
+              submenu: true
+            }),
+            disabled: itemDisabled,
+            "aria-expanded": open,
+            onClick: () => toggleSubmenu(key),
+            children: [
+              item.icon ? /* @__PURE__ */ jsx("span", {
+                className: menuItemIconClass,
+                children: item.icon
+              }) : null,
+              /* @__PURE__ */ jsx("span", {
+                children: item.label ?? item.title
+              }),
+              item.extra ? /* @__PURE__ */ jsx("span", {
+                className: menuItemTrailingClass,
+                children: item.extra
+              }) : null
+            ]
+          }),
+          open ? /* @__PURE__ */ jsx("ul", {
+            className: cn(menuSubmenuClass, "menu-show"),
+            children: item.children?.map((child, childIndex) => renderItem(child, [...indexPath, childIndex], keyPath))
+          }) : null
+        ]
+      }, key);
+    }
+    return /* @__PURE__ */ jsx(MenuItem, {
+      role: "menuitem",
+      tabIndex: itemDisabled ? undefined : 0,
+      active: selected,
+      disabled: itemDisabled,
+      danger: item.danger,
+      icon: item.icon,
+      extra: item.extra,
+      className: item.className,
+      onClick: (event) => activateItem(item, key, keyPath, event),
+      onKeyDown: (event) => {
+        if (!isActivationKey(event.key)) {
+          return;
+        }
+        event.preventDefault();
+        activateItem(item, key, keyPath, event);
+      },
+      children: item.label
+    }, key);
+  }
+  return /* @__PURE__ */ jsx("ul", {
+    ...props,
+    ref,
+    role: props.role ?? "menu",
+    className: getMenuClasses({
+      mode,
+      theme,
+      size,
+      inlineCollapsed,
+      disabled,
+      className
+    }),
+    children: items ? items.map((item, index) => renderItem(item, [index])) : children
+  });
+});
+MenuRoot.displayName = "Menu";
+MenuRoot.Item = MenuItem;
+MenuRoot.Divider = MenuDivider;
+MenuRoot.ItemGroup = MenuItemGroup;
+var Menu = MenuRoot;
+export {
+  Menu
+};

package/dist/components/message/Message.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import type { MessageApi } from "./Message.types";
+export declare function MessageHolder({ className }: {
+    className?: string;
+}): React.JSX.Element;
+export declare const message: MessageApi;