prompt-area 0.1.0 → 0.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "prompt-area",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "An opinionated, dependency-light React rich-text prompt input with trigger-based chips (@mentions, /commands, #tags), inline markdown, undo/redo, file & image attachments, and a complete chat-input layout. Ships as an npm package or a shadcn registry.",
   "keywords": [
     "react",
@@ -29,7 +29,8 @@
     "**/*.css"
   ],
   "files": [
-    "dist"
+    "dist",
+    "CHANGELOG.md"
   ],
   "exports": {
     ".": {
@@ -64,12 +65,31 @@
     "./tailwind.css": "./dist/tailwind.css",
     "./package.json": "./package.json"
   },
+  "scripts": {
+    "build": "pnpm run clean && pnpm run build:js && pnpm run build:css",
+    "build:js": "tsup && node ./scripts/preserve-directives.mjs",
+    "build:css": "tailwindcss --input ./src/styles.css --output ./dist/styles.css --minify && node ./scripts/build-preset.mjs",
+    "clean": "rm -rf dist",
+    "typecheck": "tsc --noEmit",
+    "lint:exports": "publint && attw --pack . --profile esm-only --exclude-entrypoints styles.css tailwind.css",
+    "prepublishOnly": "pnpm run build"
+  },
   "engines": {
     "node": ">=18"
   },
   "peerDependencies": {
     "react": ">=18",
-    "react-dom": ">=18"
+    "react-dom": ">=18",
+    "tailwindcss": ">=4",
+    "tw-animate-css": ">=1"
+  },
+  "peerDependenciesMeta": {
+    "tailwindcss": {
+      "optional": true
+    },
+    "tw-animate-css": {
+      "optional": true
+    }
   },
   "dependencies": {
     "clsx": "^2.1.1",
@@ -90,13 +110,5 @@
   },
   "publishConfig": {
     "access": "public"
-  },
-  "scripts": {
-    "build": "pnpm run clean && pnpm run build:js && pnpm run build:css",
-    "build:js": "tsup && node ./scripts/preserve-directives.mjs",
-    "build:css": "tailwindcss --input ./src/styles.css --output ./dist/styles.css --minify && node ./scripts/build-preset.mjs",
-    "clean": "rm -rf dist",
-    "typecheck": "tsc --noEmit",
-    "lint:exports": "publint && attw --pack . --profile esm-only --exclude-entrypoints styles.css tailwind.css"
   }
-}
+}

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2025 Ilko Kacharov
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/dist/action-bar/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/chat-prompt-layout/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/chunk-ANZZEZP2.js

@@ -1,38 +0,0 @@
-'use client';
-import { cn } from './chunk-NF2LHZIE.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-function StatusBar({
-  left,
-  right,
-  className,
-  disabled = false,
-  "aria-label": ariaLabel,
-  "data-test-id": dataTestId,
-  ref
-}) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref,
-      role: "group",
-      "aria-label": ariaLabel ?? "Status bar",
-      "aria-disabled": disabled || void 0,
-      "data-test-id": dataTestId,
-      className: cn(
-        "status-bar",
-        "flex items-center justify-between gap-2 px-3 py-1.5 text-xs",
-        disabled && "pointer-events-none opacity-50",
-        className
-      ),
-      children: [
-        left && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5", children: left }),
-        right && /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center gap-1.5", children: right })
-      ]
-    }
-  );
-}
-
-export { StatusBar };
-//# sourceMappingURL=chunk-ANZZEZP2.js.map
-//# sourceMappingURL=chunk-ANZZEZP2.js.map

package/dist/chunk-ANZZEZP2.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/status-bar/status-bar.tsx"],"names":[],"mappings":";;;AAuBO,SAAS,SAAA,CAAU;AAAA,EACxB,IAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,YAAA,EAAc,SAAA;AAAA,EACd,cAAA,EAAgB,UAAA;AAAA,EAChB;AACF,CAAA,EAAyD;AACvD,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,IAAA,EAAK,OAAA;AAAA,MACL,cAAY,SAAA,IAAa,YAAA;AAAA,MACzB,iBAAe,QAAA,IAAY,MAAA;AAAA,MAC3B,cAAA,EAAc,UAAA;AAAA,MACd,SAAA,EAAW,EAAA;AAAA,QACT,YAAA;AAAA,QACA,6DAAA;AAAA,QACA,QAAA,IAAY,gCAAA;AAAA,QACZ;AAAA,OACF;AAAA,MACC,QAAA,EAAA;AAAA,QAAA,IAAA,oBAAQ,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,2BAAA,EAA6B,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,QACzD,KAAA,oBAAS,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qCAAqC,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GACtE;AAEJ","file":"chunk-ANZZEZP2.js","sourcesContent":["'use client'\n\nimport { cn } from '@/lib/utils'\nimport type { StatusBarProps } from './types'\n\n/**\n * StatusBar - A horizontal bar with left and right slots.\n *\n * Designed to sit above or below a text input (e.g., PromptArea) to\n * display contextual information. Place it as a sibling before or\n * after the input inside a shared wrapper.\n *\n * @example\n * ```tsx\n * <div className=\"rounded-lg border\">\n *   <StatusBar\n *     left={<span>prompt-area</span>}\n *     right={<span>Default</span>}\n *   />\n *   <PromptArea value={segments} onChange={setSegments} ... />\n * </div>\n * ```\n */\nexport function StatusBar({\n  left,\n  right,\n  className,\n  disabled = false,\n  'aria-label': ariaLabel,\n  'data-test-id': dataTestId,\n  ref,\n}: StatusBarProps & { ref?: React.Ref<HTMLDivElement> }) {\n  return (\n    <div\n      ref={ref}\n      role=\"group\"\n      aria-label={ariaLabel ?? 'Status bar'}\n      aria-disabled={disabled || undefined}\n      data-test-id={dataTestId}\n      className={cn(\n        'status-bar',\n        'flex items-center justify-between gap-2 px-3 py-1.5 text-xs',\n        disabled && 'pointer-events-none opacity-50',\n        className,\n      )}>\n      {left && <div className=\"flex items-center gap-1.5\">{left}</div>}\n      {right && <div className=\"ml-auto flex items-center gap-1.5\">{right}</div>}\n    </div>\n  )\n}\n"]}

package/dist/chunk-BPJO4DGM.js

@@ -1,198 +0,0 @@
-'use client';
-import { BLUR_DELAY_MS, PromptArea } from './chunk-E7HUXORB.js';
-import { cn } from './chunk-NF2LHZIE.js';
-import { useRef, useState, useImperativeHandle, useCallback } from 'react';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-function Svg({ className, children }) {
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "24",
-      height: "24",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      "aria-hidden": "true",
-      className,
-      children
-    }
-  );
-}
-var Plus = ({ className }) => /* @__PURE__ */ jsxs(Svg, { className, children: [
-  /* @__PURE__ */ jsx("path", { d: "M5 12h14" }),
-  /* @__PURE__ */ jsx("path", { d: "M12 5v14" })
-] });
-var ArrowUp = ({ className }) => /* @__PURE__ */ jsxs(Svg, { className, children: [
-  /* @__PURE__ */ jsx("path", { d: "m5 12 7-7 7 7" }),
-  /* @__PURE__ */ jsx("path", { d: "M12 19V5" })
-] });
-function CompactPromptArea({
-  value,
-  onChange,
-  triggers,
-  placeholder,
-  disabled = false,
-  markdown,
-  onSubmit,
-  onEscape,
-  onChipClick,
-  onChipAdd,
-  onChipDelete,
-  onPaste,
-  images,
-  onImagePaste,
-  onImageRemove,
-  files,
-  onFileRemove,
-  plusButtonIcon,
-  onPlusClick,
-  submitButtonIcon,
-  beforeSubmitSlot,
-  maxHeight = 320,
-  className,
-  "aria-label": ariaLabel,
-  "data-test-id": dataTestId,
-  ref
-}) {
-  const promptRef = useRef(null);
-  const containerRef = useRef(null);
-  const [isFocused, setIsFocused] = useState(false);
-  useImperativeHandle(ref, () => promptRef.current, []);
-  const isEmpty = value.length === 0 || value.length === 1 && value[0].type === "text" && value[0].text === "";
-  const isExpanded = isFocused || !isEmpty;
-  const handleContainerFocus = useCallback(() => {
-    setIsFocused(true);
-  }, []);
-  const handleContainerBlur = useCallback(() => {
-    setTimeout(() => {
-      if (!containerRef.current?.contains(document.activeElement)) {
-        setIsFocused(false);
-      }
-    }, BLUR_DELAY_MS);
-  }, []);
-  const handleSubmit = useCallback(() => {
-    onSubmit?.(value);
-  }, [onSubmit, value]);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: containerRef,
-      onFocus: handleContainerFocus,
-      onBlur: handleContainerBlur,
-      "aria-label": ariaLabel,
-      "data-test-id": dataTestId,
-      className: cn(
-        "compact-prompt-area",
-        "bg-background border transition-all duration-200 ease-out",
-        isExpanded ? "rounded-2xl" : "rounded-full",
-        className
-      ),
-      children: /* @__PURE__ */ jsxs("div", { className: cn("flex", isExpanded ? "flex-col" : "items-center p-1.5"), children: [
-        !isExpanded && /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            onClick: onPlusClick,
-            disabled,
-            className: cn(
-              "flex shrink-0 items-center justify-center rounded-xl transition-colors",
-              "bg-muted text-muted-foreground size-9",
-              "hover:bg-accent hover:text-foreground",
-              "disabled:pointer-events-none disabled:opacity-50"
-            ),
-            "aria-label": "Add attachment",
-            children: plusButtonIcon ?? /* @__PURE__ */ jsx(Plus, { className: "size-4" })
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: cn("min-w-0 flex-1", isExpanded ? "px-5 pt-4 pb-2" : "overflow-hidden px-3"),
-            onClick: () => promptRef.current?.focus(),
-            children: /* @__PURE__ */ jsx(
-              PromptArea,
-              {
-                ref: promptRef,
-                value,
-                onChange,
-                triggers,
-                placeholder,
-                disabled,
-                markdown,
-                onSubmit: handleSubmit,
-                onEscape,
-                onChipClick,
-                onChipAdd,
-                onChipDelete,
-                onPaste,
-                images,
-                onImagePaste,
-                onImageRemove,
-                files,
-                onFileRemove,
-                autoGrow: true,
-                minHeight: isExpanded ? 48 : 24,
-                maxHeight
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: cn(
-              "flex shrink-0 items-center",
-              isExpanded ? "justify-between px-3 pt-1 pb-3" : "gap-1.5"
-            ),
-            children: [
-              isExpanded && /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: onPlusClick,
-                  disabled,
-                  className: cn(
-                    "flex shrink-0 items-center justify-center rounded-xl transition-colors",
-                    "bg-muted text-muted-foreground size-9",
-                    "hover:bg-accent hover:text-foreground",
-                    "disabled:pointer-events-none disabled:opacity-50"
-                  ),
-                  "aria-label": "Add attachment",
-                  children: plusButtonIcon ?? /* @__PURE__ */ jsx(Plus, { className: "size-4" })
-                }
-              ),
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
-                beforeSubmitSlot,
-                /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: handleSubmit,
-                    disabled: disabled || isEmpty,
-                    className: cn(
-                      "flex shrink-0 items-center justify-center rounded-xl transition-colors",
-                      "bg-primary text-primary-foreground size-9",
-                      "hover:bg-primary/90",
-                      "disabled:pointer-events-none disabled:opacity-50"
-                    ),
-                    "aria-label": "Send message",
-                    children: submitButtonIcon ?? /* @__PURE__ */ jsx(ArrowUp, { className: "size-4" })
-                  }
-                )
-              ] })
-            ]
-          }
-        )
-      ] })
-    }
-  );
-}
-
-export { CompactPromptArea };
-//# sourceMappingURL=chunk-BPJO4DGM.js.map
-//# sourceMappingURL=chunk-BPJO4DGM.js.map

package/dist/chunk-BPJO4DGM.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/compact-prompt-area/compact-prompt-area.tsx"],"names":[],"mappings":"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","file":"chunk-BPJO4DGM.js","sourcesContent":["'use client'\n\nimport { useCallback, useImperativeHandle, useRef, useState } from 'react'\nimport { cn } from '@/lib/utils'\nimport { PromptArea } from '@/registry/new-york/blocks/prompt-area/prompt-area'\nimport { BLUR_DELAY_MS } from '@/registry/new-york/blocks/prompt-area/use-prompt-area-events'\nimport type { PromptAreaHandle } from '@/registry/new-york/blocks/prompt-area/types'\nimport type { CompactPromptAreaProps } from './types'\n\ntype IconProps = { className?: string }\n\n/** Shared SVG wrapper matching the lucide icon defaults (no dependency). */\nfunction Svg({ className, children }: IconProps & { children: React.ReactNode }) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n      className={className}>\n      {children}\n    </svg>\n  )\n}\n\nconst Plus = ({ className }: IconProps) => (\n  <Svg className={className}>\n    <path d=\"M5 12h14\" />\n    <path d=\"M12 5v14\" />\n  </Svg>\n)\nconst ArrowUp = ({ className }: IconProps) => (\n  <Svg className={className}>\n    <path d=\"m5 12 7-7 7 7\" />\n    <path d=\"M12 19V5\" />\n  </Svg>\n)\n\n/**\n * CompactPromptArea – A pill-shaped prompt input that sits on a single row\n * and expands downward on focus.\n *\n * - Left: circular plus button\n * - Middle: PromptArea text input (expands down when focused)\n * - Right: optional slot + circular submit button\n *\n * Reuses PromptArea internally with autoGrow enabled.\n *\n * @example\n * ```tsx\n * <CompactPromptArea\n *   value={segments}\n *   onChange={setSegments}\n *   placeholder=\"Ask anything...\"\n *   onSubmit={handleSubmit}\n *   onPlusClick={() => setMenuOpen(true)}\n *   beforeSubmitSlot={<button aria-label=\"Voice\"><Mic className=\"size-4\" /></button>}\n * />\n * ```\n */\nexport function CompactPromptArea({\n  value,\n  onChange,\n  triggers,\n  placeholder,\n  disabled = false,\n  markdown,\n  onSubmit,\n  onEscape,\n  onChipClick,\n  onChipAdd,\n  onChipDelete,\n  onPaste,\n  images,\n  onImagePaste,\n  onImageRemove,\n  files,\n  onFileRemove,\n  plusButtonIcon,\n  onPlusClick,\n  submitButtonIcon,\n  beforeSubmitSlot,\n  maxHeight = 320,\n  className,\n  'aria-label': ariaLabel,\n  'data-test-id': dataTestId,\n  ref,\n}: CompactPromptAreaProps & { ref?: React.Ref<PromptAreaHandle> }) {\n  const promptRef = useRef<PromptAreaHandle>(null)\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [isFocused, setIsFocused] = useState(false)\n\n  useImperativeHandle(ref, () => promptRef.current!, [])\n\n  const isEmpty =\n    value.length === 0 || (value.length === 1 && value[0].type === 'text' && value[0].text === '')\n\n  const isExpanded = isFocused || !isEmpty\n\n  const handleContainerFocus = useCallback(() => {\n    setIsFocused(true)\n  }, [])\n\n  const handleContainerBlur = useCallback(() => {\n    setTimeout(() => {\n      if (!containerRef.current?.contains(document.activeElement)) {\n        setIsFocused(false)\n      }\n    }, BLUR_DELAY_MS)\n  }, [])\n\n  const handleSubmit = useCallback(() => {\n    onSubmit?.(value)\n  }, [onSubmit, value])\n\n  return (\n    <div\n      ref={containerRef}\n      onFocus={handleContainerFocus}\n      onBlur={handleContainerBlur}\n      aria-label={ariaLabel}\n      data-test-id={dataTestId}\n      className={cn(\n        'compact-prompt-area',\n        'bg-background border transition-all duration-200 ease-out',\n        isExpanded ? 'rounded-2xl' : 'rounded-full',\n        className,\n      )}>\n      <div className={cn('flex', isExpanded ? 'flex-col' : 'items-center p-1.5')}>\n        {/* Plus button – left side in collapsed mode */}\n        {!isExpanded && (\n          <button\n            type=\"button\"\n            onClick={onPlusClick}\n            disabled={disabled}\n            className={cn(\n              'flex shrink-0 items-center justify-center rounded-xl transition-colors',\n              'bg-muted text-muted-foreground size-9',\n              'hover:bg-accent hover:text-foreground',\n              'disabled:pointer-events-none disabled:opacity-50',\n            )}\n            aria-label=\"Add attachment\">\n            {plusButtonIcon ?? <Plus className=\"size-4\" />}\n          </button>\n        )}\n\n        {/* Prompt area region */}\n        <div\n          className={cn('min-w-0 flex-1', isExpanded ? 'px-5 pt-4 pb-2' : 'overflow-hidden px-3')}\n          onClick={() => promptRef.current?.focus()}>\n          <PromptArea\n            ref={promptRef}\n            value={value}\n            onChange={onChange}\n            triggers={triggers}\n            placeholder={placeholder}\n            disabled={disabled}\n            markdown={markdown}\n            onSubmit={handleSubmit}\n            onEscape={onEscape}\n            onChipClick={onChipClick}\n            onChipAdd={onChipAdd}\n            onChipDelete={onChipDelete}\n            onPaste={onPaste}\n            images={images}\n            onImagePaste={onImagePaste}\n            onImageRemove={onImageRemove}\n            files={files}\n            onFileRemove={onFileRemove}\n            autoGrow\n            minHeight={isExpanded ? 48 : 24}\n            maxHeight={maxHeight}\n          />\n        </div>\n\n        {/* Button bar */}\n        <div\n          className={cn(\n            'flex shrink-0 items-center',\n            isExpanded ? 'justify-between px-3 pt-1 pb-3' : 'gap-1.5',\n          )}>\n          {/* Plus button – bottom-left in expanded mode */}\n          {isExpanded && (\n            <button\n              type=\"button\"\n              onClick={onPlusClick}\n              disabled={disabled}\n              className={cn(\n                'flex shrink-0 items-center justify-center rounded-xl transition-colors',\n                'bg-muted text-muted-foreground size-9',\n                'hover:bg-accent hover:text-foreground',\n                'disabled:pointer-events-none disabled:opacity-50',\n              )}\n              aria-label=\"Add attachment\">\n              {plusButtonIcon ?? <Plus className=\"size-4\" />}\n            </button>\n          )}\n\n          {/* Right side: slot + submit */}\n          <div className=\"flex items-center gap-1.5\">\n            {beforeSubmitSlot}\n            <button\n              type=\"button\"\n              onClick={handleSubmit}\n              disabled={disabled || isEmpty}\n              className={cn(\n                'flex shrink-0 items-center justify-center rounded-xl transition-colors',\n                'bg-primary text-primary-foreground size-9',\n                'hover:bg-primary/90',\n                'disabled:pointer-events-none disabled:opacity-50',\n              )}\n              aria-label=\"Send message\">\n              {submitButtonIcon ?? <ArrowUp className=\"size-4\" />}\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n  )\n}\n"]}

package/dist/chunk-BWVBDP7C.js

@@ -1,38 +0,0 @@
-'use client';
-import { cn } from './chunk-NF2LHZIE.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-function ActionBar({
-  left,
-  right,
-  className,
-  disabled = false,
-  "aria-label": ariaLabel,
-  "data-test-id": dataTestId,
-  ref
-}) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref,
-      role: "toolbar",
-      "aria-label": ariaLabel ?? "Action bar",
-      "aria-disabled": disabled || void 0,
-      "data-test-id": dataTestId,
-      className: cn(
-        "action-bar",
-        "flex items-center justify-between gap-2 pt-2",
-        disabled && "pointer-events-none opacity-50",
-        className
-      ),
-      children: [
-        left && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: left }),
-        right && /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center gap-1", children: right })
-      ]
-    }
-  );
-}
-
-export { ActionBar };
-//# sourceMappingURL=chunk-BWVBDP7C.js.map
-//# sourceMappingURL=chunk-BWVBDP7C.js.map

package/dist/chunk-BWVBDP7C.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/action-bar/action-bar.tsx"],"names":[],"mappings":";;;AAiCO,SAAS,SAAA,CAAU;AAAA,EACxB,IAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,YAAA,EAAc,SAAA;AAAA,EACd,cAAA,EAAgB,UAAA;AAAA,EAChB;AACF,CAAA,EAAyD;AACvD,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,IAAA,EAAK,SAAA;AAAA,MACL,cAAY,SAAA,IAAa,YAAA;AAAA,MACzB,iBAAe,QAAA,IAAY,MAAA;AAAA,MAC3B,cAAA,EAAc,UAAA;AAAA,MACd,SAAA,EAAW,EAAA;AAAA,QACT,YAAA;AAAA,QACA,8CAAA;AAAA,QACA,QAAA,IAAY,gCAAA;AAAA,QACZ;AAAA,OACF;AAAA,MACC,QAAA,EAAA;AAAA,QAAA,IAAA,oBAAQ,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,yBAAA,EAA2B,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,QACvD,KAAA,oBAAS,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,mCAAmC,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,GACpE;AAEJ","file":"chunk-BWVBDP7C.js","sourcesContent":["'use client'\n\nimport { cn } from '@/lib/utils'\nimport type { ActionBarProps } from './types'\n\n/**\n * ActionBar - A horizontal toolbar with left and right slots.\n *\n * Designed to sit below a text input (e.g., PromptArea) and stay\n * anchored via normal document flow. Place it as a sibling after\n * the input inside a shared wrapper.\n *\n * @example\n * ```tsx\n * <div className=\"rounded-lg border p-4\">\n *   <PromptArea value={segments} onChange={setSegments} ... />\n *   <ActionBar\n *     left={\n *       <>\n *         <button><PlusCircle /></button>\n *         <button><AtSign /></button>\n *       </>\n *     }\n *     right={\n *       <>\n *         <button><Mic /></button>\n *         <button onClick={handleSubmit}><ArrowUp /></button>\n *       </>\n *     }\n *   />\n * </div>\n * ```\n */\nexport function ActionBar({\n  left,\n  right,\n  className,\n  disabled = false,\n  'aria-label': ariaLabel,\n  'data-test-id': dataTestId,\n  ref,\n}: ActionBarProps & { ref?: React.Ref<HTMLDivElement> }) {\n  return (\n    <div\n      ref={ref}\n      role=\"toolbar\"\n      aria-label={ariaLabel ?? 'Action bar'}\n      aria-disabled={disabled || undefined}\n      data-test-id={dataTestId}\n      className={cn(\n        'action-bar',\n        'flex items-center justify-between gap-2 pt-2',\n        disabled && 'pointer-events-none opacity-50',\n        className,\n      )}>\n      {left && <div className=\"flex items-center gap-1\">{left}</div>}\n      {right && <div className=\"ml-auto flex items-center gap-1\">{right}</div>}\n    </div>\n  )\n}\n"]}