@atom-learning/components 5.2.0-beta.1 → 5.2.0

package/dist/index.js

@@ -1,2 +1,2 @@
-import{Accordion as f}from"./components/accordion/Accordion.js";import{ActionIcon as a}from"./components/action-icon/ActionIcon.js";import{AlertDialog as n}from"./components/alert-dialog/AlertDialog.js";import{AlertProvider as s,useAlert as u}from"./components/alert-dialog/alert-context/AlertContext.js";import{Avatar as S}from"./components/avatar/Avatar.js";import{Badge as T}from"./components/badge/Badge.js";import{BannerRegular as C}from"./components/banner/banner-regular/BannerRegular.js";import{BannerSlim as h}from"./components/banner/banner-slim/BannerSlim.js";import{Box as I}from"./components/box/Box.js";import{Button as k,StyledButton as v}from"./components/button/Button.js";import{Carousel as w,useCarousel as P}from"./components/carousel/Carousel.js";import{Checkbox as A}from"./components/checkbox/Checkbox.js";import{CheckboxGroup as N}from"./components/checkbox-group/CheckboxGroup.js";import{CheckboxTree as L}from"./components/checkbox-tree/CheckboxTree.js";import{CheckboxField as W}from"./components/checkbox-field/CheckboxField.js";import{Chip as E}from"./components/chip/Chip.js";import{ChipGroup as K}from"./components/chip/ChipGroup.js";import{ChipDismissibleGroup as q}from"./components/chip-dismissible-group/index.js";import{ChipToggleGroup as J}from"./components/chip-toggle-group/index.js";import{Combobox as U}from"./components/combobox/Combobox.js";import{CreatePasswordField as Y}from"./components/create-password-field/CreatePasswordField.js";import{useDataTable as _}from"./components/data-table/DataTableContext.js";import{DataTable as oo}from"./components/data-table/DataTable.js";import{DateField as eo}from"./components/date-field/DateField.js";import{DateInput as po}from"./components/date-input/DateInput.js";import{Dialog as xo}from"./components/dialog/Dialog.js";import{Dismissible as io}from"./components/dismissible/index.js";import{DismissibleGroup as lo}from"./components/dismissible-group/index.js";import{Divider as so}from"./components/divider/Divider.js";import{Drawer as co}from"./components/drawer/Drawer.js";import{DropdownMenu as bo}from"./components/dropdown-menu/DropdownMenu.js";import{EmptyState as go}from"./components/empty-state/EmptyState.js";import{FieldWrapper as Fo}from"./components/field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as Bo}from"./components/field-wrapper/InlineFieldWrapper.js";import{FileInput as Do}from"./components/file-input/FileInput.js";import{Flex as vo}from"./components/flex/Flex.js";import{Form as wo}from"./components/form/Form.js";import"dlv";import"react-hook-form";import{Grid as yo}from"./components/grid/Grid.js";import{Heading as Mo}from"./components/heading/Heading.js";import{Icon as Ro}from"./components/icon/Icon.js";import{Image as Vo}from"./components/image/Image.js";import{InlineMessage as Oo}from"./components/inline-message/InlineMessage.js";import{Input as Ho,InputBackground as Ko,InputText as jo}from"./components/input/Input.js";import{InputField as zo}from"./components/input-field/InputField.js";import{Label as Qo}from"./components/label/Label.js";import{Link as Xo,StyledLink as Yo}from"./components/link/Link.js";import{List as _o}from"./components/list/List.js";import{Loader as or}from"./components/loader/Loader.js";import{MarkdownContent as er}from"./components/markdown-content/MarkdownContent.js";import{NavigationMenu as pr}from"./components/navigation/NavigationMenu.js";import{NavigationMenuVertical as xr}from"./components/navigation-menu-vertical/NavigationMenuVertical.js";import{NotificationBadge as ir}from"./components/notification-badge/NotificationBadge.js";import{NumberInput as lr}from"./components/number-input/NumberInput.js";import{NumberInputField as dr}from"./components/number-input-field/NumberInputField.js";import{Pagination as ur}from"./components/pagination/Pagination.js";import{PasswordField as Sr}from"./components/password-field/PasswordField.js";import{PasswordInput as Tr}from"./components/password-input/PasswordInput.js";import{Popover as Cr}from"./components/popover/Popover.js";import{ProgressBar as hr}from"./components/progress-bar/ProgressBar.js";import{RadioButton as Ir}from"./components/radio-button/RadioButton.js";import{RadioButtonGroup as kr}from"./components/radio-button/RadioButtonGroup.js";import{RadioButtonField as Gr}from"./components/radio-button-field/RadioButtonField.js";import{RadioCard as Pr}from"./components/radio-card/RadioCard.js";import{RadioCardGroup as Ar}from"./components/radio-card/RadioCardGroup.js";import{SearchField as Nr}from"./components/search-field/SearchField.js";import{SearchInput as Lr}from"./components/search-input/SearchInput.js";import{SectionMessage as Wr}from"./components/section-message/SectionMessage.js";import{Select as Er}from"./components/select/Select.js";import{SelectField as Kr}from"./components/select-field/SelectField.js";import{SideBar as qr}from"./components/side-bar/SideBar.js";import{useSidebarState as Jr}from"./components/side-bar/SideBarContext.js";import{Slider as Ur}from"./components/slider/Slider.js";import{SliderField as Yr}from"./components/slider-field/SliderField.js";import{Sortable as _r}from"./components/sortable/index.js";import{Spacer as oe}from"./components/spacer/Spacer.js";import{Stepper as ee}from"./components/stepper/Stepper.js";import{Switch as pe}from"./components/switch/Switch.js";import{Table as xe}from"./components/table/Table.js";import{Tabs as ie}from"./components/tabs/Tabs.js";import{Text as le}from"./components/text/Text.js";import{Textarea as de}from"./components/textarea/Textarea.js";import{TextareaField as ue}from"./components/textarea-field/TextareaField.js";import{Tile as Se}from"./components/tile/Tile.js";import{TileGroup as Te}from"./components/tile/TileGroup.js";import{TileInteractive as Ce}from"./components/tile-interactive/TileInteractive.js";import{TileToggleGroup as he}from"./components/tile-toggle-group/index.js";import{Toast as Ie}from"./components/toast/Toast.js";import{ToastProvider as ke}from"./components/toast/ToastProvider.js";import{ToggleGroup as Ge}from"./components/toggle-group/index.js";import{Tooltip as Pe}from"./components/tooltip/Tooltip.js";import{TopBar as Ae}from"./components/top-bar/TopBar.js";import{Tree as Ne}from"./components/tree/Tree.js";import{Video as Le}from"./components/video/Video.js";import{KeyboardShortcut as We}from"./components/keyboard-shortcut/index.js";import{SegmentedControl as Ee}from"./components/segmented-control/SegmentedControl.js";import{FileDrop as Ke}from"./components/file-drop/FileDrop.js";import{useFileDrop as qe}from"./components/file-drop/useFileDrop.js";import{ScrollableContainer as Je}from"./components/scrollable-container/ScrollableContainer.js";import{ScrollableContainerProvider as Ue}from"./components/scrollable-container/ScrollableContainer.context.js";import{useScrollableContainer as Ye}from"./components/scrollable-container/useScrollableContainer.js";import{createTheme as _e,css as $e,getCssText as ot,globalCss as rt,keyframes as et,media as tt,styled as pt,theme as mt,utils as xt}from"./stitches.js";import{ColorScheme as it}from"./experiments/color-scheme/ColorScheme.js";import{createThemeVariants as lt}from"./utilities/create-theme-variants/createThemeVariants.js";import"./utilities/css-wrapper/CSSWrapper.js";import{NoOverflowWrapper as dt,noOverflowStyleBlock as st}from"./utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as ct}from"./utilities/style/focus-visible-style-block.js";import"./utilities/style/keyframe-animations.js";import{default as bt}from"react-hot-toast";export{f as Accordion,a as ActionIcon,n as AlertDialog,s as AlertProvider,S as Avatar,T as Badge,C as BannerRegular,h as BannerSlim,I as Box,k as Button,w as Carousel,A as Checkbox,W as CheckboxField,N as CheckboxGroup,L as CheckboxTree,E as Chip,q as ChipDismissibleGroup,K as ChipGroup,J as ChipToggleGroup,it as ColorScheme,U as Combobox,Y as CreatePasswordField,oo as DataTable,eo as DateField,po as DateInput,xo as Dialog,io as Dismissible,lo as DismissibleGroup,so as Divider,co as Drawer,bo as DropdownMenu,go as EmptyState,Fo as FieldWrapper,Ke as FileDrop,Do as FileInput,vo as Flex,wo as Form,yo as Grid,Mo as Heading,Ro as Icon,Vo as Image,Bo as InlineFieldWrapper,Oo as InlineMessage,Ho as Input,Ko as InputBackground,zo as InputField,jo as InputText,We as KeyboardShortcut,Qo as Label,Xo as Link,_o as List,or as Loader,er as MarkdownContent,pr as NavigationMenu,xr as NavigationMenuVertical,dt as NoOverflowWrapper,ir as NotificationBadge,lr as NumberInput,dr as NumberInputField,ur as Pagination,Sr as PasswordField,Tr as PasswordInput,Cr as Popover,hr as ProgressBar,Ir as RadioButton,Gr as RadioButtonField,kr as RadioButtonGroup,Pr as RadioCard,Ar as RadioCardGroup,Je as ScrollableContainer,Ue as ScrollableContainerProvider,Nr as SearchField,Lr as SearchInput,Wr as SectionMessage,Ee as SegmentedControl,Er as Select,Kr as SelectField,qr as SideBar,Ur as Slider,Yr as SliderField,_r as Sortable,oe as Spacer,ee as Stepper,v as StyledButton,Yo as StyledLink,pe as Switch,xe as Table,ie as Tabs,le as Text,de as Textarea,ue as TextareaField,Se as Tile,Te as TileGroup,Ce as TileInteractive,he as TileToggleGroup,Ie as Toast,ke as ToastProvider,Ge as ToggleGroup,Pe as Tooltip,Ae as TopBar,Ne as Tree,Le as Video,_e as createTheme,lt as createThemeVariants,$e as css,ct as focusVisibleStyleBlock,ot as getCssText,rt as globalCss,et as keyframes,tt as media,st as noOverflowStyleBlock,pt as styled,mt as theme,bt as toast,u as useAlert,P as useCarousel,_ as useDataTable,qe as useFileDrop,Ye as useScrollableContainer,Jr as useSidebarState,xt as utils};
+import{Accordion as f}from"./components/accordion/Accordion.js";import{ActionIcon as a}from"./components/action-icon/ActionIcon.js";import{AlertDialog as n}from"./components/alert-dialog/AlertDialog.js";import{AlertProvider as s,useAlert as u}from"./components/alert-dialog/alert-context/AlertContext.js";import{Avatar as T}from"./components/avatar/Avatar.js";import{Badge as S}from"./components/badge/Badge.js";import{BannerRegular as C}from"./components/banner/banner-regular/BannerRegular.js";import{BannerSlim as h}from"./components/banner/banner-slim/BannerSlim.js";import{Box as I}from"./components/box/Box.js";import{Button as k,StyledButton as G}from"./components/button/Button.js";import{Carousel as w,useCarousel as y}from"./components/carousel/Carousel.js";import{Checkbox as A}from"./components/checkbox/Checkbox.js";import{CheckboxGroup as N}from"./components/checkbox-group/CheckboxGroup.js";import{CheckboxTree as L}from"./components/checkbox-tree/CheckboxTree.js";import{CheckboxField as W}from"./components/checkbox-field/CheckboxField.js";import{Chip as E}from"./components/chip/Chip.js";import{ChipGroup as K}from"./components/chip/ChipGroup.js";import{ChipDismissibleGroup as q}from"./components/chip-dismissible-group/index.js";import{ChipToggleGroup as J}from"./components/chip-toggle-group/index.js";import{Combobox as U}from"./components/combobox/Combobox.js";import{CreatePasswordField as Y}from"./components/create-password-field/CreatePasswordField.js";import{useDataTable as _}from"./components/data-table/DataTableContext.js";import{DataTable as oo}from"./components/data-table/DataTable.js";import{DateField as eo}from"./components/date-field/DateField.js";import{DateInput as po}from"./components/date-input/DateInput.js";import{Dialog as xo}from"./components/dialog/Dialog.js";import{Dismissible as io}from"./components/dismissible/index.js";import{DismissibleGroup as lo}from"./components/dismissible-group/index.js";import{Divider as so}from"./components/divider/Divider.js";import{Drawer as co}from"./components/drawer/Drawer.js";import{DropdownMenu as go}from"./components/dropdown-menu/DropdownMenu.js";import{EmptyState as bo}from"./components/empty-state/EmptyState.js";import{FieldWrapper as Fo}from"./components/field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as Bo}from"./components/field-wrapper/InlineFieldWrapper.js";import{FileInput as Do}from"./components/file-input/FileInput.js";import{Flex as Go}from"./components/flex/Flex.js";import{Form as wo}from"./components/form/Form.js";import"dlv";import"react-hook-form";import{Grid as Po}from"./components/grid/Grid.js";import{Heading as Mo}from"./components/heading/Heading.js";import{Icon as Ro}from"./components/icon/Icon.js";import{Image as Vo}from"./components/image/Image.js";import{InlineMessage as Oo}from"./components/inline-message/InlineMessage.js";import{Input as Ho,InputBackground as Ko,InputText as jo}from"./components/input/Input.js";import{InputField as zo}from"./components/input-field/InputField.js";import{Label as Qo}from"./components/label/Label.js";import{Link as Xo,StyledLink as Yo}from"./components/link/Link.js";import{List as _o}from"./components/list/List.js";import{Loader as or}from"./components/loader/Loader.js";import{MarkdownContent as er}from"./components/markdown-content/MarkdownContent.js";import{NavigationMenu as pr}from"./components/navigation/NavigationMenu.js";import{NavigationMenuVertical as xr}from"./components/navigation-menu-vertical/NavigationMenuVertical.js";import{NotificationBadge as ir}from"./components/notification-badge/NotificationBadge.js";import{NumberInput as lr}from"./components/number-input/NumberInput.js";import{NumberInputField as dr}from"./components/number-input-field/NumberInputField.js";import{Pagination as ur}from"./components/pagination/Pagination.js";import{PasswordField as Tr}from"./components/password-field/PasswordField.js";import{PasswordInput as Sr}from"./components/password-input/PasswordInput.js";import{Popover as Cr}from"./components/popover/Popover.js";import{ProgressBar as hr}from"./components/progress-bar/ProgressBar.js";import{RadioButton as Ir}from"./components/radio-button/RadioButton.js";import{RadioButtonGroup as kr}from"./components/radio-button/RadioButtonGroup.js";import{RadioButtonField as vr}from"./components/radio-button-field/RadioButtonField.js";import{RadioCard as yr}from"./components/radio-card/RadioCard.js";import{RadioCardGroup as Ar}from"./components/radio-card/RadioCardGroup.js";import{SearchField as Nr}from"./components/search-field/SearchField.js";import{SearchInput as Lr}from"./components/search-input/SearchInput.js";import{SectionMessage as Wr}from"./components/section-message/SectionMessage.js";import{Select as Er}from"./components/select/Select.js";import{SelectField as Kr}from"./components/select-field/SelectField.js";import{SideBar as qr}from"./components/side-bar/SideBar.js";import{useSidebarState as Jr}from"./components/side-bar/SideBarContext.js";import{Slider as Ur}from"./components/slider/Slider.js";import{SliderField as Yr}from"./components/slider-field/SliderField.js";import{Sortable as _r}from"./components/sortable/index.js";import{Spacer as oe}from"./components/spacer/Spacer.js";import{Stepper as ee}from"./components/stepper/Stepper.js";import{Switch as pe}from"./components/switch/Switch.js";import{Table as xe}from"./components/table/Table.js";import{Tabs as ie}from"./components/tabs/Tabs.js";import{Text as le}from"./components/text/Text.js";import{Textarea as de}from"./components/textarea/Textarea.js";import{TextareaField as ue}from"./components/textarea-field/TextareaField.js";import{Tile as Te}from"./components/tile/Tile.js";import{TileGroup as Se}from"./components/tile/TileGroup.js";import{TileInteractive as Ce}from"./components/tile-interactive/TileInteractive.js";import{TileToggleGroup as he}from"./components/tile-toggle-group/index.js";import{Toast as Ie}from"./components/toast/Toast.js";import{ToastProvider as ke}from"./components/toast/ToastProvider.js";import{ToggleGroup as ve}from"./components/toggle-group/index.js";import{Tooltip as ye}from"./components/tooltip/Tooltip.js";import{TopBar as Ae}from"./components/top-bar/TopBar.js";import{Tree as Ne}from"./components/tree/Tree.js";import{Video as Le}from"./components/video/Video.js";import{KeyboardShortcut as We}from"./components/keyboard-shortcut/index.js";import{SegmentedControl as Ee}from"./components/segmented-control/SegmentedControl.js";import{FileDrop as Ke}from"./components/file-drop/FileDrop.js";import{useFileDrop as qe}from"./components/file-drop/useFileDrop.js";import{createTheme as Je,css as Qe,getCssText as Ue,globalCss as Xe,keyframes as Ye,media as Ze,styled as _e,theme as $e,utils as ot}from"./stitches.js";import{ColorScheme as et}from"./experiments/color-scheme/ColorScheme.js";import{createThemeVariants as pt}from"./utilities/create-theme-variants/createThemeVariants.js";import"./utilities/css-wrapper/CSSWrapper.js";import{NoOverflowWrapper as xt,noOverflowStyleBlock as ft}from"./utilities/no-overflow-wrapper/NoOverflowWrapper.js";import"color2k";import{focusVisibleStyleBlock as at}from"./utilities/style/focus-visible-style-block.js";import"./utilities/style/keyframe-animations.js";import{default as nt}from"react-hot-toast";export{f as Accordion,a as ActionIcon,n as AlertDialog,s as AlertProvider,T as Avatar,S as Badge,C as BannerRegular,h as BannerSlim,I as Box,k as Button,w as Carousel,A as Checkbox,W as CheckboxField,N as CheckboxGroup,L as CheckboxTree,E as Chip,q as ChipDismissibleGroup,K as ChipGroup,J as ChipToggleGroup,et as ColorScheme,U as Combobox,Y as CreatePasswordField,oo as DataTable,eo as DateField,po as DateInput,xo as Dialog,io as Dismissible,lo as DismissibleGroup,so as Divider,co as Drawer,go as DropdownMenu,bo as EmptyState,Fo as FieldWrapper,Ke as FileDrop,Do as FileInput,Go as Flex,wo as Form,Po as Grid,Mo as Heading,Ro as Icon,Vo as Image,Bo as InlineFieldWrapper,Oo as InlineMessage,Ho as Input,Ko as InputBackground,zo as InputField,jo as InputText,We as KeyboardShortcut,Qo as Label,Xo as Link,_o as List,or as Loader,er as MarkdownContent,pr as NavigationMenu,xr as NavigationMenuVertical,xt as NoOverflowWrapper,ir as NotificationBadge,lr as NumberInput,dr as NumberInputField,ur as Pagination,Tr as PasswordField,Sr as PasswordInput,Cr as Popover,hr as ProgressBar,Ir as RadioButton,vr as RadioButtonField,kr as RadioButtonGroup,yr as RadioCard,Ar as RadioCardGroup,Nr as SearchField,Lr as SearchInput,Wr as SectionMessage,Ee as SegmentedControl,Er as Select,Kr as SelectField,qr as SideBar,Ur as Slider,Yr as SliderField,_r as Sortable,oe as Spacer,ee as Stepper,G as StyledButton,Yo as StyledLink,pe as Switch,xe as Table,ie as Tabs,le as Text,de as Textarea,ue as TextareaField,Te as Tile,Se as TileGroup,Ce as TileInteractive,he as TileToggleGroup,Ie as Toast,ke as ToastProvider,ve as ToggleGroup,ye as Tooltip,Ae as TopBar,Ne as Tree,Le as Video,Je as createTheme,pt as createThemeVariants,Qe as css,at as focusVisibleStyleBlock,Ue as getCssText,Xe as globalCss,Ye as keyframes,Ze as media,ft as noOverflowStyleBlock,_e as styled,$e as theme,nt as toast,u as useAlert,y as useCarousel,_ as useDataTable,qe as useFileDrop,Jr as useSidebarState,ot as utils};
 //# sourceMappingURL=index.js.map

package/package.json

@@ -4,7 +4,7 @@
   "main": "dist/index.cjs.js",
   "typings": "dist/index.d.ts",
   "module": "dist/index.js",
-  "version": "5.2.0-beta.1",
+  "version": "5.2.0",
   "description": "",
   "files": [
     "dist"
@@ -60,7 +60,7 @@
   "devDependencies": {
     "@atom-learning/icons": "1.20.0",
     "@atom-learning/jest-stitches": "1.0.10",
-    "@atom-learning/theme": "^4.0.0",
+    "@atom-learning/theme": "^5.0.0",
     "@commitlint/cli": "^11.0.0",
     "@commitlint/config-conventional": "^11.0.0",
     "@radix-ui/react-id": "1.0.1",
@@ -129,7 +129,7 @@
   },
   "peerDependencies": {
     "@atom-learning/icons": "^1.0.0",
-    "@atom-learning/theme": "^4",
+    "@atom-learning/theme": "^5",
     "react": "^17 || ^18 || ^19",
     "react-dom": "^17 || ^18 || ^19"
   },

package/dist/components/scrollable-container/ScrollableContainer.context.d.ts

@@ -1,23 +0,0 @@
-import * as React from 'react';
-export interface IScrollableContainerContext {
-    hasProvider: boolean;
-    scrollableContainer?: HTMLDivElement | null;
-    hasScrollYAxis: boolean;
-    hasScrolledYAxis: boolean;
-    hasScrolledToEndYAxis: boolean;
-    hasScrollXAxis: boolean;
-    hasScrolledXAxis: boolean;
-    hasScrolledToEndXAxis: boolean;
-    scrollProgressYAxis: number;
-    scrollbarWidthYAxis: number;
-    scrollProgressXAxis: number;
-    scrollbarWidthXAxis: number;
-    scrollableEl?: HTMLElement | null;
-    setScrollableEl?: (HTMLElement: any) => void;
-    containerEl?: HTMLElement | null;
-    setContainerEl?: (HTMLElement: any) => void;
-}
-export declare const ScrollableContainerContext: React.Context<IScrollableContainerContext>;
-export declare const ScrollableContainerProvider: ({ children }: {
-    children: React.ReactNode;
-}) => React.JSX.Element;

package/dist/components/scrollable-container/ScrollableContainer.context.js

@@ -1,2 +0,0 @@
-import*as s from"react";import{useCallbackRefState as X}from"../../utilities/hooks/useCallbackRef.js";import{useResizeObserver as H}from"../../utilities/hooks/useResizeObserver.js";const Y=s.createContext({hasProvider:!1,hasScrollYAxis:!1,hasScrolledYAxis:!1,hasScrolledToEndYAxis:!1,hasScrollXAxis:!1,hasScrolledXAxis:!1,hasScrolledToEndXAxis:!1,scrollProgressYAxis:0,scrollbarWidthYAxis:0,scrollProgressXAxis:0,scrollbarWidthXAxis:0}),v=({children:W})=>{const[l,o]=X(),[e,i]=X(),[t,g]=s.useState(!1),[c,T]=s.useState(!1),[a,b]=s.useState(0),[h,u]=s.useState(0);H({delay:0,elements:[e,l],onResize:()=>{!l||!e||(g(l.scrollHeight>l.clientHeight),T(l.scrollWidth>l.clientWidth),b(e.clientHeight-l.clientHeight),u(e.clientWidth-l.clientWidth))}});const[{hasScrolledYAxis:d,hasScrolledToEndYAxis:n,hasScrolledXAxis:x,hasScrolledToEndXAxis:S},m]=s.useState({hasScrolledYAxis:!1,hasScrolledToEndYAxis:!1,hasScrolledXAxis:!1,hasScrolledToEndXAxis:!1}),A=(()=>!l||l.scrollHeight<=l.clientHeight?0:l.scrollTop/(l.scrollHeight-l.clientHeight))(),E=(()=>!l||l.scrollWidth<=l.clientWidth?0:l.scrollLeft/(l.scrollWidth-l.clientWidth))();s.useEffect(()=>{if(!l)return;const r=()=>{m({hasScrolledYAxis:!!l.scrollTop,hasScrolledToEndYAxis:Math.abs(l.scrollHeight-l.clientHeight-l.scrollTop)<1,hasScrolledXAxis:!!l.scrollLeft,hasScrolledToEndXAxis:Math.abs(l.scrollWidth-l.clientWidth-l.scrollLeft)<1})};return r(),l.addEventListener("scroll",r),()=>{l.removeEventListener("scroll",r)}},[l]);const f=s.useMemo(()=>({hasProvider:!0,hasScrollYAxis:t,hasScrolledYAxis:d,hasScrolledToEndYAxis:n,scrollProgressYAxis:A,scrollbarWidthYAxis:a,hasScrollXAxis:c,hasScrolledXAxis:x,hasScrolledToEndXAxis:S,scrollProgressXAxis:E,scrollbarWidthXAxis:h,scrollableEl:l,setScrollableEl:o,containerEl:e,setContainerEl:i}),[t,d,n,A,a,c,x,S,E,h,l,o,e,i]);return s.createElement(Y.Provider,{value:f},W)};export{Y as ScrollableContainerContext,v as ScrollableContainerProvider};
-//# sourceMappingURL=ScrollableContainer.context.js.map

package/dist/components/scrollable-container/ScrollableContainer.context.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ScrollableContainer.context.js","sources":["../../../src/components/scrollable-container/ScrollableContainer.context.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { useResizeObserver } from '~/utilities/hooks/useResizeObserver'\n\nexport interface IScrollableContainerContext {\n  hasProvider: boolean\n  scrollableContainer?: HTMLDivElement | null\n  hasScrollYAxis: boolean\n  hasScrolledYAxis: boolean\n  hasScrolledToEndYAxis: boolean\n  hasScrollXAxis: boolean\n  hasScrolledXAxis: boolean\n  hasScrolledToEndXAxis: boolean\n  scrollProgressYAxis: number\n  scrollbarWidthYAxis: number\n  scrollProgressXAxis: number\n  scrollbarWidthXAxis: number\n  scrollableEl?: HTMLElement | null\n  setScrollableEl?: (HTMLElement) => void\n  containerEl?: HTMLElement | null\n  setContainerEl?: (HTMLElement) => void\n}\n\nexport const ScrollableContainerContext = React.createContext<IScrollableContainerContext>({\n  hasProvider: false,\n  hasScrollYAxis: false,\n  hasScrolledYAxis: false,\n  hasScrolledToEndYAxis: false,\n  hasScrollXAxis: false,\n  hasScrolledXAxis: false,\n  hasScrolledToEndXAxis: false,\n  scrollProgressYAxis: 0,\n  scrollbarWidthYAxis: 0,\n  scrollProgressXAxis: 0,\n  scrollbarWidthXAxis: 0\n})\n\nexport const ScrollableContainerProvider = ({ children }: { children: React.ReactNode }) => {\n  const [scrollableEl, setScrollableEl] = useCallbackRefState()\n  const [containerEl, setContainerEl] = useCallbackRefState()\n\n  const [hasScrollYAxis, setHasScrollYAxis] = React.useState<boolean>(false)\n  const [hasScrollXAxis, setHasScrollXAxis] = React.useState<boolean>(false)\n  const [scrollbarWidthYAxis, setScrollbarWidthYAxis] = React.useState<number>(0)\n  const [scrollbarWidthXAxis, setScrollbarWidthXAxis] = React.useState<number>(0)\n\n  useResizeObserver({\n    delay: 0,\n    elements: [containerEl, scrollableEl],\n    onResize: () => {\n      if (!scrollableEl) return\n      if (!containerEl) return\n      setHasScrollYAxis(scrollableEl.scrollHeight > scrollableEl.clientHeight)\n      setHasScrollXAxis(scrollableEl.scrollWidth > scrollableEl.clientWidth)\n      setScrollbarWidthYAxis(containerEl.clientHeight - scrollableEl.clientHeight)\n      setScrollbarWidthXAxis(containerEl.clientWidth - scrollableEl.clientWidth)\n    }\n  })\n\n  const [{ hasScrolledYAxis, hasScrolledToEndYAxis, hasScrolledXAxis, hasScrolledToEndXAxis }, setScrollState] = React.useState<{\n    hasScrolledYAxis: boolean\n    hasScrolledToEndYAxis: boolean\n    hasScrolledXAxis: boolean\n    hasScrolledToEndXAxis: boolean\n  }>({ hasScrolledYAxis: false, hasScrolledToEndYAxis: false, hasScrolledXAxis: false, hasScrolledToEndXAxis: false })\n\n  /** A number between 0-1 for the relative amount of pixels scrolled */\n  const scrollProgressYAxis = (() => {\n    if (!scrollableEl) return 0\n    if (scrollableEl.scrollHeight <= scrollableEl.clientHeight) return 0\n    return scrollableEl.scrollTop / (scrollableEl.scrollHeight - scrollableEl.clientHeight)\n  })()\n\n  const scrollProgressXAxis = (() => {\n    if (!scrollableEl) return 0\n    if (scrollableEl.scrollWidth <= scrollableEl.clientWidth) return 0\n    return scrollableEl.scrollLeft / (scrollableEl.scrollWidth - scrollableEl.clientWidth)\n  })()\n\n  React.useEffect(() => {\n    if (!scrollableEl) return\n    const updateScrollState = () => {\n      setScrollState({\n        hasScrolledYAxis: !!scrollableEl.scrollTop,\n        hasScrolledToEndYAxis:\n          Math.abs(scrollableEl.scrollHeight - scrollableEl.clientHeight - scrollableEl.scrollTop) <\n          1,\n        hasScrolledXAxis: !!scrollableEl.scrollLeft,\n        hasScrolledToEndXAxis:\n          Math.abs(scrollableEl.scrollWidth - scrollableEl.clientWidth - scrollableEl.scrollLeft) <\n          1\n      })\n    }\n    updateScrollState()\n\n    scrollableEl.addEventListener('scroll', updateScrollState)\n\n    return () => {\n      scrollableEl.removeEventListener('scroll', updateScrollState)\n    }\n  }, [scrollableEl])\n\n  const value = React.useMemo<IScrollableContainerContext>(\n    () => ({\n      hasProvider: true,\n      hasScrollYAxis,\n      hasScrolledYAxis,\n      hasScrolledToEndYAxis,\n      scrollProgressYAxis,\n      scrollbarWidthYAxis,\n      hasScrollXAxis,\n      hasScrolledXAxis,\n      hasScrolledToEndXAxis,\n      scrollProgressXAxis,\n      scrollbarWidthXAxis,\n      scrollableEl,\n      setScrollableEl,\n      containerEl,\n      setContainerEl\n    }),\n    [\n      hasScrollYAxis,\n      hasScrolledYAxis,\n      hasScrolledToEndYAxis,\n      scrollProgressYAxis,\n      scrollbarWidthYAxis,\n      hasScrollXAxis,\n      hasScrolledXAxis,\n      hasScrolledToEndXAxis,\n      scrollProgressXAxis,\n      scrollbarWidthXAxis,\n      scrollableEl,\n      setScrollableEl,\n      containerEl,\n      setContainerEl\n    ]\n  )\n\n  return <ScrollableContainerContext.Provider value={value}>{children}</ScrollableContainerContext.Provider>\n}\n"],"names":["ScrollableContainerContext","React","ScrollableContainerProvider","children","scrollableEl","setScrollableEl","useCallbackRefState","containerEl","setContainerEl","hasScrollYAxis","setHasScrollYAxis","hasScrollXAxis","setHasScrollXAxis","scrollbarWidthYAxis","setScrollbarWidthYAxis","scrollbarWidthXAxis","setScrollbarWidthXAxis","useResizeObserver","hasScrolledYAxis","hasScrolledToEndYAxis","hasScrolledXAxis","hasScrolledToEndXAxis","setScrollState","scrollProgressYAxis","scrollProgressXAxis","updateScrollState","value"],"mappings":"2LAuBaA,EAA6BC,EAAM,cAA2C,CACzF,YAAa,GACb,eAAgB,GAChB,iBAAkB,GAClB,sBAAuB,GACvB,eAAgB,GAChB,iBAAkB,GAClB,sBAAuB,GACvB,oBAAqB,EACrB,oBAAqB,EACrB,oBAAqB,EACrB,oBAAqB,CACvB,CAAC,EAEYC,EAA8B,CAAC,CAAE,SAAAC,CAAS,IAAqC,CAC1F,KAAM,CAACC,EAAcC,CAAe,EAAIC,EAClC,EAAA,CAACC,EAAaC,CAAc,EAAIF,EAAoB,EAEpD,CAACG,EAAgBC,CAAiB,EAAIT,EAAM,SAAkB,EAAK,EACnE,CAACU,EAAgBC,CAAiB,EAAIX,EAAM,SAAkB,EAAK,EACnE,CAACY,EAAqBC,CAAsB,EAAIb,EAAM,SAAiB,CAAC,EACxE,CAACc,EAAqBC,CAAsB,EAAIf,EAAM,SAAiB,CAAC,EAE9EgB,EAAkB,CAChB,MAAO,EACP,SAAU,CAACV,EAAaH,CAAY,EACpC,SAAU,IAAM,CACV,CAACA,GACD,CAACG,IACLG,EAAkBN,EAAa,aAAeA,EAAa,YAAY,EACvEQ,EAAkBR,EAAa,YAAcA,EAAa,WAAW,EACrEU,EAAuBP,EAAY,aAAeH,EAAa,YAAY,EAC3EY,EAAuBT,EAAY,YAAcH,EAAa,WAAW,EAC3E,CACF,CAAC,EAED,KAAM,CAAC,CAAE,iBAAAc,EAAkB,sBAAAC,EAAuB,iBAAAC,EAAkB,sBAAAC,CAAsB,EAAGC,CAAc,EAAIrB,EAAM,SAKlH,CAAE,iBAAkB,GAAO,sBAAuB,GAAO,iBAAkB,GAAO,sBAAuB,EAAM,CAAC,EAG7GsB,GAAuB,IACvB,CAACnB,GACDA,EAAa,cAAgBA,EAAa,aAAqB,EAC5DA,EAAa,WAAaA,EAAa,aAAeA,EAAa,iBAGtEoB,GAAuB,IACvB,CAACpB,GACDA,EAAa,aAAeA,EAAa,YAAoB,EAC1DA,EAAa,YAAcA,EAAa,YAAcA,EAAa,cACzE,EAEHH,EAAM,UAAU,IAAM,CACpB,GAAI,CAACG,EAAc,OACnB,MAAMqB,EAAoB,IAAM,CAC9BH,EAAe,CACb,iBAAkB,CAAC,CAAClB,EAAa,UACjC,sBACE,KAAK,IAAIA,EAAa,aAAeA,EAAa,aAAeA,EAAa,SAAS,EACvF,EACF,iBAAkB,CAAC,CAACA,EAAa,WACjC,sBACE,KAAK,IAAIA,EAAa,YAAcA,EAAa,YAAcA,EAAa,UAAU,EACtF,CACJ,CAAC,CACH,EACA,OAAAqB,EAAkB,EAElBrB,EAAa,iBAAiB,SAAUqB,CAAiB,EAElD,IAAM,CACXrB,EAAa,oBAAoB,SAAUqB,CAAiB,CAC9D,CACF,EAAG,CAACrB,CAAY,CAAC,EAEjB,MAAMsB,EAAQzB,EAAM,QAClB,KAAO,CACL,YAAa,GACb,eAAAQ,EACA,iBAAAS,EACA,sBAAAC,EACA,oBAAAI,EACA,oBAAAV,EACA,eAAAF,EACA,iBAAAS,EACA,sBAAAC,EACA,oBAAAG,EACA,oBAAAT,EACA,aAAAX,EACA,gBAAAC,EACA,YAAAE,EACA,eAAAC,CACF,GACA,CACEC,EACAS,EACAC,EACAI,EACAV,EACAF,EACAS,EACAC,EACAG,EACAT,EACAX,EACAC,EACAE,EACAC,CACF,CACF,EAEA,OAAOP,EAAA,cAACD,EAA2B,SAA3B,CAAoC,MAAO0B,CAAAA,EAAQvB,CAAS,CACtE"}