@apple-pie/slice 0.1.59 → 0.2.0

package/dist/cjs/chunks/Toast-pkSkNuZo.js

@@ -1,185 +0,0 @@
-'use client';
-"use strict";
-
-var tslib_es6 = require("./tslib.es6-B2uEaXWi.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
-
-require("../theme/colors.js");
-
-var theme_corners = require("../theme/corners.js");
-
-require("../theme/type.js");
-
-var misc = require("./misc-BallZ366.js");
-
-require("./broadcastChannel-DLSijpj_.js"), require("./webRTCStore-BXHg9abP.js"), 
-require("./microphoneStore-DljI0Zpj.js"), require("./volumeStore-DzgmrI6q.js"), 
-require("../hooks/useWindow.js");
-
-var ToastType, Icon = require("./Icon-BTjtQLNe.js"), ProgressIndicator = require("./ProgressIndicator-CMsc_Npc.js"), css = {
-    wrapper: "Toast-module_wrapper__1uj9O flexBox-module_rowBetween__5FEvi",
-    close: "Toast-module_close__i10-s flexBox-module_row__z24tF",
-    message: "Toast-module_message__3dP0P flexBox-module_rowStart__4tcxS",
-    progress: "Toast-module_progress__SWsbA flexBox-module_row__z24tF",
-    xs: "Toast-module_xs__ptQ-h type-module_body-xs-regular__ZAFft",
-    s: "Toast-module_s__kc5Ef type-module_body-s-regular__vRHSP",
-    m: "Toast-module_m__JtmLz type-module_body-m-regular__LuQBA",
-    l: "Toast-module_l__-W0PD type-module_body-l-regular__lOYbg",
-    xl: "Toast-module_xl__j5Zhr type-module_body-xl-regular__pF2kC"
-};
-
-exports.ToastType = void 0, (ToastType = exports.ToastType || (exports.ToastType = {})).Success = "success", 
-ToastType.Error = "error", ToastType.Warning = "warning", ToastType.Info = "info";
-
-const ToastBase = React.forwardRef((props, ref) => {
-    const {notifId: notifId, message: message = null, textSize: textSize = "m", border: border = !0, padding: padding, radius: radius = theme_corners.corners["corner-m"], container: container = "window", showDelay: showDelay = 0, duration: duration = 5e3, position: position = "bottom", offset: offset = 24, close: close = !0, progress: progress, type: type = exports.ToastType.Info, didHide: didHide = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "notifId", "message", "textSize", "border", "padding", "radius", "container", "showDelay", "duration", "position", "offset", "close", "progress", "type", "didHide" ]), theme = hooks_useTheme.useTheme(), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? `${className}` : "", [ready, setReady] = React.useState(!1), [content, setContent] = React.useState(null), timer = React.useRef(null);
-    React.useEffect(() => {
-        timer.current && clearTimeout(timer.current);
-        return message && message.length > 0 ? timer.current = setTimeout(() => {
-            setContent(message), timer.current && clearTimeout(timer.current), "Infinite" !== duration && (timer.current = setTimeout(() => {
-                setReady(!1);
-            }, duration));
-        }, showDelay) : setContent(null), () => {
-            timer.current && clearTimeout(timer.current);
-        };
-    }, [ message, showDelay, duration ]), React.useEffect(() => setReady(null !== content), [ content ]);
-    const defaultPadding = React.useMemo(() => close ? "var(--spacing-s) calc(var(--spacing-m) - var(--spacing-xs)) var(--spacing-s) var(--spacing-m)" : "var(--spacing-s) var(--spacing-m)", [ close ]), colorScheme = React.useMemo(() => {
-        switch (type) {
-          case "success":
-            return {
-                border: "var(--array-land-label)",
-                bg: "var(--array-land)",
-                text: "var(--array-land-label)"
-            };
-
-          case "warning":
-            return {
-                border: "var(--array-orange-label)",
-                bg: "var(--array-orange)",
-                text: "var(--array-orange-label)"
-            };
-
-          case "error":
-            return {
-                border: "var(--feedback-warning)",
-                bg: "var(--array-magenta)",
-                text: "var(--feedback-warning)"
-            };
-
-          default:
-            return {
-                border: "var(--core-outline-primary)",
-                bg: "var(--core-surface-secondary)",
-                text: "var(--core-text-primary)"
-            };
-        }
-    }, [ type ]), cssVars = React.useMemo(() => ({
-        "--toast-padding": 0 === padding ? "0px" : misc.setStyle(padding, defaultPadding),
-        "--toast-background": colorScheme.bg,
-        "--toast-color": colorScheme.text,
-        "--toast-border": border ? `1px solid ${colorScheme.border}` : "unset",
-        "--toast-border-radius": misc.setStyle(radius, theme_corners.corners["corner-xs"]),
-        "--toast-position": "window" === container ? "fixed" : "absolute"
-    }), [ padding, border, colorScheme, radius, defaultPadding, container ]), variants = React.useMemo(() => {
-        const positionShow = "bottom" === position ? {
-            bottom: offset
-        } : {
-            top: offset
-        }, positionHide = "bottom" === position ? {
-            bottom: -offset
-        } : {
-            top: -offset
-        }, transition = {
-            ease: "easeInOut",
-            duration: .25
-        };
-        return {
-            initial: Object.assign({
-                opacity: 0
-            }, positionHide),
-            animate: Object.assign(Object.assign({
-                opacity: 1
-            }, positionShow), {
-                transition: transition
-            }),
-            exit: Object.assign(Object.assign({
-                opacity: 0
-            }, positionHide), {
-                transition: transition
-            })
-        };
-    }, [ position, offset ]), classNames = React.useMemo(() => misc.filterClasses([ css.wrapper, css[textSize], divClass ]), [ textSize, divClass ]), handleClose = React.useCallback(() => {
-        setReady(!1);
-    }, []), handleMouseOver = React.useCallback(() => {
-        timer.current && clearTimeout(timer.current);
-    }, []), handleMouseOut = React.useCallback(() => {
-        timer.current && clearTimeout(timer.current), "Infinite" !== duration && (timer.current = setTimeout(() => {
-            setContent(null);
-        }, duration));
-    }, [ duration ]), showProgress = React.useMemo(() => void 0 !== progress ? progress : "Infinite" === duration, [ progress, duration ]), iconColor = React.useMemo(() => {
-        switch (type) {
-          case exports.ToastType.Error:
-            return theme.current.colors["feedback-warning"];
-
-          case exports.ToastType.Success:
-            return theme.current.colors["array-land-label"];
-
-          case exports.ToastType.Warning:
-            return theme.current.colors["array-orange-label"];
-
-          default:
-            return theme.current.colors["core-text-primary"];
-        }
-    }, [ type, theme ]);
-    return jsxRuntime.jsx(react.AnimatePresence, {
-        onExitComplete: () => didHide(),
-        initial: !1,
-        children: ready && jsxRuntime.jsxs(react.motion.div, Object.assign({
-            ref: ref,
-            id: divId,
-            className: classNames
-        }, rest, {
-            onMouseEnter: handleMouseOver,
-            onMouseLeave: handleMouseOut,
-            onFocus: handleMouseOver,
-            onBlur: handleMouseOut,
-            style: Object.assign(Object.assign(Object.assign({}, divStyle), cssVars), {
-                visibility: ready ? "visible" : "hidden"
-            }),
-            variants: variants,
-            initial: "initial",
-            animate: "animate",
-            exit: "exit",
-            children: [ jsxRuntime.jsxs("div", {
-                role: "status",
-                "aria-live": "polite",
-                className: css.message,
-                children: [ showProgress && jsxRuntime.jsx("div", {
-                    className: css.progress,
-                    children: jsxRuntime.jsx(ProgressIndicator.ProgressIndicator, {
-                        show: !0,
-                        inline: !0,
-                        color: iconColor
-                    })
-                }), content ]
-            }), ("Infinite" === duration || close) && jsxRuntime.jsx("div", {
-                className: css.close,
-                tabIndex: 0,
-                role: "button",
-                "aria-label": "dismiss message",
-                onKeyDown: e => misc.accessibleKeyDown(e, handleClose),
-                onClick: handleClose,
-                children: jsxRuntime.jsx(Icon.Icon, {
-                    name: "x",
-                    size: 20,
-                    strokeColor: iconColor
-                })
-            }) ]
-        }), notifId)
-    });
-});
-
-ToastBase.displayName = "Toast";
-
-const Toast = React.memo(ToastBase);
-
-exports.Toast = Toast;

package/dist/cjs/chunks/ToggleButton-DPc2x2EV.js

@@ -1,45 +0,0 @@
-'use client';
-"use strict";
-
-var jsxRuntime = require("react/jsx-runtime"), React = require("react"), IconButton = require("./IconButton-C0yNYhI6.js"), Label = require("./Label-DsMFZd91.js"), css_toggleButton = "ToggleButton-module_toggleButton__H7KgI flexBox-module_rowStart__4tcxS";
-
-exports.ToggleButton = function(props) {
-    const {label: label, textSize: textSize, icon: icon, iconOn: iconOn, selected: selected = !1, iconColor: iconColor = "var(--core-text-primary)", iconColorOn: iconColorOn = "var(--core-surface-primary)", iconColorHover: iconColorHover = "var(--core-text-primary)", backgroundColor: backgroundColor = "var(--core-surface-secondary)", backgroundColorHover: backgroundColorHover = "var(--core-surface-secondary)", backgroundColorOn: backgroundColorOn = "var(--core-text-special)", iconSize: iconSize = 20, buttonSize: buttonSize = "m", tooltip: tooltip, gap: gap = 4, unselect: unselect = !0, fill: fill = !1, disabled: disabled = !1, border: border = !1, onChange: onChange, onSelect: onSelect, onToolTip: onToolTip, children: children, presetAnimations: presetAnimations, customAnimations: customAnimations} = props, handleClick = () => {
-        if (!unselect && selected) return;
-        const newState = !selected;
-        null == onChange || onChange(newState), newState && (null == onSelect || onSelect());
-    }, cssVars = React.useMemo(() => ({
-        "--tb-gap": `${gap}px`
-    }), [ gap ]);
-    return jsxRuntime.jsxs("div", {
-        className: css_toggleButton,
-        style: cssVars,
-        children: [ icon && jsxRuntime.jsx(IconButton.IconButton, {
-            icon: selected && iconOn ? iconOn : icon,
-            buttonSize: buttonSize,
-            tooltip: tooltip,
-            toggle: !selected,
-            isToggled: selected,
-            backgroundColorOn: backgroundColorOn,
-            backgroundColorHover: backgroundColorHover,
-            backgroundColor: backgroundColor,
-            iconColor: iconColor,
-            iconColorOn: iconColorOn,
-            iconColorHover: iconColorHover,
-            onClick: handleClick,
-            iconSize: iconSize,
-            iconFill: fill,
-            disabled: disabled,
-            onToolTip: onToolTip,
-            border: border,
-            presetAnimations: presetAnimations,
-            customAnimations: customAnimations
-        }), (children || label) && jsxRuntime.jsx(Label.Label, {
-            textSize: textSize,
-            borderSize: 0,
-            padding: 0,
-            onClick: handleClick,
-            children: null != children ? children : label
-        }) ]
-    });
-};

package/dist/cjs/chunks/UploadArea-DyVGwChS.js

@@ -1,132 +0,0 @@
-'use client';
-"use strict";
-
-var jsxRuntime = require("react/jsx-runtime"), React = require("react"), theme_corners = require("../theme/corners.js"), misc = require("./misc-BallZ366.js"), FileList = require("./FileList-6qXKA_Ux.js"), Icon = require("./Icon-BTjtQLNe.js"), ProgressIndicator = require("./ProgressIndicator-CMsc_Npc.js"), css = {
-    wrapper: "UploadArea-module_wrapper__aircC flexBox-module_column__ezvMq",
-    icon: "UploadArea-module_icon__M7n-m flexBox-module_row__z24tF",
-    title: "UploadArea-module_title__VbNGq type-module_body-l-bold__Fh2dt",
-    message: "UploadArea-module_message__U1ZVM flexBox-module_row__z24tF",
-    files: "UploadArea-module_files__Q796x flexBox-module_column__ezvMq",
-    xs: "UploadArea-module_xs__-AoM7 type-module_body-xs-regular__ZAFft",
-    s: "UploadArea-module_s__wy1zN type-module_body-s-regular__vRHSP",
-    m: "UploadArea-module_m__bKuFN type-module_body-m-regular__LuQBA",
-    l: "UploadArea-module_l__KG9YN type-module_body-l-regular__lOYbg",
-    xl: "UploadArea-module_xl__xmTtW type-module_body-xl-regular__pF2kC"
-};
-
-const imageTypes = [ "png", "jpg", "jpeg", "gif", "svg", "heic", "heif" ], videoTypes = [ "mp4", "avi", "mov", "wmv", "flv" ], documentTypes = [ "pdf", "doc", "docx", "xls", "xlsx", "ppt", "pptx" ], audioTypes = [ "mp3", "wav", "ogg", "aac", "flac" ], textTypes = [ "txt", "rtf", "md", "csv", "json", "xml" ], allTypes = [ ...imageTypes, ...videoTypes, ...documentTypes, ...audioTypes, ...textTypes ];
-
-var FileTypes;
-
-!function(FileTypes) {
-    FileTypes.images = "images", FileTypes.videos = "videos", FileTypes.documents = "documents", 
-    FileTypes.audio = "audio", FileTypes.text = "text", FileTypes.all = "all", FileTypes.custom = "custom";
-}(FileTypes || (FileTypes = {}));
-
-const UploadAreaBase = React.forwardRef((props, ref) => {
-    const {icon: icon = "upload", iconColor: iconColor = "var(--core-text-primary)", iconColorHover: iconColorHover = "var(--core-text-special)", title: title = "Upload Files", width: width = "100%", height: height = "auto", message: message = "Drag and drop files here or click to upload", busyMessage: busyMessage = "Uploading in progress", iconSize: iconSize = 24, textSize: textSize = "m", borderWidth: borderWidth, border: border = 1, borderStyle: borderStyle = "dashed", borderColor: borderColor = "var(--core-outline-primary)", borderColorHover: borderColorHover = "var(--core-outline-special)", borderRadius: borderRadius, radius: radius = theme_corners.corners["corner-m"], padding: padding = "var(--spacing-xl)", backgroundColor: backgroundColor = "var(--core-surface-secondary)", backgroundColorHover: backgroundColorHover = "var(--core-surface-special)", acceptedTypes: acceptedTypes = allTypes, multiple: multiple = !0, busy: busy = !1, canRemove: canRemove = !0, showProgress: showProgress = !0, files: files = [], onUpload: onUpload} = props, [hovered, setHovered] = React.useState(!1), inputRef = React.useRef(null), dragDepth = React.useRef(0), inputId = React.useId(), titleId = React.useId(), messageId = React.useId(), isInteractive = !busy && files.length < 1, resolvedBorderWidth = null != borderWidth ? borderWidth : border, resolvedBorderRadius = null != borderRadius ? borderRadius : radius, resolvedBackgroundColor = backgroundColor, resolvedBackgroundColorHover = backgroundColorHover, handleClickUpload = React.useCallback(() => {
-        var _a;
-        isInteractive && (null == inputRef ? void 0 : inputRef.current) && (inputRef.current.value = "", 
-        null === (_a = inputRef.current) || void 0 === _a || _a.click());
-    }, [ isInteractive ]), handleFileInputChange = React.useCallback(e => {
-        busy || e.target.files && (null == onUpload || onUpload(Array.from(e.target.files)));
-    }, [ busy, onUpload ]), hasFilesInDrag = React.useCallback(e => {
-        var _a, _b;
-        return Array.from(null !== (_b = null === (_a = e.dataTransfer) || void 0 === _a ? void 0 : _a.types) && void 0 !== _b ? _b : []).includes("Files");
-    }, []), handleDragEnter = React.useCallback(e => {
-        e.preventDefault(), !busy && hasFilesInDrag(e) && (dragDepth.current += 1, 1 === dragDepth.current && setHovered(!0));
-    }, [ busy, hasFilesInDrag ]), handleDragLeave = React.useCallback(e => {
-        e.preventDefault(), busy || (dragDepth.current = Math.max(0, dragDepth.current - 1), 
-        0 === dragDepth.current && setHovered(!1));
-    }, [ busy ]), handleDrop = React.useCallback(e => {
-        var _a, _b;
-        if (e.preventDefault(), busy) return;
-        dragDepth.current = 0, setHovered(!1);
-        const files = Array.from(null !== (_b = null === (_a = e.dataTransfer) || void 0 === _a ? void 0 : _a.files) && void 0 !== _b ? _b : []);
-        null == onUpload || onUpload(files);
-    }, [ busy, onUpload ]), iconStrokeColor = React.useMemo(() => hovered ? iconColorHover : iconColor, [ hovered, iconColor, iconColorHover ]), cssVars = React.useMemo(() => ({
-        "--ua-border": `${resolvedBorderWidth}px`,
-        "--ua-border-style": borderStyle,
-        "--ua-border-color": hovered || busy ? borderColorHover : borderColor,
-        "--ua-radius": misc.setStyle(resolvedBorderRadius),
-        "--ua-padding": misc.setStyle(padding),
-        "--ua-bg-color": hovered ? resolvedBackgroundColorHover : resolvedBackgroundColor,
-        "--ua-icon-size": `${iconSize}px`,
-        "--ua-cursor": busy || files.length > 0 ? "default" : "pointer",
-        "--ua-width": misc.setStyle(width),
-        "--ua-height": misc.setStyle(height)
-    }), [ resolvedBorderWidth, borderStyle, borderColor, borderColorHover, resolvedBorderRadius, padding, resolvedBackgroundColor, resolvedBackgroundColorHover, iconSize, busy, hovered, height, files.length, width ]);
-    return jsxRuntime.jsxs("div", {
-        className: css.wrapper,
-        style: cssVars,
-        ref: ref,
-        role: isInteractive ? "button" : void 0,
-        "aria-label": isInteractive ? "Click to upload files" : void 0,
-        "aria-describedby": `${titleId} ${messageId}`,
-        "aria-disabled": !isInteractive,
-        tabIndex: isInteractive ? 0 : -1,
-        onClick: isInteractive ? handleClickUpload : void 0,
-        onKeyDown: isInteractive ? e => misc.accessibleKeyDown(e, () => handleClickUpload()) : void 0,
-        onDragEnter: handleDragEnter,
-        onDragOver: e => {
-            e.preventDefault();
-        },
-        onDragLeave: handleDragLeave,
-        onDrop: handleDrop,
-        children: [ jsxRuntime.jsx("div", {
-            className: css.icon,
-            children: jsxRuntime.jsx(Icon.Icon, {
-                size: iconSize,
-                name: icon,
-                strokeColor: iconStrokeColor,
-                pointer: !1
-            })
-        }), jsxRuntime.jsx("div", {
-            id: titleId,
-            className: css.title,
-            children: title
-        }), jsxRuntime.jsxs("div", {
-            id: messageId,
-            className: `${css.message} ${css[textSize]}`,
-            children: [ busy && showProgress && jsxRuntime.jsx(ProgressIndicator.ProgressIndicator, {
-                show: !0,
-                size: 20,
-                inline: !0,
-                color: iconStrokeColor
-            }), busy ? busyMessage : message ]
-        }), files.length > 0 && jsxRuntime.jsx("div", {
-            className: css.files,
-            children: jsxRuntime.jsx(FileList.FileList, {
-                files: files,
-                backgroundColor: "var(--core-surface-primary)",
-                textSize: "m",
-                direction: "column",
-                gap: 8,
-                iconSize: 24,
-                style: {
-                    "--file-row-vertical": "var(--spacing-s)",
-                    "--file-row-horizontal": "var(--spacing-m)",
-                    "--file-row-adjustment": "var(--spacing-xs)"
-                },
-                canRemove: canRemove
-            })
-        }), jsxRuntime.jsx("input", {
-            id: inputId,
-            ref: inputRef,
-            type: "file",
-            hidden: !0,
-            disabled: busy,
-            multiple: multiple,
-            accept: acceptedTypes ? acceptedTypes.join(", ") : void 0,
-            onChange: handleFileInputChange
-        }) ]
-    });
-});
-
-UploadAreaBase.displayName = "UploadArea";
-
-const UploadArea = React.memo(UploadAreaBase);
-
-exports.UploadArea = UploadArea, exports.allTypes = allTypes, exports.audioTypes = audioTypes, 
-exports.documentTypes = documentTypes, exports.imageTypes = imageTypes, exports.textTypes = textTypes, 
-exports.videoTypes = videoTypes;