asheeui 1.1.0 → 2.0.0

package/dist/components/file-upload/file-upload-config.d.ts

@@ -0,0 +1,41 @@
+import { Size } from '../../shared';
+/**
+ * Theme configuration options for the FileUpload component.
+ *
+ * Set under `components.fileupload` in the AsheeUI config. Values feed the
+ * component-level tier of the theme cascade.
+ */
+export interface FileUploadConfig {
+    /**
+     * Name of the control inside the drop zone.
+     *
+     * @default "Choose files"
+     */
+    buttonLabel?: string;
+    /**
+     * Instruction shown in the zone when nothing is being dragged over it.
+     *
+     * @default "Drag files here"
+     */
+    hint?: string;
+    /**
+     * Density of the zone.
+     *
+     * @default "md"
+     */
+    size?: Size;
+}
+/**
+ * Default config values registered for the FileUpload component.
+ */
+export declare const defaultFileUploadConfig: FileUploadConfig;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        fileupload: FileUploadConfig;
+    }
+}
+/**
+ * Hard fallback values used when no config tier provides a value.
+ */
+export declare const FALLBACK_FILE_UPLOAD_CONFIG: Required<FileUploadConfig>;
+//# sourceMappingURL=file-upload-config.d.ts.map

package/dist/components/file-upload/file-upload-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload-config.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/file-upload-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC;;;;;GAKG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;CACb;AAED;;GAEG;AACH,eAAO,MAAM,uBAAuB,EAAE,gBAIrC,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,UAAU,EAAE,gBAAgB,CAAC;KAC9B;CACF;AAID;;GAEG;AACH,eAAO,MAAM,2BAA2B,EAAE,QAAQ,CAAC,gBAAgB,CAIlE,CAAC"}

package/dist/components/file-upload/file-upload-config.js

@@ -0,0 +1,16 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/file-upload/file-upload-config.ts
+var t = {
+	buttonLabel: "Choose files",
+	hint: "Drag files here",
+	size: "md"
+};
+e("fileupload", t);
+var n = {
+	buttonLabel: "Choose files",
+	hint: "Drag files here",
+	size: "md"
+};
+//#endregion
+export { n as FALLBACK_FILE_UPLOAD_CONFIG, t as defaultFileUploadConfig };

package/dist/components/file-upload/file-upload-styles.d.ts

@@ -0,0 +1,22 @@
+import { Size } from '../../shared';
+/**
+ * The drop zone, which is a label for the field it hides.
+ * Its focus ring follows the field, so the zone shows where the keyboard is even
+ * though the field itself is visually hidden.
+ */
+export declare const FILE_UPLOAD_ZONE_CLASS = "flex w-full min-w-0 cursor-pointer flex-col items-center justify-center gap-2 rounded-md border-2 border-dashed border-border bg-background text-center transition-colors hover:border-primary focus-within:ring-2 focus-within:ring-primary focus-within:ring-offset-2";
+/** The zone while a file is dragged over it. */
+export declare const FILE_UPLOAD_ZONE_ACTIVE_CLASS = "border-primary bg-primary/10";
+/** The zone when the field is unavailable. */
+export declare const FILE_UPLOAD_ZONE_DISABLED_CLASS = "cursor-not-allowed opacity-60 hover:border-border";
+/** Padding for each density. */
+export declare const FILE_UPLOAD_SIZE_CLASS: Record<Size, string>;
+/** The control's label, styled as an emphasised part of the zone. */
+export declare const FILE_UPLOAD_BUTTON_CLASS = "font-medium text-primary underline";
+/** The instruction beside it. */
+export declare const FILE_UPLOAD_HINT_CLASS = "text-sm text-foreground/60";
+/** The field itself, which is present for the keyboard and the picker only. */
+export declare const FILE_UPLOAD_INPUT_CLASS = "sr-only";
+/** The list of chosen files. */
+export declare const FILE_UPLOAD_LIST_CLASS = "flex flex-wrap gap-2 pt-1";
+//# sourceMappingURL=file-upload-styles.d.ts.map

package/dist/components/file-upload/file-upload-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload-styles.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/file-upload-styles.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,4QACwO,CAAC;AAE5Q,gDAAgD;AAChD,eAAO,MAAM,6BAA6B,iCAAiC,CAAC;AAE5E,8CAA8C;AAC9C,eAAO,MAAM,+BAA+B,sDACS,CAAC;AAEtD,gCAAgC;AAChC,eAAO,MAAM,sBAAsB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAIvD,CAAC;AAEF,qEAAqE;AACrE,eAAO,MAAM,wBAAwB,uCAAuC,CAAC;AAE7E,iCAAiC;AACjC,eAAO,MAAM,sBAAsB,+BAA+B,CAAC;AAEnE,+EAA+E;AAC/E,eAAO,MAAM,uBAAuB,YAAY,CAAC;AAEjD,gCAAgC;AAChC,eAAO,MAAM,sBAAsB,8BAA8B,CAAC"}

package/dist/components/file-upload/file-upload-styles.js

@@ -0,0 +1,9 @@
+"use client";
+//#region src/components/file-upload/file-upload-styles.ts
+var e = "flex w-full min-w-0 cursor-pointer flex-col items-center justify-center gap-2 rounded-md border-2 border-dashed border-border bg-background text-center transition-colors hover:border-primary focus-within:ring-2 focus-within:ring-primary focus-within:ring-offset-2", t = "border-primary bg-primary/10", n = "cursor-not-allowed opacity-60 hover:border-border", r = {
+	sm: "px-4 py-6",
+	md: "px-6 py-10",
+	lg: "px-8 py-14"
+}, i = "font-medium text-primary underline", a = "text-sm text-foreground/60", o = "sr-only", s = "flex flex-wrap gap-2 pt-1";
+//#endregion
+export { i as FILE_UPLOAD_BUTTON_CLASS, a as FILE_UPLOAD_HINT_CLASS, o as FILE_UPLOAD_INPUT_CLASS, s as FILE_UPLOAD_LIST_CLASS, r as FILE_UPLOAD_SIZE_CLASS, t as FILE_UPLOAD_ZONE_ACTIVE_CLASS, e as FILE_UPLOAD_ZONE_CLASS, n as FILE_UPLOAD_ZONE_DISABLED_CLASS };

package/dist/components/file-upload/file-upload.helpers.d.ts

@@ -0,0 +1,26 @@
+/**
+ * FileUpload component helpers for AsheeUI.
+ * This file provides the small pure functions the file field needs: reporting a
+ * file size in the reader's terms and describing what the field rejected.
+ */
+/**
+ * Describe a file size in the reader's terms.
+ *
+ * @param bytes - The size in bytes.
+ * @returns A short description, such as `1.5 MB`.
+ *
+ * @example
+ * ```tsx
+ * formatFileSize(1536); // "1.5 KB"
+ * ```
+ */
+export declare function formatFileSize(bytes: number): string;
+/**
+ * Describe the files a size limit left out.
+ *
+ * @param count - How many files were left out.
+ * @param maxSize - The limit, in bytes.
+ * @returns A sentence naming the count and the limit.
+ */
+export declare function describeRejectedFiles(count: number, maxSize: number): string;
+//# sourceMappingURL=file-upload.helpers.d.ts.map

package/dist/components/file-upload/file-upload.helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload.helpers.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/file-upload.helpers.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAepD;AAED;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAI5E"}

package/dist/components/file-upload/file-upload.helpers.js

@@ -0,0 +1,17 @@
+"use client";
+//#region src/components/file-upload/file-upload.helpers.ts
+function e(e) {
+	if (e < 1024) return `${e} B`;
+	let t = [
+		"KB",
+		"MB",
+		"GB"
+	], n = e / 1024, r = 0;
+	for (; n >= 1024 && r < t.length - 1;) n /= 1024, r += 1;
+	return `${Number(n.toFixed(1))} ${t[r]}`;
+}
+function t(t, n) {
+	return `${t === 1 ? "One file was" : `${t} files were`} larger than ${e(n)} and was not added.`;
+}
+//#endregion
+export { t as describeRejectedFiles, e as formatFileSize };

package/dist/components/file-upload/index.d.ts

@@ -0,0 +1,3 @@
+export * from './FileUpload';
+export * from './file-upload-config';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/file-upload/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/file-upload/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC"}

package/dist/components/file-upload/index.js

@@ -0,0 +1,4 @@
+export * from "./FileUpload.js";
+export * from "./file-upload-config.js";
+export * from "./file-upload-styles.js";
+export * from "./file-upload.helpers.js";

package/dist/components/loading-state/LoadingState.d.ts

@@ -0,0 +1,57 @@
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+import { LoadingStateConfig } from './loading-state-config';
+type BaseLoadingStateProps = LoadingStateConfig & Omit<HTMLAttributes<HTMLDivElement>, "color">;
+/**
+ * Props for the LoadingState component.
+ */
+export interface LoadingStateProps extends BaseLoadingStateProps {
+    /**
+     * Supporting sentence under the label, for example what is being fetched.
+     */
+    description?: ReactNode;
+    /**
+     * Element that replaces the framework's spinner, for a progress bar or a
+     * consumer's own indicator.
+     */
+    indicator?: ReactNode;
+    /**
+     * Element to render.
+     * Defaults to a `div`.
+     *
+     * @default "div"
+     */
+    as?: ElementType;
+    /**
+     * Content below the label, for example a cancel control.
+     */
+    children?: ReactNode;
+}
+/**
+ * A region whose content has not arrived yet.
+ *
+ * The state is a `status` region, so assistive technology is told that something
+ * is in progress rather than being left with a silent gap. It claims room by
+ * default, so the page does not jump when the content arrives, and it says what
+ * is loading rather than only that something is.
+ *
+ * @param props - LoadingState configuration options and element attributes.
+ * @param props.label - Text shown and announced. Defaults to "Loading".
+ * @param props.description - Supporting sentence.
+ * @param props.indicator - Element that replaces the framework's spinner.
+ * @param props.size - Density of the indicator and the padding. Defaults to "md".
+ * @param props.panel - Draw the state as a panel. Defaults to false.
+ * @param props.minHeight - Room the state claims. Defaults to "sm".
+ * @param props.as - Element to render. Defaults to "div".
+ * @returns The rendered state.
+ *
+ * @example
+ * ```tsx
+ * <LoadingState label="Loading invoices" description="This usually takes a moment." />
+ * ```
+ *
+ * @see Skeleton - The placeholder form, for content whose shape is known.
+ * @see EmptyState - The presentation for a region that has nothing in it.
+ */
+export declare const LoadingState: import('react').ForwardRefExoticComponent<LoadingStateProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=LoadingState.d.ts.map

package/dist/components/loading-state/LoadingState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingState.d.ts","sourceRoot":"","sources":["../../../src/components/loading-state/LoadingState.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAOf,OAAO,EAEL,KAAK,kBAAkB,EACxB,MAAM,wBAAwB,CAAC;AAOhC,KAAK,qBAAqB,GAAG,kBAAkB,GAC7C,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC;AAEhD;;GAEG;AACH,MAAM,WAAW,iBAAkB,SAAQ,qBAAqB;IAC9D;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;;OAKG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,YAAY,8GAsDxB,CAAC"}

package/dist/components/loading-state/LoadingState.js

@@ -0,0 +1,44 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { SPACE_MIN_HEIGHT_CLASS as t } from "../../shared/spacing.js";
+import { useAsheeConfig as n } from "../../libs/context.js";
+import { resolveConfigCascade as r } from "../../utils/resolve-token.js";
+import { Typography as i } from "../typography/Typography.js";
+import { Spinner as a } from "../spinner/spinner.js";
+import { FALLBACK_LOADING_STATE_CONFIG as o } from "./loading-state-config.js";
+import { LOADING_STATE_CLASS as s, LOADING_STATE_SIZE_CLASS as c } from "./loading-state-styles.js";
+import { forwardRef as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/loading-state/LoadingState.tsx
+var f = l(({ as: l, label: f, description: p, indicator: m, size: h, panel: g, minHeight: _, className: v, children: y, ...b }, x) => {
+	let S = n(), C = r({
+		label: f,
+		size: h,
+		panel: g,
+		minHeight: _
+	}, S.components?.loadingstate, o);
+	return /* @__PURE__ */ d(l ?? "div", {
+		ref: x,
+		role: "status",
+		className: e(s, c[C.size], t[C.minHeight], C.panel && "rounded-md border border-border bg-background", v),
+		...b,
+		children: [
+			m ?? /* @__PURE__ */ u(a, { size: C.size }),
+			/* @__PURE__ */ u(i, {
+				role: "body-sm",
+				tone: "muted",
+				children: C.label
+			}),
+			p && /* @__PURE__ */ u(i, {
+				role: "caption",
+				tone: "muted",
+				children: p
+			}),
+			y
+		]
+	});
+});
+f.displayName = "LoadingState";
+//#endregion
+export { f as LoadingState };

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

@@ -0,0 +1,3 @@
+export * from './LoadingState';
+export * from './loading-state-config';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/loading-state/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/loading-state/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,wBAAwB,CAAC"}

package/dist/components/loading-state/index.js

@@ -0,0 +1,3 @@
+export * from "./LoadingState.js";
+export * from "./loading-state-config.js";
+export * from "./loading-state-styles.js";

package/dist/components/loading-state/loading-state-config.d.ts

@@ -0,0 +1,49 @@
+import { Size, Space } from '../../shared';
+/**
+ * Theme configuration options for the LoadingState component.
+ *
+ * Set under `components.loadingstate` in the AsheeUI config. Values feed the
+ * component-level tier of the theme cascade.
+ */
+export interface LoadingStateConfig {
+    /**
+     * Text announced and shown while the region loads.
+     *
+     * @default "Loading"
+     */
+    label?: string;
+    /**
+     * Density of the indicator and of the label.
+     *
+     * @default "md"
+     */
+    size?: Size;
+    /**
+     * Whether the state is drawn as a panel.
+     * A panel suits a region inside a dashboard; without one the state sits
+     * directly on the page, which suits a whole-page load.
+     *
+     * @default false
+     */
+    panel?: boolean;
+    /**
+     * Room the state claims, so the page does not jump when the content arrives.
+     *
+     * @default "sm"
+     */
+    minHeight?: Space;
+}
+/**
+ * Default config values registered for the LoadingState component.
+ */
+export declare const defaultLoadingStateConfig: LoadingStateConfig;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        loadingstate: LoadingStateConfig;
+    }
+}
+/**
+ * Hard fallback values used when no config tier provides a value.
+ */
+export declare const FALLBACK_LOADING_STATE_CONFIG: Required<LoadingStateConfig>;
+//# sourceMappingURL=loading-state-config.d.ts.map

package/dist/components/loading-state/loading-state-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading-state-config.d.ts","sourceRoot":"","sources":["../../../src/components/loading-state/loading-state-config.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAEhD;;;;;GAKG;AACH,MAAM,WAAW,kBAAkB;IACjC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;OAIG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IAEZ;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;CACnB;AAED;;GAEG;AACH,eAAO,MAAM,yBAAyB,EAAE,kBAKvC,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,YAAY,EAAE,kBAAkB,CAAC;KAClC;CACF;AAID;;GAEG;AACH,eAAO,MAAM,6BAA6B,EAAE,QAAQ,CAAC,kBAAkB,CAKtE,CAAC"}

package/dist/components/loading-state/loading-state-config.js

@@ -0,0 +1,18 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/loading-state/loading-state-config.ts
+var t = {
+	label: "Loading",
+	size: "md",
+	panel: !1,
+	minHeight: "sm"
+};
+e("loadingstate", t);
+var n = {
+	label: "Loading",
+	size: "md",
+	panel: !1,
+	minHeight: "sm"
+};
+//#endregion
+export { n as FALLBACK_LOADING_STATE_CONFIG, t as defaultLoadingStateConfig };

package/dist/components/loading-state/loading-state-styles.d.ts

@@ -0,0 +1,12 @@
+import { Size } from '../../shared';
+/** The loading region, which centres its indicator and its label. */
+export declare const LOADING_STATE_CLASS = "flex w-full min-w-0 flex-col items-center justify-center gap-3 text-center";
+/**
+ * The panel treatment, for a loading region inside a surface.
+ * It carries no padding of its own: the density decides the room, so a panel and
+ * a bare region of the same size agree.
+ */
+export declare const LOADING_STATE_PANEL_CLASS = "rounded-md border border-border bg-background";
+/** Vertical padding for each density. */
+export declare const LOADING_STATE_SIZE_CLASS: Record<Size, string>;
+//# sourceMappingURL=loading-state-styles.d.ts.map

package/dist/components/loading-state/loading-state-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading-state-styles.d.ts","sourceRoot":"","sources":["../../../src/components/loading-state/loading-state-styles.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,qEAAqE;AACrE,eAAO,MAAM,mBAAmB,+EAC8C,CAAC;AAE/E;;;;GAIG;AACH,eAAO,MAAM,yBAAyB,kDACW,CAAC;AAElD,yCAAyC;AACzC,eAAO,MAAM,wBAAwB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAIzD,CAAC"}

package/dist/components/loading-state/loading-state-styles.js

@@ -0,0 +1,9 @@
+"use client";
+//#region src/components/loading-state/loading-state-styles.ts
+var e = "flex w-full min-w-0 flex-col items-center justify-center gap-3 text-center", t = "rounded-md border border-border bg-background", n = {
+	sm: "py-4",
+	md: "py-8",
+	lg: "py-12"
+};
+//#endregion
+export { e as LOADING_STATE_CLASS, t as LOADING_STATE_PANEL_CLASS, n as LOADING_STATE_SIZE_CLASS };

package/dist/components/marketing-layout/MarketingLayout.d.ts

@@ -0,0 +1,83 @@
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+import { MarketingLayoutConfig } from './marketing-layout-config';
+type BaseMarketingLayoutProps = MarketingLayoutConfig & Omit<HTMLAttributes<HTMLDivElement>, "color">;
+/**
+ * Props for the MarketingLayout component.
+ */
+export interface MarketingLayoutProps extends BaseMarketingLayoutProps {
+    /**
+     * The page's navigation, above the main region.
+     * The framework's `Navbar` renders a `header` landmark, so it belongs here
+     * unwrapped; a consumer's own navigation element does too.
+     */
+    navigation?: ReactNode;
+    /**
+     * The page's footer, below the main region.
+     * The framework's `Footer` renders a `footer` landmark, so it belongs here
+     * unwrapped.
+     */
+    footer?: ReactNode;
+    /**
+     * The page's sections, in the order they appear: a hero, then the supporting
+     * sections, then the closing call to action.
+     */
+    children?: ReactNode;
+    /**
+     * Identifier of the main region, which the skip link points at.
+     * A page with more than one composition on it gives each one its own.
+     *
+     * @default "main-content"
+     */
+    mainId?: string;
+    /**
+     * Element to render the shell as.
+     * Defaults to a `div`.
+     *
+     * @default "div"
+     */
+    as?: ElementType;
+}
+/**
+ * The arrangement a marketing page is built in.
+ *
+ * The composition states the page's structure once: navigation first, then a
+ * `main` landmark holding the sections, then the footer, with a skip link as the
+ * first focusable element so a keyboard reader can pass the navigation. Which
+ * sections exist, in what order, and whether they appear at all stay the
+ * consumer's decision, because they are passed as children.
+ *
+ * The composition paints the page background and takes the viewport height. It
+ * adds no width and no rhythm of its own: `Section`, `Container` and `Grid`
+ * inside the sections decide those, which is what keeps a section usable on its
+ * own.
+ *
+ * @param props - MarketingLayout configuration options and element attributes.
+ * @param props.navigation - The navigation, above the main region.
+ * @param props.footer - The footer, below the main region.
+ * @param props.children - The sections, in order.
+ * @param props.mainId - Identifier of the main region. Defaults to
+ * "main-content".
+ * @param props.skipLink - Render a skip link. Defaults to true.
+ * @param props.skipLinkLabel - Wording of the skip link. Defaults to "Skip to
+ * content".
+ * @param props.background - Background to paint. Defaults to "default".
+ * @param props.as - Element to render. Defaults to "div".
+ * @returns The rendered page.
+ *
+ * @example
+ * ```tsx
+ * <MarketingLayout
+ *   navigation={<Navbar brand="Ashee" links={links} actions={actions} />}
+ *   footer={<Footer brand="Ashee" groups={groups} />}>
+ *   <Hero eyebrow="AsheeUI 2.0" title="A complete UI system" primaryAction={start} />
+ *   <FeatureGrid title="Everything a page needs" features={features} />
+ *   <CTA title="Start building" primaryAction={start} />
+ * </MarketingLayout>
+ * ```
+ *
+ * @see DocsLayout - The documentation composition.
+ * @see SidebarLayout - The application shell, for a page with a navigation column.
+ */
+export declare const MarketingLayout: import('react').ForwardRefExoticComponent<MarketingLayoutProps & import('react').RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=MarketingLayout.d.ts.map

package/dist/components/marketing-layout/MarketingLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarketingLayout.d.ts","sourceRoot":"","sources":["../../../src/components/marketing-layout/MarketingLayout.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAIH,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,2BAA2B,CAAC;AAOnC,KAAK,wBAAwB,GAAG,qBAAqB,GACnD,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC;AAEhD;;GAEG;AACH,MAAM,WAAW,oBAAqB,SAAQ,wBAAwB;IACpE;;;;OAIG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;;OAKG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,eAAO,MAAM,eAAe,iHAiD3B,CAAC"}

package/dist/components/marketing-layout/MarketingLayout.js

@@ -0,0 +1,40 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { useAsheeConfig as t } from "../../libs/context.js";
+import { resolveConfigCascade as n } from "../../utils/resolve-token.js";
+import { SkipLink as r } from "../section-kit/SkipLink.js";
+import { FALLBACK_MARKETING_LAYOUT_CONFIG as i } from "./marketing-layout-config.js";
+import { MARKETING_LAYOUT_BACKGROUND_CLASS as a, MARKETING_LAYOUT_BASE_CLASS as o, MARKETING_LAYOUT_MAIN_CLASS as s } from "./marketing-layout-styles.js";
+import { forwardRef as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/marketing-layout/MarketingLayout.tsx
+var d = c(({ navigation: c, footer: d, children: f, mainId: p = "main-content", skipLink: m, skipLinkLabel: h, background: g, as: _, className: v, ...y }, b) => {
+	let x = t(), S = n({
+		skipLink: m,
+		skipLinkLabel: h,
+		background: g
+	}, x.components?.marketinglayout, i);
+	return /* @__PURE__ */ u(_ ?? "div", {
+		ref: b,
+		className: e(o, a[S.background], v),
+		...y,
+		children: [
+			S.skipLink && /* @__PURE__ */ l(r, {
+				targetId: p,
+				label: S.skipLinkLabel
+			}),
+			c,
+			/* @__PURE__ */ l("main", {
+				id: p,
+				tabIndex: -1,
+				className: s,
+				children: f
+			}),
+			d
+		]
+	});
+});
+d.displayName = "MarketingLayout";
+//#endregion
+export { d as MarketingLayout };

package/dist/components/marketing-layout/index.d.ts

@@ -0,0 +1,3 @@
+export * from './MarketingLayout';
+export * from './marketing-layout-config';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/marketing-layout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/marketing-layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,2BAA2B,CAAC"}

package/dist/components/marketing-layout/index.js

@@ -0,0 +1,3 @@
+export * from "./MarketingLayout.js";
+export * from "./marketing-layout-config.js";
+export * from "./marketing-layout-styles.js";

package/dist/components/marketing-layout/marketing-layout-config.d.ts

@@ -0,0 +1,60 @@
+/**
+ * MarketingLayout component configuration for AsheeUI.
+ * This file defines the configuration type and defaults for the marketing page
+ * composition: whether it renders a skip link, what that link says, and which
+ * background it paints. It registers the default configuration with the
+ * component registry and provides fallback values for the cascade resolution
+ * system.
+ */
+/**
+ * The background a marketing composition paints behind its content.
+ *
+ * - `default`: the theme background, for a page whose sections carry their own
+ *   surfaces.
+ * - `muted`: a recessed background, for a page whose sections are cards.
+ */
+export type MarketingLayoutBackground = "default" | "muted";
+/**
+ * Theme configuration options for the MarketingLayout component.
+ *
+ * Set under `components.marketinglayout` in the AsheeUI config. Values feed the
+ * component-level tier of the theme cascade.
+ */
+export interface MarketingLayoutConfig {
+    /**
+     * Whether the composition renders a skip link to its main region.
+     * A marketing page leads with navigation, so a keyboard reader needs to be
+     * able to pass it; the link is rendered as the first focusable element.
+     *
+     * @default true
+     */
+    skipLink?: boolean;
+    /**
+     * Wording of the skip link.
+     *
+     * @default "Skip to content"
+     */
+    skipLinkLabel?: string;
+    /**
+     * Background the composition paints.
+     *
+     * @default "default"
+     */
+    background?: MarketingLayoutBackground;
+}
+/**
+ * Default config values registered for the MarketingLayout component.
+ * The skip link is on by default because it is the accessible choice, and it
+ * costs nothing when it is not used.
+ */
+export declare const defaultMarketingLayoutConfig: MarketingLayoutConfig;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        marketinglayout: MarketingLayoutConfig;
+    }
+}
+/**
+ * Hard fallback values used when no config tier provides a value.
+ */
+export declare const FALLBACK_MARKETING_LAYOUT_CONFIG: Required<MarketingLayoutConfig>;
+//# sourceMappingURL=marketing-layout-config.d.ts.map

package/dist/components/marketing-layout/marketing-layout-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"marketing-layout-config.d.ts","sourceRoot":"","sources":["../../../src/components/marketing-layout/marketing-layout-config.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH;;;;;;GAMG;AACH,MAAM,MAAM,yBAAyB,GAAG,SAAS,GAAG,OAAO,CAAC;AAE5D;;;;;GAKG;AACH,MAAM,WAAW,qBAAqB;IACpC;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;OAIG;IACH,UAAU,CAAC,EAAE,yBAAyB,CAAC;CACxC;AAED;;;;GAIG;AACH,eAAO,MAAM,4BAA4B,EAAE,qBAI1C,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,eAAe,EAAE,qBAAqB,CAAC;KACxC;CACF;AAID;;GAEG;AACH,eAAO,MAAM,gCAAgC,EAAE,QAAQ,CAAC,qBAAqB,CAK1E,CAAC"}

package/dist/components/marketing-layout/marketing-layout-config.js

@@ -0,0 +1,16 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/marketing-layout/marketing-layout-config.ts
+var t = {
+	skipLink: !0,
+	skipLinkLabel: "Skip to content",
+	background: "default"
+};
+e("marketinglayout", t);
+var n = {
+	skipLink: !0,
+	skipLinkLabel: "Skip to content",
+	background: "default"
+};
+//#endregion
+export { n as FALLBACK_MARKETING_LAYOUT_CONFIG, t as defaultMarketingLayoutConfig };

package/dist/components/marketing-layout/marketing-layout-styles.d.ts

@@ -0,0 +1,8 @@
+import { MarketingLayoutBackground } from './marketing-layout-config';
+/** The page shell: a full-height column of regions. */
+export declare const MARKETING_LAYOUT_BASE_CLASS = "flex min-h-dvh w-full flex-col";
+/** The background the composition paints behind its sections. */
+export declare const MARKETING_LAYOUT_BACKGROUND_CLASS: Record<MarketingLayoutBackground, string>;
+/** The main region, which takes the height the header and footer leave. */
+export declare const MARKETING_LAYOUT_MAIN_CLASS = "flex w-full flex-1 flex-col";
+//# sourceMappingURL=marketing-layout-styles.d.ts.map

package/dist/components/marketing-layout/marketing-layout-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"marketing-layout-styles.d.ts","sourceRoot":"","sources":["../../../src/components/marketing-layout/marketing-layout-styles.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AAE3E,uDAAuD;AACvD,eAAO,MAAM,2BAA2B,mCAAmC,CAAC;AAE5E,iEAAiE;AACjE,eAAO,MAAM,iCAAiC,EAAE,MAAM,CACpD,yBAAyB,EACzB,MAAM,CAIP,CAAC;AAEF,2EAA2E;AAC3E,eAAO,MAAM,2BAA2B,gCAAgC,CAAC"}

package/dist/components/marketing-layout/marketing-layout-styles.js

@@ -0,0 +1,8 @@
+"use client";
+//#region src/components/marketing-layout/marketing-layout-styles.ts
+var e = "flex min-h-dvh w-full flex-col", t = {
+	default: "bg-background",
+	muted: "bg-secondary/40"
+}, n = "flex w-full flex-1 flex-col";
+//#endregion
+export { t as MARKETING_LAYOUT_BACKGROUND_CLASS, e as MARKETING_LAYOUT_BASE_CLASS, n as MARKETING_LAYOUT_MAIN_CLASS };