@idyeah/diya 0.0.0 → 1.0.0

package/dist/site-header/SiteHeader.js

@@ -0,0 +1,211 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { DEFAULT_FONT_FAMILY, useDiyaMessages } from '../DiyaProvider.js';
+import { cx } from '../internal/cx.js';
+import { useDiyaLinkComponent } from '../internal/link.js';
+import { composeRefs } from '../internal/slot.js';
+import { Button } from '../button/Button.js';
+import { Search } from '../search/Search.js';
+import { siteHeaderMessages } from './messages.js';
+const useClientLayoutEffect = typeof window === 'undefined' ? useEffect : useLayoutEffect;
+function pixels(value, fallback = 0) {
+    const number = Number.parseFloat(value);
+    return Number.isFinite(number) ? number : fallback;
+}
+/** Measure actual slot contents rather than the extra space allocated to a wrapping row. */
+function contentWidth(node) {
+    if (!node)
+        return 0;
+    const style = getComputedStyle(node);
+    const padding = pixels(style.paddingLeft) + pixels(style.paddingRight) + pixels(style.borderLeftWidth) + pixels(style.borderRightWidth);
+    const children = Array.from(node.children);
+    const hasText = Array.from(node.childNodes).some(child => child.nodeType === 3 && child.textContent?.trim());
+    if (children.length && !hasText) {
+        const width = children.reduce((total, child) => total + Math.max(child.scrollWidth, child.getBoundingClientRect().width), 0);
+        if (width)
+            return width + Math.max(0, children.length - 1) * pixels(style.columnGap || style.gap) + padding;
+    }
+    const range = node.ownerDocument.createRange();
+    range.selectNodeContents(node);
+    const width = typeof range.getBoundingClientRect === 'function' ? range.getBoundingClientRect().width : 0;
+    return width ? width + padding : Math.max(node.scrollWidth, node.getBoundingClientRect().width);
+}
+/** A responsive top bar with brand, navigation, search and utilities that collapses its links into a menu when space runs out. The ref, `className`, `style` and other attributes go to the outer container. */
+export const SiteHeader = forwardRef(function SiteHeader({ brand, brandLabel, brandHref, onBrandClick, items = [], value, onValueChange, navigationLabel, search, utilities, avatar, className, onFocusCapture, onBlurCapture, onKeyDown, ...props }, ref) {
+    const t = useDiyaMessages('siteHeader', siteHeaderMessages);
+    const Link = useDiyaLinkComponent();
+    const [open, setOpen] = useState(false);
+    const [layout, setLayout] = useState({ compact: false, stacked: false, toolsWrap: false });
+    const currentLayout = useRef(layout);
+    const container = useRef(null);
+    const setContainer = useMemo(() => composeRefs(container, ref), [ref]);
+    const headerNode = useRef(null);
+    const brandNode = useRef(null);
+    const navigation = useRef(null);
+    const tools = useRef(null);
+    const account = useRef(null);
+    const trigger = useRef(null);
+    const lastFocus = useRef(null);
+    const pendingFocus = useRef(null);
+    const textMeasure = useRef(null);
+    const id = useId();
+    const navigationKey = JSON.stringify(items);
+    // A router link that doesn't forward refs still gets measured.
+    function brandElement() {
+        return brandNode.current ?? container.current?.querySelector('.diya-site-brand') ?? null;
+    }
+    function remainingControl() {
+        const controls = Array.from(container.current?.querySelectorAll('a[href], button:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled)') ?? []);
+        return controls.find(node => !node.closest('[hidden], [inert]')) ?? headerNode.current;
+    }
+    useClientLayoutEffect(() => {
+        const node = container.current;
+        if (!node)
+            return;
+        let active = true;
+        // Navigation labels are strings. Canvas measures their real font even while
+        // collapsed, without exposing duplicate links or temporarily hiding focused nodes.
+        if (!textMeasure.current) {
+            try {
+                textMeasure.current = node.ownerDocument.createElement('canvas').getContext('2d');
+            }
+            catch { /* A conservative text-width fallback covers unavailable Canvas contexts. */ }
+        }
+        function measure() {
+            if (!active || !node)
+                return;
+            const width = node.getBoundingClientRect().width;
+            if (!width)
+                return;
+            const style = getComputedStyle(node);
+            const token = (name, fallback) => pixels(style.getPropertyValue(name), fallback);
+            const fullInset = token('--diya-internal-site-full-inset', 24);
+            const compactInset = token('--diya-internal-site-compact-inset', 16);
+            const brandGap = token('--diya-internal-site-brand-nav-gap', 32);
+            const spacer = token('--diya-internal-site-header-spacer', 24);
+            const groupGap = token('--diya-internal-site-utilities-gap', 16);
+            const compactGap = token('--diya-internal-site-compact-gap', 8);
+            const searchWidth = search ? token('--diya-internal-site-search-min-width', 160) : 0;
+            const brandWidth = contentWidth(brandElement());
+            const toolsWidth = contentWidth(tools.current);
+            const accountWidth = contentWidth(account.current);
+            const controls = [toolsWidth, accountWidth].filter(value => value > 0);
+            const nav = navigation.current;
+            const navItems = Array.from(nav?.querySelectorAll('[data-navigation-value]') ?? []);
+            const navWidth = navItems.reduce((total, item) => {
+                const itemStyle = getComputedStyle(item);
+                const label = item.textContent ?? '';
+                const context = textMeasure.current;
+                if (context)
+                    context.font = itemStyle.font || `${itemStyle.fontWeight || '400'} ${itemStyle.fontSize || '14px'} ${itemStyle.fontFamily || DEFAULT_FONT_FAMILY}`;
+                const textWidth = context?.measureText(label).width ?? label.length * pixels(itemStyle.fontSize, 14);
+                return total + textWidth + Math.max(0, Array.from(label).length - 1) * pixels(itemStyle.letterSpacing) +
+                    pixels(itemStyle.paddingLeft) + pixels(itemStyle.paddingRight) + pixels(itemStyle.borderLeftWidth) + pixels(itemStyle.borderRightWidth);
+            }, 0) + Math.max(0, navItems.length - 1) * (nav ? pixels(getComputedStyle(nav).columnGap || getComputedStyle(nav).gap, 4) : 0);
+            const trailing = [searchWidth, ...controls].filter(value => value > 0);
+            const trailingWidth = trailing.reduce((total, value) => total + value, 0) + Math.max(0, trailing.length - 1) * groupGap;
+            const fullWidth = brandWidth + (items.length ? brandGap + navWidth : 0) + (trailing.length ? spacer + trailingWidth : 0) + fullInset * 2;
+            const compact = width <= 640 || fullWidth > width;
+            const compactControls = [...controls, ...(compact && items.length ? [40] : [])];
+            const compactControlWidth = compactControls.reduce((total, value) => total + value, 0);
+            const inlineGroups = [searchWidth, ...compactControls].filter(value => value > 0);
+            const inlineWidth = brandWidth + (inlineGroups.length ? spacer : 0) + inlineGroups.reduce((total, value) => total + value, 0) + Math.max(0, inlineGroups.length - 1) * groupGap + fullInset * 2;
+            const stacked = width <= 640 || (compact && inlineWidth > width);
+            const primaryWidth = brandWidth + (compactControls.length ? compactGap : 0) + compactControlWidth + Math.max(0, compactControls.length - 1) * compactGap + compactInset * 2;
+            const toolsWrap = stacked && !!utilities && primaryWidth > width;
+            const next = { compact, stacked, toolsWrap };
+            const previous = currentLayout.current;
+            if (previous.compact === compact && previous.stacked === stacked && previous.toolsWrap === toolsWrap)
+                return;
+            const focused = node.ownerDocument.activeElement;
+            if (focused instanceof HTMLElement && node.contains(focused)) {
+                pendingFocus.current = { node: focused, navigationValue: navigation.current?.contains(focused) ? focused.dataset.navigationValue : undefined, toggle: focused === trigger.current };
+            }
+            currentLayout.current = next;
+            setOpen(false);
+            setLayout(next);
+        }
+        measure();
+        const observer = typeof ResizeObserver === 'function' ? new ResizeObserver(measure) : null;
+        [node, brandElement(), navigation.current, tools.current, account.current].forEach(element => { if (element)
+            observer?.observe(element); });
+        window.addEventListener('resize', measure);
+        const fonts = node.ownerDocument.fonts;
+        fonts?.addEventListener('loadingdone', measure);
+        void fonts?.ready.then(measure);
+        return () => {
+            active = false;
+            observer?.disconnect();
+            window.removeEventListener('resize', measure);
+            fonts?.removeEventListener('loadingdone', measure);
+        };
+    }, [navigationKey, brand, !!search, utilities, avatar, layout.compact, layout.stacked, layout.toolsWrap]);
+    useClientLayoutEffect(() => {
+        if (layout !== currentLayout.current)
+            return;
+        const recovery = pendingFocus.current;
+        pendingFocus.current = null;
+        const firstLink = navigation.current?.querySelector('a[href], button:not(:disabled)');
+        if (recovery) {
+            const matching = Array.from(navigation.current?.querySelectorAll('[data-navigation-value]') ?? []).find(node => node.dataset.navigationValue === recovery.navigationValue && !node.matches(':disabled'));
+            const destination = recovery.navigationValue !== undefined
+                ? layout.compact ? trigger.current ?? remainingControl() : matching ?? firstLink ?? remainingControl()
+                : recovery.toggle && !layout.compact ? firstLink ?? remainingControl()
+                    : recovery.node.isConnected ? recovery.node : trigger.current ?? remainingControl();
+            destination?.focus({ preventScroll: true });
+        }
+        else if (lastFocus.current && !lastFocus.current.isConnected && document.activeElement === document.body) {
+            ;
+            (trigger.current ?? remainingControl())?.focus({ preventScroll: true });
+        }
+        if (!items.length)
+            setOpen(false);
+    }, [layout, navigationKey]);
+    useEffect(() => {
+        if (!open)
+            return;
+        const outside = (event) => { if (!container.current?.contains(event.target))
+            setOpen(false); };
+        document.addEventListener('pointerdown', outside);
+        return () => document.removeEventListener('pointerdown', outside);
+    }, [open]);
+    function select(item) {
+        if (item.disabled)
+            return;
+        if (open) {
+            setOpen(false);
+            trigger.current?.focus();
+        }
+        onValueChange?.(item.value);
+    }
+    function links() {
+        return items.map((item) => item.href && !item.disabled ? (_jsx(Link, { href: item.href, "data-navigation-value": item.value, "aria-current": value === item.value ? 'page' : undefined, onClick: (event) => {
+                if (event.button || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey)
+                    return;
+                if (onValueChange)
+                    event.preventDefault();
+                select(item);
+            }, children: item.label }, item.value)) : (_jsx("button", { type: "button", disabled: item.disabled, "data-navigation-value": item.value, "aria-current": value === item.value ? 'page' : undefined, onClick: () => select(item), children: item.label }, item.value)));
+    }
+    const nav = !!items.length && _jsx("nav", { ref: navigation, id: id, className: `diya-site-nav${layout.compact ? ' diya-site-mobile-nav' : ''}`, "aria-label": navigationLabel ?? t.navigation, hidden: layout.compact && !open, children: links() }, "navigation");
+    const searchForm = search && _jsx("form", { className: "diya-site-search", role: "search", "aria-label": search.label ?? t.search, onSubmit: event => { event.preventDefault(); search.onSubmit?.(search.value); }, children: _jsx(Search, { label: search.label ?? t.search, hideLabel: true, placeholder: search.placeholder ?? t.search, value: search.value, onValueChange: search.onValueChange, clearable: true, shape: "rounded" }) }, "search");
+    const toolsGroup = utilities && _jsx("div", { ref: tools, className: "diya-site-tools", children: utilities }, "tools");
+    const avatarGroup = avatar && _jsx("div", { ref: account, className: "diya-site-avatar", children: avatar }, "avatar");
+    const toggle = layout.compact && !!items.length && _jsx(Button, { ref: trigger, className: "diya-site-menu-toggle", variant: "quiet", iconOnly: true, "aria-label": open ? t.closeNavigation : t.openNavigation, "aria-expanded": open, "aria-controls": id, onClick: () => setOpen(previous => !previous), children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", "aria-hidden": "true", children: _jsx("path", { d: open ? 'm6 6 12 12M18 6 6 18' : 'M4 7h16M4 12h16M4 17h16' }) }) }, "toggle");
+    const utilityGroup = (utilities || avatar || toggle) && _jsx("div", { className: "diya-site-utilities", children: layout.toolsWrap ? _jsxs(_Fragment, { children: [avatarGroup, toggle, toolsGroup] }) : _jsxs(_Fragment, { children: [toolsGroup, avatarGroup, toggle] }) }, "utilities");
+    return (_jsx("div", { ...props, ref: setContainer, className: cx('diya-site-header-container', className), "data-compact": layout.compact, "data-stacked": layout.stacked, "data-tools-wrap": layout.toolsWrap, onFocusCapture: event => { onFocusCapture?.(event); lastFocus.current = event.target; }, onBlurCapture: event => {
+            onBlurCapture?.(event);
+            if (!event.currentTarget.contains(event.relatedTarget) && !pendingFocus.current) {
+                setOpen(false);
+                lastFocus.current = null;
+            }
+        }, onKeyDown: event => {
+            onKeyDown?.(event);
+            if (open && event.key === 'Escape' && !event.defaultPrevented) {
+                event.preventDefault();
+                setOpen(false);
+                trigger.current?.focus();
+            }
+        }, children: _jsx("header", { ref: headerNode, tabIndex: -1, className: "diya-site-header", children: _jsxs("div", { className: "diya-site-header-row", children: [_jsxs("div", { className: "diya-site-identity", children: [brandHref ? (_jsx(Link, { ref: (node) => { brandNode.current = node; }, className: "diya-site-brand", href: brandHref, "aria-label": brandLabel ?? t.home, children: brand })) : onBrandClick ? (_jsx("button", { ref: node => { brandNode.current = node; }, type: "button", className: "diya-site-brand", "aria-label": brandLabel ?? t.home, onClick: onBrandClick, children: brand })) : (_jsx("span", { ref: node => { brandNode.current = node; }, className: "diya-site-brand", children: brand })), !layout.compact && nav] }), layout.stacked ? _jsxs(_Fragment, { children: [utilityGroup, searchForm] }) : _jsxs(_Fragment, { children: [searchForm, utilityGroup] }), layout.compact && nav] }) }) }));
+});

package/dist/site-header/messages.d.ts

@@ -0,0 +1,8 @@
+/** siteHeader: English defaults, overridable through DiyaProvider `messages`. */
+export declare const siteHeaderMessages: {
+    home: string;
+    navigation: string;
+    openNavigation: string;
+    closeNavigation: string;
+    search: string;
+};

package/dist/site-header/messages.js

@@ -0,0 +1,2 @@
+/** siteHeader: English defaults, overridable through DiyaProvider `messages`. */
+export const siteHeaderMessages = { home: 'Home', navigation: 'Main navigation', openNavigation: 'Open navigation', closeNavigation: 'Close navigation', search: 'Search' };

package/dist/slider/Slider.d.ts

@@ -0,0 +1,54 @@
+import { type InputHTMLAttributes } from 'react';
+import { sliderMessages } from './messages.js';
+declare module '../messages.js' {
+    interface DiyaMessages {
+        slider: typeof sliderMessages;
+    }
+}
+type SliderBase = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'value' | 'defaultValue' | 'min' | 'max' | 'step' | 'disabled' | 'children'> & {
+    /** Prevents dragging and dims the slider. */
+    disabled?: boolean;
+    /** Shows the current numbers above the track (the minimum and the value, or start and end in range mode); defaults to true. */
+    showValues?: boolean;
+    /** Shows a visible scale of five evenly spaced numbers from `min` to `max` under the track. */
+    showMarks?: boolean;
+    /** Formats every number the slider shows (its values and marks) and what screen readers announce for each handle, such as `(value) => '$' + value`. Defaults to the plain number. */
+    formatValue?: (value: number) => string;
+    /** Lowest value; defaults to 0. Numeric strings work too, so react-hook-form's register() spreads cleanly. */
+    min?: number | string;
+    /** Highest value; defaults to 100. Numeric strings work too. */
+    max?: number | string;
+    /** Increment between values, greater than 0; defaults to 1. Numeric strings work too. */
+    step?: number | string;
+    /** Visible label above the slider; also names the inputs for assistive tech. Hide it with hideLabel. */
+    label: string;
+    /** Hides the visible label; the inputs keep it as their accessible name. */
+    hideLabel?: boolean;
+};
+/** One number. */
+export type SliderSingleProps = SliderBase & {
+    /** Single mode (the default): one handle, leave unset or false. */
+    range?: false;
+    /** The current value when controlled; out-of-range numbers are clamped. Pair it with `onValueChange`. */
+    value?: number;
+    /** The starting value when uncontrolled; defaults to `min`, and a form reset returns to it. */
+    defaultValue?: number;
+    /** Called with the new value while dragging or on a track click. */
+    onValueChange?: (value: number) => void;
+};
+/** Two numbers, [start, end]. */
+export type SliderRangeProps = SliderBase & {
+    /** Range mode: two handles for a start and end; the handles cannot cross. */
+    range: true;
+    /** The current [start, end] when controlled, with start ≤ end. Pair it with `onValueChange`. */
+    value?: [number, number];
+    /** The starting [start, end] when uncontrolled; defaults to [min, max], and a form reset returns to it. */
+    defaultValue?: [number, number];
+    /** Called with the new [start, end] while dragging or on a track click. */
+    onValueChange?: (value: [number, number]) => void;
+};
+/** One number by default; `range` takes and returns [start, end]. Native attributes and the ref reach the (start) input; `name`, `onChange` and `onBlur` reach both inputs in range mode. */
+export type SliderProps = SliderSingleProps | SliderRangeProps;
+/** A labeled slider with one handle, or two for a start and end with `range`; 0–100 unless `min` and `max` say otherwise. */
+export declare const Slider: import("react").ForwardRefExoticComponent<SliderProps & import("react").RefAttributes<HTMLInputElement>>;
+export {};

package/dist/slider/Slider.js

@@ -0,0 +1,89 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useRef } from 'react';
+import { useDiyaMessages } from '../DiyaProvider.js';
+import { cx } from '../internal/cx.js';
+import { setNativeValue, useFormReset, useMergedRef, useNativeMirror } from '../text-input/native-field.js';
+import { sliderMessages } from './messages.js';
+const numberOr = (value, fallback) => {
+    const number = typeof value === 'string' ? Number.parseFloat(value) : value;
+    return number !== undefined && Number.isFinite(number) ? number : fallback;
+};
+const decimalsOf = (value) => (String(value).split('.')[1] ?? '').length;
+const samePair = (a, b) => a[0] === b[0] && a[1] === b[1];
+/** A labeled slider with one handle, or two for a start and end with `range`; 0–100 unless `min` and `max` say otherwise. */
+export const Slider = forwardRef(function Slider(props, ref) {
+    const { disabled = false, showValues = true, showMarks = false, formatValue, min = 0, max = 100, step = 1, label, hideLabel = false, className, style, name, form, onChange, onBlur, range: _range, value: _value, defaultValue: _defaultValue, onValueChange: _onValueChange, ...rest } = props;
+    const t = useDiyaMessages('slider', sliderMessages);
+    const range = props.range === true;
+    const lowest = numberOr(min, 0);
+    const highest = Math.max(lowest + Number.EPSILON, numberOr(max, 100));
+    const span = highest - lowest;
+    const rawStep = numberOr(step, 1);
+    const increment = rawStep > 0 ? Math.min(rawStep, span) : 1;
+    const decimals = Math.max(decimalsOf(increment), decimalsOf(lowest));
+    const clamp = (value) => Math.max(lowest, Math.min(highest, value));
+    const snap = (value) => clamp(Number((Math.round((value - lowest) / increment) * increment + lowest).toFixed(decimals)));
+    const first = useRef(null);
+    const second = useRef(null);
+    const firstRef = useMergedRef(ref, first);
+    const controlled = props.value !== undefined;
+    const fallback = props.range ? props.defaultValue ?? [lowest, highest] : [props.defaultValue ?? lowest, props.defaultValue ?? lowest];
+    const readDom = () => {
+        if (!first.current)
+            return undefined;
+        const start = Number(first.current.value);
+        return [start, range && second.current ? Number(second.current.value) : start];
+    };
+    const [current, sync] = useNativeMirror(readDom, fallback, samePair);
+    useFormReset(first, sync);
+    // Internally the slider always tracks [low, high]; a single value is [value, value].
+    const value = controlled ? props.range ? props.value ?? fallback : [props.value ?? lowest, props.value ?? lowest] : current;
+    const report = (next) => props.range ? props.onValueChange?.(next) : props.onValueChange?.(next[0]);
+    const low = Number.isFinite(value[0]) ? clamp(value[0]) : lowest;
+    const high = Number.isFinite(value[1]) ? Math.max(low, clamp(value[1])) : low;
+    const percent = (number) => `${((number - lowest) / span) * 100}%`;
+    const marks = Array.from({ length: 5 }, (_, index) => Number((lowest + (span * index) / 4).toFixed(Math.max(decimals, 2))));
+    const shared = { name, form, disabled, onBlur };
+    const show = (number) => (formatValue ? formatValue(number) : String(number));
+    return (_jsxs("div", { className: cx('diya-slider', className), style: style, "data-disabled": disabled, children: [!hideLabel && _jsx("span", { className: "diya-slider-label", "aria-hidden": "true", children: label }), showValues && (_jsxs("div", { className: "diya-slider-values", "aria-hidden": "true", children: [_jsx("span", { children: show(range ? low : lowest) }), _jsx("span", { children: show(range ? high : low) })] })), _jsxs("div", { className: "diya-slider-inputs", onPointerDown: (event) => {
+                    if (disabled || event.target instanceof HTMLInputElement)
+                        return;
+                    const box = event.currentTarget.getBoundingClientRect();
+                    const clicked = snap(lowest + ((event.clientX - box.left - 9) / (box.width - 18)) * span);
+                    const target = range && Math.abs(clicked - high) < Math.abs(clicked - low) ? second.current : first.current;
+                    if (!target)
+                        return;
+                    // Moves the handle through the input itself, so onChange and form libraries see it.
+                    setNativeValue(target, String(clicked));
+                    target.focus();
+                }, style: {
+                    '--diya-internal-slider-start': percent(range ? low : lowest),
+                    '--diya-internal-slider-end': percent(range ? high : low),
+                }, children: [_jsx("div", { className: "diya-slider-rail", "aria-hidden": "true", children: _jsx("span", {}) }), _jsx("input", { ...rest, ...shared, ref: firstRef, type: "range", min: lowest, max: highest, step: increment, ...(controlled ? { value: low } : { defaultValue: fallback[0] }), "aria-label": range ? t.minimum(label) : label, "aria-valuemax": range ? high : undefined, "aria-valuetext": formatValue ? formatValue(low) : rest['aria-valuetext'], onChange: (event) => {
+                            const pair = controlled ? [low, high] : readDom() ?? [low, high];
+                            let start = Number(event.target.value);
+                            // The handles cannot cross.
+                            if (range && start > pair[1]) {
+                                start = pair[1];
+                                if (!controlled)
+                                    event.target.value = String(start);
+                            }
+                            onChange?.(event);
+                            if (!controlled)
+                                sync();
+                            report([start, range ? pair[1] : start]);
+                        } }), range && (_jsx("input", { ...shared, ref: second, type: "range", min: lowest, max: highest, step: increment, ...(controlled ? { value: high } : { defaultValue: fallback[1] }), "aria-label": t.maximum(label), "aria-valuemin": low, "aria-valuetext": formatValue ? formatValue(high) : undefined, onChange: (event) => {
+                            const pair = controlled ? [low, high] : readDom() ?? [low, high];
+                            let end = Number(event.target.value);
+                            if (end < pair[0]) {
+                                end = pair[0];
+                                if (!controlled)
+                                    event.target.value = String(end);
+                            }
+                            onChange?.(event);
+                            if (!controlled)
+                                sync();
+                            report([pair[0], end]);
+                        } }))] }), showMarks && (_jsx("div", { className: "diya-slider-marks", "aria-hidden": "true", children: marks.map((mark) => (_jsx("span", { children: show(mark) }, mark))) }))] }));
+});

package/dist/slider/messages.d.ts

@@ -0,0 +1,5 @@
+/** slider: English defaults, overridable through DiyaProvider `messages`. */
+export declare const sliderMessages: {
+    minimum: (label: string) => string;
+    maximum: (label: string) => string;
+};

package/dist/slider/messages.js

@@ -0,0 +1,2 @@
+/** slider: English defaults, overridable through DiyaProvider `messages`. */
+export const sliderMessages = { minimum: (label) => `${label} minimum`, maximum: (label) => `${label} maximum` };