@fragments-sdk/ui 0.9.0 → 0.9.2

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

@@ -0,0 +1,100 @@
+import * as React from 'react';
+export interface MenuProps {
+    children: React.ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    modal?: boolean;
+}
+export interface MenuTriggerProps {
+    children: React.ReactNode;
+    asChild?: boolean;
+    className?: string;
+}
+export interface MenuContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    side?: 'top' | 'bottom' | 'left' | 'right';
+    align?: 'start' | 'center' | 'end';
+    sideOffset?: number;
+}
+export interface MenuItemProps {
+    children: React.ReactNode;
+    disabled?: boolean;
+    danger?: boolean;
+    onSelect?: () => void;
+    className?: string;
+    icon?: React.ReactNode;
+    shortcut?: string;
+    /** When passed, renders a check indicator. `true` shows a checkmark, `false` reserves space. */
+    checked?: boolean;
+}
+export interface MenuCheckboxItemProps {
+    children: React.ReactNode;
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    className?: string;
+}
+export interface MenuRadioGroupProps {
+    children: React.ReactNode;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+}
+export interface MenuRadioItemProps {
+    children: React.ReactNode;
+    value: string;
+    disabled?: boolean;
+    className?: string;
+}
+export interface MenuGroupProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export interface MenuGroupLabelProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export interface MenuSeparatorProps {
+    className?: string;
+}
+export interface MenuSubmenuProps {
+    children: React.ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+export interface MenuSubmenuTriggerProps {
+    children: React.ReactNode;
+    disabled?: boolean;
+    className?: string;
+    icon?: React.ReactNode;
+}
+declare function MenuRoot({ children, open, defaultOpen, onOpenChange, modal, }: MenuProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuTrigger({ children, asChild, className }: MenuTriggerProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuContent({ children, className, side, align, sideOffset, ...htmlProps }: MenuContentProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuItem({ children, disabled, danger, onSelect, className, icon, shortcut, checked, }: MenuItemProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuCheckboxItem({ children, checked: checkedProp, defaultChecked, onCheckedChange, disabled, className, }: MenuCheckboxItemProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuRadioGroup({ children, value, defaultValue, onValueChange, }: MenuRadioGroupProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuRadioItem({ children, value, disabled, className, }: MenuRadioItemProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuGroup({ children, className }: MenuGroupProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuGroupLabel({ children, className }: MenuGroupLabelProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuSeparator({ className }: MenuSeparatorProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuSubmenu({ children, open, defaultOpen, onOpenChange, }: MenuSubmenuProps): import("react/jsx-runtime").JSX.Element;
+declare function MenuSubmenuTrigger({ children, disabled, className, icon, }: MenuSubmenuTriggerProps): import("react/jsx-runtime").JSX.Element;
+export declare const Menu: typeof MenuRoot & {
+    Trigger: typeof MenuTrigger;
+    Content: typeof MenuContent;
+    Item: typeof MenuItem;
+    CheckboxItem: typeof MenuCheckboxItem;
+    RadioGroup: typeof MenuRadioGroup;
+    RadioItem: typeof MenuRadioItem;
+    Group: typeof MenuGroup;
+    GroupLabel: typeof MenuGroupLabel;
+    Separator: typeof MenuSeparator;
+    Submenu: typeof MenuSubmenu;
+    SubmenuTrigger: typeof MenuSubmenuTrigger;
+};
+export { MenuRoot, MenuTrigger, MenuContent, MenuItem, MenuCheckboxItem, MenuRadioGroup, MenuRadioItem, MenuGroup, MenuGroupLabel, MenuSeparator, MenuSubmenu, MenuSubmenuTrigger, };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Menu/index.js

@@ -0,0 +1,242 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Menu as Menu$1 } from "@base-ui/react/menu";
+import styles from "./Menu.module.scss.js";
+function CheckmarkIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "14",
+      height: "14",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 3,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { d: "M5 13l4 4L19 7" })
+    }
+  );
+}
+function DotIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "5" })
+    }
+  );
+}
+function MenuRoot({
+  children,
+  open,
+  defaultOpen,
+  onOpenChange,
+  modal = true
+}) {
+  return /* @__PURE__ */ jsx(
+    Menu$1.Root,
+    {
+      open,
+      defaultOpen,
+      onOpenChange,
+      modal,
+      children
+    }
+  );
+}
+function MenuTrigger({ children, asChild, className }) {
+  if (asChild) {
+    return /* @__PURE__ */ jsx(Menu$1.Trigger, { className, render: children, children: null });
+  }
+  return /* @__PURE__ */ jsx(Menu$1.Trigger, { className, children });
+}
+function MenuContent({
+  children,
+  className,
+  side = "bottom",
+  align = "start",
+  sideOffset = 4,
+  ...htmlProps
+}) {
+  const popupClasses = [styles.popup, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(Menu$1.Portal, { children: /* @__PURE__ */ jsx(
+    Menu$1.Positioner,
+    {
+      side,
+      align,
+      sideOffset,
+      className: styles.positioner,
+      children: /* @__PURE__ */ jsx(Menu$1.Popup, { ...htmlProps, className: popupClasses, children })
+    }
+  ) });
+}
+function MenuItem({
+  children,
+  disabled,
+  danger,
+  onSelect,
+  className,
+  icon,
+  shortcut,
+  checked
+}) {
+  const hasChecked = checked !== void 0;
+  const classes = [
+    styles.item,
+    danger && styles.itemDanger,
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(
+    Menu$1.Item,
+    {
+      disabled,
+      onClick: onSelect,
+      className: classes,
+      children: [
+        hasChecked && /* @__PURE__ */ jsx("span", { className: styles.checkIndicator, children: checked ? /* @__PURE__ */ jsx(CheckmarkIcon, {}) : null }),
+        icon && /* @__PURE__ */ jsx("span", { className: styles.itemIcon, children: icon }),
+        /* @__PURE__ */ jsx("span", { className: styles.itemLabel, children }),
+        shortcut && /* @__PURE__ */ jsx("span", { className: styles.itemShortcut, children: shortcut })
+      ]
+    }
+  );
+}
+function MenuCheckboxItem({
+  children,
+  checked: checkedProp,
+  defaultChecked,
+  onCheckedChange,
+  disabled,
+  className
+}) {
+  const isControlled = checkedProp !== void 0;
+  const [internalChecked, setInternalChecked] = React.useState(defaultChecked ?? false);
+  const visualChecked = isControlled ? checkedProp : internalChecked;
+  const handleCheckedChange = React.useCallback(
+    (value) => {
+      if (!isControlled) setInternalChecked(value);
+      onCheckedChange == null ? void 0 : onCheckedChange(value);
+    },
+    [isControlled, onCheckedChange]
+  );
+  const classes = [styles.item, styles.checkboxItem, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(
+    Menu$1.CheckboxItem,
+    {
+      checked: checkedProp,
+      defaultChecked,
+      onCheckedChange: handleCheckedChange,
+      disabled,
+      className: classes,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: styles.checkIndicator, children: visualChecked ? /* @__PURE__ */ jsx(CheckmarkIcon, {}) : null }),
+        /* @__PURE__ */ jsx("span", { className: styles.itemLabel, children })
+      ]
+    }
+  );
+}
+function MenuRadioGroup({
+  children,
+  value,
+  defaultValue,
+  onValueChange
+}) {
+  return /* @__PURE__ */ jsx(
+    Menu$1.RadioGroup,
+    {
+      value,
+      defaultValue,
+      onValueChange,
+      children
+    }
+  );
+}
+function MenuRadioItem({
+  children,
+  value,
+  disabled,
+  className
+}) {
+  const classes = [styles.item, styles.radioItem, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(Menu$1.RadioItem, { value, disabled, className: classes, children: [
+    /* @__PURE__ */ jsx("span", { className: styles.radioIndicator, children: /* @__PURE__ */ jsx(DotIcon, {}) }),
+    /* @__PURE__ */ jsx("span", { className: styles.itemLabel, children })
+  ] });
+}
+function MenuGroup({ children, className }) {
+  const classes = [styles.group, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(Menu$1.Group, { className: classes, children });
+}
+function MenuGroupLabel({ children, className }) {
+  const classes = [styles.groupLabel, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(Menu$1.GroupLabel, { className: classes, children });
+}
+function MenuSeparator({ className }) {
+  const classes = [styles.separator, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx(Menu$1.Separator, { className: classes });
+}
+function MenuSubmenu({
+  children,
+  open,
+  defaultOpen,
+  onOpenChange
+}) {
+  return /* @__PURE__ */ jsx(
+    Menu$1.SubmenuRoot,
+    {
+      open,
+      defaultOpen,
+      onOpenChange,
+      children
+    }
+  );
+}
+function MenuSubmenuTrigger({
+  children,
+  disabled,
+  className,
+  icon
+}) {
+  const classes = [styles.item, styles.submenuTrigger, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(Menu$1.SubmenuTrigger, { disabled, className: classes, children: [
+    icon && /* @__PURE__ */ jsx("span", { className: styles.itemIcon, children: icon }),
+    /* @__PURE__ */ jsx("span", { className: styles.itemLabel, children })
+  ] });
+}
+const Menu = Object.assign(MenuRoot, {
+  Trigger: MenuTrigger,
+  Content: MenuContent,
+  Item: MenuItem,
+  CheckboxItem: MenuCheckboxItem,
+  RadioGroup: MenuRadioGroup,
+  RadioItem: MenuRadioItem,
+  Group: MenuGroup,
+  GroupLabel: MenuGroupLabel,
+  Separator: MenuSeparator,
+  Submenu: MenuSubmenu,
+  SubmenuTrigger: MenuSubmenuTrigger
+});
+export {
+  Menu,
+  MenuCheckboxItem,
+  MenuContent,
+  MenuGroup,
+  MenuGroupLabel,
+  MenuItem,
+  MenuRadioGroup,
+  MenuRadioItem,
+  MenuRoot,
+  MenuSeparator,
+  MenuSubmenu,
+  MenuSubmenuTrigger,
+  MenuTrigger
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Menu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/Menu/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Menu as BaseMenu } from '@base-ui/react/menu';\nimport styles from './Menu.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport interface MenuProps {\n  children: React.ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  modal?: boolean;\n}\n\nexport interface MenuTriggerProps {\n  children: React.ReactNode;\n  asChild?: boolean;\n  className?: string;\n}\n\nexport interface MenuContentProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n  side?: 'top' | 'bottom' | 'left' | 'right';\n  align?: 'start' | 'center' | 'end';\n  sideOffset?: number;\n}\n\nexport interface MenuItemProps {\n  children: React.ReactNode;\n  disabled?: boolean;\n  danger?: boolean;\n  onSelect?: () => void;\n  className?: string;\n  icon?: React.ReactNode;\n  shortcut?: string;\n  /** When passed, renders a check indicator. `true` shows a checkmark, `false` reserves space. */\n  checked?: boolean;\n}\n\nexport interface MenuCheckboxItemProps {\n  children: React.ReactNode;\n  checked?: boolean;\n  defaultChecked?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n  disabled?: boolean;\n  className?: string;\n}\n\nexport interface MenuRadioGroupProps {\n  children: React.ReactNode;\n  value?: string;\n  defaultValue?: string;\n  onValueChange?: (value: string) => void;\n}\n\nexport interface MenuRadioItemProps {\n  children: React.ReactNode;\n  value: string;\n  disabled?: boolean;\n  className?: string;\n}\n\nexport interface MenuGroupProps {\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport interface MenuGroupLabelProps {\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport interface MenuSeparatorProps {\n  className?: string;\n}\n\nexport interface MenuSubmenuProps {\n  children: React.ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport interface MenuSubmenuTriggerProps {\n  children: React.ReactNode;\n  disabled?: boolean;\n  className?: string;\n  icon?: React.ReactNode;\n}\n\n// ============================================\n// Icons\n// ============================================\n\nfunction CheckmarkIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth={3}\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"M5 13l4 4L19 7\" />\n    </svg>\n  );\n}\n\nfunction DotIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"currentColor\"\n      aria-hidden=\"true\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"5\" />\n    </svg>\n  );\n}\n\n// ============================================\n// Components\n// ============================================\n\nfunction MenuRoot({\n  children,\n  open,\n  defaultOpen,\n  onOpenChange,\n  modal = true,\n}: MenuProps) {\n  return (\n    <BaseMenu.Root\n      open={open}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      modal={modal}\n    >\n      {children}\n    </BaseMenu.Root>\n  );\n}\n\nfunction MenuTrigger({ children, asChild, className }: MenuTriggerProps) {\n  if (asChild) {\n    return (\n      <BaseMenu.Trigger className={className} render={children as React.ReactElement}>\n        {null}\n      </BaseMenu.Trigger>\n    );\n  }\n\n  return (\n    <BaseMenu.Trigger className={className}>\n      {children}\n    </BaseMenu.Trigger>\n  );\n}\n\nfunction MenuContent({\n  children,\n  className,\n  side = 'bottom',\n  align = 'start',\n  sideOffset = 4,\n  ...htmlProps\n}: MenuContentProps) {\n  const popupClasses = [styles.popup, className].filter(Boolean).join(' ');\n\n  return (\n    <BaseMenu.Portal>\n      <BaseMenu.Positioner\n        side={side}\n        align={align}\n        sideOffset={sideOffset}\n        className={styles.positioner}\n      >\n        <BaseMenu.Popup {...htmlProps} className={popupClasses}>\n          {children}\n        </BaseMenu.Popup>\n      </BaseMenu.Positioner>\n    </BaseMenu.Portal>\n  );\n}\n\nfunction MenuItem({\n  children,\n  disabled,\n  danger,\n  onSelect,\n  className,\n  icon,\n  shortcut,\n  checked,\n}: MenuItemProps) {\n  const hasChecked = checked !== undefined;\n  const classes = [\n    styles.item,\n    danger && styles.itemDanger,\n    className,\n  ].filter(Boolean).join(' ');\n\n  return (\n    <BaseMenu.Item\n      disabled={disabled}\n      onClick={onSelect}\n      className={classes}\n    >\n      {hasChecked && (\n        <span className={styles.checkIndicator}>\n          {checked ? <CheckmarkIcon /> : null}\n        </span>\n      )}\n      {icon && <span className={styles.itemIcon}>{icon}</span>}\n      <span className={styles.itemLabel}>{children}</span>\n      {shortcut && <span className={styles.itemShortcut}>{shortcut}</span>}\n    </BaseMenu.Item>\n  );\n}\n\nfunction MenuCheckboxItem({\n  children,\n  checked: checkedProp,\n  defaultChecked,\n  onCheckedChange,\n  disabled,\n  className,\n}: MenuCheckboxItemProps) {\n  const isControlled = checkedProp !== undefined;\n  const [internalChecked, setInternalChecked] = React.useState(defaultChecked ?? false);\n  const visualChecked = isControlled ? checkedProp : internalChecked;\n\n  const handleCheckedChange = React.useCallback(\n    (value: boolean) => {\n      if (!isControlled) setInternalChecked(value);\n      onCheckedChange?.(value);\n    },\n    [isControlled, onCheckedChange],\n  );\n\n  const classes = [styles.item, styles.checkboxItem, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <BaseMenu.CheckboxItem\n      checked={checkedProp}\n      defaultChecked={defaultChecked}\n      onCheckedChange={handleCheckedChange}\n      disabled={disabled}\n      className={classes}\n    >\n      <span className={styles.checkIndicator}>\n        {visualChecked ? <CheckmarkIcon /> : null}\n      </span>\n      <span className={styles.itemLabel}>{children}</span>\n    </BaseMenu.CheckboxItem>\n  );\n}\n\nfunction MenuRadioGroup({\n  children,\n  value,\n  defaultValue,\n  onValueChange,\n}: MenuRadioGroupProps) {\n  return (\n    <BaseMenu.RadioGroup\n      value={value}\n      defaultValue={defaultValue}\n      onValueChange={onValueChange}\n    >\n      {children}\n    </BaseMenu.RadioGroup>\n  );\n}\n\nfunction MenuRadioItem({\n  children,\n  value,\n  disabled,\n  className,\n}: MenuRadioItemProps) {\n  const classes = [styles.item, styles.radioItem, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <BaseMenu.RadioItem value={value} disabled={disabled} className={classes}>\n      <span className={styles.radioIndicator}>\n        <DotIcon />\n      </span>\n      <span className={styles.itemLabel}>{children}</span>\n    </BaseMenu.RadioItem>\n  );\n}\n\nfunction MenuGroup({ children, className }: MenuGroupProps) {\n  const classes = [styles.group, className].filter(Boolean).join(' ');\n  return <BaseMenu.Group className={classes}>{children}</BaseMenu.Group>;\n}\n\nfunction MenuGroupLabel({ children, className }: MenuGroupLabelProps) {\n  const classes = [styles.groupLabel, className].filter(Boolean).join(' ');\n  return <BaseMenu.GroupLabel className={classes}>{children}</BaseMenu.GroupLabel>;\n}\n\nfunction MenuSeparator({ className }: MenuSeparatorProps) {\n  const classes = [styles.separator, className].filter(Boolean).join(' ');\n  return <BaseMenu.Separator className={classes} />;\n}\n\nfunction MenuSubmenu({\n  children,\n  open,\n  defaultOpen,\n  onOpenChange,\n}: MenuSubmenuProps) {\n  return (\n    <BaseMenu.SubmenuRoot\n      open={open}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange as any}\n    >\n      {children}\n    </BaseMenu.SubmenuRoot>\n  );\n}\n\nfunction MenuSubmenuTrigger({\n  children,\n  disabled,\n  className,\n  icon,\n}: MenuSubmenuTriggerProps) {\n  const classes = [styles.item, styles.submenuTrigger, className]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <BaseMenu.SubmenuTrigger disabled={disabled} className={classes}>\n      {icon && <span className={styles.itemIcon}>{icon}</span>}\n      <span className={styles.itemLabel}>{children}</span>\n    </BaseMenu.SubmenuTrigger>\n  );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const Menu = Object.assign(MenuRoot, {\n  Trigger: MenuTrigger,\n  Content: MenuContent,\n  Item: MenuItem,\n  CheckboxItem: MenuCheckboxItem,\n  RadioGroup: MenuRadioGroup,\n  RadioItem: MenuRadioItem,\n  Group: MenuGroup,\n  GroupLabel: MenuGroupLabel,\n  Separator: MenuSeparator,\n  Submenu: MenuSubmenu,\n  SubmenuTrigger: MenuSubmenuTrigger,\n});\n\n// Re-export individual components\nexport {\n  MenuRoot,\n  MenuTrigger,\n  MenuContent,\n  MenuItem,\n  MenuCheckboxItem,\n  MenuRadioGroup,\n  MenuRadioItem,\n  MenuGroup,\n  MenuGroupLabel,\n  MenuSeparator,\n  MenuSubmenu,\n  MenuSubmenuTrigger,\n};\n"],"names":["BaseMenu"],"mappings":"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"}

package/dist/components/Message/Message.module.scss.cjs

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const message = "_message_hkbox_1";
+const actions = "_actions_hkbox_8";
+const user = "_user_hkbox_15";
+const body = "_body_hkbox_19";
+const content = "_content_hkbox_22";
+const assistant = "_assistant_hkbox_27";
+const system = "_system_hkbox_32";
+const avatar = "_avatar_hkbox_42";
+const error = "_error_hkbox_46";
+const sending = "_sending_hkbox_52";
+const avatarUser = "_avatarUser_hkbox_72";
+const avatarAssistant = "_avatarAssistant_hkbox_77";
+const avatarSystem = "_avatarSystem_hkbox_82";
+const streaming = "_streaming_hkbox_137";
+const blink = "_blink_hkbox_1";
+const timestamp = "_timestamp_hkbox_163";
+const styles = {
+  message,
+  actions,
+  user,
+  body,
+  content,
+  assistant,
+  system,
+  avatar,
+  error,
+  sending,
+  avatarUser,
+  avatarAssistant,
+  avatarSystem,
+  streaming,
+  blink,
+  timestamp
+};
+exports.actions = actions;
+exports.assistant = assistant;
+exports.avatar = avatar;
+exports.avatarAssistant = avatarAssistant;
+exports.avatarSystem = avatarSystem;
+exports.avatarUser = avatarUser;
+exports.blink = blink;
+exports.body = body;
+exports.content = content;
+exports.default = styles;
+exports.error = error;
+exports.message = message;
+exports.sending = sending;
+exports.streaming = streaming;
+exports.system = system;
+exports.timestamp = timestamp;
+exports.user = user;
+//# sourceMappingURL=Message.module.scss.cjs.map

package/dist/components/Message/Message.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Message/Message.module.scss.js

@@ -0,0 +1,54 @@
+const message = "_message_hkbox_1";
+const actions = "_actions_hkbox_8";
+const user = "_user_hkbox_15";
+const body = "_body_hkbox_19";
+const content = "_content_hkbox_22";
+const assistant = "_assistant_hkbox_27";
+const system = "_system_hkbox_32";
+const avatar = "_avatar_hkbox_42";
+const error = "_error_hkbox_46";
+const sending = "_sending_hkbox_52";
+const avatarUser = "_avatarUser_hkbox_72";
+const avatarAssistant = "_avatarAssistant_hkbox_77";
+const avatarSystem = "_avatarSystem_hkbox_82";
+const streaming = "_streaming_hkbox_137";
+const blink = "_blink_hkbox_1";
+const timestamp = "_timestamp_hkbox_163";
+const styles = {
+  message,
+  actions,
+  user,
+  body,
+  content,
+  assistant,
+  system,
+  avatar,
+  error,
+  sending,
+  avatarUser,
+  avatarAssistant,
+  avatarSystem,
+  streaming,
+  blink,
+  timestamp
+};
+export {
+  actions,
+  assistant,
+  avatar,
+  avatarAssistant,
+  avatarSystem,
+  avatarUser,
+  blink,
+  body,
+  content,
+  styles as default,
+  error,
+  message,
+  sending,
+  streaming,
+  system,
+  timestamp,
+  user
+};
+//# sourceMappingURL=Message.module.scss.js.map

package/dist/components/Message/Message.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Message/index.cjs

@@ -0,0 +1,178 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const Message_module = require("./Message.module.scss.cjs");
+const markdown = require("../../markdown.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const MessageContext = React__namespace.createContext(null);
+function useMessageContext() {
+  const context = React__namespace.useContext(MessageContext);
+  if (!context) {
+    throw new Error("Message compound components must be used within a Message");
+  }
+  return context;
+}
+function formatTimestamp(date) {
+  const now = /* @__PURE__ */ new Date();
+  const diff = now.getTime() - date.getTime();
+  const minutes = Math.floor(diff / 6e4);
+  const hours = Math.floor(diff / 36e5);
+  if (minutes < 1) return "Just now";
+  if (minutes < 60) return `${minutes}m ago`;
+  if (hours < 24) return `${hours}h ago`;
+  return date.toLocaleDateString(void 0, {
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "2-digit"
+  });
+}
+function UserIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z" })
+    }
+  );
+}
+function AssistantIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" })
+    }
+  );
+}
+function SystemIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z" })
+    }
+  );
+}
+function MessageContent({ children, markdown: markdown$1, className, ...htmlProps }) {
+  const { status } = useMessageContext();
+  const classes = [
+    Message_module.default.content,
+    status === "streaming" && Message_module.default.streaming,
+    className
+  ].filter(Boolean).join(" ");
+  const content = markdown$1 && typeof children === "string" ? /* @__PURE__ */ jsxRuntime.jsx(markdown.Markdown, { content: children }) : children;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlProps, className: classes, children: content });
+}
+function MessageActions({ children, className, ...htmlProps }) {
+  const classes = [Message_module.default.actions, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlProps, className: classes, children });
+}
+function MessageTimestamp({
+  date,
+  format: customFormat,
+  className,
+  ...htmlProps
+}) {
+  const { timestamp } = useMessageContext();
+  const dateToFormat = date ?? timestamp;
+  if (!dateToFormat) return null;
+  const formatted = customFormat ? customFormat(dateToFormat) : formatTimestamp(dateToFormat);
+  const classes = [Message_module.default.timestamp, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { ...htmlProps, className: classes, children: formatted });
+}
+function MessageAvatar({ children, className, ...htmlProps }) {
+  const { role } = useMessageContext();
+  const classes = [
+    Message_module.default.avatar,
+    Message_module.default[`avatar${role.charAt(0).toUpperCase() + role.slice(1)}`],
+    className
+  ].filter(Boolean).join(" ");
+  const defaultIcon = role === "user" ? /* @__PURE__ */ jsxRuntime.jsx(UserIcon, {}) : role === "assistant" ? /* @__PURE__ */ jsxRuntime.jsx(AssistantIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(SystemIcon, {});
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlProps, className: classes, children: children ?? defaultIcon });
+}
+function MessageRoot({
+  role,
+  children,
+  status = "complete",
+  timestamp,
+  avatar,
+  actions,
+  className,
+  ...htmlProps
+}) {
+  const contextValue = {
+    role,
+    status,
+    timestamp
+  };
+  const classes = [
+    Message_module.default.message,
+    Message_module.default[role],
+    status === "error" && Message_module.default.error,
+    status === "sending" && Message_module.default.sending,
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx(MessageContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ...htmlProps,
+      className: classes,
+      "data-role": role,
+      "data-status": status,
+      children: [
+        avatar !== void 0 ? avatar : /* @__PURE__ */ jsxRuntime.jsx(MessageAvatar, {}),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Message_module.default.body, children: [
+          children,
+          actions && /* @__PURE__ */ jsxRuntime.jsx(MessageActions, { children: actions })
+        ] })
+      ]
+    }
+  ) });
+}
+const Message = Object.assign(MessageRoot, {
+  Content: MessageContent,
+  Actions: MessageActions,
+  Timestamp: MessageTimestamp,
+  Avatar: MessageAvatar
+});
+exports.Message = Message;
+exports.MessageActions = MessageActions;
+exports.MessageAvatar = MessageAvatar;
+exports.MessageContent = MessageContent;
+exports.MessageRoot = MessageRoot;
+exports.MessageTimestamp = MessageTimestamp;
+exports.useMessageContext = useMessageContext;
+//# sourceMappingURL=index.cjs.map