@spaced-out/ui-design-system 0.5.47 → 0.6.0

package/.cspell/custom-words.txt

@@ -161,3 +161,5 @@ xyflow
 yourcomponentname
 Yuzhno
 yxxx
+normalised
+analyse

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [0.6.0](https://github.com/spaced-out/ui-design-system/compare/v0.5.48-beta.0...v0.6.0) (2026-02-27)
+
+### [0.5.48-beta.0](https://github.com/spaced-out/ui-design-system/compare/v0.5.47...v0.5.48-beta.0) (2026-02-26)
+
 ### [0.5.47](https://github.com/spaced-out/ui-design-system/compare/v0.5.46...v0.5.47) (2026-02-18)
 
 

package/lib/components/VoiceOrb/Microphone/Microphone.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+type ClassNames = Readonly<{
+    barsContainer?: string;
+    bar?: string;
+}>;
+export interface MicrophoneProps {
+    classNames?: ClassNames;
+    enableMicrophone?: boolean;
+    testId?: string;
+}
+declare const Microphone: React.FC<MicrophoneProps>;
+export { Microphone };
+//# sourceMappingURL=Microphone.d.ts.map

package/lib/components/VoiceOrb/Microphone/Microphone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Microphone.d.ts","sourceRoot":"","sources":["../../../../src/components/VoiceOrb/Microphone/Microphone.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiB/B,KAAK,UAAU,GAAG,QAAQ,CAAC;IAAC,aAAa,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAA;CAAC,CAAC,CAAC;AAEnE,MAAM,WAAW,eAAe;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAsDzC,CAAC;AAEF,OAAO,EAAC,UAAU,EAAC,CAAC"}

package/lib/components/VoiceOrb/Microphone/Microphone.js

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Microphone = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _useAudioAnalyzer = require("../../../hooks/useAudioAnalyzer");
+var _classify = _interopRequireDefault(require("../../../utils/classify"));
+var _qa = require("../../../utils/qa/qa");
+var _constants = require("../constants");
+var _mic = _interopRequireDefault(require("./mic.png"));
+var _MicrophoneModule = _interopRequireDefault(require("./Microphone.module.css"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const Microphone = _ref => {
+  let {
+    enableMicrophone = false,
+    classNames,
+    testId
+  } = _ref;
+  const {
+    barIntensities
+  } = (0, _useAudioAnalyzer.useAudioAnalyzer)({
+    isListening: enableMicrophone,
+    audioStream: null,
+    barCount: _constants.BAR_COUNT
+  });
+  const barKeys = React.useMemo(() => Array.from({
+    length: _constants.BAR_COUNT
+  }, () => (0, _constants.uuid)()), [_constants.BAR_COUNT]);
+  // Calculate dynamic styles for each bar based on audio intensity
+  const barStyles = barIntensities.map((intensity, index) => {
+    // Height from BASE_HEIGHT (no audio) to BASE_HEIGHT * MAX_MULTIPLIERS[index] (max audio)
+    const multiplier = 1 + intensity * (_constants.MAX_MULTIPLIERS[index] - 1);
+    const height = _constants.BASE_HEIGHT * multiplier;
+    return {
+      height: `${height}px`
+    };
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    "data-testid": (0, _qa.generateTestId)({
+      base: testId,
+      slot: 'container'
+    }),
+    className: (0, _classify.default)(_MicrophoneModule.default.barsContainer, classNames?.barsContainer),
+    children: enableMicrophone ? barStyles.map((style, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      "data-testid": (0, _qa.generateTestId)({
+        base: testId,
+        slot: 'bar',
+        index
+      }),
+      className: (0, _classify.default)(_MicrophoneModule.default.bar, classNames?.bar),
+      style: style
+    }, barKeys[index])) : /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+      "data-testid": (0, _qa.generateTestId)({
+        base: testId,
+        slot: 'icon'
+      }),
+      src: _mic.default,
+      alt: "Microphone",
+      width: 58,
+      height: 58
+    })
+  });
+};
+exports.Microphone = Microphone;

package/lib/components/VoiceOrb/Microphone/Microphone.module.css

@@ -0,0 +1,21 @@
+@value (size4, size1280) from '../../../styles/variables/_size.css';
+@value (colorBackgroundTertiary) from '../../../styles/variables/_color.css';
+@value (borderRadiusCircle) from '../../../styles/variables/_border.css';
+
+.barsContainer {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  display: flex;
+  gap: size4;
+  align-items: center;
+}
+
+.bar {
+  width: size4;
+  min-height: size4;
+  background: colorBackgroundTertiary;
+  border-radius: size1280;
+  transition: height 50ms ease-out;
+}

package/lib/components/VoiceOrb/Microphone/index.d.ts

@@ -0,0 +1,2 @@
+export * from '../../../components/VoiceOrb/Microphone/Microphone';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/VoiceOrb/Microphone/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/VoiceOrb/Microphone/index.ts"],"names":[],"mappings":"AAAA,cAAc,+CAA+C,CAAC"}

package/lib/components/VoiceOrb/Microphone/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Microphone = require("./Microphone");
+Object.keys(_Microphone).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Microphone[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Microphone[key];
+    }
+  });
+});

package/lib/components/VoiceOrb/VoiceOrb/VoiceOrb.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+type ClassNames = Readonly<{
+    container?: string;
+    orbContainer?: string;
+    orb?: string;
+}>;
+export interface VoiceOrbProps {
+    classNames?: ClassNames;
+    /** Enable listening to microphone audio input for bar animation */
+    enableMicrophone?: boolean;
+    /** Volume value from Retell (0-1) to animate agent speaking */
+    volume?: number;
+    testId?: string;
+}
+export declare const VoiceOrb: React.ForwardRefExoticComponent<VoiceOrbProps & React.RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=VoiceOrb.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"VoiceOrb.d.ts","sourceRoot":"","sources":["../../../../src/components/VoiceOrb/VoiceOrb/VoiceOrb.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC,CAAC;AAEH,MAAM,WAAW,aAAa;IAC5B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+DAA+D;IAC/D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,QAAQ,sFAyBpB,CAAC"}

package/lib/components/VoiceOrb/VoiceOrb/VoiceOrb.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VoiceOrb = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _classify = _interopRequireDefault(require("../../../utils/classify"));
+var _qa = require("../../../utils/qa/qa");
+var _constants = require("../constants");
+var _Microphone = require("../Microphone");
+var _VoiceOrbModule = _interopRequireDefault(require("./VoiceOrb.module.css"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const VoiceOrb = exports.VoiceOrb = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    classNames,
+    volume = 0,
+    enableMicrophone = false,
+    testId
+  } = _ref;
+  // Calculate CSS custom property values for volume-based box-shadow animation
+  const orbShadowVars = (0, _constants.calculateOrbShadowVars)(volume);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ref: ref,
+    "data-testid": (0, _qa.generateTestId)({
+      base: testId,
+      slot: 'container'
+    }),
+    className: (0, _classify.default)(_VoiceOrbModule.default.container, classNames?.container),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classify.default)(_VoiceOrbModule.default.orbContainer, classNames?.orbContainer),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: (0, _classify.default)(_VoiceOrbModule.default.orb, classNames?.orb),
+        style: orbShadowVars,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Microphone.Microphone, {
+          enableMicrophone: enableMicrophone
+        })
+      })
+    })
+  });
+});
+VoiceOrb.displayName = 'VoiceOrb';

package/lib/components/VoiceOrb/VoiceOrb/VoiceOrb.module.css

@@ -0,0 +1,51 @@
+@value (sizeFluid) from '../../../styles/variables/_size.css';
+@value (borderRadiusCircle) from '../../../styles/variables/_border.css';
+
+.container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.orbContainer {
+  width: 130px;
+  height: 130px;
+}
+
+.orb {
+  width: sizeFluid;
+  height: sizeFluid;
+  border-radius: borderRadiusCircle;
+  background: linear-gradient(135deg, #56ccf2 0%, #2f80ed 50%, #7c3aed 100%);
+  position: relative;
+  /* Default values for CSS variables */
+  --shadow-blur-1: 0px;
+  --shadow-blur-2: 0px;
+  --shadow-blur-3: 0px;
+  --shadow-opacity-1: 0.3;
+  --shadow-opacity-2: 0.2;
+  --shadow-opacity-3: 0.15;
+  /* Use CSS variables for box-shadow with smooth transitions */
+  box-shadow: 0px 0px var(--shadow-blur-1)
+      rgba(86, 204, 242, var(--shadow-opacity-1)),
+    0px 0px var(--shadow-blur-2) rgba(47, 128, 237, var(--shadow-opacity-2)),
+    0px 0px var(--shadow-blur-3) rgba(124, 58, 237, var(--shadow-opacity-3));
+  transition: box-shadow 50ms ease-out;
+}
+
+/* Additional glow effect for depth */
+.orb::before {
+  content: '';
+  position: absolute;
+  top: 10%;
+  left: 10%;
+  right: 10%;
+  bottom: 10%;
+  border-radius: borderRadiusCircle;
+  background: radial-gradient(
+    circle at 30% 30%,
+    rgba(255, 255, 255, 0.3),
+    transparent 50%
+  );
+  pointer-events: none;
+}

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

@@ -0,0 +1,2 @@
+export * from '../../../components/VoiceOrb/VoiceOrb/VoiceOrb';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/VoiceOrb/VoiceOrb/index.ts"],"names":[],"mappings":"AAAA,cAAc,2CAA2C,CAAC"}

package/lib/components/VoiceOrb/VoiceOrb/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _VoiceOrb = require("./VoiceOrb");
+Object.keys(_VoiceOrb).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _VoiceOrb[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _VoiceOrb[key];
+    }
+  });
+});

package/lib/components/VoiceOrb/constants.d.ts

@@ -0,0 +1,18 @@
+export declare const BAR_COUNT = 5;
+export declare const BASE_HEIGHT = 4;
+export declare const MAX_MULTIPLIERS: readonly [4, 8, 12, 8, 4];
+export declare const MIN_SHADOW_BLUR = 0;
+export declare const MAX_SHADOW_BLUR = 30;
+export declare const MIN_SHADOW_BLUR_2 = 0;
+export declare const MAX_SHADOW_BLUR_2 = 50;
+export declare const MIN_SHADOW_BLUR_3 = 0;
+export declare const MAX_SHADOW_BLUR_3 = 70;
+export declare const MIN_OPACITY_1 = 0.3;
+export declare const MAX_OPACITY_1 = 0.8;
+export declare const MIN_OPACITY_2 = 0.2;
+export declare const MAX_OPACITY_2 = 0.6;
+export declare const MIN_OPACITY_3 = 0.15;
+export declare const MAX_OPACITY_3 = 0.4;
+export declare function calculateOrbShadowVars(volume: number): React.CSSProperties;
+export declare function uuid(): string;
+//# sourceMappingURL=constants.d.ts.map

package/lib/components/VoiceOrb/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/components/VoiceOrb/constants.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,SAAS,IAAI,CAAC;AAG3B,eAAO,MAAM,WAAW,IAAI,CAAC;AAG7B,eAAO,MAAM,eAAe,2BAA4B,CAAC;AAKzD,eAAO,MAAM,eAAe,IAAI,CAAC;AACjC,eAAO,MAAM,eAAe,KAAK,CAAC;AAClC,eAAO,MAAM,iBAAiB,IAAI,CAAC;AACnC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,iBAAiB,IAAI,CAAC;AACnC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,aAAa,OAAO,CAAC;AAClC,eAAO,MAAM,aAAa,MAAM,CAAC;AAEjC,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,MAAM,GA2B9C,KAAK,CAAC,aAAa,CACzB;AAGD,wBAAgB,IAAI,WAQnB"}

package/lib/components/VoiceOrb/constants.js

@@ -0,0 +1,62 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MIN_SHADOW_BLUR_3 = exports.MIN_SHADOW_BLUR_2 = exports.MIN_SHADOW_BLUR = exports.MIN_OPACITY_3 = exports.MIN_OPACITY_2 = exports.MIN_OPACITY_1 = exports.MAX_SHADOW_BLUR_3 = exports.MAX_SHADOW_BLUR_2 = exports.MAX_SHADOW_BLUR = exports.MAX_OPACITY_3 = exports.MAX_OPACITY_2 = exports.MAX_OPACITY_1 = exports.MAX_MULTIPLIERS = exports.BASE_HEIGHT = exports.BAR_COUNT = void 0;
+exports.calculateOrbShadowVars = calculateOrbShadowVars;
+exports.uuid = uuid;
+// Bar animation constants
+const BAR_COUNT = exports.BAR_COUNT = 5;
+
+// Base height of each bar in pixels
+const BASE_HEIGHT = exports.BASE_HEIGHT = 4;
+
+// Maximum height multipliers for each bar position (center has highest, edges have lowest)
+const MAX_MULTIPLIERS = exports.MAX_MULTIPLIERS = [4, 8, 12, 8, 4];
+
+// Box-shadow values for volume animation
+// Base (no volume): 0 0 0
+// Max (full volume): 0 0 30px rgba(86, 204, 242, 0.8), 0 0 50px rgba(47, 128, 237, 0.6), 0 0 70px rgba(124, 58, 237, 0.4)
+const MIN_SHADOW_BLUR = exports.MIN_SHADOW_BLUR = 0;
+const MAX_SHADOW_BLUR = exports.MAX_SHADOW_BLUR = 30;
+const MIN_SHADOW_BLUR_2 = exports.MIN_SHADOW_BLUR_2 = 0;
+const MAX_SHADOW_BLUR_2 = exports.MAX_SHADOW_BLUR_2 = 50;
+const MIN_SHADOW_BLUR_3 = exports.MIN_SHADOW_BLUR_3 = 0;
+const MAX_SHADOW_BLUR_3 = exports.MAX_SHADOW_BLUR_3 = 70;
+const MIN_OPACITY_1 = exports.MIN_OPACITY_1 = 0.3;
+const MAX_OPACITY_1 = exports.MAX_OPACITY_1 = 0.8;
+const MIN_OPACITY_2 = exports.MIN_OPACITY_2 = 0.2;
+const MAX_OPACITY_2 = exports.MAX_OPACITY_2 = 0.6;
+const MIN_OPACITY_3 = exports.MIN_OPACITY_3 = 0.15;
+const MAX_OPACITY_3 = exports.MAX_OPACITY_3 = 0.4;
+function calculateOrbShadowVars(volume) {
+  // Clamp volume between 0 and 1
+  const clampedVolume = Math.max(0, Math.min(1, volume));
+
+  // Interpolate shadow blur values
+  const blur1 = MIN_SHADOW_BLUR + clampedVolume * (MAX_SHADOW_BLUR - MIN_SHADOW_BLUR);
+  const blur2 = MIN_SHADOW_BLUR_2 + clampedVolume * (MAX_SHADOW_BLUR_2 - MIN_SHADOW_BLUR_2);
+  const blur3 = MIN_SHADOW_BLUR_3 + clampedVolume * (MAX_SHADOW_BLUR_3 - MIN_SHADOW_BLUR_3);
+
+  // Interpolate opacity values
+  const opacity1 = MIN_OPACITY_1 + clampedVolume * (MAX_OPACITY_1 - MIN_OPACITY_1);
+  const opacity2 = MIN_OPACITY_2 + clampedVolume * (MAX_OPACITY_2 - MIN_OPACITY_2);
+  const opacity3 = MIN_OPACITY_3 + clampedVolume * (MAX_OPACITY_3 - MIN_OPACITY_3);
+  return {
+    '--shadow-blur-1': `${blur1}px`,
+    '--shadow-blur-2': `${blur2}px`,
+    '--shadow-blur-3': `${blur3}px`,
+    '--shadow-opacity-1': opacity1,
+    '--shadow-opacity-2': opacity2,
+    '--shadow-opacity-3': opacity3
+  };
+}
+
+// crypto.randomUUID() is not supported in non-secure contexts (storybook dev mode - http)
+function uuid() {
+  return '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, s => {
+    const c = Number(s);
+    return (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16);
+  });
+}

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

@@ -0,0 +1,3 @@
+export * from '../../components/VoiceOrb/Microphone';
+export * from '../../components/VoiceOrb/VoiceOrb';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/VoiceOrb/index.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC;AACnD,cAAc,kCAAkC,CAAC"}

package/lib/components/VoiceOrb/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Microphone = require("./Microphone");
+Object.keys(_Microphone).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Microphone[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Microphone[key];
+    }
+  });
+});
+var _VoiceOrb = require("./VoiceOrb");
+Object.keys(_VoiceOrb).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _VoiceOrb[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _VoiceOrb[key];
+    }
+  });
+});

package/lib/components/index.d.ts

@@ -45,8 +45,8 @@ export * from '../components/OptionButton';
 export * from '../components/PageTitle';
 export * from '../components/Pagination';
 export * from '../components/Panel';
-export * from '../components/PreviewCard';
 export * from '../components/PastChatCard';
+export * from '../components/PreviewCard';
 export * from '../components/ProgressDonut';
 export * from '../components/PromptChip';
 export * from '../components/PromptInput';
@@ -55,8 +55,8 @@ export * from '../components/RadioTile';
 export * from '../components/RangeSlider';
 export * from '../components/Rating';
 export * from '../components/ScoreBar';
-export * from '../components/SearchInput';
 export * from '../components/ScrollingLoader';
+export * from '../components/SearchInput';
 export * from '../components/Separator';
 export * from '../components/Shimmer';
 export * from '../components/SideMenuLink';
@@ -78,5 +78,8 @@ export * from '../components/Tooltip';
 export * from '../components/Truncate';
 export * from '../components/TruncatedTextWithTooltip';
 export * from '../components/Typeahead';
+export * from '../hooks/useAudioAnalyzer';
+export * from '../components/VoiceOrb/Microphone';
+export * from '../components/VoiceOrb/VoiceOrb';
 export * from '../components/WeekdayPicker';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,yBAAyB,CAAC;AACxC,cAAc,mCAAmC,CAAC;AAClD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oCAAoC,CAAC;AACnD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mDAAmD,CAAC;AAClE,cAAc,iCAAiC,CAAC;AAChD,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yCAAyC,CAAC;AACxD,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,yBAAyB,CAAC;AACxC,cAAc,mCAAmC,CAAC;AAClD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oCAAoC,CAAC;AACnD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mDAAmD,CAAC;AAClE,cAAc,iCAAiC,CAAC;AAChD,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yCAAyC,CAAC;AACxD,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oCAAoC,CAAC;AACnD,cAAc,kCAAkC,CAAC;AACjD,cAAc,8BAA8B,CAAC"}

package/lib/components/index.js

@@ -520,25 +520,25 @@ Object.keys(_Panel).forEach(function (key) {
     }
   });
 });
-var _PreviewCard = require("./PreviewCard");
-Object.keys(_PreviewCard).forEach(function (key) {
+var _PastChatCard = require("./PastChatCard");
+Object.keys(_PastChatCard).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _PreviewCard[key]) return;
+  if (key in exports && exports[key] === _PastChatCard[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _PreviewCard[key];
+      return _PastChatCard[key];
     }
   });
 });
-var _PastChatCard = require("./PastChatCard");
-Object.keys(_PastChatCard).forEach(function (key) {
+var _PreviewCard = require("./PreviewCard");
+Object.keys(_PreviewCard).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _PastChatCard[key]) return;
+  if (key in exports && exports[key] === _PreviewCard[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _PastChatCard[key];
+      return _PreviewCard[key];
     }
   });
 });
@@ -630,25 +630,25 @@ Object.keys(_ScoreBar).forEach(function (key) {
     }
   });
 });
-var _SearchInput = require("./SearchInput");
-Object.keys(_SearchInput).forEach(function (key) {
+var _ScrollingLoader = require("./ScrollingLoader");
+Object.keys(_ScrollingLoader).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _SearchInput[key]) return;
+  if (key in exports && exports[key] === _ScrollingLoader[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _SearchInput[key];
+      return _ScrollingLoader[key];
     }
   });
 });
-var _ScrollingLoader = require("./ScrollingLoader");
-Object.keys(_ScrollingLoader).forEach(function (key) {
+var _SearchInput = require("./SearchInput");
+Object.keys(_SearchInput).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _ScrollingLoader[key]) return;
+  if (key in exports && exports[key] === _SearchInput[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _ScrollingLoader[key];
+      return _SearchInput[key];
     }
   });
 });
@@ -883,6 +883,39 @@ Object.keys(_Typeahead).forEach(function (key) {
     }
   });
 });
+var _useAudioAnalyzer = require("../hooks/useAudioAnalyzer");
+Object.keys(_useAudioAnalyzer).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useAudioAnalyzer[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useAudioAnalyzer[key];
+    }
+  });
+});
+var _Microphone = require("./VoiceOrb/Microphone");
+Object.keys(_Microphone).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Microphone[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Microphone[key];
+    }
+  });
+});
+var _VoiceOrb = require("./VoiceOrb/VoiceOrb");
+Object.keys(_VoiceOrb).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _VoiceOrb[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _VoiceOrb[key];
+    }
+  });
+});
 var _WeekdayPicker = require("./WeekdayPicker");
 Object.keys(_WeekdayPicker).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

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

@@ -0,0 +1,2 @@
+export * from '../../hooks/useAudioAnalyzer/useAudioAnalyzer';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAudioAnalyzer/index.ts"],"names":[],"mappings":"AAAA,cAAc,6CAA6C,CAAC"}

package/lib/hooks/useAudioAnalyzer/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _useAudioAnalyzer = require("./useAudioAnalyzer");
+Object.keys(_useAudioAnalyzer).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useAudioAnalyzer[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useAudioAnalyzer[key];
+    }
+  });
+});

package/lib/hooks/useAudioAnalyzer/useAudioAnalyzer.d.ts

@@ -0,0 +1,27 @@
+export interface AudioAnalyzerOptions {
+    /** Enable/disable audio analysis */
+    isListening: boolean;
+    /** Optional external MediaStream to use */
+    audioStream?: MediaStream | null;
+    /** Number of bars to generate intensity values for */
+    barCount?: number;
+    /** Smoothing factor for the analyzer (0-1) */
+    smoothingTimeConstant?: number;
+    /** FFT size for frequency analysis */
+    fftSize?: number;
+    /** Minimum ms between state updates (throttle). Default 50 (~20fps). */
+    updateIntervalMs?: number;
+}
+export interface AudioAnalyzerResult {
+    /** Array of intensity values (0-1) for each bar */
+    barIntensities: number[];
+    /** Whether the audio stream is active */
+    isActive: boolean;
+    /** Any error that occurred */
+    error: Error | null;
+}
+export declare const useAudioAnalyzer: {
+    (options: AudioAnalyzerOptions): AudioAnalyzerResult;
+    displayName: string;
+};
+//# sourceMappingURL=useAudioAnalyzer.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useAudioAnalyzer.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAudioAnalyzer/useAudioAnalyzer.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,oBAAoB;IACnC,oCAAoC;IACpC,WAAW,EAAE,OAAO,CAAC;IACrB,2CAA2C;IAC3C,WAAW,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACjC,sDAAsD;IACtD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,sCAAsC;IACtC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wEAAwE;IACxE,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,WAAW,mBAAmB;IAClC,mDAAmD;IACnD,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,yCAAyC;IACzC,QAAQ,EAAE,OAAO,CAAC;IAClB,8BAA8B;IAC9B,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;CACrB;AAcD,eAAO,MAAM,gBAAgB;cAClB,oBAAoB,GAC5B,mBAAmB;;CA+KrB,CAAC"}

package/lib/hooks/useAudioAnalyzer/useAudioAnalyzer.js

@@ -0,0 +1,171 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAudioAnalyzer = void 0;
+var _react = require("react");
+const DEFAULT_BAR_COUNT = 5;
+const DEFAULT_SMOOTHING = 0.8; // Lower smoothing for more responsive animation
+const DEFAULT_FFT_SIZE = 256;
+/** Throttle state updates to reduce re-renders (~20fps) */
+const DEFAULT_UPDATE_INTERVAL_MS = 50;
+/** Sample every Nth sample for RMS to reduce work */
+const RMS_SAMPLE_STRIDE = 4;
+// Sensitivity multiplier - higher values make the animation more responsive to quieter sounds
+const SENSITIVITY = 3.5;
+// Minimum threshold to filter out background noise
+const NOISE_THRESHOLD = 0.1;
+const useAudioAnalyzer = options => {
+  const {
+    isListening,
+    audioStream: externalStream,
+    barCount = DEFAULT_BAR_COUNT,
+    smoothingTimeConstant = DEFAULT_SMOOTHING,
+    fftSize = DEFAULT_FFT_SIZE,
+    updateIntervalMs = DEFAULT_UPDATE_INTERVAL_MS
+  } = options;
+  const [barIntensities, setBarIntensities] = (0, _react.useState)(() => Array(barCount).fill(0));
+  const [isActive, setIsActive] = (0, _react.useState)(false);
+  const [error, setError] = (0, _react.useState)(null);
+  const audioContextRef = (0, _react.useRef)(null);
+  const analyzerRef = (0, _react.useRef)(null);
+  const sourceRef = (0, _react.useRef)(null);
+  const streamRef = (0, _react.useRef)(null);
+  const animationFrameRef = (0, _react.useRef)(null);
+  const ownStreamRef = (0, _react.useRef)(false);
+  const lastUpdateTimeRef = (0, _react.useRef)(0);
+  const analyzeAudio = (0, _react.useCallback)(() => {
+    if (!analyzerRef.current) {
+      return;
+    }
+    const analyzer = analyzerRef.current;
+    const timeDomainData = new Uint8Array(analyzer.fftSize);
+    const frequencyData = new Uint8Array(analyzer.frequencyBinCount);
+    const freqBinCount = Math.floor(analyzer.frequencyBinCount * 0.3);
+    const middleIndex = Math.floor(barCount / 2) || 1;
+    const analyze = () => {
+      if (!analyzerRef.current) {
+        return;
+      }
+      analyzer.getByteTimeDomainData(timeDomainData);
+      analyzer.getByteFrequencyData(frequencyData);
+
+      // Sampled RMS: every Nth sample to reduce iterations
+      let sumSquares = 0;
+      let sampledCount = 0;
+      for (let i = 0; i < timeDomainData.length; i += RMS_SAMPLE_STRIDE) {
+        const normalized = (timeDomainData[i] - 128) / 128;
+        sumSquares += normalized * normalized;
+        sampledCount++;
+      }
+      const rms = Math.sqrt(sampledCount ? sumSquares / sampledCount : 0);
+      let intensity = Math.min(rms * SENSITIVITY, 1);
+      if (intensity < NOISE_THRESHOLD) {
+        intensity = 0;
+      }
+
+      // One pass over low frequencies to get per-bar band sums
+      const bandSums = new Array(barCount).fill(0);
+      const bandCounts = new Array(barCount).fill(0);
+      for (let j = 0; j < freqBinCount; j++) {
+        const barIdx = Math.min(Math.floor(j / freqBinCount * barCount), barCount - 1);
+        bandSums[barIdx] += frequencyData[j];
+        bandCounts[barIdx]++;
+      }
+      const intensities = [];
+      for (let i = 0; i < barCount; i++) {
+        const distanceFromCenter = Math.abs(i - middleIndex) / middleIndex;
+        const barMultiplier = 1 - distanceFromCenter * 0.4;
+        const freqAvg = bandCounts[i] ? bandSums[i] / bandCounts[i] / 255 : 0;
+        const combinedIntensity = (intensity * 0.7 + freqAvg * 0.3) * barMultiplier;
+        intensities.push(Math.min(Math.max(combinedIntensity, 0), 1));
+      }
+      const now = Date.now();
+      if (now - lastUpdateTimeRef.current >= updateIntervalMs) {
+        lastUpdateTimeRef.current = now;
+        setBarIntensities(intensities);
+      }
+      animationFrameRef.current = requestAnimationFrame(analyze);
+    };
+    analyze();
+  }, [barCount, updateIntervalMs]);
+  const cleanup = (0, _react.useCallback)(() => {
+    if (animationFrameRef.current) {
+      cancelAnimationFrame(animationFrameRef.current);
+      animationFrameRef.current = null;
+    }
+    if (sourceRef.current) {
+      sourceRef.current.disconnect();
+      sourceRef.current = null;
+    }
+    if (analyzerRef.current) {
+      analyzerRef.current.disconnect();
+      analyzerRef.current = null;
+    }
+
+    // Only stop the stream if we created it ourselves
+    if (streamRef.current && ownStreamRef.current) {
+      streamRef.current.getTracks().forEach(track => track.stop());
+    }
+    streamRef.current = null;
+    ownStreamRef.current = false;
+    if (audioContextRef.current) {
+      audioContextRef.current.close();
+      audioContextRef.current = null;
+    }
+    setIsActive(false);
+    setBarIntensities(Array(barCount).fill(0));
+  }, [barCount]);
+  (0, _react.useEffect)(() => {
+    if (!isListening) {
+      cleanup();
+      return;
+    }
+    const initAudio = async () => {
+      try {
+        setError(null);
+
+        // Use external stream or request microphone access
+        let stream;
+        if (externalStream) {
+          stream = externalStream;
+          ownStreamRef.current = false;
+        } else {
+          stream = await navigator.mediaDevices.getUserMedia({
+            audio: true
+          });
+          ownStreamRef.current = true;
+        }
+        streamRef.current = stream;
+
+        // Create audio context and analyzer
+        const audioContext = new AudioContext();
+        audioContextRef.current = audioContext;
+        const analyzer = audioContext.createAnalyser();
+        analyzer.fftSize = fftSize;
+        analyzer.smoothingTimeConstant = smoothingTimeConstant;
+        analyzerRef.current = analyzer;
+
+        // Connect stream to analyzer
+        const source = audioContext.createMediaStreamSource(stream);
+        source.connect(analyzer);
+        sourceRef.current = source;
+        setIsActive(true);
+        analyzeAudio();
+      } catch (err) {
+        setError(err instanceof Error ? err : new Error('Failed to access microphone'));
+        setIsActive(false);
+      }
+    };
+    initAudio();
+    return cleanup;
+  }, [isListening, externalStream, fftSize, smoothingTimeConstant, analyzeAudio, cleanup]);
+  return {
+    barIntensities,
+    isActive,
+    error
+  };
+};
+exports.useAudioAnalyzer = useAudioAnalyzer;
+useAudioAnalyzer.displayName = 'useAudioAnalyzer';

package/mcp/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spaced-out/genesis-mcp",
-  "version": "1.0.12",
+  "version": "1.0.14",
   "description": "MCP server for Genesis UI Design System - provides AI assistants with access to components, hooks, and design tokens",
   "type": "module",
   "main": "index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spaced-out/ui-design-system",
-  "version": "0.5.47",
+  "version": "0.6.0",
   "description": "Sense UI components library",
   "author": {
     "name": "Spaced Out"