@mrmeg/expo-ui 0.27.1 → 0.29.0

package/dist/hooks/useScalePress.d.ts

@@ -6,10 +6,12 @@ interface ScalePressOptions {
      */
     scaleTo?: number;
     /**
-     * Whether to fire haptic feedback on press
-     * @default true
+     * Haptic on press-in. `"setting"` follows the provider-level `haptics`
+     * setting (a light tap only under `"all"`); `true` always taps; `false`
+     * never does.
+     * @default "setting"
      */
-    haptic?: boolean;
+    haptic?: boolean | "setting";
     /**
      * Spring damping for bounce-back
      * @default 20
@@ -29,8 +31,9 @@ interface ScalePressOptions {
 /**
  * Hook for press-feedback scale animation using React Native Animated.
  *
- * Returns an animated style and onPressIn/onPressOut handlers to spread onto a Pressable.
- * Respects reduced motion preferences.
+ * Returns an animated style and onPressIn/onPressOut handlers to spread onto a
+ * Pressable. Under reduced motion the scale stays at 1 — the pressed opacity
+ * the components layer on carries the feedback instead.
  *
  * @example
  * ```tsx

package/dist/hooks/useScalePress.js

@@ -1,12 +1,15 @@
-import { useCallback, useMemo, useRef } from "react";
+import { useCallback, useMemo } from "react";
 import { Animated } from "react-native";
-import { hapticLight } from "../lib/haptics.js";
+import { hapticLight, hapticPress } from "../lib/haptics.js";
+import { useAnimatedValue } from "../lib/useAnimatedValue.js";
+import { shouldUseNativeDriver } from "../lib/animations.js";
 import { useReducedMotion } from "./useReduceMotion.js";
 /**
  * Hook for press-feedback scale animation using React Native Animated.
  *
- * Returns an animated style and onPressIn/onPressOut handlers to spread onto a Pressable.
- * Respects reduced motion preferences.
+ * Returns an animated style and onPressIn/onPressOut handlers to spread onto a
+ * Pressable. Under reduced motion the scale stays at 1 — the pressed opacity
+ * the components layer on carries the feedback instead.
  *
  * @example
  * ```tsx
@@ -20,27 +23,31 @@ import { useReducedMotion } from "./useReduceMotion.js";
  * ```
  */
 export function useScalePress(options = {}) {
-    const { scaleTo = 0.97, haptic = true, damping = 20, stiffness = 300, disabled = false, } = options;
+    const { scaleTo = 0.97, haptic = "setting", damping = 20, stiffness = 300, disabled = false, } = options;
     const reduceMotion = useReducedMotion();
-    const scale = useRef(new Animated.Value(1)).current;
+    const scale = useAnimatedValue(1);
     const animateTo = useCallback((toValue) => {
         scale.stopAnimation();
+        // Reduced motion: no scale change at all (not even an instant jump), so
+        // the surface stays still while its pressed opacity does the signalling.
         if (reduceMotion) {
-            scale.setValue(toValue);
+            scale.setValue(1);
             return;
         }
         Animated.spring(scale, {
             toValue,
             damping,
             stiffness,
-            useNativeDriver: true,
+            useNativeDriver: shouldUseNativeDriver,
         }).start();
     }, [damping, reduceMotion, scale, stiffness]);
     const onPressIn = useCallback(() => {
         if (disabled)
             return;
-        if (haptic)
+        if (haptic === true)
             hapticLight();
+        else if (haptic === "setting")
+            hapticPress();
         animateTo(scaleTo);
     }, [animateTo, disabled, haptic, scaleTo]);
     const onPressOut = useCallback(() => {

package/dist/hooks/useShape.d.ts

@@ -0,0 +1,24 @@
+import { type ShapeOverrides, type ShapeSlot } from "../state/themeStore.js";
+/**
+ * The host app's `setShape` override for one slot, or `undefined` when the
+ * slot is untouched. One store subscription per component, re-rendering only
+ * when that slot changes.
+ *
+ * Layer it right after the component's static radius and before the caller's
+ * `style`, so the precedence stays caller → app → package:
+ *
+ * ```tsx
+ * const cardShape = useShape("card");
+ * <View style={[styles.card, shapeRadius(cardShape), style]} />
+ * ```
+ */
+export declare function useShape<S extends ShapeSlot>(slot: S): ShapeOverrides[S] | undefined;
+/**
+ * `{ borderRadius }` when the override sets one (zero included — square
+ * corners are a choice), otherwise `undefined` so a style array skips it.
+ */
+export declare function shapeRadius(override: {
+    borderRadius?: number;
+} | undefined): {
+    borderRadius: number;
+} | undefined;

package/dist/hooks/useShape.js

@@ -0,0 +1,24 @@
+import { useThemeStore } from "../state/themeStore.js";
+/**
+ * The host app's `setShape` override for one slot, or `undefined` when the
+ * slot is untouched. One store subscription per component, re-rendering only
+ * when that slot changes.
+ *
+ * Layer it right after the component's static radius and before the caller's
+ * `style`, so the precedence stays caller → app → package:
+ *
+ * ```tsx
+ * const cardShape = useShape("card");
+ * <View style={[styles.card, shapeRadius(cardShape), style]} />
+ * ```
+ */
+export function useShape(slot) {
+    return useThemeStore((s) => s.shapeOverrides[slot]);
+}
+/**
+ * `{ borderRadius }` when the override sets one (zero included — square
+ * corners are a choice), otherwise `undefined` so a style array skips it.
+ */
+export function shapeRadius(override) {
+    return override?.borderRadius === undefined ? undefined : { borderRadius: override.borderRadius };
+}

package/dist/hooks/useStaggeredEntrance.js

@@ -1,7 +1,9 @@
-import { useEffect, useMemo, useRef } from "react";
+import { useEffect, useMemo } from "react";
 import { Animated, Easing } from "react-native";
 import { useReducedMotion } from "./useReduceMotion.js";
 import { durations } from "../constants/motion.js";
+import { useAnimatedValue } from "../lib/useAnimatedValue.js";
+import { shouldUseNativeDriver } from "../lib/animations.js";
 /**
  * Hook for entrance animations with stagger support using React Native Animated.
  *
@@ -24,15 +26,15 @@ import { durations } from "../constants/motion.js";
 export function useStaggeredEntrance(options = {}) {
     const { type = "fadeSlideUp", delay = 0, duration = durations.normal, slideDistance = 8, initialScale = 0.95, } = options;
     const reduceMotion = useReducedMotion();
-    const opacity = useRef(new Animated.Value(reduceMotion ? 1 : 0)).current;
-    const translateY = useRef(new Animated.Value(reduceMotion
+    const opacity = useAnimatedValue(reduceMotion ? 1 : 0);
+    const translateY = useAnimatedValue(reduceMotion
         ? 0
         : type === "fadeSlideUp"
             ? slideDistance
             : type === "fadeSlideDown"
                 ? -slideDistance
-                : 0)).current;
-    const scale = useRef(new Animated.Value(reduceMotion ? 1 : type === "scale" ? initialScale : 1)).current;
+                : 0);
+    const scale = useAnimatedValue(reduceMotion ? 1 : type === "scale" ? initialScale : 1);
     useEffect(() => {
         if (reduceMotion) {
             opacity.setValue(1);
@@ -50,7 +52,7 @@ export function useStaggeredEntrance(options = {}) {
         const timingConfig = {
             duration,
             easing: Easing.out(Easing.cubic),
-            useNativeDriver: true,
+            useNativeDriver: shouldUseNativeDriver,
         };
         const animations = [
             Animated.timing(opacity, {
@@ -69,7 +71,7 @@ export function useStaggeredEntrance(options = {}) {
                 toValue: 1,
                 damping: 14,
                 stiffness: 250,
-                useNativeDriver: true,
+                useNativeDriver: shouldUseNativeDriver,
             }));
         }
         const animation = delay > 0

package/dist/hooks/useTheme.d.ts

@@ -1,6 +1,6 @@
-import { Colors } from "../constants/colors";
+import { Colors } from "../constants/colors.js";
 import { ImageStyle, TextStyle, ViewStyle } from "react-native";
-import { spacing as spacingConstants } from "../constants/spacing";
+import { spacing as spacingConstants } from "../constants/spacing.js";
 type ShadowType = "base" | "soft" | "sharp" | "subtle" | "elevated" | "glow" | "glass" | "card" | "cardHover" | "cardSubtle";
 interface ExtendedColorScheme {
     theme: Colors["light" | "dark"];
@@ -32,7 +32,7 @@ interface ExtendedColorScheme {
  * - getTextColorForBackground("#000") → "light"
  * - getContrastingColor("#f4f4f4", "#222", "#fff") → "#222"
  * - withAlpha("#336699", 0.6) → "rgba(51,102,153,0.6)"
- * - getShadowStyle('base') → { boxShadow: "0px 2px 6px rgba(0, 0, 0, 0.05), 0px 4px 12px rgba(0, 0, 0, 0.03)" }
+ * - getShadowStyle('base') → { boxShadow: "0px 2px 6px rgba(0, 0, 0, 0.1), 0px 4px 12px rgba(0, 0, 0, 0.06)" } (light)
  */
 export declare function useTheme(): ExtendedColorScheme & {
     toggleTheme: () => void;

package/dist/hooks/useTheme.js

@@ -1,8 +1,10 @@
 import { useCallback, useEffect, useMemo } from "react";
-import { colors, resolveRawColor } from "../constants/colors.js";
+import { useShallow } from "zustand/react/shallow";
+import { colors, palette, resolveRawColor } from "../constants/colors.js";
 import { Platform, StyleSheet } from "react-native";
 import { resolveThemePreference, useThemeStore } from "../state/themeStore.js";
 import { useThemeColorScope } from "../state/themeColorScope.js";
+import { useInitialScheme } from "../state/initialScheme.js";
 import { spacing as spacingConstants } from "../constants/spacing.js";
 // Module-level cache for contrast calculations to avoid memory leak
 // and share across components
@@ -22,6 +24,144 @@ function getCachedOrCompute(key, compute) {
     contrastCache.set(key, result);
     return result;
 }
+/**
+ * Web: keeps `<html data-theme>` and `color-scheme` — what the CSS variables
+ * from `getThemeCssVariables()` key on — on the store's resolved scheme.
+ *
+ * One store subscription for the whole app, started by the first `useTheme`
+ * consumer to mount (the same moment the old per-consumer effect first
+ * wrote), writing only when the resolved scheme changes. It used to be an
+ * effect in every consumer, which re-ran in each of them on every scheme
+ * switch.
+ */
+let documentThemeSyncStarted = false;
+let documentScheme = null;
+function writeDocumentScheme(state) {
+    const scheme = resolveThemePreference(state.userTheme, state.systemTheme);
+    if (scheme === documentScheme)
+        return;
+    documentScheme = scheme;
+    document.documentElement.dataset.theme = scheme;
+    document.documentElement.style.colorScheme = scheme;
+}
+function startDocumentThemeSync() {
+    if (documentThemeSyncStarted || Platform.OS !== "web" || typeof document === "undefined") {
+        return;
+    }
+    documentThemeSyncStarted = true;
+    writeDocumentScheme(useThemeStore.getState());
+    useThemeStore.subscribe(writeDocumentScheme);
+}
+/**
+ * Shadow presets, per scheme.
+ *
+ * Light: the shadow does the work, at about twice the alpha the original
+ * presets used (0.04 became 0.08). Dark: the original presets tripled a 0.04
+ * alpha, which is invisible on the near-black base; these are black at real
+ * alpha, with the edge highlight in front. `subtle`, `soft` and `elevated`
+ * were tuned in the Surface Lab (`client/showcase/SurfaceLabScreen.tsx`); the
+ * other raised presets sit between them. `sharp` keeps its original light
+ * alpha and its original tripled dark alpha; `glow` is one vivid layer in both.
+ */
+const SHADOW_CONFIGS = {
+    subtle: {
+        light: [
+            { x: 0, y: 1, blur: 3, opacity: 0.08 },
+            { x: 0, y: 2, blur: 8, opacity: 0.06 },
+        ],
+        dark: [
+            { x: 0, y: 1, blur: 2, opacity: 0.4 },
+            { x: 0, y: 8, blur: 24, opacity: 0.35 },
+        ],
+        highlight: 0.05,
+    },
+    base: {
+        light: [
+            { x: 0, y: 2, blur: 6, opacity: 0.1 },
+            { x: 0, y: 4, blur: 12, opacity: 0.06 },
+        ],
+        dark: [
+            { x: 0, y: 2, blur: 3, opacity: 0.4 },
+            { x: 0, y: 10, blur: 28, opacity: 0.38 },
+        ],
+    },
+    soft: {
+        light: [
+            { x: 0, y: 4, blur: 10, opacity: 0.1 },
+            { x: 0, y: 8, blur: 20, opacity: 0.06 },
+        ],
+        dark: [
+            { x: 0, y: 2, blur: 4, opacity: 0.45 },
+            { x: 0, y: 14, blur: 36, opacity: 0.45 },
+        ],
+        highlight: 0.06,
+    },
+    card: {
+        light: [
+            { x: 0, y: 4, blur: 12, opacity: 0.1 },
+            { x: 0, y: 8, blur: 24, opacity: 0.06 },
+        ],
+        dark: [
+            { x: 0, y: 2, blur: 4, opacity: 0.42 },
+            { x: 0, y: 10, blur: 30, opacity: 0.4 },
+        ],
+        highlight: 0.05,
+    },
+    cardSubtle: {
+        light: [
+            { x: 0, y: 1, blur: 3, opacity: 0.1 },
+            { x: 0, y: 3, blur: 9, opacity: 0.06 },
+        ],
+        dark: [
+            { x: 0, y: 1, blur: 2, opacity: 0.4 },
+            { x: 0, y: 4, blur: 12, opacity: 0.3 },
+        ],
+        highlight: 0.05,
+    },
+    cardHover: {
+        light: [
+            { x: 0, y: 8, blur: 24, opacity: 0.12 },
+            { x: 0, y: 16, blur: 48, opacity: 0.08 },
+        ],
+        dark: [
+            { x: 0, y: 3, blur: 6, opacity: 0.48 },
+            { x: 0, y: 18, blur: 48, opacity: 0.5 },
+        ],
+        highlight: 0.06,
+    },
+    elevated: {
+        light: [
+            { x: 0, y: 16, blur: 48, opacity: 0.16 },
+            { x: 0, y: 32, blur: 96, opacity: 0.1 },
+        ],
+        dark: [
+            { x: 0, y: 4, blur: 8, opacity: 0.5 },
+            { x: 0, y: 24, blur: 56, opacity: 0.55 },
+        ],
+        highlight: 0.06,
+    },
+    glass: {
+        light: [
+            { x: 0, y: 4, blur: 30, opacity: 0.1 },
+            { x: 0, y: 8, blur: 60, opacity: 0.06 },
+        ],
+        dark: [
+            { x: 0, y: 4, blur: 30, opacity: 0.4 },
+            { x: 0, y: 8, blur: 60, opacity: 0.3 },
+        ],
+        highlight: 0.05,
+    },
+    // Single layer — intentional crispness, not a soft dual-layer shadow.
+    sharp: {
+        light: [{ x: 0, y: 1, blur: 1, opacity: 0.15 }],
+        dark: [{ x: 0, y: 1, blur: 1, opacity: 0.45 }],
+    },
+    // Single layer — already a deliberate, vivid accent glow.
+    glow: {
+        light: [{ x: 0, y: 4, blur: 20, opacity: 0.4 }],
+        dark: [{ x: 0, y: 4, blur: 20, opacity: 0.4 }],
+    },
+};
 /**
  * useTheme
  *
@@ -42,16 +182,26 @@ function getCachedOrCompute(key, compute) {
  * - getTextColorForBackground("#000") → "light"
  * - getContrastingColor("#f4f4f4", "#222", "#fff") → "#222"
  * - withAlpha("#336699", 0.6) → "rgba(51,102,153,0.6)"
- * - getShadowStyle('base') → { boxShadow: "0px 2px 6px rgba(0, 0, 0, 0.05), 0px 4px 12px rgba(0, 0, 0, 0.03)" }
+ * - getShadowStyle('base') → { boxShadow: "0px 2px 6px rgba(0, 0, 0, 0.1), 0px 4px 12px rgba(0, 0, 0, 0.06)" } (light)
  */
 export function useTheme() {
-    const userTheme = useThemeStore((s) => s.userTheme);
-    const systemTheme = useThemeStore((s) => s.systemTheme);
-    const setTheme = useThemeStore((s) => s.setTheme);
-    const colorOverrides = useThemeStore((s) => s.colorOverrides);
+    // One store subscription per consumer, re-rendering only when one of these
+    // four fields changes (shallow compare), instead of four subscriptions.
+    const { userTheme, systemTheme, hasLoadedTheme, setTheme, colorOverrides } = useThemeStore(useShallow((s) => ({
+        userTheme: s.userTheme,
+        systemTheme: s.systemTheme,
+        hasLoadedTheme: s.hasLoadedTheme,
+        setTheme: s.setTheme,
+        colorOverrides: s.colorOverrides,
+    })));
     const scoped = useThemeColorScope();
-    // Determine which theme to use (user preference or system)
-    const effectiveScheme = resolveThemePreference(userTheme, systemTheme);
+    const initialScheme = useInitialScheme();
+    // Determine which theme to use: the app's first-render hint until the
+    // persisted preference has been read (server render, hydration), then the
+    // user preference or system scheme. See state/initialScheme.tsx.
+    const effectiveScheme = initialScheme !== undefined && !hasLoadedTheme
+        ? initialScheme
+        : resolveThemePreference(userTheme, systemTheme);
     const base = colors[effectiveScheme];
     // Layer overrides on top of the package defaults for the active scheme, in
     // precedence order: package default → global store (app brand) → scoped
@@ -72,13 +222,9 @@ export function useTheme() {
             colors: { ...base.colors, ...storeOverride, ...scopedOverride },
         };
     }, [base, storeOverride, scopedOverride]);
-    // Sync theme to DOM so CSS in +html.tsx follows the app's runtime theme
-    useEffect(() => {
-        if (Platform.OS === "web" && typeof document !== "undefined") {
-            document.documentElement.dataset.theme = effectiveScheme;
-            document.documentElement.style.colorScheme = effectiveScheme;
-        }
-    }, [effectiveScheme]);
+    // Sync theme to DOM so CSS in +html.tsx follows the app's runtime theme.
+    // Starts the app-wide sync on the first mount; a no-op in every later one.
+    useEffect(startDocumentThemeSync, []);
     // Toggle between light, dark, and system themes
     const toggleTheme = useCallback(() => {
         if (userTheme === "light") {
@@ -105,61 +251,26 @@ export function useTheme() {
      * single-layer) is a dual-layer shadow: a tight "contact" layer plus a
      * wider, softer "ambient" layer, pitsi-ui-style. Layers are comma-joined
      * into one `boxShadow` value.
+     *
+     * Light and dark have their own layers. Light is the shadow alone. Dark is
+     * edge-lit: a 1px inset white highlight along the top edge, plus black
+     * layers at real alpha, deeper and larger than light's. On the near-black
+     * dark base a faint drop shadow is invisible, so the highlight carries the
+     * "lit from above" cue and the shadow only grounds the surface. The
+     * highlight is on the raised presets; `sharp` and `glow` have none.
      */
     const getShadowStyle = useCallback((type) => {
-        // Each preset is one or more layers of [offsetX, offsetY, blurRadius, color, opacity].
-        // Darker themes get a stronger alpha so shadows stay visible.
-        const boost = theme.dark ? 3 : 1;
         const overlay = theme.colors.overlay;
-        const shadowConfigs = {
-            subtle: [
-                { x: 0, y: 1, blur: 3, color: overlay, opacity: 0.04 },
-                { x: 0, y: 2, blur: 8, color: overlay, opacity: 0.03 },
-            ],
-            base: [
-                { x: 0, y: 2, blur: 6, color: overlay, opacity: 0.05 },
-                { x: 0, y: 4, blur: 12, color: overlay, opacity: 0.03 },
-            ],
-            soft: [
-                { x: 0, y: 4, blur: 10, color: overlay, opacity: 0.05 },
-                { x: 0, y: 8, blur: 20, color: overlay, opacity: 0.03 },
-            ],
-            card: [
-                { x: 0, y: 4, blur: 12, color: overlay, opacity: 0.05 },
-                { x: 0, y: 8, blur: 24, color: overlay, opacity: 0.03 },
-            ],
-            cardSubtle: [
-                { x: 0, y: 1, blur: 3, color: overlay, opacity: 0.05 },
-                { x: 0, y: 3, blur: 9, color: overlay, opacity: 0.03 },
-            ],
-            cardHover: [
-                { x: 0, y: 8, blur: 24, color: overlay, opacity: 0.06 },
-                { x: 0, y: 16, blur: 48, color: overlay, opacity: 0.04 },
-            ],
-            elevated: [
-                { x: 0, y: 16, blur: 48, color: overlay, opacity: 0.08 },
-                { x: 0, y: 32, blur: 96, color: overlay, opacity: 0.05 },
-            ],
-            glass: [
-                { x: 0, y: 4, blur: 30, color: overlay, opacity: 0.05 },
-                { x: 0, y: 8, blur: 60, color: overlay, opacity: 0.03 },
-            ],
-            // Single layer — intentional crispness, not a soft dual-layer shadow.
-            sharp: [
-                { x: 0, y: 1, blur: 1, color: overlay, opacity: 0.15 },
-            ],
-            // Single layer — already a deliberate, vivid accent glow.
-            glow: [
-                { x: 0, y: 4, blur: 20, color: theme.colors.primary, opacity: 0.4 },
-            ],
-        };
-        const layers = shadowConfigs[type].map(({ x, y, blur, color, opacity }) => {
-            // Don't boost the glow accent — it's already a deliberate, vivid alpha.
-            const alpha = color === theme.colors.primary ? opacity : Math.min(opacity * boost, 1);
-            return `${x}px ${y}px ${blur}px ${withAlpha(color, alpha)}`;
-        });
+        const config = SHADOW_CONFIGS[type];
+        const layers = theme.dark ? config.dark : config.light;
+        // Don't tint `glow` with the overlay: it is a deliberate, vivid accent glow.
+        const color = type === "glow" ? theme.colors.primary : overlay;
+        const parts = layers.map(({ x, y, blur, opacity }) => `${x}px ${y}px ${blur}px ${withAlpha(color, opacity)}`);
+        if (theme.dark && config.highlight !== undefined) {
+            parts.unshift(`inset 0px 1px 0px ${withAlpha(palette.white, config.highlight)}`);
+        }
         return {
-            boxShadow: layers.join(", "),
+            boxShadow: parts.join(", "),
         };
     }, [theme]);
     const getFocusRingStyle = useCallback((offset = 2) => {

package/dist/hooks/useWindowInsets.d.ts

@@ -0,0 +1,13 @@
+import { type EdgeInsets } from "react-native-safe-area-context";
+/**
+ * The window's safe-area insets, wherever the component renders.
+ *
+ * `useSafeAreaInsets()` throws outside a `SafeAreaProvider` and reads zeros
+ * inside content the system presents outside the provider's view — an iOS
+ * `Modal`, a native bottom sheet, a `UIProvider` mounted above the app's
+ * provider. This reads the provider's context when it is there and falls back
+ * to `initialWindowMetrics` (the window the app launched in), edge by edge, so
+ * overlays, toasts and `Screen` clear the Dynamic Island and home indicator in
+ * every one of those cases. Zeros on web and in tests without a provider.
+ */
+export declare function useWindowInsets(): EdgeInsets;

package/dist/hooks/useWindowInsets.js

@@ -0,0 +1,23 @@
+import { use } from "react";
+import { SafeAreaInsetsContext, initialWindowMetrics, } from "react-native-safe-area-context";
+/**
+ * The window's safe-area insets, wherever the component renders.
+ *
+ * `useSafeAreaInsets()` throws outside a `SafeAreaProvider` and reads zeros
+ * inside content the system presents outside the provider's view — an iOS
+ * `Modal`, a native bottom sheet, a `UIProvider` mounted above the app's
+ * provider. This reads the provider's context when it is there and falls back
+ * to `initialWindowMetrics` (the window the app launched in), edge by edge, so
+ * overlays, toasts and `Screen` clear the Dynamic Island and home indicator in
+ * every one of those cases. Zeros on web and in tests without a provider.
+ */
+export function useWindowInsets() {
+    const context = use(SafeAreaInsetsContext);
+    const fallback = initialWindowMetrics?.insets;
+    return {
+        top: context?.top || fallback?.top || 0,
+        bottom: context?.bottom || fallback?.bottom || 0,
+        left: context?.left || fallback?.left || 0,
+        right: context?.right || fallback?.right || 0,
+    };
+}

package/dist/icons/LICENSE.lucide

@@ -0,0 +1,43 @@
+ISC License
+
+Copyright (c) 2026 Lucide Icons and Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+
+---
+
+The following Lucide icons are derived from the Feather project:
+
+airplay, alert-circle, alert-octagon, alert-triangle, aperture, arrow-down-circle, arrow-down-left, arrow-down-right, arrow-down, arrow-left-circle, arrow-left, arrow-right-circle, arrow-right, arrow-up-circle, arrow-up-left, arrow-up-right, arrow-up, at-sign, calendar, cast, check, chevron-down, chevron-left, chevron-right, chevron-up, chevrons-down, chevrons-left, chevrons-right, chevrons-up, circle, clipboard, clock, code, columns, command, compass, corner-down-left, corner-down-right, corner-left-down, corner-left-up, corner-right-down, corner-right-up, corner-up-left, corner-up-right, crosshair, database, divide-circle, divide-square, dollar-sign, download, external-link, feather, frown, hash, headphones, help-circle, info, italic, key, layout, life-buoy, link-2, link, loader, lock, log-in, log-out, maximize, meh, minimize, minimize-2, minus-circle, minus-square, minus, monitor, moon, more-horizontal, more-vertical, move, music, navigation-2, navigation, octagon, pause-circle, percent, plus-circle, plus-square, plus, power, radio, rss, search, server, share, shopping-bag, sidebar, smartphone, smile, square, table-2, tablet, target, terminal, trash-2, trash, triangle, tv, type, upload, x-circle, x-octagon, x-square, x, zoom-in, zoom-out
+
+The MIT License (MIT) (for the icons listed above)
+
+Copyright (c) 2013-present Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.