npm - @mks2508/mks-ui - Versions diffs - 0.4.0 → 0.5.1 - Mend

@@ -4,15 +4,18 @@
  * @module components/devenv/terminal/panel/chrome/types
  */
+import type { SlotOverrides } from '@/core/types';
 import type { ITerminalSession } from './TerminalLogsPanel.types';
+import type { TerminalChromeSlot, TerminalChromeVariantProps } from './TerminalPanelChrome.styles';
 /**
  * Props for TerminalPanelChrome - reusable Ghostty-styled wrapper.
  *
  * Provides the shared visual shell for both log viewer
- * and interactive terminal panels.
+ * and interactive terminal panels. Supports StyleSlots for
+ * class overrides and CVA variants for visual presets.
  */
-export interface ITerminalPanelChromeProps {
+export interface ITerminalPanelChromeProps extends TerminalChromeVariantProps {
   /** Container/session name displayed in header */
   containerName: string;
@@ -71,6 +74,9 @@ export interface ITerminalPanelChromeProps {
   /** Enable CRT shader effects (scanlines, bloom, vignette) */
   crtEffect?: boolean;
+  /** Slot class overrides for each chrome sub-region */
+  slots?: SlotOverrides<TerminalChromeSlot>;
   /** Custom class name appended to outer wrapper */
   className?: string;
 }

@@ -1,3 +1,4 @@
+'use client';
 import { useRef, useCallback, useState } from 'react';
 import { TIMING, EASINGS } from '../../core/animationConstants';
 import type { ICSSGridMorphOptions, ICSSGridMorphAPI } from '../Morph.types';

@@ -1,3 +1,4 @@
+'use client';
 import { useRef, useCallback, useEffect, useState } from 'react';
 import { TIMING, EASINGS } from '../../core/animationConstants';
 import type { IFLIPClipPathOptions, IFLIPClipPathAPI } from '../Morph.types';

@@ -1,3 +1,4 @@
+'use client';
 import { useRef, useCallback, useMemo } from 'react';
 import type { IViewTransitionsOptions, IViewTransitionsAPI } from '../Morph.types';

@@ -1,3 +1,4 @@
+'use client';
 import { useCallback, useRef, useEffect } from 'react';
 import { useFLIPClipPath } from './techniques/useFLIPClipPath';
 import { useCSSGridMorph } from './techniques/useCSSGridMorph';

@@ -1,3 +1,4 @@
+'use client';
 import { useAnimationOrchestrator } from '../core/useAnimationOrchestrator';
 import type { IUseReorderReturn, IUseReorderConfig } from './Reorder.types';

@@ -1,3 +1,4 @@
+'use client';
 import { useRef, useCallback, useEffect } from 'react';
 import { TIMING, TRANSFORMS, EFFECTS, EASINGS } from './animationConstants';
 import { useElementRegistry } from './useElementRegistry';

@@ -1,3 +1,4 @@
+'use client';
 import { useRef, useCallback } from 'react';
 import { TIMING } from './animationConstants';
 import type { IPositionCaptureAPI, IFLIPDelta, IPositionCaptureOptions } from './types';

@@ -102,8 +102,8 @@ function Accordion({
   ...props
 }: IAccordionProps) {
   const [value, setValue] = useControlledState<string | string[] | undefined>({
-    value: props?.value,
-    defaultValue: props?.defaultValue,
+    value: props?.value as string | string[] | undefined,
+    defaultValue: props?.defaultValue as string | string[] | undefined,
     onChange: props?.onValueChange as (
       value: string | string[] | undefined,
     ) => void,
@@ -115,7 +115,7 @@ function Accordion({
         data-slot="accordion"
         className={cn(accordionVariants({ variant }), slots?.root, className)}
         {...props}
-        onValueChange={setValue}
+        onValueChange={setValue as any}
       />
     </AccordionProvider>
   );

@@ -1,3 +1,5 @@
+'use client';
 import * as React from 'react';
 import { cn } from '@/react-ui/lib/utils';

@mks2508/mks-ui 0.4.0 → 0.5.1