@psnext/design-system 2.4.0 → 2.6.0

package/dist/index47.d.cts

@@ -1,41 +1,96 @@
-import * as react_jsx_runtime22 from "react/jsx-runtime";
-import { RadioGroup } from "radix-ui";
+import { r as PopoverContent, t as Popover } from "./index21.cjs";
+import * as react_jsx_runtime29 from "react/jsx-runtime";
 import * as React from "react";
 
-//#region src/primitives/RadioGroup/RadioGroup.d.ts
-/** Root of a set of mutually-exclusive radio options; lays them out vertically or horizontally. */
-declare function RadioGroup$1({
+//#region src/patterns/NavRail/NavRail.d.ts
+type NavRailMode = "icon" | "text" | "expanded" | "expand-on-hover";
+/** The vertical navigation rail container; sets the display `mode` for all items via context. */
+declare function NavRail({
+  mode,
   className,
-  orientation,
   ...props
-}: React.ComponentProps<typeof RadioGroup.Root> & {
-  /** Stack the items in a column (`vertical`) or wrap them in a row (`horizontal`). */
-  orientation?: "vertical" | "horizontal";
-}): react_jsx_runtime22.JSX.Element;
-/** A single selectable radio control; pair it with a label for accessible option text. */
-declare function RadioGroupItem({
+}: React.ComponentProps<"nav"> & {
+  /** Display mode for the rail and its items: icon-only (tooltips), text-only, expanded (icon + text), or expand-on-hover. */
+  mode?: NavRailMode;
+}): react_jsx_runtime29.JSX.Element;
+/** A thin divider between groups of rail items. */
+declare function NavRailSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof RadioGroup.Item>): react_jsx_runtime22.JSX.Element;
-/** A card-style radio option with a bordered surface, title, and description that highlights when checked. */
-declare function RichRadioItem({
+}: React.ComponentProps<"div">): react_jsx_runtime29.JSX.Element;
+type NavRailItemProps = Omit<React.ComponentProps<"button">, "aria-label"> & {
+  /** Tooltip text (icon mode) + accessible name + inline label (text/expanded). */
+  label: string;
+  /** Marks the item as the current page (active styling + `aria-current="page"`). */
+  active?: boolean;
+  /** Render the child element instead of a <button> (e.g. a router link). */
+  asChild?: boolean;
+  /** Which side the tooltip opens on in icon mode. */
+  tooltipSide?: "top" | "right" | "bottom" | "left";
+};
+/** A single navigation entry; an icon (as children) plus a `label`, with a tooltip in icon mode. */
+declare function NavRailItem({
+  label,
+  active,
+  asChild,
+  tooltipSide,
   className,
-  value,
-  title,
-  description,
-  flipped,
-  id,
+  children,
   ...props
-}: Omit<React.ComponentProps<typeof RadioGroup.Item>, "children"> & {
-  /** Value submitted when this option is selected. */
-  value: string;
-  /** Bold heading shown at the top of the card. */
-  title?: React.ReactNode;
-  /** Secondary muted text shown beneath the title. */
-  description?: React.ReactNode;
-  /** Place the radio control on the trailing edge instead of the leading edge. */
-  flipped?: boolean;
-}): react_jsx_runtime22.JSX.Element;
+}: NavRailItemProps): react_jsx_runtime29.JSX.Element;
+type NavRailUserProps = React.ComponentProps<"div"> & {
+  /** The avatar element (e.g. an <Avatar />). */
+  avatar: React.ReactNode;
+  /** The user's display name (hidden in icon mode). */
+  name: React.ReactNode;
+  /** The user's secondary line, e.g. email (hidden in icon mode). */
+  email: React.ReactNode;
+};
+/** The footer slot of the rail showing the signed-in user (avatar + name + email). */
+declare function NavRailUser({
+  avatar,
+  name,
+  email,
+  className,
+  ...props
+}: NavRailUserProps): react_jsx_runtime29.JSX.Element;
+/** Root for a rail item that opens a flyout submenu (wraps Popover). */
+declare function NavRailMenu(props: React.ComponentProps<typeof Popover>): react_jsx_runtime29.JSX.Element;
+type NavRailMenuTriggerProps = Omit<React.ComponentProps<"button">, "aria-label"> & {
+  /** Tooltip/accessible name + inline label for the trigger item. */
+  label: string;
+  /** Marks the trigger as active (current section) styling. */
+  active?: boolean;
+};
+/** The rail item that opens its flyout submenu; renders a chevron affordance. */
+declare function NavRailMenuTrigger({
+  label,
+  active,
+  className,
+  children,
+  ...props
+}: NavRailMenuTriggerProps): react_jsx_runtime29.JSX.Element;
+/** The glass flyout panel that holds the submenu items (portalled Popover content). */
+declare function NavRailMenuContent({
+  className,
+  side,
+  align,
+  sideOffset,
+  ...props
+}: React.ComponentProps<typeof PopoverContent>): react_jsx_runtime29.JSX.Element;
+type NavRailMenuItemProps = React.ComponentProps<"button"> & {
+  /** Marks the entry as the current page (active styling + `aria-current="page"`). */
+  active?: boolean;
+  /** Render the child element instead of a <button> (e.g. a router link). */
+  asChild?: boolean;
+};
+/** A single entry inside a NavRail flyout submenu. */
+declare function NavRailMenuItem({
+  className,
+  active,
+  asChild,
+  ...props
+}: NavRailMenuItemProps): react_jsx_runtime29.JSX.Element;
 //#endregion
-export { RadioGroupItem as n, RichRadioItem as r, RadioGroup$1 as t };
+export { NavRailMenuContent as a, NavRailMenuTrigger as c, NavRailSeparator as d, NavRailUser as f, NavRailMenu as i, NavRailMenuTriggerProps as l, NavRailItem as n, NavRailMenuItem as o, NavRailUserProps as p, NavRailItemProps as r, NavRailMenuItemProps as s, NavRail as t, NavRailMode as u };
 //# sourceMappingURL=index47.d.cts.map

package/dist/index47.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index47.d.cts","names":[],"sources":["../src/primitives/RadioGroup/RadioGroup.tsx"],"mappings":";;;;;;iBASS,YAAA;;;;GAIN,KAAA,CAAM,sBAAsB,UAAA,CAAoB;;EAJ1C,WAAA,CAAA,EAAA,UAAU,GAAA,YAAA;CAAA,CAAA,EAOlB,mBAAA,CAAA,GAAA,CAAA,OAPkB;;iBAuBV,cAAA,CArBP;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAwBC,KAAA,CAAM,cAxBP,CAAA,OAwB6B,UAAA,CAAoB,IAxBjD,CAAA,CAAA,EAwBsD,mBAAA,CAAA,GAAA,CAAA,OAxBtD;;iBAkDO,aAAA,CAhDA;EAAA,SAAA;EAAA,KAAA;EAAA,KAAA;EAAA,WAAA;EAAA,OAAA;EAAA,EAAA;EAAA,GAAA;AAsB+C,CAtB/C,EAwDN,IAxDM,CAwDD,KAAA,CAAM,cAxDL,CAAA,OAwD2B,UAAA,CAAoB,IAxD/C,CAAA,EAAA,UAAA,CAAA,GAAA;;EAGR,KAAA,EAAA,MAAA;EAgBQ;EAAc,KAAA,CAAA,EAyCb,KAAA,CAAM,SAzCO;;aAGQ,CAAA,EAwCf,KAAA,CAAM,SAxC6B;;SAAK,CAAA,EAAA,OAAA;AAAA,CAAA,CAAA,EA2CvD,mBAAA,CAAA,GAAA,CAAA,OA3CuD"}
+{"version":3,"file":"index47.d.cts","names":[],"sources":["../src/patterns/NavRail/NavRail.tsx"],"mappings":";;;;;KA2BK,WAAA;;iBAkDI,OAAA;;;;GAIN,KAAA,CAAM;EAtDJ;EAkDI,IAAA,CAAA,EAMA,WANO;CAAA,CAAA,EAOf,mBAAA,CAAA,GAAA,CAAA,OAPe;;iBAyBP,gBAAA,CAvBP;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAuBiD,KAAA,CAAM,cAvBvD,CAAA,KAAA,CAAA,CAAA,EAuB4E,mBAAA,CAAA,GAAA,CAAA,OAvB5E;KAkCG,gBAAA,GAAmB,IAhCf,CAgCoB,KAAA,CAAM,cAhC1B,CAAA,QAAA,CAAA,EAAA,YAAA,CAAA,GAAA;;OAGR,EAAA,MAAA;EAAA;EAkBQ,MAAA,CAAA,EAAA,OAAA;EAAgB;SAAG,CAAA,EAAA,OAAA;;aAAkD,CAAA,EAAA,KAAA,GAAA,OAAA,GAAA,QAAA,GAAA,MAAA;AAAA,CAAA;AAAA;iBAuBrE,WAAA,CAZY;EAAA,KAAA;EAAA,MAAA;EAAA,OAAA;EAAA,WAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAoBlB,gBApBkB,CAAA,EAoBF,mBAAA,CAAA,GAAA,CAAA,OApBE;KA6DhB,gBAAA,GAAmB,KAAA,CAAM,cA7DK,CAAA,KAAA,CAAA,GAAA;;EAAP,MAAA,EA+DlB,KAAA,CAAM,SA/DY;EAYnB;EAAW,IAAA,EAqDZ,KAAA,CAAM,SArDM;;OAElB,EAqDO,KAAA,CAAM,SArDb;;;iBAyDO,WAAA,CAtDP;EAAA,MAAA;EAAA,IAAA;EAAA,KAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAsDiE,gBAtDjE,CAAA,EAsDiF,mBAAA,CAAA,GAAA,CAAA,OAtDjF;;iBA0FO,WAAA,CAvFN,KAAA,EAuFyB,KAAA,CAAM,cAvF/B,CAAA,OAuFqD,OAvFrD,CAAA,CAAA,EAuF6D,mBAAA,CAAA,GAAA,CAAA,OAvF7D;KA2FE,uBAAA,GAA0B,IA3FZ,CA2FiB,KAAA,CAAM,cA3FvB,CAAA,QAAA,CAAA,EAAA,YAAA,CAAA,GAAA;EAAA;EAyCd,KAAA,EAAA,MAAA;EAAgB;QAAG,CAAA,EAAM,OAAA;;;iBA0DrB,kBAAA,CApDM;EAAA,KAAA;EAAA,MAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EA0DZ,uBA1DY,CAAA,EA0DW,mBAAA,CAAA,GAAA,CAAA,OA1DX;AAAS;AAAA,iBAmFf,kBAAA,CA/EW;EAAA,SAAA;EAAA,IAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,CAAA,EAqFjB,KAAA,CAAM,cArFW,CAAA,OAqFW,cArFX,CAAA,CAAA,EAqF0B,mBAAA,CAAA,GAAA,CAAA,OArF1B;KAuGf,oBAAA,GAAuB,KAAA,CAAM,cAvGd,CAAA,QAAA,CAAA,GAAA;;QAAW,CAAA,EAAA,OAAA;;SAAa,CAAA,EAAA,OAAA;;;AAAuC,iBA+G1E,eAAA,CA/G0E;EAAA,SAAA;EAAA,MAAA;EAAA,OAAA;EAAA,GAAA;AAAA,CAAA,EA+GR,oBA/GQ,CAAA,EA+GY,mBAAA,CAAA,GAAA,CAAA,OA/GZ"}

package/dist/index47.d.ts

@@ -1,41 +1,96 @@
+import { r as PopoverContent, t as Popover } from "./index21.js";
 import * as React from "react";
-import * as react_jsx_runtime42 from "react/jsx-runtime";
-import { RadioGroup } from "radix-ui";
+import * as react_jsx_runtime290 from "react/jsx-runtime";
 
-//#region src/primitives/RadioGroup/RadioGroup.d.ts
-/** Root of a set of mutually-exclusive radio options; lays them out vertically or horizontally. */
-declare function RadioGroup$1({
+//#region src/patterns/NavRail/NavRail.d.ts
+type NavRailMode = "icon" | "text" | "expanded" | "expand-on-hover";
+/** The vertical navigation rail container; sets the display `mode` for all items via context. */
+declare function NavRail({
+  mode,
   className,
-  orientation,
   ...props
-}: React.ComponentProps<typeof RadioGroup.Root> & {
-  /** Stack the items in a column (`vertical`) or wrap them in a row (`horizontal`). */
-  orientation?: "vertical" | "horizontal";
-}): react_jsx_runtime42.JSX.Element;
-/** A single selectable radio control; pair it with a label for accessible option text. */
-declare function RadioGroupItem({
+}: React.ComponentProps<"nav"> & {
+  /** Display mode for the rail and its items: icon-only (tooltips), text-only, expanded (icon + text), or expand-on-hover. */
+  mode?: NavRailMode;
+}): react_jsx_runtime290.JSX.Element;
+/** A thin divider between groups of rail items. */
+declare function NavRailSeparator({
   className,
   ...props
-}: React.ComponentProps<typeof RadioGroup.Item>): react_jsx_runtime42.JSX.Element;
-/** A card-style radio option with a bordered surface, title, and description that highlights when checked. */
-declare function RichRadioItem({
+}: React.ComponentProps<"div">): react_jsx_runtime290.JSX.Element;
+type NavRailItemProps = Omit<React.ComponentProps<"button">, "aria-label"> & {
+  /** Tooltip text (icon mode) + accessible name + inline label (text/expanded). */
+  label: string;
+  /** Marks the item as the current page (active styling + `aria-current="page"`). */
+  active?: boolean;
+  /** Render the child element instead of a <button> (e.g. a router link). */
+  asChild?: boolean;
+  /** Which side the tooltip opens on in icon mode. */
+  tooltipSide?: "top" | "right" | "bottom" | "left";
+};
+/** A single navigation entry; an icon (as children) plus a `label`, with a tooltip in icon mode. */
+declare function NavRailItem({
+  label,
+  active,
+  asChild,
+  tooltipSide,
   className,
-  value,
-  title,
-  description,
-  flipped,
-  id,
+  children,
   ...props
-}: Omit<React.ComponentProps<typeof RadioGroup.Item>, "children"> & {
-  /** Value submitted when this option is selected. */
-  value: string;
-  /** Bold heading shown at the top of the card. */
-  title?: React.ReactNode;
-  /** Secondary muted text shown beneath the title. */
-  description?: React.ReactNode;
-  /** Place the radio control on the trailing edge instead of the leading edge. */
-  flipped?: boolean;
-}): react_jsx_runtime42.JSX.Element;
+}: NavRailItemProps): react_jsx_runtime290.JSX.Element;
+type NavRailUserProps = React.ComponentProps<"div"> & {
+  /** The avatar element (e.g. an <Avatar />). */
+  avatar: React.ReactNode;
+  /** The user's display name (hidden in icon mode). */
+  name: React.ReactNode;
+  /** The user's secondary line, e.g. email (hidden in icon mode). */
+  email: React.ReactNode;
+};
+/** The footer slot of the rail showing the signed-in user (avatar + name + email). */
+declare function NavRailUser({
+  avatar,
+  name,
+  email,
+  className,
+  ...props
+}: NavRailUserProps): react_jsx_runtime290.JSX.Element;
+/** Root for a rail item that opens a flyout submenu (wraps Popover). */
+declare function NavRailMenu(props: React.ComponentProps<typeof Popover>): react_jsx_runtime290.JSX.Element;
+type NavRailMenuTriggerProps = Omit<React.ComponentProps<"button">, "aria-label"> & {
+  /** Tooltip/accessible name + inline label for the trigger item. */
+  label: string;
+  /** Marks the trigger as active (current section) styling. */
+  active?: boolean;
+};
+/** The rail item that opens its flyout submenu; renders a chevron affordance. */
+declare function NavRailMenuTrigger({
+  label,
+  active,
+  className,
+  children,
+  ...props
+}: NavRailMenuTriggerProps): react_jsx_runtime290.JSX.Element;
+/** The glass flyout panel that holds the submenu items (portalled Popover content). */
+declare function NavRailMenuContent({
+  className,
+  side,
+  align,
+  sideOffset,
+  ...props
+}: React.ComponentProps<typeof PopoverContent>): react_jsx_runtime290.JSX.Element;
+type NavRailMenuItemProps = React.ComponentProps<"button"> & {
+  /** Marks the entry as the current page (active styling + `aria-current="page"`). */
+  active?: boolean;
+  /** Render the child element instead of a <button> (e.g. a router link). */
+  asChild?: boolean;
+};
+/** A single entry inside a NavRail flyout submenu. */
+declare function NavRailMenuItem({
+  className,
+  active,
+  asChild,
+  ...props
+}: NavRailMenuItemProps): react_jsx_runtime290.JSX.Element;
 //#endregion
-export { RadioGroupItem as n, RichRadioItem as r, RadioGroup$1 as t };
+export { NavRailMenuContent as a, NavRailMenuTrigger as c, NavRailSeparator as d, NavRailUser as f, NavRailMenu as i, NavRailMenuTriggerProps as l, NavRailItem as n, NavRailMenuItem as o, NavRailUserProps as p, NavRailItemProps as r, NavRailMenuItemProps as s, NavRail as t, NavRailMode as u };
 //# sourceMappingURL=index47.d.ts.map

package/dist/index47.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index47.d.ts","names":[],"sources":["../src/primitives/RadioGroup/RadioGroup.tsx"],"mappings":";;;;;;iBASS,YAAA;;;;GAIN,KAAA,CAAM,sBAAsB,UAAA,CAAoB;;EAJ1C,WAAA,CAAA,EAAA,UAAU,GAAA,YAAA;CAAA,CAAA,EAOlB,mBAAA,CAAA,GAAA,CAAA,OAPkB;;iBAuBV,cAAA,CArBP;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAwBC,KAAA,CAAM,cAxBP,CAAA,OAwB6B,UAAA,CAAoB,IAxBjD,CAAA,CAAA,EAwBsD,mBAAA,CAAA,GAAA,CAAA,OAxBtD;;iBAkDO,aAAA,CAhDA;EAAA,SAAA;EAAA,KAAA;EAAA,KAAA;EAAA,WAAA;EAAA,OAAA;EAAA,EAAA;EAAA,GAAA;AAsB+C,CAtB/C,EAwDN,IAxDM,CAwDD,KAAA,CAAM,cAxDL,CAAA,OAwD2B,UAAA,CAAoB,IAxD/C,CAAA,EAAA,UAAA,CAAA,GAAA;;EAGR,KAAA,EAAA,MAAA;EAgBQ;EAAc,KAAA,CAAA,EAyCb,KAAA,CAAM,SAzCO;;aAGQ,CAAA,EAwCf,KAAA,CAAM,SAxC6B;;SAAK,CAAA,EAAA,OAAA;AAAA,CAAA,CAAA,EA2CvD,mBAAA,CAAA,GAAA,CAAA,OA3CuD"}
+{"version":3,"file":"index47.d.ts","names":[],"sources":["../src/patterns/NavRail/NavRail.tsx"],"mappings":";;;;;KA2BK,WAAA;;iBAkDI,OAAA;;;;GAIN,KAAA,CAAM;EAtDJ;EAkDI,IAAA,CAAA,EAMA,WANO;CAAA,CAAA,EAOf,oBAAA,CAAA,GAAA,CAAA,OAPe;;iBAyBP,gBAAA,CAvBP;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAuBiD,KAAA,CAAM,cAvBvD,CAAA,KAAA,CAAA,CAAA,EAuB4E,oBAAA,CAAA,GAAA,CAAA,OAvB5E;KAkCG,gBAAA,GAAmB,IAhCf,CAgCoB,KAAA,CAAM,cAhC1B,CAAA,QAAA,CAAA,EAAA,YAAA,CAAA,GAAA;;OAGR,EAAA,MAAA;EAAA;EAkBQ,MAAA,CAAA,EAAA,OAAA;EAAgB;SAAG,CAAA,EAAA,OAAA;;aAAkD,CAAA,EAAA,KAAA,GAAA,OAAA,GAAA,QAAA,GAAA,MAAA;AAAA,CAAA;AAAA;iBAuBrE,WAAA,CAZY;EAAA,KAAA;EAAA,MAAA;EAAA,OAAA;EAAA,WAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAoBlB,gBApBkB,CAAA,EAoBF,oBAAA,CAAA,GAAA,CAAA,OApBE;KA6DhB,gBAAA,GAAmB,KAAA,CAAM,cA7DK,CAAA,KAAA,CAAA,GAAA;;EAAP,MAAA,EA+DlB,KAAA,CAAM,SA/DY;EAYnB;EAAW,IAAA,EAqDZ,KAAA,CAAM,SArDM;;OAElB,EAqDO,KAAA,CAAM,SArDb;;;iBAyDO,WAAA,CAtDP;EAAA,MAAA;EAAA,IAAA;EAAA,KAAA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAsDiE,gBAtDjE,CAAA,EAsDiF,oBAAA,CAAA,GAAA,CAAA,OAtDjF;;iBA0FO,WAAA,CAvFN,KAAA,EAuFyB,KAAA,CAAM,cAvF/B,CAAA,OAuFqD,OAvFrD,CAAA,CAAA,EAuF6D,oBAAA,CAAA,GAAA,CAAA,OAvF7D;KA2FE,uBAAA,GAA0B,IA3FZ,CA2FiB,KAAA,CAAM,cA3FvB,CAAA,QAAA,CAAA,EAAA,YAAA,CAAA,GAAA;EAAA;EAyCd,KAAA,EAAA,MAAA;EAAgB;QAAG,CAAA,EAAM,OAAA;;;iBA0DrB,kBAAA,CApDM;EAAA,KAAA;EAAA,MAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EA0DZ,uBA1DY,CAAA,EA0DW,oBAAA,CAAA,GAAA,CAAA,OA1DX;AAAS;AAAA,iBAmFf,kBAAA,CA/EW;EAAA,SAAA;EAAA,IAAA;EAAA,KAAA;EAAA,UAAA;EAAA,GAAA;AAAA,CAAA,EAqFjB,KAAA,CAAM,cArFW,CAAA,OAqFW,cArFX,CAAA,CAAA,EAqF0B,oBAAA,CAAA,GAAA,CAAA,OArF1B;KAuGf,oBAAA,GAAuB,KAAA,CAAM,cAvGd,CAAA,QAAA,CAAA,GAAA;;QAAW,CAAA,EAAA,OAAA;;SAAa,CAAA,EAAA,OAAA;;;AAAuC,iBA+G1E,eAAA,CA/G0E;EAAA,SAAA;EAAA,MAAA;EAAA,OAAA;EAAA,GAAA;AAAA,CAAA,EA+GR,oBA/GQ,CAAA,EA+GY,oBAAA,CAAA,GAAA,CAAA,OA/GZ"}

package/dist/index48.d.cts

@@ -1,25 +1 @@
-import * as react_jsx_runtime9 from "react/jsx-runtime";
-import * as ResizablePrimitive from "react-resizable-panels";
-
-//#region src/primitives/Resizable/Resizable.d.ts
-/** Root container that lays out `ResizablePanel`s and `ResizableHandle`s and drives resize behaviour (set `orientation` to switch axis). */
-declare function ResizablePanelGroup({
-  className,
-  ...props
-}: ResizablePrimitive.GroupProps): react_jsx_runtime9.JSX.Element;
-/** A single resizable region within a `ResizablePanelGroup`; size it with `defaultSize`/`minSize`/`maxSize`. */
-declare function ResizablePanel({
-  ...props
-}: ResizablePrimitive.PanelProps): react_jsx_runtime9.JSX.Element;
-/** Draggable divider between two panels; pass `withHandle` to render a visible grip affordance. */
-declare function ResizableHandle({
-  withHandle,
-  className,
-  ...props
-}: ResizablePrimitive.SeparatorProps & {
-  /** Renders a visible grip icon centred on the divider. */
-  withHandle?: boolean;
-}): react_jsx_runtime9.JSX.Element;
-//#endregion
-export { ResizablePanel as n, ResizablePanelGroup as r, ResizableHandle as t };
-//# sourceMappingURL=index48.d.cts.map
+export {};

package/dist/index48.d.ts

@@ -1,25 +1 @@
-import * as react_jsx_runtime300 from "react/jsx-runtime";
-import * as ResizablePrimitive from "react-resizable-panels";
-
-//#region src/primitives/Resizable/Resizable.d.ts
-/** Root container that lays out `ResizablePanel`s and `ResizableHandle`s and drives resize behaviour (set `orientation` to switch axis). */
-declare function ResizablePanelGroup({
-  className,
-  ...props
-}: ResizablePrimitive.GroupProps): react_jsx_runtime300.JSX.Element;
-/** A single resizable region within a `ResizablePanelGroup`; size it with `defaultSize`/`minSize`/`maxSize`. */
-declare function ResizablePanel({
-  ...props
-}: ResizablePrimitive.PanelProps): react_jsx_runtime300.JSX.Element;
-/** Draggable divider between two panels; pass `withHandle` to render a visible grip affordance. */
-declare function ResizableHandle({
-  withHandle,
-  className,
-  ...props
-}: ResizablePrimitive.SeparatorProps & {
-  /** Renders a visible grip icon centred on the divider. */
-  withHandle?: boolean;
-}): react_jsx_runtime300.JSX.Element;
-//#endregion
-export { ResizablePanel as n, ResizablePanelGroup as r, ResizableHandle as t };
-//# sourceMappingURL=index48.d.ts.map
+export {};

package/dist/index49.d.cts

@@ -1,21 +1,127 @@
-import * as react_jsx_runtime321 from "react/jsx-runtime";
-import { ScrollArea } from "radix-ui";
+import * as react_jsx_runtime300 from "react/jsx-runtime";
 import * as React from "react";
 
-//#region src/primitives/ScrollArea/ScrollArea.d.ts
-/** Custom-styled scroll container: a viewport with a slim, auto-hiding scrollbar. */
-declare function ScrollArea$1({
-  className,
+//#region src/primitives/NotchedCard/NotchedCard.d.ts
+declare const CORNER_KEYS: readonly ["tl", "tr", "br", "bl"];
+type CornerKey = (typeof CORNER_KEYS)[number];
+type CornerBox = {
+  w: number;
+  h: number;
+};
+type CornerSizes = Record<CornerKey, CornerBox | null>;
+/**
+ * Builds the notched outline as an SVG path, walking clockwise from the top
+ * edge. Convex turns sweep outward (sweep=1); the inner corner of each notch
+ * is a concave fillet (sweep=0). Exported for testing — not part of the
+ * typical component API.
+ */
+declare function buildNotchedCardPath({
+  w,
+  h,
+  radius,
+  notchRadius,
+  notches
+}: {
+  w: number;
+  h: number;
+  radius: number;
+  notchRadius: number;
+  notches: CornerSizes;
+}): string;
+declare const notchedCardVariants: {
+  readonly default: {
+    readonly background: "bg-glass-none-bg";
+    readonly shadow: "drop-shadow-sm";
+    readonly text: "text-primary-txt";
+    readonly borderedByDefault: true;
+  };
+  readonly muted: {
+    readonly background: "bg-muted-bg";
+    readonly shadow: "";
+    readonly text: "text-primary-txt";
+    readonly borderedByDefault: true;
+  };
+  readonly glass: {
+    readonly background: "bg-glass-40-bg backdrop-blur-glass";
+    readonly shadow: "";
+    readonly text: "text-primary-txt";
+    readonly borderedByDefault: false;
+  };
+  readonly brand: {
+    readonly background: "bg-[image:linear-gradient(to_right,var(--theme-brand-700),var(--theme-brand-500-primary))]";
+    readonly shadow: "";
+    readonly text: "text-white";
+    readonly borderedByDefault: false;
+  };
+  readonly inverted: {
+    readonly background: "bg-primary-invert-bg";
+    readonly shadow: "";
+    readonly text: "text-primary-invert-txt";
+    readonly borderedByDefault: false;
+  };
+};
+type NotchedCardVariant = keyof typeof notchedCardVariants;
+type NotchedCardProps = React.ComponentProps<"div"> & {
+  /** Content pinned to the top-left corner; its footprint is notched out of the background. */
+  topLeftComponent?: React.ReactNode;
+  /** Content pinned to the top-right corner; its footprint is notched out of the background. */
+  topRightComponent?: React.ReactNode;
+  /** Content pinned to the bottom-left corner; its footprint is notched out of the background. */
+  bottomLeftComponent?: React.ReactNode;
+  /** Content pinned to the bottom-right corner; its footprint is notched out of the background. */
+  bottomRightComponent?: React.ReactNode;
+  /** Background fill of the card surface. Default `default` (solid surface). */
+  variant?: NotchedCardVariant;
+  /** Image URL rendered as the card's background (object-fit: cover), slightly transparent. */
+  backgroundImage?: string;
+  /** Opacity of the background image. Default `0.8`. */
+  backgroundImageOpacity?: number;
+  /** Outer corner radius in px. Default `16`. */
+  radius?: number;
+  /** Concave fillet radius at each notch's inner corner in px. Default `12`. */
+  notchRadius?: number;
+  /** Gutter in px between corner content and the background edge. Default `12`. */
+  notchGap?: number;
+  /** Content padding in px. Default `24`. */
+  padding?: number;
+  /** Keep flowing content out of the notched corners via invisible float
+      spacers. Needs flow (block/inline) content — set `false` if
+      `contentClassName` turns the wrapper into a flex/grid container.
+      Default `true`. */
+  avoidNotches?: boolean;
+  /** Draw the outline stroke. Defaults per variant (`default`/`muted` on, others off). */
+  bordered?: boolean;
+  /** Extra classes for the clipped background layer — set the fill here (e.g.
+      `bg-…`, gradients). The layer sits behind the content, so plain `hover:`
+      variants never fire on it; the root carries the `group` marker — use
+      `group-hover:bg-…` for hover fills (plain `hover:` works on `className`,
+      which styles the root itself). */
+  backgroundClassName?: string;
+  /** Extra classes for the content wrapper. */
+  contentClassName?: string;
+};
+/** Card with corner slots that notch the background around their content. */
+declare function NotchedCard({
   children,
-  ...props
-}: React.ComponentProps<typeof ScrollArea.Root>): react_jsx_runtime321.JSX.Element;
-/** A single scrollbar track + thumb for the ScrollArea, vertical or horizontal. */
-declare function ScrollBar({
+  topLeftComponent,
+  topRightComponent,
+  bottomLeftComponent,
+  bottomRightComponent,
+  variant,
+  backgroundImage,
+  backgroundImageOpacity,
+  radius,
+  notchRadius,
+  notchGap,
+  padding,
+  avoidNotches,
+  bordered,
   className,
-  /** Axis the scrollbar controls; defaults to `"vertical"`. */
-  orientation,
+  backgroundClassName,
+  contentClassName,
+  style,
   ...props
-}: React.ComponentProps<typeof ScrollArea.ScrollAreaScrollbar>): react_jsx_runtime321.JSX.Element;
+}: NotchedCardProps): react_jsx_runtime300.JSX.Element;
 //#endregion
-export { ScrollBar as n, ScrollArea$1 as t };
+export { notchedCardVariants as a, buildNotchedCardPath as i, NotchedCardProps as n, NotchedCardVariant as r, NotchedCard as t };
 //# sourceMappingURL=index49.d.cts.map

package/dist/index49.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index49.d.cts","names":[],"sources":["../src/primitives/ScrollArea/ScrollArea.tsx"],"mappings":";;;;;;iBAMS,YAAA;;;;GAIN,KAAA,CAAM,sBAAsB,UAAA,CAAoB,QAAK,oBAAA,CAAA,GAAA,CAAA;;AATpB,iBA6B3B,SAAA,CAxBU;EAAA,SAAA;;aACjB;EAAA,GAAA;AAAA,CAAA,EA4BC,KAAA,CAAM,cA5BP,CAAA,OA4B6B,UAAA,CAAoB,mBA5BjD,CAAA,CAAA,EA4BqE,oBAAA,CAAA,GAAA,CAAA,OA5BrE"}
+{"version":3,"file":"index49.d.cts","names":[],"sources":["../src/primitives/NotchedCard/NotchedCard.tsx"],"mappings":";;;;cAWM;KACD,SAAA,WAAoB;KAEpB,SAAA;EAHC,CAAA,EAAA,MAAA;EACD,CAAA,EAAA,MAAA;AAA+B,CAAA;AAEtB,KACT,WAAA,GAAc,MAAH,CAAU,SAAV,EAAqB,SAArB,GAAA,IAAA,CAAA;;;;;AAAS;AAAA;iBAahB,oBAAA,CAAoB;EAAA,CAAA;EAAA,CAAA;EAAA,MAAA;EAAA,WAAA;EAAA;CAAA,EAAA;KAC3B,MAAA;KACA,MAAA;QACA,EAAA,MAAA;aACA,EAAA,MAAA;SACA,EAMS,WANT;UAMS;AAAW,cAuJhB,mBAvJgB,EAAA;EAuJhB,SAAA,OAAA,EAAA;IAoCD,SAAA,UAAkB,EAAA,kBAAgB;IAElC,SAAA,MAAgB,EAAA,gBAAA;IAAA,SAAA,IAAA,EAAA,kBAAA;IAAG,SAAM,iBAAA,EAAA,IAAA;;WAIF,KAAA,EAAA;IAEJ,SAAM,UAAA,EAAA,aAAA;IAEL,SAAM,MAAA,EAAA,EAAA;IAEnB,SAAA,IAAA,EAAA,kBAAA;IAAkB,SAAA,iBAAA,EAAA,IAAA;EA+BrB,CAAA;EAAW,SAAA,KAAA,EAAA;IAClB,SAAA,UAAA,EAAA,oCAAA;IACA,SAAA,MAAA,EAAA,EAAA;IACA,SAAA,IAAA,EAAA,kBAAA;IACA,SAAA,iBAAA,EAAA,KAAA;;WAEA,KAAA,EAAA;IACA,SAAA,UAAA,EAAA,4FAAA;IACA,SAAA,MAAA,EAAA,EAAA;IACA,SAAA,IAAA,EAAA,YAAA;IACA,SAAA,iBAAA,EAAA,KAAA;;WAEA,QAAA,EAAA;IACA,SAAA,UAAA,EAAA,sBAAA;IACA,SAAA,MAAA,EAAA,EAAA;IACA,SAAA,IAAA,EAAA,yBAAA;IACA,SAAA,iBAAA,EAAA,KAAA;;;KA3DG,kBAAA,GA+DF,MAAA,OA/DoC,mBA+DpC;KA7DE,gBAAA,GAAmB,KAAA,CAAM,cA6DX,CAAA,KAAA,CAAA,GAAA;EAAA;qBA3DE,KAAA,CAAM;;sBAEL,KAAA,CAAM;;wBAEJ,KAAA,CAAM;;yBAEL,KAAA,CAAM;;YAEnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA+BH,WAAA;;;;;;;;;;;;;;;;;;;;GAoBN,mBAAgB,oBAAA,CAAA,GAAA,CAAA"}

package/dist/index49.d.ts

@@ -1,21 +1,127 @@
 import * as React from "react";
-import * as react_jsx_runtime298 from "react/jsx-runtime";
-import { ScrollArea } from "radix-ui";
+import * as react_jsx_runtime288 from "react/jsx-runtime";
 
-//#region src/primitives/ScrollArea/ScrollArea.d.ts
-/** Custom-styled scroll container: a viewport with a slim, auto-hiding scrollbar. */
-declare function ScrollArea$1({
-  className,
+//#region src/primitives/NotchedCard/NotchedCard.d.ts
+declare const CORNER_KEYS: readonly ["tl", "tr", "br", "bl"];
+type CornerKey = (typeof CORNER_KEYS)[number];
+type CornerBox = {
+  w: number;
+  h: number;
+};
+type CornerSizes = Record<CornerKey, CornerBox | null>;
+/**
+ * Builds the notched outline as an SVG path, walking clockwise from the top
+ * edge. Convex turns sweep outward (sweep=1); the inner corner of each notch
+ * is a concave fillet (sweep=0). Exported for testing — not part of the
+ * typical component API.
+ */
+declare function buildNotchedCardPath({
+  w,
+  h,
+  radius,
+  notchRadius,
+  notches
+}: {
+  w: number;
+  h: number;
+  radius: number;
+  notchRadius: number;
+  notches: CornerSizes;
+}): string;
+declare const notchedCardVariants: {
+  readonly default: {
+    readonly background: "bg-glass-none-bg";
+    readonly shadow: "drop-shadow-sm";
+    readonly text: "text-primary-txt";
+    readonly borderedByDefault: true;
+  };
+  readonly muted: {
+    readonly background: "bg-muted-bg";
+    readonly shadow: "";
+    readonly text: "text-primary-txt";
+    readonly borderedByDefault: true;
+  };
+  readonly glass: {
+    readonly background: "bg-glass-40-bg backdrop-blur-glass";
+    readonly shadow: "";
+    readonly text: "text-primary-txt";
+    readonly borderedByDefault: false;
+  };
+  readonly brand: {
+    readonly background: "bg-[image:linear-gradient(to_right,var(--theme-brand-700),var(--theme-brand-500-primary))]";
+    readonly shadow: "";
+    readonly text: "text-white";
+    readonly borderedByDefault: false;
+  };
+  readonly inverted: {
+    readonly background: "bg-primary-invert-bg";
+    readonly shadow: "";
+    readonly text: "text-primary-invert-txt";
+    readonly borderedByDefault: false;
+  };
+};
+type NotchedCardVariant = keyof typeof notchedCardVariants;
+type NotchedCardProps = React.ComponentProps<"div"> & {
+  /** Content pinned to the top-left corner; its footprint is notched out of the background. */
+  topLeftComponent?: React.ReactNode;
+  /** Content pinned to the top-right corner; its footprint is notched out of the background. */
+  topRightComponent?: React.ReactNode;
+  /** Content pinned to the bottom-left corner; its footprint is notched out of the background. */
+  bottomLeftComponent?: React.ReactNode;
+  /** Content pinned to the bottom-right corner; its footprint is notched out of the background. */
+  bottomRightComponent?: React.ReactNode;
+  /** Background fill of the card surface. Default `default` (solid surface). */
+  variant?: NotchedCardVariant;
+  /** Image URL rendered as the card's background (object-fit: cover), slightly transparent. */
+  backgroundImage?: string;
+  /** Opacity of the background image. Default `0.8`. */
+  backgroundImageOpacity?: number;
+  /** Outer corner radius in px. Default `16`. */
+  radius?: number;
+  /** Concave fillet radius at each notch's inner corner in px. Default `12`. */
+  notchRadius?: number;
+  /** Gutter in px between corner content and the background edge. Default `12`. */
+  notchGap?: number;
+  /** Content padding in px. Default `24`. */
+  padding?: number;
+  /** Keep flowing content out of the notched corners via invisible float
+      spacers. Needs flow (block/inline) content — set `false` if
+      `contentClassName` turns the wrapper into a flex/grid container.
+      Default `true`. */
+  avoidNotches?: boolean;
+  /** Draw the outline stroke. Defaults per variant (`default`/`muted` on, others off). */
+  bordered?: boolean;
+  /** Extra classes for the clipped background layer — set the fill here (e.g.
+      `bg-…`, gradients). The layer sits behind the content, so plain `hover:`
+      variants never fire on it; the root carries the `group` marker — use
+      `group-hover:bg-…` for hover fills (plain `hover:` works on `className`,
+      which styles the root itself). */
+  backgroundClassName?: string;
+  /** Extra classes for the content wrapper. */
+  contentClassName?: string;
+};
+/** Card with corner slots that notch the background around their content. */
+declare function NotchedCard({
   children,
-  ...props
-}: React.ComponentProps<typeof ScrollArea.Root>): react_jsx_runtime298.JSX.Element;
-/** A single scrollbar track + thumb for the ScrollArea, vertical or horizontal. */
-declare function ScrollBar({
+  topLeftComponent,
+  topRightComponent,
+  bottomLeftComponent,
+  bottomRightComponent,
+  variant,
+  backgroundImage,
+  backgroundImageOpacity,
+  radius,
+  notchRadius,
+  notchGap,
+  padding,
+  avoidNotches,
+  bordered,
   className,
-  /** Axis the scrollbar controls; defaults to `"vertical"`. */
-  orientation,
+  backgroundClassName,
+  contentClassName,
+  style,
   ...props
-}: React.ComponentProps<typeof ScrollArea.ScrollAreaScrollbar>): react_jsx_runtime298.JSX.Element;
+}: NotchedCardProps): react_jsx_runtime288.JSX.Element;
 //#endregion
-export { ScrollBar as n, ScrollArea$1 as t };
+export { notchedCardVariants as a, buildNotchedCardPath as i, NotchedCardProps as n, NotchedCardVariant as r, NotchedCard as t };
 //# sourceMappingURL=index49.d.ts.map

package/dist/index49.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index49.d.ts","names":[],"sources":["../src/primitives/ScrollArea/ScrollArea.tsx"],"mappings":";;;;;;iBAMS,YAAA;;;;GAIN,KAAA,CAAM,sBAAsB,UAAA,CAAoB,QAAK,oBAAA,CAAA,GAAA,CAAA;;AATpB,iBA6B3B,SAAA,CAxBU;EAAA,SAAA;;aACjB;EAAA,GAAA;AAAA,CAAA,EA4BC,KAAA,CAAM,cA5BP,CAAA,OA4B6B,UAAA,CAAoB,mBA5BjD,CAAA,CAAA,EA4BqE,oBAAA,CAAA,GAAA,CAAA,OA5BrE"}
+{"version":3,"file":"index49.d.ts","names":[],"sources":["../src/primitives/NotchedCard/NotchedCard.tsx"],"mappings":";;;;cAWM;KACD,SAAA,WAAoB;KAEpB,SAAA;EAHC,CAAA,EAAA,MAAA;EACD,CAAA,EAAA,MAAA;AAA+B,CAAA;AAEtB,KACT,WAAA,GAAc,MAAH,CAAU,SAAV,EAAqB,SAArB,GAAA,IAAA,CAAA;;;;;AAAS;AAAA;iBAahB,oBAAA,CAAoB;EAAA,CAAA;EAAA,CAAA;EAAA,MAAA;EAAA,WAAA;EAAA;CAAA,EAAA;KAC3B,MAAA;KACA,MAAA;QACA,EAAA,MAAA;aACA,EAAA,MAAA;SACA,EAMS,WANT;UAMS;AAAW,cAuJhB,mBAvJgB,EAAA;EAuJhB,SAAA,OAAA,EAAA;IAoCD,SAAA,UAAkB,EAAA,kBAAgB;IAElC,SAAA,MAAgB,EAAA,gBAAA;IAAA,SAAA,IAAA,EAAA,kBAAA;IAAG,SAAM,iBAAA,EAAA,IAAA;;WAIF,KAAA,EAAA;IAEJ,SAAM,UAAA,EAAA,aAAA;IAEL,SAAM,MAAA,EAAA,EAAA;IAEnB,SAAA,IAAA,EAAA,kBAAA;IAAkB,SAAA,iBAAA,EAAA,IAAA;EA+BrB,CAAA;EAAW,SAAA,KAAA,EAAA;IAClB,SAAA,UAAA,EAAA,oCAAA;IACA,SAAA,MAAA,EAAA,EAAA;IACA,SAAA,IAAA,EAAA,kBAAA;IACA,SAAA,iBAAA,EAAA,KAAA;;WAEA,KAAA,EAAA;IACA,SAAA,UAAA,EAAA,4FAAA;IACA,SAAA,MAAA,EAAA,EAAA;IACA,SAAA,IAAA,EAAA,YAAA;IACA,SAAA,iBAAA,EAAA,KAAA;;WAEA,QAAA,EAAA;IACA,SAAA,UAAA,EAAA,sBAAA;IACA,SAAA,MAAA,EAAA,EAAA;IACA,SAAA,IAAA,EAAA,yBAAA;IACA,SAAA,iBAAA,EAAA,KAAA;;;KA3DG,kBAAA,GA+DF,MAAA,OA/DoC,mBA+DpC;KA7DE,gBAAA,GAAmB,KAAA,CAAM,cA6DX,CAAA,KAAA,CAAA,GAAA;EAAA;qBA3DE,KAAA,CAAM;;sBAEL,KAAA,CAAM;;wBAEJ,KAAA,CAAM;;yBAEL,KAAA,CAAM;;YAEnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA+BH,WAAA;;;;;;;;;;;;;;;;;;;;GAoBN,mBAAgB,oBAAA,CAAA,GAAA,CAAA"}