@adamjanicki/ui 1.8.3 → 1.8.4

package/components/Select/Select.js

@@ -1,34 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
-import classNames from "../../functions/classNames";
-import Box from "../Box/Box";
-import Icon from "../Icon";
-import ui from "../ui";
-var Select = React.forwardRef(function (_a, ref) {
-    var className = _a.className, options = _a.options, vfx = _a.vfx, getOptionLabel = _a.getOptionLabel, selectProps = _a.selectProps, value = _a.value, onChange = _a.onChange, rest = __rest(_a, ["className", "options", "vfx", "getOptionLabel", "selectProps", "value", "onChange"]);
-    var selectClassName = (selectProps || {}).className;
-    return (_jsxs(Box, __assign({ vfx: __assign({ pos: "relative", width: "fit", axis: "x", align: "center", radius: "rounded", backgroundColor: "default", color: "default", padding: "none" }, vfx), className: classNames("aui-select-container", (selectProps === null || selectProps === void 0 ? void 0 : selectProps.disabled) ? "aui-select-disabled" : undefined, className) }, rest, { children: [_jsx(ui.select, __assign({}, selectProps, { value: value, onChange: onChange, className: classNames("aui-select", selectClassName), ref: ref, children: options.map(function (option, index) { return (_jsx("option", { value: option, children: (getOptionLabel === null || getOptionLabel === void 0 ? void 0 : getOptionLabel(option)) || option }, index)); }) })), _jsx(Icon, { icon: "chevron-down", className: "aui-select-icon", "aria-hidden": true })] })));
-});
-export default Select;

package/components/Select/index.d.ts

@@ -1,2 +0,0 @@
-import Select from "./Select";
-export default Select;

package/components/Select/index.js

@@ -1,2 +0,0 @@
-import Select from "./Select";
-export default Select;

package/components/Spinner/Spinner.js

@@ -1,31 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import classNames from "../../functions/classNames";
-var Spinner = function (_a) {
-    var className = _a.className, props = __rest(_a, ["className"]);
-    return (
-    // Designed on 2023-08-18
-    _jsx("svg", __assign({ xmlns: "http://www.w3.org/2000/svg" }, props, { viewBox: "0 0 512 512", className: classNames("aui-spinner", className), children: _jsx("path", { fill: "currentColor", d: "M256,0C114.62,0,0,114.62,0,256S114.62,512,256,512c70.64,0,134.59-28.61,180.91-74.88l-31.11-31.11c-38.35,38.3-91.31,61.99-149.8,61.99-117.08,0-212-94.92-212-212S138.92,44,256,44V0Z" }) })));
-};
-export default Spinner;

package/components/Spinner/index.d.ts

@@ -1,2 +0,0 @@
-import Spinner from "./Spinner";
-export default Spinner;

package/components/Spinner/index.js

@@ -1,2 +0,0 @@
-import Spinner from "./Spinner";
-export default Spinner;

package/components/ui.js

@@ -1,44 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React from "react";
-import { classNames } from "../functions";
-import transformVfx from "../utils/transformVfx";
-function createVfxElement(tag) {
-    var Component = React.forwardRef(function (_a, ref) {
-        var vfx = _a.vfx, className = _a.className, props = __rest(_a, ["vfx", "className"]);
-        return React.createElement(tag, __assign(__assign({}, props), { ref: ref, className: classNames(className, transformVfx(vfx)) }));
-    });
-    return Component;
-}
-var ui = new Proxy({}, {
-    get: function (cache, tag) {
-        var cachedComponent = cache[tag];
-        if (cachedComponent) {
-            return cachedComponent;
-        }
-        var component = createVfxElement(tag);
-        cache[tag] = component;
-        return component;
-    },
-});
-export default ui;

package/functions/assertDefined.js

@@ -1,13 +0,0 @@
-/**
- * Assert a value is defined
- *
- * @param value the value to assert presence of
- * @param message optional error message
- * @returns the present value
- */
-export default function assertDefined(value, message) {
-    if (value === undefined) {
-        throw new Error(message || "Unexpected undefined value");
-    }
-    return value;
-}

package/functions/classNames.js

@@ -1,16 +0,0 @@
-/**
- * Reduce a list of classnames into one string
- *
- * @param classNames list of class names to concatenate
- * @returns single aggregated string of classnames
- */
-export default function classNames() {
-    var classNames = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        classNames[_i] = arguments[_i];
-    }
-    return (classNames
-        .map(function (className) { return className === null || className === void 0 ? void 0 : className.trim(); })
-        .filter(Boolean)
-        .join(" ") || undefined);
-}

package/functions/getDeviceType.js

@@ -1,17 +0,0 @@
-/**
- * Best effort checks to determine the device being used
- *
- * @returns the type of device
- */
-export default function getDeviceType() {
-    if (!navigator)
-        return "desktop";
-    var _a = navigator.userAgent, userAgent = _a === void 0 ? "" : _a, _b = navigator.maxTouchPoints, maxTouchPoints = _b === void 0 ? 0 : _b, platform = navigator.platform;
-    var isTouchScreen = maxTouchPoints > 0;
-    var isMobileUserAgent = /mobi|android|iphone|ipod|ipad/i.test(userAgent);
-    var isNewIpad = platform === "MacIntel" && maxTouchPoints > 1;
-    if ((isMobileUserAgent && isTouchScreen) || isNewIpad) {
-        return "mobile";
-    }
-    return "desktop";
-}

package/functions/index.d.ts

@@ -1,5 +0,0 @@
-import classNames from "./classNames";
-import scrollToId from "./scrollToId";
-import assertDefined from "./assertDefined";
-import getDeviceType from "./getDeviceType";
-export { classNames, scrollToId, assertDefined, getDeviceType };

package/functions/index.js

@@ -1,5 +0,0 @@
-import classNames from "./classNames";
-import scrollToId from "./scrollToId";
-import assertDefined from "./assertDefined";
-import getDeviceType from "./getDeviceType";
-export { classNames, scrollToId, assertDefined, getDeviceType };

package/functions/scrollToId.js

@@ -1,17 +0,0 @@
-/**
- * Scroll to the element with the given id
- * @param id the id of the element to scroll to
- * @param behavior behavior of the scroll
- */
-export default function scrollToId(id, behavior) {
-    try {
-        // catch cases where hash is not a valid id
-        var element = document.getElementById(id);
-        if (element) {
-            element.scrollIntoView({ behavior: behavior });
-        }
-    }
-    catch (_a) {
-        return;
-    }
-}

package/hooks/index.js

@@ -1,7 +0,0 @@
-export { default as useScrollLock } from "./useScrollLock";
-export { default as useMediaQuery } from "./useMediaQuery";
-export { default as useScroll } from "./useScroll";
-export { default as useFocusTrap } from "./useFocusTrap";
-export { default as useScrollToHash } from "./useScrollToHash";
-export { default as useWindowResize } from "./useWindowResize";
-export { default as useMergeRefs } from "./useMergeRefs";

package/hooks/useFocusTrap.js

@@ -1,48 +0,0 @@
-import { useEffect, useRef } from "react";
-var selector = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex="0"], [contenteditable]';
-/**
- * A hook for trapping focus within an element.
- *
- * @param isActive true if the element is active, false otherwise
- * `true` by default
- * @returns ref object that must be passed to the element that should be trapped
- */
-var useFocusTrap = function (isActive) {
-    if (isActive === void 0) { isActive = true; }
-    var trapRef = useRef(null);
-    useEffect(function () {
-        var trap = trapRef.current;
-        if (!isActive || !trap)
-            return;
-        var handleKeyDown = function (event) {
-            if (event.key !== "Tab")
-                return;
-            var focusableElements = trap.querySelectorAll(selector);
-            if (!focusableElements.length) {
-                event.preventDefault();
-                return;
-            }
-            var first = focusableElements[0];
-            var last = focusableElements[focusableElements.length - 1];
-            var active = document.activeElement;
-            if (event.shiftKey) {
-                if (active === first || !trap.contains(active)) {
-                    last.focus();
-                    event.preventDefault();
-                }
-            }
-            else {
-                if (active === last || !trap.contains(active)) {
-                    first.focus();
-                    event.preventDefault();
-                }
-            }
-        };
-        trap.addEventListener("keydown", handleKeyDown, true);
-        return function () {
-            trap.removeEventListener("keydown", handleKeyDown, true);
-        };
-    }, [isActive]);
-    return trapRef;
-};
-export default useFocusTrap;

package/hooks/useMediaQuery.js

@@ -1,28 +0,0 @@
-import { useEffect, useState } from "react";
-/**
- * A hook for watching media queries.
- *
- * @param config the configuration for the hook
- * @returns true if the media query matches, false otherwise
- */
-var useMediaQuery = function (config) {
-    var onMatch = config.onMatch, onUnmatch = config.onUnmatch, query = config.query;
-    var _a = useState(false), matches = _a[0], setMatches = _a[1];
-    useEffect(function () {
-        var mediaQuery = window.matchMedia(query);
-        var listener = function (event) {
-            if (event.matches) {
-                onMatch === null || onMatch === void 0 ? void 0 : onMatch();
-            }
-            else {
-                onUnmatch === null || onUnmatch === void 0 ? void 0 : onUnmatch();
-            }
-            setMatches(event.matches);
-        };
-        mediaQuery.addEventListener("change", listener);
-        setMatches(mediaQuery.matches);
-        return function () { return mediaQuery.removeEventListener("change", listener); };
-    }, [onMatch, onUnmatch, query]);
-    return matches;
-};
-export default useMediaQuery;

package/hooks/useMergeRefs.js

@@ -1,24 +0,0 @@
-import { useCallback } from "react";
-/**
- * Simple hook that merges N refs into one callback
- *
- * @param refs all the refs you want to merge
- * @returns one combined ref
- */
-var useMergeRefs = function () {
-    var refs = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        refs[_i] = arguments[_i];
-    }
-    return useCallback(function (node) {
-        refs.forEach(function (ref) {
-            if (typeof ref === "function") {
-                ref(node);
-            }
-            else if (ref && typeof ref === "object") {
-                ref.current = node;
-            }
-        });
-    }, [refs]);
-};
-export default useMergeRefs;

package/hooks/useScroll.js

@@ -1,23 +0,0 @@
-import { useEffect, useState } from "react";
-/**
- * A hook getting the current scroll position of the window.
- * @returns an object containing the current scroll position of the window.
- */
-var useScroll = function () {
-    var _a = useState({
-        scrollX: window.scrollX,
-        scrollY: window.scrollY,
-    }), scroll = _a[0], setScroll = _a[1];
-    useEffect(function () {
-        var onScroll = function () {
-            setScroll({
-                scrollX: window.scrollX,
-                scrollY: window.scrollY,
-            });
-        };
-        window.addEventListener("scroll", onScroll);
-        return function () { return window.removeEventListener("scroll", onScroll); };
-    }, []);
-    return scroll;
-};
-export default useScroll;

package/hooks/useScrollLock.js

@@ -1,45 +0,0 @@
-import { useEffect } from "react";
-var globalLockCount = 0;
-var lockScroll = function () {
-    globalLockCount += 1;
-    if (globalLockCount > 1) {
-        return function () {
-            globalLockCount -= 1;
-        };
-    }
-    var scrollPosition = window.scrollY;
-    var style = document.body.style;
-    var overflow = style.overflow, position = style.position, top = style.top, width = style.width;
-    style.overflow = "hidden";
-    style.position = "fixed";
-    style.top = "-".concat(scrollPosition, "px");
-    style.width = "100%";
-    return function () {
-        globalLockCount -= 1;
-        if (globalLockCount > 0) {
-            return;
-        }
-        style.overflow = overflow;
-        style.position = position;
-        style.top = top;
-        style.width = width;
-        window.scrollTo({
-            top: scrollPosition,
-            left: 0,
-            behavior: "instant",
-        });
-    };
-};
-/**
- * Hook to lock and unlock the scroll position on enable change or mount/unmount.
- * @param enable whether to lock the scroll position. Defaults to `true`. Useful for using in something that stays mounted.
- */
-var useScrollLock = function (enable) {
-    if (enable === void 0) { enable = true; }
-    useEffect(function () {
-        if (enable) {
-            return lockScroll();
-        }
-    }, [enable]);
-};
-export default useScrollLock;

package/hooks/useScrollToHash.js

@@ -1,21 +0,0 @@
-import { useEffect } from "react";
-import scrollToId from "../functions/scrollToId";
-/**
- * A hook for scrolling to a hash on the page.
- */
-var useScrollToHash = function (config) {
-    if (config === void 0) { config = {}; }
-    var _a = config.active, active = _a === void 0 ? true : _a, behavior = config.behavior, delay = config.delay;
-    useEffect(function () {
-        var hash = window.location.hash;
-        if (!active || (hash === null || hash === void 0 ? void 0 : hash.length) <= 1)
-            return;
-        var id = hash.substring(1);
-        if (delay !== undefined) {
-            var timeout_1 = setTimeout(function () { return scrollToId(id, behavior); }, delay);
-            return function () { return clearTimeout(timeout_1); };
-        }
-        scrollToId(id, behavior);
-    }, [active, behavior, delay]);
-};
-export default useScrollToHash;

package/hooks/useWindowResize.js

@@ -1,13 +0,0 @@
-import { useEffect } from "react";
-/**
- * A hook that listens for window resize events.
- *
- * @param callback the callback function fired when the window is resized.
- */
-var useWindowResize = function (callback) {
-    useEffect(function () {
-        window.addEventListener("resize", callback);
-        return function () { return window.removeEventListener("resize", callback); };
-    }, [callback]);
-};
-export default useWindowResize;

package/index.js

@@ -1,31 +0,0 @@
-// Components
-export { default as Accordion } from "./components/Accordion";
-export { default as Alert } from "./components/Alert";
-export { default as Animated } from "./components/Animated";
-export { default as Avatar } from "./components/Avatar";
-export { default as Badge } from "./components/Badge";
-export { default as Banner } from "./components/Banner";
-export { default as Box } from "./components/Box";
-export { default as Button } from "./components/Button";
-export * from "./components/Button";
-export { default as Carousel } from "./components/Carousel";
-export { default as ClickOutside } from "./components/ClickOutside";
-export { default as ErrorBoundary } from "./components/ErrorBoundary";
-export { default as Hamburger } from "./components/Hamburger";
-export * from "./components/Hamburger";
-export { default as Icon } from "./components/Icon";
-export { default as Input } from "./components/Input";
-export * from "./components/Input";
-export { default as Layer } from "./components/Layer";
-export { default as Link } from "./components/Link";
-export * from "./components/Link";
-export { default as Modal } from "./components/Modal";
-export { default as Select } from "./components/Select";
-export { default as Spinner } from "./components/Spinner";
-export { default as ui } from "./components/ui";
-// Hooks
-export * from "./hooks";
-// Functions
-export * from "./functions";
-// Router
-export * from "./router";

package/router/PathParamsContext.js

@@ -1,3 +0,0 @@
-import React from "react";
-var PathParamsContext = React.createContext(null);
-export default PathParamsContext;

package/router/Route.js

@@ -1,6 +0,0 @@
-/**
- * A simple wrapper to be used by <Routes>
- */
-export default function Route(_a) {
-    return null;
-}

package/router/Router.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from "react";
-import RouterContext from "./RouterContext";
-import { createHistory, getCurrentLocation } from "./history";
-import { getHref, normalizeBasename } from "./href";
-export default function Router(_a) {
-    var children = _a.children, _b = _a.basename, basename = _b === void 0 ? "" : _b;
-    basename = normalizeBasename(basename);
-    var historyRef = React.useRef(null);
-    if (!historyRef.current)
-        historyRef.current = createHistory();
-    var history = historyRef.current;
-    var _c = React.useState(getCurrentLocation), location = _c[0], setLocation = _c[1];
-    // to avoid infinite rerenders
-    var locationRef = React.useRef(location);
-    React.useLayoutEffect(function () {
-        var removeListener = history.addListener(function (nextLocation) {
-            locationRef.current = nextLocation;
-            setLocation(nextLocation);
-        });
-        return function () {
-            removeListener();
-            history.cleanup();
-        };
-    }, [history]);
-    var navigate = React.useCallback(function (to) {
-        var currentPathname = locationRef.current.pathname;
-        history.push(getHref(to, currentPathname, basename).url);
-    }, [history, basename]);
-    var contextValue = React.useMemo(function () { return ({
-        location: location,
-        navigate: navigate,
-        basename: basename,
-    }); }, [location, navigate, basename]);
-    return (_jsx(RouterContext.Provider, { value: contextValue, children: children }));
-}

package/router/RouterContext.js

@@ -1,3 +0,0 @@
-import React from "react";
-var RouterContext = React.createContext(null);
-export default RouterContext;

package/router/Routes.js

@@ -1,31 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from "react";
-import { matchPath } from "./path";
-import PathParamsContext from "./PathParamsContext";
-import Route from "./Route";
-import useRouterContext from "./hooks/useRouterContext";
-import { stripBasename } from "./href";
-function findRouteElements(children) {
-    return children.filter(function (child) { return React.isValidElement(child) && child.type === Route; });
-}
-/**
- * Nested within a router component, this component handles rendering the proper route.
- * Note: sticking any other components besides routes in here will not be rendered
- */
-export default function Routes(_a) {
-    var rawChildren = _a.children, fallback = _a.fallback;
-    var router = useRouterContext("<Routes>");
-    var location = router.location, basename = router.basename;
-    var pathname = stripBasename(location.pathname, basename);
-    var children = Array.isArray(rawChildren) ? rawChildren : [rawChildren];
-    var routes = findRouteElements(children);
-    for (var _i = 0, routes_1 = routes; _i < routes_1.length; _i++) {
-        var routeElement = routes_1[_i];
-        var _b = routeElement.props, path = _b.path, element = _b.element;
-        var pathParams = matchPath(path, pathname);
-        if (pathParams) {
-            return (_jsx(PathParamsContext.Provider, { value: pathParams, children: element }));
-        }
-    }
-    return fallback;
-}

package/router/history.js

@@ -1,46 +0,0 @@
-export function getCurrentLocation() {
-    return {
-        pathname: window.location.pathname,
-        search: window.location.search,
-        hash: window.location.hash,
-    };
-}
-export function createHistory() {
-    var listeners = new Set();
-    var notifyListeners = function () {
-        var location = getCurrentLocation();
-        listeners.forEach(function (listener) { return listener(location); });
-    };
-    var listening = false;
-    var startListening = function () {
-        if (listening)
-            return;
-        window.addEventListener("popstate", notifyListeners);
-        listening = true;
-    };
-    var stopListening = function () {
-        if (!listening)
-            return;
-        window.removeEventListener("popstate", notifyListeners);
-        listening = false;
-    };
-    return {
-        push: function (to) {
-            window.history.pushState(null, "", to);
-            notifyListeners();
-        },
-        addListener: function (listener) {
-            startListening();
-            listeners.add(listener);
-            return function () {
-                listeners.delete(listener);
-                if (listeners.size === 0)
-                    stopListening();
-            };
-        },
-        cleanup: function () {
-            stopListening();
-            listeners.clear();
-        },
-    };
-}

package/router/hooks/useLocation.js

@@ -1,10 +0,0 @@
-import useRouterContext from "./useRouterContext";
-/**
- * Get the current location (can only be used within a Router)
- *
- * @returns the current location
- */
-export default function useLocation() {
-    var location = useRouterContext("useLocation()").location;
-    return location;
-}

package/router/hooks/useNavigate.js

@@ -1,10 +0,0 @@
-import useRouterContext from "./useRouterContext";
-/**
- * Get a navigate function (can only be used within a Router)
- *
- * @returns a navigate function
- */
-export default function useNavigate() {
-    var navigate = useRouterContext("useNavigate()").navigate;
-    return navigate;
-}

package/router/hooks/usePathParams.js

@@ -1,15 +0,0 @@
-import React from "react";
-import PathParamsContext from "../PathParamsContext";
-/**
- * Get the params from the current pathname
- *
- * @returns the params from the current path
- * e.g. `{id: "1"}` for `/movie/:id <=> /movie/1`
- */
-export default function usePathParams() {
-    var params = React.useContext(PathParamsContext);
-    if (!params) {
-        throw new Error("usePathParams() must be used inside of a <Router> component");
-    }
-    return params;
-}

package/router/hooks/useRouterContext.js

@@ -1,9 +0,0 @@
-import React from "react";
-import RouterContext from "../RouterContext";
-export default function useRouterContext(name) {
-    var routerContext = React.useContext(RouterContext);
-    if (!routerContext) {
-        throw new Error("".concat(name, " must be used inside of a <Router> component"));
-    }
-    return routerContext;
-}