@zen-ui-capri/system 1.1.0 → 1.1.1

package/dist/lib/index.d.ts

@@ -1,4 +1,4 @@
-export declare const ZEN_UI_VERSION = "1.1.0";
+export declare const ZEN_UI_VERSION = "1.1.1";
 export declare const ZEN_PACKAGE_NAME = "@zen-ui/system";
 export { ZenThemeProvider, useZenTheme, syncZenScrollbarStyles, ZEN_THEMES, type ZenThemeId, type ZenThemeMode, type ZenDensityMode, type ZenRadiusMode, type ZenThemeMetadata, type ZenThemeTokenOverrides, type ZenThemeContextValue, type ZenThemeProviderProps, } from './theme/ZenThemeProvider';
 export { ZenButton, ZenCopyButton, type ZenButtonVariant, type ZenButtonSize, type ZenButtonProps, type ZenCopyButtonProps, } from './components/ZenButton';

package/dist/lib/index.js

@@ -3834,7 +3834,7 @@ function Kr({
     /* @__PURE__ */ e(lt, { bridgeRef: s })
   ] });
 }
-const Yr = "1.1.0", Xr = "@zen-ui/system";
+const Yr = "1.1.1", Xr = "@zen-ui/system";
 export {
   he as CAPRI_SUBROUTINE_SKILLS,
   en as CapriEngine,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zen-ui-capri/system",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "zeN-UI // CAPRI — Universal Multi-Framework Design System (51 Primitives, 40 Vector Icons, 8 Dark/Light Themes & Capri 5-Subroutine AI Co-Pilot)",
   "type": "module",
   "license": "MIT",
@@ -77,4 +77,4 @@
     "typescript": "~5.8.2",
     "vite": "^6.2.0"
   }
-}
+}

package/src/lib/audio/ZenAudioController.tsx

@@ -1,114 +1,114 @@
-import { Volume2, VolumeX, Disc3 } from 'lucide-react';
-import type { ZenAudioSynthController, ZenSynthPresetId } from './useZenAudioSynth';
-import { ZenButton } from '../components/ZenButton';
-import { ZenSegmentedControl } from '../components/ZenSegmentedControl';
-
-export interface ZenAudioControllerProps {
-  readonly synth: ZenAudioSynthController;
-  readonly mode?: 'pill' | 'deck';
-  readonly activeLabel?: string;
-  readonly idleLabel?: string;
-  readonly className?: string;
-}
-
-export function ZenAudioController({
-  synth,
-  mode = 'pill',
-  activeLabel = 'Lo-Fi Radio: ON',
-  idleLabel = 'Lo-Fi Background',
-  className = '',
-}: ZenAudioControllerProps) {
-  if (mode === 'pill') {
-    return (
-      <ZenButton
-        variant="secondary"
-        size="sm"
-        mono
-        pressed={synth.active}
-        onClick={synth.toggle}
-        aria-label="Toggle procedural ambient synthesizer"
-        className={className}
-        iconLeft={
-          synth.active ? (
-            <Volume2 className="w-3.5 h-3.5 animate-pulse" />
-          ) : (
-            <VolumeX className="w-3.5 h-3.5 text-[var(--zen-accent-primary)]" />
-          )
-        }
-      >
-        {synth.active ? activeLabel : idleLabel}
-      </ZenButton>
-    );
-  }
-
-  return (
-    <div
-      data-zen-occlude="true"
-      className={`p-5 rounded-3xl zen-surface-static flex flex-col gap-4 ${className}`.trim()}
-    >
-      <div className="flex flex-wrap items-center justify-between gap-3">
-        <div className="flex items-center gap-3">
-          <Disc3
-            className={`w-6 h-6 text-[var(--zen-accent-primary)] ${
-              synth.active ? 'animate-spin' : ''
-            }`}
-          />
-          <div>
-            <div className="zen-telemetry-label text-[var(--zen-accent-primary)]">
-              WEB AUDIO PROCEDURAL SYNTHESIZER
-            </div>
-            <div className="zen-font-display font-bold text-base text-[var(--zen-ink-primary)]">
-              Zero-Dependency Acoustic Engine
-            </div>
-          </div>
-        </div>
-
-        <ZenButton
-          variant={synth.active ? 'primary' : 'secondary'}
-          size="sm"
-          mono
-          pressed={synth.active}
-          onClick={synth.toggle}
-          iconLeft={
-            synth.active ? (
-              <Volume2 className="w-3.5 h-3.5" />
-            ) : (
-              <VolumeX className="w-3.5 h-3.5" />
-            )
-          }
-        >
-          {synth.active ? 'SYNTH ACTIVE' : 'START SYNTH'}
-        </ZenButton>
-      </div>
-
-      <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4 pt-2 border-t border-[var(--zen-border-subtle)]">
-        <ZenSegmentedControl<ZenSynthPresetId>
-          ariaLabel="Select synthesizer voicing preset"
-          size="sm"
-          value={synth.presetId}
-          onChange={synth.setPresetId}
-          items={synth.presets.map((p) => ({
-            value: p.id,
-            label: p.label.split(' (')[0],
-          }))}
-        />
-
-        <div className="flex items-center gap-1.5" aria-label="8-step bar sequencer">
-          {Array.from({ length: 8 }).map((_, idx) => {
-            const isBeat = synth.active && synth.currentStep === idx;
-            return (
-              <span
-                key={idx}
-                className={`h-2.5 w-2.5 rounded-full transition-all ${
-                  isBeat
-                    ? 'bg-[var(--zen-accent-primary)] scale-125'
-                    : 'bg-[var(--zen-border-default)]'
-                }`}
-              />
-            );
-          })}
-        </div>
-      </div>
-    </div>
-  );
-}
+import { Volume2, VolumeX, Disc3 } from 'lucide-react';
+import type { ZenAudioSynthController, ZenSynthPresetId } from './useZenAudioSynth';
+import { ZenButton } from '../components/ZenButton';
+import { ZenSegmentedControl } from '../components/ZenSegmentedControl';
+
+export interface ZenAudioControllerProps {
+  readonly synth: ZenAudioSynthController;
+  readonly mode?: 'pill' | 'deck';
+  readonly activeLabel?: string;
+  readonly idleLabel?: string;
+  readonly className?: string;
+}
+
+export function ZenAudioController({
+  synth,
+  mode = 'pill',
+  activeLabel = 'Lo-Fi Radio: ON',
+  idleLabel = 'Lo-Fi Background',
+  className = '',
+}: ZenAudioControllerProps) {
+  if (mode === 'pill') {
+    return (
+      <ZenButton
+        variant="secondary"
+        size="sm"
+        mono
+        pressed={synth.active}
+        onClick={synth.toggle}
+        aria-label="Toggle procedural ambient synthesizer"
+        className={className}
+        iconLeft={
+          synth.active ? (
+            <Volume2 className="w-3.5 h-3.5 animate-pulse" />
+          ) : (
+            <VolumeX className="w-3.5 h-3.5 text-[var(--zen-accent-primary)]" />
+          )
+        }
+      >
+        {synth.active ? activeLabel : idleLabel}
+      </ZenButton>
+    );
+  }
+
+  return (
+    <div
+      data-zen-occlude="true"
+      className={`p-5 rounded-3xl zen-surface-static flex flex-col gap-4 ${className}`.trim()}
+    >
+      <div className="flex flex-wrap items-center justify-between gap-3">
+        <div className="flex items-center gap-3">
+          <Disc3
+            className={`w-6 h-6 text-[var(--zen-accent-primary)] ${
+              synth.active ? 'animate-spin' : ''
+            }`}
+          />
+          <div>
+            <div className="zen-telemetry-label text-[var(--zen-accent-primary)]">
+              WEB AUDIO PROCEDURAL SYNTHESIZER
+            </div>
+            <div className="zen-font-display font-bold text-base text-[var(--zen-ink-primary)]">
+              Zero-Dependency Acoustic Engine
+            </div>
+          </div>
+        </div>
+
+        <ZenButton
+          variant={synth.active ? 'primary' : 'secondary'}
+          size="sm"
+          mono
+          pressed={synth.active}
+          onClick={synth.toggle}
+          iconLeft={
+            synth.active ? (
+              <Volume2 className="w-3.5 h-3.5" />
+            ) : (
+              <VolumeX className="w-3.5 h-3.5" />
+            )
+          }
+        >
+          {synth.active ? 'SYNTH ACTIVE' : 'START SYNTH'}
+        </ZenButton>
+      </div>
+
+      <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4 pt-2 border-t border-[var(--zen-border-subtle)]">
+        <ZenSegmentedControl<ZenSynthPresetId>
+          ariaLabel="Select synthesizer voicing preset"
+          size="sm"
+          value={synth.presetId}
+          onChange={synth.setPresetId}
+          items={synth.presets.map((p) => ({
+            value: p.id,
+            label: p.label.split(' (')[0],
+          }))}
+        />
+
+        <div className="flex items-center gap-1.5" aria-label="8-step bar sequencer">
+          {Array.from({ length: 8 }).map((_, idx) => {
+            const isBeat = synth.active && synth.currentStep === idx;
+            return (
+              <span
+                key={idx}
+                className={`h-2.5 w-2.5 rounded-full transition-all ${
+                  isBeat
+                    ? 'bg-[var(--zen-accent-primary)] scale-125'
+                    : 'bg-[var(--zen-border-default)]'
+                }`}
+              />
+            );
+          })}
+        </div>
+      </div>
+    </div>
+  );
+}

package/src/lib/index.ts

@@ -1,4 +1,4 @@
-export const ZEN_UI_VERSION = '1.1.0';
+export const ZEN_UI_VERSION = '1.1.1';
 export const ZEN_PACKAGE_NAME = '@zen-ui/system';
 
 export {