@pega/cosmos-react-core 8.9.4 → 8.10.0

package/lib/components/RadioCheckGroup/RadioCheckGroup.js

@@ -7,7 +7,7 @@ import Flex from '../Flex';
 import { useArrows, useConsolidatedRef, useElement, useTestIds, useTheme, useUID } from '../../hooks';
 import Grid from '../Grid';
 import { StyledImageContainer, StyledSelectionCard, StyledSelectionCardInline } from '../SelectionCard/SelectionCard.styles';
-import { withTestIds } from '../../utils';
+import { getActiveElement, withTestIds } from '../../utils';
 import { StyledRadioCheck } from '../RadioCheck/RadioCheck';
 import { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';
 export const StyledRadioCheckGroup = styled.fieldset(() => {
@@ -89,7 +89,18 @@ const RadioCheckGroup = forwardRef(function RadioCheckGroup(props, ref) {
             }
             : child.props.onChange
     })), [children, name, disabled, readOnly, variant, onChange]);
-    return (_jsx(FormField, { testId: testIds, as: StyledRadioCheckGroup, labelAs: 'legend', ref: containerRef, name: name, disabled: disabled, required: required, ...restProps, isRadioCheck: true, onClear: onClear, children: variant === 'card-grid' ? (_jsx(Grid, { container: {
+    return (_jsx(FormField, { testId: testIds, as: StyledRadioCheckGroup, labelAs: 'legend', ref: containerRef, name: name, disabled: disabled, required: required, ...restProps, isRadioCheck: true, onClear: onClear, 
+        // Prevents blur when any input within the group is actively focused.
+        onMouseDown: (e) => {
+            restProps.onMouseDown?.(e);
+            if (!containerRef.current)
+                return;
+            if (!containerRef.current.contains(getActiveElement()))
+                return;
+            if (!(e.target instanceof Element) || !e.target.closest('label'))
+                return;
+            e.preventDefault();
+        }, children: variant === 'card-grid' ? (_jsx(Grid, { container: {
                 gap: 1,
                 cols: (() => {
                     if (!renderInline)

package/lib/components/RadioCheckGroup/RadioCheckGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, Children, cloneElement, useState, useEffect, useRef, useMemo } from 'react';\nimport type { Ref, PropsWithoutRef, ReactElement, ChangeEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { ForwardRefForwardPropsComponent, TestIdProp } from '../../types';\nimport FormField from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormField, StyledFormFieldInfo } from '../FormField/FormField';\nimport type { FormControlProps } from '../FormControl';\nimport type { RadioCheckProps } from '../RadioCheck';\nimport Flex from '../Flex';\nimport {\n  useArrows,\n  useConsolidatedRef,\n  useElement,\n  useTestIds,\n  useTheme,\n  useUID\n} from '../../hooks';\nimport Grid from '../Grid';\nimport {\n  StyledImageContainer,\n  StyledSelectionCard,\n  StyledSelectionCardInline\n} from '../SelectionCard/SelectionCard.styles';\nimport { withTestIds } from '../../utils';\nimport type { elements } from '../FormField/FormField.test-ids';\nimport { StyledRadioCheck } from '../RadioCheck/RadioCheck';\n\nimport { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';\n\nexport interface RadioCheckGroupProps extends TestIdProp<typeof elements> {\n  /** Accepts Checkboxes or RadioButtons as children. */\n  children: ReactElement | ReactElement[];\n  /**\n   * Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n   * Additionally, onChange can be passed to individual children.\n   * Both handlers will be called, child followed by group.\n   */\n  onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n  /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n  onClear?: FormFieldProps['onClear'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Visually hides the label region. */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Makes the input non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /**\n   * Layout field elements inline in a row.\n   * @default false\n   */\n  inline?: FormFieldProps['inline'];\n  /** Used to toggle the auto stacking feature of an inlined group.\n   * @default true\n   */\n  autoStack?: boolean;\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /**\n   * Controls the styling of the child RadioChecks.\n   * @default 'simple'\n   */\n  variant?: RadioCheckProps['variant'] | 'card-grid';\n  /** Pass a heading and content to show additional information on the field. */\n  additionalInfo?: FormControlProps['additionalInfo'];\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLElement>;\n}\n\nexport const StyledRadioCheckGroup = styled.fieldset(() => {\n  return css`\n    flex-wrap: nowrap;\n\n    &[disabled] {\n      > ${StyledFormField} {\n        opacity: unset;\n      }\n    }\n\n    ${StyledSelectionCard} {\n      max-width: 100%;\n    }\n\n    ${StyledSelectionCardInline} ${StyledImageContainer} {\n      /* To enlarge the image containers to the size of the biggest one */\n      min-height: 100%;\n    }\n\n    ${StyledRadioCheck} > ${StyledFormFieldInfo} {\n      display: none;\n    }\n  `;\n});\n\nconst RadioCheckGroup: ForwardRefForwardPropsComponent<RadioCheckGroupProps> = forwardRef(\n  function RadioCheckGroup(\n    props: PropsWithoutRef<RadioCheckGroupProps>,\n    ref: RadioCheckGroupProps['ref']\n  ) {\n    const uid = useUID();\n    const {\n      testId,\n      children,\n      name = uid,\n      disabled = false,\n      required = false,\n      onChange,\n      readOnly,\n      inline = false,\n      autoStack = true,\n      variant = 'simple',\n      onClear,\n      ...restProps\n    } = props;\n\n    const testIds = useTestIds(testId, getRadioCheckGroupTestIds);\n    const theme = useTheme();\n    const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n    const [renderInline, setRenderInline] = useState(inline);\n    const renderInlineRef = useRef(inline);\n    const minInlineWidth = useRef(0);\n    const containerRef = useConsolidatedRef(ref);\n\n    useArrows(containerRef, {\n      selector: '[data-main-focus]',\n      cycle: false,\n      dir: 'left-right'\n    });\n\n    useEffect(() => {\n      setRenderInline(inline);\n      if (inline && optionsEl && optionsEl.lastChild && autoStack) {\n        const intersectionObserver = new IntersectionObserver(\n          entries => {\n            if (entries[0].intersectionRatio < 1) {\n              if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n              renderInlineRef.current = false;\n              setRenderInline(false);\n            }\n          },\n          { root: optionsEl, threshold: 1 }\n        );\n\n        const resizeObserver = new ResizeObserver(entries => {\n          if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n            renderInlineRef.current = true;\n            setRenderInline(true);\n          }\n        });\n\n        intersectionObserver.observe(optionsEl.lastChild as Element);\n        resizeObserver.observe(optionsEl);\n\n        return () => {\n          intersectionObserver.disconnect();\n          resizeObserver.disconnect();\n        };\n      }\n    }, [optionsEl, inline, autoStack]);\n\n    const mapChildren = useMemo(\n      () =>\n        Children.map(children, child =>\n          cloneElement(child, {\n            name,\n            status: restProps.status,\n            disabled: disabled || child.props.disabled,\n            readOnly: readOnly || child.props.readOnly,\n            variant: variant === 'card-grid' ? 'card' : variant,\n            onChange: onChange\n              ? (e: ChangeEvent<HTMLInputElement>) => {\n                  if (!(readOnly || child.props.readOnly)) {\n                    child.props.onChange?.(e);\n                    onChange(e);\n                  }\n                }\n              : child.props.onChange\n          })\n        ),\n      [children, name, disabled, readOnly, variant, onChange]\n    );\n\n    return (\n      <FormField\n        testId={testIds}\n        as={StyledRadioCheckGroup}\n        labelAs='legend'\n        ref={containerRef}\n        name={name}\n        disabled={disabled}\n        required={required}\n        {...restProps}\n        isRadioCheck\n        onClear={onClear}\n      >\n        {variant === 'card-grid' ? (\n          <Grid\n            container={{\n              gap: 1,\n              cols: (() => {\n                if (!renderInline) return 'minmax(min-content, max-content)';\n                if (autoStack)\n                  return `repeat(auto-fit, minmax(min(100%, ${theme.base['content-width'].sm}), 1fr))`;\n                return `repeat(${Children.count(children)}, 1fr)`;\n              })(),\n              autoRows: '1fr'\n            }}\n          >\n            {mapChildren}\n          </Grid>\n        ) : (\n          <Flex\n            ref={setOptionsEl}\n            container={{\n              direction: renderInline ? 'row' : 'column',\n              colGap: renderInline ? 1.5 : 2,\n              rowGap: variant === 'card' ? 1 : 0,\n              wrap: 'wrap'\n            }}\n          >\n            {mapChildren}\n          </Flex>\n        )}\n      </FormField>\n    );\n  }\n);\n\nexport default withTestIds(RadioCheckGroup, getRadioCheckGroupTestIds);\n"]}
+{"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, Children, cloneElement, useState, useEffect, useRef, useMemo } from 'react';\nimport type {\n  Ref,\n  PropsWithoutRef,\n  ReactElement,\n  ChangeEvent,\n  MouseEvent as ReactMouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { RefElement, TestIdProp, WithAttributes } from '../../types';\nimport FormField from '../FormField';\nimport type { FormFieldProps } from '../FormField';\nimport { StyledFormField, StyledFormFieldInfo } from '../FormField/FormField';\nimport type { FormControlProps } from '../FormControl';\nimport type { RadioCheckProps } from '../RadioCheck';\nimport Flex from '../Flex';\nimport {\n  useArrows,\n  useConsolidatedRef,\n  useElement,\n  useTestIds,\n  useTheme,\n  useUID\n} from '../../hooks';\nimport Grid from '../Grid';\nimport {\n  StyledImageContainer,\n  StyledSelectionCard,\n  StyledSelectionCardInline\n} from '../SelectionCard/SelectionCard.styles';\nimport { getActiveElement, withTestIds } from '../../utils';\nimport type { elements } from '../FormField/FormField.test-ids';\nimport { StyledRadioCheck } from '../RadioCheck/RadioCheck';\n\nimport { getRadioCheckGroupTestIds } from './RadioCheckGroup.test-ids';\n\nexport type RadioCheckGroupProps = WithAttributes<\n  'fieldset',\n  TestIdProp<typeof elements> & {\n    /** Accepts Checkboxes or RadioButtons as children. */\n    children: ReactElement | ReactElement[];\n    /**\n     * Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n     * Additionally, onChange can be passed to individual children.\n     * Both handlers will be called, child followed by group.\n     */\n    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n    /** Callback invoked when the clear button is clicked. If provided will render the clear button. */\n    onClear?: FormFieldProps['onClear'];\n    /** Set visual state based on a validation state. */\n    status?: FormControlProps['status'];\n    /** Pass a string or a fragment with an Icon and string. */\n    label?: FormControlProps['label'];\n    /** Visually hides the label region. */\n    labelHidden?: FormControlProps['labelHidden'];\n    /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n    info?: FormControlProps['info'];\n    /** Indicate if the field is required. The browser defaults to false. */\n    required?: FormControlProps['required'];\n    /** Disable the control. The browser defaults to false. */\n    disabled?: FormControlProps['disabled'];\n    /** Makes the input non editable and non clickable. The browser defaults to false. */\n    readOnly?: FormControlProps['readOnly'];\n    /**\n     * Layout field elements inline in a row.\n     * @default false\n     */\n    inline?: FormFieldProps['inline'];\n    /** Used to toggle the auto stacking feature of an inlined group.\n     * @default true\n     */\n    autoStack?: boolean;\n    /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n    name?: FormControlProps['name'];\n    /**\n     * Controls the styling of the child RadioChecks.\n     * @default 'simple'\n     */\n    variant?: RadioCheckProps['variant'] | 'card-grid';\n    /** Pass a heading and content to show additional information on the field. */\n    additionalInfo?: FormControlProps['additionalInfo'];\n    /** Ref forwarded to the wrapping element. */\n    ref?: Ref<HTMLElement>;\n  }\n>;\n\nexport const StyledRadioCheckGroup = styled.fieldset(() => {\n  return css`\n    flex-wrap: nowrap;\n\n    &[disabled] {\n      > ${StyledFormField} {\n        opacity: unset;\n      }\n    }\n\n    ${StyledSelectionCard} {\n      max-width: 100%;\n    }\n\n    ${StyledSelectionCardInline} ${StyledImageContainer} {\n      /* To enlarge the image containers to the size of the biggest one */\n      min-height: 100%;\n    }\n\n    ${StyledRadioCheck} > ${StyledFormFieldInfo} {\n      display: none;\n    }\n  `;\n});\n\nconst RadioCheckGroup = forwardRef<\n  RefElement<RadioCheckGroupProps>,\n  PropsWithoutRef<RadioCheckGroupProps>\n>(function RadioCheckGroup(props, ref) {\n  const uid = useUID();\n  const {\n    testId,\n    children,\n    name = uid,\n    disabled = false,\n    required = false,\n    onChange,\n    readOnly,\n    inline = false,\n    autoStack = true,\n    variant = 'simple',\n    onClear,\n    ...restProps\n  } = props;\n\n  const testIds = useTestIds(testId, getRadioCheckGroupTestIds);\n  const theme = useTheme();\n  const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n  const [renderInline, setRenderInline] = useState(inline);\n  const renderInlineRef = useRef(inline);\n  const minInlineWidth = useRef(0);\n  const containerRef = useConsolidatedRef(ref);\n\n  useArrows(containerRef, {\n    selector: '[data-main-focus]',\n    cycle: false,\n    dir: 'left-right'\n  });\n\n  useEffect(() => {\n    setRenderInline(inline);\n    if (inline && optionsEl && optionsEl.lastChild && autoStack) {\n      const intersectionObserver = new IntersectionObserver(\n        entries => {\n          if (entries[0].intersectionRatio < 1) {\n            if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n            renderInlineRef.current = false;\n            setRenderInline(false);\n          }\n        },\n        { root: optionsEl, threshold: 1 }\n      );\n\n      const resizeObserver = new ResizeObserver(entries => {\n        if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n          renderInlineRef.current = true;\n          setRenderInline(true);\n        }\n      });\n\n      intersectionObserver.observe(optionsEl.lastChild as Element);\n      resizeObserver.observe(optionsEl);\n\n      return () => {\n        intersectionObserver.disconnect();\n        resizeObserver.disconnect();\n      };\n    }\n  }, [optionsEl, inline, autoStack]);\n\n  const mapChildren = useMemo(\n    () =>\n      Children.map(children, child =>\n        cloneElement(child, {\n          name,\n          status: restProps.status,\n          disabled: disabled || child.props.disabled,\n          readOnly: readOnly || child.props.readOnly,\n          variant: variant === 'card-grid' ? 'card' : variant,\n          onChange: onChange\n            ? (e: ChangeEvent<HTMLInputElement>) => {\n                if (!(readOnly || child.props.readOnly)) {\n                  child.props.onChange?.(e);\n                  onChange(e);\n                }\n              }\n            : child.props.onChange\n        })\n      ),\n    [children, name, disabled, readOnly, variant, onChange]\n  );\n\n  return (\n    <FormField\n      testId={testIds}\n      as={StyledRadioCheckGroup}\n      labelAs='legend'\n      ref={containerRef}\n      name={name}\n      disabled={disabled}\n      required={required}\n      {...restProps}\n      isRadioCheck\n      onClear={onClear}\n      // Prevents blur when any input within the group is actively focused.\n      onMouseDown={(e: ReactMouseEvent<HTMLFieldSetElement>) => {\n        restProps.onMouseDown?.(e);\n\n        if (!containerRef.current) return;\n\n        if (!containerRef.current.contains(getActiveElement())) return;\n\n        if (!(e.target instanceof Element) || !e.target.closest('label')) return;\n\n        e.preventDefault();\n      }}\n    >\n      {variant === 'card-grid' ? (\n        <Grid\n          container={{\n            gap: 1,\n            cols: (() => {\n              if (!renderInline) return 'minmax(min-content, max-content)';\n              if (autoStack)\n                return `repeat(auto-fit, minmax(min(100%, ${theme.base['content-width'].sm}), 1fr))`;\n              return `repeat(${Children.count(children)}, 1fr)`;\n            })(),\n            autoRows: '1fr'\n          }}\n        >\n          {mapChildren}\n        </Grid>\n      ) : (\n        <Flex\n          ref={setOptionsEl}\n          container={{\n            direction: renderInline ? 'row' : 'column',\n            colGap: renderInline ? 1.5 : 2,\n            rowGap: variant === 'card' ? 1 : 0,\n            wrap: 'wrap'\n          }}\n        >\n          {mapChildren}\n        </Flex>\n      )}\n    </FormField>\n  );\n});\n\nexport default withTestIds(RadioCheckGroup, getRadioCheckGroupTestIds);\n"]}

package/lib/components/SpeechToTextButton/SpeechToTextButton.d.ts

@@ -0,0 +1,13 @@
+import { type Ref } from 'react';
+import type { NoChildrenProp, TestIdProp, WithAttributes } from '../../types';
+export type SpeechToTextButtonProps = WithAttributes<'button', NoChildrenProp & TestIdProp & {
+    /** Whether voice to text is active */
+    active: boolean;
+    /** Ref to the element */
+    ref?: Ref<HTMLButtonElement>;
+}>;
+declare const _default: import("react").ForwardRefExoticComponent<Omit<SpeechToTextButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>> & {
+    getTestIds: (testIdProp?: TestIdProp["testId"]) => import("../../types").TestIdsRecord<readonly []>;
+};
+export default _default;
+//# sourceMappingURL=SpeechToTextButton.d.ts.map

package/lib/components/SpeechToTextButton/SpeechToTextButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpeechToTextButton.d.ts","sourceRoot":"","sources":["../../../src/components/SpeechToTextButton/SpeechToTextButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAMnE,OAAO,KAAK,EAAE,cAAc,EAAc,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAyB1F,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAClD,QAAQ,EACR,cAAc,GACZ,UAAU,GAAG;IACX,sCAAsC;IACtC,MAAM,EAAE,OAAO,CAAC;IAChB,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B,CACJ,CAAC;;;;AAyBF,wBAA6E"}

package/lib/components/SpeechToTextButton/SpeechToTextButton.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import styled, { css } from 'styled-components';
+import { mix } from 'polished';
+import * as micIcon from '../Icon/icons/send-solid.icon';
+import * as micSolidIcon from '../Icon/icons/square-solid.icon';
+import { useI18n, useTestIds } from '../../hooks';
+import Button from '../Button';
+import Icon, { registerIcon } from '../Icon';
+import { tryCatch, withTestIds } from '../../utils';
+import { defaultThemeProp } from '../../theme';
+import { getSpeechToTextButtonTestIds } from './SpeechToTextButton.test-ids';
+registerIcon(micIcon, micSolidIcon);
+const StyledSpeechToTextButton = styled(Button)(({ theme }) => {
+    const activeColor = tryCatch(() => mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive));
+    return css `
+    &[aria-pressed='true'] {
+      background-color: ${activeColor};
+    }
+  `;
+});
+StyledSpeechToTextButton.defaultProps = defaultThemeProp;
+const SpeechToTextButton = forwardRef(function SpeechToTextButton({ active, testId, ...restProps }, ref) {
+    const t = useI18n();
+    const testIds = useTestIds(testId, getSpeechToTextButtonTestIds);
+    return (_jsx(StyledSpeechToTextButton, { ref: ref, "data-testid": testIds.root, ...restProps, label: active ? t('stop_dictation') : t('dictate'), "aria-pressed": active, variant: 'simple', icon: true, children: _jsx(Icon, { name: active ? 'mic-solid' : 'mic' }) }));
+});
+export default withTestIds(SpeechToTextButton, getSpeechToTextButtonTestIds);
+//# sourceMappingURL=SpeechToTextButton.js.map

package/lib/components/SpeechToTextButton/SpeechToTextButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpeechToTextButton.js","sourceRoot":"","sources":["../../../src/components/SpeechToTextButton/SpeechToTextButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkC,MAAM,OAAO,CAAC;AACnE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,KAAK,OAAO,MAAM,+BAA+B,CAAC;AACzD,OAAO,KAAK,YAAY,MAAM,iCAAiC,CAAC;AAEhE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAC;AAE7E,YAAY,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;AAEpC,MAAM,wBAAwB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC5D,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,CAChC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CACpF,CAAC;IAEF,OAAO,GAAG,CAAA;;0BAEc,WAAW;;GAElC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAazD,MAAM,kBAAkB,GAAG,UAAU,CAGnC,SAAS,kBAAkB,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,SAAS,EAAE,EAAE,GAAG;IACjE,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,4BAA4B,CAAC,CAAC;IAEjE,OAAO,CACL,KAAC,wBAAwB,IACvB,GAAG,EAAE,GAAG,iBACK,OAAO,CAAC,IAAI,KACrB,SAAS,EACb,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,kBACpC,MAAM,EACpB,OAAO,EAAC,QAAQ,EAChB,IAAI,kBAEJ,KAAC,IAAI,IAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,GAAI,GACnB,CAC5B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC,kBAAkB,EAAE,4BAA4B,CAAC,CAAC","sourcesContent":["import { forwardRef, type PropsWithoutRef, type Ref } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport * as micIcon from '../Icon/icons/send-solid.icon';\nimport * as micSolidIcon from '../Icon/icons/square-solid.icon';\nimport type { NoChildrenProp, RefElement, TestIdProp, WithAttributes } from '../../types';\nimport { useI18n, useTestIds } from '../../hooks';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport { tryCatch, withTestIds } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\n\nimport { getSpeechToTextButtonTestIds } from './SpeechToTextButton.test-ids';\n\nregisterIcon(micIcon, micSolidIcon);\n\nconst StyledSpeechToTextButton = styled(Button)(({ theme }) => {\n  const activeColor = tryCatch(() =>\n    mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n  );\n\n  return css`\n    &[aria-pressed='true'] {\n      background-color: ${activeColor};\n    }\n  `;\n});\n\nStyledSpeechToTextButton.defaultProps = defaultThemeProp;\n\nexport type SpeechToTextButtonProps = WithAttributes<\n  'button',\n  NoChildrenProp &\n    TestIdProp & {\n      /** Whether voice to text is active */\n      active: boolean;\n      /** Ref to the element */\n      ref?: Ref<HTMLButtonElement>;\n    }\n>;\n\nconst SpeechToTextButton = forwardRef<\n  RefElement<SpeechToTextButtonProps>,\n  PropsWithoutRef<SpeechToTextButtonProps>\n>(function SpeechToTextButton({ active, testId, ...restProps }, ref) {\n  const t = useI18n();\n\n  const testIds = useTestIds(testId, getSpeechToTextButtonTestIds);\n\n  return (\n    <StyledSpeechToTextButton\n      ref={ref}\n      data-testid={testIds.root}\n      {...restProps}\n      label={active ? t('stop_dictation') : t('dictate')}\n      aria-pressed={active}\n      variant='simple'\n      icon\n    >\n      <Icon name={active ? 'mic-solid' : 'mic'} />\n    </StyledSpeechToTextButton>\n  );\n});\n\nexport default withTestIds(SpeechToTextButton, getSpeechToTextButtonTestIds);\n"]}

package/lib/components/SpeechToTextButton/SpeechToTextButton.test-ids.d.ts

@@ -0,0 +1,2 @@
+export declare const getSpeechToTextButtonTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly []>;
+//# sourceMappingURL=SpeechToTextButton.test-ids.d.ts.map

package/lib/components/SpeechToTextButton/SpeechToTextButton.test-ids.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpeechToTextButton.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/SpeechToTextButton/SpeechToTextButton.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,4BAA4B,mGAAsD,CAAC"}

package/lib/components/SpeechToTextButton/SpeechToTextButton.test-ids.js

@@ -0,0 +1,3 @@
+import { createTestIds } from '../../utils';
+export const getSpeechToTextButtonTestIds = createTestIds('speech-to-text-button', []);
+//# sourceMappingURL=SpeechToTextButton.test-ids.js.map

package/lib/components/SpeechToTextButton/SpeechToTextButton.test-ids.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpeechToTextButton.test-ids.js","sourceRoot":"","sources":["../../../src/components/SpeechToTextButton/SpeechToTextButton.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,MAAM,CAAC,MAAM,4BAA4B,GAAG,aAAa,CAAC,uBAAuB,EAAE,EAAW,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\n\nexport const getSpeechToTextButtonTestIds = createTestIds('speech-to-text-button', [] as const);\n"]}

package/lib/components/SpeechToTextButton/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './SpeechToTextButton';
+export type { SpeechToTextButtonProps } from './SpeechToTextButton';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/SpeechToTextButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SpeechToTextButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC"}

package/lib/components/SpeechToTextButton/index.js

@@ -0,0 +1,2 @@
+export { default } from './SpeechToTextButton';
+//# sourceMappingURL=index.js.map

package/lib/components/SpeechToTextButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SpeechToTextButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC","sourcesContent":["export { default } from './SpeechToTextButton';\nexport type { SpeechToTextButtonProps } from './SpeechToTextButton';\n"]}

package/lib/hooks/index.d.ts

@@ -30,6 +30,7 @@ export { default as useRefMap } from './useRefMap';
 export { default as useSimpleStore, createSimpleStore } from './useSimpleStore';
 export type { SimpleStore } from './useSimpleStore';
 export { default as useSimpleStoreInstance } from './useSimpleStoreInstance';
+export { default as useSpeechRecognition } from './useSpeechRecognition';
 export { default as useScrollStick } from './useScrollStick';
 export { default as useScrollToggle } from './useScrollToggle';
 export { default as useShortcut } from './useShortcut';

package/lib/hooks/index.d.ts.map

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

package/lib/hooks/index.js

@@ -28,6 +28,7 @@ export { default as usePrevious } from './usePrevious';
 export { default as useRefMap } from './useRefMap';
 export { default as useSimpleStore, createSimpleStore } from './useSimpleStore';
 export { default as useSimpleStoreInstance } from './useSimpleStoreInstance';
+export { default as useSpeechRecognition } from './useSpeechRecognition';
 export { default as useScrollStick } from './useScrollStick';
 export { default as useScrollToggle } from './useScrollToggle';
 export { default as useShortcut } from './useShortcut';

package/lib/hooks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"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","sourcesContent":["export { default as useActiveDescendant, useLazyDescendant } from './useActiveDescendant';\nexport type { UseActiveDescendantConfig } from './useActiveDescendant';\nexport { default as useAfterInitialEffect } from './useAfterInitialEffect';\nexport { default as useAnimatedText } from './useAnimatedText';\nexport { default as useArrows } from './useArrows';\nexport { default as useAutoResize } from './useAutoResize';\nexport { default as useBreakpoint } from './useBreakpoint';\nexport { default as useChToPxConversionFactor } from './useChToPxConversionFactor';\nexport { default as useConfiguration } from './useConfiguration';\nexport { default as useConsolidatedRef } from './useConsolidatedRef';\nexport { default as useDirection } from './useDirection';\nexport { default as useDraggable } from './useDraggable';\nexport { default as useElement } from './useElement';\nexport { default as useEscape } from './useEscape';\nexport { default as useEvent } from './useEvent';\nexport { default as useFocusTrap } from './useFocusTrap';\nexport { default as useFocusWithin } from './useFocusWithin';\nexport { default as useI18n } from './useI18n';\nexport { default as useInputFormatter } from './useInputFormatter';\nexport { default as useItemIntersection } from './useItemIntersection';\nexport { default as useLiveLog } from './useLiveLog';\nexport { default as useLongPress } from './useLongPress';\nexport { default as useModalContext } from './useModalContext';\nexport { default as useModalManager } from './useModalManager';\nexport { default as useOS } from './useOS';\nexport { default as useOuterEvent } from './useOuterEvent';\nexport { default as usePopoverMap } from './usePopoverMap';\nexport { default as usePrevious } from './usePrevious';\nexport { default as useRefMap } from './useRefMap';\nexport { default as useSimpleStore, createSimpleStore } from './useSimpleStore';\nexport type { SimpleStore } from './useSimpleStore';\nexport { default as useSimpleStoreInstance } from './useSimpleStoreInstance';\nexport { default as useScrollStick } from './useScrollStick';\nexport { default as useScrollToggle } from './useScrollToggle';\nexport { default as useShortcut } from './useShortcut';\nexport { default as useShortcutManager } from './useShortcutManager';\nexport { default as useTestIds } from './useTestIds';\nexport { default as useTheme } from './useTheme';\nexport { default as useToaster } from './useToaster';\nexport { default as useTransitionState } from './useTransitionState';\nexport { default as useTriggerableEffect } from './useTriggerableEffect';\nexport { default as useElementFocus } from './useElementFocus';\nexport { default as useTriggerableLayoutEffect } from './useTriggerableLayoutEffect';\nexport { default as useUID } from './useUID';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"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","sourcesContent":["export { default as useActiveDescendant, useLazyDescendant } from './useActiveDescendant';\nexport type { UseActiveDescendantConfig } from './useActiveDescendant';\nexport { default as useAfterInitialEffect } from './useAfterInitialEffect';\nexport { default as useAnimatedText } from './useAnimatedText';\nexport { default as useArrows } from './useArrows';\nexport { default as useAutoResize } from './useAutoResize';\nexport { default as useBreakpoint } from './useBreakpoint';\nexport { default as useChToPxConversionFactor } from './useChToPxConversionFactor';\nexport { default as useConfiguration } from './useConfiguration';\nexport { default as useConsolidatedRef } from './useConsolidatedRef';\nexport { default as useDirection } from './useDirection';\nexport { default as useDraggable } from './useDraggable';\nexport { default as useElement } from './useElement';\nexport { default as useEscape } from './useEscape';\nexport { default as useEvent } from './useEvent';\nexport { default as useFocusTrap } from './useFocusTrap';\nexport { default as useFocusWithin } from './useFocusWithin';\nexport { default as useI18n } from './useI18n';\nexport { default as useInputFormatter } from './useInputFormatter';\nexport { default as useItemIntersection } from './useItemIntersection';\nexport { default as useLiveLog } from './useLiveLog';\nexport { default as useLongPress } from './useLongPress';\nexport { default as useModalContext } from './useModalContext';\nexport { default as useModalManager } from './useModalManager';\nexport { default as useOS } from './useOS';\nexport { default as useOuterEvent } from './useOuterEvent';\nexport { default as usePopoverMap } from './usePopoverMap';\nexport { default as usePrevious } from './usePrevious';\nexport { default as useRefMap } from './useRefMap';\nexport { default as useSimpleStore, createSimpleStore } from './useSimpleStore';\nexport type { SimpleStore } from './useSimpleStore';\nexport { default as useSimpleStoreInstance } from './useSimpleStoreInstance';\nexport { default as useSpeechRecognition } from './useSpeechRecognition';\nexport { default as useScrollStick } from './useScrollStick';\nexport { default as useScrollToggle } from './useScrollToggle';\nexport { default as useShortcut } from './useShortcut';\nexport { default as useShortcutManager } from './useShortcutManager';\nexport { default as useTestIds } from './useTestIds';\nexport { default as useTheme } from './useTheme';\nexport { default as useToaster } from './useToaster';\nexport { default as useTransitionState } from './useTransitionState';\nexport { default as useTriggerableEffect } from './useTriggerableEffect';\nexport { default as useElementFocus } from './useElementFocus';\nexport { default as useTriggerableLayoutEffect } from './useTriggerableLayoutEffect';\nexport { default as useUID } from './useUID';\n"]}

package/lib/hooks/useAnimatedText.d.ts

@@ -1,11 +1,13 @@
-declare const useAnimatedText: ({ text, allContentReceived, enabled, tokenizeMarkdown }: {
+declare const useAnimatedText: ({ text, allContentReceived, enabled, tokenizeMarkdown, cursorStartIndex }: {
     text: string;
     allContentReceived: boolean;
     enabled?: boolean;
     tokenizeMarkdown?: boolean;
+    cursorStartIndex?: number;
 }) => {
     text: string;
     isAnimationDone: boolean;
+    animatedTillCursor: number;
 };
 export default useAnimatedText;
 //# sourceMappingURL=useAnimatedText.d.ts.map

package/lib/hooks/useAnimatedText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAnimatedText.d.ts","sourceRoot":"","sources":["../../src/hooks/useAnimatedText.ts"],"names":[],"mappings":"AAIA,QAAA,MAAM,eAAe,GAAI,yDAKtB;IACD,IAAI,EAAE,MAAM,CAAC;IACb,kBAAkB,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;;;CAiHA,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"useAnimatedText.d.ts","sourceRoot":"","sources":["../../src/hooks/useAnimatedText.ts"],"names":[],"mappings":"AAIA,QAAA,MAAM,eAAe,GAAI,2EAMtB;IACD,IAAI,EAAE,MAAM,CAAC;IACb,kBAAkB,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;;;;CAwHA,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/hooks/useAnimatedText.js

@@ -1,6 +1,6 @@
 import { useEffect, useState, useRef } from 'react';
 import tokenizeWithMarkdown from '../utils/markdownTokenizer';
-const useAnimatedText = ({ text, allContentReceived = false, enabled = true, tokenizeMarkdown = false }) => {
+const useAnimatedText = ({ text, allContentReceived = false, enabled = true, tokenizeMarkdown = false, cursorStartIndex }) => {
     const [cursor, setCursor] = useState(0); // End pointer
     const [startingCursor, setStartingCursor] = useState(0); // animation starting point
     const [prevText, setPrevText] = useState(text);
@@ -20,6 +20,11 @@ const useAnimatedText = ({ text, allContentReceived = false, enabled = true, tok
         setStartingCursor(text.startsWith(prevText) ? cursor : 0);
         setIsAnimationDone(false);
     }
+    useEffect(() => {
+        if (cursorStartIndex) {
+            setStartingCursor(cursorStartIndex);
+        }
+    }, []);
     useEffect(() => {
         // If streaming is disabled just return the whole chunk back
         if (!enabled) {
@@ -42,7 +47,7 @@ const useAnimatedText = ({ text, allContentReceived = false, enabled = true, tok
         let intervalId;
         let startTime;
         let isStopped = false;
-        let currentSpeed = 50; // Start with normal speed
+        let currentSpeed = 100; // Start with normal speed
         let lastCursor = startingCursor;
         const processTextAnimation = () => {
             if (isStopped)
@@ -52,7 +57,7 @@ const useAnimatedText = ({ text, allContentReceived = false, enabled = true, tok
                 startTime = currentTime;
             }
             // When we have all content with us, speed up streaming animation
-            const targetSpeed = allContentReceivedRef.current ? 150 : 50;
+            const targetSpeed = allContentReceivedRef.current ? 150 : 100;
             // Smoothly transition to target speed
             const speedDiff = targetSpeed - currentSpeed;
             currentSpeed += speedDiff * 0.1; // Smooth transition
@@ -89,7 +94,8 @@ const useAnimatedText = ({ text, allContentReceived = false, enabled = true, tok
     }, [startingCursor, text, tokenizeMarkdown]);
     return {
         text: getTokens(text).slice(0, cursor).join(''),
-        isAnimationDone
+        isAnimationDone,
+        animatedTillCursor: cursor
     };
 };
 export default useAnimatedText;

package/lib/hooks/useAnimatedText.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAnimatedText.js","sourceRoot":"","sources":["../../src/hooks/useAnimatedText.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,oBAAoB,MAAM,4BAA4B,CAAC;AAE9D,MAAM,eAAe,GAAG,CAAC,EACvB,IAAI,EACJ,kBAAkB,GAAG,KAAK,EAC1B,OAAO,GAAG,IAAI,EACd,gBAAgB,GAAG,KAAK,EAMzB,EAAE,EAAE;IACH,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,cAAc;IACvD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,2BAA2B;IAEpF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC/C,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9D,MAAM,qBAAqB,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAC;IAEzD,qBAAqB,CAAC,OAAO,GAAG,kBAAkB,CAAC;IAEnD,uCAAuC;IACvC,MAAM,SAAS,GAAG,CAAC,SAAiB,EAAY,EAAE;QAChD,IAAI,gBAAgB,EAAE,CAAC;YACrB,OAAO,oBAAoB,CAAC,SAAS,CAAC,CAAC;QACzC,CAAC;QACD,OAAO,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,0BAA0B;IAC1B,IAAI,QAAQ,KAAK,IAAI,EAAE,CAAC;QACtB,WAAW,CAAC,IAAI,CAAC,CAAC;QAClB,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC1D,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC;IAED,SAAS,CAAC,GAAG,EAAE;QACb,4DAA4D;QAC5D,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC;YAClC,kBAAkB,CAAC,IAAI,CAAC,CAAC;YACzB,OAAO;QACT,CAAC;QAED,MAAM,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC;QAC/B,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC;QACnC,MAAM,mBAAmB,GAAG,YAAY,GAAG,cAAc,CAAC;QAE1D,6CAA6C;QAC7C,IAAI,mBAAmB,IAAI,CAAC,EAAE,CAAC;YAC7B,SAAS,CAAC,YAAY,CAAC,CAAC;YACxB,mFAAmF;YACnF,IAAI,qBAAqB,CAAC,OAAO,EAAE,CAAC;gBAClC,kBAAkB,CAAC,IAAI,CAAC,CAAC;YAC3B,CAAC;YACD,OAAO;QACT,CAAC;QAED,IAAI,UAAyC,CAAC;QAC9C,IAAI,SAAiB,CAAC;QACtB,IAAI,SAAS,GAAG,KAAK,CAAC;QACtB,IAAI,YAAY,GAAG,EAAE,CAAC,CAAC,0BAA0B;QACjD,IAAI,UAAU,GAAG,cAAc,CAAC;QAEhC,MAAM,oBAAoB,GAAG,GAAG,EAAE;YAChC,IAAI,SAAS;gBAAE,OAAO;YAEtB,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC;YAEtC,IAAI,CAAC,SAAS,EAAE,CAAC;gBACf,SAAS,GAAG,WAAW,CAAC;YAC1B,CAAC;YAED,iEAAiE;YACjE,MAAM,WAAW,GAAG,qBAAqB,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;YAE7D,sCAAsC;YACtC,MAAM,SAAS,GAAG,WAAW,GAAG,YAAY,CAAC;YAC7C,YAAY,IAAI,SAAS,GAAG,GAAG,CAAC,CAAC,oBAAoB;YAErD,MAAM,OAAO,GAAG,WAAW,GAAG,SAAS,CAAC;YACxC,MAAM,QAAQ,GAAG,OAAO,GAAG,IAAI,CAAC;YAEhC,4DAA4D;YAC5D,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,GAAG,QAAQ,GAAG,YAAY,EAAE,YAAY,CAAC,CAAC;YAExF,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,EAAE,YAAY,CAAC,CAAC;YAErE,iDAAiD;YACjD,IAAI,SAAS,KAAK,UAAU,EAAE,CAAC;gBAC7B,SAAS,CAAC,SAAS,CAAC,CAAC;gBACrB,UAAU,GAAG,SAAS,CAAC;YACzB,CAAC;YAED,gDAAgD;YAChD,IAAI,SAAS,IAAI,YAAY,IAAI,qBAAqB,CAAC,OAAO,EAAE,CAAC;gBAC/D,kBAAkB,CAAC,IAAI,CAAC,CAAC;gBACzB,OAAO;YACT,CAAC;YAED,iCAAiC;YACjC,IAAI,SAAS,GAAG,YAAY,IAAI,CAAC,qBAAqB,CAAC,OAAO,EAAE,CAAC;gBAC/D,4DAA4D;gBAC5D,MAAM,QAAQ,GAAG,qBAAqB,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,uBAAuB;gBACjF,UAAU,GAAG,UAAU,CAAC,oBAAoB,EAAE,QAAQ,CAAC,CAAC;YAC1D,CAAC;QACH,CAAC,CAAC;QAEF,yCAAyC;QACzC,UAAU,GAAG,UAAU,CAAC,oBAAoB,EAAE,EAAE,CAAC,CAAC;QAElD,OAAO,GAAG,EAAE;YACV,SAAS,GAAG,IAAI,CAAC;YACjB,IAAI,UAAU,EAAE,CAAC;gBACf,YAAY,CAAC,UAAU,CAAC,CAAC;YAC3B,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,cAAc,EAAE,IAAI,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAE7C,OAAO;QACL,IAAI,EAAE,SAAS,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;QAC/C,eAAe;KAChB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\nimport tokenizeWithMarkdown from '../utils/markdownTokenizer';\n\nconst useAnimatedText = ({\n  text,\n  allContentReceived = false,\n  enabled = true,\n  tokenizeMarkdown = false\n}: {\n  text: string;\n  allContentReceived: boolean;\n  enabled?: boolean;\n  tokenizeMarkdown?: boolean;\n}) => {\n  const [cursor, setCursor] = useState(0); // End pointer\n  const [startingCursor, setStartingCursor] = useState(0); // animation starting point\n\n  const [prevText, setPrevText] = useState(text);\n  const [isAnimationDone, setIsAnimationDone] = useState(false);\n\n  const allContentReceivedRef = useRef(allContentReceived);\n\n  allContentReceivedRef.current = allContentReceived;\n\n  // Tokenize text based on markdown flag\n  const getTokens = (inputText: string): string[] => {\n    if (tokenizeMarkdown) {\n      return tokenizeWithMarkdown(inputText);\n    }\n    return inputText.split('');\n  };\n\n  // A new chunk has arrived\n  if (prevText !== text) {\n    setPrevText(text);\n    setStartingCursor(text.startsWith(prevText) ? cursor : 0);\n    setIsAnimationDone(false);\n  }\n\n  useEffect(() => {\n    // If streaming is disabled just return the whole chunk back\n    if (!enabled) {\n      setCursor(getTokens(text).length);\n      setIsAnimationDone(true);\n      return;\n    }\n\n    const tokens = getTokens(text);\n    const targetLength = tokens.length;\n    const charactersToAnimate = targetLength - startingCursor;\n\n    // If there are no more characters to animate\n    if (charactersToAnimate <= 0) {\n      setCursor(targetLength);\n      // Only set animation done if we have all content AND no more characters to animate\n      if (allContentReceivedRef.current) {\n        setIsAnimationDone(true);\n      }\n      return;\n    }\n\n    let intervalId: ReturnType<typeof setTimeout>;\n    let startTime: number;\n    let isStopped = false;\n    let currentSpeed = 50; // Start with normal speed\n    let lastCursor = startingCursor;\n\n    const processTextAnimation = () => {\n      if (isStopped) return;\n\n      const currentTime = performance.now();\n\n      if (!startTime) {\n        startTime = currentTime;\n      }\n\n      // When we have all content with us, speed up streaming animation\n      const targetSpeed = allContentReceivedRef.current ? 150 : 50;\n\n      // Smoothly transition to target speed\n      const speedDiff = targetSpeed - currentSpeed;\n      currentSpeed += speedDiff * 0.1; // Smooth transition\n\n      const elapsed = currentTime - startTime;\n      const timeStep = elapsed / 1000;\n\n      // Calculate how many characters we should have shown by now\n      const expectedCursor = Math.min(startingCursor + timeStep * currentSpeed, targetLength);\n\n      const newCursor = Math.min(Math.floor(expectedCursor), targetLength);\n\n      // Skip update if the cursor is at the same token\n      if (newCursor !== lastCursor) {\n        setCursor(newCursor);\n        lastCursor = newCursor;\n      }\n\n      // End condition - stop when we reach the target\n      if (newCursor >= targetLength && allContentReceivedRef.current) {\n        setIsAnimationDone(true);\n        return;\n      }\n\n      // Continue animation if not done\n      if (newCursor < targetLength || !allContentReceivedRef.current) {\n        // Use adaptive timing based on content state and visibility\n        const interval = allContentReceivedRef.current ? 20 : 50; // Faster when complete\n        intervalId = setTimeout(processTextAnimation, interval);\n      }\n    };\n\n    // Start the animation with initial delay\n    intervalId = setTimeout(processTextAnimation, 16);\n\n    return () => {\n      isStopped = true;\n      if (intervalId) {\n        clearTimeout(intervalId);\n      }\n    };\n  }, [startingCursor, text, tokenizeMarkdown]);\n\n  return {\n    text: getTokens(text).slice(0, cursor).join(''),\n    isAnimationDone\n  };\n};\n\nexport default useAnimatedText;\n"]}
+{"version":3,"file":"useAnimatedText.js","sourceRoot":"","sources":["../../src/hooks/useAnimatedText.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\nimport tokenizeWithMarkdown from '../utils/markdownTokenizer';\n\nconst useAnimatedText = ({\n  text,\n  allContentReceived = false,\n  enabled = true,\n  tokenizeMarkdown = false,\n  cursorStartIndex\n}: {\n  text: string;\n  allContentReceived: boolean;\n  enabled?: boolean;\n  tokenizeMarkdown?: boolean;\n  cursorStartIndex?: number;\n}) => {\n  const [cursor, setCursor] = useState(0); // End pointer\n  const [startingCursor, setStartingCursor] = useState(0); // animation starting point\n\n  const [prevText, setPrevText] = useState(text);\n  const [isAnimationDone, setIsAnimationDone] = useState(false);\n\n  const allContentReceivedRef = useRef(allContentReceived);\n\n  allContentReceivedRef.current = allContentReceived;\n\n  // Tokenize text based on markdown flag\n  const getTokens = (inputText: string): string[] => {\n    if (tokenizeMarkdown) {\n      return tokenizeWithMarkdown(inputText);\n    }\n    return inputText.split('');\n  };\n\n  // A new chunk has arrived\n  if (prevText !== text) {\n    setPrevText(text);\n    setStartingCursor(text.startsWith(prevText) ? cursor : 0);\n    setIsAnimationDone(false);\n  }\n\n  useEffect(() => {\n    if (cursorStartIndex) {\n      setStartingCursor(cursorStartIndex);\n    }\n  }, []);\n\n  useEffect(() => {\n    // If streaming is disabled just return the whole chunk back\n    if (!enabled) {\n      setCursor(getTokens(text).length);\n      setIsAnimationDone(true);\n      return;\n    }\n\n    const tokens = getTokens(text);\n    const targetLength = tokens.length;\n    const charactersToAnimate = targetLength - startingCursor;\n\n    // If there are no more characters to animate\n    if (charactersToAnimate <= 0) {\n      setCursor(targetLength);\n      // Only set animation done if we have all content AND no more characters to animate\n      if (allContentReceivedRef.current) {\n        setIsAnimationDone(true);\n      }\n      return;\n    }\n\n    let intervalId: ReturnType<typeof setTimeout>;\n    let startTime: number;\n    let isStopped = false;\n    let currentSpeed = 100; // Start with normal speed\n    let lastCursor = startingCursor;\n\n    const processTextAnimation = () => {\n      if (isStopped) return;\n\n      const currentTime = performance.now();\n\n      if (!startTime) {\n        startTime = currentTime;\n      }\n\n      // When we have all content with us, speed up streaming animation\n      const targetSpeed = allContentReceivedRef.current ? 150 : 100;\n\n      // Smoothly transition to target speed\n      const speedDiff = targetSpeed - currentSpeed;\n      currentSpeed += speedDiff * 0.1; // Smooth transition\n\n      const elapsed = currentTime - startTime;\n      const timeStep = elapsed / 1000;\n\n      // Calculate how many characters we should have shown by now\n      const expectedCursor = Math.min(startingCursor + timeStep * currentSpeed, targetLength);\n\n      const newCursor = Math.min(Math.floor(expectedCursor), targetLength);\n\n      // Skip update if the cursor is at the same token\n      if (newCursor !== lastCursor) {\n        setCursor(newCursor);\n        lastCursor = newCursor;\n      }\n\n      // End condition - stop when we reach the target\n      if (newCursor >= targetLength && allContentReceivedRef.current) {\n        setIsAnimationDone(true);\n        return;\n      }\n\n      // Continue animation if not done\n      if (newCursor < targetLength || !allContentReceivedRef.current) {\n        // Use adaptive timing based on content state and visibility\n        const interval = allContentReceivedRef.current ? 20 : 50; // Faster when complete\n        intervalId = setTimeout(processTextAnimation, interval);\n      }\n    };\n\n    // Start the animation with initial delay\n    intervalId = setTimeout(processTextAnimation, 16);\n\n    return () => {\n      isStopped = true;\n      if (intervalId) {\n        clearTimeout(intervalId);\n      }\n    };\n  }, [startingCursor, text, tokenizeMarkdown]);\n\n  return {\n    text: getTokens(text).slice(0, cursor).join(''),\n    isAnimationDone,\n    animatedTillCursor: cursor\n  };\n};\n\nexport default useAnimatedText;\n"]}

package/lib/hooks/useI18n.d.ts

@@ -96,6 +96,12 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     reset: string;
     refresh: string;
     copy: string;
+    explain: string;
+    generate: string;
+    reject: string;
+    modify: string;
+    start: string;
+    stop: string;
     view_all: string;
     view_less: string;
     show_more: string;
@@ -402,6 +408,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     double_checking_results: string;
     finalizing_response: string;
     response_generated: string;
+    processing_speech: string;
     good_response: string;
     bad_response: string;
     share_feedback: string;
@@ -436,6 +443,13 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     shortcut_DismissToast: string;
     configurable_layout_instructions: string;
     page_number: string;
+    dictate: string;
+    stop_dictation: string;
+    no_speech_detected: string;
+    no_microphone_found: string;
+    microphone_access_denied: string;
+    speech_recognition_error: string;
+    speech_recognition_not_supported: string;
     drag_handle_activate_description: string;
     drag_handle_drop_description: string;
     drag_handle_cancel_description: string;

package/lib/hooks/useI18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/hooks/useSpeechRecognition.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="dom-speech-recognition" preserve="true" />
+/**
+ * Hook for speech-to-text conversion using the Web Speech API.
+ * Provides real-time voice recognition with support for interim results and automatic error handling.
+ */
+export interface UseSpeechRecognitionProps {
+    /** onResult handler */
+    onResult: (text: string) => void;
+    /** onInterimResult handler */
+    onInterimResult?: (text: string) => void;
+    /** BCP 47 language tag */
+    langCode?: string;
+}
+export default function useSpeechRecognition({ onResult, onInterimResult, langCode }: UseSpeechRecognitionProps): {
+    supported: boolean;
+    active: boolean;
+    error: string | null;
+    start: () => void;
+    stop: () => void;
+};
+//# sourceMappingURL=useSpeechRecognition.d.ts.map

package/lib/hooks/useSpeechRecognition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSpeechRecognition.d.ts","sourceRoot":"","sources":["../../src/hooks/useSpeechRecognition.ts"],"names":[],"mappings":";AAMA;;;GAGG;AAEH,MAAM,WAAW,yBAAyB;IACxC,uBAAuB;IACvB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,8BAA8B;IAC9B,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,QAAQ,EACR,eAAe,EACf,QAAwC,EACzC,EAAE,yBAAyB,GAAG;IAC7B,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CA2JA"}

package/lib/hooks/useSpeechRecognition.js

@@ -0,0 +1,122 @@
+/// <reference types="dom-speech-recognition" preserve="true" />
+import { useCallback, useEffect, useRef, useState } from 'react';
+import useI18n from './useI18n';
+export default function useSpeechRecognition({ onResult, onInterimResult, langCode = navigator.language ?? 'en-US' }) {
+    const SpeechRecognitionAPI = window.SpeechRecognition ?? window.webkitSpeechRecognition;
+    const supported = !!SpeechRecognitionAPI;
+    const t = useI18n();
+    const [active, setActive] = useState(false);
+    const [error, setError] = useState(null);
+    const speechRecognitionRef = useRef(null);
+    const speechRecognitionACRef = useRef(new AbortController());
+    const onResultACRef = useRef(new AbortController());
+    const keepListeningRef = useRef(false);
+    const handleResult = useCallback((event) => {
+        let nextValue = '';
+        for (let i = event.resultIndex; i < event.results.length; i += 1) {
+            const result = event.results[i];
+            const processed = result[0].transcript;
+            nextValue += processed;
+            if (result.isFinal) {
+                onResult(nextValue);
+            }
+            else {
+                onInterimResult?.(nextValue);
+            }
+        }
+    }, [onResult, onInterimResult]);
+    useEffect(() => {
+        if (!speechRecognitionRef.current)
+            return;
+        onResultACRef.current.abort();
+        onResultACRef.current = new AbortController();
+        speechRecognitionRef.current.addEventListener('result', handleResult, {
+            signal: AbortSignal.any([speechRecognitionACRef.current.signal, onResultACRef.current.signal])
+        });
+    }, [handleResult]);
+    const startRecognition = useCallback(() => {
+        if (!supported)
+            return;
+        // abort previous listeners/session
+        speechRecognitionACRef.current.abort();
+        speechRecognitionACRef.current = new AbortController();
+        const recognition = new SpeechRecognitionAPI();
+        recognition.lang = langCode;
+        recognition.interimResults = true;
+        recognition.maxAlternatives = 1;
+        recognition.continuous = true;
+        recognition.addEventListener('start', () => {
+            setActive(true);
+            setError(null);
+        }, { signal: speechRecognitionACRef.current.signal });
+        recognition.addEventListener('result', handleResult, {
+            signal: AbortSignal.any([speechRecognitionACRef.current.signal, onResultACRef.current.signal])
+        });
+        recognition.addEventListener('error', event => {
+            if (event.error === 'no-speech') {
+                setError(t('no_speech_detected'));
+            }
+            else if (event.error === 'audio-capture') {
+                setError(t('no_microphone_found'));
+            }
+            else if (event.error === 'not-allowed') {
+                setError(t('microphone_access_denied'));
+            }
+            else {
+                setError(t('speech_recognition_error', [event.error]));
+            }
+            setActive(false);
+        }, { signal: speechRecognitionACRef.current.signal });
+        recognition.addEventListener('end', () => {
+            if (keepListeningRef.current) {
+                startRecognition();
+            }
+            else {
+                setActive(false);
+            }
+        }, { signal: speechRecognitionACRef.current.signal });
+        speechRecognitionRef.current = recognition;
+        recognition.start();
+    }, [SpeechRecognitionAPI, langCode, t, handleResult, supported]);
+    const stop = useCallback(() => {
+        keepListeningRef.current = false;
+        const recognition = speechRecognitionRef.current;
+        if (!recognition) {
+            setActive(false);
+            return;
+        }
+        recognition.stop();
+    }, []);
+    const start = useCallback(() => {
+        setError(null);
+        if (!supported) {
+            setError(t('speech_recognition_not_supported'));
+            return;
+        }
+        keepListeningRef.current = true;
+        startRecognition();
+    }, [startRecognition, supported, t]);
+    // Stop recognition on page hide or visibility change
+    useEffect(() => {
+        const ac = new AbortController();
+        const handleVisibilityChange = () => {
+            if (document.visibilityState !== 'visible') {
+                stop();
+            }
+        };
+        window.addEventListener('pagehide', stop, { signal: ac.signal });
+        window.addEventListener('blur', stop, { signal: ac.signal });
+        document.addEventListener('visibilitychange', handleVisibilityChange, { signal: ac.signal });
+        return () => {
+            ac.abort();
+        };
+    }, []);
+    return {
+        supported,
+        active,
+        error,
+        start,
+        stop
+    };
+}
+//# sourceMappingURL=useSpeechRecognition.js.map

package/lib/hooks/useSpeechRecognition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSpeechRecognition.js","sourceRoot":"","sources":["../../src/hooks/useSpeechRecognition.ts"],"names":[],"mappings":"AAAA,gEAAgE;AAEhE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjE,OAAO,OAAO,MAAM,WAAW,CAAC;AAgBhC,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,QAAQ,EACR,eAAe,EACf,QAAQ,GAAG,SAAS,CAAC,QAAQ,IAAI,OAAO,EACd;IAO1B,MAAM,oBAAoB,GACxB,MAAM,CAAC,iBAAiB,IAAI,MAAM,CAAC,uBAAuB,CAAC;IAE7D,MAAM,SAAS,GAAG,CAAC,CAAC,oBAAoB,CAAC;IAEzC,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAExD,MAAM,oBAAoB,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAC;IACpE,MAAM,sBAAsB,GAAG,MAAM,CAAC,IAAI,eAAe,EAAE,CAAC,CAAC;IAC7D,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,eAAe,EAAE,CAAC,CAAC;IACpD,MAAM,gBAAgB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAC;IAEhD,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,KAA6B,EAAE,EAAE;QAChC,IAAI,SAAS,GAAG,EAAE,CAAC;QAEnB,KAAK,IAAI,CAAC,GAAG,KAAK,CAAC,WAAW,EAAE,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC;YACjE,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YAChC,MAAM,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;YACvC,SAAS,IAAI,SAAS,CAAC;YAEvB,IAAI,MAAM,CAAC,OAAO,EAAE,CAAC;gBACnB,QAAQ,CAAC,SAAS,CAAC,CAAC;YACtB,CAAC;iBAAM,CAAC;gBACN,eAAe,EAAE,CAAC,SAAS,CAAC,CAAC;YAC/B,CAAC;QACH,CAAC;IACH,CAAC,EACD,CAAC,QAAQ,EAAE,eAAe,CAAC,CAC5B,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,oBAAoB,CAAC,OAAO;YAAE,OAAO;QAE1C,aAAa,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;QAC9B,aAAa,CAAC,OAAO,GAAG,IAAI,eAAe,EAAE,CAAC;QAE9C,oBAAoB,CAAC,OAAO,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,EAAE;YACpE,MAAM,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC,sBAAsB,CAAC,OAAO,CAAC,MAAM,EAAE,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;SAC/F,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,gBAAgB,GAAG,WAAW,CAAC,GAAG,EAAE;QACxC,IAAI,CAAC,SAAS;YAAE,OAAO;QAEvB,mCAAmC;QACnC,sBAAsB,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;QACvC,sBAAsB,CAAC,OAAO,GAAG,IAAI,eAAe,EAAE,CAAC;QAEvD,MAAM,WAAW,GAAG,IAAI,oBAAoB,EAAE,CAAC;QAC/C,WAAW,CAAC,IAAI,GAAG,QAAQ,CAAC;QAC5B,WAAW,CAAC,cAAc,GAAG,IAAI,CAAC;QAClC,WAAW,CAAC,eAAe,GAAG,CAAC,CAAC;QAChC,WAAW,CAAC,UAAU,GAAG,IAAI,CAAC;QAE9B,WAAW,CAAC,gBAAgB,CAC1B,OAAO,EACP,GAAG,EAAE;YACH,SAAS,CAAC,IAAI,CAAC,CAAC;YAChB,QAAQ,CAAC,IAAI,CAAC,CAAC;QACjB,CAAC,EACD,EAAE,MAAM,EAAE,sBAAsB,CAAC,OAAO,CAAC,MAAM,EAAE,CAClD,CAAC;QAEF,WAAW,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,EAAE;YACnD,MAAM,EAAE,WAAW,CAAC,GAAG,CAAC,CAAC,sBAAsB,CAAC,OAAO,CAAC,MAAM,EAAE,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;SAC/F,CAAC,CAAC;QAEH,WAAW,CAAC,gBAAgB,CAC1B,OAAO,EACP,KAAK,CAAC,EAAE;YACN,IAAI,KAAK,CAAC,KAAK,KAAK,WAAW,EAAE,CAAC;gBAChC,QAAQ,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC;YACpC,CAAC;iBAAM,IAAI,KAAK,CAAC,KAAK,KAAK,eAAe,EAAE,CAAC;gBAC3C,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC;YACrC,CAAC;iBAAM,IAAI,KAAK,CAAC,KAAK,KAAK,aAAa,EAAE,CAAC;gBACzC,QAAQ,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC;YAC1C,CAAC;iBAAM,CAAC;gBACN,QAAQ,CAAC,CAAC,CAAC,0BAA0B,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YACzD,CAAC;YACD,SAAS,CAAC,KAAK,CAAC,CAAC;QACnB,CAAC,EACD,EAAE,MAAM,EAAE,sBAAsB,CAAC,OAAO,CAAC,MAAM,EAAE,CAClD,CAAC;QAEF,WAAW,CAAC,gBAAgB,CAC1B,KAAK,EACL,GAAG,EAAE;YACH,IAAI,gBAAgB,CAAC,OAAO,EAAE,CAAC;gBAC7B,gBAAgB,EAAE,CAAC;YACrB,CAAC;iBAAM,CAAC;gBACN,SAAS,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;QACH,CAAC,EACD,EAAE,MAAM,EAAE,sBAAsB,CAAC,OAAO,CAAC,MAAM,EAAE,CAClD,CAAC;QAEF,oBAAoB,CAAC,OAAO,GAAG,WAAW,CAAC;QAC3C,WAAW,CAAC,KAAK,EAAE,CAAC;IACtB,CAAC,EAAE,CAAC,oBAAoB,EAAE,QAAQ,EAAE,CAAC,EAAE,YAAY,EAAE,SAAS,CAAC,CAAC,CAAC;IAEjE,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,gBAAgB,CAAC,OAAO,GAAG,KAAK,CAAC;QAEjC,MAAM,WAAW,GAAG,oBAAoB,CAAC,OAAO,CAAC;QAEjD,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,SAAS,CAAC,KAAK,CAAC,CAAC;YACjB,OAAO;QACT,CAAC;QAED,WAAW,CAAC,IAAI,EAAE,CAAC;IACrB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7B,QAAQ,CAAC,IAAI,CAAC,CAAC;QAEf,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,QAAQ,CAAC,CAAC,CAAC,kCAAkC,CAAC,CAAC,CAAC;YAChD,OAAO;QACT,CAAC;QAED,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAC;QAChC,gBAAgB,EAAE,CAAC;IACrB,CAAC,EAAE,CAAC,gBAAgB,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;IAErC,qDAAqD;IACrD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,GAAG,IAAI,eAAe,EAAE,CAAC;QAEjC,MAAM,sBAAsB,GAAG,GAAG,EAAE;YAClC,IAAI,QAAQ,CAAC,eAAe,KAAK,SAAS,EAAE,CAAC;gBAC3C,IAAI,EAAE,CAAC;YACT,CAAC;QACH,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC;QACjE,MAAM,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC;QAC7D,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,sBAAsB,EAAE,EAAE,MAAM,EAAE,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC;QAE7F,OAAO,GAAG,EAAE;YACV,EAAE,CAAC,KAAK,EAAE,CAAC;QACb,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,SAAS;QACT,MAAM;QACN,KAAK;QACL,KAAK;QACL,IAAI;KACL,CAAC;AACJ,CAAC","sourcesContent":["/// <reference types=\"dom-speech-recognition\" preserve=\"true\" />\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport useI18n from './useI18n';\n\n/**\n * Hook for speech-to-text conversion using the Web Speech API.\n * Provides real-time voice recognition with support for interim results and automatic error handling.\n */\n\nexport interface UseSpeechRecognitionProps {\n  /** onResult handler */\n  onResult: (text: string) => void;\n  /** onInterimResult handler */\n  onInterimResult?: (text: string) => void;\n  /** BCP 47 language tag */\n  langCode?: string;\n}\n\nexport default function useSpeechRecognition({\n  onResult,\n  onInterimResult,\n  langCode = navigator.language ?? 'en-US'\n}: UseSpeechRecognitionProps): {\n  supported: boolean;\n  active: boolean;\n  error: string | null;\n  start: () => void;\n  stop: () => void;\n} {\n  const SpeechRecognitionAPI: typeof SpeechRecognition | undefined =\n    window.SpeechRecognition ?? window.webkitSpeechRecognition;\n\n  const supported = !!SpeechRecognitionAPI;\n\n  const t = useI18n();\n  const [active, setActive] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n\n  const speechRecognitionRef = useRef<SpeechRecognition | null>(null);\n  const speechRecognitionACRef = useRef(new AbortController());\n  const onResultACRef = useRef(new AbortController());\n  const keepListeningRef = useRef<boolean>(false);\n\n  const handleResult = useCallback(\n    (event: SpeechRecognitionEvent) => {\n      let nextValue = '';\n\n      for (let i = event.resultIndex; i < event.results.length; i += 1) {\n        const result = event.results[i];\n        const processed = result[0].transcript;\n        nextValue += processed;\n\n        if (result.isFinal) {\n          onResult(nextValue);\n        } else {\n          onInterimResult?.(nextValue);\n        }\n      }\n    },\n    [onResult, onInterimResult]\n  );\n\n  useEffect(() => {\n    if (!speechRecognitionRef.current) return;\n\n    onResultACRef.current.abort();\n    onResultACRef.current = new AbortController();\n\n    speechRecognitionRef.current.addEventListener('result', handleResult, {\n      signal: AbortSignal.any([speechRecognitionACRef.current.signal, onResultACRef.current.signal])\n    });\n  }, [handleResult]);\n\n  const startRecognition = useCallback(() => {\n    if (!supported) return;\n\n    // abort previous listeners/session\n    speechRecognitionACRef.current.abort();\n    speechRecognitionACRef.current = new AbortController();\n\n    const recognition = new SpeechRecognitionAPI();\n    recognition.lang = langCode;\n    recognition.interimResults = true;\n    recognition.maxAlternatives = 1;\n    recognition.continuous = true;\n\n    recognition.addEventListener(\n      'start',\n      () => {\n        setActive(true);\n        setError(null);\n      },\n      { signal: speechRecognitionACRef.current.signal }\n    );\n\n    recognition.addEventListener('result', handleResult, {\n      signal: AbortSignal.any([speechRecognitionACRef.current.signal, onResultACRef.current.signal])\n    });\n\n    recognition.addEventListener(\n      'error',\n      event => {\n        if (event.error === 'no-speech') {\n          setError(t('no_speech_detected'));\n        } else if (event.error === 'audio-capture') {\n          setError(t('no_microphone_found'));\n        } else if (event.error === 'not-allowed') {\n          setError(t('microphone_access_denied'));\n        } else {\n          setError(t('speech_recognition_error', [event.error]));\n        }\n        setActive(false);\n      },\n      { signal: speechRecognitionACRef.current.signal }\n    );\n\n    recognition.addEventListener(\n      'end',\n      () => {\n        if (keepListeningRef.current) {\n          startRecognition();\n        } else {\n          setActive(false);\n        }\n      },\n      { signal: speechRecognitionACRef.current.signal }\n    );\n\n    speechRecognitionRef.current = recognition;\n    recognition.start();\n  }, [SpeechRecognitionAPI, langCode, t, handleResult, supported]);\n\n  const stop = useCallback(() => {\n    keepListeningRef.current = false;\n\n    const recognition = speechRecognitionRef.current;\n\n    if (!recognition) {\n      setActive(false);\n      return;\n    }\n\n    recognition.stop();\n  }, []);\n\n  const start = useCallback(() => {\n    setError(null);\n\n    if (!supported) {\n      setError(t('speech_recognition_not_supported'));\n      return;\n    }\n\n    keepListeningRef.current = true;\n    startRecognition();\n  }, [startRecognition, supported, t]);\n\n  // Stop recognition on page hide or visibility change\n  useEffect(() => {\n    const ac = new AbortController();\n\n    const handleVisibilityChange = () => {\n      if (document.visibilityState !== 'visible') {\n        stop();\n      }\n    };\n\n    window.addEventListener('pagehide', stop, { signal: ac.signal });\n    window.addEventListener('blur', stop, { signal: ac.signal });\n    document.addEventListener('visibilitychange', handleVisibilityChange, { signal: ac.signal });\n\n    return () => {\n      ac.abort();\n    };\n  }, []);\n\n  return {\n    supported,\n    active,\n    error,\n    start,\n    stop\n  };\n}\n"]}

package/lib/i18n/default.d.ts

@@ -92,6 +92,12 @@ declare const _default: {
     reset: string;
     refresh: string;
     copy: string;
+    explain: string;
+    generate: string;
+    reject: string;
+    modify: string;
+    start: string;
+    stop: string;
     view_all: string;
     view_less: string;
     show_more: string;
@@ -398,6 +404,7 @@ declare const _default: {
     double_checking_results: string;
     finalizing_response: string;
     response_generated: string;
+    processing_speech: string;
     good_response: string;
     bad_response: string;
     share_feedback: string;
@@ -432,6 +439,13 @@ declare const _default: {
     shortcut_DismissToast: string;
     configurable_layout_instructions: string;
     page_number: string;
+    dictate: string;
+    stop_dictation: string;
+    no_speech_detected: string;
+    no_microphone_found: string;
+    microphone_access_denied: string;
+    speech_recognition_error: string;
+    speech_recognition_not_supported: string;
     drag_handle_activate_description: string;
     drag_handle_drop_description: string;
     drag_handle_cancel_description: string;