ics-ui-kit 0.1.14 → 0.1.15

package/dist/components/glass-toolbar.js

@@ -1,30 +1,30 @@
-import { jsx as r, jsxs as m } from "react/jsx-runtime";
-import { R as f, T as y, a as b, b as u, c as N } from "../index-BDrapWDv.js";
-import e from "react";
+import { jsx as e, jsxs as d } from "react/jsx-runtime";
+import { R as f, T as u, a as g, b as y, c as h } from "../index-BDrapWDv.js";
+import r from "react";
 import { T as l } from "../index-BVqs-uqP.js";
-import { D as G } from "../Divider-DPW5ZhZ8.js";
-import { I as g } from "../Icon-DH3ev9GK.js";
-import { C as w } from "../chevron-down-CAOItu8X.js";
-const x = l({
+import { D as N } from "../Divider-DPW5ZhZ8.js";
+import { I as b } from "../Icon-DH3ev9GK.js";
+import { C as G } from "../chevron-down-CAOItu8X.js";
+const w = l({
   base: "backdrop-glass-thin flex items-center gap-1 overflow-x-auto rounded-full bg-alpha-50 p-1.5 shadow-glass-sm [scrollbar-width:none]"
-}), h = e.forwardRef(
-  ({ className: a, ...s }, o) => /* @__PURE__ */ r(f, { ref: o, className: x({ className: a }), ...s })
+}), x = r.forwardRef(
+  ({ className: a, ...s }, o) => /* @__PURE__ */ e(f, { ref: o, className: w({ className: a }), ...s })
 );
-h.displayName = "GlassToolbar";
+x.displayName = "GlassToolbar";
 const c = l({
-  base: "group inline-flex items-center justify-center gap-1.5 rounded-full p-2 text-primary-fg hover:bg-secondary-border focus-visible:shadow-focus focus-visible:outline-none"
-}), p = e.forwardRef(({ className: a, ...s }, o) => /* @__PURE__ */ r(y, { ref: o, className: c({ className: a }), ...s }));
+  base: "group inline-flex items-center justify-center gap-1.5 rounded-full p-2 text-primary-fg hover:bg-alpha-high-90 focus-visible:shadow-focus focus-visible:outline-none"
+}), p = r.forwardRef(({ className: a, ...s }, o) => /* @__PURE__ */ e(u, { ref: o, className: c({ className: a }), ...s }));
 p.displayName = "GlassToolbarButton";
 const S = l({
   base: "h-4 w-4 text-primary-fg"
-}), v = e.forwardRef(
-  ({ className: a, ...s }, o) => /* @__PURE__ */ r(g, { ref: o, className: S({ className: a }), ...s })
+}), v = r.forwardRef(
+  ({ className: a, ...s }, o) => /* @__PURE__ */ e(b, { ref: o, className: S({ className: a }), ...s })
 );
 v.displayName = "GlassToolbarIcon";
 const R = l({
   base: "text-base leading-none text-primary-fg"
-}), I = e.forwardRef(
-  ({ className: a, ...s }, o) => /* @__PURE__ */ r("div", { ref: o, className: R({ className: a }), ...s })
+}), I = r.forwardRef(
+  ({ className: a, ...s }, o) => /* @__PURE__ */ e("div", { ref: o, className: R({ className: a }), ...s })
 );
 I.displayName = "GlassToolbarText";
 const C = l({
@@ -32,27 +32,27 @@ const C = l({
     base: "text-primary-fg",
     icon: "h-2 w-2 stroke-[3px]"
   }
-}), T = e.forwardRef(
+}), T = r.forwardRef(
   ({ className: a, icon: s, ...o }, t) => {
-    const n = C();
-    return /* @__PURE__ */ r("span", { className: n.base({ className: a }), children: /* @__PURE__ */ r(g, { icon: s || w, ref: t, className: n.icon(), ...o }) });
+    const i = C();
+    return /* @__PURE__ */ e("span", { className: i.base({ className: a }), children: /* @__PURE__ */ e(b, { icon: s || G, ref: t, className: i.icon(), ...o }) });
   }
 );
 T.displayName = "GlassToolbarSubTrigger";
 const k = l({
   base: "flex items-center gap-0.5"
-}), B = e.forwardRef(({ className: a, ...s }, o) => /* @__PURE__ */ r(b, { ref: o, className: k({ className: a }), ...s }));
-B.displayName = b.displayName;
+}), B = r.forwardRef(({ className: a, ...s }, o) => /* @__PURE__ */ e(g, { ref: o, className: k({ className: a }), ...s }));
+B.displayName = g.displayName;
 const j = l({
   extend: c,
-  base: "disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-primary-border"
-}), D = e.forwardRef(({ className: a, children: s, ...o }, t) => /* @__PURE__ */ r(u, { ref: t, className: j({ className: a }), ...o, children: s }));
+  base: "disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-alpha-high-80"
+}), D = r.forwardRef(({ className: a, children: s, ...o }, t) => /* @__PURE__ */ e(y, { ref: t, className: j({ className: a }), ...o, children: s }));
 D.displayName = "GlassToolbarToggleItem";
 const _ = l({
   base: "h-5 w-px bg-primary-border"
-}), q = e.forwardRef(
-  ({ className: a, ...s }, o) => /* @__PURE__ */ r(N, { asChild: !0, "data-orientation": "vertical", children: /* @__PURE__ */ r(
-    G,
+}), q = r.forwardRef(
+  ({ className: a, ...s }, o) => /* @__PURE__ */ e(h, { asChild: !0, "data-orientation": "vertical", children: /* @__PURE__ */ e(
+    N,
     {
       ref: o,
       orientation: "vertical",
@@ -63,9 +63,9 @@ const _ = l({
 );
 q.displayName = "GlassToolbarSeparator";
 const z = l({
-  base: "data-[state=open]:bg-primary-border"
-}), d = e.forwardRef(({ className: a, children: s, ...o }, t) => /* @__PURE__ */ r(p, { ref: t, "data-stick-left": !0, className: z({ className: a }), ...o, children: s }));
-d.displayName = "GlassToolbarTrigger";
+  base: "data-[state=open]:bg-alpha-high-80"
+}), m = r.forwardRef(({ className: a, children: s, ...o }, t) => /* @__PURE__ */ e(p, { ref: t, "data-stick-left": !0, className: z({ className: a }), ...o, children: s }));
+m.displayName = "GlassToolbarTrigger";
 const A = l({
   slots: {
     wrapper: "",
@@ -76,16 +76,16 @@ const A = l({
       true: { wrapper: "-ml-0.5 px-0.5 py-2" }
     }
   }
-}), E = e.forwardRef(({ className: a, children: s, sub: o, ...t }, n) => {
-  const i = A();
-  return /* @__PURE__ */ m(d, { ref: n, "data-stick-left": !0, className: i.wrapper({ className: a, sub: o }), ...t, children: [
+}), E = r.forwardRef(({ className: a, children: s, sub: o, ...t }, i) => {
+  const n = A();
+  return /* @__PURE__ */ d(m, { ref: i, "data-stick-left": !0, className: n.wrapper({ className: a, sub: o }), ...t, children: [
     s,
-    /* @__PURE__ */ r(T, { className: i.subtrigger() })
+    /* @__PURE__ */ e(T, { className: n.subtrigger() })
   ] });
 });
 E.displayName = "GlassToolbarTriggerChevron";
 export {
-  h as GlassToolbar,
+  x as GlassToolbar,
   p as GlassToolbarButton,
   v as GlassToolbarIcon,
   q as GlassToolbarSeparator,
@@ -93,7 +93,7 @@ export {
   I as GlassToolbarText,
   B as GlassToolbarToggleGroup,
   D as GlassToolbarToggleItem,
-  d as GlassToolbarTrigger,
+  m as GlassToolbarTrigger,
   E as GlassToolbarTriggerChevron
 };
 //# sourceMappingURL=glass-toolbar.js.map

package/dist/components/glass-toolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"glass-toolbar.js","sources":["../../src/components/glass-toolbar/GlassToolbar.tsx"],"sourcesContent":["import * as ToolbarPrimitive from \"@radix-ui/react-toolbar\";\nimport React, { PropsWithChildren } from \"react\";\nimport { tv } from \"tailwind-variants\";\nimport { Divider } from \"../divider/Divider\";\nimport { Icon } from \"../icon\";\nimport { ChevronDown, LucideIcon } from \"lucide-react\";\n\nconst glassToolbarStyles = tv({\n\tbase: \"backdrop-glass-thin flex items-center gap-1 overflow-x-auto rounded-full bg-alpha-50 p-1.5 shadow-glass-sm [scrollbar-width:none]\"\n});\n\nexport type GlassToolbarProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.Root>;\n\nexport const GlassToolbar = React.forwardRef<React.ElementRef<typeof ToolbarPrimitive.Root>, GlassToolbarProps>(\n\t({ className, ...props }, ref) => {\n\t\treturn <ToolbarPrimitive.Root ref={ref} className={glassToolbarStyles({ className })} {...props} />;\n\t}\n);\n\nGlassToolbar.displayName = \"GlassToolbar\";\n\nconst glassToolbarButtonStyles = tv({\n\tbase: \"group inline-flex items-center justify-center gap-1.5 rounded-full p-2 text-primary-fg hover:bg-secondary-border focus-visible:shadow-focus focus-visible:outline-none\"\n});\n\nexport type GlassToolbarButtonProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToolbarButton>;\n\nexport const GlassToolbarButton = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarButton>,\n\tGlassToolbarButtonProps\n>(({ className, ...props }, ref) => (\n\t<ToolbarPrimitive.ToolbarButton ref={ref} className={glassToolbarButtonStyles({ className })} {...props} />\n));\n\nGlassToolbarButton.displayName = \"GlassToolbarButton\";\n\nconst glassToolbarIconStyles = tv({\n\tbase: \"h-4 w-4 text-primary-fg\"\n});\n\nexport type GlassToolbarIconProps = React.ComponentPropsWithoutRef<typeof Icon>;\n\nexport const GlassToolbarIcon = React.forwardRef<React.ElementRef<typeof Icon>, GlassToolbarIconProps>(\n\t({ className, ...props }, ref) => <Icon ref={ref} className={glassToolbarIconStyles({ className })} {...props} />\n);\n\nGlassToolbarIcon.displayName = \"GlassToolbarIcon\";\n\nconst glassToolbarTextStyles = tv({\n\tbase: \"text-base leading-none text-primary-fg\"\n});\n\nexport type GlassToolbarTextProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const GlassToolbarText = React.forwardRef<HTMLDivElement, PropsWithChildren<GlassToolbarTextProps>>(\n\t({ className, ...props }, ref) => <div ref={ref} className={glassToolbarTextStyles({ className })} {...props} />\n);\n\nGlassToolbarText.displayName = \"GlassToolbarText\";\n\nconst glassToolbarSubTriggerStyles = tv({\n\tslots: {\n\t\tbase: \"text-primary-fg\",\n\t\ticon: \"h-2 w-2 stroke-[3px]\"\n\t}\n});\n\nexport type GlassToolbarSubTriggerProps = Omit<React.ComponentPropsWithoutRef<typeof Icon>, \"icon\"> & {\n\ticon?: LucideIcon;\n};\n\nexport const GlassToolbarSubTrigger = React.forwardRef<React.ElementRef<typeof Icon>, GlassToolbarSubTriggerProps>(\n\t({ className, icon, ...props }, ref) => {\n\t\tconst styles = glassToolbarSubTriggerStyles();\n\t\treturn (\n\t\t\t<span className={styles.base({ className })}>\n\t\t\t\t<Icon icon={icon || ChevronDown} ref={ref} className={styles.icon()} {...props} />\n\t\t\t</span>\n\t\t);\n\t}\n);\n\nGlassToolbarSubTrigger.displayName = \"GlassToolbarSubTrigger\";\n\nconst glassToolbarToggleGroupStyles = tv({\n\tbase: \"flex items-center gap-0.5\"\n});\n\nexport type GlassToolbarToggleGroupProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToggleGroup>;\n\nexport const GlassToolbarToggleGroup = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToggleGroup>,\n\tGlassToolbarToggleGroupProps\n>(({ className, ...props }, ref) => (\n\t<ToolbarPrimitive.ToggleGroup ref={ref} className={glassToolbarToggleGroupStyles({ className })} {...props} />\n));\n\nGlassToolbarToggleGroup.displayName = ToolbarPrimitive.ToggleGroup.displayName;\n\nconst glassToolbarToggleStyles = tv({\n\textend: glassToolbarButtonStyles,\n\tbase: \"disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-primary-border\"\n});\n\nexport type GlassToolbarToggleItemProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToolbarToggleItem> & {\n\tchildren: React.ReactNode;\n};\n\nexport const GlassToolbarToggleItem = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarToggleItem>,\n\tGlassToolbarToggleItemProps\n>(({ className, children, ...props }, ref) => (\n\t<ToolbarPrimitive.ToolbarToggleItem ref={ref} className={glassToolbarToggleStyles({ className })} {...props}>\n\t\t{children}\n\t</ToolbarPrimitive.ToolbarToggleItem>\n));\n\nGlassToolbarToggleItem.displayName = \"GlassToolbarToggleItem\";\n\nconst glassToolbarSeparatorStyles = tv({\n\tbase: \"h-5 w-px bg-primary-border\"\n});\n\nexport type GlassToolbarSeparatorProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const GlassToolbarSeparator = React.forwardRef<React.ElementRef<typeof Divider>, GlassToolbarSeparatorProps>(\n\t({ className, ...props }, ref) => (\n\t\t<ToolbarPrimitive.ToolbarSeparator asChild data-orientation=\"vertical\">\n\t\t\t<Divider\n\t\t\t\tref={ref}\n\t\t\t\torientation=\"vertical\"\n\t\t\t\tclassName={glassToolbarSeparatorStyles({ className })}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</ToolbarPrimitive.ToolbarSeparator>\n\t)\n);\n\nGlassToolbarSeparator.displayName = \"GlassToolbarSeparator\";\n\nconst glassToolbarTriggerStyles = tv({\n\tbase: \"data-[state=open]:bg-primary-border\"\n});\n\nexport type GlassToolbarTriggerProps = GlassToolbarButtonProps & {\n\t\"data-state\"?: \"open\" | \"closed\";\n};\n\nexport const GlassToolbarTrigger = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarButton>,\n\tGlassToolbarTriggerProps\n>(({ className, children, ...props }, ref) => (\n\t<GlassToolbarButton ref={ref} data-stick-left className={glassToolbarTriggerStyles({ className })} {...props}>\n\t\t{children}\n\t</GlassToolbarButton>\n));\n\nGlassToolbarTrigger.displayName = \"GlassToolbarTrigger\";\n\nconst glassToolbarTriggerChevronStyles = tv({\n\tslots: {\n\t\twrapper: \"\",\n\t\tsubtrigger: \"py-0.5\"\n\t},\n\tvariants: {\n\t\tsub: {\n\t\t\ttrue: { wrapper: \"-ml-0.5 px-0.5 py-2\" }\n\t\t}\n\t}\n});\n\nexport type GlassToolbarTriggerChevronProps = GlassToolbarTriggerProps & {\n\tsub?: boolean;\n};\n\nexport const GlassToolbarTriggerChevron = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarButton>,\n\tGlassToolbarTriggerChevronProps\n>(({ className, children, sub, ...props }, ref) => {\n\tconst styles = glassToolbarTriggerChevronStyles();\n\n\treturn (\n\t\t<GlassToolbarTrigger ref={ref} data-stick-left className={styles.wrapper({ className, sub })} {...props}>\n\t\t\t{children}\n\t\t\t<GlassToolbarSubTrigger className={styles.subtrigger()} />\n\t\t</GlassToolbarTrigger>\n\t);\n});\n\nGlassToolbarTriggerChevron.displayName = \"GlassToolbarTriggerChevron\";\n"],"names":["glassToolbarStyles","tv","GlassToolbar","React","className","props","ref","jsx","ToolbarPrimitive.Root","glassToolbarButtonStyles","GlassToolbarButton","ToolbarPrimitive.ToolbarButton","glassToolbarIconStyles","GlassToolbarIcon","Icon","glassToolbarTextStyles","GlassToolbarText","glassToolbarSubTriggerStyles","GlassToolbarSubTrigger","icon","styles","ChevronDown","glassToolbarToggleGroupStyles","GlassToolbarToggleGroup","ToolbarPrimitive.ToggleGroup","glassToolbarToggleStyles","GlassToolbarToggleItem","children","ToolbarPrimitive.ToolbarToggleItem","glassToolbarSeparatorStyles","GlassToolbarSeparator","ToolbarPrimitive.ToolbarSeparator","Divider","glassToolbarTriggerStyles","GlassToolbarTrigger","glassToolbarTriggerChevronStyles","GlassToolbarTriggerChevron","sub","jsxs"],"mappings":"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"}
+{"version":3,"file":"glass-toolbar.js","sources":["../../src/components/glass-toolbar/GlassToolbar.tsx"],"sourcesContent":["import * as ToolbarPrimitive from \"@radix-ui/react-toolbar\";\nimport React, { PropsWithChildren } from \"react\";\nimport { tv } from \"tailwind-variants\";\nimport { Divider } from \"../divider/Divider\";\nimport { Icon } from \"../icon\";\nimport { ChevronDown, LucideIcon } from \"lucide-react\";\n\nconst glassToolbarStyles = tv({\n\tbase: \"backdrop-glass-thin flex items-center gap-1 overflow-x-auto rounded-full bg-alpha-50 p-1.5 shadow-glass-sm [scrollbar-width:none]\"\n});\n\nexport type GlassToolbarProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.Root>;\n\nexport const GlassToolbar = React.forwardRef<React.ElementRef<typeof ToolbarPrimitive.Root>, GlassToolbarProps>(\n\t({ className, ...props }, ref) => {\n\t\treturn <ToolbarPrimitive.Root ref={ref} className={glassToolbarStyles({ className })} {...props} />;\n\t}\n);\n\nGlassToolbar.displayName = \"GlassToolbar\";\n\nconst glassToolbarButtonStyles = tv({\n\tbase: \"group inline-flex items-center justify-center gap-1.5 rounded-full p-2 text-primary-fg hover:bg-alpha-high-90 focus-visible:shadow-focus focus-visible:outline-none\"\n});\n\nexport type GlassToolbarButtonProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToolbarButton>;\n\nexport const GlassToolbarButton = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarButton>,\n\tGlassToolbarButtonProps\n>(({ className, ...props }, ref) => (\n\t<ToolbarPrimitive.ToolbarButton ref={ref} className={glassToolbarButtonStyles({ className })} {...props} />\n));\n\nGlassToolbarButton.displayName = \"GlassToolbarButton\";\n\nconst glassToolbarIconStyles = tv({\n\tbase: \"h-4 w-4 text-primary-fg\"\n});\n\nexport type GlassToolbarIconProps = React.ComponentPropsWithoutRef<typeof Icon>;\n\nexport const GlassToolbarIcon = React.forwardRef<React.ElementRef<typeof Icon>, GlassToolbarIconProps>(\n\t({ className, ...props }, ref) => <Icon ref={ref} className={glassToolbarIconStyles({ className })} {...props} />\n);\n\nGlassToolbarIcon.displayName = \"GlassToolbarIcon\";\n\nconst glassToolbarTextStyles = tv({\n\tbase: \"text-base leading-none text-primary-fg\"\n});\n\nexport type GlassToolbarTextProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const GlassToolbarText = React.forwardRef<HTMLDivElement, PropsWithChildren<GlassToolbarTextProps>>(\n\t({ className, ...props }, ref) => <div ref={ref} className={glassToolbarTextStyles({ className })} {...props} />\n);\n\nGlassToolbarText.displayName = \"GlassToolbarText\";\n\nconst glassToolbarSubTriggerStyles = tv({\n\tslots: {\n\t\tbase: \"text-primary-fg\",\n\t\ticon: \"h-2 w-2 stroke-[3px]\"\n\t}\n});\n\nexport type GlassToolbarSubTriggerProps = Omit<React.ComponentPropsWithoutRef<typeof Icon>, \"icon\"> & {\n\ticon?: LucideIcon;\n};\n\nexport const GlassToolbarSubTrigger = React.forwardRef<React.ElementRef<typeof Icon>, GlassToolbarSubTriggerProps>(\n\t({ className, icon, ...props }, ref) => {\n\t\tconst styles = glassToolbarSubTriggerStyles();\n\t\treturn (\n\t\t\t<span className={styles.base({ className })}>\n\t\t\t\t<Icon icon={icon || ChevronDown} ref={ref} className={styles.icon()} {...props} />\n\t\t\t</span>\n\t\t);\n\t}\n);\n\nGlassToolbarSubTrigger.displayName = \"GlassToolbarSubTrigger\";\n\nconst glassToolbarToggleGroupStyles = tv({\n\tbase: \"flex items-center gap-0.5\"\n});\n\nexport type GlassToolbarToggleGroupProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToggleGroup>;\n\nexport const GlassToolbarToggleGroup = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToggleGroup>,\n\tGlassToolbarToggleGroupProps\n>(({ className, ...props }, ref) => (\n\t<ToolbarPrimitive.ToggleGroup ref={ref} className={glassToolbarToggleGroupStyles({ className })} {...props} />\n));\n\nGlassToolbarToggleGroup.displayName = ToolbarPrimitive.ToggleGroup.displayName;\n\nconst glassToolbarToggleStyles = tv({\n\textend: glassToolbarButtonStyles,\n\tbase: \"disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-alpha-high-80\"\n});\n\nexport type GlassToolbarToggleItemProps = React.ComponentPropsWithoutRef<typeof ToolbarPrimitive.ToolbarToggleItem> & {\n\tchildren: React.ReactNode;\n};\n\nexport const GlassToolbarToggleItem = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarToggleItem>,\n\tGlassToolbarToggleItemProps\n>(({ className, children, ...props }, ref) => (\n\t<ToolbarPrimitive.ToolbarToggleItem ref={ref} className={glassToolbarToggleStyles({ className })} {...props}>\n\t\t{children}\n\t</ToolbarPrimitive.ToolbarToggleItem>\n));\n\nGlassToolbarToggleItem.displayName = \"GlassToolbarToggleItem\";\n\nconst glassToolbarSeparatorStyles = tv({\n\tbase: \"h-5 w-px bg-primary-border\"\n});\n\nexport type GlassToolbarSeparatorProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport const GlassToolbarSeparator = React.forwardRef<React.ElementRef<typeof Divider>, GlassToolbarSeparatorProps>(\n\t({ className, ...props }, ref) => (\n\t\t<ToolbarPrimitive.ToolbarSeparator asChild data-orientation=\"vertical\">\n\t\t\t<Divider\n\t\t\t\tref={ref}\n\t\t\t\torientation=\"vertical\"\n\t\t\t\tclassName={glassToolbarSeparatorStyles({ className })}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</ToolbarPrimitive.ToolbarSeparator>\n\t)\n);\n\nGlassToolbarSeparator.displayName = \"GlassToolbarSeparator\";\n\nconst glassToolbarTriggerStyles = tv({\n\tbase: \"data-[state=open]:bg-alpha-high-80\"\n});\n\nexport type GlassToolbarTriggerProps = GlassToolbarButtonProps & {\n\t\"data-state\"?: \"open\" | \"closed\";\n};\n\nexport const GlassToolbarTrigger = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarButton>,\n\tGlassToolbarTriggerProps\n>(({ className, children, ...props }, ref) => (\n\t<GlassToolbarButton ref={ref} data-stick-left className={glassToolbarTriggerStyles({ className })} {...props}>\n\t\t{children}\n\t</GlassToolbarButton>\n));\n\nGlassToolbarTrigger.displayName = \"GlassToolbarTrigger\";\n\nconst glassToolbarTriggerChevronStyles = tv({\n\tslots: {\n\t\twrapper: \"\",\n\t\tsubtrigger: \"py-0.5\"\n\t},\n\tvariants: {\n\t\tsub: {\n\t\t\ttrue: { wrapper: \"-ml-0.5 px-0.5 py-2\" }\n\t\t}\n\t}\n});\n\nexport type GlassToolbarTriggerChevronProps = GlassToolbarTriggerProps & {\n\tsub?: boolean;\n};\n\nexport const GlassToolbarTriggerChevron = React.forwardRef<\n\tReact.ElementRef<typeof ToolbarPrimitive.ToolbarButton>,\n\tGlassToolbarTriggerChevronProps\n>(({ className, children, sub, ...props }, ref) => {\n\tconst styles = glassToolbarTriggerChevronStyles();\n\n\treturn (\n\t\t<GlassToolbarTrigger ref={ref} data-stick-left className={styles.wrapper({ className, sub })} {...props}>\n\t\t\t{children}\n\t\t\t<GlassToolbarSubTrigger className={styles.subtrigger()} />\n\t\t</GlassToolbarTrigger>\n\t);\n});\n\nGlassToolbarTriggerChevron.displayName = \"GlassToolbarTriggerChevron\";\n"],"names":["glassToolbarStyles","tv","GlassToolbar","React","className","props","ref","jsx","ToolbarPrimitive.Root","glassToolbarButtonStyles","GlassToolbarButton","ToolbarPrimitive.ToolbarButton","glassToolbarIconStyles","GlassToolbarIcon","Icon","glassToolbarTextStyles","GlassToolbarText","glassToolbarSubTriggerStyles","GlassToolbarSubTrigger","icon","styles","ChevronDown","glassToolbarToggleGroupStyles","GlassToolbarToggleGroup","ToolbarPrimitive.ToggleGroup","glassToolbarToggleStyles","GlassToolbarToggleItem","children","ToolbarPrimitive.ToolbarToggleItem","glassToolbarSeparatorStyles","GlassToolbarSeparator","ToolbarPrimitive.ToolbarSeparator","Divider","glassToolbarTriggerStyles","GlassToolbarTrigger","glassToolbarTriggerChevronStyles","GlassToolbarTriggerChevron","sub","jsxs"],"mappings":"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"}

package/dist/components/sidebar/Sidebar.stories.d.ts

@@ -1,6 +1,7 @@
-import { StoryObj } from '@storybook/react';
+import { StoryObj, ReactRenderer } from '@storybook/react';
 import { Sidebar } from './Sidebar';
-import { ForwardRefExoticComponent, ClassAttributes, HTMLAttributes, RefAttributes } from 'react';
+import { ForwardRefExoticComponent, ClassAttributes, HTMLAttributes, RefAttributes, ReactNode, CSSProperties, AriaRole, ClipboardEventHandler, CompositionEventHandler, FocusEventHandler, FormEventHandler, ReactEventHandler, KeyboardEventHandler, MouseEventHandler, DragEventHandler, TouchEventHandler, PointerEventHandler, UIEventHandler, WheelEventHandler, AnimationEventHandler, TransitionEventHandler, Key, LegacyRef } from 'react';
+import { PartialStoryFn } from '@storybook/core/csf';
 declare const meta: {
     component: ForwardRefExoticComponent<Omit< ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
         side?: "left" | "right";
@@ -11,6 +12,281 @@ declare const meta: {
         layout: string;
     };
     tags: string[];
+    decorators: ((Story: PartialStoryFn<ReactRenderer, {
+        children?: ReactNode | undefined;
+        defaultChecked?: boolean | undefined;
+        defaultValue?: string | number | readonly string[] | undefined;
+        suppressContentEditableWarning?: boolean | undefined;
+        suppressHydrationWarning?: boolean | undefined;
+        accessKey?: string | undefined;
+        autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
+        autoFocus?: boolean | undefined;
+        className?: string | undefined;
+        contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
+        contextMenu?: string | undefined;
+        dir?: string | undefined;
+        draggable?: (boolean | "true" | "false") | undefined;
+        enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
+        hidden?: boolean | undefined;
+        id?: string | undefined;
+        lang?: string | undefined;
+        nonce?: string | undefined;
+        slot?: string | undefined;
+        spellCheck?: (boolean | "true" | "false") | undefined;
+        style?: CSSProperties | undefined;
+        tabIndex?: number | undefined;
+        title?: string | undefined;
+        translate?: "yes" | "no" | undefined;
+        radioGroup?: string | undefined;
+        role?: AriaRole | undefined;
+        about?: string | undefined;
+        content?: string | undefined;
+        datatype?: string | undefined;
+        inlist?: any;
+        prefix?: string | undefined;
+        property?: string | undefined;
+        rel?: string | undefined;
+        resource?: string | undefined;
+        rev?: string | undefined;
+        typeof?: string | undefined;
+        vocab?: string | undefined;
+        autoCorrect?: string | undefined;
+        autoSave?: string | undefined;
+        color?: string | undefined;
+        itemProp?: string | undefined;
+        itemScope?: boolean | undefined;
+        itemType?: string | undefined;
+        itemID?: string | undefined;
+        itemRef?: string | undefined;
+        results?: number | undefined;
+        security?: string | undefined;
+        unselectable?: "on" | "off" | undefined;
+        inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
+        is?: string | undefined;
+        exportparts?: string | undefined;
+        part?: string | undefined;
+        "aria-activedescendant"?: string | undefined;
+        "aria-atomic"?: (boolean | "true" | "false") | undefined;
+        "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
+        "aria-braillelabel"?: string | undefined;
+        "aria-brailleroledescription"?: string | undefined;
+        "aria-busy"?: (boolean | "true" | "false") | undefined;
+        "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
+        "aria-colcount"?: number | undefined;
+        "aria-colindex"?: number | undefined;
+        "aria-colindextext"?: string | undefined;
+        "aria-colspan"?: number | undefined;
+        "aria-controls"?: string | undefined;
+        "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
+        "aria-describedby"?: string | undefined;
+        "aria-description"?: string | undefined;
+        "aria-details"?: string | undefined;
+        "aria-disabled"?: (boolean | "true" | "false") | undefined;
+        "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
+        "aria-errormessage"?: string | undefined;
+        "aria-expanded"?: (boolean | "true" | "false") | undefined;
+        "aria-flowto"?: string | undefined;
+        "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+        "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
+        "aria-hidden"?: (boolean | "true" | "false") | undefined;
+        "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+        "aria-keyshortcuts"?: string | undefined;
+        "aria-label"?: string | undefined;
+        "aria-labelledby"?: string | undefined;
+        "aria-level"?: number | undefined;
+        "aria-live"?: "off" | "assertive" | "polite" | undefined;
+        "aria-modal"?: (boolean | "true" | "false") | undefined;
+        "aria-multiline"?: (boolean | "true" | "false") | undefined;
+        "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+        "aria-orientation"?: "horizontal" | "vertical" | undefined;
+        "aria-owns"?: string | undefined;
+        "aria-placeholder"?: string | undefined;
+        "aria-posinset"?: number | undefined;
+        "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
+        "aria-readonly"?: (boolean | "true" | "false") | undefined;
+        "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
+        "aria-required"?: (boolean | "true" | "false") | undefined;
+        "aria-roledescription"?: string | undefined;
+        "aria-rowcount"?: number | undefined;
+        "aria-rowindex"?: number | undefined;
+        "aria-rowindextext"?: string | undefined;
+        "aria-rowspan"?: number | undefined;
+        "aria-selected"?: (boolean | "true" | "false") | undefined;
+        "aria-setsize"?: number | undefined;
+        "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+        "aria-valuemax"?: number | undefined;
+        "aria-valuemin"?: number | undefined;
+        "aria-valuenow"?: number | undefined;
+        "aria-valuetext"?: string | undefined;
+        dangerouslySetInnerHTML?: {
+            __html: string | TrustedHTML;
+        } | undefined;
+        onCopy?: ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCopyCapture?: ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCut?: ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCutCapture?: ClipboardEventHandler<HTMLDivElement> | undefined;
+        onPaste?: ClipboardEventHandler<HTMLDivElement> | undefined;
+        onPasteCapture?: ClipboardEventHandler<HTMLDivElement> | undefined;
+        onCompositionEnd?: CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionEndCapture?: CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionStart?: CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionStartCapture?: CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionUpdate?: CompositionEventHandler<HTMLDivElement> | undefined;
+        onCompositionUpdateCapture?: CompositionEventHandler<HTMLDivElement> | undefined;
+        onFocus?: FocusEventHandler<HTMLDivElement> | undefined;
+        onFocusCapture?: FocusEventHandler<HTMLDivElement> | undefined;
+        onBlur?: FocusEventHandler<HTMLDivElement> | undefined;
+        onBlurCapture?: FocusEventHandler<HTMLDivElement> | undefined;
+        onChange?: FormEventHandler<HTMLDivElement> | undefined;
+        onChangeCapture?: FormEventHandler<HTMLDivElement> | undefined;
+        onBeforeInput?: FormEventHandler<HTMLDivElement> | undefined;
+        onBeforeInputCapture?: FormEventHandler<HTMLDivElement> | undefined;
+        onInput?: FormEventHandler<HTMLDivElement> | undefined;
+        onInputCapture?: FormEventHandler<HTMLDivElement> | undefined;
+        onReset?: FormEventHandler<HTMLDivElement> | undefined;
+        onResetCapture?: FormEventHandler<HTMLDivElement> | undefined;
+        onSubmit?: FormEventHandler<HTMLDivElement> | undefined;
+        onSubmitCapture?: FormEventHandler<HTMLDivElement> | undefined;
+        onInvalid?: FormEventHandler<HTMLDivElement> | undefined;
+        onInvalidCapture?: FormEventHandler<HTMLDivElement> | undefined;
+        onLoad?: ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onError?: ReactEventHandler<HTMLDivElement> | undefined;
+        onErrorCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onKeyDown?: KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyDownCapture?: KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyPress?: KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyPressCapture?: KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyUp?: KeyboardEventHandler<HTMLDivElement> | undefined;
+        onKeyUpCapture?: KeyboardEventHandler<HTMLDivElement> | undefined;
+        onAbort?: ReactEventHandler<HTMLDivElement> | undefined;
+        onAbortCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlay?: ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlayCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlayThrough?: ReactEventHandler<HTMLDivElement> | undefined;
+        onCanPlayThroughCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onDurationChange?: ReactEventHandler<HTMLDivElement> | undefined;
+        onDurationChangeCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onEmptied?: ReactEventHandler<HTMLDivElement> | undefined;
+        onEmptiedCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onEncrypted?: ReactEventHandler<HTMLDivElement> | undefined;
+        onEncryptedCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onEnded?: ReactEventHandler<HTMLDivElement> | undefined;
+        onEndedCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedData?: ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedDataCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedMetadata?: ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadedMetadataCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadStart?: ReactEventHandler<HTMLDivElement> | undefined;
+        onLoadStartCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onPause?: ReactEventHandler<HTMLDivElement> | undefined;
+        onPauseCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onPlay?: ReactEventHandler<HTMLDivElement> | undefined;
+        onPlayCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onPlaying?: ReactEventHandler<HTMLDivElement> | undefined;
+        onPlayingCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onProgress?: ReactEventHandler<HTMLDivElement> | undefined;
+        onProgressCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onRateChange?: ReactEventHandler<HTMLDivElement> | undefined;
+        onRateChangeCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onResize?: ReactEventHandler<HTMLDivElement> | undefined;
+        onResizeCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onSeeked?: ReactEventHandler<HTMLDivElement> | undefined;
+        onSeekedCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onSeeking?: ReactEventHandler<HTMLDivElement> | undefined;
+        onSeekingCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onStalled?: ReactEventHandler<HTMLDivElement> | undefined;
+        onStalledCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onSuspend?: ReactEventHandler<HTMLDivElement> | undefined;
+        onSuspendCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onTimeUpdate?: ReactEventHandler<HTMLDivElement> | undefined;
+        onTimeUpdateCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onVolumeChange?: ReactEventHandler<HTMLDivElement> | undefined;
+        onVolumeChangeCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onWaiting?: ReactEventHandler<HTMLDivElement> | undefined;
+        onWaitingCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onAuxClick?: MouseEventHandler<HTMLDivElement> | undefined;
+        onAuxClickCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onClick?: MouseEventHandler<HTMLDivElement> | undefined;
+        onClickCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onContextMenu?: MouseEventHandler<HTMLDivElement> | undefined;
+        onContextMenuCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onDoubleClick?: MouseEventHandler<HTMLDivElement> | undefined;
+        onDoubleClickCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onDrag?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragEnd?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragEndCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragEnter?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragEnterCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragExit?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragExitCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragLeave?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragLeaveCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragOver?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragOverCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragStart?: DragEventHandler<HTMLDivElement> | undefined;
+        onDragStartCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onDrop?: DragEventHandler<HTMLDivElement> | undefined;
+        onDropCapture?: DragEventHandler<HTMLDivElement> | undefined;
+        onMouseDown?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseDownCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseEnter?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseLeave?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseMove?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseMoveCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOut?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOutCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOver?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseOverCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseUp?: MouseEventHandler<HTMLDivElement> | undefined;
+        onMouseUpCapture?: MouseEventHandler<HTMLDivElement> | undefined;
+        onSelect?: ReactEventHandler<HTMLDivElement> | undefined;
+        onSelectCapture?: ReactEventHandler<HTMLDivElement> | undefined;
+        onTouchCancel?: TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchCancelCapture?: TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchEnd?: TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchEndCapture?: TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchMove?: TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchMoveCapture?: TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchStart?: TouchEventHandler<HTMLDivElement> | undefined;
+        onTouchStartCapture?: TouchEventHandler<HTMLDivElement> | undefined;
+        onPointerDown?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerDownCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerMove?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerMoveCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerUp?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerUpCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerCancel?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerCancelCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerEnter?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerLeave?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOver?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOverCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOut?: PointerEventHandler<HTMLDivElement> | undefined;
+        onPointerOutCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onGotPointerCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onGotPointerCaptureCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onLostPointerCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onLostPointerCaptureCapture?: PointerEventHandler<HTMLDivElement> | undefined;
+        onScroll?: UIEventHandler<HTMLDivElement> | undefined;
+        onScrollCapture?: UIEventHandler<HTMLDivElement> | undefined;
+        onWheel?: WheelEventHandler<HTMLDivElement> | undefined;
+        onWheelCapture?: WheelEventHandler<HTMLDivElement> | undefined;
+        onAnimationStart?: AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationStartCapture?: AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationEnd?: AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationEndCapture?: AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationIteration?: AnimationEventHandler<HTMLDivElement> | undefined;
+        onAnimationIterationCapture?: AnimationEventHandler<HTMLDivElement> | undefined;
+        onTransitionEnd?: TransitionEventHandler<HTMLDivElement> | undefined;
+        onTransitionEndCapture?: TransitionEventHandler<HTMLDivElement> | undefined;
+        key?: Key | null | undefined;
+        variant?: ("sidebar" | "floating" | "inset") | undefined;
+        side?: ("left" | "right") | undefined;
+        collapsible?: ("offcanvas" | "icon" | "none") | undefined;
+        ref?: LegacyRef<HTMLDivElement> | undefined;
+    }>) => import("react/jsx-runtime").JSX.Element)[];
 };
 export default meta;
 type Story = StoryObj<typeof Sidebar>;

package/dist/components/sidebar/SidebarContext.d.ts

@@ -7,6 +7,8 @@ export type SidebarContextProps = {
     setOpenMobile: (open: boolean) => void;
     isMobile: boolean;
     toggleSidebar: () => void;
+    hasInset: boolean;
+    setHasInset: (hasInset: boolean) => void;
 };
 export declare const SidebarContext: React.Context<SidebarContextProps | null>;
 export declare function useSidebar(): SidebarContextProps;