@uselets/ui 1.15.0 → 1.16.1

package/README.md

@@ -406,6 +406,8 @@ Each module exports its public composition parts and prop types from the same im
 
 Layout primitives follow the same pattern: `Stack`, `Group`, and `Flex` support `gap: 'xs' | 'sm' | 'md' | 'lg' | 'xl'`, mapping to `4/8/16/24/32px`, plus typed `align: 'start' | 'end' | 'center' | 'baseline' | 'stretch'` and `justify: 'start' | 'end' | 'center' | 'between' | 'around' | 'evenly'` props; `Group` also supports `wrap` (and defaults `align` to `center`); `Flex` additionally supports typed `direction` and `wrap`; `Center` supports `size: 'xs' | 'sm' | 'md' | 'lg' | 'xl'` and `direction: 'horizontal' | 'vertical'`; and `Container` supports `size: 'sm' | 'md' | 'lg' | 'full'`. `SimpleGrid`, `Grid`, and `GridItem` accept direct layout values; use `useBreakpointValue` to derive responsive values when needed. `HiddenFrom` and `VisibleFrom` provide breakpoint-based visibility wrappers.
 
+`Pagination` highlights the current page and keeps the other links neutral. Its `color` prop (`UIColor`, default `primary`) controls only the current page's color. `PaginationLink`/`PaginationPrevious`/`PaginationNext` also accept `color` individually, but the value set on `Pagination` wins whenever it's provided.
+
 Public hooks are exported from the package root and from the `@uselets/ui/hooks/*` namespace:
 
 - `useBreakpoint` from `@uselets/ui/hooks/use-breakpoint`
@@ -429,7 +431,7 @@ const cols = useBreakpointValue({ base: 1, md: 2, lg: 3 }) ?? 1
 return <SimpleGrid cols={cols} gap="md" />
 ```
 
-`useLocalStorage` returns a tuple like `useState`, persists values as JSON, and syncs changes between browser tabs by default:
+`useLocalStorage` returns a tuple like `useState`, persists values as JSON, and syncs changes between browser tabs and between other instances using the same key in the same tab by default:
 
 ```tsx
 const [settings, setSettings] = useLocalStorage('settings', {

package/dist/components/pagination.d.ts

@@ -2,7 +2,7 @@ import { n as __name } from "../rolldown-runtime-Bdj-bS2b.js";
 import { Button } from "./button.js";
 import * as React from "react";
 //#region src/components/pagination.d.ts
-type PaginationProps = React.ComponentProps<'nav'>;
+type PaginationProps = React.ComponentProps<'nav'> & Pick<React.ComponentProps<typeof Button>, 'color'>;
 type PaginationContentProps = React.ComponentProps<'ul'>;
 type PaginationItemProps = React.ComponentProps<'li'>;
 type PaginationLinkProps = {
@@ -15,7 +15,7 @@ type PaginationNextProps = React.ComponentProps<typeof PaginationLink> & {
   text?: string;
 };
 type PaginationEllipsisProps = React.ComponentProps<'span'>;
-declare function Pagination({ className, ...props }: PaginationProps): React.JSX.Element;
+declare function Pagination({ className, color, children, ...props }: PaginationProps): React.JSX.Element;
 declare function PaginationContent({ className, ...props }: PaginationContentProps): React.JSX.Element;
 declare function PaginationItem({ ...props }: PaginationItemProps): React.JSX.Element;
 declare function PaginationLink({ className, isActive, size, color, ...props }: PaginationLinkProps): React.JSX.Element;

package/dist/components/pagination.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-Bdj-bS2b.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{IconChevronLeft as n,IconChevronRight as r,IconDots as i}from"@tabler/icons-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";function Pagination({className:t,...n}){return a(`nav`,{"aria-label":`pagination`,"data-slot":`pagination`,className:e(`mx-auto flex w-full justify-center`,t),...n})}function PaginationContent({className:t,...n}){return a(`ul`,{"data-slot":`pagination-content`,className:e(`flex items-center gap-0.5`,t),...n})}function PaginationItem({...e}){return a(`li`,{"data-slot":`pagination-item`,...e})}function PaginationLink({className:n,isActive:r,size:i=`icon`,color:o=`zinc`,...s}){return a(t,{asChild:!0,variant:r?`outline`:`ghost`,color:o,size:i,className:e(n),children:a(`a`,{"aria-current":r?`page`:void 0,"data-slot":`pagination-link`,"data-active":r,...s})})}function PaginationPrevious({className:t,text:r=`Previous`,...i}){return o(PaginationLink,{"aria-label":`Go to previous page`,size:`md`,className:e(`pl-1.5!`,t),...i,children:[a(n,{"data-icon":`inline-start`}),a(`span`,{className:`hidden sm:block`,children:r})]})}function PaginationNext({className:t,text:n=`Next`,...i}){return o(PaginationLink,{"aria-label":`Go to next page`,size:`md`,className:e(`pr-1.5!`,t),...i,children:[a(`span`,{className:`hidden sm:block`,children:n}),a(r,{"data-icon":`inline-end`})]})}function PaginationEllipsis({className:t,...n}){return o(`span`,{"aria-hidden":!0,"data-slot":`pagination-ellipsis`,className:e(`flex size-8 items-center justify-center [&_svg:not([class*='size-'])]:size-4`,t),...n,children:[a(i,{}),a(`span`,{className:`sr-only`,children:`More pages`})]})}export{Pagination,PaginationContent,PaginationEllipsis,PaginationItem,PaginationLink,PaginationNext,PaginationPrevious};
+import"../rolldown-runtime-Bdj-bS2b.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{IconChevronLeft as n,IconChevronRight as r,IconDots as i}from"@tabler/icons-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import*as s from"react";const c=s.createContext({color:`primary`});function Pagination({className:t,color:n,children:r,...i}){return a(c.Provider,{value:{color:n},children:a(`nav`,{"aria-label":`pagination`,"data-slot":`pagination`,"data-color":n,className:e(`mx-auto flex w-full justify-center`,t),...i,children:r})})}function PaginationContent({className:t,...n}){return a(`ul`,{"data-slot":`pagination-content`,className:e(`flex items-center gap-0.5`,t),...n})}function PaginationItem({...e}){return a(`li`,{"data-slot":`pagination-item`,...e})}function PaginationLink({className:n,isActive:r,size:i=`icon`,color:o=`primary`,...l}){let u=s.useContext(c);return a(t,{asChild:!0,variant:r?`solid`:`secondary`,color:u.color||o,size:i,className:e(n),children:a(`a`,{"aria-current":r?`page`:void 0,"data-slot":`pagination-link`,"data-active":r,...l})})}function PaginationPrevious({className:t,text:r=``,...i}){return o(PaginationLink,{"aria-label":`Go to previous page`,size:r?`md`:`icon`,className:e(r&&`pl-1.5!`,t),...i,children:[a(n,{"data-icon":`inline-start`}),r&&a(`span`,{className:`hidden sm:block`,children:r})]})}function PaginationNext({className:t,text:n=``,...i}){return o(PaginationLink,{"aria-label":`Go to next page`,size:n?`md`:`icon`,className:e(n&&`pr-1.5!`,t),...i,children:[n&&a(`span`,{className:`hidden sm:block`,children:n}),a(r,{"data-icon":`inline-end`})]})}function PaginationEllipsis({className:t,...n}){return o(`span`,{"aria-hidden":!0,"data-slot":`pagination-ellipsis`,className:e(`flex size-8 items-center justify-center [&_svg:not([class*='size-'])]:size-4`,t),...n,children:[a(i,{}),a(`span`,{className:`sr-only`,children:`More pages`})]})}export{Pagination,PaginationContent,PaginationEllipsis,PaginationItem,PaginationLink,PaginationNext,PaginationPrevious};
 //# sourceMappingURL=pagination.js.map

package/dist/components/pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.js","names":[],"sources":["../../src/components/pagination.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { IconChevronLeft, IconChevronRight, IconDots } from '@tabler/icons-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\n\nexport type PaginationProps = React.ComponentProps<'nav'>\n\nexport type PaginationContentProps = React.ComponentProps<'ul'>\n\nexport type PaginationItemProps = React.ComponentProps<'li'>\n\nexport type PaginationLinkProps = {\n  isActive?: boolean\n} & Pick<React.ComponentProps<typeof Button>, 'size' | 'color'> &\n  React.ComponentProps<'a'>\n\nexport type PaginationPreviousProps = React.ComponentProps<typeof PaginationLink> & {\n  text?: string\n}\n\nexport type PaginationNextProps = React.ComponentProps<typeof PaginationLink> & {\n  text?: string\n}\n\nexport type PaginationEllipsisProps = React.ComponentProps<'span'>\n\nfunction Pagination({ className, ...props }: PaginationProps) {\n  return (\n    <nav\n      aria-label=\"pagination\"\n      data-slot=\"pagination\"\n      className={cn('mx-auto flex w-full justify-center', className)}\n      {...props}\n    />\n  )\n}\n\nfunction PaginationContent({ className, ...props }: PaginationContentProps) {\n  return <ul data-slot=\"pagination-content\" className={cn('flex items-center gap-0.5', className)} {...props} />\n}\n\nfunction PaginationItem({ ...props }: PaginationItemProps) {\n  return <li data-slot=\"pagination-item\" {...props} />\n}\n\nfunction PaginationLink({ className, isActive, size = 'icon', color = 'zinc', ...props }: PaginationLinkProps) {\n  return (\n    <Button asChild variant={isActive ? 'outline' : 'ghost'} color={color} size={size} className={cn(className)}>\n      <a aria-current={isActive ? 'page' : undefined} data-slot=\"pagination-link\" data-active={isActive} {...props} />\n    </Button>\n  )\n}\n\nfunction PaginationPrevious({ className, text = 'Previous', ...props }: PaginationPreviousProps) {\n  return (\n    <PaginationLink aria-label=\"Go to previous page\" size=\"md\" className={cn('pl-1.5!', className)} {...props}>\n      <IconChevronLeft data-icon=\"inline-start\" />\n      <span className=\"hidden sm:block\">{text}</span>\n    </PaginationLink>\n  )\n}\n\nfunction PaginationNext({ className, text = 'Next', ...props }: PaginationNextProps) {\n  return (\n    <PaginationLink aria-label=\"Go to next page\" size=\"md\" className={cn('pr-1.5!', className)} {...props}>\n      <span className=\"hidden sm:block\">{text}</span>\n      <IconChevronRight data-icon=\"inline-end\" />\n    </PaginationLink>\n  )\n}\n\nfunction PaginationEllipsis({ className, ...props }: PaginationEllipsisProps) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\"flex size-8 items-center justify-center [&_svg:not([class*='size-'])]:size-4\", className)}\n      {...props}\n    >\n      <IconDots />\n      <span className=\"sr-only\">More pages</span>\n    </span>\n  )\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  PaginationNext,\n  PaginationPrevious\n}\n"],"mappings":"8PA4BA,SAAS,WAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAD,CACE,aAAW,aACX,YAAU,aACV,UAAW,EAAG,qCAAsC,CAAS,EAC7D,GAAI,CACL,CAAA,CAEL,CAEA,SAAS,kBAAkB,CAAE,YAAW,GAAG,GAAiC,CAC1E,OAAO,EAAC,KAAD,CAAI,YAAU,qBAAqB,UAAW,EAAG,4BAA6B,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC/G,CAEA,SAAS,eAAe,CAAE,GAAG,GAA8B,CACzD,OAAO,EAAC,KAAD,CAAI,YAAU,kBAAkB,GAAI,CAAQ,CAAA,CACrD,CAEA,SAAS,eAAe,CAAE,YAAW,WAAU,OAAO,OAAQ,QAAQ,OAAQ,GAAG,GAA8B,CAC7G,OACE,EAAC,EAAD,CAAQ,QAAA,GAAQ,QAAS,EAAW,UAAY,QAAgB,QAAa,OAAM,UAAW,EAAG,CAAS,EACxG,SAAA,EAAC,IAAD,CAAG,eAAc,EAAW,OAAS,IAAA,GAAW,YAAU,kBAAkB,cAAa,EAAU,GAAI,CAAQ,CAAA,CACzG,CAAA,CAEZ,CAEA,SAAS,mBAAmB,CAAE,YAAW,OAAO,WAAY,GAAG,GAAkC,CAC/F,OACE,EAAC,eAAD,CAAgB,aAAW,sBAAsB,KAAK,KAAK,UAAW,EAAG,UAAW,CAAS,EAAG,GAAI,EAApG,SAAA,CACE,EAAC,EAAD,CAAiB,YAAU,cAAgB,CAAA,EAC3C,EAAC,OAAD,CAAM,UAAU,kBAAmB,SAAA,CAAW,CAAA,CAChC,GAEpB,CAEA,SAAS,eAAe,CAAE,YAAW,OAAO,OAAQ,GAAG,GAA8B,CACnF,OACE,EAAC,eAAD,CAAgB,aAAW,kBAAkB,KAAK,KAAK,UAAW,EAAG,UAAW,CAAS,EAAG,GAAI,EAAhG,SAAA,CACE,EAAC,OAAD,CAAM,UAAU,kBAAmB,SAAA,CAAW,CAAA,EAC9C,EAAC,EAAD,CAAkB,YAAU,YAAc,CAAA,CAC5B,GAEpB,CAEA,SAAS,mBAAmB,CAAE,YAAW,GAAG,GAAkC,CAC5E,OACE,EAAC,OAAD,CACE,cAAA,GACA,YAAU,sBACV,UAAW,EAAG,+EAAgF,CAAS,EACvG,GAAI,EAJN,SAAA,CAME,EAAC,EAAD,CAAW,CAAA,EACX,EAAC,OAAD,CAAM,UAAU,UAAU,SAAA,YAAgB,CAAA,CACtC,GAEV"}
+{"version":3,"file":"pagination.js","names":[],"sources":["../../src/components/pagination.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { IconChevronLeft, IconChevronRight, IconDots } from '@tabler/icons-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\n\nconst PaginationContext = React.createContext<Pick<React.ComponentProps<typeof Button>, 'color'>>({\n  color: 'primary'\n})\n\nexport type PaginationProps = React.ComponentProps<'nav'> & Pick<React.ComponentProps<typeof Button>, 'color'>\n\nexport type PaginationContentProps = React.ComponentProps<'ul'>\n\nexport type PaginationItemProps = React.ComponentProps<'li'>\n\nexport type PaginationLinkProps = {\n  isActive?: boolean\n} & Pick<React.ComponentProps<typeof Button>, 'size' | 'color'> &\n  React.ComponentProps<'a'>\n\nexport type PaginationPreviousProps = React.ComponentProps<typeof PaginationLink> & {\n  text?: string\n}\n\nexport type PaginationNextProps = React.ComponentProps<typeof PaginationLink> & {\n  text?: string\n}\n\nexport type PaginationEllipsisProps = React.ComponentProps<'span'>\n\nfunction Pagination({ className, color, children, ...props }: PaginationProps) {\n  return (\n    <PaginationContext.Provider value={{ color }}>\n      <nav\n        aria-label=\"pagination\"\n        data-slot=\"pagination\"\n        data-color={color}\n        className={cn('mx-auto flex w-full justify-center', className)}\n        {...props}\n      >\n        {children}\n      </nav>\n    </PaginationContext.Provider>\n  )\n}\n\nfunction PaginationContent({ className, ...props }: PaginationContentProps) {\n  return <ul data-slot=\"pagination-content\" className={cn('flex items-center gap-0.5', className)} {...props} />\n}\n\nfunction PaginationItem({ ...props }: PaginationItemProps) {\n  return <li data-slot=\"pagination-item\" {...props} />\n}\n\nfunction PaginationLink({ className, isActive, size = 'icon', color = 'primary', ...props }: PaginationLinkProps) {\n  const context = React.useContext(PaginationContext)\n\n  return (\n    <Button\n      asChild\n      variant={isActive ? 'solid' : 'secondary'}\n      color={context.color || color}\n      size={size}\n      className={cn(className)}\n    >\n      <a aria-current={isActive ? 'page' : undefined} data-slot=\"pagination-link\" data-active={isActive} {...props} />\n    </Button>\n  )\n}\n\nfunction PaginationPrevious({ className, text = '', ...props }: PaginationPreviousProps) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to previous page\"\n      size={text ? 'md' : 'icon'}\n      className={cn(text && 'pl-1.5!', className)}\n      {...props}\n    >\n      <IconChevronLeft data-icon=\"inline-start\" />\n      {text && <span className=\"hidden sm:block\">{text}</span>}\n    </PaginationLink>\n  )\n}\n\nfunction PaginationNext({ className, text = '', ...props }: PaginationNextProps) {\n  return (\n    <PaginationLink\n      aria-label=\"Go to next page\"\n      size={text ? 'md' : 'icon'}\n      className={cn(text && 'pr-1.5!', className)}\n      {...props}\n    >\n      {text && <span className=\"hidden sm:block\">{text}</span>}\n      <IconChevronRight data-icon=\"inline-end\" />\n    </PaginationLink>\n  )\n}\n\nfunction PaginationEllipsis({ className, ...props }: PaginationEllipsisProps) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\"flex size-8 items-center justify-center [&_svg:not([class*='size-'])]:size-4\", className)}\n      {...props}\n    >\n      <IconDots />\n      <span className=\"sr-only\">More pages</span>\n    </span>\n  )\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  PaginationNext,\n  PaginationPrevious\n}\n"],"mappings":"sRAOA,MAAM,EAAoB,EAAM,cAAkE,CAChG,MAAO,SACT,CAAC,EAuBD,SAAS,WAAW,CAAE,YAAW,QAAO,WAAU,GAAG,GAA0B,CAC7E,OACE,EAAC,EAAkB,SAAnB,CAA4B,MAAO,CAAE,OAAM,EACzC,SAAA,EAAC,MAAD,CACE,aAAW,aACX,YAAU,aACV,aAAY,EACZ,UAAW,EAAG,qCAAsC,CAAS,EAC7D,GAAI,EAEH,UACE,CAAA,CACqB,CAAA,CAEhC,CAEA,SAAS,kBAAkB,CAAE,YAAW,GAAG,GAAiC,CAC1E,OAAO,EAAC,KAAD,CAAI,YAAU,qBAAqB,UAAW,EAAG,4BAA6B,CAAS,EAAG,GAAI,CAAQ,CAAA,CAC/G,CAEA,SAAS,eAAe,CAAE,GAAG,GAA8B,CACzD,OAAO,EAAC,KAAD,CAAI,YAAU,kBAAkB,GAAI,CAAQ,CAAA,CACrD,CAEA,SAAS,eAAe,CAAE,YAAW,WAAU,OAAO,OAAQ,QAAQ,UAAW,GAAG,GAA8B,CAChH,IAAM,EAAU,EAAM,WAAW,CAAiB,EAElD,OACE,EAAC,EAAD,CACE,QAAA,GACA,QAAS,EAAW,QAAU,YAC9B,MAAO,EAAQ,OAAS,EAClB,OACN,UAAW,EAAG,CAAS,EAEvB,SAAA,EAAC,IAAD,CAAG,eAAc,EAAW,OAAS,IAAA,GAAW,YAAU,kBAAkB,cAAa,EAAU,GAAI,CAAQ,CAAA,CACzG,CAAA,CAEZ,CAEA,SAAS,mBAAmB,CAAE,YAAW,OAAO,GAAI,GAAG,GAAkC,CACvF,OACE,EAAC,eAAD,CACE,aAAW,sBACX,KAAM,EAAO,KAAO,OACpB,UAAW,EAAG,GAAQ,UAAW,CAAS,EAC1C,GAAI,EAJN,SAAA,CAME,EAAC,EAAD,CAAiB,YAAU,cAAgB,CAAA,EAC1C,GAAQ,EAAC,OAAD,CAAM,UAAU,kBAAmB,SAAA,CAAW,CAAA,CACzC,GAEpB,CAEA,SAAS,eAAe,CAAE,YAAW,OAAO,GAAI,GAAG,GAA8B,CAC/E,OACE,EAAC,eAAD,CACE,aAAW,kBACX,KAAM,EAAO,KAAO,OACpB,UAAW,EAAG,GAAQ,UAAW,CAAS,EAC1C,GAAI,EAJN,SAAA,CAMG,GAAQ,EAAC,OAAD,CAAM,UAAU,kBAAmB,SAAA,CAAW,CAAA,EACvD,EAAC,EAAD,CAAkB,YAAU,YAAc,CAAA,CAC5B,GAEpB,CAEA,SAAS,mBAAmB,CAAE,YAAW,GAAG,GAAkC,CAC5E,OACE,EAAC,OAAD,CACE,cAAA,GACA,YAAU,sBACV,UAAW,EAAG,+EAAgF,CAAS,EACvG,GAAI,EAJN,SAAA,CAME,EAAC,EAAD,CAAW,CAAA,EACX,EAAC,OAAD,CAAM,UAAU,UAAU,SAAA,YAAgB,CAAA,CACtC,GAEV"}

package/dist/hooks/use-local-storage.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-Bdj-bS2b.js";import{useCallback as e,useEffect as t,useRef as n,useState as r}from"react";function parseStorageValue(e){try{return JSON.parse(e)}catch{return e}}function readStorageValue(e,t){if(typeof window>`u`)return t;try{let n=window.localStorage.getItem(e);return n===null?t:parseStorageValue(n)}catch{return t}}function writeStorageValue(e,t){if(!(typeof window>`u`))try{window.localStorage.setItem(e,String(JSON.stringify(t)))}catch{}}function useLocalStorage(i,a={}){let{defaultValue:o,sync:s=!0}=a,c=n(o),[l,u]=r(()=>readStorageValue(i,o)),d=n(l);c.current=o,d.current=l;let f=e(e=>{let t=typeof e==`function`?e(d.current):e;d.current=t,writeStorageValue(i,t),u(t)},[i]);return t(()=>{if(!s||typeof window>`u`)return;let handleStorage=e=>{if(e.storageArea!==window.localStorage||e.key!==i)return;let t=e.newValue===null?c.current:parseStorageValue(e.newValue);d.current=t,u(t)};return window.addEventListener(`storage`,handleStorage),()=>window.removeEventListener(`storage`,handleStorage)},[i,s]),[l,f]}export{useLocalStorage};
+import"../rolldown-runtime-Bdj-bS2b.js";import{useCallback as e,useEffect as t,useRef as n,useState as r}from"react";const i=`uselets-ui:local-storage`;function parseStorageValue(e){try{return JSON.parse(e)}catch{return e}}function readStorageValue(e,t){if(typeof window>`u`)return t;try{let n=window.localStorage.getItem(e);return n===null?t:parseStorageValue(n)}catch{return t}}function writeStorageValue(e,t){if(!(typeof window>`u`)){try{window.localStorage.setItem(e,String(JSON.stringify(t)))}catch{}window.dispatchEvent(new CustomEvent(i,{detail:{key:e,value:t}}))}}function useLocalStorage(a,o={}){let{defaultValue:s,sync:c=!0}=o,l=n(s),[u,d]=r(()=>readStorageValue(a,s)),f=n(u);l.current=s,f.current=u;let p=e(e=>{let t=typeof e==`function`?e(f.current):e;f.current=t,writeStorageValue(a,t),d(t)},[a]);return t(()=>{if(!c||typeof window>`u`)return;let handleStorage=e=>{if(e.storageArea!==window.localStorage||e.key!==a)return;let t=e.newValue===null?l.current:parseStorageValue(e.newValue);f.current=t,d(t)},handleLocalStorageEvent=e=>{let{key:t,value:n}=e.detail;t===a&&(f.current=n,d(n))};return window.addEventListener(`storage`,handleStorage),window.addEventListener(i,handleLocalStorageEvent),()=>{window.removeEventListener(`storage`,handleStorage),window.removeEventListener(i,handleLocalStorageEvent)}},[a,c]),[u,p]}export{useLocalStorage};
 //# sourceMappingURL=use-local-storage.js.map

package/dist/hooks/use-local-storage.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-local-storage.js","names":[],"sources":["../../src/hooks/use-local-storage.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\n\nexport type UseLocalStorageOptions<T> = {\n  defaultValue?: T\n  sync?: boolean\n}\n\nfunction parseStorageValue<T>(value: string) {\n  try {\n    return JSON.parse(value) as T\n  } catch {\n    return value as T\n  }\n}\n\nfunction readStorageValue<T>(key: string, defaultValue: T | undefined) {\n  if (typeof window === 'undefined') {\n    return defaultValue\n  }\n\n  try {\n    const item = window.localStorage.getItem(key)\n\n    if (item === null) {\n      return defaultValue\n    }\n\n    return parseStorageValue<T>(item)\n  } catch {\n    return defaultValue\n  }\n}\n\nfunction writeStorageValue<T>(key: string, value: T) {\n  if (typeof window === 'undefined') {\n    return\n  }\n\n  try {\n    window.localStorage.setItem(key, String(JSON.stringify(value)))\n  } catch {}\n}\n\nexport function useLocalStorage<T>(\n  key: string,\n  options: UseLocalStorageOptions<T> & { defaultValue: T }\n): [T, React.Dispatch<React.SetStateAction<T>>]\n\nexport function useLocalStorage<T = undefined>(\n  key: string,\n  options?: UseLocalStorageOptions<T>\n): [T | undefined, React.Dispatch<React.SetStateAction<T | undefined>>]\n\nexport function useLocalStorage<T>(key: string, options: UseLocalStorageOptions<T> = {}) {\n  const { defaultValue, sync = true } = options\n  const defaultValueRef = useRef(defaultValue)\n  const [storedValue, setStoredValue] = useState<T | undefined>(() => readStorageValue<T>(key, defaultValue))\n  const storedValueRef = useRef(storedValue)\n\n  defaultValueRef.current = defaultValue\n  storedValueRef.current = storedValue\n\n  const setValue = useCallback<React.Dispatch<React.SetStateAction<T | undefined>>>(\n    (value) => {\n      const nextValue =\n        typeof value === 'function'\n          ? (value as (previousValue: T | undefined) => T | undefined)(storedValueRef.current)\n          : value\n\n      storedValueRef.current = nextValue\n      writeStorageValue(key, nextValue)\n      setStoredValue(nextValue)\n    },\n    [key]\n  )\n\n  useEffect(() => {\n    if (!sync || typeof window === 'undefined') {\n      return\n    }\n\n    const handleStorage = (event: StorageEvent) => {\n      if (event.storageArea !== window.localStorage || event.key !== key) {\n        return\n      }\n\n      const nextValue = event.newValue === null ? defaultValueRef.current : parseStorageValue<T>(event.newValue)\n\n      storedValueRef.current = nextValue\n      setStoredValue(nextValue)\n    }\n\n    window.addEventListener('storage', handleStorage)\n\n    return () => window.removeEventListener('storage', handleStorage)\n  }, [key, sync])\n\n  return [storedValue, setValue]\n}\n\nexport namespace useLocalStorage {\n  export type Options<T> = UseLocalStorageOptions<T>\n}\n"],"mappings":"qHAOA,SAAS,kBAAqB,EAAe,CAC3C,GAAI,CACF,OAAO,KAAK,MAAM,CAAK,CACzB,MAAQ,CACN,OAAO,CACT,CACF,CAEA,SAAS,iBAAoB,EAAa,EAA6B,CACrE,GAAI,OAAO,OAAW,IACpB,OAAO,EAGT,GAAI,CACF,IAAM,EAAO,OAAO,aAAa,QAAQ,CAAG,EAM5C,OAJI,IAAS,KACJ,EAGF,kBAAqB,CAAI,CAClC,MAAQ,CACN,OAAO,CACT,CACF,CAEA,SAAS,kBAAqB,EAAa,EAAU,CAC/C,YAAO,OAAW,KAItB,GAAI,CACF,OAAO,aAAa,QAAQ,EAAK,OAAO,KAAK,UAAU,CAAK,CAAC,CAAC,CAChE,MAAQ,CAAC,CACX,CAYA,SAAgB,gBAAmB,EAAa,EAAqC,CAAC,EAAG,CACvF,GAAM,CAAE,eAAc,OAAO,IAAS,EAChC,EAAkB,EAAO,CAAY,EACrC,CAAC,EAAa,GAAkB,MAA8B,iBAAoB,EAAK,CAAY,CAAC,EACpG,EAAiB,EAAO,CAAW,EAEzC,EAAgB,QAAU,EAC1B,EAAe,QAAU,EAEzB,IAAM,EAAW,EACd,GAAU,CACT,IAAM,EACJ,OAAO,GAAU,WACZ,EAA0D,EAAe,OAAO,EACjF,EAEN,EAAe,QAAU,EACzB,kBAAkB,EAAK,CAAS,EAChC,EAAe,CAAS,CAC1B,EACA,CAAC,CAAG,CACN,EAuBA,OArBA,MAAgB,CACd,GAAI,CAAC,GAAQ,OAAO,OAAW,IAC7B,OAGF,IAAM,cAAiB,GAAwB,CAC7C,GAAI,EAAM,cAAgB,OAAO,cAAgB,EAAM,MAAQ,EAC7D,OAGF,IAAM,EAAY,EAAM,WAAa,KAAO,EAAgB,QAAU,kBAAqB,EAAM,QAAQ,EAEzG,EAAe,QAAU,EACzB,EAAe,CAAS,CAC1B,EAIA,OAFA,OAAO,iBAAiB,UAAW,aAAa,MAEnC,OAAO,oBAAoB,UAAW,aAAa,CAClE,EAAG,CAAC,EAAK,CAAI,CAAC,EAEP,CAAC,EAAa,CAAQ,CAC/B"}
+{"version":3,"file":"use-local-storage.js","names":[],"sources":["../../src/hooks/use-local-storage.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\n\nexport type UseLocalStorageOptions<T> = {\n  defaultValue?: T\n  sync?: boolean\n}\n\ntype LocalStorageEventDetail<T> = {\n  key: string\n  value: T | undefined\n}\n\nconst LOCAL_STORAGE_EVENT = 'uselets-ui:local-storage'\n\nfunction parseStorageValue<T>(value: string) {\n  try {\n    return JSON.parse(value) as T\n  } catch {\n    return value as T\n  }\n}\n\nfunction readStorageValue<T>(key: string, defaultValue: T | undefined) {\n  if (typeof window === 'undefined') {\n    return defaultValue\n  }\n\n  try {\n    const item = window.localStorage.getItem(key)\n\n    if (item === null) {\n      return defaultValue\n    }\n\n    return parseStorageValue<T>(item)\n  } catch {\n    return defaultValue\n  }\n}\n\nfunction writeStorageValue<T>(key: string, value: T) {\n  if (typeof window === 'undefined') {\n    return\n  }\n\n  try {\n    window.localStorage.setItem(key, String(JSON.stringify(value)))\n  } catch {}\n\n  window.dispatchEvent(new CustomEvent<LocalStorageEventDetail<T>>(LOCAL_STORAGE_EVENT, { detail: { key, value } }))\n}\n\nexport function useLocalStorage<T>(\n  key: string,\n  options: UseLocalStorageOptions<T> & { defaultValue: T }\n): [T, React.Dispatch<React.SetStateAction<T>>]\n\nexport function useLocalStorage<T = undefined>(\n  key: string,\n  options?: UseLocalStorageOptions<T>\n): [T | undefined, React.Dispatch<React.SetStateAction<T | undefined>>]\n\nexport function useLocalStorage<T>(key: string, options: UseLocalStorageOptions<T> = {}) {\n  const { defaultValue, sync = true } = options\n  const defaultValueRef = useRef(defaultValue)\n  const [storedValue, setStoredValue] = useState<T | undefined>(() => readStorageValue<T>(key, defaultValue))\n  const storedValueRef = useRef(storedValue)\n\n  defaultValueRef.current = defaultValue\n  storedValueRef.current = storedValue\n\n  const setValue = useCallback<React.Dispatch<React.SetStateAction<T | undefined>>>(\n    (value) => {\n      const nextValue =\n        typeof value === 'function'\n          ? (value as (previousValue: T | undefined) => T | undefined)(storedValueRef.current)\n          : value\n\n      storedValueRef.current = nextValue\n      writeStorageValue(key, nextValue)\n      setStoredValue(nextValue)\n    },\n    [key]\n  )\n\n  useEffect(() => {\n    if (!sync || typeof window === 'undefined') {\n      return\n    }\n\n    const handleStorage = (event: StorageEvent) => {\n      if (event.storageArea !== window.localStorage || event.key !== key) {\n        return\n      }\n\n      const nextValue = event.newValue === null ? defaultValueRef.current : parseStorageValue<T>(event.newValue)\n\n      storedValueRef.current = nextValue\n      setStoredValue(nextValue)\n    }\n\n    const handleLocalStorageEvent = (event: Event) => {\n      const { key: eventKey, value } = (event as CustomEvent<LocalStorageEventDetail<T>>).detail\n\n      if (eventKey !== key) {\n        return\n      }\n\n      storedValueRef.current = value\n      setStoredValue(value)\n    }\n\n    window.addEventListener('storage', handleStorage)\n    window.addEventListener(LOCAL_STORAGE_EVENT, handleLocalStorageEvent)\n\n    return () => {\n      window.removeEventListener('storage', handleStorage)\n      window.removeEventListener(LOCAL_STORAGE_EVENT, handleLocalStorageEvent)\n    }\n  }, [key, sync])\n\n  return [storedValue, setValue]\n}\n\nexport namespace useLocalStorage {\n  export type Options<T> = UseLocalStorageOptions<T>\n}\n"],"mappings":"qHAYA,MAAM,EAAsB,2BAE5B,SAAS,kBAAqB,EAAe,CAC3C,GAAI,CACF,OAAO,KAAK,MAAM,CAAK,CACzB,MAAQ,CACN,OAAO,CACT,CACF,CAEA,SAAS,iBAAoB,EAAa,EAA6B,CACrE,GAAI,OAAO,OAAW,IACpB,OAAO,EAGT,GAAI,CACF,IAAM,EAAO,OAAO,aAAa,QAAQ,CAAG,EAM5C,OAJI,IAAS,KACJ,EAGF,kBAAqB,CAAI,CAClC,MAAQ,CACN,OAAO,CACT,CACF,CAEA,SAAS,kBAAqB,EAAa,EAAU,CAC/C,YAAO,OAAW,KAItB,IAAI,CACF,OAAO,aAAa,QAAQ,EAAK,OAAO,KAAK,UAAU,CAAK,CAAC,CAAC,CAChE,MAAQ,CAAC,CAET,OAAO,cAAc,IAAI,YAAwC,EAAqB,CAAE,OAAQ,CAAE,MAAK,OAAM,CAAE,CAAC,CAAC,CAFxG,CAGX,CAYA,SAAgB,gBAAmB,EAAa,EAAqC,CAAC,EAAG,CACvF,GAAM,CAAE,eAAc,OAAO,IAAS,EAChC,EAAkB,EAAO,CAAY,EACrC,CAAC,EAAa,GAAkB,MAA8B,iBAAoB,EAAK,CAAY,CAAC,EACpG,EAAiB,EAAO,CAAW,EAEzC,EAAgB,QAAU,EAC1B,EAAe,QAAU,EAEzB,IAAM,EAAW,EACd,GAAU,CACT,IAAM,EACJ,OAAO,GAAU,WACZ,EAA0D,EAAe,OAAO,EACjF,EAEN,EAAe,QAAU,EACzB,kBAAkB,EAAK,CAAS,EAChC,EAAe,CAAS,CAC1B,EACA,CAAC,CAAG,CACN,EAsCA,OApCA,MAAgB,CACd,GAAI,CAAC,GAAQ,OAAO,OAAW,IAC7B,OAGF,IAAM,cAAiB,GAAwB,CAC7C,GAAI,EAAM,cAAgB,OAAO,cAAgB,EAAM,MAAQ,EAC7D,OAGF,IAAM,EAAY,EAAM,WAAa,KAAO,EAAgB,QAAU,kBAAqB,EAAM,QAAQ,EAEzG,EAAe,QAAU,EACzB,EAAe,CAAS,CAC1B,EAEM,wBAA2B,GAAiB,CAChD,GAAM,CAAE,IAAK,EAAU,SAAW,EAAkD,OAEhF,IAAa,IAIjB,EAAe,QAAU,EACzB,EAAe,CAAK,EACtB,EAKA,OAHA,OAAO,iBAAiB,UAAW,aAAa,EAChD,OAAO,iBAAiB,EAAqB,uBAAuB,MAEvD,CACX,OAAO,oBAAoB,UAAW,aAAa,EACnD,OAAO,oBAAoB,EAAqB,uBAAuB,CACzE,CACF,EAAG,CAAC,EAAK,CAAI,CAAC,EAEP,CAAC,EAAa,CAAQ,CAC/B"}

package/dist/hooks/use-local-storage.spec.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-Bdj-bS2b.js";import{useLocalStorage as e}from"./use-local-storage.js";import{i as t,t as n}from"../react.esm-D5AipFQb.js";describe(`useLocalStorage`,()=>{it(`returns the default value when storage is empty`,()=>{let{result:n}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));expect(n.current[0]).toEqual({compact:!1})}),it(`reads an existing JSON value from localStorage`,()=>{window.localStorage.setItem(`settings`,JSON.stringify({compact:!0}));let{result:n}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));expect(n.current[0]).toEqual({compact:!0})}),it(`writes serialized values to localStorage`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));n(()=>r.current[1]({compact:!0})),expect(r.current[0]).toEqual({compact:!0}),expect(window.localStorage.getItem(`settings`)).toBe(JSON.stringify({compact:!0}))}),it(`supports functional updates`,()=>{let{result:r}=t(()=>e(`count`,{defaultValue:1}));n(()=>r.current[1](e=>e+1)),expect(r.current[0]).toBe(2),expect(window.localStorage.getItem(`count`)).toBe(`2`)}),it(`syncs updates from storage events for the same key`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));n(()=>{window.dispatchEvent(new StorageEvent(`storage`,{key:`settings`,newValue:JSON.stringify({compact:!0}),storageArea:window.localStorage}))}),expect(r.current[0]).toEqual({compact:!0})}),it(`ignores storage events for other keys`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));n(()=>{window.dispatchEvent(new StorageEvent(`storage`,{key:`profile`,newValue:JSON.stringify({compact:!0}),storageArea:window.localStorage}))}),expect(r.current[0]).toEqual({compact:!1})}),it(`does not subscribe to storage events when sync is disabled`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1},sync:!1}));n(()=>{window.dispatchEvent(new StorageEvent(`storage`,{key:`settings`,newValue:JSON.stringify({compact:!0}),storageArea:window.localStorage}))}),expect(r.current[0]).toEqual({compact:!1})})});
+import"../rolldown-runtime-Bdj-bS2b.js";import{useLocalStorage as e}from"./use-local-storage.js";import{i as t,t as n}from"../react.esm-D5AipFQb.js";describe(`useLocalStorage`,()=>{it(`returns the default value when storage is empty`,()=>{let{result:n}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));expect(n.current[0]).toEqual({compact:!1})}),it(`reads an existing JSON value from localStorage`,()=>{window.localStorage.setItem(`settings`,JSON.stringify({compact:!0}));let{result:n}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));expect(n.current[0]).toEqual({compact:!0})}),it(`writes serialized values to localStorage`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));n(()=>r.current[1]({compact:!0})),expect(r.current[0]).toEqual({compact:!0}),expect(window.localStorage.getItem(`settings`)).toBe(JSON.stringify({compact:!0}))}),it(`supports functional updates`,()=>{let{result:r}=t(()=>e(`count`,{defaultValue:1}));n(()=>r.current[1](e=>e+1)),expect(r.current[0]).toBe(2),expect(window.localStorage.getItem(`count`)).toBe(`2`)}),it(`syncs updates from storage events for the same key`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));n(()=>{window.dispatchEvent(new StorageEvent(`storage`,{key:`settings`,newValue:JSON.stringify({compact:!0}),storageArea:window.localStorage}))}),expect(r.current[0]).toEqual({compact:!0})}),it(`ignores storage events for other keys`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1}}));n(()=>{window.dispatchEvent(new StorageEvent(`storage`,{key:`profile`,newValue:JSON.stringify({compact:!0}),storageArea:window.localStorage}))}),expect(r.current[0]).toEqual({compact:!1})}),it(`syncs updates between two instances using the same key in the same tab`,()=>{let r=t(()=>e(`settings`,{defaultValue:{compact:!1}})),i=t(()=>e(`settings`,{defaultValue:{compact:!1}}));n(()=>r.result.current[1]({compact:!0})),expect(r.result.current[0]).toEqual({compact:!0}),expect(i.result.current[0]).toEqual({compact:!0})}),it(`does not subscribe to storage events when sync is disabled`,()=>{let{result:r}=t(()=>e(`settings`,{defaultValue:{compact:!1},sync:!1}));n(()=>{window.dispatchEvent(new StorageEvent(`storage`,{key:`settings`,newValue:JSON.stringify({compact:!0}),storageArea:window.localStorage}))}),expect(r.current[0]).toEqual({compact:!1})})});
 //# sourceMappingURL=use-local-storage.spec.js.map

package/dist/hooks/use-local-storage.spec.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-local-storage.spec.js","names":[],"sources":["../../src/hooks/use-local-storage.spec.ts"],"sourcesContent":["import { act, renderHook } from '@testing-library/react'\n\nimport { useLocalStorage } from './use-local-storage'\n\ndescribe('useLocalStorage', () => {\n  it('returns the default value when storage is empty', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    expect(result.current[0]).toEqual({ compact: false })\n  })\n\n  it('reads an existing JSON value from localStorage', () => {\n    window.localStorage.setItem('settings', JSON.stringify({ compact: true }))\n\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    expect(result.current[0]).toEqual({ compact: true })\n  })\n\n  it('writes serialized values to localStorage', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    act(() => result.current[1]({ compact: true }))\n\n    expect(result.current[0]).toEqual({ compact: true })\n    expect(window.localStorage.getItem('settings')).toBe(JSON.stringify({ compact: true }))\n  })\n\n  it('supports functional updates', () => {\n    const { result } = renderHook(() => useLocalStorage('count', { defaultValue: 1 }))\n\n    act(() => result.current[1]((current) => current + 1))\n\n    expect(result.current[0]).toBe(2)\n    expect(window.localStorage.getItem('count')).toBe('2')\n  })\n\n  it('syncs updates from storage events for the same key', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    act(() => {\n      window.dispatchEvent(\n        new StorageEvent('storage', {\n          key: 'settings',\n          newValue: JSON.stringify({ compact: true }),\n          storageArea: window.localStorage\n        })\n      )\n    })\n\n    expect(result.current[0]).toEqual({ compact: true })\n  })\n\n  it('ignores storage events for other keys', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    act(() => {\n      window.dispatchEvent(\n        new StorageEvent('storage', {\n          key: 'profile',\n          newValue: JSON.stringify({ compact: true }),\n          storageArea: window.localStorage\n        })\n      )\n    })\n\n    expect(result.current[0]).toEqual({ compact: false })\n  })\n\n  it('does not subscribe to storage events when sync is disabled', () => {\n    const { result } = renderHook(() =>\n      useLocalStorage('settings', {\n        defaultValue: { compact: false },\n        sync: false\n      })\n    )\n\n    act(() => {\n      window.dispatchEvent(\n        new StorageEvent('storage', {\n          key: 'settings',\n          newValue: JSON.stringify({ compact: true }),\n          storageArea: window.localStorage\n        })\n      )\n    })\n\n    expect(result.current[0]).toEqual({ compact: false })\n  })\n})\n"],"mappings":"qJAIA,SAAS,sBAAyB,CAChC,GAAG,sDAAyD,CAC1D,GAAM,CAAE,UAAW,MAAiB,EAAgB,WAAY,CAAE,aAAc,CAAE,QAAS,EAAM,CAAE,CAAC,CAAC,EAErG,OAAO,EAAO,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAE,QAAS,EAAM,CAAC,CACtD,CAAC,EAED,GAAG,qDAAwD,CACzD,OAAO,aAAa,QAAQ,WAAY,KAAK,UAAU,CAAE,QAAS,EAAK,CAAC,CAAC,EAEzE,GAAM,CAAE,UAAW,MAAiB,EAAgB,WAAY,CAAE,aAAc,CAAE,QAAS,EAAM,CAAE,CAAC,CAAC,EAErG,OAAO,EAAO,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAE,QAAS,EAAK,CAAC,CACrD,CAAC,EAED,GAAG,+CAAkD,CACnD,GAAM,CAAE,UAAW,MAAiB,EAAgB,WAAY,CAAE,aAAc,CAAE,QAAS,EAAM,CAAE,CAAC,CAAC,EAErG,MAAU,EAAO,QAAQ,EAAE,CAAC,CAAE,QAAS,EAAK,CAAC,CAAC,EAE9C,OAAO,EAAO,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAE,QAAS,EAAK,CAAC,EACnD,OAAO,OAAO,aAAa,QAAQ,UAAU,CAAC,CAAC,CAAC,KAAK,KAAK,UAAU,CAAE,QAAS,EAAK,CAAC,CAAC,CACxF,CAAC,EAED,GAAG,kCAAqC,CACtC,GAAM,CAAE,UAAW,MAAiB,EAAgB,QAAS,CAAE,aAAc,CAAE,CAAC,CAAC,EAEjF,MAAU,EAAO,QAAQ,EAAE,CAAE,GAAY,EAAU,CAAC,CAAC,EAErD,OAAO,EAAO,QAAQ,EAAE,CAAC,CAAC,KAAK,CAAC,EAChC,OAAO,OAAO,aAAa,QAAQ,OAAO,CAAC,CAAC,CAAC,KAAK,GAAG,CACvD,CAAC,EAED,GAAG,yDAA4D,CAC7D,GAAM,CAAE,UAAW,MAAiB,EAAgB,WAAY,CAAE,aAAc,CAAE,QAAS,EAAM,CAAE,CAAC,CAAC,EAErG,MAAU,CACR,OAAO,cACL,IAAI,aAAa,UAAW,CAC1B,IAAK,WACL,SAAU,KAAK,UAAU,CAAE,QAAS,EAAK,CAAC,EAC1C,YAAa,OAAO,YACtB,CAAC,CACH,CACF,CAAC,EAED,OAAO,EAAO,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAE,QAAS,EAAK,CAAC,CACrD,CAAC,EAED,GAAG,4CAA+C,CAChD,GAAM,CAAE,UAAW,MAAiB,EAAgB,WAAY,CAAE,aAAc,CAAE,QAAS,EAAM,CAAE,CAAC,CAAC,EAErG,MAAU,CACR,OAAO,cACL,IAAI,aAAa,UAAW,CAC1B,IAAK,UACL,SAAU,KAAK,UAAU,CAAE,QAAS,EAAK,CAAC,EAC1C,YAAa,OAAO,YACtB,CAAC,CACH,CACF,CAAC,EAED,OAAO,EAAO,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAE,QAAS,EAAM,CAAC,CACtD,CAAC,EAED,GAAG,iEAAoE,CACrE,GAAM,CAAE,UAAW,MACjB,EAAgB,WAAY,CAC1B,aAAc,CAAE,QAAS,EAAM,EAC/B,KAAM,EACR,CAAC,CACH,EAEA,MAAU,CACR,OAAO,cACL,IAAI,aAAa,UAAW,CAC1B,IAAK,WACL,SAAU,KAAK,UAAU,CAAE,QAAS,EAAK,CAAC,EAC1C,YAAa,OAAO,YACtB,CAAC,CACH,CACF,CAAC,EAED,OAAO,EAAO,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAE,QAAS,EAAM,CAAC,CACtD,CAAC,CACH,CAAC"}
+{"version":3,"file":"use-local-storage.spec.js","names":[],"sources":["../../src/hooks/use-local-storage.spec.ts"],"sourcesContent":["import { act, renderHook } from '@testing-library/react'\n\nimport { useLocalStorage } from './use-local-storage'\n\ndescribe('useLocalStorage', () => {\n  it('returns the default value when storage is empty', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    expect(result.current[0]).toEqual({ compact: false })\n  })\n\n  it('reads an existing JSON value from localStorage', () => {\n    window.localStorage.setItem('settings', JSON.stringify({ compact: true }))\n\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    expect(result.current[0]).toEqual({ compact: true })\n  })\n\n  it('writes serialized values to localStorage', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    act(() => result.current[1]({ compact: true }))\n\n    expect(result.current[0]).toEqual({ compact: true })\n    expect(window.localStorage.getItem('settings')).toBe(JSON.stringify({ compact: true }))\n  })\n\n  it('supports functional updates', () => {\n    const { result } = renderHook(() => useLocalStorage('count', { defaultValue: 1 }))\n\n    act(() => result.current[1]((current) => current + 1))\n\n    expect(result.current[0]).toBe(2)\n    expect(window.localStorage.getItem('count')).toBe('2')\n  })\n\n  it('syncs updates from storage events for the same key', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    act(() => {\n      window.dispatchEvent(\n        new StorageEvent('storage', {\n          key: 'settings',\n          newValue: JSON.stringify({ compact: true }),\n          storageArea: window.localStorage\n        })\n      )\n    })\n\n    expect(result.current[0]).toEqual({ compact: true })\n  })\n\n  it('ignores storage events for other keys', () => {\n    const { result } = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    act(() => {\n      window.dispatchEvent(\n        new StorageEvent('storage', {\n          key: 'profile',\n          newValue: JSON.stringify({ compact: true }),\n          storageArea: window.localStorage\n        })\n      )\n    })\n\n    expect(result.current[0]).toEqual({ compact: false })\n  })\n\n  it('syncs updates between two instances using the same key in the same tab', () => {\n    const first = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n    const second = renderHook(() => useLocalStorage('settings', { defaultValue: { compact: false } }))\n\n    act(() => first.result.current[1]({ compact: true }))\n\n    expect(first.result.current[0]).toEqual({ compact: true })\n    expect(second.result.current[0]).toEqual({ compact: true })\n  })\n\n  it('does not subscribe to storage events when sync is disabled', () => {\n    const { result } = renderHook(() =>\n      useLocalStorage('settings', {\n        defaultValue: { compact: false },\n        sync: false\n      })\n    )\n\n    act(() => {\n      window.dispatchEvent(\n        new StorageEvent('storage', {\n          key: 'settings',\n          newValue: JSON.stringify({ compact: true }),\n          storageArea: window.localStorage\n        })\n      )\n    })\n\n    expect(result.current[0]).toEqual({ compact: false })\n  })\n})\n"],"mappings":"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"}

package/dist/skills/uselets-ui/references/component-catalog.md

@@ -222,6 +222,7 @@ Unless noted otherwise, each module also exports its public `*Props` types from
   - Exports: `NavigationMenu`, `NavigationMenuList`, `NavigationMenuItem`, `NavigationMenuContent`, `NavigationMenuTrigger`, `NavigationMenuLink`, `NavigationMenuIndicator`, `NavigationMenuViewport`, `navigationMenuTriggerStyle`
 - `pagination`
   - Exports: `Pagination`, `PaginationContent`, `PaginationEllipsis`, `PaginationItem`, `PaginationLink`, `PaginationNext`, `PaginationPrevious`
+  - Notes: `Pagination` highlights the current page and keeps other links neutral. `Pagination.color` (a `UIColor`, default `primary`) controls only the current page's color. Each `PaginationLink`/`PaginationPrevious`/`PaginationNext` can still pass its own `color`, but `Pagination`'s wins when set.
 - `sidebar`
   - Exports: `Sidebar`, `SidebarContent`, `SidebarFooter`, `SidebarGroup`, `SidebarGroupAction`, `SidebarGroupContent`, `SidebarGroupLabel`, `SidebarHeader`, `SidebarInput`, `SidebarInset`, `SidebarMenu`, `SidebarMenuAction`, `SidebarMenuBadge`, `SidebarMenuButton`, `SidebarMenuItem`, `SidebarMenuSkeleton`, `SidebarMenuSub`, `SidebarMenuSubButton`, `SidebarMenuSubItem`, `SidebarProvider`, `SidebarRail`, `SidebarSeparator`, `SidebarTrigger`, `useSidebar`
 - `stepper`

package/dist/skills/uselets-ui/references/package-guide.md

@@ -189,7 +189,7 @@ const [draft, setDraft] = useLocalStorage('draft', {
 })
 ```
 
-It stores values with `JSON.stringify`, reads with `JSON.parse` with string fallback, and synchronizes changes from other browser tabs unless `sync` is set to `false`.
+It stores values with `JSON.stringify`, reads with `JSON.parse` with string fallback, and synchronizes changes both from other browser tabs and from other instances using the same key in the same tab, unless `sync` is set to `false`.
 
 ## Package-wide wrappers and providers
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uselets/ui",
-  "version": "1.15.0",
+  "version": "1.16.1",
   "type": "module",
   "private": false,
   "description": "React component library for the LET'S design system.",

package/skills/uselets-ui/references/component-catalog.md

@@ -222,6 +222,7 @@ Unless noted otherwise, each module also exports its public `*Props` types from
   - Exports: `NavigationMenu`, `NavigationMenuList`, `NavigationMenuItem`, `NavigationMenuContent`, `NavigationMenuTrigger`, `NavigationMenuLink`, `NavigationMenuIndicator`, `NavigationMenuViewport`, `navigationMenuTriggerStyle`
 - `pagination`
   - Exports: `Pagination`, `PaginationContent`, `PaginationEllipsis`, `PaginationItem`, `PaginationLink`, `PaginationNext`, `PaginationPrevious`
+  - Notes: `Pagination` highlights the current page and keeps other links neutral. `Pagination.color` (a `UIColor`, default `primary`) controls only the current page's color. Each `PaginationLink`/`PaginationPrevious`/`PaginationNext` can still pass its own `color`, but `Pagination`'s wins when set.
 - `sidebar`
   - Exports: `Sidebar`, `SidebarContent`, `SidebarFooter`, `SidebarGroup`, `SidebarGroupAction`, `SidebarGroupContent`, `SidebarGroupLabel`, `SidebarHeader`, `SidebarInput`, `SidebarInset`, `SidebarMenu`, `SidebarMenuAction`, `SidebarMenuBadge`, `SidebarMenuButton`, `SidebarMenuItem`, `SidebarMenuSkeleton`, `SidebarMenuSub`, `SidebarMenuSubButton`, `SidebarMenuSubItem`, `SidebarProvider`, `SidebarRail`, `SidebarSeparator`, `SidebarTrigger`, `useSidebar`
 - `stepper`

package/skills/uselets-ui/references/package-guide.md

@@ -189,7 +189,7 @@ const [draft, setDraft] = useLocalStorage('draft', {
 })
 ```
 
-It stores values with `JSON.stringify`, reads with `JSON.parse` with string fallback, and synchronizes changes from other browser tabs unless `sync` is set to `false`.
+It stores values with `JSON.stringify`, reads with `JSON.parse` with string fallback, and synchronizes changes both from other browser tabs and from other instances using the same key in the same tab, unless `sync` is set to `false`.
 
 ## Package-wide wrappers and providers