@mks2508/mks-ui 0.3.1 → 0.4.0

package/dist/react-ui/lib/index.d.ts

@@ -5,4 +5,5 @@
  */
 export { cn } from './utils';
 export { getStrictContext } from './get-strict-context';
+export { IconWrapper, type IIconWrapperProps } from './icon-wrapper';
 //# sourceMappingURL=index.d.ts.map

package/dist/react-ui/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react-ui/lib/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/react-ui/lib/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/react-ui/lib/index.js

@@ -1,2 +1,3 @@
 import { cn } from "./utils.js";
 import { getStrictContext } from "./get-strict-context.js";
+import { IconWrapper } from "./icon-wrapper.js";

package/dist/react-ui/primitives/AutoHeight/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { type HTMLMotionProps, type LegacyAnimationControls, type TargetAndTransition, type Transition } from 'motion/react';
-import { type WithAsChild } from '../../../react-ui/primitives/Slot';
+import { type WithAsChild } from '@/react-ui/primitives/Slot';
 /** Props for the AutoHeight primitive component. */
 type IAutoHeightProps = WithAsChild<{
     children: React.ReactNode;

package/dist/react-ui/primitives/CountingNumber/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { type SpringOptions } from 'motion/react';
-import { type IUseIsInViewOptions } from '../../../react-ui/hooks/DOM/UseIsInView';
+import { type IUseIsInViewOptions } from '@/react-ui/hooks/DOM/UseIsInView';
 /** Props for the CountingNumber primitive. */
 type ICountingNumberProps = Omit<React.ComponentProps<'span'>, 'children'> & {
     /** Target number to animate to. */

package/dist/react-ui/primitives/waapi/SlidingNumber/SlidingNumber.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /**
  * Style slots for SlidingNumber component
  */

package/dist/react-ui/primitives/waapi/SlidingText/SlidingText.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /**
  * Style slots for SlidingText component
  */

package/dist/react-ui/ui/Accordion/Accordion.styles.d.ts

@@ -7,7 +7,7 @@
  * @module @mks2508/mks-ui/react/ui/Accordion/Accordion.styles
  */
 import { type VariantProps } from 'class-variance-authority';
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 import type { AccordionSlot } from './Accordion.types';
 /**
  * Default Tailwind classes for each visual region of the Accordion.

package/dist/react-ui/ui/Accordion/Accordion.types.d.ts

@@ -8,7 +8,7 @@
  */
 import type { Accordion as AccordionPrimitive } from '@base-ui/react/accordion';
 import type { HTMLMotionProps } from 'motion/react';
-import type { IBaseConfig, SlotOverrides } from '../../../core/types';
+import type { IBaseConfig, SlotOverrides } from '@/core/types';
 import type { AccordionVariantProps } from './Accordion.styles';
 /**
  * Named visual regions of the Accordion that can be styled via the `slots` prop.

package/dist/react-ui/ui/AlertDialog/AlertDialog.styles.d.ts

@@ -7,7 +7,7 @@
  *
  * @module @mks2508/mks-ui/react/ui/AlertDialog/AlertDialog.styles
  */
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 import type { AlertDialogSlot } from './AlertDialog.types';
 /**
  * Default Tailwind classes for each visual region of the AlertDialog.

package/dist/react-ui/ui/AlertDialog/AlertDialog.types.d.ts

@@ -8,7 +8,7 @@
  */
 import type { AlertDialog as AlertDialogPrimitive } from '@base-ui/react/alert-dialog';
 import type { HTMLMotionProps } from 'motion/react';
-import type { IBaseConfig, SlotOverrides } from '../../../core/types';
+import type { IBaseConfig, SlotOverrides } from '@/core/types';
 /**
  * Named visual regions of the AlertDialog that can be styled via the `slots` prop.
  *

package/dist/react-ui/ui/Badge/Badge.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the Badge component. */
 type BadgeSlot = 'root';
 declare const badgeStyles: StyleSlots<BadgeSlot>;

package/dist/react-ui/ui/Badge/Badge.types.d.ts

@@ -1,5 +1,5 @@
 import type { VariantProps } from 'class-variance-authority';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { badgeVariants, BadgeSlot } from './Badge.styles';
 /**
  * Props for the Badge component.

package/dist/react-ui/ui/Button/Button.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the Button component. */
 type ButtonSlot = 'root';
 declare const buttonStyles: StyleSlots<ButtonSlot>;
@@ -8,7 +8,7 @@ declare const buttonStyles: StyleSlots<ButtonSlot>;
  * @see {@link https://cva.style/docs/getting-started/variants}
  */
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "outline" | "secondary" | "destructive" | "ghost" | "success" | "warning" | null | undefined;
+    variant?: "link" | "default" | "outline" | "ghost" | "secondary" | "destructive" | "success" | "warning" | null | undefined;
     size?: "default" | "icon" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 /** State-specific style classes for Button. */

package/dist/react-ui/ui/Button/Button.types.d.ts

@@ -1,5 +1,5 @@
 import type { VariantProps } from 'class-variance-authority';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { buttonVariants, ButtonSlot } from './Button.styles';
 /** Button interaction state. */
 interface IButtonState {

package/dist/react-ui/ui/Card/Card.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the Card component. */
 type CardSlot = 'root' | 'header' | 'title' | 'description' | 'action' | 'content' | 'footer';
 declare const cardStyles: StyleSlots<CardSlot>;

package/dist/react-ui/ui/Card/Card.types.d.ts

@@ -1,5 +1,5 @@
 import type { VariantProps } from 'class-variance-authority';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { cardVariants, CardSlot } from './Card.styles';
 /** Props for the Card component. */
 interface ICardProps extends React.ComponentProps<'div'>, VariantProps<typeof cardVariants> {

package/dist/react-ui/ui/Checkbox/Checkbox.styles.d.ts

@@ -3,7 +3,7 @@
  *
  * @module @mks2508/mks-ui/react/ui/Checkbox/Checkbox.styles
  */
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 import type { CheckboxSlot } from './Checkbox.types';
 /**
  * Default style slots for the Checkbox component.

package/dist/react-ui/ui/Checkbox/Checkbox.types.d.ts

@@ -5,7 +5,7 @@
  */
 import type { Checkbox as CheckboxPrimitive } from '@base-ui/react/checkbox';
 import type { HTMLMotionProps, SVGMotionProps } from 'motion/react';
-import type { IBaseConfig, SlotOverrides } from '../../../core/types';
+import type { IBaseConfig, SlotOverrides } from '@/core/types';
 /**
  * Available style slot names for the Checkbox component.
  * Each slot maps to a visual region that can be customized via the `slots` prop.

package/dist/react-ui/ui/Combobox/Combobox.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the Combobox component family. */
 type ComboboxSlot = 'root' | 'trigger' | 'content' | 'list' | 'item' | 'label' | 'separator' | 'empty' | 'chips' | 'chip' | 'chipInput';
 declare const comboboxStyles: StyleSlots<ComboboxSlot>;

package/dist/react-ui/ui/Combobox/Combobox.types.d.ts

@@ -1,5 +1,5 @@
 import type { Combobox as ComboboxPrimitive } from '@base-ui/react';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { ComboboxSlot } from './Combobox.styles';
 /** Props for the Combobox root. */
 type IComboboxProps = ComboboxPrimitive.Root.Props<any, any>;

package/dist/react-ui/ui/CornerBracket/CornerBracket.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 type CornerBracketSlot = 'root';
 declare const cornerBracketStyles: StyleSlots<CornerBracketSlot>;
 /** CVA variants for CornerBracket positioning and color. */
@@ -11,7 +11,7 @@ declare const BRACKET_PATHS: {
     readonly tl: "M 0 20 L 0 5 A 5 5 0 0 1 5 0 L 20 0";
     readonly tr: "M 0 0 L 15 0 A 5 5 0 0 1 20 5 L 20 20";
     readonly bl: "M 0 0 L 0 15 A 5 5 0 0 0 5 20 L 20 20";
-    readonly br: "M 20 0 L 5 0 A 5 5 0 0 0 0 5 L 0 20";
+    readonly br: "M 20 0 L 20 15 A 5 5 0 0 1 15 20 L 0 20";
 };
 export { cornerBracketStyles, bracketVariants, BRACKET_PATHS };
 export type { CornerBracketSlot };

package/dist/react-ui/ui/CornerBracket/CornerBracket.styles.js

@@ -23,7 +23,7 @@ const BRACKET_PATHS = {
 	tl: "M 0 20 L 0 5 A 5 5 0 0 1 5 0 L 20 0",
 	tr: "M 0 0 L 15 0 A 5 5 0 0 1 20 5 L 20 20",
 	bl: "M 0 0 L 0 15 A 5 5 0 0 0 5 20 L 20 20",
-	br: "M 20 0 L 5 0 A 5 5 0 0 0 0 5 L 0 20"
+	br: "M 20 0 L 20 15 A 5 5 0 0 1 15 20 L 0 20"
 };
 
 //#endregion

package/dist/react-ui/ui/CornerBracket/CornerBracket.types.d.ts

@@ -1,5 +1,5 @@
 import type { VariantProps } from 'class-variance-authority';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { bracketVariants, CornerBracketSlot } from './CornerBracket.styles';
 /** Props for the CornerBracket component. */
 interface ICornerBracketProps extends Omit<React.SVGProps<SVGSVGElement>, 'variant'>, VariantProps<typeof bracketVariants> {

package/dist/react-ui/ui/DataCard/DataCard.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /**
  * Visual regions for: DataCard component family.
  * Each slot maps to: customizable visual region.

package/dist/react-ui/ui/DataCard/DataCard.types.d.ts

@@ -1,5 +1,5 @@
 import type { VariantProps } from 'class-variance-authority';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { dataCardVariants, DataCardSlot } from './DataCard.styles';
 export type { DataCardSlot } from './DataCard.styles';
 /**

package/dist/react-ui/ui/DataCard/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { dataCardVariants } from './DataCard.styles';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { IDataCardProps, IDataCardValueProps, IDataCardLabelProps, IDataCardToggleProps, IDataCardActionsProps, IDataCardBracketProps, IDataCardState, DataCardSlot } from './DataCard.types';
 /**
  * Context type for DataCard state management.

package/dist/react-ui/ui/Dialog/Dialog.styles.d.ts

@@ -7,7 +7,7 @@
  *
  * @module @mks2508/mks-ui/react/ui/Dialog/Dialog.styles
  */
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 import type { DialogSlot } from './Dialog.types';
 /**
  * Default Tailwind classes for each Dialog visual region.

package/dist/react-ui/ui/Dialog/Dialog.types.d.ts

@@ -9,7 +9,7 @@
 import type * as React from 'react';
 import type { Dialog as DialogPrimitive } from '@base-ui/react/dialog';
 import type { HTMLMotionProps } from 'motion/react';
-import type { SlotOverrides, IBaseConfig } from '../../../core/types';
+import type { SlotOverrides, IBaseConfig } from '@/core/types';
 /**
  * Visual regions available for class-name overrides via the `slots` prop.
  *

package/dist/react-ui/ui/DropdownMenu/DropdownMenu.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the DropdownMenu component family. */
 type DropdownMenuSlot = 'root' | 'content' | 'item' | 'label' | 'separator' | 'shortcut' | 'subTrigger' | 'subContent' | 'checkboxItem' | 'radioItem';
 declare const dropdownMenuStyles: StyleSlots<DropdownMenuSlot>;

package/dist/react-ui/ui/DropdownMenu/DropdownMenu.types.d.ts

@@ -1,5 +1,5 @@
 import type { Menu as MenuPrimitive } from '@base-ui/react/menu';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { DropdownMenuSlot } from './DropdownMenu.styles';
 /** Props for the DropdownMenu root. */
 type IDropdownMenuProps = MenuPrimitive.Root.Props;

package/dist/react-ui/ui/Field/Field.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the Field component family. */
 type FieldSlot = 'root' | 'set' | 'legend' | 'group' | 'content' | 'label' | 'title' | 'description' | 'separator' | 'error';
 declare const fieldStyles: StyleSlots<FieldSlot>;

package/dist/react-ui/ui/Field/Field.types.d.ts

@@ -1,5 +1,5 @@
 import type { VariantProps } from 'class-variance-authority';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { fieldVariants, FieldSlot } from './Field.styles';
 /** Props for the FieldSet component. */
 interface IFieldSetProps extends React.ComponentProps<'fieldset'> {

package/dist/react-ui/ui/Input/Input.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the Input component. */
 type InputSlot = 'root';
 declare const inputStyles: StyleSlots<InputSlot>;

package/dist/react-ui/ui/Input/Input.types.d.ts

@@ -1,4 +1,4 @@
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { InputSlot } from './Input.styles';
 /** Props for the Input component. */
 interface IInputProps extends React.ComponentProps<'input'> {

package/dist/react-ui/ui/InputGroup/InputGroup.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the InputGroup component family. */
 type InputGroupSlot = 'root' | 'addon' | 'button' | 'text' | 'input' | 'textarea';
 declare const inputGroupStyles: StyleSlots<InputGroupSlot>;

package/dist/react-ui/ui/InputGroup/InputGroup.types.d.ts

@@ -1,5 +1,5 @@
 import type { VariantProps } from 'class-variance-authority';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { inputGroupAddonVariants, inputGroupButtonVariants, InputGroupSlot } from './InputGroup.styles';
 /** Props for the InputGroup container. */
 interface IInputGroupProps extends React.ComponentProps<'div'> {

package/dist/react-ui/ui/Label/Label.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 type LabelSlot = 'root';
 declare const labelStyles: StyleSlots<LabelSlot>;
 export { labelStyles };

package/dist/react-ui/ui/Label/Label.types.d.ts

@@ -1,4 +1,4 @@
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { LabelSlot } from './Label.styles';
 /** Props for the Label component. */
 interface ILabelProps extends React.ComponentProps<'label'> {

package/dist/react-ui/ui/Menu/Menu.styles.d.ts

@@ -12,7 +12,7 @@
  * // menuStyles.popup => default popup classes
  * ```
  */
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /**
  * Union of all visual regions (slots) in the Menu component tree.
  *

package/dist/react-ui/ui/Menu/Menu.types.d.ts

@@ -10,8 +10,8 @@
 import type * as React from 'react';
 import type { Menu as MenuPrimitive } from '@base-ui/react/menu';
 import type { HTMLMotionProps, Transition } from 'motion/react';
-import type { IBaseConfig, SlotOverrides } from '../../../core/types';
-import type { IHighlightProps, IHighlightItemProps } from '../../../react-ui/primitives/Highlight';
+import type { IBaseConfig, SlotOverrides } from '@/core/types';
+import type { IHighlightProps, IHighlightItemProps } from '@/react-ui/primitives/Highlight';
 import type { MenuSlot } from './Menu.styles';
 /**
  * Configuration interface for Menu behavior and animation.

package/dist/react-ui/ui/Popover/Popover.styles.d.ts

@@ -6,7 +6,7 @@
  *
  * @module @mks2508/mks-ui/react/ui/Popover/Popover.styles
  */
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 import type { PopoverSlot } from './Popover.types';
 /**
  * Default Tailwind classes for each Popover visual region.

package/dist/react-ui/ui/Popover/Popover.types.d.ts

@@ -9,7 +9,7 @@
 import type * as React from 'react';
 import type { Popover as PopoverPrimitive } from '@base-ui/react/popover';
 import type { HTMLMotionProps } from 'motion/react';
-import type { SlotOverrides, IBaseConfig } from '../../../core/types';
+import type { SlotOverrides, IBaseConfig } from '@/core/types';
 /**
  * Visual regions available for class-name overrides via the `slots` prop.
  *

package/dist/react-ui/ui/Progress/Progress.styles.d.ts

@@ -3,7 +3,7 @@
  *
  * @module @mks2508/mks-ui/react/ui/Progress/Progress.styles
  */
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 import type { ProgressSlot } from './Progress.types';
 /**
  * Default style slots for the Progress component.

package/dist/react-ui/ui/Progress/Progress.types.d.ts

@@ -4,8 +4,8 @@
  * @module @mks2508/mks-ui/react/ui/Progress/Progress.types
  */
 import type { Progress as ProgressPrimitives } from '@base-ui/react/progress';
-import type { IBaseConfig, SlotOverrides } from '../../../core/types';
-import type { ICountingNumberProps } from '../../../react-ui/primitives/CountingNumber';
+import type { IBaseConfig, SlotOverrides } from '@/core/types';
+import type { ICountingNumberProps } from '@/react-ui/primitives/CountingNumber';
 /**
  * Available style slot names for the Progress component.
  * Each slot maps to a visual region that can be customized via the `slots` prop.

package/dist/react-ui/ui/Select/Select.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 /** Visual regions for the Select component family. */
 type SelectSlot = 'root' | 'trigger' | 'content' | 'item' | 'label' | 'separator' | 'group' | 'value' | 'scrollButton';
 declare const selectStyles: StyleSlots<SelectSlot>;

package/dist/react-ui/ui/Select/Select.types.d.ts

@@ -1,5 +1,5 @@
 import type { Select as SelectPrimitive } from '@base-ui/react/select';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { SelectSlot } from './Select.styles';
 /** Props for the Select root. */
 type ISelectProps = SelectPrimitive.Root.Props<any>;

package/dist/react-ui/ui/Separator/Separator.styles.d.ts

@@ -1,4 +1,4 @@
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 type SeparatorSlot = 'root';
 declare const separatorStyles: StyleSlots<SeparatorSlot>;
 export { separatorStyles };

package/dist/react-ui/ui/Separator/Separator.types.d.ts

@@ -1,5 +1,5 @@
 import type { Separator as SeparatorPrimitive } from '@base-ui/react/separator';
-import type { SlotOverrides } from '../../../core/types';
+import type { SlotOverrides } from '@/core/types';
 import type { SeparatorSlot } from './Separator.styles';
 /** Props for the Separator component. */
 interface ISeparatorProps extends SeparatorPrimitive.Props {

package/dist/react-ui/ui/Switch/Switch.styles.d.ts

@@ -3,7 +3,7 @@
  *
  * @module @mks2508/mks-ui/react/ui/Switch/Switch.styles
  */
-import type { StyleSlots } from '../../../core/types';
+import type { StyleSlots } from '@/core/types';
 import type { SwitchSlot } from './Switch.types';
 /**
  * Default style slots for the Switch component.

package/dist/react-ui/ui/Switch/Switch.types.d.ts

@@ -5,7 +5,7 @@
  */
 import type { Switch as SwitchPrimitives } from '@base-ui/react/switch';
 import type { HTMLMotionProps, LegacyAnimationControls, TargetAndTransition, VariantLabels } from 'motion/react';
-import type { IBaseConfig, SlotOverrides } from '../../../core/types';
+import type { IBaseConfig, SlotOverrides } from '@/core/types';
 /**
  * Available style slot names for the Switch component.
  * Each slot maps to a visual region that can be customized via the `slots` prop.

package/dist/react-ui/ui/Tabs/Tabs.styles.d.ts

@@ -1,43 +1,61 @@
 /**
- * Style slots and defaults for the Tabs component.
+ * Style slots, CVA variants, and defaults for the Tabs component.
  *
- * Each slot maps to a visual region of the Tabs. Consumers override
- * individual slots via the `slots` prop without touching internals.
+ * Provides sensible out-of-the-box styling using semantic theme tokens
+ * (bg-muted, text-foreground, etc.) while remaining fully overridable
+ * via the `slots` prop and CVA variant/size system.
+ *
+ * The sliding indicator uses CSS Anchor Positioning API for
+ * zero-JS position tracking with WAAPI-driven transitions.
  *
  * @module @mks2508/mks-ui/react/ui/Tabs/Tabs.styles
+ */
+import type { StyleSlots } from '@/core/types';
+/**
+ * Union of all visual regions (slots) in the Tabs component tree.
+ */
+export type TabsSlot = 'root' | 'list' | 'tab' | 'panel' | 'panels' | 'highlight' | 'highlightItem' | 'indicator';
+/**
+ * Default style map for every Tabs slot.
+ * Provides complete styling that works without any overrides.
+ */
+export declare const tabsStyles: StyleSlots<TabsSlot>;
+/**
+ * CVA variants for the TabsList container.
  *
  * @example
  * ```tsx
- * import { tabsStyles } from './Tabs.styles';
- * // tabsStyles.root => default root classes
+ * <TabsList variant="underline" size="lg">
+ *   <TabsTab value="a">Tab A</TabsTab>
+ * </TabsList>
  * ```
  */
-import type { StyleSlots } from '../../../core/types';
+export declare const tabsListVariants: (props?: ({
+    variant?: "default" | "outline" | "underline" | "ghost" | "pill" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 /**
- * Union of all visual regions (slots) in the Tabs component tree.
+ * CVA variants for individual tab triggers.
  *
  * @example
- * ```typescript
- * const overrides: SlotOverrides<TabsSlot> = {
- *   root: 'w-full',
- *   list: 'flex gap-1 border-b border-white/10',
- *   tab: 'px-3 py-1.5 text-sm',
- * };
+ * ```tsx
+ * <TabsTab value="general" variant="underline" size="sm">
+ *   General
+ * </TabsTab>
  * ```
  */
-export type TabsSlot = 'root' | 'list' | 'tab' | 'panel' | 'panels' | 'highlight' | 'highlightItem';
+export declare const tabsTabVariants: (props?: ({
+    variant?: "default" | "outline" | "underline" | "ghost" | "pill" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 /**
- * Default style map for every Tabs slot.
+ * CVA variants for the sliding indicator.
  *
- * Base classes are intentionally minimal so consumers can fully
- * control the visual appearance through `slots` overrides.
- * No colors are hardcoded -- all visuals come from consumer styles.
- *
- * @example
- * ```typescript
- * import { tabsStyles } from './Tabs.styles';
- * cn(tabsStyles.list, slots?.list, className);
- * ```
+ * The indicator is positioned via CSS Anchor Positioning API
+ * (anchor-name on the selected tab, position-anchor on the indicator)
+ * and animated via WAAPI transitions in CSS.
  */
-export declare const tabsStyles: StyleSlots<TabsSlot>;
+export declare const tabsIndicatorVariants: (props?: ({
+    variant?: "default" | "outline" | "underline" | "ghost" | "pill" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //# sourceMappingURL=Tabs.styles.d.ts.map

package/dist/react-ui/ui/Tabs/Tabs.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/Tabs/Tabs.styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,QAAQ,GAChB,MAAM,GACN,MAAM,GACN,KAAK,GACL,OAAO,GACP,QAAQ,GACR,WAAW,GACX,eAAe,CAAC;AAEpB;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,UAAU,EAAE,UAAU,CAAC,QAAQ,CAQ3C,CAAC"}
+{"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../../src/react-ui/ui/Tabs/Tabs.styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAGH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,QAAQ,GAChB,MAAM,GACN,MAAM,GACN,KAAK,GACL,OAAO,GACP,QAAQ,GACR,WAAW,GACX,eAAe,GACf,WAAW,CAAC;AAEhB;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,UAAU,CAAC,QAAQ,CAkB3C,CAAC;AAMF;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB;;;8EAmB3B,CAAC;AAMH;;;;;;;;;GASG;AACH,eAAO,MAAM,eAAe;;;8EAmB1B,CAAC;AAMH;;;;;;GAMG;AACH,eAAO,MAAM,qBAAqB;;8EAahC,CAAC"}