@apple-pie/slice 0.1.59 → 0.2.0

package/dist/cjs/chunks/IconButton-KJr15EW6.js

@@ -0,0 +1,10 @@
+'use client';
+"use strict";
+
+var jsxRuntime = require("react/jsx-runtime"), React = require("react"), ActionButton = require("./ActionButton-DhHiZwXV.js");
+
+const IconButton = React.memo(function(props) {
+    return jsxRuntime.jsx(ActionButton.ActionButton, Object.assign({}, props));
+});
+
+exports.IconButton = IconButton;

package/dist/cjs/chunks/{IndexedDB-ClIpb2ob.js → IndexedDB-DwKh2Gfp.js}

@@ -1,6 +1,6 @@
 "use strict";
 
-var tslib_es6 = require("./tslib.es6-B2uEaXWi.js");
+var tslib_es6 = require("./tslib.es6-B8JY5ZGw.js");
 
 exports.IndexedDB = class {
     constructor(storeName, options = {}) {

package/dist/cjs/chunks/ModalController-D0S9VnNH.js

@@ -0,0 +1,143 @@
+'use client';
+"use strict";
+
+var tslib_es6 = require("./tslib.es6-B8JY5ZGw.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js"), modalStore = require("./modalStore-BCn998Jz.js"), misc = require("./misc-PmT7cZzC.js"), resolveColorProps = require("./resolveColorProps-DE1k1P-Z.js"), getWaterTransition = require("./getWaterTransition-s_55VKK2.js"), usePrefersReducedMotion = require("./usePrefersReducedMotion-GpD17CAE.js"), Overlay = require("./Overlay-CVZLmK8H.js"), ModalHostContext = require("./ModalHostContext-DLgUa9Vl.js"), useModalHost = require("./useModalHost-B8oi4tfb.js"), css_host = "ModalController-module_host__lt5Xy", css_container = "ModalController-module_container__3cSaO", css_box = "ModalController-module_box__cPzOz", css_wrapper = "ModalController-module_wrapper__HkOoX flexBox-module_row__z24tF";
+
+const defaultVariants = {
+    initial: {
+        opacity: 0,
+        y: 20
+    },
+    animate: {
+        opacity: 1,
+        y: 0
+    },
+    exit: {
+        opacity: 0,
+        y: 20
+    }
+}, reducedTarget = {
+    opacity: 1,
+    x: 0,
+    y: 0,
+    z: 0,
+    scale: 1,
+    scaleX: 1,
+    scaleY: 1,
+    rotate: 0,
+    rotateX: 0,
+    rotateY: 0,
+    skewX: 0,
+    skewY: 0
+}, instanceKeys = new WeakMap;
+
+let sequence = 0;
+
+function instanceKey(modal) {
+    let key = instanceKeys.get(modal);
+    return void 0 === key && (key = ++sequence, instanceKeys.set(modal, key)), key;
+}
+
+/** Bind settlement to the stored instance, including callbacks retained by asynchronous content. */ function useModalCallbacks(modal) {
+    const {hide: hide, resolve: resolve, reject: reject} = modalStore.useModalActions();
+    return {
+        dismiss: React.useCallback(() => {
+            var _a;
+            modal && modalStore.getModal() === modal && (hide(), "function" == typeof (null === (_a = modal.props) || void 0 === _a ? void 0 : _a.onClose) && modal.props.onClose());
+        }, [ modal, hide ]),
+        onResolve: React.useCallback(value => {
+            var _a;
+            modal && modalStore.getModal() === modal && (resolve(value), "function" == typeof (null === (_a = modal.props) || void 0 === _a ? void 0 : _a.onResolve) && modal.props.onResolve(value));
+        }, [ modal, resolve ]),
+        onReject: React.useCallback(error => {
+            var _a;
+            modal && modalStore.getModal() === modal && (reject(error), "function" == typeof (null === (_a = modal.props) || void 0 === _a ? void 0 : _a.onReject) && modal.props.onReject(error));
+        }, [ modal, reject ])
+    };
+}
+
+function ModalPresentation(_a) {
+    var {modal: modal, opener: opener} = _a, props = tslib_es6.__rest(_a, [ "modal", "opener" ]);
+    const {dragConstraintsRef: dragConstraintsRef, transition: transition, motionValues: motionValues, draggable: draggable = !0} = props, variants = React.useMemo(() => misc.mergedPresenceMotionValues(defaultVariants, motionValues), [ motionValues ]), [present, safeToRemove] = react.usePresence(), reduced = usePrefersReducedMotion.usePrefersReducedMotion(), {current: current} = hooks_useTheme.useTheme(), timing = React.useMemo(() => getWaterTransition.getWaterTransition(current.motion, transition), [ current.motion, transition ]), controls = react.useAnimationControls(), dragControls = react.useDragControls(), host = React.useRef(null), constraints = React.useRef(null), {dismiss: dismiss, onResolve: onResolve, onReject: onReject} = useModalCallbacks(modal);
+    useModalHost.useModalHost(host, dismiss, opener, present), React.useEffect(() => {
+        var _a;
+        if (controls.stop(), reduced) return controls.set(reducedTarget), void (present || null == safeToRemove || safeToRemove());
+        let active = !0;
+        const state = present ? "animate" : "exit", target = variants[state], definition = "function" == typeof target ? state : Object.assign(Object.assign({}, target), {
+            transition: null !== (_a = null == target ? void 0 : target.transition) && void 0 !== _a ? _a : timing
+        });
+        return controls.start(definition).then(() => {
+            active && !present && (null == safeToRemove || safeToRemove());
+        }), () => {
+            active = !1, controls.stop();
+        };
+    }, [ reduced, present, controls, safeToRemove, variants, timing ]);
+    const Component = modal.component;
+    return jsxRuntime.jsx(ModalHostContext.ModalHostContext.Provider, {
+        value: !0,
+        children: jsxRuntime.jsx("div", {
+            ref: host,
+            className: css_host,
+            tabIndex: -1,
+            inert: !present,
+            "aria-hidden": !present || void 0,
+            children: jsxRuntime.jsx("div", {
+                className: css_container,
+                ref: constraints,
+                children: jsxRuntime.jsx("div", {
+                    className: css_box,
+                    children: jsxRuntime.jsx(react.motion.div, {
+                        className: css_wrapper,
+                        variants: reduced ? void 0 : variants,
+                        initial: !reduced && "initial",
+                        animate: controls,
+                        transition: reduced ? {
+                            duration: 0,
+                            delay: 0
+                        } : timing,
+                        drag: present && draggable,
+                        dragListener: !draggable && void 0,
+                        dragControls: draggable ? dragControls : void 0,
+                        dragConstraints: draggable ? null != dragConstraintsRef ? dragConstraintsRef : constraints : void 0,
+                        dragElastic: draggable ? 0 : void 0,
+                        dragMomentum: !draggable && void 0,
+                        children: jsxRuntime.jsx(Component, Object.assign({}, modal.props, {
+                            onResolve: onResolve,
+                            onReject: onReject,
+                            onClose: dismiss,
+                            onDragPointerDown: event => {
+                                var _a;
+                                present && modalStore.getModal() === modal && ("function" == typeof (null === (_a = modal.props) || void 0 === _a ? void 0 : _a.onDragPointerDown) && modal.props.onDragPointerDown(event), 
+                                draggable && !event.defaultPrevented && dragControls.start(event));
+                            }
+                        }))
+                    })
+                })
+            })
+        })
+    });
+}
+
+exports.ModalController = function(rawProps) {
+    const props = resolveColorProps.resolveColorProps(rawProps), {overlayOpacity: overlayOpacity = .7, overlayColor: overlayColor = "rgb(0,0,0)", transition: transition} = props, {current: current} = hooks_useTheme.useTheme(), timing = React.useMemo(() => getWaterTransition.getWaterTransition(current.motion, transition), [ current.motion, transition ]), modal = modalStore.useModal(), {dismiss: dismiss} = useModalCallbacks(modal), opener = React.useRef(null);
+    return React.useEffect(() => {
+        if (modal) return;
+        const remember = event => {
+            event.target instanceof Element && (opener.current = event.target.closest("button, a[href], input, select, textarea, [tabindex]"));
+        };
+        return document.addEventListener("pointerdown", remember, !0), () => document.removeEventListener("pointerdown", remember, !0);
+    }, [ modal ]), jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx(Overlay.Overlay, {
+            show: !!modal,
+            opacity: overlayOpacity,
+            backgroundColor: overlayColor,
+            transition: timing,
+            onClick: dismiss
+        }), jsxRuntime.jsx(react.AnimatePresence, {
+            children: (null == modal ? void 0 : modal.component) && jsxRuntime.jsx(ModalPresentation, Object.assign({}, props, {
+                modal: modal,
+                opener: opener
+            }), instanceKey(modal))
+        }) ]
+    });
+};

package/dist/cjs/chunks/ModalHostContext-DLgUa9Vl.js

@@ -0,0 +1,5 @@
+"use strict";
+
+const ModalHostContext = require("react").createContext(!1);
+
+exports.ModalHostContext = ModalHostContext;

package/dist/cjs/chunks/Overlay-CVZLmK8H.js

@@ -0,0 +1,77 @@
+'use client';
+"use strict";
+
+var tslib_es6 = require("./tslib.es6-B8JY5ZGw.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js"), resolveColorProps = require("./resolveColorProps-DE1k1P-Z.js"), getWaterTransition = require("./getWaterTransition-s_55VKK2.js"), usePrefersReducedMotion = require("./usePrefersReducedMotion-GpD17CAE.js"), css_overlay = "Overlay-module_overlay__EkbfA", css_backdrop = "Overlay-module_backdrop__HLwOh";
+
+function OverlayLayer(_a) {
+    var {children: children, opacity: opacity, backgroundColor: backgroundColor, transition: transition, motionValues: motionValues, className: className, style: style, position: position = "fixed", pointerEvents: pointerEvents = "auto"} = _a, attributes = tslib_es6.__rest(_a, [ "children", "opacity", "backgroundColor", "transition", "motionValues", "className", "style", "position", "pointerEvents" ]);
+    const [isPresent, safeToRemove] = react.usePresence(), reducedMotion = usePrefersReducedMotion.usePrefersReducedMotion(), controls = react.useAnimationControls(), variants = React.useMemo(() => {
+        const defaults = {
+            initial: {
+                opacity: 0
+            },
+            animate: {
+                opacity: opacity
+            },
+            exit: {
+                opacity: 0
+            }
+        }, merged = Object.assign(Object.assign({}, defaults), motionValues);
+        for (const state of [ "initial", "animate", "exit" ]) {
+            const override = null == motionValues ? void 0 : motionValues[state];
+            override && "function" != typeof override && (merged[state] = Object.assign(Object.assign({}, defaults[state]), override));
+        }
+        return merged;
+    }, [ opacity, motionValues ]);
+    if (React.useEffect(() => {
+        if (reducedMotion) return void (isPresent || null == safeToRemove || safeToRemove());
+        let active = !0;
+        const state = isPresent ? "animate" : "exit", target = variants[state], definition = "function" == typeof target ? state : target;
+        return controls.start(definition, transition).then(() => {
+            active && !isPresent && (null == safeToRemove || safeToRemove());
+        }), () => {
+            active = !1, controls.stop();
+        };
+    }, [ controls, isPresent, reducedMotion, safeToRemove, transition, variants ]), 
+    reducedMotion && !isPresent) return null;
+    const rootStyle = Object.assign(Object.assign({}, style), {
+        "--overlay-background": backgroundColor,
+        position: position,
+        pointerEvents: pointerEvents
+    });
+    return jsxRuntime.jsxs("div", Object.assign({}, (attributes => Object.fromEntries(Object.entries(attributes).filter(([key]) => !key.startsWith("aria-") && "role" !== key)))(attributes), {
+        "data-overlay": "",
+        "data-pointer-events": pointerEvents,
+        className: `${css_overlay}${className ? ` ${className}` : ""}`,
+        style: rootStyle,
+        children: [ reducedMotion ? jsxRuntime.jsx("div", {
+            "data-overlay-backdrop": "",
+            "aria-hidden": "true",
+            className: css_backdrop,
+            style: {
+                opacity: opacity
+            }
+        }) : jsxRuntime.jsx(react.motion.div, {
+            "data-overlay-backdrop": "",
+            "aria-hidden": "true",
+            className: css_backdrop,
+            initial: "initial",
+            animate: controls,
+            variants: variants,
+            transition: transition
+        }), children ]
+    }));
+}
+
+const Overlay = React.memo(rawProps => {
+    const props = resolveColorProps.resolveColorProps(rawProps), {show: show = !1, backgroundColor: backgroundColor = "rgb(0,0,0)", opacity: opacity = 0, transition: transition} = props, attributes = tslib_es6.__rest(props, [ "show", "backgroundColor", "opacity", "transition" ]), {current: current} = hooks_useTheme.useTheme(), timing = React.useMemo(() => getWaterTransition.getWaterTransition(current.motion, transition), [ current.motion, transition ]), effectiveOpacity = Number.isFinite(opacity) ? Math.min(1, Math.max(0, opacity)) : 0;
+    return jsxRuntime.jsx(react.AnimatePresence, {
+        children: show && jsxRuntime.jsx(OverlayLayer, Object.assign({}, attributes, {
+            backgroundColor: backgroundColor,
+            opacity: effectiveOpacity,
+            transition: timing
+        }), "overlay")
+    });
+});
+
+Overlay.displayName = "Overlay", exports.Overlay = Overlay;

package/dist/cjs/chunks/Pager-QEUi0r59.js

@@ -0,0 +1,146 @@
+'use client';
+"use strict";
+
+var tslib_es6 = require("./tslib.es6-B8JY5ZGw.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js"), resolveColorProps = require("./resolveColorProps-DE1k1P-Z.js"), getWaterTransition = require("./getWaterTransition-s_55VKK2.js"), usePrefersReducedMotion = require("./usePrefersReducedMotion-GpD17CAE.js"), css_wrapper = "Pager-module_wrapper__eutVg", css_viewport = "Pager-module_viewport__3CQq8", css_bullet = "Pager-module_bullet__TxyR5", css_dot = "Pager-module_dot__7db0M";
+
+function getDotScale(index, selectedIndex, scale, factor, minimum) {
+    return Math.max(minimum, scale * Math.pow(factor, Math.abs(index - selectedIndex)));
+}
+
+/** Opacity keeps fading independently of the minimum visual dot size. */
+function getDotOpacity(index, selectedIndex, factor) {
+    return Math.pow(factor, Math.abs(index - selectedIndex));
+}
+
+function PageButton({index: index, pages: pages, selected: selected, scale: scale, opacity: opacity, color: color, colorHover: colorHover, colorOn: colorOn, window: window, onSelect: onSelect}) {
+    const [present, safeToRemove] = react.usePresence(), presenceWindow = react.usePresenceData(), liveWindow = present ? window : null != presenceWindow ? presenceWindow : window, reduced = usePrefersReducedMotion.usePrefersReducedMotion(), controls = react.useAnimationControls(), dotControls = react.useAnimationControls(), [hovered, setHovered] = React.useState(!1), dotColor = selected ? colorOn : hovered ? colorHover : color, dotScale = react.useMotionValue(scale), dotOpacity = react.useMotionValue(opacity), dotBackground = react.useMotionValue(dotColor);
+    React.useEffect(() => (reduced ? dotControls.set({
+        scale: scale,
+        opacity: opacity,
+        backgroundColor: dotColor
+    }) : dotControls.start({
+        scale: scale,
+        opacity: opacity,
+        backgroundColor: dotColor,
+        transition: liveWindow.transition
+    }), () => dotControls.stop()), [ dotControls, scale, opacity, dotColor, reduced, liveWindow.transition ]);
+    const position = react.useMotionValue((index - window.previousStart) * window.stride), x = (index - liveWindow.start) * liveWindow.stride;
+    return React.useEffect(() => {
+        if (reduced) return controls.set({
+            x: x
+        }), void (present || null == safeToRemove || safeToRemove());
+        let active = !0;
+        return controls.start({
+            x: x,
+            transition: liveWindow.transition
+        }).then(() => {
+            active && !present && (null == safeToRemove || safeToRemove());
+        }), () => {
+            active = !1, controls.stop();
+        };
+    }, [ controls, x, reduced, present, safeToRemove, liveWindow.transition ]), jsxRuntime.jsx(react.motion.button, {
+        type: "button",
+        className: css_bullet,
+        style: {
+            x: position
+        },
+        initial: {
+            x: (index - window.previousStart) * window.stride
+        },
+        animate: controls,
+        "aria-label": `Page ${index + 1} of ${pages}`,
+        "aria-current": present && selected ? "page" : void 0,
+        "aria-hidden": !present || void 0,
+        inert: !present || void 0,
+        disabled: !present,
+        onPointerEnter: () => setHovered(!0),
+        onPointerLeave: () => setHovered(!1),
+        onClick: () => onSelect(index),
+        children: jsxRuntime.jsx(react.motion.span, {
+            className: css_dot,
+            initial: !1,
+            animate: dotControls,
+            style: {
+                scale: dotScale,
+                opacity: dotOpacity,
+                backgroundColor: dotBackground
+            }
+        })
+    });
+}
+
+const Pager = React.memo(rawProps => {
+    const props = resolveColorProps.resolveColorProps(rawProps), {size: size = 10, selectedIndex: selectedIndex, defaultSelectedIndex: defaultSelectedIndex = 0, color: color = "var(--core-text-disabled)", colorHover: colorHover = "var(--core-text-disabled)", colorOn: colorOn = "var(--core-text-primary)", pages: pages = 2, gap: gap = 8, scale: scale = 1, scaleFactor: scaleFactor = .8, minScale: minScale = .5, opacityScales: opacityScales = !1, maxVisiblePages: maxVisiblePages, showMoreOn: showMoreOn, transition: transitionOverrides, onChange: onChange, className: className, style: style} = props, divAttributes = tslib_es6.__rest(props, [ "size", "selectedIndex", "defaultSelectedIndex", "color", "colorHover", "colorOn", "pages", "gap", "scale", "scaleFactor", "minScale", "opacityScales", "maxVisiblePages", "showMoreOn", "transition", "onChange", "className", "style" ]), themeMotion = hooks_useTheme.useTheme().current.motion, transition = React.useMemo(() => getWaterTransition.getWaterTransition(themeMotion, transitionOverrides), [ themeMotion, transitionOverrides ]), [localIndex, setLocalIndex] = React.useState(defaultSelectedIndex), pageCount = 
+    /** Invalid counts produce an empty pager; fractional counts use whole pages. */
+    function(pages) {
+        return Number.isFinite(pages) ? Math.max(0, Math.floor(pages)) : 0;
+    }(pages), activeIndex = function(index, pages) {
+        return pages > 0 && Number.isFinite(index) ? Math.min(pages - 1, Math.max(0, Math.floor(index))) : 0;
+    }(null != selectedIndex ? selectedIndex : localIndex, pageCount), visibleCount = pageCount < 5 ? pageCount : function(pages, maximum) {
+        return void 0 !== maximum && Number.isFinite(maximum) && maximum > 0 ? Math.min(pages, Math.max(1, Math.floor(maximum))) : pages;
+    }
+    /** Center selection after a trigger; endpoints limit how many pages can be revealed. */ (pageCount, maxVisiblePages), [windowState, setWindowState] = React.useState(() => ({
+        start: Math.max(0, Math.min(pageCount - visibleCount, activeIndex - Math.floor(visibleCount / 2))),
+        selected: activeIndex
+    })), windowStart = function(previousStart, previousIndex, index, pages, visible, showMoreOn) {
+        const lastStart = Math.max(0, pages - visible);
+        let start = Math.min(lastStart, Math.max(0, previousStart));
+        if (0 === visible || visible >= pages || pages < 5) return 0;
+        const defaultTrigger = Math.max(1, visible - 1), trigger = void 0 !== showMoreOn && Number.isInteger(showMoreOn) && showMoreOn >= 1 && showMoreOn < visible ? showMoreOn : defaultTrigger;
+        return (index > previousIndex && index >= start + trigger - 1 || index < previousIndex && index <= start + visible - trigger || index < start || index >= start + visible) && (start = index - Math.floor(visible / 2)), 
+        Math.min(lastStart, Math.max(0, start));
+    }(windowState.start, windowState.selected, activeIndex, pageCount, visibleCount, showMoreOn);
+    React.useEffect(() => {
+        setWindowState(previous => previous.start === windowStart && previous.selected === activeIndex ? previous : {
+            start: windowStart,
+            selected: activeIndex
+        });
+    }, [ windowStart, activeIndex ]);
+    const dotSize = Number.isFinite(size) && size > 0 ? size : 10, selectedScale = Number.isFinite(scale) && scale > 0 ? scale : 1, distanceFactor = Number.isFinite(scaleFactor) ? Math.min(1, Math.max(0, scaleFactor)) : .8, minimumScale = Number.isFinite(minScale) && minScale > 0 ? Math.min(selectedScale, minScale) : Math.min(selectedScale, .5), spacing = Number.isFinite(gap) ? Math.max(0, gap) : 8, slotSize = dotSize * selectedScale, window = {
+        start: windowStart,
+        previousStart: windowState.start,
+        stride: slotSize + spacing,
+        transition: transition
+    }, cssVars = {
+        "--pager-gap": `${spacing}px`,
+        "--pager-size": `${dotSize}px`,
+        "--pager-slot-size": `${slotSize}px`,
+        "--pager-window-width": `${Math.max(0, visibleCount * slotSize + (visibleCount - 1) * spacing)}px`,
+        "--pager-window-height": `${pageCount > 0 ? slotSize : 0}px`,
+        "--pager-color": color,
+        "--pager-colorOn": colorOn,
+        "--pager-colorHover": colorHover
+    };
+    return jsxRuntime.jsx("div", Object.assign({
+        role: "group",
+        "aria-label": "Pages"
+    }, divAttributes, {
+        style: Object.assign(Object.assign({}, style), cssVars),
+        className: `${css_wrapper}${className ? ` ${className}` : ""}`,
+        children: jsxRuntime.jsx("div", {
+            className: css_viewport,
+            children: jsxRuntime.jsx(react.AnimatePresence, {
+                initial: !1,
+                custom: window,
+                children: Array.from({
+                    length: visibleCount
+                }, (_, offset) => windowStart + offset).map(pageIndex => jsxRuntime.jsx(PageButton, {
+                    index: pageIndex,
+                    pages: pageCount,
+                    selected: activeIndex === pageIndex,
+                    scale: getDotScale(pageIndex, activeIndex, selectedScale, distanceFactor, minimumScale),
+                    opacity: opacityScales ? getDotOpacity(pageIndex, activeIndex, distanceFactor) : 1,
+                    color: color,
+                    colorHover: colorHover,
+                    colorOn: colorOn,
+                    window: window,
+                    onSelect: index => {
+                        activeIndex !== index && (void 0 === selectedIndex && setLocalIndex(index), null == onChange || onChange(index));
+                    }
+                }, `page-${pageIndex}`))
+            })
+        })
+    }));
+});
+
+exports.Pager = Pager;