npm - svelte-ag - Versions diffs - 1.0.34 → 1.0.36 - Mend

svelte-ag 1.0.34 → 1.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (43) hide show

package/dist/lib/api/query/query.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"query.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/api/query/query.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAInH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;~~AAK5C~~,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAExD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEnE,qBAAa,KAAK,CAChB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBAyBzC,EACV,IAAI,EACJ,MAAM,EACN,KAAK,EACL,SAAS,EACT,KAAK,EACN,EAAE;QACD,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACnC,SAAS,EAAE,SAAS,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACxC,KAAK,EAAE,KAAK,CAAC;QACb,IAAI,CAAC,EAAE;YACL,KAAK,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAC1C,CAAC;KACH;IAgBK,OAAO,IAAI,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;IA+BxD,IAAI,QAAQ,WAEX;IACD,IAAI,QAAQ,YAEX;IACD,UAAU;IAMV,IAAI,MAAM,gBAET;IACD,IAAI,IAAI,IAAI,cAAc,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEnD;IACD,IAAI,SAAS,IAAI,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEtD;CACF;AAED,qBAAa,SAAS,CACpB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBA6BnD,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,kBAAkB,CAAC,GAAG,CAAC,EAChC,MAAM,EAAE,KAAK,EACb,YAAY,CAAC,EAAE,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC;YAkBlC,KAAK;IAOnB;;;OAGG;YACW,eAAe;IAqBvB,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;CAkB3F"}
1	+ {"version":3,"file":"query.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/api/query/query.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAInH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAG5C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAExD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEnE,qBAAa,KAAK,CAChB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBAyBzC,EACV,IAAI,EACJ,MAAM,EACN,KAAK,EACL,SAAS,EACT,KAAK,EACN,EAAE;QACD,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACnC,SAAS,EAAE,SAAS,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACxC,KAAK,EAAE,KAAK,CAAC;QACb,IAAI,CAAC,EAAE;YACL,KAAK,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAC1C,CAAC;KACH;IAgBK,OAAO,IAAI,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;IA+BxD,IAAI,QAAQ,WAEX;IACD,IAAI,QAAQ,YAEX;IACD,UAAU;IAMV,IAAI,MAAM,gBAET;IACD,IAAI,IAAI,IAAI,cAAc,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEnD;IACD,IAAI,SAAS,IAAI,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEtD;CACF;AAED,qBAAa,SAAS,CACpB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBA6BnD,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,kBAAkB,CAAC,GAAG,CAAC,EAChC,MAAM,EAAE,KAAK,EACb,YAAY,CAAC,EAAE,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC;YAkBlC,KAAK;IAOnB;;;OAGG;YACW,eAAe;IAqBvB,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;CAkB3F"}

package/dist/lib/api/query/query.svelte.js CHANGED Viewed

@@ -1,7 +1,5 @@
 import { stringify } from 'devalue';
 import Bottleneck from 'bottleneck';
-import * as env from '$env/static/public';
-import { sleep } from 'radash';
 import { cacheKey } from './utils.svelte.js';
 export class Query {
     // -------- Constants --------
@@ -111,9 +109,9 @@ export class Requestor {
     }
     // Makes the actual call to the api
     async fetch(input) {
-        if ('PUBLIC_ENVIRONMENT' in env && env.PUBLIC_ENVIRONMENT === 'development') {
-            await sleep(1000);
-        }
+        // if ('PUBLIC_ENVIRONMENT' in env && env.PUBLIC_ENVIRONMENT === 'development') {
+        //   await sleep(1000);
+        // }
         return await this.#limiter.schedule(() => this.#request(this.#path, this.#method, input));
     }
     /**

package/dist/lib/components/breakpoint-badge/BreakpointBadge.svelte CHANGED Viewed

@@ -11,78 +11,69 @@
       bgClass: 'bg-red-100',
       borderClass: 'border-red-300',
       textClass: 'text-red-600',
-      hideClass: 'sm:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'sm:hidden'
     },
     {
       name: 'sm',
       bgClass: 'bg-blue-100',
       borderClass: 'border-blue-300',
       textClass: 'text-blue-600',
-      hideClass: 'hidden sm:block md:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden sm:block md:hidden'
     },
     {
       name: 'md',
       bgClass: 'bg-purple-100',
       borderClass: 'border-purple-300',
       textClass: 'text-purple-600',
-      hideClass: 'hidden md:block lg:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden md:block lg:hidden'
     },
     {
       name: 'lg',
       bgClass: 'bg-green-100',
       borderClass: 'border-green-300',
       textClass: 'text-green-800',
-      hideClass: 'hidden lg:block xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden lg:block xl:hidden'
     },
     {
       name: 'xl',
       bgClass: 'bg-orange-100',
       borderClass: 'border-orange-300',
       textClass: 'text-orange-600',
-      hideClass: 'hidden xl:block 2xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden xl:block 2xl:hidden'
     },
     {
       name: '2xl',
       bgClass: 'bg-yellow-100',
       borderClass: 'border-yellow-300',
       textClass: 'text-yellow-600',
-      hideClass: 'hidden 2xl:block 3xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden 2xl:block 3xl:hidden'
     },
     {
       name: '3xl',
       bgClass: 'bg-blue-100',
       borderClass: 'border-blue-300',
       textClass: 'text-blue-600',
-      hideClass: 'hidden 3xl:block 4xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden 3xl:block 4xl:hidden'
     },
     {
       name: '4xl',
       bgClass: 'bg-red-100',
       borderClass: 'border-red-300',
       textClass: 'text-red-600',
-      hideClass: 'hidden 4xl:block 5xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden 4xl:block 5xl:hidden'
     }
   ];
 </script>
 {#if dev}
-  <div class="w-fit">
+  <div class="w-fit" data-testid="breakpoint-badge">
     {#each breakpoints as bp (bp.name)}
       <div
-        class="{bp.rounded}
+        class="
+          rounded-md border px-2 text-xs font-bold
           {bp.bgClass}
           {bp.hideClass}
-          border
           {bp.borderClass}
-          px-2 text-xs font-bold
           {bp.textClass}"
       >
         {bp.name}

package/dist/lib/components/breakpoint-badge/BreakpointBadge.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BreakpointBadge.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/breakpoint-badge/BreakpointBadge.svelte.ts"],"names":[],"mappings":"AAGE,MAAM,MAAM,0BAA0B,GAAG;IAAE,GAAG,EAAE,OAAO,CAAA;CAAE,CAAC;~~AA6F5D~~,QAAA,MAAM,eAAe,gEAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
1	+ {"version":3,"file":"BreakpointBadge.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/breakpoint-badge/BreakpointBadge.svelte.ts"],"names":[],"mappings":"AAGE,MAAM,MAAM,0BAA0B,GAAG;IAAE,GAAG,EAAE,OAAO,CAAA;CAAE,CAAC;AAoF5D,QAAA,MAAM,eAAe,gEAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/lib/components/sidebar/context.svelte.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
-type Getter<T> = () => T;
+import type { WritableBox } from 'svelte-toolbelt';
 export type SidebarStateProps = {
     /**
      * A getter function that returns the current open state of the sidebar.
      * We use a getter function here to support `bind:open` on the `Sidebar.Provider`
      * component.
      */
-    open: Getter<{
+    open: WritableBox<{
         left: boolean;
         right: boolean;
     }>;
@@ -19,21 +19,23 @@ export type SidebarStateProps = {
 declare class SidebarState {
     #private;
     readonly props: SidebarStateProps;
-    open: {
+    openMobile: {
         left: boolean;
         right: boolean;
     };
-    openMobile: boolean;
     setOpen: SidebarStateProps['setOpen'];
-    state: {
-        left: string;
-        right: string;
-    };
     constructor(props: SidebarStateProps);
+    get open(): {
+        left: boolean;
+        right: boolean;
+    };
+    set open(v: {
+        left: boolean;
+        right: boolean;
+    });
     get isMobile(): boolean;
     handleShortcutKeydown: (e: KeyboardEvent) => void;
-    setOpenMobile: (value: boolean) => void;
-    toggle: (side?: "left" | "right") => boolean | void;
+    toggle: (side?: "left" | "right") => void;
 }
 /**
  * Instantiates a new `SidebarState` instance and sets it in the context.

package/dist/lib/components/sidebar/context.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/context.svelte.ts"],"names":[],"mappings":"~~AAIA~~,KAAK,~~MAAM~~,~~CAAC~~,~~CAAC~~,~~IAAI,~~MAAM,~~CAAC~~,CAAC;~~AAEzB~~,MAAM,MAAM,iBAAiB,GAAG;IAC9B;;;;OAIG;IACH,IAAI,EAAE,~~MAAM~~,CAAC;QAAE,IAAI,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;~~IAEhD~~;;;;OAIG;IACH,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CAC1D,CAAC;AAEF,cAAM,YAAY;;IAChB,QAAQ,CAAC,KAAK,EAAE,iBAAiB,CAAC;~~IAClC~~,~~IAAI;cAZiB,OAAO;eAAS,OAAO;MAYA;IAC5C,~~UAAU~~,UAAiB~~;~~IAC3B~~,OAAO,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;~~IAEtC~~,KAAK~~;;;MAKF;gBAES~~,~~KAAK,~~EAAE,iBAAiB;~~IAQpC~~,IAAI,QAAQ,YAEX;IAGD,qBAAqB,GAAI,GAAG,aAAa,UAKvC;IAEF,~~aAAa,GAAI,OAAO,OAAO,UAE7B;IAEF,~~MAAM,GAAI,OAAM,MAAM,GAAG,OAAgB,~~oBAEvC~~;CACH;AAID;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAEjE;AAED;;;;GAIG;AACH,wBAAgB,UAAU,IAAI,YAAY,CAEzC"}
1	+ {"version":3,"file":"context.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/context.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAEnD,MAAM,MAAM,iBAAiB,GAAG;IAC9B;;;;OAIG;IACH,IAAI,EAAE,WAAW,CAAC;QAAE,IAAI,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IAErD;;;;OAIG;IACH,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CAC1D,CAAC;AAEF,cAAM,YAAY;;IAChB,QAAQ,CAAC,KAAK,EAAE,iBAAiB,CAAC;IAGlC,UAAU;;;MAAyC;IACnD,OAAO,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;gBAG1B,KAAK,EAAE,iBAAiB;IAOpC,IAAI,IAAI;cAzBkB,OAAO;eAAS,OAAO;MA2BhD;IACD,IAAI,IAAI,CAAC,CAAC;cA5BgB,OAAO;eAAS,OAAO;KA4BvC,EAET;IAID,IAAI,QAAQ,YAEX;IAGD,qBAAqB,GAAI,GAAG,aAAa,UAKvC;IAEF,MAAM,GAAI,OAAM,MAAM,GAAG,OAAgB,UAGvC;CACH;AAID;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAEjE;AAED;;;;GAIG;AACH,wBAAgB,UAAU,IAAI,YAAY,CAEzC"}

package/dist/lib/components/sidebar/context.svelte.js CHANGED Viewed

@@ -3,21 +3,23 @@ import { getContext, setContext } from 'svelte';
 import { SIDEBAR_KEYBOARD_SHORTCUT } from './constants.js';
 class SidebarState {
     props;
-    open = $derived.by(() => this.props.open());
-    openMobile = $state(false);
+    // open = $derived.by(() => this.props.open.current);
+    #open;
+    openMobile = $state({ left: false, right: false });
     setOpen;
     #isMobile;
-    state = $derived.by(() => {
-        return {
-            left: this.open.left ? 'expanded' : 'collapsed',
-            right: this.open.right ? 'expanded' : 'collapsed'
-        };
-    });
     constructor(props) {
         this.setOpen = props.setOpen;
         this.#isMobile = new IsMobile();
+        this.#open = props.open;
         this.props = props;
     }
+    get open() {
+        return this.props.open.current;
+    }
+    set open(v) {
+        this.#open.current = v;
+    }
     // Convenience getter for checking if the sidebar is mobile
     // without this, we would need to use `sidebar.isMobile.current` everywhere
     get isMobile() {
@@ -30,11 +32,11 @@ class SidebarState {
             this.toggle();
         }
     };
-    setOpenMobile = (value) => {
-        this.openMobile = value;
-    };
     toggle = (side = 'left') => {
-        return this.#isMobile.current ? (this.openMobile = !this.openMobile) : this.setOpen(!this.open[side], side);
+        if (this.#isMobile.current)
+            return this.setOpen(!this.openMobile[side], side);
+        else
+            return this.setOpen(!this.open[side], side);
     };
 }
 const SYMBOL_KEY = 'scn-sidebar';

package/dist/lib/components/sidebar/sidebar-content.svelte CHANGED Viewed

@@ -17,7 +17,7 @@
   class={cn(
     `
       flex min-h-0 flex-1 flex-col gap-2 overflow-auto
-      group-data-[collapsible=icon]:overflow-hidden
+      group-data-[collapsible=icon]:group-data-[open=false]:overflow-hidden
     `,
     className
   )}

package/dist/lib/components/sidebar/sidebar-group-action.svelte CHANGED Viewed

@@ -28,7 +28,7 @@
         after:absolute after:-inset-2
         after:md:hidden
       `,
-      'group-data-[collapsible=icon]:hidden',
+      'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
       className
     ),
     'data-sidebar': 'group-action',

package/dist/lib/components/sidebar/sidebar-group-label.svelte CHANGED Viewed

@@ -22,7 +22,10 @@
         focus-visible:ring-2
         [&>svg]:size-4 [&>svg]:shrink-0
       `,
-      'group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0',
+      `
+        group-data-[collapsible=icon]:group-data-[open=false]:-mt-8
+        group-data-[collapsible=icon]:group-data-[open=false]:opacity-0
+      `,
       className
     ),
     'data-sidebar': 'group-label',

package/dist/lib/components/sidebar/sidebar-group-label.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-group-label.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-group-label.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAErD,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,GAAG;IACpE,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,CAAC,CAAC,CAAC;CACvD,CAAC;~~AAyCJ~~,QAAA,MAAM,iBAAiB,yDAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"sidebar-group-label.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-group-label.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAErD,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,GAAG;IACpE,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,CAAC,CAAC,CAAC;CACvD,CAAC;AA4CJ,QAAA,MAAM,iBAAiB,yDAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/lib/components/sidebar/sidebar-inset.svelte CHANGED Viewed

@@ -20,7 +20,7 @@
     `
       md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl
       md:peer-data-[variant=inset]:shadow-sm
-      md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2
+      md:peer-data-[open=false]:peer-data-[variant=inset]:ml-2
     `,
     className
   )}

package/dist/lib/components/sidebar/sidebar-menu-action.svelte CHANGED Viewed

@@ -34,13 +34,13 @@
       'peer-data-[size=sm]/menu-button:top-1',
       'peer-data-[size=default]/menu-button:top-1.5',
       'peer-data-[size=lg]/menu-button:top-2.5',
-      'group-data-[collapsible=icon]:hidden',
+      'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
       showOnHover &&
         `
           group-focus-within/menu-item:opacity-100
           group-hover/menu-item:opacity-100
           peer-data-[active=true]/menu-button:text-sidebar-accent-foreground
-          data-[state=open]:opacity-100
+          data-[open=true]:opacity-100
           md:opacity-0
         `,
       className

package/dist/lib/components/sidebar/sidebar-menu-badge.svelte CHANGED Viewed

@@ -26,7 +26,7 @@
     'peer-data-[size=sm]/menu-button:top-1',
     'peer-data-[size=default]/menu-button:top-1.5',
     'peer-data-[size=lg]/menu-button:top-2.5',
-    'group-data-[collapsible=icon]:hidden',
+    'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
     className
   )}
   {...restProps}

package/dist/lib/components/sidebar/sidebar-menu-button.svelte CHANGED Viewed

@@ -6,7 +6,8 @@
       peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm ring-sidebar-ring
       transition-[width,height,padding] outline-none
       group-has-data-[sidebar=menu-action]/menu-item:pr-8
-      group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2!
+      group-data-[collapsible=icon]:group-data-[open=false]:size-8!
+      group-data-[collapsible=icon]:group-data-[open=false]:p-2!
       hover:bg-sidebar-accent hover:text-sidebar-accent-foreground
       focus-visible:ring-2
       active:bg-sidebar-accent active:text-sidebar-accent-foreground
@@ -14,7 +15,7 @@
       aria-disabled:pointer-events-none aria-disabled:opacity-50
       data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium
       data-[active=true]:text-sidebar-accent-foreground
-      data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground
+      data-[open=true]:hover:bg-sidebar-accent data-[open=true]:hover:text-sidebar-accent-foreground
       [&>span:last-child]:truncate
       [&>svg]:size-4 [&>svg]:shrink-0
     `),
@@ -32,7 +33,7 @@
         sm: 'h-7 text-xs',
         lg: `
           h-12 text-sm
-          group-data-[collapsible=icon]:p-0!
+          group-data-[collapsible=icon]:group-data-[open=false]:p-0!
         `
       }
     },
@@ -118,7 +119,7 @@
     <Tooltip.Content
       side="right"
       align="center"
-      hidden={sidebar.state[side] !== 'collapsed' || sidebar.isMobile}
+      hidden={sidebar.open[side] === false || sidebar.isMobile}
       children={tooltipContent}
       {...tooltipContentProps}
     />
@@ -140,7 +141,7 @@
         <Tooltip.Content
           side="right"
           align="center"
-          hidden={sidebar.state[side] !== 'collapsed' || sidebar.isMobile}
+          hidden={sidebar.open[side] === false || sidebar.isMobile}
           children={tooltipContent}
           {...tooltipContentProps}
         />

package/dist/lib/components/sidebar/sidebar-menu-button.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-menu-button.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-menu-button.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE1D,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~mDAuCpC~~,CAAC;AAEH,MAAM,MAAM,wBAAwB,GAAG,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC,SAAS,CAAC,CAAC;AACjG,MAAM,MAAM,qBAAqB,GAAG,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC,MAAM,CAAC,CAAC;AAG7F,OAAO,EAAc,KAAK,cAAc,EAAE,KAAK,sBAAsB,EAAE,MAAM,SAAS,CAAC;AACvF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC;AACpD,OAAO,KAAK,WAAW,MAAM,+BAA+B,CAAC;AAG7D,OAAO,KAAK,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGrD,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC,GAAG;IAC7F,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,wBAAwB,CAAC;IACnC,IAAI,CAAC,EAAE,qBAAqB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,sBAAsB,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IACrF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,sBAAsB,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC;IACvF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,CAAC,CAAC,CAAC;CACvD,CAAC;AAuFJ,QAAA,MAAM,iBAAiB,uEAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"sidebar-menu-button.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-menu-button.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE1D,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mDAwCpC,CAAC;AAEH,MAAM,MAAM,wBAAwB,GAAG,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC,SAAS,CAAC,CAAC;AACjG,MAAM,MAAM,qBAAqB,GAAG,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC,MAAM,CAAC,CAAC;AAG7F,OAAO,EAAc,KAAK,cAAc,EAAE,KAAK,sBAAsB,EAAE,MAAM,SAAS,CAAC;AACvF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC;AACpD,OAAO,KAAK,WAAW,MAAM,+BAA+B,CAAC;AAG7D,OAAO,KAAK,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAGrD,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC,GAAG;IAC7F,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,wBAAwB,CAAC;IACnC,IAAI,CAAC,EAAE,qBAAqB,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,sBAAsB,CAAC,cAAc,CAAC,OAAO,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IACrF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,sBAAsB,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC;IACvF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,CAAC,CAAC,CAAC;CACvD,CAAC;AAuFJ,QAAA,MAAM,iBAAiB,uEAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/lib/components/sidebar/sidebar-menu-sub-button.svelte CHANGED Viewed

@@ -34,7 +34,7 @@
       'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',
       size === 'sm' && 'text-xs',
       size === 'md' && 'text-sm',
-      'group-data-[collapsible=icon]:hidden',
+      'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
       className
     ),
     'data-sidebar': 'menu-sub-button',

package/dist/lib/components/sidebar/sidebar-menu-sub.svelte CHANGED Viewed

@@ -16,7 +16,7 @@
   data-sidebar="menu-sub"
   class={cn(
     'mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5',
-    'group-data-[collapsible=icon]:hidden',
+    'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
     className
   )}
   {...restProps}

package/dist/lib/components/sidebar/sidebar-provider.svelte CHANGED Viewed

@@ -5,6 +5,8 @@
   import type { HTMLAttributes } from 'svelte/elements';
   import { SIDEBAR_COOKIE_MAX_AGE, SIDEBAR_COOKIE_NAME, SIDEBAR_WIDTH, SIDEBAR_WIDTH_ICON } from './constants.js';
   import { setSidebar } from './context.svelte.js';
+  import { browser } from '$app/environment';
+  import { box } from 'svelte-toolbelt';
   let {
     ref = $bindable(null),
@@ -12,7 +14,7 @@
       left: true,
       right: true
     }),
-    onOpenChange = () => {},
+    onOpenChange,
     class: className,
     style,
     children,
@@ -26,13 +28,22 @@
   } = $props();
   const sidebar = setSidebar({
-    open: () => open,
+    open: box.with(
+      () => open,
+      (v) => (open = v)
+    ),
     setOpen: (value: boolean, side: 'left' | 'right' = 'left') => {
-      open[side] = value;
-      onOpenChange(value, side);
+      if (sidebar.isMobile) {
+        sidebar.openMobile[side] = value;
+      } else {
+        open[side] = value;
+      }
+      onOpenChange?.(value, side);
-      // This sets the cookie to keep the sidebar state.
-      document.cookie = `${SIDEBAR_COOKIE_NAME}-${side}=${open[side]}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+      if (browser) {
+        // This sets the cookie to keep the sidebar state.
+        document.cookie = `${SIDEBAR_COOKIE_NAME}-${side}=${open[side]}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+      }
     }
   });
 </script>

package/dist/lib/components/sidebar/sidebar-provider.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-provider.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-provider.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;~~AAIrD~~,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE;QACL,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,EAAE,OAAO,CAAC;KAChB,CAAC;IACF,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CAChE,CAAC;~~AAkDJ~~,QAAA,MAAM,eAAe,kEAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
1	+ {"version":3,"file":"sidebar-provider.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-provider.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAMrD,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE;QACL,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,EAAE,OAAO,CAAC;KAChB,CAAC;IACF,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CAChE,CAAC;AA6DJ,QAAA,MAAM,eAAe,kEAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/lib/components/sidebar/sidebar-rail.svelte CHANGED Viewed

@@ -42,9 +42,9 @@
       [[data-side=right][data-state=collapsed]_&]:cursor-w-resize
     `,
     `
-      group-data-[collapsible=offcanvas]:translate-x-0
-      group-data-[collapsible=offcanvas]:after:left-full
-      group-data-[collapsible=offcanvas]:hover:bg-sidebar
+      group-data-[collapsible=offcanvas]:group-data-[open=false]:translate-x-0
+      group-data-[collapsible=offcanvas]:group-data-[open=false]:after:left-full
+      group-data-[collapsible=offcanvas]:group-data-[open=false]:hover:bg-sidebar
     `,
     '[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',
     '[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',

package/dist/lib/components/sidebar/sidebar-trigger.svelte CHANGED Viewed

@@ -22,6 +22,7 @@
   type="button"
   onclick={(e) => {
     onclick?.(e);
+    console.log('TOggling', side);
     sidebar.toggle(side);
   }}
   data-sidebar="trigger"

package/dist/lib/components/sidebar/sidebar-trigger.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-trigger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-trigger.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG5C,KAAK,gBAAgB,GAAI,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IACtD,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CACzB,CAAC;~~AA4BJ~~,QAAA,MAAM,cAAc,yDAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"sidebar-trigger.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar-trigger.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAG5C,KAAK,gBAAgB,GAAI,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IACtD,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CACzB,CAAC;AA6BJ,QAAA,MAAM,cAAc,yDAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/lib/components/sidebar/sidebar.svelte CHANGED Viewed

@@ -9,18 +9,25 @@
   let {
     ref = $bindable(null),
     side = 'left',
+    sideMobile,
     variant = 'sidebar',
     collapsible = 'offcanvas',
+    open,
     class: className,
     children,
     ...restProps
   }: WithElementRef<HTMLAttributes<HTMLDivElement>> & {
     side?: 'left' | 'right';
+    sideMobile?: 'left' | 'right' | 'top' | 'bottom';
     variant?: 'sidebar' | 'floating' | 'inset';
     collapsible?: 'offcanvas' | 'icon' | 'none';
+    open?: boolean;
   } = $props();
   const sidebar = useSidebar();
+  // svelte-ignore state_referenced_locally
+  if (open !== undefined) sidebar.setOpen(open, side);
 </script>
 {#if collapsible === 'none'}
@@ -40,16 +47,20 @@
     {@render children?.()}
   </div>
 {:else if sidebar.isMobile}
-  <Sheet.Root bind:open={() => sidebar.openMobile, (v) => sidebar.setOpenMobile(v)} {...restProps}>
+  <Sheet.Root bind:open={() => sidebar.openMobile[side], (v) => sidebar.setOpen(v, side)} {...restProps}>
     <Sheet.Content
       data-sidebar="sidebar"
       data-mobile="true"
-      class="
-        w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground
-        [&>button]:hidden
-      "
+      class={cn(
+        `
+          bg-sidebar p-0 text-sidebar-foreground
+          [&>button]:hidden
+        `,
+        sideMobile === 'top' || sideMobile === 'bottom' ? '' : 'w-(--sidebar-width)',
+        className
+      )}
       style="--sidebar-width: {SIDEBAR_WIDTH_MOBILE};"
-      {side}
+      side={sideMobile ?? side}
     >
       <div class="flex h-full w-full flex-col">
         {@render children?.()}
@@ -63,7 +74,7 @@
       `
         peer relative hidden w-(--sidebar-width) flex-auto grow-0 flex-col overflow-hidden bg-sidebar
         text-sidebar-foreground transition-[width] duration-200 ease-linear
-        data-[collapsible=offcanvas]:w-0
+        data-[collapsible=offcanvas]:data-[open=false]:w-0
         data-[variant=floating]:rounded-lg data-[variant=floating]:border data-[variant=floating]:border-sidebar-border
         data-[variant=floating]:shadow-sm
         md:flex
@@ -72,10 +83,10 @@
       variant === 'floating' || variant === 'inset'
         ? `
           m-2
-          data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon))]
+          data-[collapsible=icon]:data-[open=false]:w-[calc(var(--sidebar-width-icon))]
         `
         : `
-          data-[collapsible=icon]:w-(--sidebar-width-icon)
+          data-[collapsible=icon]:data-[open=false]:w-(--sidebar-width-icon)
           data-[side=left]:border-r
           data-[side=right]:border-l
         `,
@@ -83,8 +94,8 @@
       className
     )}
     data-sidebar="sidebar"
-    data-state={sidebar.state[side]}
-    data-collapsible={sidebar.state[side] === 'collapsed' ? collapsible : ''}
+    data-open={sidebar.open[side]}
+    data-collapsible={collapsible}
     data-variant={variant}
     data-side={side}
     {...restProps}

package/dist/lib/components/sidebar/sidebar.svelte.d.ts CHANGED Viewed

@@ -2,8 +2,10 @@ import type { WithElementRef } from 'bits-ui';
 import type { HTMLAttributes } from 'svelte/elements';
 type $$ComponentProps = WithElementRef<HTMLAttributes<HTMLDivElement>> & {
     side?: 'left' | 'right';
+    sideMobile?: 'left' | 'right' | 'top' | 'bottom';
     variant?: 'sidebar' | 'floating' | 'inset';
     collapsible?: 'offcanvas' | 'icon' | 'none';
+    open?: boolean;
 };
 declare const Sidebar: import("svelte").Component<$$ComponentProps, {}, "ref">;
 type Sidebar = ReturnType<typeof Sidebar>;

package/dist/lib/components/sidebar/sidebar.svelte.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAIrD,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;IAC3C,WAAW,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;~~CAC7C~~,CAAC;~~AA4EJ~~,QAAA,MAAM,OAAO,yDAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}
1	+ {"version":3,"file":"sidebar.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/sidebar/sidebar.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAIrD,KAAK,gBAAgB,GAAI,cAAc,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;IACjD,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,OAAO,CAAC;IAC3C,WAAW,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAqFJ,QAAA,MAAM,OAAO,yDAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "svelte-ag",
-  "version": "1.0.34",
+  "version": "1.0.36",
   "description": "Useful svelte components",
   "bugs": "https://github.com/ageorgeh/svelte-ag/issues",
   "repository": {
@@ -60,13 +60,13 @@
     "sveltekit-superforms": "2.30.0",
     "tailwind-merge": "^3.5.0",
     "tailwind-variants": "^3.2.2",
-    "ts-ag": "^1.0.19",
+    "ts-ag": "^1.0.23",
     "valibot": "^1.2.0"
   },
   "devDependencies": {
     "@actions/languageserver": "^0.3.46",
     "@eslint/js": "^10.0.1",
-    "@iconify/json": "^2.2.443",
+    "@iconify/json": "^2.2.444",
     "@iconify/tailwind4": "^1.2.1",
     "@iconify/types": "^2.0.0",
     "@internationalized/date": "^3.11.0",
@@ -77,14 +77,14 @@
     "@sveltejs/vite-plugin-svelte": "^7.0.0",
     "@tailwindcss/typography": "^0.5.19",
     "@tailwindcss/vite": "^4.2.1",
-    "@types/node": "^24.10.15",
-    "@typescript/native-preview": "7.0.0-dev.20260227.1",
+    "@types/node": "^24.11.0",
+    "@typescript/native-preview": "7.0.0-dev.20260228.1",
     "eslint": "^10.0.2",
     "eslint-plugin-better-tailwindcss": "^4.3.1",
     "eslint-plugin-svelte": "^3.15.0",
     "globals": "^17.3.0",
     "husky": "^9.1.7",
-    "lint-staged": "^16.2.7",
+    "lint-staged": "^16.3.0",
     "prettier": "^3.8.1",
     "prettier-plugin-packagejson": "^3.0.0",
     "prettier-plugin-svelte": "^3.5.0",

package/src/lib/api/query/query.svelte.ts CHANGED Viewed

@@ -4,8 +4,6 @@ import { stringify } from 'devalue';
 import Bottleneck from 'bottleneck';
 import type { Cache } from './cache.svelte';
-import * as env from '$env/static/public';
-import { sleep } from 'radash';
 import { cacheKey } from './utils.svelte.js';
 import type { BatchDetails } from './entrypoint.svelte';
@@ -179,9 +177,9 @@ export class Requestor<
   // Makes the actual call to the api
   private async fetch(input: ApiInput<API, Path, Method>): Promise<ApiResponse<API, Path, Method>> {
-    if ('PUBLIC_ENVIRONMENT' in env && env.PUBLIC_ENVIRONMENT === 'development') {
-      await sleep(1000);
-    }
+    // if ('PUBLIC_ENVIRONMENT' in env && env.PUBLIC_ENVIRONMENT === 'development') {
+    //   await sleep(1000);
+    // }
     return await this.#limiter.schedule(() => this.#request(this.#path, this.#method, input));
   }

package/src/lib/components/breakpoint-badge/BreakpointBadge.svelte CHANGED Viewed

@@ -11,78 +11,69 @@
       bgClass: 'bg-red-100',
       borderClass: 'border-red-300',
       textClass: 'text-red-600',
-      hideClass: 'sm:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'sm:hidden'
     },
     {
       name: 'sm',
       bgClass: 'bg-blue-100',
       borderClass: 'border-blue-300',
       textClass: 'text-blue-600',
-      hideClass: 'hidden sm:block md:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden sm:block md:hidden'
     },
     {
       name: 'md',
       bgClass: 'bg-purple-100',
       borderClass: 'border-purple-300',
       textClass: 'text-purple-600',
-      hideClass: 'hidden md:block lg:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden md:block lg:hidden'
     },
     {
       name: 'lg',
       bgClass: 'bg-green-100',
       borderClass: 'border-green-300',
       textClass: 'text-green-800',
-      hideClass: 'hidden lg:block xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden lg:block xl:hidden'
     },
     {
       name: 'xl',
       bgClass: 'bg-orange-100',
       borderClass: 'border-orange-300',
       textClass: 'text-orange-600',
-      hideClass: 'hidden xl:block 2xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden xl:block 2xl:hidden'
     },
     {
       name: '2xl',
       bgClass: 'bg-yellow-100',
       borderClass: 'border-yellow-300',
       textClass: 'text-yellow-600',
-      hideClass: 'hidden 2xl:block 3xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden 2xl:block 3xl:hidden'
     },
     {
       name: '3xl',
       bgClass: 'bg-blue-100',
       borderClass: 'border-blue-300',
       textClass: 'text-blue-600',
-      hideClass: 'hidden 3xl:block 4xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden 3xl:block 4xl:hidden'
     },
     {
       name: '4xl',
       bgClass: 'bg-red-100',
       borderClass: 'border-red-300',
       textClass: 'text-red-600',
-      hideClass: 'hidden 4xl:block 5xl:hidden',
-      rounded: 'rounded-md'
+      hideClass: 'hidden 4xl:block 5xl:hidden'
     }
   ];
 </script>
 {#if dev}
-  <div class="w-fit">
+  <div class="w-fit" data-testid="breakpoint-badge">
     {#each breakpoints as bp (bp.name)}
       <div
-        class="{bp.rounded}
+        class="
+          rounded-md border px-2 text-xs font-bold
           {bp.bgClass}
           {bp.hideClass}
-          border
           {bp.borderClass}
-          px-2 text-xs font-bold
           {bp.textClass}"
       >
         {bp.name}

package/src/lib/components/sidebar/context.svelte.ts CHANGED Viewed

@@ -1,8 +1,7 @@
 import { IsMobile } from '$shadcn/hooks/is-mobile.svelte.js';
 import { getContext, setContext } from 'svelte';
 import { SIDEBAR_KEYBOARD_SHORTCUT } from './constants.js';
-type Getter<T> = () => T;
+import type { WritableBox } from 'svelte-toolbelt';
 export type SidebarStateProps = {
   /**
@@ -10,7 +9,7 @@ export type SidebarStateProps = {
    * We use a getter function here to support `bind:open` on the `Sidebar.Provider`
    * component.
    */
-  open: Getter<{ left: boolean; right: boolean }>;
+  open: WritableBox<{ left: boolean; right: boolean }>;
   /**
    * A function that sets the open state of the sidebar. To support `bind:open`, we need
@@ -22,23 +21,26 @@ export type SidebarStateProps = {
 class SidebarState {
   readonly props: SidebarStateProps;
-  open = $derived.by(() => this.props.open());
-  openMobile = $state(false);
+  // open = $derived.by(() => this.props.open.current);
+  #open: WritableBox<{ left: boolean; right: boolean }>;
+  openMobile = $state({ left: false, right: false });
   setOpen: SidebarStateProps['setOpen'];
   #isMobile: IsMobile;
-  state = $derived.by(() => {
-    return {
-      left: this.open.left ? 'expanded' : 'collapsed',
-      right: this.open.right ? 'expanded' : 'collapsed'
-    };
-  });
   constructor(props: SidebarStateProps) {
     this.setOpen = props.setOpen;
     this.#isMobile = new IsMobile();
+    this.#open = props.open;
     this.props = props;
   }
+  get open() {
+    return this.props.open.current;
+  }
+  set open(v) {
+    this.#open.current = v;
+  }
   // Convenience getter for checking if the sidebar is mobile
   // without this, we would need to use `sidebar.isMobile.current` everywhere
   get isMobile() {
@@ -53,12 +55,9 @@ class SidebarState {
     }
   };
-  setOpenMobile = (value: boolean) => {
-    this.openMobile = value;
-  };
   toggle = (side: 'left' | 'right' = 'left') => {
-    return this.#isMobile.current ? (this.openMobile = !this.openMobile) : this.setOpen(!this.open[side], side);
+    if (this.#isMobile.current) return this.setOpen(!this.openMobile[side], side);
+    else return this.setOpen(!this.open[side], side);
   };
 }

package/src/lib/components/sidebar/sidebar-content.svelte CHANGED Viewed

@@ -17,7 +17,7 @@
   class={cn(
     `
       flex min-h-0 flex-1 flex-col gap-2 overflow-auto
-      group-data-[collapsible=icon]:overflow-hidden
+      group-data-[collapsible=icon]:group-data-[open=false]:overflow-hidden
     `,
     className
   )}

package/src/lib/components/sidebar/sidebar-group-action.svelte CHANGED Viewed

@@ -28,7 +28,7 @@
         after:absolute after:-inset-2
         after:md:hidden
       `,
-      'group-data-[collapsible=icon]:hidden',
+      'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
       className
     ),
     'data-sidebar': 'group-action',

package/src/lib/components/sidebar/sidebar-group-label.svelte CHANGED Viewed

@@ -22,7 +22,10 @@
         focus-visible:ring-2
         [&>svg]:size-4 [&>svg]:shrink-0
       `,
-      'group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0',
+      `
+        group-data-[collapsible=icon]:group-data-[open=false]:-mt-8
+        group-data-[collapsible=icon]:group-data-[open=false]:opacity-0
+      `,
       className
     ),
     'data-sidebar': 'group-label',

package/src/lib/components/sidebar/sidebar-inset.svelte CHANGED Viewed

@@ -20,7 +20,7 @@
     `
       md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl
       md:peer-data-[variant=inset]:shadow-sm
-      md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2
+      md:peer-data-[open=false]:peer-data-[variant=inset]:ml-2
     `,
     className
   )}

package/src/lib/components/sidebar/sidebar-menu-action.svelte CHANGED Viewed

@@ -34,13 +34,13 @@
       'peer-data-[size=sm]/menu-button:top-1',
       'peer-data-[size=default]/menu-button:top-1.5',
       'peer-data-[size=lg]/menu-button:top-2.5',
-      'group-data-[collapsible=icon]:hidden',
+      'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
       showOnHover &&
         `
           group-focus-within/menu-item:opacity-100
           group-hover/menu-item:opacity-100
           peer-data-[active=true]/menu-button:text-sidebar-accent-foreground
-          data-[state=open]:opacity-100
+          data-[open=true]:opacity-100
           md:opacity-0
         `,
       className

package/src/lib/components/sidebar/sidebar-menu-badge.svelte CHANGED Viewed

@@ -26,7 +26,7 @@
     'peer-data-[size=sm]/menu-button:top-1',
     'peer-data-[size=default]/menu-button:top-1.5',
     'peer-data-[size=lg]/menu-button:top-2.5',
-    'group-data-[collapsible=icon]:hidden',
+    'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
     className
   )}
   {...restProps}

package/src/lib/components/sidebar/sidebar-menu-button.svelte CHANGED Viewed

@@ -6,7 +6,8 @@
       peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm ring-sidebar-ring
       transition-[width,height,padding] outline-none
       group-has-data-[sidebar=menu-action]/menu-item:pr-8
-      group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2!
+      group-data-[collapsible=icon]:group-data-[open=false]:size-8!
+      group-data-[collapsible=icon]:group-data-[open=false]:p-2!
       hover:bg-sidebar-accent hover:text-sidebar-accent-foreground
       focus-visible:ring-2
       active:bg-sidebar-accent active:text-sidebar-accent-foreground
@@ -14,7 +15,7 @@
       aria-disabled:pointer-events-none aria-disabled:opacity-50
       data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium
       data-[active=true]:text-sidebar-accent-foreground
-      data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground
+      data-[open=true]:hover:bg-sidebar-accent data-[open=true]:hover:text-sidebar-accent-foreground
       [&>span:last-child]:truncate
       [&>svg]:size-4 [&>svg]:shrink-0
     `),
@@ -32,7 +33,7 @@
         sm: 'h-7 text-xs',
         lg: `
           h-12 text-sm
-          group-data-[collapsible=icon]:p-0!
+          group-data-[collapsible=icon]:group-data-[open=false]:p-0!
         `
       }
     },
@@ -118,7 +119,7 @@
     <Tooltip.Content
       side="right"
       align="center"
-      hidden={sidebar.state[side] !== 'collapsed' || sidebar.isMobile}
+      hidden={sidebar.open[side] === false || sidebar.isMobile}
       children={tooltipContent}
       {...tooltipContentProps}
     />
@@ -140,7 +141,7 @@
         <Tooltip.Content
           side="right"
           align="center"
-          hidden={sidebar.state[side] !== 'collapsed' || sidebar.isMobile}
+          hidden={sidebar.open[side] === false || sidebar.isMobile}
           children={tooltipContent}
           {...tooltipContentProps}
         />

package/src/lib/components/sidebar/sidebar-menu-sub-button.svelte CHANGED Viewed

@@ -34,7 +34,7 @@
       'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',
       size === 'sm' && 'text-xs',
       size === 'md' && 'text-sm',
-      'group-data-[collapsible=icon]:hidden',
+      'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
       className
     ),
     'data-sidebar': 'menu-sub-button',

package/src/lib/components/sidebar/sidebar-menu-sub.svelte CHANGED Viewed

@@ -16,7 +16,7 @@
   data-sidebar="menu-sub"
   class={cn(
     'mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5',
-    'group-data-[collapsible=icon]:hidden',
+    'group-data-[collapsible=icon]:group-data-[open=false]:hidden',
     className
   )}
   {...restProps}

package/src/lib/components/sidebar/sidebar-provider.svelte CHANGED Viewed

@@ -5,6 +5,8 @@
   import type { HTMLAttributes } from 'svelte/elements';
   import { SIDEBAR_COOKIE_MAX_AGE, SIDEBAR_COOKIE_NAME, SIDEBAR_WIDTH, SIDEBAR_WIDTH_ICON } from './constants.js';
   import { setSidebar } from './context.svelte.js';
+  import { browser } from '$app/environment';
+  import { box } from 'svelte-toolbelt';
   let {
     ref = $bindable(null),
@@ -12,7 +14,7 @@
       left: true,
       right: true
     }),
-    onOpenChange = () => {},
+    onOpenChange,
     class: className,
     style,
     children,
@@ -26,13 +28,22 @@
   } = $props();
   const sidebar = setSidebar({
-    open: () => open,
+    open: box.with(
+      () => open,
+      (v) => (open = v)
+    ),
     setOpen: (value: boolean, side: 'left' | 'right' = 'left') => {
-      open[side] = value;
-      onOpenChange(value, side);
+      if (sidebar.isMobile) {
+        sidebar.openMobile[side] = value;
+      } else {
+        open[side] = value;
+      }
+      onOpenChange?.(value, side);
-      // This sets the cookie to keep the sidebar state.
-      document.cookie = `${SIDEBAR_COOKIE_NAME}-${side}=${open[side]}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+      if (browser) {
+        // This sets the cookie to keep the sidebar state.
+        document.cookie = `${SIDEBAR_COOKIE_NAME}-${side}=${open[side]}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+      }
     }
   });
 </script>

package/src/lib/components/sidebar/sidebar-rail.svelte CHANGED Viewed

@@ -42,9 +42,9 @@
       [[data-side=right][data-state=collapsed]_&]:cursor-w-resize
     `,
     `
-      group-data-[collapsible=offcanvas]:translate-x-0
-      group-data-[collapsible=offcanvas]:after:left-full
-      group-data-[collapsible=offcanvas]:hover:bg-sidebar
+      group-data-[collapsible=offcanvas]:group-data-[open=false]:translate-x-0
+      group-data-[collapsible=offcanvas]:group-data-[open=false]:after:left-full
+      group-data-[collapsible=offcanvas]:group-data-[open=false]:hover:bg-sidebar
     `,
     '[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',
     '[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',

package/src/lib/components/sidebar/sidebar-trigger.svelte CHANGED Viewed

@@ -22,6 +22,7 @@
   type="button"
   onclick={(e) => {
     onclick?.(e);
+    console.log('TOggling', side);
     sidebar.toggle(side);
   }}
   data-sidebar="trigger"

package/src/lib/components/sidebar/sidebar.svelte CHANGED Viewed

@@ -9,18 +9,25 @@
   let {
     ref = $bindable(null),
     side = 'left',
+    sideMobile,
     variant = 'sidebar',
     collapsible = 'offcanvas',
+    open,
     class: className,
     children,
     ...restProps
   }: WithElementRef<HTMLAttributes<HTMLDivElement>> & {
     side?: 'left' | 'right';
+    sideMobile?: 'left' | 'right' | 'top' | 'bottom';
     variant?: 'sidebar' | 'floating' | 'inset';
     collapsible?: 'offcanvas' | 'icon' | 'none';
+    open?: boolean;
   } = $props();
   const sidebar = useSidebar();
+  // svelte-ignore state_referenced_locally
+  if (open !== undefined) sidebar.setOpen(open, side);
 </script>
 {#if collapsible === 'none'}
@@ -40,16 +47,20 @@
     {@render children?.()}
   </div>
 {:else if sidebar.isMobile}
-  <Sheet.Root bind:open={() => sidebar.openMobile, (v) => sidebar.setOpenMobile(v)} {...restProps}>
+  <Sheet.Root bind:open={() => sidebar.openMobile[side], (v) => sidebar.setOpen(v, side)} {...restProps}>
     <Sheet.Content
       data-sidebar="sidebar"
       data-mobile="true"
-      class="
-        w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground
-        [&>button]:hidden
-      "
+      class={cn(
+        `
+          bg-sidebar p-0 text-sidebar-foreground
+          [&>button]:hidden
+        `,
+        sideMobile === 'top' || sideMobile === 'bottom' ? '' : 'w-(--sidebar-width)',
+        className
+      )}
       style="--sidebar-width: {SIDEBAR_WIDTH_MOBILE};"
-      {side}
+      side={sideMobile ?? side}
     >
       <div class="flex h-full w-full flex-col">
         {@render children?.()}
@@ -63,7 +74,7 @@
       `
         peer relative hidden w-(--sidebar-width) flex-auto grow-0 flex-col overflow-hidden bg-sidebar
         text-sidebar-foreground transition-[width] duration-200 ease-linear
-        data-[collapsible=offcanvas]:w-0
+        data-[collapsible=offcanvas]:data-[open=false]:w-0
         data-[variant=floating]:rounded-lg data-[variant=floating]:border data-[variant=floating]:border-sidebar-border
         data-[variant=floating]:shadow-sm
         md:flex
@@ -72,10 +83,10 @@
       variant === 'floating' || variant === 'inset'
         ? `
           m-2
-          data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon))]
+          data-[collapsible=icon]:data-[open=false]:w-[calc(var(--sidebar-width-icon))]
         `
         : `
-          data-[collapsible=icon]:w-(--sidebar-width-icon)
+          data-[collapsible=icon]:data-[open=false]:w-(--sidebar-width-icon)
           data-[side=left]:border-r
           data-[side=right]:border-l
         `,
@@ -83,8 +94,8 @@
       className
     )}
     data-sidebar="sidebar"
-    data-state={sidebar.state[side]}
-    data-collapsible={sidebar.state[side] === 'collapsed' ? collapsible : ''}
+    data-open={sidebar.open[side]}
+    data-collapsible={collapsible}
     data-variant={variant}
     data-side={side}
     {...restProps}