@askrjs/themes 0.0.1

package/dist/components/_internal/layout.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Layout helpers shared by headless layout primitives.
+ */
+export type LayoutBreakpoint = "initial" | "sm" | "md" | "lg" | "xl";
+export type ResponsiveValue<T> = T | Partial<Record<LayoutBreakpoint, T>>;
+/**
+ * Returns true when `value` is a concrete CSS length/size that can be applied
+ * directly as an inline style.
+ */
+export declare function isCssLength(value: unknown): value is string;
+export declare function isResponsiveValue<T>(value: ResponsiveValue<T> | undefined): value is Partial<Record<LayoutBreakpoint, T>>;
+export declare function normalizeResponsiveValue<T>(value: ResponsiveValue<T> | undefined): Partial<Record<LayoutBreakpoint, T>> | undefined;
+export declare function serializeResponsiveValue<T>(value: ResponsiveValue<T> | undefined): string | undefined;
+export declare function serializeResponsiveValueIf<T>(value: ResponsiveValue<T> | undefined, predicate: (value: T) => boolean): string | undefined;
+export declare function serializeValueIf<T>(value: T | undefined, predicate: (value: T) => boolean): string | undefined;
+export declare function setResponsiveStyleVar<T>(styles: Record<string, string | number>, variable: string, value: ResponsiveValue<T> | undefined, resolve?: (value: T) => string | number | undefined): void;
+export declare function resolveSpaceValue(value: string | number): string | number;
+export declare function resolveContainerSizeValue(value: string): string;
+export declare function resolveSectionSizeValue(value: string): string;
+export declare function resolveGridTrackValue(value: string | number): string;
+export declare function resolveJustifyValue(value: string): string;
+export declare function resolveAlignValue(value: string): string;
+export declare function resolveInlineAlignValue(value: "left" | "center" | "right"): {
+    marginLeft?: string;
+    marginRight?: string;
+};
+/**
+ * Merges a record of computed layout styles with a user-supplied `style` prop.
+ * The user's styles take precedence for conflicting keys.
+ */
+export declare function mergeLayoutStyles(layout: Record<string, string | number>, user: unknown): string | undefined;

package/dist/components/_internal/merge-props.d.ts

@@ -0,0 +1 @@
+export declare function mergeProps<TBase extends object, TInjected extends object>(base: TBase, injected: TInjected): TInjected & TBase;

package/dist/components/_internal/style.d.ts

@@ -0,0 +1 @@
+export declare function mergeCssVar(style: unknown, name: string, value: string): string;

package/dist/components/accessible-icon/accessible-icon.d.ts

@@ -0,0 +1,2 @@
+import type { AccessibleIconProps } from "./accessible-icon.types";
+export declare function AccessibleIcon(props: AccessibleIconProps): JSX.Element;

package/dist/components/accessible-icon/accessible-icon.types.d.ts

@@ -0,0 +1,5 @@
+export type AccessibleIconProps = {
+    children?: unknown;
+    label?: string;
+    decorative?: boolean;
+};

package/dist/components/accessible-icon/index.d.ts

@@ -0,0 +1,2 @@
+export { AccessibleIcon } from "./accessible-icon";
+export type { AccessibleIconProps } from "./accessible-icon.types";

package/dist/components/aspect-ratio/aspect-ratio.d.ts

@@ -0,0 +1,3 @@
+import type { AspectRatioAsChildProps, AspectRatioProps } from "./aspect-ratio.types";
+export declare function AspectRatio(props: AspectRatioProps): JSX.Element;
+export declare function AspectRatio(props: AspectRatioAsChildProps): JSX.Element;

package/dist/components/aspect-ratio/aspect-ratio.types.d.ts

@@ -0,0 +1,15 @@
+import type { JSXElement, Ref } from "@askrjs/askr/foundations";
+export type AspectRatioOwnProps = {
+    children?: unknown;
+    ratio?: number | string;
+    style?: unknown;
+};
+export type AspectRatioProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & AspectRatioOwnProps & {
+    asChild?: false;
+    ref?: Ref<HTMLDivElement>;
+};
+export type AspectRatioAsChildProps = AspectRatioOwnProps & {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};

package/dist/components/aspect-ratio/index.d.ts

@@ -0,0 +1,2 @@
+export { AspectRatio } from "./aspect-ratio";
+export type { AspectRatioAsChildProps, AspectRatioProps } from "./aspect-ratio.types";

package/dist/components/badge/badge.a11y.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Accessibility contract for Badge.
+ */
+export declare const BADGE_A11Y_CONTRACT: {
+    readonly DATA_ATTRIBUTES: {
+        readonly slot: "data-slot";
+    };
+    readonly MARKER: "data-badge";
+    readonly CONTENT: {
+        readonly textAllowed: true;
+    };
+};
+export type BadgeA11yContract = typeof BADGE_A11Y_CONTRACT;

package/dist/components/badge/badge.d.ts

@@ -0,0 +1,3 @@
+import type { BadgeAsChildProps, BadgeProps } from "./badge.types";
+export declare function Badge(props: BadgeProps): JSX.Element;
+export declare function Badge(props: BadgeAsChildProps): JSX.Element;

package/dist/components/badge/badge.types.d.ts

@@ -0,0 +1,15 @@
+import type { JSXElement, Ref } from "@askrjs/askr/foundations";
+export type BadgeVariant = "default" | "secondary" | "outline" | "success" | "warning" | "danger" | "info";
+export type BadgeOwnProps = {
+    children?: unknown;
+    variant?: BadgeVariant;
+};
+export type BadgeProps = Omit<JSX.IntrinsicElements["span"], "children" | "ref"> & BadgeOwnProps & {
+    asChild?: false;
+    ref?: Ref<HTMLSpanElement>;
+};
+export type BadgeAsChildProps = BadgeOwnProps & {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};

package/dist/components/badge/index.d.ts

@@ -0,0 +1,3 @@
+export { Badge } from "./badge";
+export { BADGE_A11Y_CONTRACT, type BadgeA11yContract } from "./badge.a11y";
+export type { BadgeOwnProps, BadgeProps, BadgeAsChildProps } from "./badge.types";

package/dist/components/box/box.a11y.d.ts

@@ -0,0 +1,10 @@
+export declare const BOX_A11Y_CONTRACT: {
+    readonly DATA_ATTRIBUTES: {
+        readonly slot: "data-slot";
+        readonly layout: "data-ak-layout";
+    };
+    readonly SLOT_VALUES: {
+        readonly root: "box";
+    };
+};
+export type BoxA11yContract = typeof BOX_A11Y_CONTRACT;

package/dist/components/box/box.d.ts

@@ -0,0 +1,4 @@
+import type { BoxAsChildProps, BoxDivProps, BoxSpanProps } from "./box.types";
+export declare function Box(props: BoxDivProps): JSX.Element;
+export declare function Box(props: BoxSpanProps): JSX.Element;
+export declare function Box(props: BoxAsChildProps): JSX.Element;

package/dist/components/box/box.types.d.ts

@@ -0,0 +1,66 @@
+import type { JSXElement, Ref } from "@askrjs/askr/foundations";
+import type { ResponsiveValue } from "../_internal/layout";
+export type LayoutResponsive<T> = ResponsiveValue<T>;
+export type BoxLayoutOwnProps = {
+    display?: ResponsiveValue<string>;
+    m?: ResponsiveValue<string | number>;
+    mx?: ResponsiveValue<string | number>;
+    my?: ResponsiveValue<string | number>;
+    mt?: ResponsiveValue<string | number>;
+    mr?: ResponsiveValue<string | number>;
+    mb?: ResponsiveValue<string | number>;
+    ml?: ResponsiveValue<string | number>;
+    p?: ResponsiveValue<string | number>;
+    px?: ResponsiveValue<string | number>;
+    py?: ResponsiveValue<string | number>;
+    pt?: ResponsiveValue<string | number>;
+    pr?: ResponsiveValue<string | number>;
+    pb?: ResponsiveValue<string | number>;
+    pl?: ResponsiveValue<string | number>;
+    width?: ResponsiveValue<string>;
+    minWidth?: ResponsiveValue<string>;
+    maxWidth?: ResponsiveValue<string>;
+    height?: ResponsiveValue<string>;
+    minHeight?: ResponsiveValue<string>;
+    maxHeight?: ResponsiveValue<string>;
+    position?: ResponsiveValue<string>;
+    inset?: ResponsiveValue<string | number>;
+    top?: ResponsiveValue<string | number>;
+    right?: ResponsiveValue<string | number>;
+    bottom?: ResponsiveValue<string | number>;
+    left?: ResponsiveValue<string | number>;
+    overflow?: ResponsiveValue<string>;
+    overflowX?: ResponsiveValue<string>;
+    overflowY?: ResponsiveValue<string>;
+    flexBasis?: ResponsiveValue<string>;
+    flexGrow?: ResponsiveValue<string | number>;
+    flexShrink?: ResponsiveValue<string | number>;
+    gridArea?: ResponsiveValue<string>;
+    gridColumn?: ResponsiveValue<string>;
+    gridColumnStart?: ResponsiveValue<string>;
+    gridColumnEnd?: ResponsiveValue<string>;
+    gridRow?: ResponsiveValue<string>;
+    gridRowStart?: ResponsiveValue<string>;
+    gridRowEnd?: ResponsiveValue<string>;
+    children?: unknown;
+};
+export type BoxOwnProps = BoxLayoutOwnProps & {
+    as?: "div" | "span";
+};
+export type BoxDivProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & BoxOwnProps & {
+    as?: "div";
+    asChild?: false;
+    ref?: Ref<HTMLDivElement>;
+};
+export type BoxSpanProps = Omit<JSX.IntrinsicElements["span"], "children" | "ref"> & BoxOwnProps & {
+    as: "span";
+    asChild?: false;
+    ref?: Ref<HTMLSpanElement>;
+};
+export type BoxAsChildProps = Omit<BoxOwnProps, "as"> & {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+    style?: JSX.IntrinsicElements["div"]["style"];
+};
+export type BoxProps = BoxDivProps | BoxSpanProps | BoxAsChildProps;

package/dist/components/box/index.d.ts

@@ -0,0 +1,3 @@
+export { Box } from "./box";
+export { BOX_A11Y_CONTRACT, type BoxA11yContract } from "./box.a11y";
+export type { BoxProps, BoxOwnProps, BoxLayoutOwnProps, BoxDivProps, BoxSpanProps, BoxAsChildProps, LayoutResponsive, } from "./box.types";

package/dist/components/breadcrumb/breadcrumb.a11y.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Breadcrumb accessibility contract.
+ */
+export declare const BREADCRUMB_A11Y_CONTRACT: {
+    readonly DATA_ATTRIBUTES: {
+        readonly slot: "data-slot";
+    };
+    readonly NAV_ROLE: "navigation";
+    readonly CURRENT_PAGE_ATTRIBUTE: "aria-current";
+    readonly CURRENT_PAGE_VALUE: "page";
+    readonly SEPARATOR_MARKER: "data-breadcrumb-separator";
+};
+export type BreadcrumbA11yContract = typeof BREADCRUMB_A11Y_CONTRACT;

package/dist/components/breadcrumb/breadcrumb.d.ts

@@ -0,0 +1,13 @@
+import type { BreadcrumbAsChildProps, BreadcrumbCurrentAsChildProps, BreadcrumbCurrentProps, BreadcrumbItemAsChildProps, BreadcrumbItemProps, BreadcrumbLinkAsChildProps, BreadcrumbLinkProps, BreadcrumbListAsChildProps, BreadcrumbListProps, BreadcrumbProps, BreadcrumbSeparatorAsChildProps, BreadcrumbSeparatorProps } from "./breadcrumb.types";
+export declare function Breadcrumb(props: BreadcrumbProps): JSX.Element;
+export declare function Breadcrumb(props: BreadcrumbAsChildProps): JSX.Element;
+export declare function BreadcrumbList(props: BreadcrumbListProps): JSX.Element;
+export declare function BreadcrumbList(props: BreadcrumbListAsChildProps): JSX.Element;
+export declare function BreadcrumbItem(props: BreadcrumbItemProps): JSX.Element;
+export declare function BreadcrumbItem(props: BreadcrumbItemAsChildProps): JSX.Element;
+export declare function BreadcrumbLink(props: BreadcrumbLinkProps): JSX.Element;
+export declare function BreadcrumbLink(props: BreadcrumbLinkAsChildProps): JSX.Element;
+export declare function BreadcrumbCurrent(props: BreadcrumbCurrentProps): JSX.Element;
+export declare function BreadcrumbCurrent(props: BreadcrumbCurrentAsChildProps): JSX.Element;
+export declare function BreadcrumbSeparator(props: BreadcrumbSeparatorProps): JSX.Element;
+export declare function BreadcrumbSeparator(props: BreadcrumbSeparatorAsChildProps): JSX.Element;

package/dist/components/breadcrumb/breadcrumb.types.d.ts

@@ -0,0 +1,59 @@
+import type { JSXElement, Ref } from "@askrjs/askr/foundations";
+export type BreadcrumbOwnProps = {
+    children?: unknown;
+    "aria-label"?: string;
+};
+export type BreadcrumbProps = Omit<JSX.IntrinsicElements["nav"], "children" | "ref"> & BreadcrumbOwnProps & {
+    asChild?: false;
+    ref?: Ref<HTMLElement>;
+};
+export type BreadcrumbAsChildProps = BreadcrumbOwnProps & {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};
+export type BreadcrumbListProps = Omit<JSX.IntrinsicElements["ol"], "children" | "ref"> & {
+    asChild?: false;
+    ref?: Ref<HTMLOListElement>;
+};
+export type BreadcrumbListAsChildProps = {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};
+export type BreadcrumbItemProps = Omit<JSX.IntrinsicElements["li"], "children" | "ref"> & {
+    asChild?: false;
+    ref?: Ref<HTMLLIElement>;
+};
+export type BreadcrumbItemAsChildProps = {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};
+export type BreadcrumbLinkProps = Omit<JSX.IntrinsicElements["a"], "children" | "ref"> & {
+    asChild?: false;
+    ref?: Ref<HTMLAnchorElement>;
+};
+export type BreadcrumbLinkAsChildProps = {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};
+export type BreadcrumbCurrentProps = Omit<JSX.IntrinsicElements["span"], "children" | "ref"> & {
+    asChild?: false;
+    ref?: Ref<HTMLSpanElement>;
+};
+export type BreadcrumbCurrentAsChildProps = {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};
+export type BreadcrumbSeparatorProps = Omit<JSX.IntrinsicElements["span"], "children" | "ref"> & {
+    asChild?: false;
+    ref?: Ref<HTMLSpanElement>;
+};
+export type BreadcrumbSeparatorAsChildProps = {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+};

package/dist/components/breadcrumb/index.d.ts

@@ -0,0 +1,3 @@
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbCurrent, BreadcrumbSeparator, } from "./breadcrumb";
+export { BREADCRUMB_A11Y_CONTRACT, type BreadcrumbA11yContract } from "./breadcrumb.a11y";
+export type { BreadcrumbOwnProps, BreadcrumbProps, BreadcrumbAsChildProps, BreadcrumbListProps, BreadcrumbListAsChildProps, BreadcrumbItemProps, BreadcrumbItemAsChildProps, BreadcrumbLinkProps, BreadcrumbLinkAsChildProps, BreadcrumbCurrentProps, BreadcrumbCurrentAsChildProps, BreadcrumbSeparatorProps, BreadcrumbSeparatorAsChildProps, } from "./breadcrumb.types";

package/dist/components/card/card.d.ts

@@ -0,0 +1,7 @@
+import type { CardContentProps, CardDescriptionProps, CardFooterProps, CardHeaderProps, CardProps, CardTitleProps } from "./card.types";
+export declare function Card(props: CardProps): JSX.Element;
+export declare function CardHeader(props: CardHeaderProps): JSX.Element;
+export declare function CardTitle(props: CardTitleProps): JSX.Element;
+export declare function CardDescription(props: CardDescriptionProps): JSX.Element;
+export declare function CardContent(props: CardContentProps): JSX.Element;
+export declare function CardFooter(props: CardFooterProps): JSX.Element;

package/dist/components/card/card.types.d.ts

@@ -0,0 +1,33 @@
+import type { Ref } from "@askrjs/askr/foundations";
+export type CardVariant = "default" | "raised";
+export type CardPadding = "sm" | "md" | "lg";
+type DivProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref">;
+type HeadingProps = Omit<JSX.IntrinsicElements["h3"], "children" | "ref">;
+type ParagraphProps = Omit<JSX.IntrinsicElements["p"], "children" | "ref">;
+export type CardProps = DivProps & {
+    children?: unknown;
+    variant?: CardVariant;
+    padding?: CardPadding;
+    ref?: Ref<HTMLDivElement>;
+};
+export type CardHeaderProps = DivProps & {
+    children?: unknown;
+    ref?: Ref<HTMLDivElement>;
+};
+export type CardContentProps = DivProps & {
+    children?: unknown;
+    ref?: Ref<HTMLDivElement>;
+};
+export type CardFooterProps = DivProps & {
+    children?: unknown;
+    ref?: Ref<HTMLDivElement>;
+};
+export type CardTitleProps = HeadingProps & {
+    children?: unknown;
+    ref?: Ref<HTMLHeadingElement>;
+};
+export type CardDescriptionProps = ParagraphProps & {
+    children?: unknown;
+    ref?: Ref<HTMLParagraphElement>;
+};
+export {};

package/dist/components/card/index.d.ts

@@ -0,0 +1,2 @@
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "./card";
+export type { CardContentProps, CardDescriptionProps, CardFooterProps, CardHeaderProps, CardPadding, CardProps, CardTitleProps, CardVariant, } from "./card.types";

package/dist/components/container/container.a11y.d.ts

@@ -0,0 +1,16 @@
+export declare const CONTAINER_A11Y_CONTRACT: {
+    readonly DATA_ATTRIBUTES: {
+        readonly slot: "data-slot";
+        readonly layout: "data-ak-layout";
+        readonly variant: "data-variant";
+        readonly fluid: "data-fluid";
+        readonly maxWidth: "data-max-width";
+        readonly padding: "data-padding";
+        readonly size: "data-size";
+        readonly align: "data-align";
+    };
+    readonly SLOT_VALUES: {
+        readonly root: "container";
+    };
+};
+export type ContainerA11yContract = typeof CONTAINER_A11Y_CONTRACT;

package/dist/components/container/container.d.ts

@@ -0,0 +1,3 @@
+import type { ContainerAsChildProps, ContainerNativeProps } from "./container.types";
+export declare function Container(props: ContainerNativeProps): JSX.Element;
+export declare function Container(props: ContainerAsChildProps): JSX.Element;

package/dist/components/container/container.types.d.ts

@@ -0,0 +1,29 @@
+import type { JSXElement, Ref } from "@askrjs/askr/foundations";
+import type { BoxLayoutOwnProps, LayoutResponsive } from "../box/box.types";
+export type ContainerVariant = "default" | "sm" | "md" | "lg" | "xl" | "xxl" | "fluid";
+export type ContainerOwnProps = BoxLayoutOwnProps & {
+    /** Bootstrap-like responsive container variant. */
+    variant?: ContainerVariant;
+    /** Makes the container span the full available width while preserving gutters. */
+    fluid?: boolean;
+    /** Radix-style container size token. */
+    size?: LayoutResponsive<"1" | "2" | "3" | "4" | "sm" | "md" | "lg" | "xl">;
+    /** Horizontal alignment of the constrained container. */
+    align?: LayoutResponsive<"left" | "center" | "right">;
+    /** Compatibility max-width override. */
+    maxWidth?: LayoutResponsive<string>;
+    /** Compatibility horizontal padding override. */
+    padding?: LayoutResponsive<string | number>;
+    children?: unknown;
+};
+export type ContainerNativeProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & ContainerOwnProps & {
+    asChild?: false;
+    ref?: Ref<HTMLDivElement>;
+};
+export type ContainerAsChildProps = ContainerOwnProps & {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+    style?: JSX.IntrinsicElements["div"]["style"];
+};
+export type ContainerProps = ContainerNativeProps | ContainerAsChildProps;

package/dist/components/container/index.d.ts

@@ -0,0 +1,3 @@
+export { Container } from "./container";
+export { CONTAINER_A11Y_CONTRACT, type ContainerA11yContract } from "./container.a11y";
+export type { ContainerProps, ContainerVariant, ContainerOwnProps, ContainerNativeProps, ContainerAsChildProps, } from "./container.types";

package/dist/components/empty-state/empty-state.d.ts

@@ -0,0 +1,2 @@
+import type { EmptyStateProps } from "./empty-state.types";
+export declare function EmptyState(props: EmptyStateProps): JSX.Element;

package/dist/components/empty-state/empty-state.types.d.ts

@@ -0,0 +1,9 @@
+export type EmptyStateHeadingTag = "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+export type EmptyStateProps = Omit<JSX.IntrinsicElements["div"], "children"> & {
+    icon?: unknown;
+    title?: unknown;
+    titleAs?: EmptyStateHeadingTag;
+    description?: unknown;
+    actions?: unknown;
+    children?: unknown;
+};

package/dist/components/empty-state/index.d.ts

@@ -0,0 +1,2 @@
+export { EmptyState } from "./empty-state";
+export type { EmptyStateHeadingTag, EmptyStateProps } from "./empty-state.types";

package/dist/components/flex/flex.a11y.d.ts

@@ -0,0 +1,18 @@
+export declare const FLEX_A11Y_CONTRACT: {
+    readonly DATA_ATTRIBUTES: {
+        readonly slot: "data-slot";
+        readonly layout: "data-ak-layout";
+        readonly direction: "data-direction";
+        readonly gap: "data-gap";
+        readonly gapX: "data-gap-x";
+        readonly gapY: "data-gap-y";
+        readonly align: "data-align";
+        readonly justify: "data-justify";
+        readonly wrap: "data-wrap";
+        readonly collapseBelow: "data-collapse-below";
+    };
+    readonly SLOT_VALUES: {
+        readonly root: "flex";
+    };
+};
+export type FlexA11yContract = typeof FLEX_A11Y_CONTRACT;

package/dist/components/flex/flex.d.ts

@@ -0,0 +1,4 @@
+import type { FlexAsChildProps, FlexDivProps, FlexSpanProps } from "./flex.types";
+export declare function Flex(props: FlexDivProps): JSX.Element;
+export declare function Flex(props: FlexSpanProps): JSX.Element;
+export declare function Flex(props: FlexAsChildProps): JSX.Element;

package/dist/components/flex/flex.types.d.ts

@@ -0,0 +1,41 @@
+import type { JSXElement, Ref } from "@askrjs/askr/foundations";
+import type { BoxLayoutOwnProps, LayoutResponsive } from "../box/box.types";
+export type FlexOwnProps = BoxLayoutOwnProps & {
+    direction?: LayoutResponsive<"row" | "column" | "row-reverse" | "column-reverse">;
+    gap?: LayoutResponsive<string | number>;
+    gapX?: LayoutResponsive<string | number>;
+    gapY?: LayoutResponsive<string | number>;
+    align?: LayoutResponsive<string>;
+    justify?: LayoutResponsive<string>;
+    wrap?: LayoutResponsive<"wrap" | "nowrap" | "wrap-reverse">;
+    /**
+     * Compatibility breakpoint helper. Prefer responsive `direction` instead.
+     */
+    collapseBelow?: string;
+    as?: "div" | "span";
+    children?: unknown;
+};
+export type FlexNativeProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & FlexOwnProps & {
+    as?: "div";
+    asChild?: false;
+    ref?: Ref<HTMLDivElement>;
+};
+export type FlexSpanProps = Omit<JSX.IntrinsicElements["span"], "children" | "ref"> & FlexOwnProps & {
+    as: "span";
+    asChild?: false;
+    ref?: Ref<HTMLSpanElement>;
+};
+export type FlexAsChildProps = Omit<FlexOwnProps, "as"> & {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+    style?: JSX.IntrinsicElements["div"]["style"];
+};
+export type FlexDivProps = FlexNativeProps;
+export type FlexProps = FlexDivProps | FlexSpanProps | FlexAsChildProps;
+export type InlineOwnProps = FlexOwnProps;
+export type InlineNativeProps = FlexNativeProps;
+export type InlineDivProps = FlexDivProps;
+export type InlineSpanProps = FlexSpanProps;
+export type InlineAsChildProps = FlexAsChildProps;
+export type InlineProps = FlexProps;

package/dist/components/flex/index.d.ts

@@ -0,0 +1,3 @@
+export { Flex } from "./flex";
+export { FLEX_A11Y_CONTRACT, type FlexA11yContract } from "./flex.a11y";
+export type { FlexProps, FlexOwnProps, FlexNativeProps, FlexDivProps, FlexSpanProps, FlexAsChildProps, InlineProps, InlineOwnProps, InlineNativeProps, InlineDivProps, InlineSpanProps, InlineAsChildProps, } from "./flex.types";

package/dist/components/grid/grid.a11y.d.ts

@@ -0,0 +1,21 @@
+export declare const GRID_A11Y_CONTRACT: {
+    readonly DATA_ATTRIBUTES: {
+        readonly slot: "data-slot";
+        readonly layout: "data-ak-layout";
+        readonly areas: "data-areas";
+        readonly columns: "data-columns";
+        readonly rows: "data-rows";
+        readonly flow: "data-flow";
+        readonly minItemWidth: "data-min-item-width";
+        readonly gap: "data-gap";
+        readonly gapX: "data-gap-x";
+        readonly gapY: "data-gap-y";
+        readonly autoFit: "data-auto-fit";
+        readonly align: "data-align";
+        readonly justify: "data-justify";
+    };
+    readonly SLOT_VALUES: {
+        readonly root: "grid";
+    };
+};
+export type GridA11yContract = typeof GRID_A11Y_CONTRACT;

package/dist/components/grid/grid.d.ts

@@ -0,0 +1,4 @@
+import type { GridAsChildProps, GridDivProps, GridSpanProps } from "./grid.types";
+export declare function Grid(props: GridDivProps): JSX.Element;
+export declare function Grid(props: GridSpanProps): JSX.Element;
+export declare function Grid(props: GridAsChildProps): JSX.Element;

package/dist/components/grid/grid.types.d.ts

@@ -0,0 +1,37 @@
+import type { JSXElement, Ref } from "@askrjs/askr/foundations";
+import type { BoxLayoutOwnProps, LayoutResponsive } from "../box/box.types";
+export type GridOwnProps = BoxLayoutOwnProps & {
+    areas?: LayoutResponsive<string>;
+    columns?: LayoutResponsive<number | string>;
+    rows?: LayoutResponsive<number | string>;
+    flow?: LayoutResponsive<string>;
+    gap?: LayoutResponsive<string | number>;
+    gapX?: LayoutResponsive<string | number>;
+    gapY?: LayoutResponsive<string | number>;
+    align?: LayoutResponsive<string>;
+    justify?: LayoutResponsive<string>;
+    /** Compatibility helper for auto-fit grids. */
+    minItemWidth?: string;
+    /** Compatibility helper for auto-fit grids. */
+    autoFit?: boolean;
+    as?: "div" | "span";
+    children?: unknown;
+};
+export type GridNativeProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & GridOwnProps & {
+    as?: "div";
+    asChild?: false;
+    ref?: Ref<HTMLDivElement>;
+};
+export type GridSpanProps = Omit<JSX.IntrinsicElements["span"], "children" | "ref"> & GridOwnProps & {
+    as: "span";
+    asChild?: false;
+    ref?: Ref<HTMLSpanElement>;
+};
+export type GridAsChildProps = Omit<GridOwnProps, "as"> & {
+    asChild: true;
+    children: JSXElement;
+    ref?: Ref<unknown>;
+    style?: JSX.IntrinsicElements["div"]["style"];
+};
+export type GridDivProps = GridNativeProps;
+export type GridProps = GridDivProps | GridSpanProps | GridAsChildProps;

package/dist/components/grid/index.d.ts

@@ -0,0 +1,3 @@
+export { Grid } from "./grid";
+export { GRID_A11Y_CONTRACT, type GridA11yContract } from "./grid.a11y";
+export type { GridProps, GridOwnProps, GridNativeProps, GridDivProps, GridSpanProps, GridAsChildProps, } from "./grid.types";

package/dist/components/header/header.a11y.d.ts

@@ -0,0 +1,10 @@
+export declare const HEADER_A11Y_CONTRACT: {
+    readonly DATA_ATTRIBUTES: {
+        readonly slot: "data-slot";
+        readonly position: "data-position";
+    };
+    readonly SLOT_VALUES: {
+        readonly root: "header";
+    };
+};
+export type HeaderA11yContract = typeof HEADER_A11Y_CONTRACT;

package/dist/components/header/header.d.ts

@@ -0,0 +1,2 @@
+import type { HeaderProps } from "./header.types";
+export declare function Header(props: HeaderProps): JSX.Element;

package/dist/components/header/header.types.d.ts

@@ -0,0 +1,5 @@
+export type HeaderPosition = "static" | "relative" | "sticky" | "absolute" | "fixed";
+export type HeaderProps = Omit<JSX.IntrinsicElements["header"], "children"> & {
+    position?: HeaderPosition;
+    children?: unknown;
+};

package/dist/components/header/index.d.ts

@@ -0,0 +1,3 @@
+export { Header } from "./header";
+export { HEADER_A11Y_CONTRACT, type HeaderA11yContract } from "./header.a11y";
+export type { HeaderProps, HeaderPosition } from "./header.types";