@mt-gloss/ui 0.0.8 → 0.0.10

package/lib/presets/PresetTooltip/PresetTooltip.d.ts

@@ -0,0 +1,20 @@
+import { default as React } from 'react';
+export type PresetTooltipVariant = 'default' | 'rich';
+export type PresetTooltipSize = 'sm' | 'md';
+export interface PresetTooltipProps {
+    variant?: PresetTooltipVariant;
+    size?: PresetTooltipSize;
+    content: React.ReactNode;
+    placement?: 'top' | 'bottom' | 'left' | 'right';
+    delay?: number;
+    trigger?: 'hover' | 'focus' | 'click';
+    disabled?: boolean;
+    children: React.ReactNode;
+}
+/**
+ * Tooltip with semantic variant/size API. Wraps BaseTooltip.
+ */
+export declare function PresetTooltip(props: PresetTooltipProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace PresetTooltip {
+    var displayName: string;
+}

package/lib/presets/PresetTransition/PresetTransition.d.ts

@@ -0,0 +1,6 @@
+/**
+ * @deprecated Moved to wrappers/ tier (Phase 25.1).
+ * Use `import * as UI from '@mt-gloss/ui/catalog'` -> `<UI.Transition>` instead.
+ */
+export { Transition as PresetTransition, TransitionGroup as PresetTransitionGroup } from '../../wrappers/Transition/Transition';
+export type { TransitionProps as PresetTransitionProps, TransitionGroupProps as PresetTransitionGroupProps } from '../../wrappers/Transition/Transition';

package/lib/presets/PresetValue/PresetValue.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { PolymorphicProps } from '../../base/types';
+export declare const VALUE_VARIANTS: readonly ["default", "highlight", "muted"];
+export type PresetValueVariant = (typeof VALUE_VARIANTS)[number];
+export interface PresetValueProps {
+    variant?: PresetValueVariant;
+    children?: React.ReactNode;
+}
+/**
+ * Value display with semantic variant API. Wraps BaseValue.
+ */
+export declare const PresetValue: {
+    <C extends React.ElementType = "span">(props: PolymorphicProps<C, PresetValueProps>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/lib/presets/createPreset.d.ts

@@ -0,0 +1,64 @@
+import { default as React } from 'react';
+import { PolymorphicProps } from '../base/types';
+import { SharedSize } from './types';
+/**
+ * Configuration for creating a Preset Primitive via the factory.
+ *
+ * @typeParam V - Union of variant names (e.g., 'primary' | 'secondary')
+ * @typeParam D - Definition type of the wrapped Base Primitive
+ * @typeParam ExtraProps - Additional component-specific props (e.g., leftIcon, isLoading)
+ */
+export interface PresetConfig<V extends string, D extends object, ExtraProps extends Record<string, unknown> = Record<string, never>> {
+    /** Display name for React DevTools */
+    displayName: string;
+    /** The Base Primitive component to wrap */
+    baseComponent: React.ComponentType<{
+        definition?: D;
+        className?: string;
+        style?: React.CSSProperties;
+        children?: React.ReactNode;
+        [key: string]: unknown;
+    }>;
+    /** Variant name -> partial Definition mapping */
+    variants: Record<V, Partial<D>>;
+    /** Size name -> partial Definition mapping */
+    sizes: Record<SharedSize, Partial<D>>;
+    /** Default variant when consumer omits variant prop */
+    defaultVariant: V;
+    /** Default size when consumer omits size prop */
+    defaultSize: SharedSize;
+    /** Always-applied definition values (merged under variant + size) */
+    baseDefinition?: Partial<D>;
+    /** BEM class prefix for the Preset (e.g., 'gloss-preset-button') */
+    classPrefix: string;
+    /** Extra props to extract before spreading rest onto Base. Keys listed here are consumed by renderChildren/classBuilder. */
+    extraPropKeys?: (keyof ExtraProps)[];
+    /** Custom class builder: given variant, size, and extra props, return additional BEM modifier classes */
+    classBuilder?: (variant: V, size: SharedSize, extra: Partial<ExtraProps>) => string[];
+    /** Custom children renderer: wrap children with icons, spinners, etc. */
+    renderChildren?: (children: React.ReactNode, extra: Partial<ExtraProps>) => React.ReactNode;
+}
+/**
+ * Props exposed by a Preset created via createPreset.
+ * Omits className, style, definition -- consumers use semantic variant/size props only.
+ */
+export type PresetProps<V extends string, ExtraProps extends Record<string, unknown> = Record<string, never>> = {
+    variant?: V;
+    size?: SharedSize;
+    children?: React.ReactNode;
+} & ExtraProps;
+/**
+ * @internal
+ * Factory to create a Preset Primitive that wraps a Base Primitive.
+ *
+ * Eliminates boilerplate: variant lookup, size lookup, definition merge,
+ * className construction, dangerous prop filtering.
+ *
+ * For simple Presets, use this directly. For Presets with complex internal
+ * logic (e.g., Select with dropdown state), write the Preset manually
+ * and import Base + types directly.
+ */
+export declare function createPreset<V extends string, D extends object, ExtraProps extends Record<string, unknown> = Record<string, never>>(config: PresetConfig<V, D, ExtraProps>): {
+    <C extends React.ElementType>(props: PolymorphicProps<C, PresetProps<V, ExtraProps>>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/lib/presets/index.d.ts

@@ -0,0 +1,86 @@
+export type { SharedSize, DangerousProps, SafeHTMLProps } from './types';
+export { createPreset } from './createPreset';
+export type { PresetConfig, PresetProps } from './createPreset';
+export { PresetButton as Button } from './PresetButton/PresetButton';
+export type { PresetButtonProps as ButtonProps, PresetButtonVariant as ButtonVariant } from './PresetButton/PresetButton';
+export { PresetInput as Input } from './PresetInput/PresetInput';
+export type { PresetInputProps as InputProps } from './PresetInput/PresetInput';
+export { PresetTextarea as Textarea } from './PresetTextarea/PresetTextarea';
+export type { PresetTextareaProps as TextareaProps } from './PresetTextarea/PresetTextarea';
+export { PresetCheckbox as Checkbox } from './PresetCheckbox/PresetCheckbox';
+export type { PresetCheckboxProps as CheckboxProps } from './PresetCheckbox/PresetCheckbox';
+export { PresetRadio as Radio } from './PresetRadio/PresetRadio';
+export type { PresetRadioProps as RadioProps } from './PresetRadio/PresetRadio';
+export { PresetToggle as Toggle } from './PresetToggle/PresetToggle';
+export type { PresetToggleProps as ToggleProps } from './PresetToggle/PresetToggle';
+export { PresetBadge as Badge } from './PresetBadge/PresetBadge';
+export type { PresetBadgeProps as BadgeProps, PresetBadgeVariant as BadgeVariant } from './PresetBadge/PresetBadge';
+export { PresetChip as Chip } from './PresetChip/PresetChip';
+export type { PresetChipProps as ChipProps, PresetChipVariant as ChipVariant, PresetChipColor as ChipColor } from './PresetChip/PresetChip';
+export { PresetLink as Link } from './PresetLink/PresetLink';
+export type { PresetLinkProps as LinkProps, PresetLinkVariant as LinkVariant } from './PresetLink/PresetLink';
+/** @deprecated Moved to wrappers/ tier (Phase 25.1). Import from '@mt-gloss/ui/catalog' -> UI.ButtonGroup */
+export { ButtonGroup, ButtonGroup as PresetButtonGroup, ButtonGroupContext } from '../wrappers/ButtonGroup/ButtonGroup';
+export type { ButtonGroupProps, ButtonGroupProps as PresetButtonGroupProps, ButtonGroupContextValue } from '../wrappers/ButtonGroup/ButtonGroup';
+/** @deprecated Moved to wrappers/ tier (Phase 25.1). Import from '@mt-gloss/ui/catalog' -> UI.CheckboxGroup */
+export { CheckboxGroup, CheckboxGroup as PresetCheckboxGroup, useCheckboxGroupContext, GroupCheckbox } from '../wrappers/CheckboxGroup/CheckboxGroup';
+export type { CheckboxGroupProps, CheckboxGroupProps as PresetCheckboxGroupProps, CheckboxGroupOption, CheckboxGroupContextValue, GroupCheckboxProps } from '../wrappers/CheckboxGroup/CheckboxGroup';
+/** @deprecated Moved to wrappers/ tier (Phase 25.1). Import from '@mt-gloss/ui/catalog' -> UI.RadioGroup */
+export { RadioGroup, RadioGroup as PresetRadioGroup, useRadioGroupContext, GroupRadio } from '../wrappers/RadioGroup/RadioGroup';
+export type { RadioGroupProps, RadioGroupProps as PresetRadioGroupProps, RadioGroupOption, RadioGroupContextValue, GroupRadioProps } from '../wrappers/RadioGroup/RadioGroup';
+/** @deprecated Moved to wrappers/ tier (Phase 25.1). Import from '@mt-gloss/ui/catalog' -> UI.InputGroup */
+export { InputGroup, InputGroup as PresetInputGroup, InputAddon, InputAddon as PresetInputAddon } from '../wrappers/InputGroup/InputGroup';
+export type { InputGroupProps, InputGroupProps as PresetInputGroupProps, InputAddonProps, InputAddonProps as PresetInputAddonProps } from '../wrappers/InputGroup/InputGroup';
+/** @deprecated Moved to composites/overlay/ tier (Phase 25.1). Import from '@mt-gloss/ui/catalog' -> UI.SplitButton */
+export { SplitButton, SplitButton as PresetSplitButton } from '../composites/overlay/SplitButton/SplitButton';
+export type { SplitButtonProps, SplitButtonProps as PresetSplitButtonProps, SplitButtonMenuItem } from '../composites/overlay/SplitButton/SplitButton';
+export { PresetSelect as Select } from './PresetSelect/PresetSelect';
+export type { PresetSelectProps as SelectProps, PresetSelectVariant as SelectVariant } from './PresetSelect/PresetSelect';
+export type { SelectOption, SelectOptionGroup, SelectTriggerRenderProps, SelectOptionRenderProps } from './PresetSelect/PresetSelect';
+export { PresetSlider as Slider } from './PresetSlider/PresetSlider';
+export type { PresetSliderProps as SliderProps, SliderMark } from './PresetSlider/PresetSlider';
+export { PresetCard as Card, PresetCardHeader as CardHeader, PresetCardBody as CardBody, PresetCardFooter as CardFooter, PresetCardMedia as CardMedia, PresetCardTitle as CardTitle, PresetCardSubtitle as CardSubtitle, PresetCardActions as CardActions } from './PresetCard/PresetCard';
+export type { PresetCardProps as CardProps, PresetCardVariant as CardVariant, PresetCardHeaderProps as CardHeaderProps, PresetCardBodyProps as CardBodyProps, PresetCardFooterProps as CardFooterProps, PresetCardMediaProps as CardMediaProps, PresetCardTitleProps as CardTitleProps, PresetCardSubtitleProps as CardSubtitleProps, PresetCardActionsProps as CardActionsProps } from './PresetCard/PresetCard';
+export { PresetAccordion as Accordion, PresetAccordionItem as AccordionItem, PresetAccordionTrigger as AccordionTrigger, PresetAccordionContent as AccordionContent } from './PresetAccordion/PresetAccordion';
+export type { PresetAccordionProps as AccordionProps, PresetAccordionItemProps as AccordionItemProps, PresetAccordionTriggerProps as AccordionTriggerProps, PresetAccordionContentProps as AccordionContentProps } from './PresetAccordion/PresetAccordion';
+export { PresetMenu as Menu, PresetMenuGroup as MenuGroup, PresetMenuItem as MenuItem, PresetMenuDivider as MenuDivider } from './PresetMenu/PresetMenu';
+export type { PresetMenuProps as MenuProps, PresetMenuGroupProps as MenuGroupProps, PresetMenuItemProps as MenuItemProps, PresetMenuSize } from './PresetMenu/PresetMenu';
+export { PresetTooltip as Tooltip } from './PresetTooltip/PresetTooltip';
+export type { PresetTooltipProps as TooltipProps, PresetTooltipVariant as TooltipVariant, PresetTooltipSize as TooltipSize } from './PresetTooltip/PresetTooltip';
+export { PresetRating as Rating } from './PresetRating/PresetRating';
+export type { PresetRatingProps as RatingProps } from './PresetRating/PresetRating';
+export { PresetSegmentedControl as SegmentedControl } from './PresetSegmentedControl/PresetSegmentedControl';
+export type { PresetSegmentedControlProps as SegmentedControlProps, PresetSegmentedControlVariant as SegmentedControlVariant, SegmentedControlOption } from './PresetSegmentedControl/PresetSegmentedControl';
+/** @deprecated Moved to containers/ tier. Import from '@mt-gloss/ui/catalog' -> UI.Form */
+export { ContainerForm as PresetForm, ContainerForm as Form, useFormContext } from '../containers/ContainerForm/ContainerForm';
+export type { ContainerFormProps as PresetFormProps, ContainerFormProps as FormProps, FormContextValue, FormErrors, FormTouched } from '../containers/ContainerForm/ContainerForm';
+/** @deprecated Moved to containers/ tier. Import from '@mt-gloss/ui/catalog' -> UI.FormField */
+export { ContainerFormField as PresetFormField, ContainerFormField as FormField } from '../containers/ContainerFormField/ContainerFormField';
+export type { ContainerFormFieldProps as PresetFormFieldProps, ContainerFormFieldProps as FormFieldProps } from '../containers/ContainerFormField/ContainerFormField';
+/** @deprecated Moved to composites/overlay/ tier. Import from '@mt-gloss/ui/catalog' -> UI.Dropdown */
+export { Dropdown as PresetDropdown, Dropdown } from '../composites/overlay/Dropdown/Dropdown';
+export type { DropdownProps as PresetDropdownProps, DropdownProps, DropdownItem } from '../composites/overlay/Dropdown/Dropdown';
+/** @deprecated Moved to wrappers/ tier. Import from '@mt-gloss/ui/catalog' -> UI.AsyncLoader */
+export { AsyncLoader as PresetAsyncLoader, AsyncLoader } from '../wrappers/AsyncLoader/AsyncLoader';
+export type { AsyncLoaderProps as PresetAsyncLoaderProps, AsyncLoaderProps } from '../wrappers/AsyncLoader/AsyncLoader';
+/** @deprecated Moved to wrappers/ tier. Import from '@mt-gloss/ui/catalog' -> UI.Transition */
+export { Transition as PresetTransition, Transition, TransitionGroup as PresetTransitionGroup, TransitionGroup } from '../wrappers/Transition/Transition';
+export type { TransitionProps as PresetTransitionProps, TransitionProps, TransitionGroupProps as PresetTransitionGroupProps, TransitionGroupProps } from '../wrappers/Transition/Transition';
+export { PresetDatePicker as DatePicker } from './PresetDatePicker/PresetDatePicker';
+export type { PresetDatePickerProps as DatePickerProps, PresetDatePickerVariant as DatePickerVariant } from './PresetDatePicker/PresetDatePicker';
+export { PresetTimePicker as TimePicker } from './PresetTimePicker/PresetTimePicker';
+export type { PresetTimePickerProps as TimePickerProps, PresetTimePickerVariant as TimePickerVariant } from './PresetTimePicker/PresetTimePicker';
+export { PresetDateRangePicker as DateRangePicker } from './PresetDateRangePicker/PresetDateRangePicker';
+export type { PresetDateRangePickerProps as DateRangePickerProps, PresetDateRangePickerVariant as DateRangePickerVariant, DateRange, DateRangePreset } from './PresetDateRangePicker/PresetDateRangePicker';
+export { PresetNumberInput as NumberInput } from './PresetNumberInput/PresetNumberInput';
+export type { PresetNumberInputProps as NumberInputProps, PresetNumberInputVariant as NumberInputVariant } from './PresetNumberInput/PresetNumberInput';
+export { PresetMaskedInput as MaskedInput, MaskPresets } from './PresetMaskedInput/PresetMaskedInput';
+export type { PresetMaskedInputProps as MaskedInputProps, MaskConfig, MaskPresetName } from './PresetMaskedInput/PresetMaskedInput';
+export { PresetFileUpload as FileUpload } from './PresetFileUpload/PresetFileUpload';
+export type { PresetFileUploadProps as FileUploadProps, FileUploadFile } from './PresetFileUpload/PresetFileUpload';
+export { PresetColorPicker as ColorPicker } from './PresetColorPicker/PresetColorPicker';
+export type { PresetColorPickerProps as ColorPickerProps, ColorFormat } from './PresetColorPicker/PresetColorPicker';
+export { PresetRangeSlider as RangeSlider } from './PresetRangeSlider/PresetRangeSlider';
+export type { PresetRangeSliderProps as RangeSliderProps } from './PresetRangeSlider/PresetRangeSlider';
+export { PresetSwatchRow } from './PresetSwatchRow/PresetSwatchRow';
+export type { PresetSwatchRowProps, SwatchOption } from './PresetSwatchRow/PresetSwatchRow';

package/lib/presets/types.d.ts

@@ -0,0 +1,13 @@
+import { default as React } from 'react';
+/** Shared size scale across all Preset Primitives */
+export type SharedSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/**
+ * Props that are NEVER exposed on Preset consumer API.
+ * These are structural escape hatches that only Base Primitives accept.
+ */
+export type DangerousProps = 'className' | 'style' | 'definition';
+/**
+ * Strip dangerous props from any HTML element attribute set.
+ * Used by Presets to lock down their consumer API.
+ */
+export type SafeHTMLProps<E extends HTMLElement> = Omit<React.HTMLAttributes<E>, DangerousProps>;

package/lib/primitives/Accordion.d.ts

@@ -1,103 +1,13 @@
-import { default as React } from 'react';
-export type AccordionShowCount = 'always' | 'collapsed-only' | 'never';
-export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * Content of the accordion (AccordionItem components)
-     */
-    children: React.ReactNode;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
-/**
- * Accordion - container for collapsible sections
- *
- * DOM Structure: `<div class="gloss-accordion">`
- *
- * @example
- * ```tsx
- * <Accordion>
- *   <AccordionItem defaultOpen>
- *     <AccordionTrigger>Section 1</AccordionTrigger>
- *     <AccordionContent>Content here</AccordionContent>
- *   </AccordionItem>
- * </Accordion>
- * ```
- */
-export declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
-export interface AccordionItemProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * Whether the item is expanded by default (uncontrolled)
-     */
-    defaultOpen?: boolean;
-    /**
-     * Controlled open state
-     */
-    open?: boolean;
-    /**
-     * Callback when open state changes
-     */
-    onOpenChange?: (open: boolean) => void;
-    /**
-     * When to show the item count badge
-     * - 'always': Always show count
-     * - 'collapsed-only': Show count only when collapsed (default)
-     * - 'never': Never show count
-     */
-    showCount?: AccordionShowCount;
-    /**
-     * Whether the item is disabled
-     */
-    disabled?: boolean;
-    /**
-     * Content of the item (AccordionTrigger and AccordionContent)
-     */
-    children: React.ReactNode;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
-/**
- * AccordionItem - individual collapsible section
- *
- * DOM Structure: `<div class="gloss-accordion-item">`
- */
-export declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
-export interface AccordionTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    /**
-     * Icon to display on the left side
-     */
-    icon?: React.ReactNode;
-    /**
-     * Content of the trigger (label text)
-     */
-    children: React.ReactNode;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
 /**
- * AccordionTrigger - clickable header that toggles the accordion
- *
- * DOM Structure: `<button class="gloss-accordion-trigger">`
- */
-export declare const AccordionTrigger: React.ForwardRefExoticComponent<AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>>;
-export interface AccordionContentProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * Content to display when expanded
-     */
-    children: React.ReactNode;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
-/**
- * AccordionContent - collapsible content area
- *
- * DOM Structure: `<div class="gloss-accordion-content">`
- */
-export declare const AccordionContent: React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
+ * @deprecated Import directly from '@mt-gloss/ui' instead.
+ * This file will be removed in Phase 23.
+ */
+export { PresetAccordion as Accordion } from '../presets/PresetAccordion/PresetAccordion';
+export { PresetAccordionItem as AccordionItem } from '../presets/PresetAccordion/PresetAccordion';
+export { PresetAccordionTrigger as AccordionTrigger } from '../presets/PresetAccordion/PresetAccordion';
+export { PresetAccordionContent as AccordionContent } from '../presets/PresetAccordion/PresetAccordion';
+export type { PresetAccordionProps as AccordionProps } from '../presets/PresetAccordion/PresetAccordion';
+export type { PresetAccordionItemProps as AccordionItemProps } from '../presets/PresetAccordion/PresetAccordion';
+export type { PresetAccordionTriggerProps as AccordionTriggerProps } from '../presets/PresetAccordion/PresetAccordion';
+export type { PresetAccordionContentProps as AccordionContentProps } from '../presets/PresetAccordion/PresetAccordion';
+export type AccordionShowCount = 'always' | 'collapsed-only' | 'never';

package/lib/primitives/AsyncLoader.d.ts

@@ -1,41 +1,6 @@
-import { default as React } from 'react';
-export interface AsyncLoaderProps {
-    /**
-     * Color variant for the loading animation
-     * @default 'blue'
-     */
-    color?: 'blue' | 'green';
-    /**
-     * Whether the loading animation is active
-     */
-    isLoading?: boolean;
-    /**
-     * Content to wrap (typically an Input component)
-     */
-    children?: React.ReactNode;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
 /**
- * AsyncLoader component - perimeter-tracing SVG animation wrapper
- *
- * DOM Structure:
- * - `.gloss-async` wrapper (with `--loading` and `--{color}` modifiers)
- * - `.gloss-async__container` containing two SVG elements
- * - `.gloss-async__rect` (static background rect)
- * - `.gloss-async__chaser` (animated chasing rect)
- *
- * @example
- * ```tsx
- * <AsyncLoader isLoading color="blue">
- *   <Input value="checking..." />
- * </AsyncLoader>
- *
- * <AsyncLoader isLoading color="green">
- *   <Input status="success" value="verified" />
- * </AsyncLoader>
- * ```
+ * @deprecated Import directly from '@mt-gloss/ui' instead.
+ * This file will be removed in Phase 23.
  */
-export declare const AsyncLoader: React.ForwardRefExoticComponent<AsyncLoaderProps & React.RefAttributes<HTMLDivElement>>;
+export { AsyncLoader } from '../wrappers/AsyncLoader/AsyncLoader';
+export type { AsyncLoaderProps } from '../wrappers/AsyncLoader/AsyncLoader';

package/lib/primitives/Badge.d.ts

@@ -1,42 +1,7 @@
-import { default as React } from 'react';
-export type BadgeVariant = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info';
-export type BadgeSize = 'sm' | 'md' | 'lg';
-export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
-    /**
-     * Color variant of the badge
-     */
-    variant?: BadgeVariant;
-    /**
-     * Size of the badge
-     */
-    size?: BadgeSize;
-    /**
-     * Whether to display as a small dot (ignores children)
-     */
-    dot?: boolean;
-    /**
-     * Whether the badge should have a subtle/soft appearance
-     */
-    soft?: boolean;
-    /**
-     * Content of the badge
-     */
-    children?: React.ReactNode;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
 /**
- * Badge component - small status indicator for labeling and categorization
- *
- * DOM Structure: `<span class="gloss-badge">`
- *
- * @example
- * ```tsx
- * <Badge variant="success">Active</Badge>
- * <Badge variant="error" dot />
- * <Badge variant="primary" size="lg">New</Badge>
- * ```
+ * @deprecated Import directly from '@mt-gloss/ui' instead.
+ * This file will be removed in Phase 23.
  */
-export declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
+export { PresetBadge as Badge } from '../presets/PresetBadge/PresetBadge';
+export type { PresetBadgeProps as BadgeProps, PresetBadgeVariant as BadgeVariant } from '../presets/PresetBadge/PresetBadge';
+export type BadgeSize = 'sm' | 'md' | 'lg';

package/lib/primitives/Button.d.ts

@@ -1,73 +1,6 @@
-import { default as React } from 'react';
-import { IconSlotProps } from '../types/icon';
-import { TooltipPlacement } from './Tooltip';
-export type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'outline' | 'danger' | 'danger-outline';
-export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, IconSlotProps {
-    /**
-     * Visual style variant
-     * @default 'primary'
-     */
-    variant?: ButtonVariant;
-    /**
-     * Button size
-     * @default 'md'
-     */
-    size?: 'sm' | 'md' | 'lg';
-    /**
-     * Loading state - shows spinner and disables interaction
-     */
-    isLoading?: boolean;
-    /**
-     * Disabled state
-     */
-    disabled?: boolean;
-    /**
-     * Error state - shows error icon and makes button clickable to fix errors
-     * If string, displays as tooltip. If true, shows icon without tooltip.
-     */
-    error?: string | boolean;
-    /**
-     * Renders button as icon-only (square aspect ratio)
-     * Requires leftIcon or rightIcon, and aria-label for accessibility
-     */
-    iconOnly?: boolean;
-    /**
-     * Makes button full width of container
-     */
-    fullWidth?: boolean;
-    /**
-     * Tooltip content - wraps button with Tooltip component
-     */
-    tooltip?: React.ReactNode;
-    /**
-     * Tooltip placement
-     * @default 'top'
-     */
-    tooltipPlacement?: TooltipPlacement;
-    /**
-     * Delay before showing tooltip (ms)
-     * @default 200
-     */
-    tooltipDelay?: number;
-    /**
-     * Content of the button
-     */
-    children?: React.ReactNode;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
 /**
- * Button component with tactile feedback and multiple variants
- *
- * DOM Structure: `<button class="gloss-btn gloss-btn--{variant}">`
- *
- * @example
- * ```tsx
- * <Button variant="primary">Save</Button>
- * <Button variant="secondary" disabled>Cancel</Button>
- * <Button variant="ghost" isLoading>Loading...</Button>
- * ```
+ * @deprecated Import directly from '@mt-gloss/ui' instead.
+ * This file will be removed in Phase 23.
  */
-export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { PresetButton as Button } from '../presets/PresetButton/PresetButton';
+export type { PresetButtonProps as ButtonProps, PresetButtonVariant as ButtonVariant } from '../presets/PresetButton/PresetButton';

package/lib/primitives/ButtonGroup.d.ts

@@ -1,72 +1,6 @@
-import { default as React } from 'react';
-import { ButtonVariant } from './Button';
-export interface ButtonGroupProps {
-    /**
-     * Button elements to group
-     */
-    children: React.ReactNode;
-    /**
-     * Orientation of the group
-     * @default 'horizontal'
-     */
-    orientation?: 'horizontal' | 'vertical';
-    /**
-     * Visual style for connected buttons (removes gaps, merges borders)
-     * @default false
-     */
-    attached?: boolean;
-    /**
-     * Size applied to all child buttons via context
-     */
-    size?: 'sm' | 'md' | 'lg';
-    /**
-     * Variant applied to all child buttons via context
-     */
-    variant?: ButtonVariant;
-    /**
-     * Full width distribution - buttons share available space equally
-     * @default false
-     */
-    fullWidth?: boolean;
-    /**
-     * Gap between buttons when not attached
-     * @default 'md'
-     */
-    gap?: 'none' | 'sm' | 'md' | 'lg';
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
-}
 /**
- * Context for sharing ButtonGroup props with child buttons
+ * @deprecated Import directly from '@mt-gloss/ui' instead.
+ * This file will be removed in Phase 23.
  */
-export interface ButtonGroupContextValue {
-    size?: 'sm' | 'md' | 'lg';
-    variant?: ButtonVariant;
-    isInGroup: boolean;
-}
-export declare const ButtonGroupContext: React.Context<ButtonGroupContextValue>;
-/**
- * ButtonGroup component for grouping related buttons
- *
- * DOM Structure: `<div class="gloss-btn-group">`
- *
- * @example
- * ```tsx
- * // Attached button group
- * <ButtonGroup attached>
- *   <Button>Left</Button>
- *   <Button>Center</Button>
- *   <Button>Right</Button>
- * </ButtonGroup>
- *
- * // Vertical button group
- * <ButtonGroup orientation="vertical" variant="secondary">
- *   <Button>Option 1</Button>
- *   <Button>Option 2</Button>
- *   <Button>Option 3</Button>
- * </ButtonGroup>
- * ```
- */
-export declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
+export { ButtonGroup, ButtonGroupContext } from '../wrappers/ButtonGroup/ButtonGroup';
+export type { ButtonGroupProps, ButtonGroupContextValue } from '../wrappers/ButtonGroup/ButtonGroup';