@luzmo/lucero 1.0.1-alpha.4 → 1.0.1-alpha.42

package/components/index.js

@@ -15,182 +15,987 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-import { LuzmoAccordion as s, LuzmoAccordionItem as c } from "./accordion/index.js";
-import { LuzmoActionBar as f } from "./action-bar/index.js";
-import { LuzmoActionButton as x } from "./action-button/index.js";
+import { LuzmoAccordion as Y, LuzmoAccordionItem as oo } from "./accordion/index.js";
+import { LuzmoActionBar as eo } from "./action-bar/index.js";
+import { LuzmoActionButton as io } from "./action-button/index.js";
 import "./action-group/index.js";
-import { LuzmoActionMenu as g } from "./action-menu/index.js";
-import { LuzmoAvatar as h } from "./avatar/index.js";
-import { LuzmoButton as S } from "./button/index.js";
-import { LuzmoButtonGroup as C } from "./button-group/index.js";
-import { L as T } from "./index-A-yOTB_d.js";
-import { LuzmoCheckbox as w } from "./checkbox/index.js";
-import { LuzmoColorArea as O } from "./color-area/index.js";
-import { LuzmoColorField as P } from "./color-field/index.js";
-import { LuzmoColorHandle as R } from "./color-handle/index.js";
+import { LuzmoActionMenu as so } from "./action-menu/index.js";
+import { LuzmoAvatar as lo } from "./avatar/index.js";
+import { LuzmoButton as po, LuzmoClearButton as co } from "./button/index.js";
+import { LuzmoButtonGroup as ho } from "./button-group/index.js";
+import { LuzmoCalendar as go } from "./calendar/index.js";
+import { LuzmoChatMessage as vo } from "./chat-message/index.js";
+import { LuzmoChatMessageGroup as xo } from "./chat-message-group/index.js";
+import { LuzmoCheckbox as _o } from "./checkbox/index.js";
+import { LuzmoColorArea as Lo } from "./color-area/index.js";
+import { LuzmoColorField as Ao } from "./color-field/index.js";
+import { LuzmoColorHandle as So } from "./color-handle/index.js";
 import "./color-loupe/index.js";
-import { LuzmoColorMenu as B } from "./color-menu/index.js";
-import { LuzmoColorPalette as G } from "./color-palette/index.js";
-import { LuzmoColorPicker as _ } from "./color-picker/index.js";
-import { L as H } from "./index-HjQa8tew.js";
-import { LuzmoDateTimePicker as V } from "./date-time-picker/index.js";
-import { LuzmoDivider as K } from "./divider/index.js";
+import { LuzmoColorMenu as $o } from "./color-menu/index.js";
+import { LuzmoColorPalette as Bo } from "./color-palette/index.js";
+import { LuzmoColorPaletteGroup as Io } from "./color-palette-group/index.js";
+import { LuzmoColorPicker as Do } from "./color-picker/index.js";
+import { LuzmoColorSlider as Mo } from "./color-slider/index.js";
+import { LuzmoDateTimePicker as Oo } from "./date-time-picker/index.js";
+import { LuzmoDivider as Vo } from "./divider/index.js";
 import "./field-group/index.js";
 import "./field-label/index.js";
-import { LuzmoIcon as Z } from "./icon/index.js";
-import { LuzmoInfieldButton as Q } from "./infield-button/index.js";
-import { LuzmoLabel as Y } from "./label/index.js";
-import { LuzmoMenu as oo, LuzmoMenuDivider as ro, LuzmoMenuGroup as eo, LuzmoMenuItem as lo, MenuItemAddedOrUpdatedEvent as mo } from "./menu/index.js";
-import { LuzmoMultiLangField as to } from "./multi-language-field/index.js";
-import { LuzmoNumberField as io } from "./number-field/index.js";
-import { LuzmoOption as no, LuzmoOptions as so, LuzmoOptionsDivider as co, VIRTUALIZE_AS_OF_NUM_ITEMS as po } from "./options/index.js";
-import { LuzmoOverlayTrigger as xo, OverlayTriggerDirective as bo, SlottableRequestDirective as go, openOverlay as Lo, slottableRequest as ho, trigger as vo } from "./overlay/index.js";
+import { LuzmoIcon as Ho } from "./icon/index.js";
+import { LuzmoInfieldButton as jo } from "./infield-button/index.js";
+import { LuzmoLabel as Ko } from "./label/index.js";
+import { LuzmoMenu as Jo, LuzmoMenuDivider as Qo, LuzmoMenuGroup as Xo, LuzmoMenuItem as Yo, MenuItemAddedOrUpdatedEvent as ot } from "./menu/index.js";
+import { LuzmoMultiLangField as et } from "./multi-language-field/index.js";
+import { LuzmoNumberField as it } from "./number-field/index.js";
+import { LuzmoOption as st, LuzmoOptions as nt, LuzmoOptionsDivider as lt, VIRTUALIZE_AS_OF_NUM_ITEMS as mt } from "./options/index.js";
+import { LuzmoOverlayTrigger as ct, OverlayTriggerDirective as ut, SlottableRequestDirective as dt, openOverlay as ht, slottableRequest as bt, trigger as gt } from "./overlay/index.js";
 import "./picker/index.js";
-import { LuzmoPickerButton as yo } from "./picker-button/index.js";
+import { LuzmoPickerButton as vt } from "./picker-button/index.js";
 import "./popover/index.js";
 import "./progress-circle/index.js";
-import { LuzmoRadio as Io, LuzmoRadioGroup as To } from "./radio/index.js";
-import { LuzmoSearch as wo } from "./search/index.js";
-import { LuzmoSelect as Oo } from "./select/index.js";
-import { LuzmoSlider as Po } from "./slider/index.js";
-import { LuzmoSwatch as Ro, LuzmoSwatchGroup as Eo } from "./swatch/index.js";
-import { LuzmoSwitch as Do } from "./switch/index.js";
-import { LuzmoTab as Uo, LuzmoTabPanel as _o, LuzmoTabs as No, LuzmoTabsOverflow as Ho } from "./tabs/index.js";
-import { LuzmoTag as Vo, LuzmoTags as jo } from "./tags/index.js";
-import { LuzmoHelpText as Wo } from "./text-field/index.js";
-import { LuzmoToast as Jo } from "./toast/index.js";
-import { LuzmoTooltip as Xo } from "./tooltip/index.js";
-import { LuzmoUnitInput as $o } from "./unit-input/index.js";
-import { a as rr, L as er } from "./base-WsynuqaS.js";
-import { F as mr } from "./focus-visible-DBlJGoEW.js";
-import { F as tr } from "./focusable-BxtpnzWp.js";
-import { j as ir, d as zr, e as nr, h as sr, c as cr, b as pr, a as fr, i as dr, g as xr, f as br } from "./platform-BM-uMWpX.js";
-import { E as Lr, S as hr } from "./sized-mixin-D4ACoVUr.js";
-import { s as Sr } from "./streaming-listener-CP-JE6Fa.js";
-import { L as Cr } from "./action-group-DBImibFn.js";
-import { L as Tr } from "./clear-button-DoeRUWQ3.js";
-import { L as wr } from "./close-button-BWXdHSx3.js";
-import { L as Or } from "./color-loupe-CmMsXbjT.js";
-import { L as Pr } from "./field-group-DXfBWrkO.js";
-import { L as Rr } from "./field-label-CZ2zzChK.js";
-import { C as Br, H as Dr, b as Gr, I as Ur, c as _r, d as Nr, L as Hr, e as qr, P as Vr, S as jr, V as Kr, g as Wr, l as Zr, a as Jr, n as Qr, o as Xr, p as Yr } from "./overlay-Cig9r6uU.js";
-import { S as oe, r as re } from "./slottable-request-event-DggLA4Rx.js";
-import { D as le, a as me, L as ue } from "./picker-BmoXv1jt.js";
-import { LuzmoPopover as ae } from "./popover-DjX0aAnY.js";
-import { L as ze } from "./progress-circle-DXH9z8-6.js";
-import { L as se } from "./text-field-BIADXoLC.js";
-const r = () => {
+import { luzmoClear as C, luzmoCheck as S, luzmoMicrophone as E, luzmoArrowUp as $ } from "@luzmo/icons";
+import { unsafeCSS as k, html as n, nothing as v } from "lit";
+import { property as m, state as h, query as w } from "lit/decorators.js";
+import { repeat as R } from "lit/directives/repeat.js";
+import { a as B } from "./base-CdYjmV_8.js";
+import { L as xt } from "./base-CdYjmV_8.js";
+import { S as F } from "./sized-mixin-cJbo3PKR.js";
+import { E as _t } from "./sized-mixin-cJbo3PKR.js";
+import { V as _ } from "./voice-recorder-BRq_gEkz.js";
+import { LuzmoTag as Lt, LuzmoTags as Rt } from "./tags/index.js";
+import { LuzmoHelpText as Ct } from "./text-field/index.js";
+import { LuzmoRadio as Et, LuzmoRadioGroup as $t } from "./radio/index.js";
+import { LuzmoSearch as Bt } from "./search/index.js";
+import { LuzmoSelect as It } from "./select/index.js";
+import { LuzmoSlider as Dt } from "./slider/index.js";
+import { LuzmoSwatch as Mt, LuzmoSwatchGroup as Ut } from "./swatch/index.js";
+import { LuzmoSwitch as Nt } from "./switch/index.js";
+import { LuzmoTab as qt, LuzmoTabPanel as Ht, LuzmoTabs as Gt, LuzmoTabsOverflow as jt } from "./tabs/index.js";
+import { LuzmoToast as Kt } from "./toast/index.js";
+import { LuzmoTooltip as Jt } from "./tooltip/index.js";
+import { F as Xt } from "./focus-visible-BvScGDCE.js";
+import { F as oe } from "./focusable-BjvsvVam.js";
+import { j as ee, d as re, e as ie, h as ae, c as se, b as ne, a as le, i as me, g as pe, f as ce } from "./platform-CqwNrovd.js";
+import { s as de } from "./streaming-listener-BlWm-XZU.js";
+import { L as be } from "./action-group-Bwt9w8Vh.js";
+import { L as fe } from "./close-button-CGZxCNlI.js";
+import { L as ze } from "./color-loupe-CLPX6xVb.js";
+import { L as ye } from "./field-group-CHmw159R.js";
+import { L as we } from "./field-label-Cy3xMWZ-.js";
+import { C as Re, H as Ae, b as Ce, I as Se, c as Ee, d as $e, L as ke, e as Be, P as Fe, S as Ie, V as Te, g as De, l as Pe, a as Me, n as Ue, o as Oe, p as Ne } from "./overlay-C-No3oJQ.js";
+import { S as qe, r as He } from "./slottable-request-event-DggLA4Rx.js";
+import { D as je, L as We, a as Ke } from "./picker-GyeSAxxY.js";
+import { LuzmoPopover as Je } from "./popover-ucIgjbQs.js";
+import { L as Xe } from "./progress-circle-D5J0ZwY0.js";
+import { L as or } from "./text-field-BHaLKkf1.js";
+const A = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
-    const o = document.createElement("style");
-    o.setAttribute("data-luzmo-vars", ""), o.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-informative-color: #1a77e9;--luzmo-informative-color-rgb: 26, 119, 233;--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(o);
+    const b = document.createElement("style");
+    b.setAttribute("data-luzmo-vars", ""), b.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: #b3241f;--luzmo-negative-color-down: #9f231f;--luzmo-negative-color-focus: #b3241f;--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-positive-color: rgb(20, 150, 101);--luzmo-positive-color-hover: rgb(17, 128, 86);--luzmo-positive-color-down: rgb(16, 105, 71);--luzmo-positive-color-focus: rgb(17, 128, 86);--luzmo-positive-color-rgb: 20, 150, 101;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: rgb(70, 70, 70);--luzmo-selected-color-down: rgb(40, 40, 40);--luzmo-selected-color-focus: rgb(70, 70, 70);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: rgb(0, 0, 0);--luzmo-selected-color-hard-down: rgb(0, 0, 0);--luzmo-selected-color-hard-focus: rgb(0, 0, 0);--luzmo-informative-color: #1a77e9;--luzmo-informative-color-rgb: 26, 119, 233;--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 10px;--luzmo-icon-size-xs: 12px;--luzmo-icon-size-s: 14px;--luzmo-icon-size-m: 16px;--luzmo-icon-size-l: 18px;--luzmo-icon-size-xl: 20px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(b);
   }
 };
-r();
+A();
+const I = ":host{display:flex;flex-direction:column;font-family:var(--luzmo-prompt-box-font-family, var(--prompt-box-font-family));font-size:var(--luzmo-prompt-box-font-size, var(--prompt-box-font-size));line-height:var(--luzmo-prompt-box-line-height, var(--prompt-box-line-height));color:var(--highcontrast-prompt-box-text-color, var(--luzmo-prompt-box-text-color, var(--prompt-box-text-color)));width:100%}:host([disabled]){opacity:var(--luzmo-prompt-box-disabled-opacity, var(--prompt-box-disabled-opacity));pointer-events:none}.container{display:flex;flex-direction:column;gap:var(--luzmo-prompt-box-gap, var(--prompt-box-gap));padding:var(--luzmo-prompt-box-vertical-padding, var(--prompt-box-vertical-padding)) var(--luzmo-prompt-box-horizontal-padding, var(--prompt-box-horizontal-padding));background-color:var(--highcontrast-prompt-box-background-color, var(--luzmo-prompt-box-background-color, var(--prompt-box-background-color)));border-radius:var(--luzmo-prompt-box-border-radius, var(--prompt-box-border-radius));border-width:var(--luzmo-prompt-box-border-width, var(--prompt-box-border-width));border-style:solid;border-color:var(--highcontrast-prompt-box-border-color, var(--luzmo-prompt-box-border-color, var(--prompt-box-border-color)));box-shadow:var(--luzmo-prompt-box-shadow, var(--prompt-box-shadow));transition:border-color var(--luzmo-prompt-box-animation-duration, var(--prompt-box-animation-duration)) ease-in-out,box-shadow var(--luzmo-prompt-box-animation-duration, var(--prompt-box-animation-duration)) ease-in-out}:host(:focus-visible) .container{border-color:var(--luzmo-prompt-box-border-color-focus, var(--prompt-box-border-color-focus));box-shadow:var(--luzmo-prompt-box-shadow-focus, var(--prompt-box-shadow-focus))}:host(.focus-visible) .container{border-color:var(--luzmo-prompt-box-border-color-focus, var(--prompt-box-border-color-focus));box-shadow:var(--luzmo-prompt-box-shadow-focus, var(--prompt-box-shadow-focus))}:host(:focus){outline:none}.top-actions{display:flex;align-items:center;gap:var(--luzmo-prompt-box-top-actions-gap, var(--prompt-box-top-actions-gap));flex-wrap:wrap;opacity:var(--luzmo-prompt-box-actions-opacity, var(--prompt-box-actions-opacity, 1));transition:opacity var(--luzmo-prompt-box-animation-duration, var(--prompt-box-animation-duration)) ease-in-out}.top-actions.empty{display:none}.hidden-file-input{position:absolute;width:0;height:0;opacity:0;overflow:hidden;pointer-events:none}.attachments{display:flex;flex-direction:column;gap:var(--luzmo-prompt-box-attachments-gap, var(--prompt-box-attachments-gap, 8px))}.image-attachments{display:flex;flex-wrap:wrap;gap:var(--luzmo-prompt-box-image-attachments-gap, var(--prompt-box-image-attachments-gap, 8px))}.image-attachment{position:relative;display:inline-flex;width:var(--luzmo-prompt-box-image-preview-size, var(--prompt-box-image-preview-size, 80px));height:var(--luzmo-prompt-box-image-preview-size, var(--prompt-box-image-preview-size, 80px));border-radius:var(--luzmo-prompt-box-image-border-radius, var(--prompt-box-image-border-radius, 8px));overflow:hidden;background-color:var(--luzmo-prompt-box-image-background, var(--prompt-box-image-background, rgba(0, 0, 0, .05)))}.image-preview{width:100%;height:100%;object-fit:cover}.attachment-remove{position:absolute;top:4px;right:4px;width:var(--luzmo-prompt-box-remove-button-size, var(--prompt-box-remove-button-size, 24px));height:var(--luzmo-prompt-box-remove-button-size, var(--prompt-box-remove-button-size, 24px));background-color:var(--luzmo-prompt-box-remove-button-background, var(--prompt-box-remove-button-background, rgba(0, 0, 0, .5)));border-radius:50%;--luzmo-clear-button-icon-color: var( --luzmo-prompt-box-remove-button-icon-color, var(--prompt-box-remove-button-icon-color, #fff) )}.attachment-remove:hover{background-color:var(--luzmo-prompt-box-remove-button-background-hover, var(--prompt-box-remove-button-background-hover, rgba(0, 0, 0, .7)))}.file-attachments{--luzmo-tag-border-radius: 16px;display:flex;flex-wrap:wrap;gap:var(--luzmo-prompt-box-file-attachments-gap, var(--prompt-box-file-attachments-gap, 4px))}.file-attachment{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.input-wrapper{position:relative;display:flex;flex:1}.input-field{flex:1;width:100%;min-width:0;--luzmo-text-field-focus-indicator-width: 0;--luzmo-text-field-border-width: 0;--luzmo-text-field-width: 100%;--luzmo-text-field-min-width: 0;--luzmo-text-field-placeholder-text-color-default: var( --luzmo-prompt-box-placeholder-color, var(--prompt-box-placeholder-color) )}.actions-row{display:flex;align-items:center;justify-content:space-between;gap:var(--luzmo-prompt-box-actions-gap, var(--prompt-box-actions-gap))}.bottom-actions{display:flex;align-items:center;gap:var(--luzmo-prompt-box-bottom-actions-gap, var(--prompt-box-bottom-actions-gap));flex-wrap:wrap;flex:1;opacity:var(--luzmo-prompt-box-actions-opacity, var(--prompt-box-actions-opacity, 1));transition:opacity var(--luzmo-prompt-box-animation-duration, var(--prompt-box-animation-duration)) ease-in-out}.button-group{display:flex;align-items:center;gap:var(--luzmo-prompt-box-button-group-gap, var(--prompt-box-button-group-gap));margin-left:auto}.record-button,.cancel-recording-button{--luzmo-action-button-border-radius: var( --luzmo-prompt-box-record-button-border-radius, 50% );--luzmo-action-button-focus-indicator-border-radius: var( --luzmo-prompt-box-record-button-focus-indicator-border-radius, 50% )}.submit-button{margin-inline-start:var(--luzmo-prompt-box-submit-button-margin-inline-start, var(--prompt-box-submit-button-margin-inline-start))}.recording-ui{display:flex;align-items:center;gap:var(--luzmo-prompt-box-recording-gap, var(--prompt-box-recording-gap))}.waveform{display:flex;align-items:center;gap:var(--luzmo-prompt-box-waveform-gap, var(--prompt-box-waveform-gap, 3px));height:var(--luzmo-prompt-box-waveform-height, var(--prompt-box-waveform-height, 24px));padding:0 4px}.waveform-bar{width:var(--luzmo-prompt-box-waveform-bar-width, var(--prompt-box-waveform-bar-width, 3px));height:calc(var(--bar-height, .3) * var(--luzmo-prompt-box-waveform-height, var(--prompt-box-waveform-height, 24px)));min-height:4px;background-color:var(--luzmo-prompt-box-waveform-bar-color, var(--prompt-box-waveform-bar-color, currentColor));border-radius:var(--luzmo-prompt-box-waveform-bar-radius, var(--prompt-box-waveform-bar-radius, 2px));transition:height .05s ease-out;animation:waveform-pulse 1s ease-in-out infinite}.waveform-bar:nth-child(1){animation-delay:0s}.waveform-bar:nth-child(2){animation-delay:.1s}.waveform-bar:nth-child(3){animation-delay:.2s}.waveform-bar:nth-child(4){animation-delay:.1s}.waveform-bar:nth-child(5){animation-delay:0s}@keyframes waveform-pulse{0%,to{opacity:.6}50%{opacity:1}}.recording-duration{font-family:var(--luzmo-prompt-box-recording-duration-font-family, var(--prompt-box-recording-duration-font-family, monospace));font-size:var(--luzmo-prompt-box-recording-duration-font-size, var(--prompt-box-recording-duration-font-size, 14px));font-weight:var(--luzmo-prompt-box-recording-duration-font-weight, var(--prompt-box-recording-duration-font-weight, 500));color:var(--luzmo-prompt-box-recording-duration-color, var(--prompt-box-recording-duration-color, currentColor));text-align:center}::slotted([slot=top-actions]){display:inline-flex;align-items:center}::slotted([slot=bottom-actions]){display:inline-flex;align-items:center}::slotted([slot=record-button]){display:inline-flex}::slotted([slot=submit-button]){display:inline-flex;margin-inline-start:var(--luzmo-prompt-box-submit-button-margin-inline-start, var(--prompt-box-submit-button-margin-inline-start))}@media (forced-colors: active){:host{--highcontrast-prompt-box-background-color: Canvas;--highcontrast-prompt-box-border-color: CanvasText;--highcontrast-prompt-box-text-color: CanvasText}}:host{--prompt-box-font-family: var(--luzmo-font-family);--prompt-box-font-size: var(--luzmo-font-size);--prompt-box-line-height: 1.5;--prompt-box-text-color: var(--luzmo-font-color);--prompt-box-background-color: var(--luzmo-background-color);--prompt-box-border-radius: var(--luzmo-border-radius-xl);--prompt-box-border-width: var(--luzmo-border-width);--prompt-box-border-color: var(--luzmo-border-color);--prompt-box-border-color-focus: var(--luzmo-primary);--prompt-box-shadow: 0 2px 8px rgba(var(--luzmo-border-color-rgb), .08);--prompt-box-shadow-focus: 0 2px 12px rgba(var(--luzmo-primary-rgb), .15);--prompt-box-gap: var(--luzmo-spacing-5);--prompt-box-recording-gap: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--prompt-box-vertical-padding: var(--luzmo-spacing-4);--prompt-box-horizontal-padding: var(--luzmo-spacing-5);--prompt-box-actions-gap: var(--luzmo-spacing-3);--prompt-box-top-actions-gap: var(--luzmo-spacing-2);--prompt-box-bottom-actions-gap: var(--luzmo-spacing-2);--prompt-box-button-group-gap: var(--luzmo-spacing-2);--prompt-box-submit-button-margin-inline-start: var(--luzmo-spacing-3);--prompt-box-max-height: 200px;--prompt-box-placeholder-color: var(--luzmo-font-color-extra-dimmed);--prompt-box-placeholder-opacity: 1;--prompt-box-animation-duration: var(--luzmo-animation-duration, .15s);--prompt-box-disabled-opacity: .5;--prompt-box-attachments-gap: var(--luzmo-spacing-1);--prompt-box-image-attachments-gap: var(--luzmo-spacing-2);--prompt-box-file-attachments-gap: var(--luzmo-spacing-2);--prompt-box-image-preview-size: 64px;--prompt-box-image-border-radius: var(--luzmo-border-radius);--prompt-box-image-background: rgba(0, 0, 0, .05);--prompt-box-remove-button-size: 20px;--prompt-box-remove-button-background: rgba(0, 0, 0, .5);--prompt-box-remove-button-background-hover: rgba(0, 0, 0, .7);--prompt-box-remove-button-icon-color: #fff}:host([size=s]){--prompt-box-font-size: var(--luzmo-font-size-s);--prompt-box-border-radius: var(--luzmo-border-radius-l);--prompt-box-vertical-padding: var(--luzmo-spacing-3);--prompt-box-horizontal-padding: var(--luzmo-spacing-4);--prompt-box-gap: var(--luzmo-spacing-4);--prompt-box-attachments-gap: 0;--prompt-box-image-attachments-gap: var(--luzmo-spacing-1);--prompt-box-recording-gap: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--prompt-box-max-height: 150px;--prompt-box-image-preview-size: 48px;--prompt-box-remove-button-size: 18px}:host([size=l]){--prompt-box-font-size: var(--luzmo-font-size-l);--prompt-box-border-radius: var(--luzmo-border-radius-xl);--prompt-box-vertical-padding: var(--luzmo-spacing-5);--prompt-box-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--prompt-box-gap: var(--luzmo-spacing-4);--prompt-box-attachments-gap: var(--luzmo-spacing-1);--prompt-box-image-attachments-gap: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--prompt-box-recording-gap: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--prompt-box-max-height: 250px;--prompt-box-image-preview-size: 72px;--prompt-box-remove-button-size: 24px}:host([size=xl]){--prompt-box-font-size: var(--luzmo-font-size-xl);--prompt-box-border-radius: var(--luzmo-border-radius-xl);--prompt-box-vertical-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--prompt-box-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--prompt-box-gap: var(--luzmo-spacing-5);--prompt-box-attachments-gap: var(--luzmo-spacing-2);--prompt-box-image-attachments-gap: var(--luzmo-spacing-3);--prompt-box-max-height: 300px;--prompt-box-image-preview-size: 96px;--prompt-box-remove-button-size: 28px}:host([pending]){--prompt-box-actions-opacity: .75}";
+var T = Object.defineProperty, s = (b, o, t, e) => {
+  for (var a = void 0, r = b.length - 1, l; r >= 0; r--)
+    (l = b[r]) && (a = l(o, t, a) || a);
+  return a && T(o, t, a), a;
+};
+let z = !1;
+typeof window < "u" && (document.addEventListener(
+  "keydown",
+  () => {
+    z = !0;
+  },
+  !0
+), document.addEventListener(
+  "mousedown",
+  () => {
+    z = !1;
+  },
+  !0
+), document.addEventListener(
+  "pointerdown",
+  () => {
+    z = !1;
+  },
+  !0
+));
+var d;
+const i = (d = class extends F(B, {
+  validSizes: ["xs", "s", "m", "l", "xl"],
+  defaultSize: "m"
+}) {
+  constructor() {
+    super(...arguments), this.rows = 1, this.grows = !1, this.recording = !1, this.hideSubmit = !1, this.placeholder = "", this.value = "", this.disabled = !1, this.readonly = !1, this.maxlength = -1, this.pending = !1, this.allowImages = !1, this.allowFiles = !1, this.acceptedFileTypes = [], this._hasTopActions = !1, this._hasBottomActions = !1, this._hasRecordButton = !1, this._hasSubmitButton = !1, this._attachments = [], this._isRecording = !1, this._recordingDuration = 0, this._audioLevel = 0, this._voiceRecorder = null, this._shouldFocusFinishButton = !1, this._attachmentIdCounter = 0, this._handleHostFocus = () => {
+      z && this.classList.add("focus-visible");
+    }, this._handleHostBlur = () => {
+      this.classList.remove("focus-visible");
+    }, this._handlePaste = (o) => {
+      var a;
+      if (!this.allowImages || this.disabled || this.readonly || this.pending)
+        return;
+      const t = (a = o.clipboardData) == null ? void 0 : a.items;
+      if (!t) return;
+      const e = [];
+      for (const r of t)
+        if (r.type.startsWith("image/")) {
+          const l = r.getAsFile();
+          l && e.push(l);
+        }
+      e.length > 0 && this.addFiles(e);
+    };
+  }
+  static get styles() {
+    return [k(I)];
+  }
+  /**
+   * Get the appropriate tag size based on the prompt box size.
+   * Tags are one level smaller than the prompt box, with 's' being the minimum.
+   * @private
+   */
+  get _tagSize() {
+    switch (this.size) {
+      case "s":
+      case "m":
+        return "s";
+      case "l":
+      case "xl":
+        return "m";
+      default:
+        return "s";
+    }
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.hasAttribute("tabindex") || this.setAttribute("tabindex", "0"), this.addEventListener("focus", this._handleHostFocus), this.addEventListener("blur", this._handleHostBlur), this.addEventListener("paste", this._handlePaste);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.removeEventListener("focus", this._handleHostFocus), this.removeEventListener("blur", this._handleHostBlur), this.removeEventListener("paste", this._handlePaste), this._revokeAllPreviewUrls(), this._destroyVoiceRecorder();
+  }
+  _revokeAllPreviewUrls() {
+    for (const o of this._attachments)
+      o.previewUrl && URL.revokeObjectURL(o.previewUrl);
+  }
+  _handleTopActionsSlotChange(o) {
+    const t = o.target;
+    this._hasTopActions = t.assignedNodes().length > 0;
+  }
+  _handleBottomActionsSlotChange(o) {
+    const t = o.target;
+    this._hasBottomActions = t.assignedNodes().length > 0;
+  }
+  _handleRecordButtonSlotChange(o) {
+    const t = o.target;
+    this._hasRecordButton = t.assignedNodes().length > 0;
+  }
+  _handleSubmitButtonSlotChange(o) {
+    const t = o.target;
+    this._hasSubmitButton = t.assignedNodes().length > 0;
+  }
+  _handleInput(o) {
+    const t = o.target;
+    this.value = t.value, this.dispatchEvent(
+      new Event("input", {
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  _handleKeydown(o) {
+    o.key === "Enter" && !o.shiftKey && (o.preventDefault(), this._submit());
+  }
+  _handleFileInputChange(o) {
+    const t = o.target, e = t.files;
+    e && e.length > 0 && this.addFiles([...e]), t.value = "";
+  }
+  _isFileTypeAccepted(o) {
+    if (this.acceptedFileTypes.length === 0)
+      return !0;
+    const t = o.name.toLowerCase(), e = o.type.toLowerCase();
+    for (const a of this.acceptedFileTypes) {
+      const r = a.toLowerCase();
+      if (r.endsWith("/*")) {
+        const l = r.slice(0, -2);
+        if (e.startsWith(l + "/"))
+          return !0;
+      } else {
+        if (e === r)
+          return !0;
+        if (r.startsWith(".") && t.endsWith(r))
+          return !0;
+      }
+    }
+    return !1;
+  }
+  _isImageFile(o) {
+    return o.type.startsWith("image/");
+  }
+  _generateAttachmentId() {
+    return `attachment-${++this._attachmentIdCounter}-${Date.now()}`;
+  }
+  /**
+   * Add files as attachments.
+   * @param files - Array of File objects to add
+   * @returns Array of added attachment IDs
+   */
+  addFiles(o) {
+    if (this.disabled || this.readonly || this.pending)
+      return [];
+    const t = [];
+    for (const e of o) {
+      if (this._isImageFile(e) && !this.allowImages || !this._isImageFile(e) && !this.allowFiles || !this._isFileTypeAccepted(e))
+        continue;
+      const a = this._generateAttachmentId(), r = {
+        file: e,
+        id: a
+      };
+      this._isImageFile(e) && (r.previewUrl = URL.createObjectURL(e)), this._attachments = [...this._attachments, r], t.push(a);
+    }
+    return t.length > 0 && this.dispatchEvent(
+      new CustomEvent("luzmo-attachments-change", {
+        bubbles: !0,
+        composed: !0,
+        detail: { attachments: this._attachments }
+      })
+    ), t;
+  }
+  /**
+   * Remove an attachment by its ID.
+   * @param id - The attachment ID to remove
+   */
+  removeAttachment(o) {
+    const t = this._attachments.find((e) => e.id === o);
+    t && (t.previewUrl && URL.revokeObjectURL(t.previewUrl), this._attachments = this._attachments.filter((e) => e.id !== o), this.dispatchEvent(
+      new CustomEvent("luzmo-attachments-change", {
+        bubbles: !0,
+        composed: !0,
+        detail: { attachments: this._attachments }
+      })
+    ));
+  }
+  /**
+   * Clear all attachments.
+   */
+  clearAttachments() {
+    this._revokeAllPreviewUrls(), this._attachments = [], this.dispatchEvent(
+      new CustomEvent("luzmo-attachments-change", {
+        bubbles: !0,
+        composed: !0,
+        detail: { attachments: this._attachments }
+      })
+    );
+  }
+  /**
+   * Get all current attachments.
+   */
+  getAttachments() {
+    return [...this._attachments];
+  }
+  /**
+   * Open the file picker dialog.
+   */
+  openFilePicker() {
+    var o;
+    (o = this._fileInput) == null || o.click();
+  }
+  _handleRemoveAttachment(o) {
+    const e = o.currentTarget.dataset.attachmentId;
+    e && this.removeAttachment(e);
+  }
+  _handleTagDelete(o) {
+    const e = o.target.dataset.attachmentId;
+    e && (o.preventDefault(), this.removeAttachment(e));
+  }
+  /**
+   * Extract values from interactive elements within a container.
+   * @private
+   */
+  _extractActionValues(o) {
+    const t = [];
+    for (const e of o) {
+      const a = this._getInteractiveElements(e);
+      for (const r of a) {
+        const l = {
+          element: r,
+          name: r.getAttribute("name") || r.getAttribute("label") || void 0
+        }, c = [
+          "luzmo-switch",
+          "luzmo-checkbox",
+          "luzmo-radio"
+        ], u = r.tagName.toLowerCase();
+        "value" in r && (l.value = r.value), c.includes(u) && "checked" in r && (l.checked = r.checked), t.push(l);
+      }
+    }
+    return t;
+  }
+  _submit() {
+    var c, u;
+    if (this.disabled || this.readonly || this.pending)
+      return;
+    const o = (c = this.shadowRoot) == null ? void 0 : c.querySelector(
+      'slot[name="top-actions"]'
+    ), t = (u = this.shadowRoot) == null ? void 0 : u.querySelector(
+      'slot[name="bottom-actions"]'
+    ), e = (o == null ? void 0 : o.assignedElements()) ?? [], a = (t == null ? void 0 : t.assignedElements()) ?? [], r = this._extractActionValues([
+      ...e,
+      ...a
+    ]), l = {
+      value: this.value,
+      topActions: [...e],
+      bottomActions: [...a],
+      actionValues: r,
+      attachments: [...this._attachments]
+    };
+    this.dispatchEvent(
+      new CustomEvent("luzmo-submit", {
+        bubbles: !0,
+        composed: !0,
+        detail: l
+      })
+    );
+  }
+  async _handleRecordClick(o) {
+    if (!_.isSupported()) {
+      this.dispatchEvent(
+        new CustomEvent("luzmo-record-error", {
+          bubbles: !0,
+          composed: !0,
+          detail: { error: "Voice recording is not supported in this browser" }
+        })
+      );
+      return;
+    }
+    if (this._isRecording)
+      this._stopRecording();
+    else {
+      const t = o.currentTarget;
+      this._shouldFocusFinishButton = t.matches(":focus-visible"), await this._startRecording();
+    }
+    this.dispatchEvent(
+      new CustomEvent("luzmo-record", {
+        bubbles: !0,
+        composed: !0,
+        detail: { isRecording: this._isRecording }
+      })
+    );
+  }
+  /**
+   * Start voice recording.
+   * @private
+   */
+  async _startRecording() {
+    if (this._initVoiceRecorder(), !this._voiceRecorder)
+      return;
+    await this._voiceRecorder.startRecording() && (this._isRecording = !0, this._recordingDuration = 0, this._audioLevel = 0);
+  }
+  /**
+   * Stop voice recording.
+   * @private
+   */
+  _stopRecording() {
+    this._voiceRecorder && this._voiceRecorder.stopRecording();
+  }
+  /**
+   * Cancel voice recording without emitting the result.
+   * @private
+   */
+  _cancelRecording() {
+    this._voiceRecorder && this._voiceRecorder.cancelRecording(), this._isRecording = !1, this._recordingDuration = 0, this._audioLevel = 0;
+  }
+  /**
+   * Handle cancel recording button click.
+   * @private
+   */
+  _handleCancelRecordClick() {
+    this._cancelRecording(), this.dispatchEvent(
+      new CustomEvent("luzmo-record-cancel", {
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  /**
+   * Initialize voice recorder with callbacks.
+   * @private
+   */
+  _initVoiceRecorder() {
+    this._voiceRecorder || (this._voiceRecorder = new _({
+      maxDuration: 3e5
+      // 5 minutes
+    }), this._voiceRecorder.onStart(() => {
+      this._isRecording = !0;
+    }).onStop((o) => {
+      this._isRecording = !1, this._recordingDuration = 0, this._audioLevel = 0, this.dispatchEvent(
+        new CustomEvent("luzmo-recording-complete", {
+          bubbles: !0,
+          composed: !0,
+          detail: {
+            audioBlob: o.audioBlob,
+            duration: o.duration,
+            mimeType: o.mimeType
+          }
+        })
+      );
+    }).onError((o) => {
+      this._isRecording = !1, this._recordingDuration = 0, this._audioLevel = 0, this.dispatchEvent(
+        new CustomEvent("luzmo-record-error", {
+          bubbles: !0,
+          composed: !0,
+          detail: { error: o }
+        })
+      );
+    }).onAudioLevel((o) => {
+      this._audioLevel = o;
+    }).onDurationUpdate((o) => {
+      this._recordingDuration = o;
+    }));
+  }
+  /**
+   * Destroy voice recorder and clean up.
+   * @private
+   */
+  _destroyVoiceRecorder() {
+    this._voiceRecorder && (this._voiceRecorder.destroy(), this._voiceRecorder = null), this._isRecording = !1, this._recordingDuration = 0, this._audioLevel = 0;
+  }
+  /**
+   * Format recording duration for display.
+   * @private
+   */
+  _formatRecordingDuration() {
+    return _.formatDuration(this._recordingDuration);
+  }
+  /**
+   * Focus the input element.
+   */
+  focus() {
+    var o;
+    (o = this._inputElement) == null || o.focus();
+  }
+  /**
+   * Clear the input value and all attachments.
+   */
+  clear() {
+    this.value = "", this.clearAttachments();
+  }
+  /**
+   * Get the slotted top actions elements.
+   */
+  getTopActions() {
+    var t;
+    const o = (t = this.shadowRoot) == null ? void 0 : t.querySelector(
+      'slot[name="top-actions"]'
+    );
+    return (o == null ? void 0 : o.assignedElements()) ?? [];
+  }
+  /**
+   * Get the slotted bottom actions elements.
+   */
+  getBottomActions() {
+    var t;
+    const o = (t = this.shadowRoot) == null ? void 0 : t.querySelector(
+      'slot[name="bottom-actions"]'
+    );
+    return (o == null ? void 0 : o.assignedElements()) ?? [];
+  }
+  updated(o) {
+    super.updated(o), (o.has("pending") || o.has("disabled")) && this._updateSlottedElementsState(), this._shouldFocusFinishButton && this._isRecording && (this._shouldFocusFinishButton = !1, requestAnimationFrame(() => {
+      var t;
+      (t = this._finishRecordingButton) == null || t.focus();
+    }));
+  }
+  /**
+   * Find all interactive children within an element (including the element itself if it matches).
+   * @private
+   */
+  _getInteractiveElements(o) {
+    const t = [];
+    o.matches(d.INTERACTIVE_ELEMENTS_SELECTOR) && t.push(o);
+    const e = o.querySelectorAll(
+      d.INTERACTIVE_ELEMENTS_SELECTOR
+    );
+    return t.push(...e), t;
+  }
+  /**
+   * Update the state of slotted elements based on disabled and pending properties.
+   * When disabled: set disabled attribute
+   * When pending: set readonly attribute (not disabled)
+   * @private
+   */
+  _updateSlottedElementsState() {
+    var c, u, f, L;
+    const o = (c = this.shadowRoot) == null ? void 0 : c.querySelector(
+      'slot[name="submit-button"]'
+    ), t = (o == null ? void 0 : o.assignedElements()) ?? [];
+    for (const x of t) {
+      const y = this._getInteractiveElements(x);
+      for (const p of y)
+        this.pending ? (p.setAttribute("pending", ""), p.removeAttribute("disabled"), p.removeAttribute("readonly")) : this.disabled ? (p.removeAttribute("pending"), p.setAttribute("disabled", ""), p.removeAttribute("readonly")) : (p.removeAttribute("pending"), p.removeAttribute("disabled"), p.removeAttribute("readonly"));
+    }
+    const e = (x) => {
+      for (const y of x) {
+        const p = this._getInteractiveElements(y);
+        for (const g of p)
+          this.disabled ? (g.setAttribute("disabled", ""), g.removeAttribute("readonly")) : this.pending ? (g.removeAttribute("disabled"), g.setAttribute("readonly", "")) : (g.removeAttribute("disabled"), g.removeAttribute("readonly"));
+      }
+    }, a = (u = this.shadowRoot) == null ? void 0 : u.querySelector(
+      'slot[name="top-actions"]'
+    );
+    e((a == null ? void 0 : a.assignedElements()) ?? []);
+    const r = (f = this.shadowRoot) == null ? void 0 : f.querySelector(
+      'slot[name="bottom-actions"]'
+    );
+    e((r == null ? void 0 : r.assignedElements()) ?? []);
+    const l = (L = this.shadowRoot) == null ? void 0 : L.querySelector(
+      'slot[name="record-button"]'
+    );
+    e((l == null ? void 0 : l.assignedElements()) ?? []);
+  }
+  renderTopActions() {
+    return n`
+      <div
+        class="top-actions ${this._hasTopActions ? "" : "empty"}"
+        part="top-actions"
+      >
+        <slot
+          name="top-actions"
+          @slotchange=${this._handleTopActionsSlotChange}
+        ></slot>
+      </div>
+    `;
+  }
+  renderBottomActions() {
+    return n`
+      <div
+        class="bottom-actions ${this._hasBottomActions ? "" : "empty"}"
+        part="bottom-actions"
+      >
+        <slot
+          name="bottom-actions"
+          @slotchange=${this._handleBottomActionsSlotChange}
+        ></slot>
+      </div>
+    `;
+  }
+  renderRecordButton() {
+    return !this.recording && !this._hasRecordButton ? n`<slot
+        name="record-button"
+        @slotchange=${this._handleRecordButtonSlotChange}
+      ></slot>` : this._hasRecordButton ? n`<slot
+        name="record-button"
+        @slotchange=${this._handleRecordButtonSlotChange}
+      ></slot>` : this._isRecording ? n`
+        <slot
+          name="record-button"
+          @slotchange=${this._handleRecordButtonSlotChange}
+        ></slot>
+        <div class="recording-ui" part="recording-ui">
+          <luzmo-action-button
+            class="cancel-recording-button"
+            part="cancel-recording-button"
+            .size=${this.size}
+            ?disabled=${this.disabled}
+            @click=${this._handleCancelRecordClick}
+            aria-label="Cancel recording"
+          >
+            <luzmo-icon
+              slot="icon"
+              .icon=${C}
+              .size=${this.size}
+            ></luzmo-icon>
+          </luzmo-action-button>
+          ${this.renderWaveform()}
+          <span class="recording-duration" part="recording-duration">
+            ${this._formatRecordingDuration()}
+          </span>
+          <luzmo-button
+            class="finish-recording-button"
+            part="finish-recording-button"
+            .size=${this.size}
+            icon-only
+            variant="primary"
+            ?disabled=${this.disabled}
+            @click=${this._handleRecordClick}
+            aria-label="Finish recording"
+          >
+            <luzmo-icon slot="icon" .icon=${S}></luzmo-icon>
+          </luzmo-button>
+        </div>
+      ` : n`
+      <slot
+        name="record-button"
+        @slotchange=${this._handleRecordButtonSlotChange}
+      ></slot>
+      <luzmo-action-button
+        class="record-button"
+        part="record-button"
+        quiet
+        .size=${this.size}
+        ?disabled=${this.disabled}
+        ?readonly=${this.pending}
+        @click=${this._handleRecordClick}
+        aria-label="Record"
+      >
+        <luzmo-icon
+          slot="icon"
+          .icon=${E}
+          .size=${this.size}
+        ></luzmo-icon>
+      </luzmo-action-button>
+    `;
+  }
+  renderWaveform() {
+    const t = [];
+    for (let e = 0; e < 5; e++) {
+      const r = Math.floor(2.5), c = 1 - Math.abs(e - r) * 0.15, u = 0.3 + this._audioLevel * 0.7 * c, f = Math.max(0.2, Math.min(1, u));
+      t.push(n`
+        <span
+          class="waveform-bar"
+          style="--bar-height: ${f}"
+        ></span>
+      `);
+    }
+    return n`
+      <div class="waveform" part="waveform" aria-hidden="true">${t}</div>
+    `;
+  }
+  renderSubmitButton() {
+    return this._isRecording ? n`<slot
+        name="submit-button"
+        @slotchange=${this._handleSubmitButtonSlotChange}
+      ></slot>` : this.hideSubmit && !this._hasSubmitButton ? n`<slot
+        name="submit-button"
+        @slotchange=${this._handleSubmitButtonSlotChange}
+      ></slot>` : this._hasSubmitButton ? n`<slot
+        name="submit-button"
+        @slotchange=${this._handleSubmitButtonSlotChange}
+      ></slot>` : n`
+      <slot
+        name="submit-button"
+        @slotchange=${this._handleSubmitButtonSlotChange}
+      ></slot>
+      <luzmo-button
+        class="submit-button"
+        part="submit-button"
+        .size=${this.size}
+        icon-only
+        variant="primary"
+        ?disabled=${this.disabled || !this.pending && !this.value.trim()}
+        ?pending=${this.pending}
+        @click=${this._submit}
+        aria-label="Submit"
+      >
+        <luzmo-icon slot="icon" .icon=${$}></luzmo-icon>
+      </luzmo-button>
+    `;
+  }
+  renderTextarea() {
+    return n`
+      <luzmo-text-field
+        class="input-field"
+        part="input"
+        placeholder=${this.placeholder}
+        .value=${this.value}
+        .size=${this.size}
+        rows=${this.rows}
+        ?grows=${this.grows}
+        ?readonly=${this.readonly || this.pending || this.disabled}
+        maxlength=${this.maxlength > 0 ? this.maxlength : -1}
+        multiline
+        quiet
+        label=${this.placeholder || "Enter your message"}
+        @input=${this._handleInput}
+        @keydown=${this._handleKeydown}
+      ></luzmo-text-field>
+    `;
+  }
+  _getAcceptAttribute() {
+    if (this.acceptedFileTypes.length > 0)
+      return this.acceptedFileTypes.join(",");
+    const o = [];
+    return this.allowImages && o.push("image/*"), this.allowFiles && o.push("*/*"), o.join(",");
+  }
+  renderHiddenFileInput() {
+    return !this.allowImages && !this.allowFiles ? v : n`
+      <input
+        type="file"
+        class="hidden-file-input"
+        accept=${this._getAcceptAttribute()}
+        multiple
+        @change=${this._handleFileInputChange}
+        aria-hidden="true"
+        tabindex="-1"
+      />
+    `;
+  }
+  renderImageAttachment(o) {
+    return n`
+      <div class="image-attachment" part="image-attachment">
+        <img
+          src=${o.previewUrl || ""}
+          alt=${o.file.name}
+          class="image-preview"
+        />
+        <luzmo-clear-button
+          class="attachment-remove"
+          .size=${this.size}
+          ?disabled=${this.disabled || this.pending}
+          label="Remove ${o.file.name}"
+          data-attachment-id=${o.id}
+          @click=${this._handleRemoveAttachment}
+        ></luzmo-clear-button>
+      </div>
+    `;
+  }
+  renderFileAttachment(o) {
+    return n`
+      <luzmo-tag
+        class="file-attachment"
+        part="file-attachment"
+        .size=${this._tagSize}
+        deletable
+        ?disabled=${this.disabled || this.pending}
+        data-attachment-id=${o.id}
+        @delete=${this._handleTagDelete}
+      >
+        ${o.file.name}
+      </luzmo-tag>
+    `;
+  }
+  renderAttachments() {
+    if (this._attachments.length === 0)
+      return v;
+    const o = this._attachments.filter(
+      (e) => this._isImageFile(e.file)
+    ), t = this._attachments.filter(
+      (e) => !this._isImageFile(e.file)
+    );
+    return n`
+      <div class="attachments" part="attachments">
+        ${o.length > 0 ? n`
+              <div class="image-attachments" part="image-attachments">
+                ${R(
+      o,
+      (e) => e.id,
+      (e) => this.renderImageAttachment(e)
+    )}
+              </div>
+            ` : v}
+        ${t.length > 0 ? n`
+              <luzmo-tags
+                class="file-attachments"
+                part="file-attachments"
+                .size=${this._tagSize}
+              >
+                ${R(
+      t,
+      (e) => e.id,
+      (e) => this.renderFileAttachment(e)
+    )}
+              </luzmo-tags>
+            ` : v}
+      </div>
+    `;
+  }
+  render() {
+    return n`
+      ${this.renderHiddenFileInput()}
+      <div class="container" part="container">
+        ${this.renderTopActions()} ${this.renderAttachments()}
+        <div class="input-wrapper" part="input-wrapper">
+          ${this.renderTextarea()}
+        </div>
+        <div class="actions-row" part="actions-row">
+          ${this.renderBottomActions()}
+          <div class="button-group" part="button-group">
+            ${this.renderRecordButton()} ${this.renderSubmitButton()}
+          </div>
+        </div>
+      </div>
+    `;
+  }
+}, d.INTERACTIVE_ELEMENTS_SELECTOR = "luzmo-button, luzmo-action-button, luzmo-switch, luzmo-picker, luzmo-picker-button, luzmo-select, luzmo-text-field, luzmo-number-field", d);
+s([
+  m({ type: Number })
+], i.prototype, "rows");
+s([
+  m({ type: Boolean, reflect: !0 })
+], i.prototype, "grows");
+s([
+  m({ type: Boolean, reflect: !0 })
+], i.prototype, "recording");
+s([
+  m({ type: Boolean, reflect: !0, attribute: "hide-submit" })
+], i.prototype, "hideSubmit");
+s([
+  m({ type: String })
+], i.prototype, "placeholder");
+s([
+  m({ type: String })
+], i.prototype, "value");
+s([
+  m({ type: Boolean, reflect: !0 })
+], i.prototype, "disabled");
+s([
+  m({ type: Boolean, reflect: !0 })
+], i.prototype, "readonly");
+s([
+  m({ type: Number })
+], i.prototype, "maxlength");
+s([
+  m({ type: Boolean, reflect: !0 })
+], i.prototype, "pending");
+s([
+  m({ type: Boolean, reflect: !0, attribute: "allow-images" })
+], i.prototype, "allowImages");
+s([
+  m({ type: Boolean, reflect: !0, attribute: "allow-files" })
+], i.prototype, "allowFiles");
+s([
+  m({ type: Array, attribute: "accepted-file-types" })
+], i.prototype, "acceptedFileTypes");
+s([
+  h()
+], i.prototype, "_hasTopActions");
+s([
+  h()
+], i.prototype, "_hasBottomActions");
+s([
+  h()
+], i.prototype, "_hasRecordButton");
+s([
+  h()
+], i.prototype, "_hasSubmitButton");
+s([
+  h()
+], i.prototype, "_attachments");
+s([
+  h()
+], i.prototype, "_isRecording");
+s([
+  h()
+], i.prototype, "_recordingDuration");
+s([
+  h()
+], i.prototype, "_audioLevel");
+s([
+  w("luzmo-text-field")
+], i.prototype, "_inputElement");
+s([
+  w('input[type="file"]')
+], i.prototype, "_fileInput");
+s([
+  w(".finish-recording-button")
+], i.prototype, "_finishRecordingButton");
+let D = i;
+customElements.get("luzmo-prompt-box") || customElements.define("luzmo-prompt-box", D);
 export {
-  Br as ClickController,
-  le as DESCRIPTION_ID,
-  Lr as ElementSizes,
-  mr as FocusVisiblePolyfillMixin,
-  tr as Focusable,
-  Dr as HoverController,
-  Gr as InteractionController,
-  Ur as InteractionTypes,
-  _r as LONGPRESS_INSTRUCTIONS,
-  Nr as LongpressController,
-  Hr as LuzmoAbstractOverlay,
-  s as LuzmoAccordion,
-  c as LuzmoAccordionItem,
-  f as LuzmoActionBar,
-  x as LuzmoActionButton,
-  Cr as LuzmoActionGroup,
-  g as LuzmoActionMenu,
-  h as LuzmoAvatar,
-  S as LuzmoButton,
-  C as LuzmoButtonGroup,
-  T as LuzmoCalendar,
-  w as LuzmoCheckbox,
-  Tr as LuzmoClearButton,
-  wr as LuzmoCloseButton,
-  O as LuzmoColorArea,
-  P as LuzmoColorField,
-  R as LuzmoColorHandle,
-  Or as LuzmoColorLoupe,
-  B as LuzmoColorMenu,
-  G as LuzmoColorPalette,
-  _ as LuzmoColorPicker,
-  H as LuzmoColorSlider,
-  V as LuzmoDateTimePicker,
-  K as LuzmoDivider,
-  rr as LuzmoElement,
-  Pr as LuzmoFieldGroup,
-  Rr as LuzmoFieldLabel,
-  Wo as LuzmoHelpText,
-  Z as LuzmoIcon,
-  Q as LuzmoInfieldButton,
-  Y as LuzmoLabel,
-  oo as LuzmoMenu,
-  ro as LuzmoMenuDivider,
-  eo as LuzmoMenuGroup,
-  lo as LuzmoMenuItem,
-  er as LuzmoMixin,
-  to as LuzmoMultiLangField,
-  io as LuzmoNumberField,
-  no as LuzmoOption,
-  so as LuzmoOptions,
-  co as LuzmoOptionsDivider,
-  qr as LuzmoOverlay,
-  xo as LuzmoOverlayTrigger,
-  me as LuzmoPicker,
-  ue as LuzmoPickerBase,
-  yo as LuzmoPickerButton,
-  ae as LuzmoPopover,
-  ze as LuzmoProgressCircle,
-  Io as LuzmoRadio,
-  To as LuzmoRadioGroup,
-  wo as LuzmoSearch,
-  Oo as LuzmoSelect,
-  Po as LuzmoSlider,
-  Ro as LuzmoSwatch,
-  Eo as LuzmoSwatchGroup,
-  Do as LuzmoSwitch,
-  Uo as LuzmoTab,
-  _o as LuzmoTabPanel,
-  No as LuzmoTabs,
-  Ho as LuzmoTabsOverflow,
-  Vo as LuzmoTag,
-  jo as LuzmoTags,
-  se as LuzmoTextField,
-  Jo as LuzmoToast,
-  Xo as LuzmoTooltip,
-  $o as LuzmoUnitInput,
-  mo as MenuItemAddedOrUpdatedEvent,
-  bo as OverlayTriggerDirective,
-  Vr as PlacementController,
-  jr as SAFARI_FOCUS_RING_CLASS,
-  hr as SizedMixin,
-  go as SlottableRequestDirective,
-  oe as SlottableRequestEvent,
-  po as VIRTUALIZE_AS_OF_NUM_ITEMS,
-  Kr as VirtualTrigger,
-  Wr as guaranteedAllTransitionend,
-  ir as isAndroid,
-  zr as isAppleDevice,
-  nr as isChrome,
-  sr as isFirefox,
-  cr as isIOS,
-  pr as isIPad,
-  fr as isIPhone,
-  dr as isMac,
-  xr as isSeamonkey,
-  br as isWebKit,
-  Zr as lastInteractionType,
-  Jr as nextFrame,
-  Qr as noop,
-  Lo as openOverlay,
-  Xr as overlayTimer,
-  Yr as placementUpdatedSymbol,
-  re as removeSlottableRequest,
-  ho as slottableRequest,
-  Sr as streamingListener,
-  vo as trigger
+  Re as ClickController,
+  je as DESCRIPTION_ID,
+  _t as ElementSizes,
+  Xt as FocusVisiblePolyfillMixin,
+  oe as Focusable,
+  Ae as HoverController,
+  Ce as InteractionController,
+  Se as InteractionTypes,
+  Ee as LONGPRESS_INSTRUCTIONS,
+  $e as LongpressController,
+  ke as LuzmoAbstractOverlay,
+  Y as LuzmoAccordion,
+  oo as LuzmoAccordionItem,
+  eo as LuzmoActionBar,
+  io as LuzmoActionButton,
+  be as LuzmoActionGroup,
+  so as LuzmoActionMenu,
+  lo as LuzmoAvatar,
+  po as LuzmoButton,
+  ho as LuzmoButtonGroup,
+  go as LuzmoCalendar,
+  vo as LuzmoChatMessage,
+  xo as LuzmoChatMessageGroup,
+  _o as LuzmoCheckbox,
+  co as LuzmoClearButton,
+  fe as LuzmoCloseButton,
+  Lo as LuzmoColorArea,
+  Ao as LuzmoColorField,
+  So as LuzmoColorHandle,
+  ze as LuzmoColorLoupe,
+  $o as LuzmoColorMenu,
+  Bo as LuzmoColorPalette,
+  Io as LuzmoColorPaletteGroup,
+  Do as LuzmoColorPicker,
+  Mo as LuzmoColorSlider,
+  Oo as LuzmoDateTimePicker,
+  Vo as LuzmoDivider,
+  B as LuzmoElement,
+  ye as LuzmoFieldGroup,
+  we as LuzmoFieldLabel,
+  Ct as LuzmoHelpText,
+  Ho as LuzmoIcon,
+  jo as LuzmoInfieldButton,
+  Ko as LuzmoLabel,
+  Jo as LuzmoMenu,
+  Qo as LuzmoMenuDivider,
+  Xo as LuzmoMenuGroup,
+  Yo as LuzmoMenuItem,
+  xt as LuzmoMixin,
+  et as LuzmoMultiLangField,
+  it as LuzmoNumberField,
+  st as LuzmoOption,
+  nt as LuzmoOptions,
+  lt as LuzmoOptionsDivider,
+  Be as LuzmoOverlay,
+  ct as LuzmoOverlayTrigger,
+  We as LuzmoPicker,
+  Ke as LuzmoPickerBase,
+  vt as LuzmoPickerButton,
+  Je as LuzmoPopover,
+  Xe as LuzmoProgressCircle,
+  D as LuzmoPromptBox,
+  Et as LuzmoRadio,
+  $t as LuzmoRadioGroup,
+  Bt as LuzmoSearch,
+  It as LuzmoSelect,
+  Dt as LuzmoSlider,
+  Mt as LuzmoSwatch,
+  Ut as LuzmoSwatchGroup,
+  Nt as LuzmoSwitch,
+  qt as LuzmoTab,
+  Ht as LuzmoTabPanel,
+  Gt as LuzmoTabs,
+  jt as LuzmoTabsOverflow,
+  Lt as LuzmoTag,
+  Rt as LuzmoTags,
+  or as LuzmoTextField,
+  Kt as LuzmoToast,
+  Jt as LuzmoTooltip,
+  ot as MenuItemAddedOrUpdatedEvent,
+  ut as OverlayTriggerDirective,
+  Fe as PlacementController,
+  Ie as SAFARI_FOCUS_RING_CLASS,
+  F as SizedMixin,
+  dt as SlottableRequestDirective,
+  qe as SlottableRequestEvent,
+  mt as VIRTUALIZE_AS_OF_NUM_ITEMS,
+  Te as VirtualTrigger,
+  _ as VoiceRecorder,
+  De as guaranteedAllTransitionend,
+  ee as isAndroid,
+  re as isAppleDevice,
+  ie as isChrome,
+  ae as isFirefox,
+  se as isIOS,
+  ne as isIPad,
+  le as isIPhone,
+  me as isMac,
+  pe as isSeamonkey,
+  ce as isWebKit,
+  Pe as lastInteractionType,
+  Me as nextFrame,
+  Ue as noop,
+  ht as openOverlay,
+  Oe as overlayTimer,
+  Ne as placementUpdatedSymbol,
+  He as removeSlottableRequest,
+  bt as slottableRequest,
+  de as streamingListener,
+  gt as trigger
 };