@staqforce.studio/staqui 0.0.0-stage → 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,666 @@
+import * as lucide_react from 'lucide-react';
+import { LucideIcon } from 'lucide-react';
+import * as react from 'react';
+import { HTMLAttributes, CSSProperties, ReactNode, ImgHTMLAttributes, OlHTMLAttributes, ButtonHTMLAttributes, AnchorHTMLAttributes, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes, ReactElement } from 'react';
+import { Matcher, DayPicker, DateRange } from 'react-day-picker';
+export { DateRange, Matcher } from 'react-day-picker';
+
+type Tone = "neutral" | "success" | "warning" | "critical" | "info";
+type Size = "small" | "medium" | "large";
+type Space = "0" | "1" | "2" | "3" | "4" | "6" | "8";
+declare const cx: (...values: (string | undefined | false)[]) => string;
+declare function useControllable<T>(value: T | undefined, defaultValue: T, onChange?: (value: T) => void, controlled?: boolean): readonly [T, (next: T) => void];
+
+type Density = "compact" | "comfortable";
+interface StaqProviderProps extends HTMLAttributes<HTMLDivElement> {
+    theme?: "light" | "dark" | "staqwish";
+    density?: Density;
+}
+declare const StaqContext: react.Context<{
+    theme: "light" | "dark" | "staqwish";
+    density: Density;
+}>;
+declare const useStaq: () => {
+    theme: "light" | "dark" | "staqwish";
+    density: Density;
+};
+declare function StaqProvider({ theme, density, className, ...props }: StaqProviderProps): react.JSX.Element;
+declare const icons: {
+    check: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    close: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    search: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    plus: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    chevronDown: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    chevronLeft: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    chevronRight: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    info: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    warning: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    settings: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    copy: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    arrowUpRight: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    package: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    upload: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    moon: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    sun: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    sliders: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    code: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    layers: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+    complete: react.ForwardRefExoticComponent<Omit<lucide_react.LucideProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
+};
+interface IconProps {
+    name?: keyof typeof icons;
+    source?: LucideIcon;
+    size?: number;
+    label?: string;
+    className?: string;
+}
+declare function Icon({ name, source, size, label, className, }: IconProps): react.JSX.Element;
+interface BoxProps extends HTMLAttributes<HTMLDivElement> {
+    padding?: Space;
+    background?: "surface" | "subtle" | "transparent";
+    border?: boolean;
+    radius?: "small" | "medium" | "large";
+}
+declare function Box({ padding, background, border, radius, className, style, ...props }: BoxProps): react.JSX.Element;
+interface StackProps extends HTMLAttributes<HTMLDivElement> {
+    direction?: "row" | "column";
+    gap?: Space;
+    align?: CSSProperties["alignItems"];
+    justify?: CSSProperties["justifyContent"];
+    wrap?: boolean;
+}
+declare function Stack({ direction, gap, align, justify, wrap, className, style, ...props }: StackProps): react.JSX.Element;
+interface GridProps extends HTMLAttributes<HTMLDivElement> {
+    columns?: number;
+    minColumnWidth?: string;
+    gap?: Space;
+}
+declare function Grid({ columns, minColumnWidth, gap, style, className, ...props }: GridProps): react.JSX.Element;
+declare function QueryContainer({ name, style, ...props }: HTMLAttributes<HTMLDivElement> & {
+    name?: string;
+}): react.JSX.Element;
+declare function Divider({ vertical, className, ...props }: HTMLAttributes<HTMLHRElement> & {
+    vertical?: boolean;
+}): react.JSX.Element;
+interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
+    size?: Size;
+}
+declare function Heading({ level, size, className, ...props }: HeadingProps): react.DetailedReactHTMLElement<{
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
+    autoFocus?: boolean | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
+    hidden?: boolean | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    nonce?: string | undefined;
+    slot?: string | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    style?: CSSProperties | undefined;
+    tabIndex?: number | undefined;
+    title?: string | undefined;
+    translate?: "yes" | "no" | undefined;
+    radioGroup?: string | undefined;
+    role?: react.AriaRole | undefined;
+    about?: string | undefined;
+    content?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    rel?: string | undefined;
+    resource?: string | undefined;
+    rev?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    color?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "on" | "off" | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined;
+    popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
+    popoverTarget?: string | undefined;
+    inert?: boolean | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
+    is?: string | undefined;
+    exportparts?: string | undefined;
+    part?: string | undefined;
+    "aria-activedescendant"?: string | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
+    "aria-braillelabel"?: string | undefined;
+    "aria-brailleroledescription"?: string | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
+    "aria-colcount"?: number | undefined;
+    "aria-colindex"?: number | undefined;
+    "aria-colindextext"?: string | undefined;
+    "aria-colspan"?: number | undefined;
+    "aria-controls"?: string | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
+    "aria-describedby"?: string | undefined;
+    "aria-description"?: string | undefined;
+    "aria-details"?: string | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
+    "aria-errormessage"?: string | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+    "aria-keyshortcuts"?: string | undefined;
+    "aria-label"?: string | undefined;
+    "aria-labelledby"?: string | undefined;
+    "aria-level"?: number | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
+    "aria-owns"?: string | undefined;
+    "aria-placeholder"?: string | undefined;
+    "aria-posinset"?: number | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined;
+    "aria-rowcount"?: number | undefined;
+    "aria-rowindex"?: number | undefined;
+    "aria-rowindextext"?: string | undefined;
+    "aria-rowspan"?: number | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+    "aria-valuemax"?: number | undefined;
+    "aria-valuemin"?: number | undefined;
+    "aria-valuenow"?: number | undefined;
+    "aria-valuetext"?: string | undefined;
+    children?: ReactNode | undefined;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined;
+    onCopy?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
+    onCopyCapture?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
+    onCut?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
+    onCutCapture?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
+    onPaste?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
+    onPasteCapture?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
+    onCompositionEnd?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
+    onCompositionEndCapture?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
+    onCompositionStart?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
+    onCompositionStartCapture?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
+    onCompositionUpdate?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
+    onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
+    onFocus?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
+    onFocusCapture?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
+    onBlur?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
+    onBlurCapture?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
+    onChange?: react.ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
+    onChangeCapture?: react.ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
+    onBeforeInput?: react.InputEventHandler<HTMLHeadingElement> | undefined;
+    onBeforeInputCapture?: react.InputEventHandler<HTMLHeadingElement> | undefined;
+    onInput?: react.InputEventHandler<HTMLHeadingElement> | undefined;
+    onInputCapture?: react.InputEventHandler<HTMLHeadingElement> | undefined;
+    onReset?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onResetCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSubmit?: react.SubmitEventHandler<HTMLHeadingElement> | undefined;
+    onSubmitCapture?: react.SubmitEventHandler<HTMLHeadingElement> | undefined;
+    onInvalid?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onInvalidCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoad?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoadCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onError?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onErrorCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onKeyDown?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
+    onKeyDownCapture?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
+    onKeyPress?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
+    onKeyPressCapture?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
+    onKeyUp?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
+    onKeyUpCapture?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
+    onAbort?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onAbortCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onCanPlay?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onCanPlayCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onCanPlayThrough?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onCanPlayThroughCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onDurationChange?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onDurationChangeCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onEmptied?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onEmptiedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onEncrypted?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onEncryptedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onEnded?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onEndedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoadedData?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoadedDataCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoadedMetadata?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoadedMetadataCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoadStart?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onLoadStartCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onPause?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onPauseCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onPlay?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onPlayCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onPlaying?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onPlayingCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onProgress?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onProgressCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onRateChange?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onRateChangeCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSeeked?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSeekedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSeeking?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSeekingCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onStalled?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onStalledCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSuspend?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSuspendCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onTimeUpdate?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onTimeUpdateCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onVolumeChange?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onVolumeChangeCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onWaiting?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onWaitingCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onAuxClick?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onAuxClickCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onClick?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onClickCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onContextMenu?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onContextMenuCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onDoubleClick?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onDoubleClickCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onDrag?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragEnd?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragEndCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragEnter?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragEnterCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragExit?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragExitCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragLeave?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragLeaveCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragOver?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragOverCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragStart?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDragStartCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDrop?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onDropCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
+    onMouseDown?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseDownCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseEnter?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseLeave?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseMove?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseMoveCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseOut?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseOutCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseOver?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseOverCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseUp?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onMouseUpCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
+    onSelect?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onSelectCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
+    onTouchCancel?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onTouchCancelCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onTouchEnd?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onTouchEndCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onTouchMove?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onTouchMoveCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onTouchStart?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onTouchStartCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
+    onPointerDown?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerDownCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerMove?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerMoveCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerUp?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerUpCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerCancel?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerCancelCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerEnter?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerLeave?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerOver?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerOverCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerOut?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onPointerOutCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onGotPointerCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onLostPointerCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
+    onScroll?: react.UIEventHandler<HTMLHeadingElement> | undefined;
+    onScrollCapture?: react.UIEventHandler<HTMLHeadingElement> | undefined;
+    onScrollEnd?: react.UIEventHandler<HTMLHeadingElement> | undefined;
+    onScrollEndCapture?: react.UIEventHandler<HTMLHeadingElement> | undefined;
+    onWheel?: react.WheelEventHandler<HTMLHeadingElement> | undefined;
+    onWheelCapture?: react.WheelEventHandler<HTMLHeadingElement> | undefined;
+    onAnimationStart?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
+    onAnimationStartCapture?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
+    onAnimationEnd?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
+    onAnimationEndCapture?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
+    onAnimationIteration?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
+    onAnimationIterationCapture?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
+    onToggle?: react.ToggleEventHandler<HTMLHeadingElement> | undefined;
+    onBeforeToggle?: react.ToggleEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionCancel?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionCancelCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionEnd?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionEndCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionRun?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionRunCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionStart?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    onTransitionStartCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
+    className: string;
+}, HTMLElement>;
+interface TextProps extends HTMLAttributes<HTMLSpanElement> {
+    tone?: Tone | "muted";
+    weight?: "regular" | "medium" | "bold";
+    size?: Size;
+}
+declare function Text({ tone, weight, size, className, ...props }: TextProps): react.JSX.Element;
+declare function Paragraph({ tone, className, ...props }: HTMLAttributes<HTMLParagraphElement> & {
+    tone?: Tone | "muted";
+}): react.JSX.Element;
+interface NumberProps extends Omit<TextProps, "children"> {
+    value: number;
+    locale?: string;
+    format?: Intl.NumberFormatOptions;
+}
+declare function Number({ value, locale, format, className, ...props }: NumberProps): react.JSX.Element;
+declare function OrderedList(props: OlHTMLAttributes<HTMLOListElement>): react.JSX.Element;
+declare function UnorderedList(props: HTMLAttributes<HTMLUListElement>): react.JSX.Element;
+declare function ListItem(props: HTMLAttributes<HTMLLIElement>): react.JSX.Element;
+interface SectionProps extends HTMLAttributes<HTMLElement> {
+    heading?: string;
+    description?: ReactNode;
+    action?: ReactNode;
+}
+declare function Section({ heading, description, action, children, className, ...props }: SectionProps): react.JSX.Element;
+interface PageProps extends SectionProps {
+    aside?: ReactNode;
+    breadcrumbs?: ReactNode;
+    width?: "default" | "wide" | "narrow";
+}
+declare function Page({ heading, description, action, aside, breadcrumbs, width, className, children, ...props }: PageProps): react.JSX.Element;
+interface ImageProps extends ImgHTMLAttributes<HTMLImageElement> {
+    alt: string;
+    fit?: CSSProperties["objectFit"];
+    aspectRatio?: string;
+}
+declare function Image({ alt, fit, aspectRatio, style, className, ...props }: ImageProps): react.JSX.Element;
+declare function Thumbnail({ size, className, ...props }: ImageProps & {
+    size?: Size;
+}): react.JSX.Element;
+interface AvatarProps {
+    name: string;
+    src?: string;
+    size?: Size;
+    className?: string;
+}
+declare function Avatar({ name, src, size, className }: AvatarProps): react.JSX.Element;
+
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: "primary" | "secondary" | "tertiary";
+    tone?: "neutral" | "critical";
+    size?: Size;
+    loading?: boolean;
+    icon?: ReactNode;
+    fullWidth?: boolean;
+    asChild?: boolean;
+}
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
+declare function ButtonGroup({ label, className, ...props }: HTMLAttributes<HTMLDivElement> & {
+    label: string;
+}): react.JSX.Element;
+declare const Clickable: react.ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & react.RefAttributes<HTMLButtonElement>>;
+interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    tone?: "neutral" | "critical";
+    variant?: "text" | "button";
+}
+declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLAnchorElement>>;
+interface ChipProps extends HTMLAttributes<HTMLSpanElement> {
+    onRemove?: () => void;
+    removeLabel?: string;
+    tone?: Tone;
+}
+declare function Chip({ onRemove, removeLabel, tone, className, children, ...props }: ChipProps): react.JSX.Element;
+interface ClickableChipProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    selected?: boolean;
+    onRemove?: () => void;
+    removeLabel?: string;
+}
+declare function ClickableChip({ selected, onRemove, removeLabel, className, children, ...props }: ClickableChipProps): react.JSX.Element;
+interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    tone?: Tone;
+    size?: "small" | "medium";
+    icon?: ReactNode;
+}
+declare function Badge({ tone, size, icon, className, children, ...props }: BadgeProps): react.JSX.Element;
+interface BannerProps extends HTMLAttributes<HTMLDivElement> {
+    title: string;
+    tone?: Tone;
+    dismissible?: boolean;
+    onDismiss?: () => void;
+    action?: ReactNode;
+}
+declare function Banner({ title, tone, dismissible, onDismiss, action, className, children, ...props }: BannerProps): react.JSX.Element | null;
+declare function EmptyState({ title, children, action, graphic, }: {
+    title: string;
+    children?: ReactNode;
+    action?: ReactNode;
+    graphic?: ReactNode;
+}): react.JSX.Element;
+interface ProgressProps {
+    value?: number;
+    max?: number;
+    label: string;
+    showValue?: boolean;
+}
+declare function Progress({ value, max, label, showValue, }: ProgressProps): react.JSX.Element;
+declare function Spinner({ label, size, }: {
+    label?: string;
+    size?: Size;
+}): react.JSX.Element;
+
+interface FieldBase {
+    label: string;
+    description?: string;
+    error?: string;
+    hideLabel?: boolean;
+}
+interface TextFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "prefix">, FieldBase {
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    onValueChange?: (value: string) => void;
+}
+declare const TextField: react.ForwardRefExoticComponent<TextFieldProps & react.RefAttributes<HTMLInputElement>>;
+declare function EmailField(props: TextFieldProps): react.JSX.Element;
+declare function URLField(props: TextFieldProps): react.JSX.Element;
+declare function SearchField(props: TextFieldProps): react.JSX.Element;
+declare function NumberField(props: TextFieldProps): react.JSX.Element;
+interface MoneyFieldProps extends TextFieldProps {
+    currency?: string;
+    locale?: string;
+}
+declare function MoneyField({ currency, locale, ...props }: MoneyFieldProps): react.JSX.Element;
+declare function PasswordField(props: TextFieldProps): react.JSX.Element;
+declare function DateField(props: TextFieldProps): react.JSX.Element;
+interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement>, FieldBase {
+    onValueChange?: (value: string) => void;
+}
+declare const TextArea: react.ForwardRefExoticComponent<TextAreaProps & react.RefAttributes<HTMLTextAreaElement>>;
+interface SelectOption {
+    label: string;
+    value: string;
+    disabled?: boolean;
+    group?: string;
+}
+interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement>, FieldBase {
+    options: SelectOption[];
+    placeholder?: string;
+    onValueChange?: (value: string) => void;
+}
+declare const Select: react.ForwardRefExoticComponent<SelectProps & react.RefAttributes<HTMLSelectElement>>;
+interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size">, FieldBase {
+    indeterminate?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+}
+declare function Checkbox({ label, description, error, hideLabel, id: givenId, indeterminate, onCheckedChange, onChange, className, ...props }: CheckboxProps): react.JSX.Element;
+declare function Switch(props: Omit<CheckboxProps, "indeterminate">): react.JSX.Element;
+interface ChoiceListProps extends FieldBase {
+    options: SelectOption[];
+    value?: string[];
+    defaultValue?: string[];
+    onValueChange?: (value: string[]) => void;
+    multiple?: boolean;
+    disabled?: boolean;
+    name?: string;
+    required?: boolean;
+}
+declare function ChoiceList({ label, options, value, defaultValue, onValueChange, multiple, disabled, name, required, description, error, hideLabel, }: ChoiceListProps): react.JSX.Element;
+interface ColorPickerProps {
+    label?: string;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    disabled?: boolean;
+    name?: string;
+}
+declare function ColorPicker({ label, value, defaultValue, onValueChange, ...props }: ColorPickerProps): react.JSX.Element;
+declare function ColorField({ value, defaultValue, onValueChange, onChange, ...props }: TextFieldProps): react.JSX.Element;
+interface DropZoneProps extends FieldBase {
+    accept?: string;
+    multiple?: boolean;
+    disabled?: boolean;
+    maxSize?: number;
+    name?: string;
+    required?: boolean;
+    onFilesChange?: (files: File[]) => void;
+    onReject?: (message: string) => void;
+}
+declare function DropZone({ label, description, error, accept, multiple, disabled, maxSize, name, required, onFilesChange, onReject, }: DropZoneProps): react.JSX.Element;
+
+interface ModalProps {
+    title: string;
+    description: string;
+    trigger?: ReactElement;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    children: ReactNode;
+    footer?: ReactNode;
+    size?: Size;
+}
+declare function Modal({ title, description, trigger, children, footer, size, ...props }: ModalProps): react.JSX.Element;
+interface PopoverProps {
+    trigger: ReactElement;
+    label: string;
+    children: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    align?: "start" | "center" | "end";
+    side?: "top" | "right" | "bottom" | "left";
+}
+declare function Popover({ trigger, label, children, align, side, ...props }: PopoverProps): react.JSX.Element;
+interface MenuItem {
+    id: string;
+    label: string;
+    onSelect?: () => void;
+    href?: string;
+    disabled?: boolean;
+    tone?: "neutral" | "critical";
+    icon?: ReactNode;
+    group?: string;
+}
+interface MenuProps {
+    trigger: ReactElement;
+    label: string;
+    items: MenuItem[];
+    align?: "start" | "center" | "end";
+    onOpenChange?: (open: boolean) => void;
+}
+declare function Menu({ trigger, label, items, align, onOpenChange, }: MenuProps): react.JSX.Element;
+interface TooltipProps {
+    content: string;
+    children: ReactElement;
+    side?: "top" | "right" | "bottom" | "left";
+}
+declare function Tooltip({ content, children, side }: TooltipProps): react.JSX.Element;
+
+interface CalendarBase {
+    label?: string;
+    month?: Date;
+    defaultMonth?: Date;
+    onMonthChange?: (month: Date) => void;
+    disabled?: Matcher | Matcher[];
+    numberOfMonths?: 1 | 2;
+    name?: string;
+    locale?: React.ComponentProps<typeof DayPicker>["locale"];
+    startMonth?: Date;
+    endMonth?: Date;
+}
+type DatePickerProps = CalendarBase & ({
+    mode?: "single";
+    value?: Date;
+    defaultValue?: Date;
+    onValueChange?: (value: Date | undefined) => void;
+} | {
+    mode: "range";
+    value?: DateRange;
+    defaultValue?: DateRange;
+    onValueChange?: (value: DateRange | undefined) => void;
+});
+declare function DatePicker(props: DatePickerProps): react.JSX.Element;
+interface TableColumn<T> {
+    id: string;
+    header: string;
+    cell: (row: T) => ReactNode;
+    align?: "start" | "end";
+    sortValue?: (row: T) => string | number;
+}
+interface TableProps<T> {
+    label: string;
+    columns: TableColumn<T>[];
+    rows: T[];
+    rowKey: (row: T) => string;
+    loading?: boolean;
+    emptyMessage?: string;
+    sort?: {
+        column: string;
+        direction: "ascending" | "descending";
+    };
+    onSortChange?: (sort: {
+        column: string;
+        direction: "ascending" | "descending";
+    }) => void;
+    selected?: string[];
+    onSelectionChange?: (ids: string[]) => void;
+    pagination?: {
+        hasPrevious: boolean;
+        hasNext: boolean;
+        onPrevious: () => void;
+        onNext: () => void;
+        label: string;
+    };
+    filters?: ReactNode;
+}
+declare function Table<T>({ label, columns, rows, rowKey, loading, emptyMessage, sort, onSortChange, selected, onSelectionChange, pagination, filters, }: TableProps<T>): react.JSX.Element;
+
+export { Avatar, type AvatarProps, Badge, type BadgeProps, Banner, type BannerProps, Box, type BoxProps, Button, ButtonGroup, type ButtonProps, Checkbox, type CheckboxProps, Chip, type ChipProps, ChoiceList, type ChoiceListProps, Clickable, ClickableChip, type ClickableChipProps, ColorField, ColorPicker, type ColorPickerProps, DateField, DatePicker, type DatePickerProps, type Density, Divider, DropZone, type DropZoneProps, EmailField, EmptyState, type FieldBase, Grid, type GridProps, Heading, type HeadingProps, Icon, type IconProps, Image, type ImageProps, Link, type LinkProps, ListItem, Menu, type MenuItem, type MenuProps, Modal, type ModalProps, MoneyField, type MoneyFieldProps, Number, NumberField, type NumberProps, OrderedList, Page, type PageProps, Paragraph, PasswordField, Popover, type PopoverProps, Progress, type ProgressProps, QueryContainer, SearchField, Section, type SectionProps, Select, type SelectOption, type SelectProps, type Size, type Space, Spinner, Stack, type StackProps, StaqContext, StaqProvider, type StaqProviderProps, Switch, Table, type TableColumn, type TableProps, Text, TextArea, type TextAreaProps, TextField, type TextFieldProps, type TextProps, Thumbnail, type Tone, Tooltip, type TooltipProps, URLField, UnorderedList, cx, icons, useControllable, useStaq };