@nationaldesignstudio/react 0.5.0 → 0.5.2

package/dist/components/atoms/input/input-group.d.ts

@@ -1,278 +0,0 @@
-import { VariantProps } from 'tailwind-variants';
-import { ButtonProps } from '../button';
-import type * as React from "react";
-declare const inputGroupVariants: import('tailwind-variants').TVReturnType<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}>, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}>, unknown, unknown, undefined>>;
-declare const inputGroupAddonVariants: import('tailwind-variants').TVReturnType<{
-    align: {
-        "inline-start": string[];
-        "inline-end": string[];
-        "block-start": string[];
-        "block-end": string[];
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    align: {
-        "inline-start": string[];
-        "inline-end": string[];
-        "block-start": string[];
-        "block-end": string[];
-    };
-}, {
-    align: {
-        "inline-start": string[];
-        "inline-end": string[];
-        "block-start": string[];
-        "block-end": string[];
-    };
-}>, {
-    align: {
-        "inline-start": string[];
-        "inline-end": string[];
-        "block-start": string[];
-        "block-end": string[];
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    align: {
-        "inline-start": string[];
-        "inline-end": string[];
-        "block-start": string[];
-        "block-end": string[];
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    align: {
-        "inline-start": string[];
-        "inline-end": string[];
-        "block-start": string[];
-        "block-end": string[];
-    };
-}, {
-    align: {
-        "inline-start": string[];
-        "inline-end": string[];
-        "block-start": string[];
-        "block-end": string[];
-    };
-}>, unknown, unknown, undefined>>;
-export interface InputGroupProps extends React.FieldsetHTMLAttributes<HTMLFieldSetElement>, VariantProps<typeof inputGroupVariants> {
-}
-/**
- * InputGroup component for combining inputs with addons, buttons, and text.
- *
- * A container that groups an input with prefix/suffix addons, icons, or buttons.
- * Supports inline (left/right) and block (top/bottom) addon positioning.
- *
- * Uses semantic UI tokens for theming support.
- *
- * @example
- * ```tsx
- * // With prefix icon
- * <InputGroup>
- *   <InputGroupAddon>
- *     <SearchIcon />
- *   </InputGroupAddon>
- *   <InputGroupInput placeholder="Search..." />
- * </InputGroup>
- *
- * // With suffix button
- * <InputGroup>
- *   <InputGroupInput placeholder="Enter email" />
- *   <InputGroupAddon align="inline-end">
- *     <InputGroupButton>Subscribe</InputGroupButton>
- *   </InputGroupAddon>
- * </InputGroup>
- *
- * // With text prefix
- * <InputGroup>
- *   <InputGroupAddon>
- *     <InputGroupText>https://</InputGroupText>
- *   </InputGroupAddon>
- *   <InputGroupInput placeholder="example.com" />
- * </InputGroup>
- * ```
- */
-declare function InputGroup({ className, size, disabled, ...props }: InputGroupProps): import("react/jsx-runtime").JSX.Element;
-export interface InputGroupAddonProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof inputGroupAddonVariants> {
-}
-/**
- * InputGroupAddon component for positioning addons within an InputGroup.
- *
- * Can contain icons, text, or buttons. Clicking the addon focuses the input.
- *
- * @example
- * ```tsx
- * // Inline start (default - left side)
- * <InputGroupAddon>
- *   <SearchIcon />
- * </InputGroupAddon>
- *
- * // Inline end (right side)
- * <InputGroupAddon align="inline-end">
- *   <InputGroupButton>Submit</InputGroupButton>
- * </InputGroupAddon>
- *
- * // Block positions (top/bottom)
- * <InputGroupAddon align="block-start">
- *   <label>Email Address</label>
- * </InputGroupAddon>
- * ```
- */
-declare function InputGroupAddon({ className, align, onClick, onKeyDown, ...props }: InputGroupAddonProps): import("react/jsx-runtime").JSX.Element;
-declare const inputGroupButtonVariants: import('tailwind-variants').TVReturnType<{
-    size: {
-        xs: string;
-        sm: string;
-        "icon-xs": string;
-        "icon-sm": string;
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        xs: string;
-        sm: string;
-        "icon-xs": string;
-        "icon-sm": string;
-    };
-}, {
-    size: {
-        xs: string;
-        sm: string;
-        "icon-xs": string;
-        "icon-sm": string;
-    };
-}>, {
-    size: {
-        xs: string;
-        sm: string;
-        "icon-xs": string;
-        "icon-sm": string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        xs: string;
-        sm: string;
-        "icon-xs": string;
-        "icon-sm": string;
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        xs: string;
-        sm: string;
-        "icon-xs": string;
-        "icon-sm": string;
-    };
-}, {
-    size: {
-        xs: string;
-        sm: string;
-        "icon-xs": string;
-        "icon-sm": string;
-    };
-}>, unknown, unknown, undefined>>;
-export interface InputGroupButtonProps extends Omit<ButtonProps, "size">, VariantProps<typeof inputGroupButtonVariants> {
-}
-/**
- * InputGroupButton component for inline buttons within an InputGroup.
- *
- * A small button variant designed to fit inside input groups.
- *
- * @example
- * ```tsx
- * <InputGroupAddon align="inline-end">
- *   <InputGroupButton>Submit</InputGroupButton>
- * </InputGroupAddon>
- *
- * // Icon button
- * <InputGroupAddon align="inline-end">
- *   <InputGroupButton size="icon-xs">
- *     <ClearIcon />
- *   </InputGroupButton>
- * </InputGroupAddon>
- * ```
- */
-declare function InputGroupButton({ className, type, variant, size, ...props }: InputGroupButtonProps): import("react/jsx-runtime").JSX.Element;
-export interface InputGroupTextProps extends React.HTMLAttributes<HTMLSpanElement> {
-}
-/**
- * InputGroupText component for static text within an InputGroup.
- *
- * Use for prefixes like "https://" or suffixes like ".com"
- *
- * @example
- * ```tsx
- * <InputGroupAddon>
- *   <InputGroupText>https://</InputGroupText>
- * </InputGroupAddon>
- * ```
- */
-declare function InputGroupText({ className, ...props }: InputGroupTextProps): import("react/jsx-runtime").JSX.Element;
-export interface InputGroupInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
-}
-/**
- * InputGroupInput component - the input element within an InputGroup.
- *
- * Styled to integrate seamlessly with the InputGroup container.
- *
- * @example
- * ```tsx
- * <InputGroup>
- *   <InputGroupInput placeholder="Enter text..." />
- * </InputGroup>
- * ```
- */
-declare function InputGroupInput({ className, ...props }: InputGroupInputProps): import("react/jsx-runtime").JSX.Element;
-export interface InputGroupTextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
-}
-/**
- * InputGroupTextarea component - a textarea element within an InputGroup.
- *
- * Styled to integrate seamlessly with the InputGroup container.
- *
- * @example
- * ```tsx
- * <InputGroup>
- *   <InputGroupTextarea placeholder="Enter long text..." rows={4} />
- * </InputGroup>
- * ```
- */
-declare function InputGroupTextarea({ className, ...props }: InputGroupTextareaProps): import("react/jsx-runtime").JSX.Element;
-export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea, inputGroupVariants, inputGroupAddonVariants, };

package/dist/components/atoms/input/input.d.ts

@@ -1,121 +0,0 @@
-import { VariantProps } from 'tailwind-variants';
-import * as React from "react";
-/**
- * Input variants for styling based on Figma BaseKit / Interface / Input
- *
- * States (handled via CSS pseudo-classes and props):
- * - Default: White background, subtle border
- * - Hover: Light gray background (via :hover)
- * - Focus: Accent border with focus ring (via :focus-visible)
- * - Error: Error border color (via error prop)
- * - Disabled: Disabled background (via :disabled)
- *
- * Sizes:
- * - sm: Smaller height and padding (36px)
- * - default: Standard height (48px)
- * - lg: Larger height and padding (56px)
- */
-declare const inputVariants: import('tailwind-variants').TVReturnType<{
-    size: {
-        readonly sm: "h-spatial-ui-input-height-small px-spatial-ui-input-padding-x-small py-spatial-ui-input-padding-y-small typography-body-sm-md";
-        readonly default: "h-spatial-ui-input-height-medium px-spatial-ui-input-padding-x-medium py-spatial-ui-input-padding-y-medium typography-body-md-md";
-        readonly lg: "h-spatial-ui-input-height-large px-spatial-ui-input-padding-x-large py-spatial-ui-input-padding-y-large typography-body-md-lg";
-    };
-    error: {
-        true: string;
-        false: "";
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        readonly sm: "h-spatial-ui-input-height-small px-spatial-ui-input-padding-x-small py-spatial-ui-input-padding-y-small typography-body-sm-md";
-        readonly default: "h-spatial-ui-input-height-medium px-spatial-ui-input-padding-x-medium py-spatial-ui-input-padding-y-medium typography-body-md-md";
-        readonly lg: "h-spatial-ui-input-height-large px-spatial-ui-input-padding-x-large py-spatial-ui-input-padding-y-large typography-body-md-lg";
-    };
-    error: {
-        true: string;
-        false: "";
-    };
-}, {
-    size: {
-        readonly sm: "h-spatial-ui-input-height-small px-spatial-ui-input-padding-x-small py-spatial-ui-input-padding-y-small typography-body-sm-md";
-        readonly default: "h-spatial-ui-input-height-medium px-spatial-ui-input-padding-x-medium py-spatial-ui-input-padding-y-medium typography-body-md-md";
-        readonly lg: "h-spatial-ui-input-height-large px-spatial-ui-input-padding-x-large py-spatial-ui-input-padding-y-large typography-body-md-lg";
-    };
-    error: {
-        true: string;
-        false: "";
-    };
-}>, {
-    size: {
-        readonly sm: "h-spatial-ui-input-height-small px-spatial-ui-input-padding-x-small py-spatial-ui-input-padding-y-small typography-body-sm-md";
-        readonly default: "h-spatial-ui-input-height-medium px-spatial-ui-input-padding-x-medium py-spatial-ui-input-padding-y-medium typography-body-md-md";
-        readonly lg: "h-spatial-ui-input-height-large px-spatial-ui-input-padding-x-large py-spatial-ui-input-padding-y-large typography-body-md-lg";
-    };
-    error: {
-        true: string;
-        false: "";
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        readonly sm: "h-spatial-ui-input-height-small px-spatial-ui-input-padding-x-small py-spatial-ui-input-padding-y-small typography-body-sm-md";
-        readonly default: "h-spatial-ui-input-height-medium px-spatial-ui-input-padding-x-medium py-spatial-ui-input-padding-y-medium typography-body-md-md";
-        readonly lg: "h-spatial-ui-input-height-large px-spatial-ui-input-padding-x-large py-spatial-ui-input-padding-y-large typography-body-md-lg";
-    };
-    error: {
-        true: string;
-        false: "";
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        readonly sm: "h-spatial-ui-input-height-small px-spatial-ui-input-padding-x-small py-spatial-ui-input-padding-y-small typography-body-sm-md";
-        readonly default: "h-spatial-ui-input-height-medium px-spatial-ui-input-padding-x-medium py-spatial-ui-input-padding-y-medium typography-body-md-md";
-        readonly lg: "h-spatial-ui-input-height-large px-spatial-ui-input-padding-x-large py-spatial-ui-input-padding-y-large typography-body-md-lg";
-    };
-    error: {
-        true: string;
-        false: "";
-    };
-}, {
-    size: {
-        readonly sm: "h-spatial-ui-input-height-small px-spatial-ui-input-padding-x-small py-spatial-ui-input-padding-y-small typography-body-sm-md";
-        readonly default: "h-spatial-ui-input-height-medium px-spatial-ui-input-padding-x-medium py-spatial-ui-input-padding-y-medium typography-body-md-md";
-        readonly lg: "h-spatial-ui-input-height-large px-spatial-ui-input-padding-x-large py-spatial-ui-input-padding-y-large typography-body-md-lg";
-    };
-    error: {
-        true: string;
-        false: "";
-    };
-}>, unknown, unknown, undefined>>;
-export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size">, VariantProps<typeof inputVariants> {
-    /**
-     * Whether the input is in an error state
-     */
-    error?: boolean;
-}
-/**
- * Input component based on Figma BaseKit / Interface / Input
- *
- * A styled text input with support for various states:
- * - Default, hover, focus, error, and disabled states
- * - Three size variants: sm, default, lg
- *
- * Uses semantic UI tokens for theming support.
- *
- * @example
- * ```tsx
- * // Basic usage
- * <Input placeholder="Enter your email" />
- *
- * // With error state
- * <Input error placeholder="Invalid input" />
- *
- * // Different sizes
- * <Input size="sm" placeholder="Small" />
- * <Input size="lg" placeholder="Large" />
- *
- * // Disabled
- * <Input disabled placeholder="Disabled input" />
- * ```
- */
-declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
-export { Input, inputVariants };

package/dist/components/atoms/ndstudio-footer/ndstudio-footer.d.ts

@@ -1,30 +0,0 @@
-import * as React from "react";
-export interface NdstudioFooterProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * The URL to link to
-     * @default "https://ndstudio.gov"
-     */
-    href?: string;
-}
-/**
- * NdstudioFooter component displays a "Designed and Engineered in DC by National Design Studio" footer link.
- *
- * This component is designed to be used as a footer within other components like Tout,
- * but can also be used standalone.
- *
- * @example
- * ```tsx
- * // Used within a Tout component via footer slot
- * <Tout
- *   headline="Feature Headline"
- *   primaryAction={<Button>Primary</Button>}
- *   backgroundMedia={<img src="/bg.jpg" alt="" />}
- *   footer={<NdstudioFooter />}
- * />
- *
- * // Standalone usage
- * <NdstudioFooter className="my-custom-class" />
- * ```
- */
-declare const NdstudioFooter: React.ForwardRefExoticComponent<NdstudioFooterProps & React.RefAttributes<HTMLDivElement>>;
-export { NdstudioFooter };

package/dist/components/atoms/pager-control/pager-control.d.ts

@@ -1,169 +0,0 @@
-import { VariantProps } from 'tailwind-variants';
-import * as React from "react";
-declare const pagerControlVariants: import('tailwind-variants').TVReturnType<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, undefined, "flex items-center", import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}>, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, undefined, "flex items-center", import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-}>, unknown, unknown, undefined>>;
-declare const dotBaseVariants: import('tailwind-variants').TVReturnType<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-    variant: {
-        charcoal: string;
-        ivory: string;
-    };
-}, undefined, "cursor-pointer rounded-full transition-all duration-500 ease-[cubic-bezier(0.23,1,0.32,1)]", import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-    variant: {
-        charcoal: string;
-        ivory: string;
-    };
-}, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-    variant: {
-        charcoal: string;
-        ivory: string;
-    };
-}>, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-    variant: {
-        charcoal: string;
-        ivory: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-    variant: {
-        charcoal: string;
-        ivory: string;
-    };
-}, undefined, "cursor-pointer rounded-full transition-all duration-500 ease-[cubic-bezier(0.23,1,0.32,1)]", import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-    variant: {
-        charcoal: string;
-        ivory: string;
-    };
-}, {
-    size: {
-        sm: string;
-        default: string;
-        lg: string;
-    };
-    variant: {
-        charcoal: string;
-        ivory: string;
-    };
-}>, unknown, unknown, undefined>>;
-export interface PagerControlProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange">, VariantProps<typeof pagerControlVariants>, VariantProps<typeof dotBaseVariants> {
-    /**
-     * Total number of pages/items
-     */
-    count: number;
-    /**
-     * Current active page index (0-based)
-     */
-    activeIndex?: number;
-    /**
-     * Duration in milliseconds for each page before auto-advancing
-     * Set to 0 to disable auto-advance
-     * @default 5000
-     */
-    duration?: number;
-    /**
-     * Whether the pager should auto-advance
-     * @default true
-     */
-    autoPlay?: boolean;
-    /**
-     * Callback when the active page changes
-     */
-    onChange?: (index: number) => void;
-    /**
-     * Whether to pause auto-advance on hover
-     * @default true
-     */
-    pauseOnHover?: boolean;
-    /**
-     * Whether to loop back to the first page after the last
-     * @default true
-     */
-    loop?: boolean;
-}
-/**
- * PagerControl component for indicating progress through a series of pages/slides.
- *
- * Features smooth width transitions when switching between dots and an animated
- * progress fill on the active dot that shows time remaining before auto-advancing
- * (similar to Apple's carousel indicators).
- *
- * Variants:
- * - charcoal: Dark dots (for light backgrounds)
- * - ivory: Light dots (for dark backgrounds)
- *
- * Sizes:
- * - sm: Small dots (6px height)
- * - default: Medium dots (10px height)
- * - lg: Large dots (16px height)
- */
-declare const PagerControl: React.ForwardRefExoticComponent<PagerControlProps & React.RefAttributes<HTMLDivElement>>;
-export { PagerControl, pagerControlVariants };