@fastsprout/reacd-shadcn 0.0.0-stage → 0.3.0

package/dist/shared/action-menu/menu-items.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useState } from 'react';
+import { Menu } from '@base-ui/react/menu';
+import { ACTION_MENU_DEFAULTS, menuDecision, invokeMenuRadio, } from '@fastsprout/reacd/adapter-runtime/core/action-menu-policy.js';
+import { MenuSurface } from './menu-surface.js';
+export const MenuSelectionContext = createContext({
+    finish: (_result, _close) => {
+        throw new Error('Menu items require a selection frame.');
+    },
+});
+export function MenuItems({ items }) {
+    return items.map((item) => _jsx(MenuItem, { item: item }, item.key));
+}
+function MenuItem({ item }) {
+    const { finish } = useContext(MenuSelectionContext);
+    switch (item.type) {
+        case 'separator':
+            return _jsx(Menu.Separator, { className: "reacd-action-separator" });
+        case 'label':
+            return _jsx("div", { className: "reacd-action-label", children: item.label });
+        case 'submenu':
+            return _jsx(Submenu, { item: item });
+        case 'action':
+            return (_jsx(Menu.Item, { className: "reacd-action-item", label: item.label, disabled: item.disabled, "data-intent": item.intent, closeOnClick: false, onClick: () => finish(item.onPress(), item.closeOnSelect ?? ACTION_MENU_DEFAULTS.closeAction), children: item.label }));
+        case 'link':
+            return item.disabled ? (_jsx(Menu.Item, { disabled: true, className: "reacd-action-item", children: item.label })) : (_jsx(Menu.LinkItem, { className: "reacd-action-item", href: item.href, target: item.newWindow ? '_blank' : undefined, rel: item.newWindow ? 'noopener noreferrer' : undefined, closeOnClick: item.closeOnSelect ?? ACTION_MENU_DEFAULTS.closeAction, children: item.label }));
+        case 'checkbox':
+            return (_jsxs(Menu.CheckboxItem, { className: "reacd-action-item", label: item.label, checked: item.checked, disabled: item.disabled, closeOnClick: false, onCheckedChange: (value, details) => {
+                    const result = item.onCheckedChange(value);
+                    if (menuDecision(result) !== 'accept')
+                        details.cancel();
+                    finish(result, item.closeOnSelect ?? ACTION_MENU_DEFAULTS.closeChoice);
+                }, children: [_jsx(Menu.CheckboxItemIndicator, { className: "reacd-action-indicator", children: "\u2713" }), item.label] }));
+        case 'radio':
+            return (_jsxs(Menu.RadioGroup, { "aria-label": item.label, value: item.value, disabled: item.disabled, onValueChange: (value, details) => {
+                    const result = invokeMenuRadio(item, value);
+                    if (menuDecision(result) !== 'accept')
+                        details.cancel();
+                    finish(result, item.closeOnSelect ?? ACTION_MENU_DEFAULTS.closeChoice);
+                }, children: [_jsx("div", { className: "reacd-action-label", children: item.label }), item.options.map((option) => (_jsxs(Menu.RadioItem, { className: "reacd-action-item", value: option.value, disabled: option.disabled, label: option.label, closeOnClick: false, children: [_jsx(Menu.RadioItemIndicator, { className: "reacd-action-indicator", children: "\u25CF" }), option.label] }, option.value)))] }));
+    }
+}
+function Submenu({ item }) {
+    const [open, setOpen] = useState(false);
+    return (_jsxs(Menu.SubmenuRoot, { open: open, onOpenChange: setOpen, disabled: item.disabled, children: [_jsxs(Menu.SubmenuTrigger, { className: "reacd-action-item", label: item.label, children: [item.label, _jsx("span", { "aria-hidden": "true", children: " \u203A" })] }), _jsx(MenuSurface, { label: item.label, submenu: true, children: _jsx(MenuItems, { items: item.items }) })] }));
+}

package/dist/shared/action-menu/menu-surface.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+export declare function MenuSurface({ label, children, context, submenu, }: {
+    label: string;
+    children: ReactNode;
+    context?: boolean;
+    submenu?: boolean;
+}): import("react").JSX.Element;

package/dist/shared/action-menu/menu-surface.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ControlSurface } from '../primitives/control-surface.js';
+import { useContext } from 'react';
+import { Menu } from '@base-ui/react/menu';
+import { ContextMenu } from '@base-ui/react/context-menu';
+import { useDirection } from '@radix-ui/react-direction';
+import { ACTION_MENU_POLICY } from '@fastsprout/reacd/adapter-runtime/core/action-menu-policy.js';
+import { ThemeVariablesContext } from '@fastsprout/reacd/adapter-runtime/renderer/theme/theme-context.js';
+import { PortalHostContext } from '@fastsprout/reacd/adapter-runtime/renderer/theme/portal-context.js';
+export function MenuSurface({ label, children, context = false, submenu = false, }) {
+    const host = useContext(PortalHostContext);
+    const variables = useContext(ThemeVariablesContext);
+    const direction = useDirection();
+    const Positioner = context ? ContextMenu.Positioner : Menu.Positioner;
+    return (_jsx(Menu.Portal, { container: host ?? undefined, children: _jsx(Positioner, { className: "reacd-root reacd-portal-root reacd-action-positioner", style: variables, dir: direction, side: submenu ? (direction === 'rtl' ? 'left' : 'right') : 'bottom', align: "start", sideOffset: ACTION_MENU_POLICY.offsetPx, collisionPadding: ACTION_MENU_POLICY.collisionPaddingPx, children: _jsx(Menu.Popup, { render: _jsx(ControlSurface, {}), className: "reacd-action-popup", "aria-label": label, children: children }) }) }));
+}

package/dist/shared/action-menu/use-menu-frame.d.ts

@@ -0,0 +1,8 @@
+import type { Menu } from '@base-ui/react/menu';
+import type { ContextMenu } from '@base-ui/react/context-menu';
+import type { DropdownMenuProps } from '@fastsprout/reacd/adapter-runtime/components/dropdown-menu/index.js';
+export declare function useMenuFrame({ open, onOpenChange, disabled, }: Pick<DropdownMenuProps, 'open' | 'onOpenChange' | 'disabled'>): {
+    active: boolean;
+    scope: import("@fastsprout/reacd/adapter-runtime/renderer/theme/escape-scope.js").EscapeScope;
+    change: (next: boolean, details: Menu.Root.ChangeEventDetails | ContextMenu.Root.ChangeEventDetails) => void;
+};

package/dist/shared/action-menu/use-menu-frame.js

@@ -0,0 +1,24 @@
+import { useContext, useState } from 'react';
+import { PortalActiveContext } from '@fastsprout/reacd/adapter-runtime/renderer/theme/portal-context.js';
+import { createEscapeScope } from '@fastsprout/reacd/adapter-runtime/renderer/theme/escape-scope.js';
+import { useEscapeLayer } from '@fastsprout/reacd/adapter-runtime/renderer/theme/use-escape-layer.js';
+export function useMenuFrame({ open, onOpenChange, disabled, }) {
+    const ancestorActive = useContext(PortalActiveContext);
+    const active = open && ancestorActive && !disabled;
+    const [scope] = useState(createEscapeScope);
+    function close() {
+        if (!scope.dismiss())
+            onOpenChange(false);
+    }
+    useEscapeLayer(active, close);
+    function change(next, details) {
+        if (details.reason === 'escape-key' && scope.dismiss()) {
+            details.event.preventDefault();
+            details.event.stopImmediatePropagation();
+            details.cancel();
+        }
+        else
+            onOpenChange(next);
+    }
+    return { active, scope, change };
+}

package/dist/shared/alert/alert.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { AlertProps } from '@fastsprout/reacd/adapter-runtime/components/alert/alert.js';
+export declare function SharedAlert({ title, message, intent, open, onOpenChange, closeLabel, icon, actions, }: AlertProps): import("react").JSX.Element | null;

package/dist/shared/alert/alert.adapter.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Alert, AlertDescription } from '../primitives/alert.js';
+import { Button } from '../primitives/button.js';
+import { SharedIcon } from '../icon/icon.adapter.js';
+import { ELEMENT_POLICY } from '@fastsprout/reacd/adapter-runtime/core/element-policy.js';
+import { ELEMENT_BUTTON_VARIANTS } from '../element/variants.js';
+import { DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/policy.js';
+export function SharedAlert({ title, message, intent, open, onOpenChange, closeLabel, icon, actions, }) {
+    if (open === false)
+        return null;
+    const urgent = intent === 'error' || intent === 'warning';
+    return (_jsx(Alert, { className: "reacd-node reacd-alert", "data-intent": intent, role: urgent ? 'alert' : 'status', variant: intent === 'error' ? 'destructive' : 'default', children: _jsxs("div", { className: "reacd-alert-layout", children: [_jsxs("div", { className: "reacd-alert-content", children: [_jsxs("div", { className: "reacd-alert-heading", children: [_jsx(SharedIcon, { name: icon ?? intent, decorative: true }), _jsx("strong", { children: title })] }), _jsx(AlertDescription, { children: message }), actions === undefined || actions.length === 0 ? null : (_jsx("div", { className: "reacd-alert-actions", children: actions.map((action) => (_jsx(Button, { type: "button", className: "reacd-button", onClick: () => action.onPress(), disabled: action.disabled, variant: ELEMENT_BUTTON_VARIANTS[action.intent ?? DEFAULTS.buttonIntent], children: action.label }, action.id))) }))] }), onOpenChange === undefined ? null : (_jsx(Button, { type: "button", variant: "ghost", className: "reacd-alert-close", "aria-label": closeLabel ?? `${ELEMENT_POLICY.dismissPrefix} ${title}`, onClick: () => onOpenChange(false), children: _jsx(SharedIcon, { name: "close", decorative: true }) }))] }) }));
+}

package/dist/shared/app/app.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { AppProps } from '@fastsprout/reacd/adapter-runtime/components/app/app.js';
+export declare function SharedApp({ children, direction, language, }: AppProps): import("react").JSX.Element;

package/dist/shared/app/app.adapter.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DirectionProvider } from '@base-ui/react/direction-provider';
+import { DirectionProvider as RadixDirectionProvider } from '@radix-ui/react-direction';
+import { APPLICATION_DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/application-shell-policy.js';
+export function SharedApp({ children, direction = APPLICATION_DEFAULTS.direction, language = APPLICATION_DEFAULTS.language, }) {
+    return (_jsx(DirectionProvider, { direction: direction, children: _jsx(RadixDirectionProvider, { dir: direction, children: _jsx("div", { className: "reacd-node reacd-app", dir: direction, lang: language, children: children }) }) }));
+}

package/dist/shared/auth-form/auth-form.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { AuthFormProps } from '@fastsprout/reacd/adapter-runtime/components/auth-form/auth-form.props.js';
+export declare function SharedAuthForm({ label, submitLabel, onSubmit, title, description, leading, header, children, footer, error, separatorLabel, providers, loading, disabled, loadingLabel, }: AuthFormProps): import("react").JSX.Element;

package/dist/shared/auth-form/auth-form.adapter.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext, useId } from 'react';
+import { AUTH_FORM_DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/auth-form-policy.js';
+import { nextHeadingLevel } from '@fastsprout/reacd/adapter-runtime/core/heading-policy.js';
+import { HeadingLevelContext } from '@fastsprout/reacd/adapter-runtime/renderer/heading/heading-context.js';
+import { PageHeading } from '@fastsprout/reacd/adapter-runtime/renderer/page-introduction/page-heading.js';
+import { FieldMetadataContext, useFieldMetadata, } from '@fastsprout/reacd/adapter-runtime/renderer/form-field/field-metadata.js';
+import { FormSurface } from '@fastsprout/reacd/adapter-runtime/renderer/form/form.renderer.js';
+import { SharedButton } from '../button/button.adapter.js';
+import { SharedSubmitButton } from '../submit-button/submit-button.adapter.js';
+export function SharedAuthForm({ label, submitLabel, onSubmit, title, description, leading, header, children, footer, error, separatorLabel, providers = AUTH_FORM_DEFAULTS.providers, loading = AUTH_FORM_DEFAULTS.loading, disabled = AUTH_FORM_DEFAULTS.disabled, loadingLabel = AUTH_FORM_DEFAULTS.loadingLabel, }) {
+    const level = useContext(HeadingLevelContext);
+    const id = useId();
+    const descendantLevel = title === undefined ? level : nextHeadingLevel(level);
+    const metadata = useFieldMetadata({ disabled: disabled || loading });
+    const blocked = metadata.disabled;
+    return (_jsxs("section", { className: "reacd-node reacd-auth-form", "aria-labelledby": title === undefined ? undefined : id, children: [_jsxs(HeadingLevelContext.Provider, { value: descendantLevel, children: [leading, header] }), _jsx(PageHeading, { title: title, id: id }), description !== undefined && _jsx("p", { children: description }), _jsxs(HeadingLevelContext.Provider, { value: descendantLevel, children: [_jsxs(FormSurface, { label: label, onSubmit: () => {
+                            if (!blocked)
+                                onSubmit();
+                        }, children: [_jsx(FieldMetadataContext, { value: metadata, children: _jsxs("fieldset", { className: "reacd-auth-fields", disabled: blocked, "aria-busy": loading, children: [_jsx("legend", { className: "sr-only", children: label }), providers.map((provider) => (_jsx(SharedButton, { label: provider.label, intent: provider.intent, disabled: blocked || provider.disabled, onPress: () => provider.onPress() }, provider.key))), separatorLabel !== undefined && _jsx("p", { children: separatorLabel }), children, error !== undefined && _jsx("p", { role: "alert", children: error }), _jsx(SharedSubmitButton, { label: submitLabel, disabled: blocked })] }) }), loading && _jsx("p", { role: "status", children: loadingLabel })] }), footer] })] }));
+}

package/dist/shared/avatar/avatar.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { AvatarProps } from '@fastsprout/reacd/adapter-runtime/components/avatar/avatar.js';
+export declare function SharedAvatar({ name, src, fallback, size, }: AvatarProps): import("react").JSX.Element;

package/dist/shared/avatar/avatar.adapter.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar as Primitive } from '@base-ui/react/avatar';
+import { AVATAR_DEFAULTS, AVATAR_DIMENSIONS, } from '@fastsprout/reacd/adapter-runtime/core/avatar-policy.js';
+import { avatarInitials } from '@fastsprout/reacd/adapter-runtime/core/avatar-text.js';
+export function SharedAvatar({ name, src, fallback, size = AVATAR_DEFAULTS.size, }) {
+    const dimensions = AVATAR_DIMENSIONS[size];
+    return (_jsxs(Primitive.Root, { className: "reacd-node reacd-avatar", "data-slot": "avatar", "data-size": size, role: "img", "aria-label": name, title: name, children: [_jsx(Primitive.Fallback, { className: "reacd-avatar-fallback", "aria-hidden": "true", children: fallback ?? avatarInitials(name) }), src !== undefined && (_jsx(Primitive.Image, { keepMounted: true, src: src, alt: "", className: "reacd-avatar-image", width: dimensions.pixels, height: dimensions.pixels, referrerPolicy: "no-referrer", decoding: "async", loading: "lazy" }))] }));
+}

package/dist/shared/avatar-group/avatar-group.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { AvatarGroupProps } from '@fastsprout/reacd/adapter-runtime/components/avatar-group/index.js';
+export declare function SharedAvatarGroup({ label, items, max, size, emptyMessage, }: AvatarGroupProps): import("react").JSX.Element;

package/dist/shared/avatar-group/avatar-group.adapter.js

@@ -0,0 +1,9 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AVATAR_DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/avatar-policy.js';
+import { SharedAvatar } from '../avatar/avatar.adapter.js';
+import { AvatarGroupOverflow } from './overflow.adapter.js';
+export function SharedAvatarGroup({ label, items, max = AVATAR_DEFAULTS.max, size = AVATAR_DEFAULTS.size, emptyMessage = AVATAR_DEFAULTS.emptyMessage, }) {
+    const visible = items.slice(0, max);
+    const hidden = items.slice(max);
+    return (_jsxs("div", { className: "reacd-node reacd-avatar-group", "data-slot": "avatar-group", "data-size": size, role: "group", "aria-label": label, children: [_jsx("p", { className: "reacd-avatar-group-label", children: label }), items.length === 0 ? (_jsx("p", { children: emptyMessage })) : (_jsxs(_Fragment, { children: [_jsx("ul", { className: "reacd-avatar-visible-list", children: visible.map((item) => (_jsx("li", { children: _jsx(SharedAvatar, { name: item.name, src: item.src, fallback: item.fallback, size: size }) }, item.id))) }), hidden.length > 0 && _jsx(AvatarGroupOverflow, { items: hidden, size: size })] }))] }));
+}

package/dist/shared/avatar-group/overflow.adapter.d.ts

@@ -0,0 +1,5 @@
+import type { AvatarGroupProps } from '@fastsprout/reacd/adapter-runtime/components/avatar-group/index.js';
+export declare function AvatarGroupOverflow({ items, size, }: {
+    items: AvatarGroupProps['items'];
+    size: AvatarGroupProps['size'];
+}): import("react").JSX.Element;

package/dist/shared/avatar-group/overflow.adapter.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { SharedAvatar } from '../avatar/avatar.adapter.js';
+export function AvatarGroupOverflow({ items, size, }) {
+    return (_jsxs("details", { className: "reacd-avatar-overflow", children: [_jsxs("summary", { children: [_jsxs("span", { className: "reacd-avatar-count", "aria-hidden": "true", children: ["+", items.length] }), _jsxs("span", { children: ["Show ", items.length, " more ", items.length === 1 ? 'person' : 'people'] })] }), _jsx("ul", { className: "reacd-avatar-hidden-list", children: items.map((item) => (_jsxs("li", { className: "reacd-avatar-person", children: [_jsx(SharedAvatar, { name: item.name, src: item.src, fallback: item.fallback, size: size }), _jsx("span", { children: item.name })] }, item.id))) })] }));
+}

package/dist/shared/badge/badge.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { BadgeProps } from '@fastsprout/reacd/adapter-runtime/components/badge/badge.js';
+export declare function SharedBadge({ label, intent, leadingIcon, size, }: BadgeProps): import("react").JSX.Element;

package/dist/shared/badge/badge.adapter.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/policy.js';
+import { Badge } from '../primitives/badge.js';
+import { ELEMENT_POLICY } from '@fastsprout/reacd/adapter-runtime/core/element-policy.js';
+import { SharedIcon } from '../icon/icon.adapter.js';
+import { ELEMENT_BUTTON_VARIANTS } from '../element/variants.js';
+export function SharedBadge({ label, intent, leadingIcon, size = ELEMENT_POLICY.badgeSize, }) {
+    return (_jsxs(Badge, { className: "reacd-node reacd-badge", variant: ELEMENT_BUTTON_VARIANTS[intent ?? DEFAULTS.badgeIntent], "data-size": size, children: [leadingIcon === undefined ? null : (_jsx(SharedIcon, { name: leadingIcon, decorative: true, size: "small" })), _jsx("span", { children: label })] }));
+}

package/dist/shared/banner/banner.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { BannerProps } from '@fastsprout/reacd/adapter-runtime/components/banner/banner.js';
+export declare function SharedBanner({ title, description, open, onOpenChange, dismissible, closeLabel, intent, actions, }: BannerProps): import("react").JSX.Element | null;

package/dist/shared/banner/banner.adapter.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId } from 'react';
+import { BANNER_DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/banner-policy.js';
+import { Alert, AlertTitle, AlertDescription } from '../primitives/alert.js';
+import { Button } from '../primitives/button.js';
+export function SharedBanner({ title, description, open, onOpenChange, dismissible = BANNER_DEFAULTS.dismissible, closeLabel = BANNER_DEFAULTS.closeLabel, intent = BANNER_DEFAULTS.intent, actions, }) {
+    const identity = useId();
+    if (!open)
+        return null;
+    const urgent = intent === 'warning' || intent === 'error';
+    return (_jsxs(Alert, { className: "reacd-node reacd-banner", "data-slot": "banner", "data-intent": intent, variant: intent === 'error' ? 'destructive' : 'default', role: urgent ? 'alert' : 'status', "aria-labelledby": identity, children: [_jsxs("div", { className: "reacd-banner-content", children: [_jsx(AlertTitle, { id: identity, children: title }), description !== undefined && (_jsx(AlertDescription, { children: description }))] }), actions !== undefined && _jsx("div", { className: "reacd-banner-actions", children: actions }), dismissible && (_jsx(Button, { className: "reacd-button reacd-banner-close", variant: "outline", type: "button", onClick: () => onOpenChange(false), children: closeLabel }))] }));
+}

package/dist/shared/blog-post/blog-post.adapter.d.ts

@@ -0,0 +1,3 @@
+import type { ReactNode } from 'react';
+import type { BlogPostProps } from '@fastsprout/reacd/adapter-runtime/components/blog-post/blog-post.props.js';
+export declare function SharedBlogPost(props: BlogPostProps): ReactNode;

package/dist/shared/blog-post/blog-post.adapter.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { EditorialEntrySurface } from '@fastsprout/reacd/adapter-runtime/renderer/editorial/editorial-entry.js';
+export function SharedBlogPost(props) {
+    return _jsx(EditorialEntrySurface, { ...props, kind: "blog" });
+}

package/dist/shared/blog-posts/blog-posts.adapter.d.ts

@@ -0,0 +1,3 @@
+import type { ReactNode } from 'react';
+import type { BlogPostsProps } from '@fastsprout/reacd/adapter-runtime/components/blog-posts/blog-posts.props.js';
+export declare function SharedBlogPosts({ children, posts, orientation, }: BlogPostsProps): ReactNode;

package/dist/shared/blog-posts/blog-posts.adapter.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Children } from 'react';
+import { BlogPost } from '@fastsprout/reacd/adapter-runtime/components/blog-post/blog-post.js';
+import { EDITORIAL_DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/editorial-policy.js';
+export function SharedBlogPosts({ children, posts = EDITORIAL_DEFAULTS.entries, orientation = EDITORIAL_DEFAULTS.collectionOrientation, }) {
+    return (_jsxs("ul", { className: "reacd-node reacd-editorial-collection", "data-orientation": orientation, children: [posts.map(({ key, ...entry }) => (_jsx("li", { children: _jsx(BlogPost, { ...entry }) }, key))), Children.map(children, (child) => (child == null ? null : _jsx("li", { children: child })))] }));
+}

package/dist/shared/breadcrumb/breadcrumb.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { BreadcrumbProps } from '@fastsprout/reacd/adapter-runtime/components/breadcrumb/breadcrumb.js';
+export declare function SharedBreadcrumb({ label, items, separator, }: BreadcrumbProps): import("react").JSX.Element;

package/dist/shared/breadcrumb/breadcrumb.adapter.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { BREADCRUMB_DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/breadcrumb-policy.js';
+import { Button } from '../primitives/button.js';
+import { useDirection } from '@radix-ui/react-direction';
+export function SharedBreadcrumb({ label, items, separator = BREADCRUMB_DEFAULTS.separator, }) {
+    const direction = useDirection();
+    return (_jsx("nav", { className: "reacd-node reacd-breadcrumb", "aria-label": label, "data-slot": "breadcrumb", "data-separator": separator, "data-direction": direction, children: _jsx("ol", { className: "reacd-breadcrumb-list", "data-slot": "breadcrumb-list", children: items.map((item, index) => {
+                const current = index === items.length - 1;
+                const activePage = current ? 'page' : undefined;
+                return (_jsxs("li", { className: "reacd-breadcrumb-item", children: [index > 0 && (_jsx("span", { "aria-hidden": "true", className: "reacd-breadcrumb-separator", children: separator === 'slash' ? '/' : '›' })), item.onPress !== undefined ? (_jsx(Button, { type: "button", variant: "link", className: "reacd-node reacd-button reacd-breadcrumb-action", onClick: pressHandler(item.onPress), disabled: item.disabled, "aria-current": activePage, children: item.label })) : item.href !== undefined && !item.disabled ? (_jsx("a", { className: "reacd-node reacd-link", href: item.href, "aria-current": activePage, children: item.label })) : (_jsx("span", { className: "reacd-breadcrumb-label", "aria-current": activePage, "aria-disabled": item.disabled || undefined, children: item.label }))] }, item.key));
+            }) }) }));
+}
+import { pressHandler } from '@fastsprout/reacd/adapter-runtime/renderer/contracts/press-handler.js';

package/dist/shared/button/button.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { ButtonProps } from '@fastsprout/reacd/adapter-runtime/components/button/button.js';
+export declare function SharedButton({ label, onPress, intent, disabled, leadingIcon, trailingIcon, loading, loadingLabel, }: ButtonProps): import("react").JSX.Element;

package/dist/shared/button/button.adapter.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/policy.js';
+import { Button } from '../primitives/button.js';
+import { SharedIcon } from '../icon/icon.adapter.js';
+import { ELEMENT_BUTTON_VARIANTS } from '../element/variants.js';
+export function SharedButton({ label, onPress, intent, disabled, leadingIcon, trailingIcon, loading, loadingLabel, }) {
+    return (_jsxs(Button, { className: "reacd-node reacd-button", variant: ELEMENT_BUTTON_VARIANTS[intent ?? DEFAULTS.buttonIntent], type: "button", "data-intent": intent ?? DEFAULTS.buttonIntent, disabled: disabled || loading, "aria-busy": loading || undefined, onClick: () => onPress(), children: [loading ? (_jsx(SharedIcon, { name: "loading", decorative: true })) : leadingIcon === undefined ? null : (_jsx(SharedIcon, { name: leadingIcon, decorative: true })), _jsx("span", { className: "reacd-button-label", children: loading ? (loadingLabel ?? label) : label }), trailingIcon === undefined ? null : (_jsx(SharedIcon, { name: trailingIcon, decorative: true }))] }));
+}

package/dist/shared/calendar/calendar-date.d.ts

@@ -0,0 +1,7 @@
+import type { TemporalLimits, TemporalRange } from '@fastsprout/reacd/adapter-runtime/core/date-time.js';
+export declare function toCalendarDate(value: string): Date;
+export declare function fromCalendarDate(value: Date): string;
+export declare function calendarInitialDate({ value, referenceDate, min, max, }: TemporalLimits & {
+    value: string | null | TemporalRange;
+    referenceDate: string;
+}): Date;

package/dist/shared/calendar/calendar-date.js

@@ -0,0 +1,24 @@
+import { CALENDAR_POLICY } from '@fastsprout/reacd/adapter-runtime/core/calendar-policy.js';
+export function toCalendarDate(value) {
+    const parts = value.split('-');
+    const date = new Date(0);
+    date.setUTCFullYear(Number(parts[0]), Number(parts[1]) - 1, Number(parts[2]));
+    date.setUTCHours(CALENDAR_POLICY.utcHour, 0, 0, 0);
+    return date;
+}
+export function fromCalendarDate(value) {
+    const year = String(value.getUTCFullYear()).padStart(CALENDAR_POLICY.yearDigits, '0');
+    const month = String(value.getUTCMonth() + 1).padStart(CALENDAR_POLICY.partDigits, '0');
+    const day = String(value.getUTCDate()).padStart(CALENDAR_POLICY.partDigits, '0');
+    return `${year}-${month}-${day}`;
+}
+export function calendarInitialDate({ value, referenceDate, min, max, }) {
+    let selected = typeof value === 'object' && value !== null
+        ? (value.start ?? value.end ?? referenceDate)
+        : (value ?? referenceDate);
+    if (min !== undefined && selected < min)
+        selected = min;
+    if (max !== undefined && selected > max)
+        selected = max;
+    return toCalendarDate(selected);
+}

package/dist/shared/calendar/calendar-day-button.d.ts

@@ -0,0 +1,2 @@
+import type { DayButtonProps } from '@daypicker/react';
+export declare function CalendarDayButton({ day, modifiers, ...properties }: DayButtonProps): import("react").JSX.Element;

package/dist/shared/calendar/calendar-day-button.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button } from '../primitives/button.js';
+import { fromCalendarDate } from './calendar-date.js';
+export function CalendarDayButton({ day, modifiers, ...properties }) {
+    return (_jsx(Button, { ...properties, ref: (element) => {
+            if (element !== null && modifiers['focused'])
+                element.focus();
+        }, variant: "ghost", className: "reacd-calendar-day", "data-calendar-day": fromCalendarDate(day.date), "data-selected": modifiers['selected'] || undefined }));
+}

package/dist/shared/calendar/calendar-form-bridge.d.ts

@@ -0,0 +1,6 @@
+import type { RefObject } from 'react';
+import type { CalendarProps } from '@fastsprout/reacd/adapter-runtime/components/calendar/index.js';
+export declare function CalendarFormBridge({ properties, region, }: {
+    properties: CalendarProps;
+    region: RefObject<HTMLDivElement | null>;
+}): import("react").JSX.Element;

package/dist/shared/calendar/calendar-form-bridge.js

@@ -0,0 +1,11 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function CalendarFormBridge({ properties, region, }) {
+    const { name, disabled, required } = properties;
+    const complete = properties.mode === 'range'
+        ? properties.value.start !== null && properties.value.end !== null
+        : properties.value !== null;
+    return (_jsxs(_Fragment, { children: [properties.mode === 'range' ? (_jsxs(_Fragment, { children: [_jsx("input", { type: "hidden", name: name === undefined ? undefined : `${name}.start`, value: properties.value.start ?? '', disabled: disabled }), _jsx("input", { type: "hidden", name: name === undefined ? undefined : `${name}.end`, value: properties.value.end ?? '', disabled: disabled })] })) : (_jsx("input", { type: "hidden", name: name, value: properties.value ?? '', disabled: disabled })), _jsx("input", { className: "reacd-calendar-validation", tabIndex: -1, "aria-hidden": "true", defaultValue: complete ? 'selected' : '', required: required, disabled: disabled, onInvalid: (event) => {
+                    event.preventDefault();
+                    region.current?.focus();
+                } }, String(complete))] }));
+}

package/dist/shared/calendar/calendar-localization.d.ts

@@ -0,0 +1,15 @@
+export declare function calendarLocalization(locale: string): {
+    formatters: {
+        formatCaption: (value: Date) => string;
+        formatDay: (value: Date) => string;
+        formatWeekdayName: (value: Date) => string;
+    };
+    labels: {
+        labelDayButton: (value: Date) => string;
+        labelGrid: (value: Date) => string;
+        labelWeekday: (value: Date) => string;
+        labelNext: () => "Next month";
+        labelPrevious: () => "Previous month";
+        labelNav: () => "Calendar navigation";
+    };
+};

package/dist/shared/calendar/calendar-localization.js

@@ -0,0 +1,28 @@
+import { CALENDAR_DEFAULTS, CALENDAR_POLICY, } from '@fastsprout/reacd/adapter-runtime/core/calendar-policy.js';
+export function calendarLocalization(locale) {
+    const options = { calendar: 'gregory', timeZone: CALENDAR_POLICY.timeZone };
+    const month = new Intl.DateTimeFormat(locale, {
+        ...options,
+        year: 'numeric',
+        month: 'long',
+    });
+    const full = new Intl.DateTimeFormat(locale, { ...options, dateStyle: 'full' });
+    const weekday = new Intl.DateTimeFormat(locale, { ...options, weekday: 'short' });
+    const weekdayName = new Intl.DateTimeFormat(locale, { ...options, weekday: 'long' });
+    const day = new Intl.NumberFormat(locale, { useGrouping: false });
+    return {
+        formatters: {
+            formatCaption: (value) => month.format(value),
+            formatDay: (value) => day.format(value.getUTCDate()),
+            formatWeekdayName: (value) => weekday.format(value),
+        },
+        labels: {
+            labelDayButton: (value) => full.format(value),
+            labelGrid: (value) => month.format(value),
+            labelWeekday: (value) => weekdayName.format(value),
+            labelNext: () => CALENDAR_DEFAULTS.nextLabel,
+            labelPrevious: () => CALENDAR_DEFAULTS.previousLabel,
+            labelNav: () => CALENDAR_DEFAULTS.navigationLabel,
+        },
+    };
+}

package/dist/shared/calendar/calendar.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { CalendarProps } from '@fastsprout/reacd/adapter-runtime/components/calendar/index.js';
+export declare function SharedCalendar(properties: CalendarProps): import("react").JSX.Element;

package/dist/shared/calendar/calendar.adapter.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, useRef } from 'react';
+import { useDirection } from '@base-ui/react/direction-provider';
+import { DayPicker } from '@daypicker/react';
+import { CALENDAR_DEFAULTS, CALENDAR_POLICY, } from '@fastsprout/reacd/adapter-runtime/core/calendar-policy.js';
+import { DATE_TIME_POLICY } from '@fastsprout/reacd/adapter-runtime/core/date-time-policy.js';
+import { nextCalendarRange } from '@fastsprout/reacd/adapter-runtime/core/calendar-range.js';
+import { CalendarDayButton } from './calendar-day-button.js';
+import { CalendarFormBridge } from './calendar-form-bridge.js';
+import { calendarInitialDate, fromCalendarDate, toCalendarDate, } from './calendar-date.js';
+import { calendarLocalization } from './calendar-localization.js';
+export function SharedCalendar(properties) {
+    const { label, referenceDate, description, locale = CALENDAR_DEFAULTS.locale, numberOfMonths = CALENDAR_DEFAULTS.numberOfMonths, weekStartsOn = CALENDAR_DEFAULTS.weekStartsOn, disabled = CALENDAR_DEFAULTS.disabled, readOnly = CALENDAR_DEFAULTS.readOnly, required = CALENDAR_DEFAULTS.required, min = DATE_TIME_POLICY.minimumDate, max = DATE_TIME_POLICY.maximumDate, } = properties;
+    const id = useId();
+    const region = useRef(null);
+    const direction = useDirection();
+    const common = {
+        ...calendarLocalization(locale),
+        defaultMonth: calendarInitialDate(properties),
+        today: toCalendarDate(referenceDate),
+        startMonth: toCalendarDate(min),
+        endMonth: toCalendarDate(max),
+        disabled: disabled
+            ? true
+            : [{ before: toCalendarDate(min) }, { after: toCalendarDate(max) }],
+        disableNavigation: disabled,
+        timeZone: CALENDAR_POLICY.timeZone,
+        numberOfMonths,
+        weekStartsOn,
+        dir: direction,
+        components: { DayButton: CalendarDayButton },
+    };
+    return (_jsxs("div", { ref: region, role: "group", "aria-labelledby": id, "aria-describedby": description === undefined ? undefined : `${id}-help`, "aria-disabled": disabled, "data-readonly": readOnly, "data-direction": direction, "data-slot": "calendar", tabIndex: -1, className: "reacd-node reacd-calendar", children: [_jsx("span", { id: id, className: "reacd-calendar-label", children: label }), _jsx("div", { className: "reacd-calendar-viewport", role: "region", "aria-label": `${label} grid`, children: properties.mode === 'range' ? (_jsx(DayPicker, { ...common, mode: "range", selected: {
+                        from: properties.value.start === null
+                            ? undefined
+                            : toCalendarDate(properties.value.start),
+                        to: properties.value.end === null
+                            ? undefined
+                            : toCalendarDate(properties.value.end),
+                    }, onSelect: (_next, trigger) => {
+                        if (!disabled && !readOnly)
+                            properties.onValueChange(nextCalendarRange(properties.value, fromCalendarDate(trigger)));
+                    } })) : (_jsx(DayPicker, { ...common, mode: "single", selected: properties.value === null ? undefined : toCalendarDate(properties.value), onSelect: (next) => {
+                        if (!disabled && !readOnly && (!required || next !== undefined))
+                            properties.onValueChange(next === undefined ? null : fromCalendarDate(next));
+                    } })) }), _jsx(CalendarFormBridge, { properties: properties, region: region }), description === undefined ? null : (_jsx("span", { id: `${id}-help`, className: "reacd-field-description", children: description }))] }));
+}

package/dist/shared/card/card.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { CardProps } from '@fastsprout/reacd/adapter-runtime/components/card/card.js';
+export declare function SharedCard({ children, spacing, label, header, footer }: CardProps): import("react").JSX.Element;

package/dist/shared/card/card.adapter.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Children } from 'react';
+import { DEFAULTS } from '@fastsprout/reacd/adapter-runtime/core/policy.js';
+import { Card, CardHeader, CardFooter } from '../primitives/card.js';
+function hasContent(value) {
+    return Children.toArray(value).some((child) => child !== '');
+}
+export function SharedCard({ children, spacing, label, header, footer }) {
+    const variables = {
+        '--reacd-gap': `var(--reacd-${spacing ?? DEFAULTS.spacing})`,
+    };
+    return (_jsxs(Card, { className: "reacd-node reacd-card", style: variables, role: label === undefined ? undefined : 'region', "aria-label": label, children: [!hasContent(header) ? null : (_jsx(CardHeader, { className: "reacd-card-slot", "data-slot": "reacd-card-header", children: header })), children, !hasContent(footer) ? null : (_jsx(CardFooter, { className: "reacd-card-slot", "data-slot": "reacd-card-footer", children: footer }))] }));
+}

package/dist/shared/carousel/carousel-panel.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+export declare function CarouselPanel({ children, active, label, index, }: {
+    children: ReactNode;
+    active: boolean;
+    label: string;
+    index: number;
+}): import("react").JSX.Element;

package/dist/shared/carousel/carousel-panel.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext, useState } from 'react';
+import { PortalActiveContext, PortalHostContext, } from '@fastsprout/reacd/adapter-runtime/renderer/theme/portal-context.js';
+export function CarouselPanel({ children, active, label, index, }) {
+    const ancestorActive = useContext(PortalActiveContext);
+    const [host, setHost] = useState(null);
+    return (_jsxs("fieldset", { className: "reacd-carousel-panel", "data-carousel-index": index, disabled: !active, hidden: !active, inert: !active, role: "group", "aria-roledescription": "slide", "aria-label": label, children: [_jsx(PortalActiveContext.Provider, { value: ancestorActive && active, children: _jsx(PortalHostContext.Provider, { value: host, children: children }) }), _jsx("div", { ref: setHost, className: "reacd-carousel-portal-host" })] }));
+}

package/dist/shared/carousel/carousel.adapter.d.ts

@@ -0,0 +1,2 @@
+import type { CarouselProps } from '@fastsprout/reacd/adapter-runtime/components/carousel/index.js';
+export declare function SharedCarousel({ label, items, value, onValueChange, disabled, readOnly, orientation, loop, state, emptyMessage, loadingMessage, errorMessage, retryLabel, onRetry, }: CarouselProps): import("react").JSX.Element;

package/dist/shared/carousel/carousel.adapter.js

@@ -0,0 +1,43 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useDirection } from '@base-ui/react/direction-provider';
+import { CAROUSEL_DEFAULTS, CAROUSEL_POLICY, } from '@fastsprout/reacd/adapter-runtime/core/carousel-policy.js';
+import { carouselSlideLabel, carouselTarget, } from '@fastsprout/reacd/adapter-runtime/core/carousel-navigation.js';
+import { Button } from '../primitives/button.js';
+import { CarouselFocusBoundary } from './focus-boundary.js';
+import { CarouselPanel } from './carousel-panel.js';
+export function SharedCarousel({ label, items, value, onValueChange, disabled, readOnly, orientation = CAROUSEL_DEFAULTS.orientation, loop = CAROUSEL_DEFAULTS.loop, state = CAROUSEL_DEFAULTS.state, emptyMessage = CAROUSEL_DEFAULTS.emptyMessage, loadingMessage = CAROUSEL_DEFAULTS.loadingMessage, errorMessage = CAROUSEL_DEFAULTS.errorMessage, retryLabel = CAROUSEL_DEFAULTS.retryLabel, onRetry, }) {
+    const direction = useDirection();
+    const protectedValue = disabled || readOnly;
+    function move(key) {
+        const next = carouselTarget(value, items.length, key, orientation, direction, loop);
+        if (next !== undefined && next !== value)
+            onValueChange(next);
+    }
+    function onKeyDown(event) {
+        if (event.target !== event.currentTarget || protectedValue || state !== 'ready')
+            return;
+        const next = carouselTarget(value, items.length, event.key, orientation, direction, loop);
+        if (next !== undefined) {
+            event.preventDefault();
+            move(event.key);
+        }
+    }
+    const forward = orientation === 'vertical'
+        ? 'ArrowDown'
+        : direction === 'rtl'
+            ? 'ArrowLeft'
+            : 'ArrowRight';
+    const backward = orientation === 'vertical'
+        ? 'ArrowUp'
+        : direction === 'rtl'
+            ? 'ArrowRight'
+            : 'ArrowLeft';
+    const currentItem = items[value];
+    const activeKey = state === 'ready'
+        ? currentItem === undefined
+            ? 'empty'
+            : `slide:${currentItem.id}`
+        : state;
+    return (_jsx(CarouselFocusBoundary, { label: label, value: value, activeKey: activeKey, onKeyDown: onKeyDown, children: state === 'loading' ? (_jsx("p", { role: "status", children: loadingMessage })) : state === 'error' ? (_jsxs("div", { children: [_jsx("p", { role: "alert", children: errorMessage }), onRetry === undefined ? null : (_jsx(Button, { type: "button", className: "reacd-button", onClick: () => onRetry(), children: retryLabel }))] })) : items.length === 0 ? (_jsx("p", { role: "status", children: emptyMessage })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "reacd-carousel-panels", "aria-live": "polite", children: items.map((item, index) => (_jsx(CarouselPanel, { index: index, active: index === value, label: carouselSlideLabel(item.label, index, items.length), children: item.children }, item.id))) }), items.length < CAROUSEL_POLICY.minimumNavigationItems ? null : (_jsxs("div", { className: "reacd-carousel-controls", children: [_jsx(Button, { type: "button", className: "reacd-button", variant: "outline", disabled: protectedValue || (!loop && value === 0), onClick: () => move(backward), children: CAROUSEL_DEFAULTS.previousLabel }), _jsx(Button, { type: "button", className: "reacd-button", variant: "outline", disabled: protectedValue ||
+                                (!loop && value === items.length - CAROUSEL_POLICY.step), onClick: () => move(forward), children: CAROUSEL_DEFAULTS.nextLabel }), _jsx("div", { role: "group", "aria-label": CAROUSEL_DEFAULTS.chooserLabel, className: "reacd-carousel-chooser", children: items.map((item, index) => (_jsx(Button, { type: "button", className: "reacd-button", variant: "ghost", "aria-label": `${item.label}, slide ${index + CAROUSEL_POLICY.step}`, "aria-pressed": index === value, disabled: protectedValue || index === value, onClick: () => onValueChange(index), children: index + CAROUSEL_POLICY.step }, item.id))) })] }))] })) }));
+}

package/dist/shared/carousel/focus-boundary.d.ts

@@ -0,0 +1,16 @@
+import { Component } from 'react';
+import type { KeyboardEvent, ReactNode } from 'react';
+interface FocusProps {
+    children: ReactNode;
+    label: string;
+    value: number;
+    activeKey: string;
+    onKeyDown: (event: KeyboardEvent<HTMLDivElement>) => void;
+}
+export declare class CarouselFocusBoundary extends Component<FocusProps, Record<string, never>, boolean> {
+    readonly container: import("react").RefObject<HTMLDivElement | null>;
+    getSnapshotBeforeUpdate(previous: Readonly<FocusProps>): boolean;
+    componentDidUpdate(_previous: Readonly<FocusProps>, _state: Readonly<Record<string, never>>, repair: boolean): void;
+    render(): ReactNode;
+}
+export {};