@bolio-ui/core 3.0.5 → 3.1.0

package/esm/styles.css

@@ -1,4 +1,4 @@
-@layer BolioUIBaseline, Alert, Avatar, Badge, Breadcrumbs, Button, ButtonDropdown, ButtonGroup, Calendar, Capacity, Card, Carousel, Checkbox, Chip, Code, Col, Collapse, ColorInput, ColorPicker, Combobox, Command, Container, ContextMenu, DatePicker, DateRangePicker, Description, Display, Divider, Dot, Drawer, Dropzone, EmptyState, Fieldset, Grid, Image, ImageZoom, Input, Keyboard, Link, Loading, Marquee, MdxWidgets, Mention, Menu, Modal, Note, NumberInput, Page, Pagination, PinInput, Popover, Progress, Radio, Rating, Row, SegmentedControl, Select, Shared, Skeleton, Slider, Snippet, Spinner, Splitter, Stat, Stepper, Table, Tabs, Tag, TagsInput, Textarea, Timeline, Toggle, Toolbar, Tooltip, Tour, Tree, use-toasts;
+@layer BolioUIBaseline, Alert, Avatar, Badge, Breadcrumbs, Button, ButtonDropdown, ButtonGroup, Calendar, Capacity, Card, Carousel, Checkbox, Chip, Code, Col, Collapse, ColorInput, ColorPicker, Combobox, Command, Container, ContextMenu, DatePicker, DateRangePicker, Description, Display, Divider, Dot, Drawer, Dropzone, EmptyState, Fieldset, Grid, Image, ImageZoom, Input, Keyboard, Link, Loading, Mark, Marquee, MdxWidgets, Mention, Menu, Modal, Note, NumberInput, Page, Pagination, PinInput, Popover, Progress, Radio, Rating, Row, ScrollArea, SegmentedControl, Select, Shared, Skeleton, Slider, Snippet, Spinner, Splitter, Spoiler, Stat, Stepper, Table, Tabs, Tag, TagsInput, Textarea, Timeline, Toggle, Toolbar, Tooltip, Tour, Tree, use-toasts;
 
 @layer Alert {
 .Alert-module_alert__Ghxl7 {
@@ -246,6 +246,11 @@
   overflow: hidden;
 }
 
+.Button-module_root__LhkYq:focus-visible {
+  outline: 2px solid var(--bolio-ui-button-focus);
+  outline-offset: 2px;
+}
+
 .Button-module_root__LhkYq:active {
   transform: scale(0.98, 0.98);
 }
@@ -387,6 +392,11 @@
     border-color 0.2s ease 0s;
 }
 
+.ButtonDropdown-module_summary__NGCte:focus-visible {
+  outline: 2px solid var(--bolio-ui-dropdown-focus);
+  outline-offset: -2px;
+}
+
 .ButtonDropdown-module_content__O7uo- {
   position: absolute;
   right: 0;
@@ -2865,6 +2875,10 @@ body:has(.ImageZoom-module_dialog__TjA9E[open]) {
   padding: 0;
   visibility: hidden;
   opacity: 0;
+  border: 0;
+  background: none;
+  color: inherit;
+  font: inherit;
 }
 
 .InputIconClear-module_visible__5nUZb {
@@ -3015,6 +3029,16 @@ body:has(.ImageZoom-module_dialog__TjA9E[open]) {
 
 }
 
+@layer Mark {
+.Mark-module_mark__MnjwZ {
+  padding: 0 0.15em;
+  border-radius: 0.2em;
+  background-color: var(--mark-bg);
+  color: inherit;
+}
+
+}
+
 @layer Marquee {
 .Marquee-module_marquee__sIUoV {
   display: flex;
@@ -3992,6 +4016,123 @@ body:has(.ImageZoom-module_dialog__TjA9E[open]) {
 
 }
 
+@layer ScrollArea {
+.ScrollArea-module_scrollArea__hWDno {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  --scroll-thumb: var(--scroll-thumb-visible);
+}
+
+/* the thumb only shows while the pointer or the focus is inside */
+.ScrollArea-module_hover__BdieF {
+  --scroll-thumb: transparent;
+}
+
+.ScrollArea-module_hover__BdieF:hover,
+.ScrollArea-module_hover__BdieF:focus-within {
+  --scroll-thumb: var(--scroll-thumb-visible);
+}
+
+.ScrollArea-module_viewport__NsNP8 {
+  flex: 1 1 auto;
+  min-height: 0;
+  box-sizing: border-box;
+  scrollbar-width: thin;
+  scrollbar-color: var(--scroll-thumb) transparent;
+}
+
+/* Chrome and Safari draw an overlay scrollbar that only shows while
+   scrolling when the standard properties are set, so they get a real one */
+@supports selector(::-webkit-scrollbar) {
+  .ScrollArea-module_viewport__NsNP8 {
+    scrollbar-width: auto;
+    scrollbar-color: auto;
+  }
+
+  .ScrollArea-module_viewport__NsNP8::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  .ScrollArea-module_viewport__NsNP8::-webkit-scrollbar-thumb {
+    border-radius: 4px;
+    background: var(--scroll-thumb);
+  }
+
+  .ScrollArea-module_viewport__NsNP8::-webkit-scrollbar-thumb:hover {
+    background: var(--scroll-thumb-active);
+  }
+
+  .ScrollArea-module_viewport__NsNP8::-webkit-scrollbar-corner {
+    background: transparent;
+  }
+}
+
+.ScrollArea-module_viewport__NsNP8:focus-visible {
+  outline: 2px solid var(--scroll-focus);
+  outline-offset: -2px;
+}
+
+.ScrollArea-module_vertical__pLVjR {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+
+.ScrollArea-module_horizontal__04fX0 {
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.ScrollArea-module_both__SLatS {
+  overflow: auto;
+}
+
+/* Firefox keeps an overlay scrollbar that never shows on hover, so its
+   native one is hidden and the area draws these thumbs instead */
+.ScrollArea-module_viewport__NsNP8.ScrollArea-module_custom__EmB3p {
+  scrollbar-width: none;
+}
+
+.ScrollArea-module_track__vGrOF {
+  position: absolute;
+  pointer-events: none;
+}
+
+.ScrollArea-module_trackX__VM9bC {
+  right: 0;
+  bottom: 0;
+  left: 0;
+  height: 8px;
+}
+
+.ScrollArea-module_trackY__Apbnh {
+  top: 0;
+  right: 0;
+  bottom: 0;
+  width: 8px;
+}
+
+.ScrollArea-module_thumb__DLvTa {
+  height: 100%;
+  border-radius: 4px;
+  background: var(--scroll-thumb);
+  pointer-events: auto;
+  touch-action: none;
+}
+
+.ScrollArea-module_trackY__Apbnh .ScrollArea-module_thumb__DLvTa {
+  width: 100%;
+  height: auto;
+}
+
+.ScrollArea-module_thumb__DLvTa:hover {
+  background: var(--scroll-thumb-active);
+}
+
+}
+
 @layer SegmentedControl {
 .SegmentedControl-module_segmented__DCgXM {
   display: flex;
@@ -4203,6 +4344,9 @@ body:has(.ImageZoom-module_dialog__TjA9E[open]) {
   color: var(--select-clear-icon-color);
   visibility: visible;
   opacity: 1;
+  border: 0;
+  background: none;
+  font: inherit;
 }
 
 .SelectIconClear-module_clearIcon__p5IH4:hover {
@@ -4288,6 +4432,10 @@ body:has(.ImageZoom-module_dialog__TjA9E[open]) {
   background-color: color-mix(in srgb, currentColor 12%, transparent);
 }
 
+.SelectOption-module_option__NAlFp.SelectOption-module_active__vxHSF {
+  background-color: color-mix(in srgb, currentColor 12%, transparent);
+}
+
 .SelectOption-module_label__NtVM7:hover,
 .SelectOption-module_divider__mmqJj:hover {
   background-color: transparent;
@@ -4556,6 +4704,9 @@ body:has(.ImageZoom-module_dialog__TjA9E[open]) {
   cursor: pointer;
   user-select: none;
   opacity: 0.65;
+  border: 0;
+  padding: 0;
+  font: inherit;
 }
 
 .Snippet-module_copy__vSMCk:hover {
@@ -4746,6 +4897,37 @@ body:has(.ImageZoom-module_dialog__TjA9E[open]) {
 
 }
 
+@layer Spoiler {
+.Spoiler-module_spoiler__aAOK0 {
+  box-sizing: border-box;
+}
+
+.Spoiler-module_content__D69z0 {
+  overflow: hidden;
+}
+
+.Spoiler-module_toggle__kCTmC {
+  display: inline-block;
+  margin-top: 0.5em;
+  padding: 0;
+  border: 0;
+  background: none;
+  color: var(--spoiler-link);
+  font: inherit;
+  cursor: pointer;
+}
+
+.Spoiler-module_toggle__kCTmC:hover {
+  text-decoration: underline;
+}
+
+.Spoiler-module_toggle__kCTmC:focus-visible {
+  outline: 2px solid var(--spoiler-link);
+  outline-offset: 2px;
+}
+
+}
+
 @layer Stat {
 .Stat-module_stat__aLq0n {
   display: flex;

package/esm/use-all-themes/all-themes-context.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BolioUIThemes } from '../Themes/Presets';
+import type { BolioUIThemes } from '../Themes/Presets';
 export type AllThemesConfig = {
     themes: Array<BolioUIThemes>;
 };

package/esm/use-body-scroll/index.js

@@ -1,7 +1,7 @@
 'use client';
 import {
   use_body_scroll_default
-} from "../chunk-O3RTRCY5.js";
+} from "../chunk-GUILS62W.js";
 export {
   use_body_scroll_default as default
 };

package/esm/use-body-scroll/use-body-scroll.d.ts

@@ -1,4 +1,4 @@
-import { Dispatch, RefObject, SetStateAction } from 'react';
+import type { Dispatch, RefObject, SetStateAction } from 'react';
 export type ElementStackItem = {
     overflow: string;
     paddingRight: string;

package/esm/use-click-away/use-click-away.d.ts

@@ -1,4 +1,4 @@
-import { MutableRefObject } from 'react';
+import type { MutableRefObject } from 'react';
 export type ClickAwayGetContainer = () => HTMLElement | null;
 declare const useClickAway: (ref: MutableRefObject<HTMLElement | null>, handler: (event: Event) => void) => void;
 export default useClickAway;

package/esm/use-collapse/index.d.ts

@@ -0,0 +1,3 @@
+import useCollapse from './use-collapse';
+export type { UseCollapseOptions, UseCollapseResult } from './use-collapse';
+export default useCollapse;

package/esm/use-collapse/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_collapse_default
+} from "../chunk-N5NXRA7T.js";
+export {
+  use_collapse_default as default
+};

package/esm/use-collapse/use-collapse.d.ts

@@ -0,0 +1,12 @@
+import type { CSSProperties, RefObject } from 'react';
+export type UseCollapseOptions = {
+    opened: boolean;
+    duration?: number;
+};
+export type UseCollapseResult<T extends HTMLElement> = {
+    ref: RefObject<T | null>;
+    style: CSSProperties;
+    onTransitionEnd: () => void;
+};
+declare const useCollapse: <T extends HTMLElement = HTMLElement>({ opened, duration }: UseCollapseOptions) => UseCollapseResult<T>;
+export default useCollapse;

package/esm/use-color-scheme/index.d.ts

@@ -0,0 +1,2 @@
+import useColorScheme from './use-color-scheme';
+export default useColorScheme;

package/esm/use-color-scheme/index.js

@@ -0,0 +1,8 @@
+'use client';
+import {
+  use_color_scheme_default
+} from "../chunk-3YUXMLBC.js";
+import "../chunk-DZHZXUII.js";
+export {
+  use_color_scheme_default as default
+};

package/esm/use-color-scheme/use-color-scheme.d.ts

@@ -0,0 +1,2 @@
+declare const useColorScheme: () => "light" | "dark";
+export default useColorScheme;

package/esm/use-counter/index.d.ts

@@ -0,0 +1,3 @@
+import useCounter from './use-counter';
+export type { UseCounterOptions, UseCounterHandlers } from './use-counter';
+export default useCounter;

package/esm/use-counter/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_counter_default
+} from "../chunk-WPDNBQYS.js";
+export {
+  use_counter_default as default
+};

package/esm/use-counter/use-counter.d.ts

@@ -0,0 +1,12 @@
+export type UseCounterOptions = {
+    min?: number;
+    max?: number;
+};
+export type UseCounterHandlers = {
+    increment: () => void;
+    decrement: () => void;
+    set: (value: number) => void;
+    reset: () => void;
+};
+declare const useCounter: (initialValue?: number, { min, max }?: UseCounterOptions) => [number, UseCounterHandlers];
+export default useCounter;

package/esm/use-current-state/index.js

@@ -1,7 +1,7 @@
 'use client';
 import {
   use_current_state_default
-} from "../chunk-GGD4BGH2.js";
+} from "../chunk-OOU3TSOA.js";
 export {
   use_current_state_default as default
 };

package/esm/use-current-state/use-current-state.d.ts

@@ -1,4 +1,4 @@
-import { Dispatch, MutableRefObject, SetStateAction } from 'react';
+import type { Dispatch, MutableRefObject, SetStateAction } from 'react';
 export type CurrentStateType<S> = [
     S,
     Dispatch<SetStateAction<S>>,

package/esm/use-debounced-callback/index.d.ts

@@ -0,0 +1,2 @@
+import useDebouncedCallback from './use-debounced-callback';
+export default useDebouncedCallback;

package/esm/use-debounced-callback/index.js

@@ -0,0 +1,8 @@
+'use client';
+import {
+  use_debounced_callback_default
+} from "../chunk-ZP2KTH2H.js";
+import "../chunk-ZRORQ2WH.js";
+export {
+  use_debounced_callback_default as default
+};

package/esm/use-debounced-callback/use-debounced-callback.d.ts

@@ -0,0 +1,5 @@
+declare const useDebouncedCallback: <A extends unknown[]>(callback: (...args: A) => void, wait: number) => {
+    (...args: A): void;
+    cancel(): void;
+};
+export default useDebouncedCallback;

package/esm/use-debounced-state/index.d.ts

@@ -0,0 +1,3 @@
+import useDebouncedState from './use-debounced-state';
+export type { UseDebouncedStateOptions } from './use-debounced-state';
+export default useDebouncedState;

package/esm/use-debounced-state/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_debounced_state_default
+} from "../chunk-BVYKOLVM.js";
+export {
+  use_debounced_state_default as default
+};

package/esm/use-debounced-state/use-debounced-state.d.ts

@@ -0,0 +1,5 @@
+export type UseDebouncedStateOptions = {
+    leading?: boolean;
+};
+declare const useDebouncedState: <T>(initialValue: T, wait: number, { leading }?: UseDebouncedStateOptions) => [T, (value: T) => void];
+export default useDebouncedState;

package/esm/use-debounced-value/index.d.ts

@@ -0,0 +1,3 @@
+import useDebouncedValue from './use-debounced-value';
+export type { UseDebouncedValueOptions } from './use-debounced-value';
+export default useDebouncedValue;

package/esm/use-debounced-value/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_debounced_value_default
+} from "../chunk-BNPKMXV3.js";
+export {
+  use_debounced_value_default as default
+};

package/esm/use-debounced-value/use-debounced-value.d.ts

@@ -0,0 +1,5 @@
+export type UseDebouncedValueOptions = {
+    leading?: boolean;
+};
+declare const useDebouncedValue: <T>(value: T, wait: number, { leading }?: UseDebouncedValueOptions) => [T, () => void];
+export default useDebouncedValue;

package/esm/use-did-update/index.d.ts

@@ -0,0 +1,2 @@
+import useDidUpdate from './use-did-update';
+export default useDidUpdate;

package/esm/use-did-update/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_did_update_default
+} from "../chunk-SGBNQO6N.js";
+export {
+  use_did_update_default as default
+};

package/esm/use-did-update/use-did-update.d.ts

@@ -0,0 +1,3 @@
+import type { DependencyList, EffectCallback } from 'react';
+declare const useDidUpdate: (fn: EffectCallback, dependencies?: DependencyList) => void;
+export default useDidUpdate;

package/esm/use-disclosure/index.d.ts

@@ -0,0 +1,3 @@
+import useDisclosure from './use-disclosure';
+export type { UseDisclosureOptions, UseDisclosureHandlers } from './use-disclosure';
+export default useDisclosure;

package/esm/use-disclosure/index.js

@@ -0,0 +1,8 @@
+'use client';
+import {
+  use_disclosure_default
+} from "../chunk-ITDDH7VF.js";
+import "../chunk-ZRORQ2WH.js";
+export {
+  use_disclosure_default as default
+};

package/esm/use-disclosure/use-disclosure.d.ts

@@ -0,0 +1,11 @@
+export type UseDisclosureOptions = {
+    onOpen?: () => void;
+    onClose?: () => void;
+};
+export type UseDisclosureHandlers = {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+};
+declare const useDisclosure: (initialState?: boolean, options?: UseDisclosureOptions) => [boolean, UseDisclosureHandlers];
+export default useDisclosure;

package/esm/use-document-title/index.d.ts

@@ -0,0 +1,2 @@
+import useDocumentTitle from './use-document-title';
+export default useDocumentTitle;

package/esm/use-document-title/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_document_title_default
+} from "../chunk-7FDVIBQ3.js";
+export {
+  use_document_title_default as default
+};

package/esm/use-document-title/use-document-title.d.ts

@@ -0,0 +1,2 @@
+declare const useDocumentTitle: (title: string) => void;
+export default useDocumentTitle;

package/esm/use-document-visibility/index.d.ts

@@ -0,0 +1,2 @@
+import useDocumentVisibility from './use-document-visibility';
+export default useDocumentVisibility;

package/esm/use-document-visibility/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_document_visibility_default
+} from "../chunk-7VYP5HCP.js";
+export {
+  use_document_visibility_default as default
+};

package/esm/use-document-visibility/use-document-visibility.d.ts

@@ -0,0 +1,2 @@
+declare const useDocumentVisibility: () => DocumentVisibilityState;
+export default useDocumentVisibility;

package/esm/use-drag/index.d.ts

@@ -0,0 +1,3 @@
+import useDrag from './use-drag';
+export type { UseDragResult } from './use-drag';
+export default useDrag;

package/esm/use-drag/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_drag_default
+} from "../chunk-CXVCM2PB.js";
+export {
+  use_drag_default as default
+};

package/esm/use-drag/use-drag.d.ts

@@ -0,0 +1,12 @@
+import type { RefObject } from 'react';
+export type UseDragResult<T extends HTMLElement> = {
+    ref: RefObject<T | null>;
+    dragging: boolean;
+    position: {
+        x: number;
+        y: number;
+    };
+    reset: () => void;
+};
+declare const useDrag: <T extends HTMLElement = HTMLElement>() => UseDragResult<T>;
+export default useDrag;

package/esm/use-element-size/index.d.ts

@@ -0,0 +1,3 @@
+import useElementSize from './use-element-size';
+export type { UseElementSizeResult } from './use-element-size';
+export default useElementSize;

package/esm/use-element-size/index.js

@@ -0,0 +1,8 @@
+'use client';
+import {
+  use_element_size_default
+} from "../chunk-MNUYKWKF.js";
+import "../chunk-5L34MDJF.js";
+export {
+  use_element_size_default as default
+};

package/esm/use-element-size/use-element-size.d.ts

@@ -0,0 +1,8 @@
+import type { RefObject } from 'react';
+export type UseElementSizeResult<T extends HTMLElement> = {
+    ref: RefObject<T | null>;
+    width: number;
+    height: number;
+};
+declare const useElementSize: <T extends HTMLElement = HTMLElement>() => UseElementSizeResult<T>;
+export default useElementSize;

package/esm/use-event-listener/index.d.ts

@@ -0,0 +1,2 @@
+import useEventListener from './use-event-listener';
+export default useEventListener;

package/esm/use-event-listener/index.js

@@ -0,0 +1,8 @@
+'use client';
+import {
+  use_event_listener_default
+} from "../chunk-O37I27KZ.js";
+import "../chunk-ZRORQ2WH.js";
+export {
+  use_event_listener_default as default
+};

package/esm/use-event-listener/use-event-listener.d.ts

@@ -0,0 +1,3 @@
+import type { RefObject } from 'react';
+declare const useEventListener: <K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLElement>(type: K, listener: (event: HTMLElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions) => RefObject<T | null>;
+export default useEventListener;

package/esm/use-eye-dropper/index.d.ts

@@ -0,0 +1,2 @@
+import useEyeDropper from './use-eye-dropper';
+export default useEyeDropper;

package/esm/use-eye-dropper/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_eye_dropper_default
+} from "../chunk-FFYWCFPP.js";
+export {
+  use_eye_dropper_default as default
+};

package/esm/use-eye-dropper/use-eye-dropper.d.ts

@@ -0,0 +1,9 @@
+declare const useEyeDropper: () => {
+    supported: boolean;
+    open: (options?: {
+        signal?: AbortSignal;
+    }) => Promise<{
+        sRGBHex: string;
+    } | undefined>;
+};
+export default useEyeDropper;

package/esm/use-favicon/index.d.ts

@@ -0,0 +1,2 @@
+import useFavicon from './use-favicon';
+export default useFavicon;

package/esm/use-favicon/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_favicon_default
+} from "../chunk-7XJQX5IB.js";
+export {
+  use_favicon_default as default
+};

package/esm/use-favicon/use-favicon.d.ts

@@ -0,0 +1,2 @@
+declare const useFavicon: (url: string) => void;
+export default useFavicon;

package/esm/use-fetch/index.d.ts

@@ -0,0 +1,3 @@
+import useFetch from './use-fetch';
+export type { UseFetchOptions, UseFetchResult } from './use-fetch';
+export default useFetch;

package/esm/use-fetch/index.js

@@ -0,0 +1,7 @@
+'use client';
+import {
+  use_fetch_default
+} from "../chunk-UTUCP2HS.js";
+export {
+  use_fetch_default as default
+};

package/esm/use-fetch/use-fetch.d.ts

@@ -0,0 +1,12 @@
+export type UseFetchOptions = RequestInit & {
+    autoInvoke?: boolean;
+};
+export type UseFetchResult<T> = {
+    data: T | null;
+    loading: boolean;
+    error: Error | null;
+    refetch: () => Promise<T | null>;
+    abort: () => void;
+};
+declare const useFetch: <T = unknown>(url: string, { autoInvoke, ...init }?: UseFetchOptions) => UseFetchResult<T>;
+export default useFetch;