@apple-pie/slice 0.0.6 → 0.0.8

package/dist/cjs/chunks/DrggablePanel-wWLPesc8.js

@@ -0,0 +1,202 @@
+"use strict";
+
+var tslib_es6 = require("./tslib.es6-C8dZW5nY.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
+
+require("../theme/colors.js"), require("../hooks/useWindow.js");
+
+var hooks_useObserveResize = require("../hooks/useObserveResize.js"), utils = require("./utils-BsBHecUI.js"), styleInject_es = require("./style-inject.es-CMuL-BfJ.js"), css_panel = "DraggablePanel-module_panel__r-Dm- flexBox-module_columnStart__Kg8cV", css_content = "DraggablePanel-module_content__K1gRd flexBox-module_columnStart__Kg8cV", css_handle = "DraggablePanel-module_handle__yVrgS";
+
+styleInject_es.styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}\n\n.DraggablePanel-module_panel__r-Dm- {\n\tposition: relative;\n\tbackground-color: var(--panel-bg);\n}\n\n.DraggablePanel-module_content__K1gRd {\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n.DraggablePanel-module_handle__yVrgS {\n\twidth: var(--drag-handle-width);\n\theight: var(--drag-handle-height);\n\tmin-width: var(--drag-handle-width);\n\tmin-height: var(--drag-handle-height);\n\tborder-radius: var(--drag-handle-radius);\n\tborder: var(--drag-handle-border) solid var(--drag-handle-border-color);\n\tbackground: var(--drag-handle-bg);\n\tposition: absolute;\n\ttop: 50%;\n\tleft: 50%;\n\ttransform: translateX(-50%) translateY(-50%);\n\tz-index: 15000;\n}\n");
+
+const DraggablePanel = React.memo(props => {
+    const theme = hooks_useTheme.useTheme(), {children: children, sizeConstraints: sizeConstraints = {
+        initial: 250,
+        min: 250,
+        max: 500
+    }, dragsRight: dragsRight = !0, isClosed: isClosed = !0, resizeHandle: resizeHandle = {
+        width: 10,
+        color: "transparent",
+        offsetX: !0
+    }, borderRight: borderRight = "1px solid var(--core-outline-primary)", borderLeft: borderLeft = null, bgColor: bgColor = "transparent", drags: drags = !0, isTouchDevice: isTouchDevice = !1, disableOnContext: disableOnContext = !0, dragHandle: dragHandle = !0, dragHandleStyle: dragHandleStyle, containerRef: containerRef, onResize: onResize = () => null, onResizeStart: onResizeStart = () => null, onResizeEnd: onResizeEnd = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "children", "sizeConstraints", "dragsRight", "isClosed", "resizeHandle", "borderRight", "borderLeft", "bgColor", "drags", "isTouchDevice", "disableOnContext", "dragHandle", "dragHandleStyle", "containerRef", "onResize", "onResizeStart", "onResizeEnd" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", handle = React.useRef(null), div = React.useRef(null), [isDragging, setIsDragging] = React.useState(!1), isOver = React.useRef(!1), gripper = Object.assign({}, resizeHandle), containerSize = hooks_useObserveResize.useObserveResize(containerRef), [handleHighlight, setHandleHighlight] = React.useState(!1), [lastWidth, setLastWidth] = React.useState(null), [panelClosed, setPanelClosed] = React.useState(isClosed), [constraints, setConstraints] = React.useState(sizeConstraints), [contWidth, setContWidth] = React.useState(void 0), timer = React.useRef(null), startX = React.useRef(0), startWidth = React.useRef(0), divWidth = React.useRef(0), divHeight = React.useRef(0), deltaWidth = React.useRef(0), handleWindowResize = React.useCallback(() => {
+        (null == containerRef ? void 0 : containerRef.current) || setContWidth(window.innerWidth);
+    }, [ containerRef ]), handleMouseOver = React.useCallback(() => {
+        isOver.current = !0, setHighlight(!0);
+    }, []), handleMouseOut = React.useCallback(() => {
+        isOver.current = !1, isDragging || setHighlight(!1);
+    }, [ isDragging ]), handleFocus = React.useCallback(() => {
+        isOver.current = !0, setHighlight(!0);
+    }, []), handleBlur = React.useCallback(() => {
+        isOver.current = !1, isDragging || setHighlight(!1);
+    }, [ isDragging ]), handleTouchStart = React.useCallback(() => {
+        isOver.current = !0, setHighlight(!0);
+    }, []), handleTouchEnd = React.useCallback(() => {
+        isOver.current = !1, isDragging || setHighlight(!1);
+    }, [ isDragging ]);
+    React.useEffect(() => {
+        containerRef && containerSize.width > 0 && setContWidth(containerSize.width);
+    }, [ containerSize, containerRef ]), React.useEffect(() => (contWidth || setContWidth(window.innerWidth), 
+    globalThis.addEventListener("resize", handleWindowResize), () => globalThis.removeEventListener("resize", handleWindowResize)), []), 
+    React.useEffect(() => setPanelClosed(isClosed), [ isClosed ]);
+    const adjustCurrentWidth = React.useCallback(relConst => {
+        if ((null == div ? void 0 : div.current) && relConst.max) {
+            div.current.offsetWidth > relConst.max && (div.current.style.width = `${relConst.max}px`, 
+            divWidth.current = relConst.max, setLastWidth(relConst.max));
+        }
+    }, []);
+    React.useEffect(() => {
+        if (!contWidth) return;
+        const {min: min, max: max, initial: initial} = sizeConstraints, relativeConstraints = {
+            min: min,
+            max: max,
+            initial: initial
+        };
+        for (const [key, value] of Object.entries(sizeConstraints)) {
+            let calc = value;
+            calc <= 1 && calc >= 0 && (calc = contWidth * value), calc > 1 && calc < 50 && (calc = 50), 
+            relativeConstraints[key] = calc;
+        }
+        relativeConstraints.min < relativeConstraints.initial && (relativeConstraints.initial = relativeConstraints.min), 
+        setConstraints(relativeConstraints), adjustCurrentWidth(relativeConstraints);
+    }, [ sizeConstraints, contWidth, adjustCurrentWidth ]);
+    const setHighlight = React.useCallback(state => {
+        timer.current && clearTimeout(timer.current), state ? timer.current = setTimeout(() => {
+            setHandleHighlight(state);
+        }, isTouchDevice ? 0 : 350) : setHandleHighlight(!1);
+    }, [ isTouchDevice ]), getClientX = React.useCallback(e => utils.pointerPosition(e), []), getNewWidth = React.useCallback(clientX => dragsRight ? startWidth.current + clientX - startX.current : startWidth.current - clientX + startX.current, [ dragsRight ]), canDrag = React.useCallback((newWidth, clientX) => {
+        if (null == constraints ? void 0 : constraints.min) {
+            if (newWidth <= constraints.min) return !1;
+            if (newWidth < constraints.min) return !1;
+        }
+        return !((null == constraints ? void 0 : constraints.max) && newWidth >= constraints.max && clientX - startX.current > 0);
+    }, [ constraints ]), doDrag = React.useCallback(e => {
+        if (null == div ? void 0 : div.current) {
+            e.stopPropagation(), e.preventDefault();
+            const el = div.current, clientX = getClientX(e), newWidth = getNewWidth(clientX);
+            if (!canDrag(newWidth, clientX)) return;
+            el.style.width = `${newWidth}px`, divWidth.current = newWidth, deltaWidth.current = clientX - startX.current, 
+            onResize({
+                div: div,
+                divWidth: divWidth.current,
+                divHeight: divHeight.current,
+                deltaWidth: deltaWidth.current
+            });
+        }
+        return !1;
+    }, [ onResize, canDrag, getNewWidth, getClientX ]), stopDrag = React.useCallback(() => {
+        if (setIsDragging(!1), document.documentElement.removeEventListener("mousemove", doDrag, !1), 
+        document.documentElement.removeEventListener("mouseup", stopDrag, !1), document.documentElement.removeEventListener("touchmove", doDrag, !1), 
+        document.documentElement.removeEventListener("touchend", stopDrag, !1), document.documentElement.style.userSelect = "auto", 
+        document.documentElement.style.webkitUserSelect = "auto", null == div ? void 0 : div.current) {
+            divWidth.current = div.current.offsetWidth, divHeight.current = div.current.offsetHeight, 
+            deltaWidth.current = 0;
+            const update = {
+                div: div,
+                divWidth: divWidth.current,
+                divHeight: divHeight.current,
+                deltaWidth: deltaWidth.current
+            };
+            onResize(update), onResizeEnd(update);
+        }
+        setLastWidth(divWidth.current), isOver.current || setHighlight(!1);
+    }, [ doDrag, onResizeEnd, onResize, setHighlight ]), initDrag = React.useCallback(e => {
+        if ((null == div ? void 0 : div.current) && document.defaultView) {
+            setIsDragging(!0);
+            const el = div.current;
+            divWidth.current = div.current.offsetWidth, divHeight.current = div.current.offsetHeight, 
+            deltaWidth.current = 0, startX.current = utils.pointerPosition(e), startWidth.current = Number.parseInt(document.defaultView.getComputedStyle(el).width, 10), 
+            document.documentElement.addEventListener("mousemove", doDrag, !1), document.documentElement.addEventListener("mouseup", stopDrag, !1), 
+            document.documentElement.addEventListener("touchmove", doDrag, !1), document.documentElement.addEventListener("touchend", stopDrag, !1), 
+            document.documentElement.style.userSelect = "none", document.documentElement.style.webkitUserSelect = "none";
+            const update = {
+                div: div,
+                divWidth: divWidth.current,
+                divHeight: divHeight.current,
+                deltaWidth: deltaWidth.current
+            };
+            onResize(update), onResizeStart(update);
+        }
+    }, [ doDrag, stopDrag, onResize, onResizeStart ]);
+    React.useEffect(() => {
+        const hl = null == handle ? void 0 : handle.current;
+        return hl && drags && (hl.addEventListener("mousedown", initDrag, !1), hl.addEventListener("touchstart", initDrag, {
+            passive: !0
+        })), () => {
+            hl && (hl.removeEventListener("mousedown", initDrag, !1), hl.removeEventListener("touchstart", initDrag));
+        };
+    }, [ drags, initDrag ]);
+    const leftRightStyle = React.useMemo(() => dragsRight ? {
+        right: isTouchDevice ? -22 : -(gripper.width || 10) / 2
+    } : {
+        left: isTouchDevice ? -22 : -(gripper.width || 10) / 2
+    }, [ dragsRight, isTouchDevice, gripper.width ]), width = React.useMemo(() => drags ? panelClosed ? 0 : lastWidth || constraints.initial : "100%", [ drags, panelClosed, lastWidth, constraints.initial ]), cssVars = React.useMemo(() => ({
+        "--panel-bg": null != bgColor ? bgColor : "transparent"
+    }), [ bgColor ]);
+    return jsxRuntime.jsxs("div", Object.assign({
+        id: divId,
+        className: `${css_panel}${divClass}`,
+        ref: div,
+        onContextMenu: e => (disableOnContext && e.preventDefault(), !0),
+        style: Object.assign(Object.assign(Object.assign({}, divStyle), cssVars), {
+            overflow: "visible",
+            width: width,
+            height: "100%",
+            maxWidth: drags ? constraints.max : "unset",
+            transition: isDragging ? "" : "width 0.2s ease",
+            borderRight: !panelClosed && borderRight && drags ? borderRight : "none",
+            borderLeft: !panelClosed && borderLeft && drags ? borderLeft : "none"
+        })
+    }, rest, {
+        children: [ jsxRuntime.jsxs("div", {
+            ref: handle,
+            style: Object.assign(Object.assign({
+                position: "absolute",
+                boxSizing: "border-box",
+                display: panelClosed || !drags ? "none" : "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                zIndex: 1,
+                top: 0
+            }, leftRightStyle), {
+                bottom: 0,
+                width: isTouchDevice ? 44 : gripper.width,
+                backgroundColor: resizeHandle.color,
+                cursor: "col-resize",
+                overflow: "visible"
+            }),
+            onMouseOver: handleMouseOver,
+            onMouseOut: handleMouseOut,
+            onFocus: handleFocus,
+            onBlur: handleBlur,
+            onTouchStart: handleTouchStart,
+            onTouchEnd: handleTouchEnd,
+            children: [ dragHandle && !panelClosed && jsxRuntime.jsx(DragHandle, Object.assign({}, null != dragHandleStyle ? dragHandleStyle : {})), jsxRuntime.jsx("div", {
+                style: {
+                    backgroundColor: handleHighlight ? theme.current.colors["core-outline-primary"] : "transparent",
+                    flex: 1,
+                    maxWidth: 3,
+                    height: "100%",
+                    pointerEvents: "none",
+                    transition: "background-color 0.2s ease"
+                }
+            }) ]
+        }), jsxRuntime.jsx("div", {
+            className: css_content,
+            children: children
+        }) ]
+    }));
+}), DragHandle = React.memo(props => {
+    const {width: width = 6, height: height = 6, radius: radius = 100, stroke: stroke = 1, color: color = "var(--core-surface-primary)", strokeColor: strokeColor = "var(--core-outline-primary)"} = props, cssVars = React.useMemo(() => ({
+        "--drag-handle-width": `${width}px`,
+        "--drag-handle-height": `${height}px`,
+        "--drag-handle-radius": `${radius}px`,
+        "--drag-handle-border": `${stroke}px`,
+        "--drag-handle-border-color": `${strokeColor}`,
+        "--drag-handle-bg": `${color}`
+    }), [ width, height, radius, stroke, color, strokeColor ]);
+    return jsxRuntime.jsx("div", {
+        className: css_handle,
+        style: cssVars
+    });
+});
+
+exports.DraggablePanel = DraggablePanel;

package/dist/cjs/chunks/DropDown-COdCr77A.js

@@ -0,0 +1,102 @@
+"use strict";
+
+var tslib_es6 = require("./tslib.es6-C8dZW5nY.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
+
+require("../theme/colors.js"), require("../hooks/useWindow.js");
+
+var _types = require("./_types-B5xXv4NA.js"), styleInject_es = require("./style-inject.es-CMuL-BfJ.js"), css = {
+    wrapper: "DropDown-module_wrapper__56asG flexBox-module_rowStart__nJZnW",
+    face: "DropDown-module_face__kF56R flexBox-module_rowStart__nJZnW",
+    small: "DropDown-module_small__QYoM4 type-module_body-s-regular__8-FO-",
+    medium: "DropDown-module_medium__FrKVH type-module_body-m-regular__Qtp5G",
+    large: "DropDown-module_large__O1hDm type-module_body-l-regular__Ar4d3",
+    chevron: "DropDown-module_chevron__upYr7 flexBox-module_rowStart__nJZnW",
+    select: "DropDown-module_select__1rQRA"
+};
+
+styleInject_es.styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.DropDown-module_wrapper__56asG {\n\tposition: relative;\n\tgap: var(--dd-gap);\n\tmin-width: var(--dd-width);\n\twidth: var(--dd-width);\n\tborder-radius: var(--dd-border-radius);\n\tbackground-color: var(--dd-bg-color);\n\tbox-shadow: 0 0 0 var(--dd-box-shadow-size) var(--dd-border-color);\n\tpadding: var(--dd-padding-tops) var(--dd-padding-left) var(--dd-padding-tops)\n\t\tvar(--dd-padding-right) !important;\n\ttransition: all 0.2s ease-in-out 0s;\n}\n\n.DropDown-module_face__kF56R {\n\tflex: 1;\n\toverflow: hidden;\n\tdisplay: -webkit-box;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n\ttext-overflow: ellipsis;\n\tword-break: break-all;\n\tcolor: var(--dd-color);\n}\n\n.DropDown-module_small__QYoM4 {\n}\n\n.DropDown-module_medium__FrKVH {\n}\n\n.DropDown-module_large__O1hDm {\n}\n\n.DropDown-module_chevron__upYr7 {\n\tmin-height: var(--dd-icon-size);\n\tmax-height: var(--dd-icon-size);\n\tmin-width: var(--dd-icon-size);\n\tmax-width: var(--dd-icon-size);\n}\n\n.DropDown-module_select__1rQRA {\n\tposition: absolute;\n\topacity: 0;\n\twidth: 100%;\n\theight: 100%;\n\tfont-size: 14px;\n\tbackground-color: #1f99cd;\n\tbackground-position: right 10px center;\n\tbackground-repeat: no-repeat;\n\tbackground-size: auto 50%;\n\tborder: none;\n\toutline: none;\n\t-moz-appearance: none;\n\t-webkit-appearance: none;\n\tappearance: none;\n\t&::-ms-expand {\n\t\tdisplay: none;\n\t}\n}\n");
+
+const DropDown = React.memo(props => {
+    const theme = hooks_useTheme.useTheme(), {name: name = "Select", width: width = "100%", height: height = "auto", selectedIndex: selectedIndex = 0, selectedValue: selectedValue = "", options: options = [], placeholder: placeholder = !0, validate: validate = !0, borderRadius: borderRadius = 4, bgColor: bgColor = "transparent", iconColor: iconColor = theme.current.colors["core-icon-primary"], paddingLeft: paddingLeft = "8px", paddingRight: paddingRight = "12px", paddingTops: paddingTops = "8px", iconSize: iconSize = 20, disabled: disabled = !1, unframed: unframed = !1, focused: focused = !1, gap: gap = 0, size: size = "medium", onChange: onChange = () => null, onValidate: onValidate = () => null, onFocus: onFocus = () => null, onBlur: onBlur = () => null} = props, divAttributes = tslib_es6.__rest(props, [ "name", "width", "height", "selectedIndex", "selectedValue", "options", "placeholder", "validate", "borderRadius", "bgColor", "iconColor", "paddingLeft", "paddingRight", "paddingTops", "iconSize", "disabled", "unframed", "focused", "gap", "size", "onChange", "onValidate", "onFocus", "onBlur" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", [index, setIndex] = React.useState(selectedIndex), [selectedText, setSelectedText] = React.useState("Select an option"), [initiated, setInitiated] = React.useState(!1), [color, setColor] = React.useState(iconColor), ref = React.useRef(null);
+    React.useEffect(() => setColor(theme.current.colors["core-icon-primary"]), [ theme ]), 
+    React.useEffect(() => {
+        let valid = !0;
+        validate && placeholder && 0 === index && (valid = !1), initiated || (valid = !0), 
+        onValidate(valid);
+    }, [ index, validate, placeholder, initiated, onValidate ]), React.useEffect(() => {
+        focused && (null == ref ? void 0 : ref.current) && (setInitiated(!0), ref.current.click());
+    }, [ focused ]), React.useEffect(() => {
+        if (null == ref ? void 0 : ref.current) {
+            if (!(null == options ? void 0 : options[selectedIndex])) return;
+            const label = options[selectedIndex].label || "Select an option";
+            setIndex(selectedIndex), setSelectedText(label), ref.current.selectedIndex = selectedIndex;
+        }
+    }, [ selectedIndex, options ]), React.useEffect(() => {
+        if (!options || 0 === options.length || "" === selectedValue) return;
+        const foundIndex = options.findIndex(option => {
+            var _a, _b, _c;
+            return (null === (_a = null == option ? void 0 : option.value) || void 0 === _a ? void 0 : _a.toLowerCase()) === selectedValue.toString().toLowerCase() || (null === (_b = null == option ? void 0 : option.label) || void 0 === _b ? void 0 : _b.toLowerCase()) === selectedValue.toString().toLowerCase() || (null === (_c = null == option ? void 0 : option.alt) || void 0 === _c ? void 0 : _c.toLowerCase()) === selectedValue.toString().toLowerCase();
+        });
+        if (-1 !== foundIndex) {
+            const label = options[foundIndex].label || "Select an option";
+            setSelectedText(label), setIndex(foundIndex), ref.current && (ref.current.selectedIndex = foundIndex);
+        }
+    }, [ selectedValue, options ]);
+    const handleChange = React.useCallback(i => {
+        if (!options) return;
+        const label = options[i].label || "Select an option";
+        setIndex(i), setSelectedText(label), index !== i && onChange(i, options[i]), onBlur(options[i].label || "");
+    }, [ options, index, onChange, onBlur ]), handleFocus = React.useCallback(() => {
+        setInitiated(!0), onFocus();
+    }, [ onFocus ]), renderedOptions = React.useMemo(() => options ? options.map((option, i) => jsxRuntime.jsx("option", {
+        value: null == option ? void 0 : option.value,
+        onMouseUp: () => handleChange(i),
+        children: null == option ? void 0 : option.label
+    }, `${null == option ? void 0 : option.value}_${i}`)) : null, [ options, handleChange ]), displayText = React.useMemo(() => selectedText.replace("-- ", ""), [ selectedText ]), handleMouseDown = React.useCallback(e => {
+        disabled && e.preventDefault(), handleFocus();
+    }, [ disabled, handleFocus ]), handleSelectChange = React.useCallback(e => {
+        handleChange(e.target.selectedIndex);
+    }, [ handleChange ]), getSize = React.useCallback(value => "string" == typeof value ? value : `${value}px`, []), cssVars = React.useMemo(() => ({
+        "--dd-gap": `${gap}px`,
+        "--dd-height": `${getSize(height)}`,
+        "--dd-width": `${getSize(width)}`,
+        "--dd-margin": "8px",
+        "--dd-border-radius": borderRadius ? `${borderRadius}px` : "4px",
+        "--dd-box-shadow-size": unframed ? "0" : "1px",
+        "--dd-border-color": unframed ? "transparent" : "var(--core-outline-primary)",
+        "--dd-bg-color": null != bgColor ? bgColor : "transparent",
+        "--dd-padding-left": unframed ? "0" : `${getSize(paddingLeft)}`,
+        "--dd-padding-right": unframed ? "0" : `${getSize(paddingRight)}`,
+        "--dd-padding-tops": unframed ? "0" : `${getSize(paddingTops)}`,
+        "--dd-icon-size": `${iconSize}px`,
+        "--dd-color": placeholder && 0 === index ? "var(--core-text-tertiary)" : "var(--core-text-primary)"
+    }), [ gap, height, width, borderRadius, bgColor, paddingLeft, paddingRight, paddingTops, unframed, placeholder, iconSize, index, getSize ]);
+    return jsxRuntime.jsxs("div", Object.assign({
+        id: divId,
+        className: `${css.wrapper}${divClass}`,
+        style: Object.assign(Object.assign({}, divStyle), cssVars)
+    }, rest, {
+        children: [ jsxRuntime.jsx("div", {
+            className: `${css.face} ${css[size]}`,
+            children: displayText
+        }), jsxRuntime.jsx("div", {
+            className: css.chevron,
+            children: jsxRuntime.jsx(_types.Icon, {
+                name: "chevron down",
+                size: iconSize,
+                strokeColor: color
+            })
+        }), jsxRuntime.jsx("select", {
+            className: css.select,
+            defaultValue: index,
+            ref: ref,
+            onFocus: handleFocus,
+            onMouseDown: handleMouseDown,
+            onChange: handleSelectChange,
+            "aria-label": name,
+            children: renderedOptions
+        }) ]
+    }));
+});
+
+DropDown.displayName = "DropDown", exports.DropDown = DropDown;

package/dist/cjs/chunks/ErrorSummary-CIUqlSLC.js

@@ -0,0 +1,60 @@
+"use strict";
+
+var tslib_es6 = require("./tslib.es6-C8dZW5nY.js"), jsxRuntime = require("react/jsx-runtime"), react = require("motion/react"), React = require("react"), styleInject_es = require("./style-inject.es-CMuL-BfJ.js"), css_errorBox = "ErrorSummary-module_errorBox__-R7XM flexBox-module_columnStart__Kg8cV type-module_body-m-regular__Qtp5G", css_error = "ErrorSummary-module_error__YCQLh flexBox-module_columnStart__Kg8cV", css_p = "ErrorSummary-module_p__lbLpS type-module_body-m-regular__Qtp5G", css_strong = "ErrorSummary-module_strong__XVtAe type-module_body-m-bold__0lZ3I", css_ul = "ErrorSummary-module_ul__d0xoc", css_li = "ErrorSummary-module_li__jym6S type-module_body-m-regular__Qtp5G";
+
+styleInject_es.styleInject(".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.ErrorSummary-module_errorBox__-R7XM {\n\twidth: 100%;\n\tbackground: var(--core-surface-secondary);\n\tcolor: var(--feedback-warning);\n\tborder: 1px solid var(--feedback-warning);\n\tborder-radius: 4px;\n\tpadding: 0 16px 16px 16px !important;\n\toverflow: hidden;\n\tmargin-bottom: 44px !important;\n}\n\n.ErrorSummary-module_error__YCQLh {\n\twidth: 100%;\n}\n\n.ErrorSummary-module_p__lbLpS {\n\tmargin: 0;\n\tpadding: 16px 0 0 0;\n}\n\n.ErrorSummary-module_strong__XVtAe {\n}\n\n.ErrorSummary-module_ul__d0xoc {\n\tlist-style-type: none;\n\tlist-style-position: outside;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.ErrorSummary-module_li__jym6S {\n\tmargin: 3px 0 3px 0;\n\tline-height: 1.2em;\n\tpadding: 0;\n}\n");
+
+const ErrorSummary = React.memo(props => {
+    const {entries: entries, errors: errors = []} = props, divAttributes = tslib_es6.__rest(props, [ "entries", "errors" ]), {id: divId, className: className, style: style} = divAttributes, rest = tslib_es6.__rest(divAttributes, [ "id", "className", "style" ]), divStyle = null != style ? style : {}, divClass = className ? ` ${className}` : "", variants = React.useMemo(() => ({
+        enter: {
+            opacity: 0,
+            maxHeight: 0
+        },
+        animate: {
+            opacity: 1,
+            maxHeight: 500
+        },
+        exit: {
+            opacity: 0,
+            maxHeight: 0
+        }
+    }), []), transition = React.useMemo(() => ({
+        ease: "easeInOut",
+        duration: .25
+    }), []), renderedErrors = React.useMemo(() => entries ? entries.map((error, index) => {
+        var _a;
+        return errors.includes(index) || errors.includes(error.id) ? jsxRuntime.jsxs("div", {
+            className: css_error,
+            children: [ jsxRuntime.jsx("p", {
+                className: css_p,
+                children: jsxRuntime.jsx("strong", {
+                    className: css_strong,
+                    children: error.title
+                })
+            }), jsxRuntime.jsx("ul", {
+                className: css_ul,
+                children: null === (_a = error.bullets) || void 0 === _a ? void 0 : _a.map((bullet, index) => jsxRuntime.jsx("li", {
+                    className: css_li,
+                    children: bullet
+                }, `${error.title}_bullet_${index}`))
+            }) ]
+        }, `${error.id}_${index}`) : null;
+    }) : null, [ entries, errors ]);
+    return jsxRuntime.jsx(react.AnimatePresence, {
+        initial: !1,
+        children: entries && errors && errors.length > 0 && jsxRuntime.jsx(react.motion.div, Object.assign({
+            id: divId,
+            className: `${css_errorBox}${divClass}`,
+            style: divStyle,
+            initial: "enter",
+            animate: "animate",
+            exit: "exit",
+            variants: variants,
+            transition: transition
+        }, rest, {
+            children: renderedErrors
+        }))
+    });
+});
+
+exports.ErrorSummary = ErrorSummary;

package/dist/cjs/chunks/FileIcon-DTQaXxfC.js

@@ -0,0 +1,221 @@
+"use strict";
+
+var tslib_es6 = require("./tslib.es6-C8dZW5nY.js"), jsxRuntime = require("react/jsx-runtime"), React = require("react"), hooks_useTheme = require("../hooks/useTheme.js");
+
+require("../theme/colors.js"), require("../hooks/useWindow.js");
+
+var FileIconNames, utils = require("./utils-BsBHecUI.js");
+
+exports.FileIconNames = void 0, (FileIconNames = exports.FileIconNames || (exports.FileIconNames = {})).pdf = "pdf", 
+FileIconNames.text = "text", FileIconNames.sheet = "sheet", FileIconNames.preso = "preso", 
+FileIconNames.md = "md", FileIconNames.code = "code", FileIconNames.image = "image", 
+FileIconNames.audio = "audio", FileIconNames.video = "video", FileIconNames.other = "other";
+
+const iconColorSchemes = {
+    blue: {
+        dark: "#4084ff",
+        light: "#2d2fff"
+    },
+    red: {
+        dark: "#ff474a",
+        light: "#df0529"
+    },
+    green: {
+        dark: "#2d8c00",
+        light: "#2d8c00"
+    },
+    gray: {
+        dark: "#657d91",
+        light: "#4c6273"
+    },
+    pink: {
+        dark: "#ff3ac2",
+        light: "#df059b"
+    }
+}, STATIC_FILE_ICONS = new Map([ [ "pdf", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.red[theme]
+        }), jsxRuntime.jsx("path", {
+            d: "M8.53,7c-.39,0-.73.38-.64.77.06.59.44,1.07.74,1.56.03.18-.06.36-.07.54-.19,1.06-.49,2.12-.95,3.09-.56.26-1.2.52-1.53,1.08-.21.39.09.91.52.95.4.05.7-.29.92-.58.23-.31.38-.68.57-1.01,1.15-.46,2.37-.79,3.61-.91.5.36,1.03.78,1.68.81.37,0,.68-.37.63-.74-.02-.34-.32-.57-.63-.63-.5-.15-1.03-.07-1.54-.06-.97-.78-1.87-1.67-2.58-2.7.05-.62.16-1.31-.17-1.88-.12-.18-.33-.3-.55-.28ZM8.55,7.57c.11.02.12.18.15.27.03.18.03.36.02.54-.13-.24-.3-.5-.27-.79.03,0,.06-.02.1-.02ZM9.15,10c.58.72,1.23,1.39,1.93,1.99-.93.14-1.85.38-2.73.7.34-.89.6-1.8.77-2.73.01.01.02.03.04.04ZM12.77,12.43c.23.02.49,0,.67.16.02.14-.15.16-.25.11-.19-.06-.38-.14-.54-.27.04,0,.08,0,.12,0ZM7.15,13.9c-.11.2-.26.39-.43.53-.05.09-.2-.07-.13-.14.14-.22.39-.34.61-.47-.02.03-.03.06-.05.08Z",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "text", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.blue[theme]
+        }), jsxRuntime.jsx("rect", {
+            x: "6",
+            y: "8",
+            width: "6",
+            height: "1",
+            fill: "#fff"
+        }), jsxRuntime.jsx("rect", {
+            x: "6",
+            y: "10.5",
+            width: "8",
+            height: "1",
+            fill: "#fff"
+        }), jsxRuntime.jsx("rect", {
+            x: "6",
+            y: "13",
+            width: "3.5",
+            height: "1",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "sheet", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.green[theme]
+        }), jsxRuntime.jsx("path", {
+            d: "M6,8v6h8v-6H6ZM7,9h1.5v1.5h-1.5v-1.5ZM7,11.5h1.5v1.5h-1.5v-1.5ZM13,13h-3.5v-1.5h3.5v1.5ZM9.5,10.5v-1.5h3.5v1.5h-3.5Z",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "preso", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.red[theme]
+        }), jsxRuntime.jsx("path", {
+            d: "M14,7.5H6c-.28,0-.5.22-.5.5v6c0,.28.22.5.5.5h8c.28,0,.5-.22.5-.5v-6c0-.28-.22-.5-.5-.5ZM8.5,12.5c-.83,0-1.5-.67-1.5-1.5s.67-1.5,1.5-1.5c0,0,0,0,0,0v1.5h1.5s0,0,0,0c0,.83-.67,1.5-1.5,1.5ZM13,12.5h-2v-1h2v1ZM13,10.5h-2v-1h2v1Z",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "md", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.gray[theme]
+        }), jsxRuntime.jsx("path", {
+            d: "M14,9.13v-1h-1.63v-1.63h-1v1.63h-2.73v-1.63h-1v1.63h-1.63v1h1.63v2.73h-1.63v1h1.63v1.63h1v-1.63h2.73v1.63h1v-1.63h1.63v-1h-1.63v-2.73h1.63ZM11.37,11.87h-2.73v-2.73h2.73v2.73Z",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "code", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.gray[theme]
+        }), jsxRuntime.jsx("path", {
+            d: "M7.75,8.47l-2.8,1.6c-.16.09-.25.25-.25.43s.1.34.25.43l2.8,1.6.5-.87-2.04-1.17,2.04-1.17-.5-.87Z",
+            fill: "#fff"
+        }), jsxRuntime.jsx("path", {
+            d: "M15.28,10.18l-2.4-1.6-.55.83,1.78,1.18-1.78,1.18.55.83,2.4-1.6c.14-.09.22-.25.22-.42s-.08-.32-.22-.42Z",
+            fill: "#fff"
+        }), jsxRuntime.jsx("rect", {
+            x: "6.53",
+            y: "10",
+            width: "7.43",
+            height: "1",
+            transform: "translate(-1.52 19.26) rotate(-82.36)",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "image", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.blue[theme]
+        }), jsxRuntime.jsx("path", {
+            d: "M13.51,7h-7.03c-.54,0-.99.44-.99.99v4.84h0s0,1.68,0,1.68h8.01c.54,0,.99-.44.99-.99v-5.53c0-.54-.44-.99-.99-.99ZM6.49,8h7.01v5.26s-1-1.01-1-1.01l-1.25,1.25h-.01l-3.25-3.79-1.49,1.86v-3.58Z",
+            fill: "#fff"
+        }), jsxRuntime.jsx("circle", {
+            cx: "11.5",
+            cy: "10",
+            r: "1",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "audio", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.pink[theme]
+        }), jsxRuntime.jsx("path", {
+            d: "M9.14,8.39c-.09.07-.2.11-.31.11h-1.32c-.28,0-.5.23-.5.5v2.49c0,.28.23.5.5.5h1.32c.11,0,.22.04.31.11l1.86,1.89h1v-7.5h-1l-1.86,1.89Z",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "video", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.pink[theme]
+        }), jsxRuntime.jsx("rect", {
+            x: "6",
+            y: "7.75",
+            width: "5.5",
+            height: "5.5",
+            rx: ".75",
+            ry: ".75",
+            fill: "#fff"
+        }), jsxRuntime.jsx("path", {
+            d: "M13.87,8.03c-.08-.04-.18-.04-.26.01l-1.5,1c-.07.05-.11.12-.11.21v2.5c0,.08.04.16.11.21l1.5,1s.09.04.14.04c.04,0,.08,0,.12-.03.08-.04.13-.13.13-.22v-4.5c0-.09-.05-.18-.13-.22Z",
+            fill: "#fff"
+        }) ]
+    })
+} ], [ "other", {
+    paths: theme => jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ jsxRuntime.jsx("path", {
+            d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z",
+            fill: iconColorSchemes.gray[theme]
+        }), jsxRuntime.jsx("rect", {
+            x: "6",
+            y: "8",
+            width: "6",
+            height: "1",
+            fill: "#fff"
+        }), jsxRuntime.jsx("rect", {
+            x: "6",
+            y: "10.5",
+            width: "8",
+            height: "1",
+            fill: "#fff"
+        }), jsxRuntime.jsx("rect", {
+            x: "6",
+            y: "13",
+            width: "3.5",
+            height: "1",
+            fill: "#fff"
+        }) ]
+    })
+} ] ]), FileIcon = React.memo(props => {
+    const {name: name = "pdf", size: size = 24, pointer: pointer = !1, disabled: disabled = !1, onClick: onClick} = props, svgAttributes = tslib_es6.__rest(props, [ "name", "size", "pointer", "disabled", "onClick" ]), {id: svgId, className: className, style: style} = svgAttributes, rest = tslib_es6.__rest(svgAttributes, [ "id", "className", "style" ]), {isDark: isDark} = hooks_useTheme.useTheme(), cursor = React.useMemo(() => disabled ? "default" : pointer ? "pointer" : "inherit", [ disabled, pointer ]), iconStyle = React.useMemo(() => ({
+        cursor: cursor,
+        userSelect: "none",
+        WebkitUserSelect: "none",
+        WebkitTapHighlightColor: "transparent",
+        outline: "none",
+        border: 0
+    }), [ cursor ]), handleClick = React.useCallback(e => {
+        disabled || null == onClick || onClick(e);
+    }, [ onClick, disabled ]), definition = STATIC_FILE_ICONS.get(name), paths = null == definition ? void 0 : definition.paths(isDark ? "dark" : "light");
+    return paths ? jsxRuntime.jsxs("svg", Object.assign({
+        id: svgId,
+        className: className,
+        xmlns: "http://www.w3.org/2000/svg",
+        width: size,
+        height: size,
+        viewBox: "0 0 20 20",
+        style: Object.assign(Object.assign({}, style), iconStyle),
+        onClick: handleClick,
+        role: pointer ? "button" : "img",
+        "aria-label": `${name} icon`,
+        "aria-disabled": pointer ? disabled : void 0,
+        tabIndex: pointer && !disabled ? 0 : -1,
+        onKeyDown: e => {
+            pointer && !disabled && utils.accessibleKeyDown(e, () => handleClick(e));
+        },
+        opacity: disabled ? .5 : 1
+    }, rest, {
+        children: [ jsxRuntime.jsx("title", {}), paths ]
+    })) : null;
+});
+
+FileIcon.displayName = "FileIcon", exports.FileIcon = FileIcon;