npm - @fabio.caffarello/react-design-system - Versions diffs - 3.12.0 → 4.0.0 - Mend

@fabio.caffarello/react-design-system 3.12.0 → 4.0.0

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 (159) hide show

package/dist/granular/ui/components/Header/components/HeaderHamburger.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderHamburger.js","sources":["../../../../../../src/ui/components/Header/components/HeaderHamburger.tsx"],"sourcesContent":["/*\n HeaderHamburger Component\n \n Hamburger button for toggling mobile menu.\n \n @see EPIC-002: Header Component ~~(Molecule)~~\n * @see TASK-027: Hamburger Button\n /\n\n\"use client\";\n\nimport React from \"react\";\nimport { Menu, X } from \"lucide-react\";\nimport { Button } from \"../../../primitives/Button/Button\";\nimport { useHeaderContext } from \"../contexts/HeaderContext\";\nimport { cn } from \"../../../utils\";\n\nexport interface HeaderHamburgerProps {\n /\n Additional CSS classes\n /\n className?: string;\n\n /\n Custom icon component\n /\n icon?: React.ReactNode;\n\n /\n Custom close icon component\n /\n closeIcon?: React.ReactNode;\n\n /\n Button variant\n * @default 'ghost'\n /\n variant?: \"ghost\" \| \"outline\";\n\n /\n Button size\n * @default 'md'\n /\n size?: \"sm\" \| \"md\" \| \"lg\";\n}\n\n/\n HeaderHamburger Component\n \n Hamburger button that toggles the mobile menu.\n * Only visible on mobile devices.\n \n @example\n * ```tsx\n * <Header>\n * <Header.Hamburger />\n * <Header.Logo href=\"/\">MyApp</Header.Logo>\n * </Header>\n * ```\n */\nexport function HeaderHamburger({\n className,\n icon,\n closeIcon,\n variant = \"ghost\",\n size = \"md\",\n}: HeaderHamburgerProps) {\n const { isMobileMenuOpen, toggleMobileMenu } = useHeaderContext();\n\n const MenuIcon = icon \|\| <Menu className=\"h-5 w-5\" />;\n const CloseIcon = closeIcon \|\| <X className=\"h-5 w-5\" />;\n\n return (\n <Button\n variant={variant}\n size={size}\n onClick={toggleMobileMenu}\n className={cn(\"md:hidden\", className)}\n aria-label={isMobileMenuOpen ? \"Close menu\" : \"Open menu\"}\n aria-expanded={isMobileMenuOpen}\n >\n {isMobileMenuOpen ? CloseIcon : MenuIcon}\n </Button>\n );\n}\n"],"names":["HeaderHamburger","className","icon","closeIcon","variant","size","isMobileMenuOpen","toggleMobileMenu","useHeaderContext","MenuIcon","jsx","Menu","CloseIcon","X","Button","cn"],"mappings":";;;;;;AA4DO,SAASA,EAAgB;AAAA,EAC9B,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AACT,GAAyB;AACvB,QAAM,EAAE,kBAAAC,GAAkB,kBAAAC,EAAA,IAAqBC,EAAA,GAEzCC,IAAWP,KAAQ,gBAAAQ,EAACC,GAAA,EAAK,WAAU,WAAU,GAC7CC,IAAYT,KAAa,gBAAAO,EAACG,GAAA,EAAE,WAAU,WAAU;AAEtD,SACE,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAC;AAAA,MACA,SAASE;AAAA,MACT,WAAWQ,EAAG,aAAad,CAAS;AAAA,MACpC,cAAYK,IAAmB,eAAe;AAAA,MAC9C,iBAAeA;AAAA,MAEd,cAAmBM,IAAYH;AAAA,IAAA;AAAA,EAAA;AAGtC;"}
1	+ {"version":3,"file":"HeaderHamburger.js","sources":["../../../../../../src/ui/components/Header/components/HeaderHamburger.tsx"],"sourcesContent":["/*\n HeaderHamburger Component\n \n Hamburger button for toggling mobile menu.\n \n @see EPIC-002: Header Component\n * @see TASK-027: Hamburger Button\n /\n\n\"use client\";\n\nimport React from \"react\";\nimport { Menu, X } from \"lucide-react\";\nimport { Button } from \"../../../primitives/Button/Button\";\nimport { useHeaderContext } from \"../contexts/HeaderContext\";\nimport { cn } from \"../../../utils\";\n\nexport interface HeaderHamburgerProps {\n /\n Additional CSS classes\n /\n className?: string;\n\n /\n Custom icon component\n /\n icon?: React.ReactNode;\n\n /\n Custom close icon component\n /\n closeIcon?: React.ReactNode;\n\n /\n Button variant\n * @default 'ghost'\n /\n variant?: \"ghost\" \| \"outline\";\n\n /\n Button size\n * @default 'md'\n /\n size?: \"sm\" \| \"md\" \| \"lg\";\n}\n\n/\n HeaderHamburger Component\n \n Hamburger button that toggles the mobile menu.\n * Only visible on mobile devices.\n \n @example\n * ```tsx\n * <Header>\n * <Header.Hamburger />\n * <Header.Logo href=\"/\">MyApp</Header.Logo>\n * </Header>\n * ```\n */\nexport function HeaderHamburger({\n className,\n icon,\n closeIcon,\n variant = \"ghost\",\n size = \"md\",\n}: HeaderHamburgerProps) {\n const { isMobileMenuOpen, toggleMobileMenu } = useHeaderContext();\n\n const MenuIcon = icon \|\| <Menu className=\"h-5 w-5\" />;\n const CloseIcon = closeIcon \|\| <X className=\"h-5 w-5\" />;\n\n return (\n <Button\n variant={variant}\n size={size}\n onClick={toggleMobileMenu}\n className={cn(\"md:hidden\", className)}\n aria-label={isMobileMenuOpen ? \"Close menu\" : \"Open menu\"}\n aria-expanded={isMobileMenuOpen}\n >\n {isMobileMenuOpen ? CloseIcon : MenuIcon}\n </Button>\n );\n}\n"],"names":["HeaderHamburger","className","icon","closeIcon","variant","size","isMobileMenuOpen","toggleMobileMenu","useHeaderContext","MenuIcon","jsx","Menu","CloseIcon","X","Button","cn"],"mappings":";;;;;;AA4DO,SAASA,EAAgB;AAAA,EAC9B,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AACT,GAAyB;AACvB,QAAM,EAAE,kBAAAC,GAAkB,kBAAAC,EAAA,IAAqBC,EAAA,GAEzCC,IAAWP,KAAQ,gBAAAQ,EAACC,GAAA,EAAK,WAAU,WAAU,GAC7CC,IAAYT,KAAa,gBAAAO,EAACG,GAAA,EAAE,WAAU,WAAU;AAEtD,SACE,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,SAAAV;AAAA,MACA,MAAAC;AAAA,MACA,SAASE;AAAA,MACT,WAAWQ,EAAG,aAAad,CAAS;AAAA,MACpC,cAAYK,IAAmB,eAAe;AAAA,MAC9C,iBAAeA;AAAA,MAEd,cAAmBM,IAAYH;AAAA,IAAA;AAAA,EAAA;AAGtC;"}

package/dist/granular/ui/components/Header/components/HeaderLogo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderLogo.js","sources":["../../../../../../src/ui/components/Header/components/HeaderLogo.tsx"],"sourcesContent":["/*\n HeaderLogo Component\n \n Logo slot component for Header.\n \n @see EPIC-002: Header Component ~~(Molecule)~~\n * @see RFC-003: Header Composition Pattern (APPROVED)\n /\n\n\"use client\";\n\nimport { type ReactNode } from \"react\";\nimport { cn } from \"../../../utils\";\nimport type { NavLinkProps } from \"../../../primitives/NavLink\";\nimport { NavLink } from \"../../../primitives/NavLink\";\n\nexport interface HeaderLogoProps extends Omit<NavLinkProps, \"children\"> {\n /\n Logo content (text, image, or component)\n /\n children: ReactNode;\n\n /\n Additional CSS classes\n /\n className?: string;\n}\n\n/\n HeaderLogo Component\n \n Logo slot for Header. Renders as a NavLink by default.\n \n @example\n * ```tsx\n * <Header.Logo href=\"/\">MyApp</Header.Logo>\n * <Header.Logo href=\"/\">\n * <img src=\"/logo.png\" alt=\"Logo\" />\n * </Header.Logo>\n * ```\n */\nexport function HeaderLogo({\n children,\n className,\n href,\n ...props\n}: HeaderLogoProps) {\n return (\n <div className=\"flex-shrink-0\">\n <NavLink\n href={href \|\| \"/\"}\n variant=\"default\"\n className={cn(\"flex items-center font-semibold text-lg\", className)}\n {...props}\n >\n {children}\n </NavLink>\n </div>\n );\n}\n"],"names":["HeaderLogo","_a","_b","children","className","href","props","__objRest","jsx","NavLink","__spreadProps","__spreadValues","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyCO,SAASA,EAAWC,GAKP;AALO,MAAAC,IAAAD,GACzB;AAAA,cAAAE;AAAA,IACA,WAAAC;AAAA,IACA,MAAAC;AAAA,MAHyBH,GAItBI,IAAAC,EAJsBL,GAItB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,SACE,gBAAAM,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA;AAAA,IAACC;AAAA,IAAAC,EAAAC,EAAA;AAAA,MACC,MAAMN,KAAQ;AAAA,MACd,SAAQ;AAAA,MACR,WAAWO,EAAG,2CAA2CR,CAAS;AAAA,OAC9DE,IAJL;AAAA,MAME,UAAAH;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}
1	+ {"version":3,"file":"HeaderLogo.js","sources":["../../../../../../src/ui/components/Header/components/HeaderLogo.tsx"],"sourcesContent":["/*\n HeaderLogo Component\n \n Logo slot component for Header.\n \n @see EPIC-002: Header Component\n * @see RFC-003: Header Composition Pattern (APPROVED)\n /\n\n\"use client\";\n\nimport { type ReactNode } from \"react\";\nimport { cn } from \"../../../utils\";\nimport type { NavLinkProps } from \"../../../primitives/NavLink\";\nimport { NavLink } from \"../../../primitives/NavLink\";\n\nexport interface HeaderLogoProps extends Omit<NavLinkProps, \"children\"> {\n /\n Logo content (text, image, or component)\n /\n children: ReactNode;\n\n /\n Additional CSS classes\n /\n className?: string;\n}\n\n/\n HeaderLogo Component\n \n Logo slot for Header. Renders as a NavLink by default.\n \n @example\n * ```tsx\n * <Header.Logo href=\"/\">MyApp</Header.Logo>\n * <Header.Logo href=\"/\">\n * <img src=\"/logo.png\" alt=\"Logo\" />\n * </Header.Logo>\n * ```\n */\nexport function HeaderLogo({\n children,\n className,\n href,\n ...props\n}: HeaderLogoProps) {\n return (\n <div className=\"flex-shrink-0\">\n <NavLink\n href={href \|\| \"/\"}\n variant=\"default\"\n className={cn(\"flex items-center font-semibold text-lg\", className)}\n {...props}\n >\n {children}\n </NavLink>\n </div>\n );\n}\n"],"names":["HeaderLogo","_a","_b","children","className","href","props","__objRest","jsx","NavLink","__spreadProps","__spreadValues","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyCO,SAASA,EAAWC,GAKP;AALO,MAAAC,IAAAD,GACzB;AAAA,cAAAE;AAAA,IACA,WAAAC;AAAA,IACA,MAAAC;AAAA,MAHyBH,GAItBI,IAAAC,EAJsBL,GAItB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,SACE,gBAAAM,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA;AAAA,IAACC;AAAA,IAAAC,EAAAC,EAAA;AAAA,MACC,MAAMN,KAAQ;AAAA,MACd,SAAQ;AAAA,MACR,WAAWO,EAAG,2CAA2CR,CAAS;AAAA,OAC9DE,IAJL;AAAA,MAME,UAAAH;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}

package/dist/granular/ui/components/Header/components/HeaderMobileMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderMobileMenu.js","sources":["../../../../../../src/ui/components/Header/components/HeaderMobileMenu.tsx"],"sourcesContent":["/*\n HeaderMobileMenu Component\n \n Mobile menu drawer for Header navigation.\n \n @see EPIC-002: Header Component ~~(Molecule)~~\n * @see TASK-028: Mobile Menu (Drawer)\n /\n\n\"use client\";\n\nimport React from \"react\";\nimport { Drawer, DrawerContent } from \"../../Drawer\";\nimport { useHeaderContext } from \"../contexts/HeaderContext\";\nimport { cn } from \"../../../utils\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface HeaderMobileMenuProps {\n /\n Menu content (typically navigation links)\n /\n children: React.ReactNode;\n\n /\n Additional CSS classes\n /\n className?: string;\n}\n\n/\n HeaderMobileMenu Component\n \n Mobile menu drawer that slides in from the side.\n * Uses Drawer component from design system.\n \n @example\n * ```tsx\n * <Header>\n * <Header.MobileMenu>\n * <NavLink href=\"/home\">Home</NavLink>\n * <NavLink href=\"/about\">About</NavLink>\n * </Header.MobileMenu>\n * </Header>\n * ```\n */\nexport function HeaderMobileMenu({\n children,\n className,\n}: HeaderMobileMenuProps) {\n const { isMobileMenuOpen, closeMobileMenu } = useHeaderContext();\n\n return (\n <Drawer\n open={isMobileMenuOpen}\n onOpenChange={(open) => {\n if (!open) {\n closeMobileMenu();\n }\n }}\n position=\"left\"\n size=\"sm\"\n closeOnOverlayClick\n closeOnEscape\n >\n <DrawerContent className={cn(getSpacingClass(\"base\", \"p\"), className)}>\n <nav\n className={`flex flex-col ${getSpacingClass(\"sm\", \"gap\")}`}\n aria-label=\"Mobile navigation\"\n >\n {children}\n </nav>\n </DrawerContent>\n </Drawer>\n );\n}\n"],"names":["HeaderMobileMenu","children","className","isMobileMenuOpen","closeMobileMenu","useHeaderContext","jsx","Drawer","open","DrawerContent","cn","getSpacingClass"],"mappings":";;;;;;;AA6CO,SAASA,EAAiB;AAAA,EAC/B,UAAAC;AAAA,EACA,WAAAC;AACF,GAA0B;AACxB,QAAM,EAAE,kBAAAC,GAAkB,iBAAAC,EAAA,IAAoBC,EAAA;AAE9C,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAMJ;AAAA,MACN,cAAc,CAACK,MAAS;AACtB,QAAKA,KACHJ,EAAA;AAAA,MAEJ;AAAA,MACA,UAAS;AAAA,MACT,MAAK;AAAA,MACL,qBAAmB;AAAA,MACnB,eAAa;AAAA,MAEb,UAAA,gBAAAE,EAACG,KAAc,WAAWC,EAAGC,EAAgB,QAAQ,GAAG,GAAGT,CAAS,GAClE,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,iBAAiBK,EAAgB,MAAM,KAAK,CAAC;AAAA,UACxD,cAAW;AAAA,UAEV,UAAAV;AAAA,QAAA;AAAA,MAAA,EACH,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
1	+ {"version":3,"file":"HeaderMobileMenu.js","sources":["../../../../../../src/ui/components/Header/components/HeaderMobileMenu.tsx"],"sourcesContent":["/*\n HeaderMobileMenu Component\n \n Mobile menu drawer for Header navigation.\n \n @see EPIC-002: Header Component\n * @see TASK-028: Mobile Menu (Drawer)\n /\n\n\"use client\";\n\nimport React from \"react\";\nimport { Drawer, DrawerContent } from \"../../Drawer\";\nimport { useHeaderContext } from \"../contexts/HeaderContext\";\nimport { cn } from \"../../../utils\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface HeaderMobileMenuProps {\n /\n Menu content (typically navigation links)\n /\n children: React.ReactNode;\n\n /\n Additional CSS classes\n /\n className?: string;\n}\n\n/\n HeaderMobileMenu Component\n \n Mobile menu drawer that slides in from the side.\n * Uses Drawer component from design system.\n \n @example\n * ```tsx\n * <Header>\n * <Header.MobileMenu>\n * <NavLink href=\"/home\">Home</NavLink>\n * <NavLink href=\"/about\">About</NavLink>\n * </Header.MobileMenu>\n * </Header>\n * ```\n */\nexport function HeaderMobileMenu({\n children,\n className,\n}: HeaderMobileMenuProps) {\n const { isMobileMenuOpen, closeMobileMenu } = useHeaderContext();\n\n return (\n <Drawer\n open={isMobileMenuOpen}\n onOpenChange={(open) => {\n if (!open) {\n closeMobileMenu();\n }\n }}\n position=\"left\"\n size=\"sm\"\n closeOnOverlayClick\n closeOnEscape\n >\n <DrawerContent className={cn(getSpacingClass(\"base\", \"p\"), className)}>\n <nav\n className={`flex flex-col ${getSpacingClass(\"sm\", \"gap\")}`}\n aria-label=\"Mobile navigation\"\n >\n {children}\n </nav>\n </DrawerContent>\n </Drawer>\n );\n}\n"],"names":["HeaderMobileMenu","children","className","isMobileMenuOpen","closeMobileMenu","useHeaderContext","jsx","Drawer","open","DrawerContent","cn","getSpacingClass"],"mappings":";;;;;;;AA6CO,SAASA,EAAiB;AAAA,EAC/B,UAAAC;AAAA,EACA,WAAAC;AACF,GAA0B;AACxB,QAAM,EAAE,kBAAAC,GAAkB,iBAAAC,EAAA,IAAoBC,EAAA;AAE9C,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAMJ;AAAA,MACN,cAAc,CAACK,MAAS;AACtB,QAAKA,KACHJ,EAAA;AAAA,MAEJ;AAAA,MACA,UAAS;AAAA,MACT,MAAK;AAAA,MACL,qBAAmB;AAAA,MACnB,eAAa;AAAA,MAEb,UAAA,gBAAAE,EAACG,KAAc,WAAWC,EAAGC,EAAgB,QAAQ,GAAG,GAAGT,CAAS,GAClE,UAAA,gBAAAI;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,iBAAiBK,EAAgB,MAAM,KAAK,CAAC;AAAA,UACxD,cAAW;AAAA,UAEV,UAAAV;AAAA,QAAA;AAAA,MAAA,EACH,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/granular/ui/components/Header/components/HeaderNavigation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderNavigation.js","sources":["../../../../../../src/ui/components/Header/components/HeaderNavigation.tsx"],"sourcesContent":["/*\n HeaderNavigation Component\n \n Navigation slot component for Header.\n \n @see EPIC-002: Header Component ~~(Molecule)~~\n * @see RFC-003: Header Composition Pattern (APPROVED)\n /\n\n\"use client\";\n\nimport { type ReactNode } from \"react\";\nimport { cn } from \"../../../utils\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface HeaderNavigationProps {\n /\n Navigation content (typically NavLink components)\n /\n children: ReactNode;\n\n /\n Additional CSS classes\n /\n className?: string;\n}\n\n/\n HeaderNavigation Component\n \n Navigation slot for Header. Typically contains NavLink components.\n \n @example\n * ```tsx\n * <Header.Navigation>\n * <NavLink href=\"/home\">Home</NavLink>\n * <NavLink href=\"/about\">About</NavLink>\n * </Header.Navigation>\n * ```\n */\nexport function HeaderNavigation({\n children,\n className,\n}: HeaderNavigationProps) {\n return (\n <nav\n className={cn(\n \"flex-1 flex items-center justify-center\",\n getSpacingClass(\"base\", \"gap\"),\n \"hidden md:flex\", // Hidden on mobile, visible on desktop\n className,\n )}\n aria-label=\"Main navigation\"\n >\n {children}\n </nav>\n );\n}\n"],"names":["HeaderNavigation","children","className","jsx","cn","getSpacingClass"],"mappings":";;;;AAwCO,SAASA,EAAiB;AAAA,EAC/B,UAAAC;AAAA,EACA,WAAAC;AACF,GAA0B;AACxB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAC,EAAgB,QAAQ,KAAK;AAAA,QAC7B;AAAA;AAAA,QACAH;AAAA,MAAA;AAAA,MAEF,cAAW;AAAA,MAEV,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
1	+ {"version":3,"file":"HeaderNavigation.js","sources":["../../../../../../src/ui/components/Header/components/HeaderNavigation.tsx"],"sourcesContent":["/*\n HeaderNavigation Component\n \n Navigation slot component for Header.\n \n @see EPIC-002: Header Component\n * @see RFC-003: Header Composition Pattern (APPROVED)\n /\n\n\"use client\";\n\nimport { type ReactNode } from \"react\";\nimport { cn } from \"../../../utils\";\nimport { getSpacingClass } from \"../../../tokens/spacing\";\n\nexport interface HeaderNavigationProps {\n /\n Navigation content (typically NavLink components)\n /\n children: ReactNode;\n\n /\n Additional CSS classes\n /\n className?: string;\n}\n\n/\n HeaderNavigation Component\n \n Navigation slot for Header. Typically contains NavLink components.\n \n @example\n * ```tsx\n * <Header.Navigation>\n * <NavLink href=\"/home\">Home</NavLink>\n * <NavLink href=\"/about\">About</NavLink>\n * </Header.Navigation>\n * ```\n */\nexport function HeaderNavigation({\n children,\n className,\n}: HeaderNavigationProps) {\n return (\n <nav\n className={cn(\n \"flex-1 flex items-center justify-center\",\n getSpacingClass(\"base\", \"gap\"),\n \"hidden md:flex\", // Hidden on mobile, visible on desktop\n className,\n )}\n aria-label=\"Main navigation\"\n >\n {children}\n </nav>\n );\n}\n"],"names":["HeaderNavigation","children","className","jsx","cn","getSpacingClass"],"mappings":";;;;AAwCO,SAASA,EAAiB;AAAA,EAC/B,UAAAC;AAAA,EACA,WAAAC;AACF,GAA0B;AACxB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAC,EAAgB,QAAQ,KAAK;AAAA,QAC7B;AAAA;AAAA,QACAH;AAAA,MAAA;AAAA,MAEF,cAAW;AAAA,MAEV,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/granular/ui/components/Header/contexts/HeaderContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderContext.js","sources":["../../../../../../src/ui/components/Header/contexts/HeaderContext.tsx"],"sourcesContent":["/*\n Header Context\n \n Context for managing Header component state, particularly mobile menu state.\n \n @see ADR-002: Header + SideNavbar Compatibility (ACCEPTED)\n * @see EPIC-002: Header Component ~~(Molecule)~~\n * @see TASK-014: Implementar HeaderContext Completo\n /\n\n\"use client\";\n\n/ eslint-disable react-refresh/only-export-components /\nimport {\n createContext,\n useContext,\n useState,\n useCallback,\n type ReactNode,\n} from \"react\";\n\n/\n Header Context Value\n /\nexport interface HeaderContextValue {\n /\n Whether the mobile menu is open\n /\n isMobileMenuOpen: boolean;\n\n /\n Toggle mobile menu state\n /\n toggleMobileMenu: () => void;\n\n /\n Set mobile menu state explicitly\n /\n setMobileMenuOpen: (open: boolean) => void;\n\n /\n Open mobile menu\n /\n openMobileMenu: () => void;\n\n /\n Close mobile menu\n /\n closeMobileMenu: () => void;\n}\n\n/\n Header Context\n \n Independent context for Header component state.\n * Does not interfere with SideNavbar contexts (ADR-002).\n /\nconst HeaderContext = createContext<HeaderContextValue \| undefined>(undefined);\n\n/\n Header Provider Props\n /\nexport interface HeaderProviderProps {\n /\n Children components\n /\n children: ReactNode;\n\n /\n Controlled mode: mobile menu open state\n /\n mobileMenuOpen?: boolean;\n\n /\n Callback when mobile menu state changes\n /\n onMobileMenuChange?: (open: boolean) => void;\n\n /\n Default mobile menu open state (uncontrolled mode)\n * @default false\n /\n defaultMobileMenuOpen?: boolean;\n}\n\n/\n HeaderProvider\n \n Provides Header context for mobile menu state management.\n * Independent from SideNavbarContexts (ADR-002).\n \n Supports both controlled and uncontrolled modes.\n \n @example\n * ```tsx\n * // Uncontrolled mode\n * <HeaderProvider>\n * <Header>...</Header>\n * </HeaderProvider>\n \n // Controlled mode\n * <HeaderProvider\n * mobileMenuOpen={isOpen}\n * onMobileMenuChange={setIsOpen}\n * >\n * <Header>...</Header>\n * </HeaderProvider>\n * ```\n /\nexport function HeaderProvider({\n children,\n mobileMenuOpen: controlledMobileMenuOpen,\n onMobileMenuChange,\n defaultMobileMenuOpen = false,\n}: HeaderProviderProps) {\n const [internalMobileMenuOpen, setInternalMobileMenuOpen] = useState(\n defaultMobileMenuOpen,\n );\n\n const isControlled = controlledMobileMenuOpen !== undefined;\n const isMobileMenuOpen = isControlled\n ? controlledMobileMenuOpen\n : internalMobileMenuOpen;\n\n const setMobileMenuOpen = useCallback(\n (open: boolean) => {\n if (!isControlled) {\n setInternalMobileMenuOpen(open);\n }\n onMobileMenuChange?.(open);\n },\n [isControlled, onMobileMenuChange],\n );\n\n const toggleMobileMenu = useCallback(() => {\n setMobileMenuOpen(!isMobileMenuOpen);\n }, [isMobileMenuOpen, setMobileMenuOpen]);\n\n const openMobileMenu = useCallback(() => {\n setMobileMenuOpen(true);\n }, [setMobileMenuOpen]);\n\n const closeMobileMenu = useCallback(() => {\n setMobileMenuOpen(false);\n }, [setMobileMenuOpen]);\n\n return (\n <HeaderContext.Provider\n value={{\n isMobileMenuOpen,\n toggleMobileMenu,\n setMobileMenuOpen,\n openMobileMenu,\n closeMobileMenu,\n }}\n >\n {children}\n </HeaderContext.Provider>\n );\n}\n\n/\n useHeaderContext Hook\n \n Hook to access Header context.\n * Must be used within HeaderProvider.\n \n @throws Error if used outside HeaderProvider\n \n @example\n * ```tsx\n * function MyComponent() {\n * const { isMobileMenuOpen, toggleMobileMenu } = useHeaderContext();\n * return <button onClick={toggleMobileMenu}>Toggle</button>;\n * }\n * ```\n */\nexport function useHeaderContext(): HeaderContextValue {\n const context = useContext(HeaderContext);\n if (!context) {\n throw new Error(\"useHeaderContext must be used within HeaderProvider\");\n }\n return context;\n}\n"],"names":["HeaderContext","createContext","HeaderProvider","children","controlledMobileMenuOpen","onMobileMenuChange","defaultMobileMenuOpen","internalMobileMenuOpen","setInternalMobileMenuOpen","useState","isControlled","isMobileMenuOpen","setMobileMenuOpen","useCallback","open","toggleMobileMenu","openMobileMenu","closeMobileMenu","jsx","useHeaderContext","context","useContext"],"mappings":";;;AAyDA,MAAMA,IAAgBC,EAA8C,MAAS;AAoDtE,SAASC,EAAe;AAAA,EAC7B,UAAAC;AAAA,EACA,gBAAgBC;AAAA,EAChB,oBAAAC;AAAA,EACA,uBAAAC,IAAwB;AAC1B,GAAwB;AACtB,QAAM,CAACC,GAAwBC,CAAyB,IAAIC;AAAA,IAC1DH;AAAA,EAAA,GAGII,IAAeN,MAA6B,QAC5CO,IAAmBD,IACrBN,IACAG,GAEEK,IAAoBC;AAAA,IACxB,CAACC,MAAkB;AACjB,MAAKJ,KACHF,EAA0BM,CAAI,GAEhCT,KAAA,QAAAA,EAAqBS;AAAA,IACvB;AAAA,IACA,CAACJ,GAAcL,CAAkB;AAAA,EAAA,GAG7BU,IAAmBF,EAAY,MAAM;AACzC,IAAAD,EAAkB,CAACD,CAAgB;AAAA,EACrC,GAAG,CAACA,GAAkBC,CAAiB,CAAC,GAElCI,IAAiBH,EAAY,MAAM;AACvC,IAAAD,EAAkB,EAAI;AAAA,EACxB,GAAG,CAACA,CAAiB,CAAC,GAEhBK,IAAkBJ,EAAY,MAAM;AACxC,IAAAD,EAAkB,EAAK;AAAA,EACzB,GAAG,CAACA,CAAiB,CAAC;AAEtB,SACE,gBAAAM;AAAA,IAAClB,EAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,kBAAAW;AAAA,QACA,kBAAAI;AAAA,QACA,mBAAAH;AAAA,QACA,gBAAAI;AAAA,QACA,iBAAAC;AAAA,MAAA;AAAA,MAGD,UAAAd;AAAA,IAAA;AAAA,EAAA;AAGP;AAkBO,SAASgB,IAAuC;AACrD,QAAMC,IAAUC,EAAWrB,CAAa;AACxC,MAAI,CAACoB;AACH,UAAM,IAAI,MAAM,qDAAqD;AAEvE,SAAOA;AACT;"}
1	+ {"version":3,"file":"HeaderContext.js","sources":["../../../../../../src/ui/components/Header/contexts/HeaderContext.tsx"],"sourcesContent":["/*\n Header Context\n \n Context for managing Header component state, particularly mobile menu state.\n \n @see ADR-002: Header + SideNavbar Compatibility (ACCEPTED)\n * @see EPIC-002: Header Component\n * @see TASK-014: Implementar HeaderContext Completo\n /\n\n\"use client\";\n\n/ eslint-disable react-refresh/only-export-components /\nimport {\n createContext,\n useContext,\n useState,\n useCallback,\n type ReactNode,\n} from \"react\";\n\n/\n Header Context Value\n /\nexport interface HeaderContextValue {\n /\n Whether the mobile menu is open\n /\n isMobileMenuOpen: boolean;\n\n /\n Toggle mobile menu state\n /\n toggleMobileMenu: () => void;\n\n /\n Set mobile menu state explicitly\n /\n setMobileMenuOpen: (open: boolean) => void;\n\n /\n Open mobile menu\n /\n openMobileMenu: () => void;\n\n /\n Close mobile menu\n /\n closeMobileMenu: () => void;\n}\n\n/\n Header Context\n \n Independent context for Header component state.\n * Does not interfere with SideNavbar contexts (ADR-002).\n /\nconst HeaderContext = createContext<HeaderContextValue \| undefined>(undefined);\n\n/\n Header Provider Props\n /\nexport interface HeaderProviderProps {\n /\n Children components\n /\n children: ReactNode;\n\n /\n Controlled mode: mobile menu open state\n /\n mobileMenuOpen?: boolean;\n\n /\n Callback when mobile menu state changes\n /\n onMobileMenuChange?: (open: boolean) => void;\n\n /\n Default mobile menu open state (uncontrolled mode)\n * @default false\n /\n defaultMobileMenuOpen?: boolean;\n}\n\n/\n HeaderProvider\n \n Provides Header context for mobile menu state management.\n * Independent from SideNavbarContexts (ADR-002).\n \n Supports both controlled and uncontrolled modes.\n \n @example\n * ```tsx\n * // Uncontrolled mode\n * <HeaderProvider>\n * <Header>...</Header>\n * </HeaderProvider>\n \n // Controlled mode\n * <HeaderProvider\n * mobileMenuOpen={isOpen}\n * onMobileMenuChange={setIsOpen}\n * >\n * <Header>...</Header>\n * </HeaderProvider>\n * ```\n /\nexport function HeaderProvider({\n children,\n mobileMenuOpen: controlledMobileMenuOpen,\n onMobileMenuChange,\n defaultMobileMenuOpen = false,\n}: HeaderProviderProps) {\n const [internalMobileMenuOpen, setInternalMobileMenuOpen] = useState(\n defaultMobileMenuOpen,\n );\n\n const isControlled = controlledMobileMenuOpen !== undefined;\n const isMobileMenuOpen = isControlled\n ? controlledMobileMenuOpen\n : internalMobileMenuOpen;\n\n const setMobileMenuOpen = useCallback(\n (open: boolean) => {\n if (!isControlled) {\n setInternalMobileMenuOpen(open);\n }\n onMobileMenuChange?.(open);\n },\n [isControlled, onMobileMenuChange],\n );\n\n const toggleMobileMenu = useCallback(() => {\n setMobileMenuOpen(!isMobileMenuOpen);\n }, [isMobileMenuOpen, setMobileMenuOpen]);\n\n const openMobileMenu = useCallback(() => {\n setMobileMenuOpen(true);\n }, [setMobileMenuOpen]);\n\n const closeMobileMenu = useCallback(() => {\n setMobileMenuOpen(false);\n }, [setMobileMenuOpen]);\n\n return (\n <HeaderContext.Provider\n value={{\n isMobileMenuOpen,\n toggleMobileMenu,\n setMobileMenuOpen,\n openMobileMenu,\n closeMobileMenu,\n }}\n >\n {children}\n </HeaderContext.Provider>\n );\n}\n\n/\n useHeaderContext Hook\n \n Hook to access Header context.\n * Must be used within HeaderProvider.\n \n @throws Error if used outside HeaderProvider\n \n @example\n * ```tsx\n * function MyComponent() {\n * const { isMobileMenuOpen, toggleMobileMenu } = useHeaderContext();\n * return <button onClick={toggleMobileMenu}>Toggle</button>;\n * }\n * ```\n */\nexport function useHeaderContext(): HeaderContextValue {\n const context = useContext(HeaderContext);\n if (!context) {\n throw new Error(\"useHeaderContext must be used within HeaderProvider\");\n }\n return context;\n}\n"],"names":["HeaderContext","createContext","HeaderProvider","children","controlledMobileMenuOpen","onMobileMenuChange","defaultMobileMenuOpen","internalMobileMenuOpen","setInternalMobileMenuOpen","useState","isControlled","isMobileMenuOpen","setMobileMenuOpen","useCallback","open","toggleMobileMenu","openMobileMenu","closeMobileMenu","jsx","useHeaderContext","context","useContext"],"mappings":";;;AAyDA,MAAMA,IAAgBC,EAA8C,MAAS;AAoDtE,SAASC,EAAe;AAAA,EAC7B,UAAAC;AAAA,EACA,gBAAgBC;AAAA,EAChB,oBAAAC;AAAA,EACA,uBAAAC,IAAwB;AAC1B,GAAwB;AACtB,QAAM,CAACC,GAAwBC,CAAyB,IAAIC;AAAA,IAC1DH;AAAA,EAAA,GAGII,IAAeN,MAA6B,QAC5CO,IAAmBD,IACrBN,IACAG,GAEEK,IAAoBC;AAAA,IACxB,CAACC,MAAkB;AACjB,MAAKJ,KACHF,EAA0BM,CAAI,GAEhCT,KAAA,QAAAA,EAAqBS;AAAA,IACvB;AAAA,IACA,CAACJ,GAAcL,CAAkB;AAAA,EAAA,GAG7BU,IAAmBF,EAAY,MAAM;AACzC,IAAAD,EAAkB,CAACD,CAAgB;AAAA,EACrC,GAAG,CAACA,GAAkBC,CAAiB,CAAC,GAElCI,IAAiBH,EAAY,MAAM;AACvC,IAAAD,EAAkB,EAAI;AAAA,EACxB,GAAG,CAACA,CAAiB,CAAC,GAEhBK,IAAkBJ,EAAY,MAAM;AACxC,IAAAD,EAAkB,EAAK;AAAA,EACzB,GAAG,CAACA,CAAiB,CAAC;AAEtB,SACE,gBAAAM;AAAA,IAAClB,EAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,kBAAAW;AAAA,QACA,kBAAAI;AAAA,QACA,mBAAAH;AAAA,QACA,gBAAAI;AAAA,QACA,iBAAAC;AAAA,MAAA;AAAA,MAGD,UAAAd;AAAA,IAAA;AAAA,EAAA;AAGP;AAkBO,SAASgB,IAAuC;AACrD,QAAMC,IAAUC,EAAWrB,CAAa;AACxC,MAAI,CAACoB;AACH,UAAM,IAAI,MAAM,qDAAqD;AAEvE,SAAOA;AACT;"}

package/dist/granular/ui/components/Menu/Menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.js","sources":["../../../../../src/ui/components/Menu/Menu.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, type ReactNode } from \"react\";\nimport { MenuProvider } from \"./MenuContext\";\nimport MenuTrigger from \"./MenuTrigger\";\nimport MenuContent from \"./MenuContent\";\nimport MenuItem from \"./MenuItem\";\nimport MenuSeparator from \"./MenuSeparator\";\n\nexport type MenuPlacement = \"top\" \| \"bottom\" \| \"left\" \| \"right\";\n\nexport interface MenuProps {\n children: ReactNode;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n placement?: MenuPlacement;\n}\n\n/*\n Menu Component\n \n A dropdown menu component with keyboard navigation and portal rendering.\n * Follows Atomic Design principles as an Atom component.\n * Uses Compound Component pattern.\n \n @example\n * ```tsx\n * <Menu>\n * <MenuTrigger>\n * <Button>Open Menu</Button>\n * </MenuTrigger>\n * <MenuContent>\n * <MenuItem onClick={handleClick}>Item 1</MenuItem>\n * <MenuItem onClick={handleClick}>Item 2</MenuItem>\n * <MenuSeparator />\n * <MenuItem onClick={handleClick}>Item 3</MenuItem>\n * </MenuContent>\n * </Menu>\n * ```\n */\nexport default function Menu({\n children,\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n placement = \"bottom\",\n}: MenuProps) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n\n const isControlled = controlledOpen !== undefined;\n const isOpen = isControlled ? controlledOpen : internalOpen;\n\n const setIsOpen = (newOpen: boolean) => {\n if (!isControlled) {\n setInternalOpen(newOpen);\n }\n onOpenChange?.(newOpen);\n };\n\n const closeMenu = () => {\n setIsOpen(false);\n };\n\n return (\n <MenuProvider\n value={{\n isOpen,\n setIsOpen,\n closeMenu,\n placement,\n }}\n >\n {children}\n </MenuProvider>\n );\n}\n\n// Export sub-components for compound pattern\nMenu.Trigger = MenuTrigger;\nMenu.Content = MenuContent;\nMenu.Item = MenuItem;\nMenu.Separator = MenuSeparator;\n\n// Also export as named exports for easier imports\nexport { MenuTrigger, MenuContent, MenuItem, MenuSeparator };\n"],"names":["Menu","children","controlledOpen","defaultOpen","onOpenChange","placement","internalOpen","setInternalOpen","useState","isControlled","isOpen","setIsOpen","newOpen","jsx","MenuProvider","MenuTrigger","MenuContent","MenuItem","MenuSeparator"],"mappings":";;;;;;;;~~AAyCA~~,SAAwBA,EAAK;AAAA,EAC3B,UAAAC;AAAA,EACA,MAAMC;AAAA,EACN,aAAAC,IAAc;AAAA,EACd,cAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAc;AACZ,QAAM,CAACC,GAAcC,CAAe,IAAIC,EAASL,CAAW,GAEtDM,IAAeP,MAAmB,QAClCQ,IAASD,IAAeP,IAAiBI,GAEzCK,IAAY,CAACC,MAAqB;AACtC,IAAKH,KACHF,EAAgBK,CAAO,GAEzBR,KAAA,QAAAA,EAAeQ;AAAA,EACjB;AAMA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,QAAAJ;AAAA,QACA,WAAAC;AAAA,QACA,WATY,MAAM;AACtB,UAAAA,EAAU,EAAK;AAAA,QACjB;AAAA,QAQM,WAAAN;AAAA,MAAA;AAAA,MAGD,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP;AAGAD,EAAK,UAAUe;AACff,EAAK,UAAUgB;AACfhB,EAAK,OAAOiB;AACZjB,EAAK,YAAYkB;"}
1	+ {"version":3,"file":"Menu.js","sources":["../../../../../src/ui/components/Menu/Menu.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, type ReactNode } from \"react\";\nimport { MenuProvider } from \"./MenuContext\";\nimport MenuTrigger from \"./MenuTrigger\";\nimport MenuContent from \"./MenuContent\";\nimport MenuItem from \"./MenuItem\";\nimport MenuSeparator from \"./MenuSeparator\";\n\nexport type MenuPlacement = \"top\" \| \"bottom\" \| \"left\" \| \"right\";\n\nexport interface MenuProps {\n children: ReactNode;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n placement?: MenuPlacement;\n}\n\n/*\n Menu Component\n \n A dropdown menu component with keyboard navigation and portal rendering.\n * Uses Compound Component pattern.\n \n @example\n * ```tsx\n * <Menu>\n * <MenuTrigger>\n * <Button>Open Menu</Button>\n * </MenuTrigger>\n * <MenuContent>\n * <MenuItem onClick={handleClick}>Item 1</MenuItem>\n * <MenuItem onClick={handleClick}>Item 2</MenuItem>\n * <MenuSeparator />\n * <MenuItem onClick={handleClick}>Item 3</MenuItem>\n * </MenuContent>\n * </Menu>\n * ```\n */\nexport default function Menu({\n children,\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n placement = \"bottom\",\n}: MenuProps) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n\n const isControlled = controlledOpen !== undefined;\n const isOpen = isControlled ? controlledOpen : internalOpen;\n\n const setIsOpen = (newOpen: boolean) => {\n if (!isControlled) {\n setInternalOpen(newOpen);\n }\n onOpenChange?.(newOpen);\n };\n\n const closeMenu = () => {\n setIsOpen(false);\n };\n\n return (\n <MenuProvider\n value={{\n isOpen,\n setIsOpen,\n closeMenu,\n placement,\n }}\n >\n {children}\n </MenuProvider>\n );\n}\n\n// Export sub-components for compound pattern\nMenu.Trigger = MenuTrigger;\nMenu.Content = MenuContent;\nMenu.Item = MenuItem;\nMenu.Separator = MenuSeparator;\n\n// Also export as named exports for easier imports\nexport { MenuTrigger, MenuContent, MenuItem, MenuSeparator };\n"],"names":["Menu","children","controlledOpen","defaultOpen","onOpenChange","placement","internalOpen","setInternalOpen","useState","isControlled","isOpen","setIsOpen","newOpen","jsx","MenuProvider","MenuTrigger","MenuContent","MenuItem","MenuSeparator"],"mappings":";;;;;;;;AAwCA,SAAwBA,EAAK;AAAA,EAC3B,UAAAC;AAAA,EACA,MAAMC;AAAA,EACN,aAAAC,IAAc;AAAA,EACd,cAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAAc;AACZ,QAAM,CAACC,GAAcC,CAAe,IAAIC,EAASL,CAAW,GAEtDM,IAAeP,MAAmB,QAClCQ,IAASD,IAAeP,IAAiBI,GAEzCK,IAAY,CAACC,MAAqB;AACtC,IAAKH,KACHF,EAAgBK,CAAO,GAEzBR,KAAA,QAAAA,EAAeQ;AAAA,EACjB;AAMA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,QAAAJ;AAAA,QACA,WAAAC;AAAA,QACA,WATY,MAAM;AACtB,UAAAA,EAAU,EAAK;AAAA,QACjB;AAAA,QAQM,WAAAN;AAAA,MAAA;AAAA,MAGD,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP;AAGAD,EAAK,UAAUe;AACff,EAAK,UAAUgB;AACfhB,EAAK,OAAOiB;AACZjB,EAAK,YAAYkB;"}

package/dist/granular/ui/components/Modal/Modal.js CHANGED Viewed

@@ -1,47 +1,49 @@
 "use client";
-var S = Object.defineProperty, I = Object.defineProperties;
-var L = Object.getOwnPropertyDescriptors;
-var i = Object.getOwnPropertySymbols;
-var x = Object.prototype.hasOwnProperty, b = Object.prototype.propertyIsEnumerable;
-var y = (e, a, t) => a in e ? S(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t, v = (e, a) => {
-  for (var t in a || (a = {}))
-    x.call(a, t) && y(e, t, a[t]);
-  if (i)
-    for (var t of i(a))
-      b.call(a, t) && y(e, t, a[t]);
+var M = Object.defineProperty, X = Object.defineProperties;
+var Z = Object.getOwnPropertyDescriptors;
+var n = Object.getOwnPropertySymbols;
+var h = Object.prototype.hasOwnProperty, p = Object.prototype.propertyIsEnumerable;
+var g = (e, t, a) => t in e ? M(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a, w = (e, t) => {
+  for (var a in t || (t = {}))
+    h.call(t, a) && g(e, a, t[a]);
+  if (n)
+    for (var a of n(t))
+      p.call(t, a) && g(e, a, t[a]);
   return e;
-}, g = (e, a) => I(e, L(a));
-var h = (e, a) => {
-  var t = {};
+}, N = (e, t) => X(e, Z(t));
+var C = (e, t) => {
+  var a = {};
   for (var o in e)
-    x.call(e, o) && a.indexOf(o) < 0 && (t[o] = e[o]);
-  if (e != null && i)
-    for (var o of i(e))
-      a.indexOf(o) < 0 && b.call(e, o) && (t[o] = e[o]);
-  return t;
+    h.call(e, o) && t.indexOf(o) < 0 && (a[o] = e[o]);
+  if (e != null && n)
+    for (var o of n(e))
+      t.indexOf(o) < 0 && p.call(e, o) && (a[o] = e[o]);
+  return a;
 };
-import { jsxs as d, jsx as l } from "react/jsx-runtime";
-import { useRef as P, useEffect as p } from "react";
-import { createPortal as T } from "react-dom";
-import { X as w } from "lucide-react";
-import { getRadiusClass as z } from "../../tokens/radius.js";
-import { getShadowClass as A } from "../../tokens/shadows.js";
-import { getSpacingClass as r } from "../../tokens/spacing.js";
-import { getZIndexClass as M } from "../../tokens/z-index.js";
-import { useFocusRestore as X } from "../../hooks/useFocusRestore.js";
-import { useFocusTrap as Z } from "../../hooks/useFocusTrap.js";
-import { useAutoFocus as q } from "../../hooks/useAutoFocus.js";
-function ee(B) {
-  var f = B, {
+import { jsxs as m, jsx as l } from "react/jsx-runtime";
+import { useRef as j, useId as q, useEffect as k } from "react";
+import { createPortal as D } from "react-dom";
+import { X as E } from "lucide-react";
+import { getRadiusClass as G } from "../../tokens/radius.js";
+import { getShadowClass as H } from "../../tokens/shadows.js";
+import { getSpacingClass as s } from "../../tokens/spacing.js";
+import { getZIndexClass as J } from "../../tokens/z-index.js";
+import { useFocusRestore as K } from "../../hooks/useFocusRestore.js";
+import { useFocusTrap as Q } from "../../hooks/useFocusTrap.js";
+import { useAutoFocus as U } from "../../hooks/useAutoFocus.js";
+function se(V) {
+  var u = V, {
     isOpen: e,
-    onClose: a,
-    title: t,
+    onClose: t,
+    title: a,
     children: o,
-    variant: N = "default",
-    showCloseButton: m = !0,
-    footer: c,
-    className: C = ""
-  } = f, j = h(f, [
+    variant: R = "default",
+    showCloseButton: c = !0,
+    footer: f,
+    className: $ = "",
+    "aria-label": I,
+    "aria-labelledby": i
+  } = u, F = C(u, [
     "isOpen",
     "onClose",
     "title",
@@ -49,110 +51,120 @@ function ee(B) {
     "variant",
     "showCloseButton",
     "footer",
-    "className"
+    "className",
+    "aria-label",
+    "aria-labelledby"
   ]);
-  const n = P(null);
-  if (X(e), Z(n, e), q(n, e), p(() => {
+  const d = j(null), b = j(null), x = q(), y = i != null ? i : a ? x : void 0;
+  if (K(e), Q(d, e), U(d, e), k(() => {
     if (!e) return;
-    const s = (F) => {
-      F.key === "Escape" && a();
+    const r = (A) => {
+      A.key === "Escape" && t();
     };
-    return document.addEventListener("keydown", s), () => {
-      document.removeEventListener("keydown", s);
+    return document.addEventListener("keydown", r), () => {
+      document.removeEventListener("keydown", r);
     };
-  }, [e, a]), p(() => (e ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
+  }, [e, t]), k(() => (e ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
     document.body.style.overflow = "";
   }), [e]), !e) return null;
-  const k = [
+  const S = [
     "fixed",
     "inset-0",
-    M("modal"),
+    J("modal"),
     "overflow-y-auto"
-  ], E = ["fixed", "inset-0", "bg-scrim", "transition-opacity"], $ = {
+  ], P = ["fixed", "inset-0", "bg-scrim", "transition-opacity"], T = {
     default: "max-w-md",
     large: "max-w-2xl",
     fullscreen: "max-w-full h-full"
-  }, R = [
+  }, z = [
     "relative",
     "bg-surface-overlay",
-    z("lg"),
-    A("xl"),
-    r("xl", "my"),
+    G("lg"),
+    H("xl"),
+    s("xl", "my"),
     "mx-auto",
-    $[N],
-    r("lg", "p"),
-    C
-  ].filter(Boolean).join(" "), u = /* @__PURE__ */ d(
+    T[R],
+    s("lg", "p"),
+    $
+  ].filter(Boolean).join(" "), v = /* @__PURE__ */ m(
     "div",
     {
-      className: k.join(" "),
+      className: S.join(" "),
       role: "dialog",
       "aria-modal": "true",
-      "aria-labelledby": t ? "modal-title" : void 0,
-      onClick: (s) => {
-        s.target === s.currentTarget && a();
+      "aria-labelledby": y,
+      "aria-label": y ? void 0 : I,
+      onClick: (r) => {
+        (r.target === r.currentTarget || r.target === b.current) && t();
       },
       children: [
-        /* @__PURE__ */ l("div", { className: E.join(" "), "aria-hidden": "true" }),
         /* @__PURE__ */ l(
           "div",
           {
-            className: `flex min-h-full items-center justify-center ${r("base", "p")}`,
-            children: /* @__PURE__ */ d(
+            ref: b,
+            className: P.join(" "),
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "div",
+          {
+            className: `flex min-h-full items-center justify-center ${s("base", "p")}`,
+            children: /* @__PURE__ */ m(
               "div",
-              g(v({
-                ref: n,
+              N(w({
+                ref: d,
                 tabIndex: -1,
-                className: R,
-                onClick: (s) => s.stopPropagation()
-              }, j), {
+                className: z,
+                onClick: (r) => r.stopPropagation()
+              }, F), {
                 children: [
-                  t && /* @__PURE__ */ d(
+                  a && /* @__PURE__ */ m(
                     "div",
                     {
-                      className: `flex justify-between items-center ${r("base", "mb")}`,
+                      className: `flex justify-between items-center ${s("base", "mb")}`,
                       children: [
                         /* @__PURE__ */ l(
                           "h2",
                           {
-                            id: "modal-title",
+                            id: x,
                             className: "text-xl font-semibold text-fg-primary",
-                            children: t
+                            children: a
                           }
                         ),
-                        m && /* @__PURE__ */ l(
+                        c && /* @__PURE__ */ l(
                           "button",
                           {
-                            onClick: a,
+                            onClick: t,
                             className: "text-fg-tertiary hover:text-fg-secondary focus:outline-none",
                             "aria-label": "Close modal",
-                            children: /* @__PURE__ */ l(w, { className: "h-6 w-6" })
+                            children: /* @__PURE__ */ l(E, { className: "h-6 w-6" })
                           }
                         )
                       ]
                     }
                   ),
-                  !t && m && /* @__PURE__ */ l(
+                  !a && c && /* @__PURE__ */ l(
                     "div",
                     {
-                      className: `flex justify-end ${r("base", "mb")}`,
+                      className: `flex justify-end ${s("base", "mb")}`,
                       children: /* @__PURE__ */ l(
                         "button",
                         {
-                          onClick: a,
+                          onClick: t,
                           className: "text-fg-tertiary hover:text-fg-secondary focus:outline-none",
                           "aria-label": "Close modal",
-                          children: /* @__PURE__ */ l(w, { className: "h-6 w-6" })
+                          children: /* @__PURE__ */ l(E, { className: "h-6 w-6" })
                         }
                       )
                     }
                   ),
-                  /* @__PURE__ */ l("div", { className: r("base", "mb"), children: o }),
-                  c && /* @__PURE__ */ l(
+                  /* @__PURE__ */ l("div", { className: s("base", "mb"), children: o }),
+                  f && /* @__PURE__ */ l(
                     "div",
                     {
-                      className: `flex justify-end ${r("sm", "gap")} ${r("base", "mt")}`,
-                      children: c
+                      className: `flex justify-end ${s("sm", "gap")} ${s("base", "mt")}`,
+                      children: f
                     }
                   )
                 ]
@@ -163,9 +175,9 @@ function ee(B) {
       ]
     }
   );
-  return typeof window != "undefined" ? T(u, document.body) : u;
+  return typeof window != "undefined" ? D(v, document.body) : v;
 }
 export {
-  ee as default
+  se as default
 };
 //# sourceMappingURL=Modal.js.map

package/dist/granular/ui/components/Modal/Modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.js","sources":["../../../../../src/ui/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { useEffect, useRef } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { X } from \"lucide-react\";\nimport { getRadiusClass } from \"../../tokens/radius\";\nimport { getShadowClass } from \"../../tokens/shadows\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport { getZIndexClass } from \"../../tokens/z-index\";\nimport { useFocusRestore } from \"../../hooks/useFocusRestore\";\nimport { useFocusTrap } from \"../../hooks/useFocusTrap\";\nimport { useAutoFocus } from \"../../hooks/useAutoFocus\";\n\ninterface Props extends HTMLAttributes<HTMLDivElement> {\n isOpen: boolean;\n onClose: () => void;\n title?: string;\n children: ReactNode;\n variant?: \"default\" \| \"large\" \| \"fullscreen\";\n showCloseButton?: boolean;\n footer?: ReactNode;\n}\n\n/*\n Modal Component\n \n A modal/dialog component with overlay, portal rendering, and accessibility.\n * Follows Atomic Design principles as an Organism component.\n \n @example\n * ```tsx\n * <Modal isOpen={isOpen} onClose={handleClose} title=\"Confirm Action\">\n * <p>Are you sure?</p>\n * </Modal>\n * ```\n */\nexport default function Modal({\n isOpen,\n onClose,\n title,\n children,\n variant = \"default\",\n showCloseButton = true,\n footer,\n className = \"\",\n ...props\n}: Props) {\n const modalRef = useRef<HTMLDivElement>(null);\n\n // Modal focus contract: trap + restore + auto-focus from the shared\n // Phase 3 hooks. Replaces an inline implementation that snapshotted\n // document.activeElement, focused the modal CONTAINER (not its first\n // focusable child), and restored on cleanup. The hook variant of\n // auto-focus targets the first focusable inside the modal — matching\n // Dialog/Drawer post-PR-#138/#140 — and falls back to focusing the\n // container with tabindex=-1 when no focusable child exists, so the\n // existing tabIndex={-1} on the inner div still has a job to do in\n // that fallback path. The trap was MISSING pre-PR-#141: Modal\n // declared aria-modal=true without any Tab interception, identical\n // shape to the Drawer gap closed in #138. WCAG 2.4.3.\n useFocusRestore(isOpen);\n useFocusTrap(modalRef, isOpen);\n useAutoFocus(modalRef, isOpen);\n\n // ESC handling stays inline. Same shape as the Dialog/Drawer parallel\n // handlers — the shared hooks intentionally don't know about\n // close-callback semantics.\n useEffect(() => {\n if (!isOpen) return;\n\n const handleEscape = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") {\n onClose();\n }\n };\n\n document.addEventListener(\"keydown\", handleEscape);\n return () => {\n document.removeEventListener(\"keydown\", handleEscape);\n };\n }, [isOpen, onClose]);\n\n // Prevent body scroll when modal is open\n useEffect(() => {\n if (isOpen) {\n document.body.style.overflow = \"hidden\";\n } else {\n document.body.style.overflow = \"\";\n }\n return () => {\n document.body.style.overflow = \"\";\n };\n }, [isOpen]);\n\n if (!isOpen) return null;\n\n const baseClasses = [\n \"fixed\",\n \"inset-0\",\n getZIndexClass(\"modal\"),\n \"overflow-y-auto\",\n ];\n\n const overlayClasses = [\"fixed\", \"inset-0\", \"bg-scrim\", \"transition-opacity\"];\n\n const modalSizeClasses: Record<NonNullable<Props[\"variant\"]>, string> = {\n default: \"max-w-md\",\n large: \"max-w-2xl\",\n fullscreen: \"max-w-full h-full\",\n };\n\n const modalClasses = [\n \"relative\",\n \"bg-surface-overlay\",\n getRadiusClass(\"lg\"),\n getShadowClass(\"xl\"),\n getSpacingClass(\"xl\", \"my\"),\n \"mx-auto\",\n modalSizeClasses[variant],\n getSpacingClass(\"lg\", \"p\"),\n className,\n ]\n .filter(Boolean)\n .join(\" \");\n\n const modalContent = (\n <div\n className={baseClasses.join(\" \")}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={title ? \"modal-title\" : undefined}\n onClick={(e) => {\n if (e.target === e.currentTarget) {\n onClose();\n }\n }}\n >\n <div className={overlayClasses.join(\" \")} aria-hidden=\"true\" />\n <div\n className={`flex min-h-full items-center justify-center ${getSpacingClass(\"base\", \"p\")}`}\n >\n <div\n ref={modalRef}\n tabIndex={-1}\n className={modalClasses}\n onClick={(e) => e.stopPropagation()}\n {...props}\n >\n {title && (\n <div\n className={`flex justify-between items-center ${getSpacingClass(\"base\", \"mb\")}`}\n >\n <h2\n id=\"modal-title\"\n className=\"text-xl font-semibold text-fg-primary\"\n >\n {title}\n </h2>\n {showCloseButton && (\n <button\n onClick={onClose}\n className=\"text-fg-tertiary hover:text-fg-secondary focus:outline-none\"\n aria-label=\"Close modal\"\n >\n <X className=\"h-6 w-6\" />\n </button>\n )}\n </div>\n )}\n {!title && showCloseButton && (\n <div\n className={`flex justify-end ${getSpacingClass(\"base\", \"mb\")}`}\n >\n <button\n onClick={onClose}\n className=\"text-fg-tertiary hover:text-fg-secondary focus:outline-none\"\n aria-label=\"Close modal\"\n >\n <X className=\"h-6 w-6\" />\n </button>\n </div>\n )}\n <div className={getSpacingClass(\"base\", \"mb\")}>{children}</div>\n {footer && (\n <div\n className={`flex justify-end ${getSpacingClass(\"sm\", \"gap\")} ${getSpacingClass(\"base\", \"mt\")}`}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n\n // Portal rendering to avoid z-index issues\n if (typeof window !== \"undefined\") {\n return createPortal(modalContent, document.body);\n }\n\n return modalContent;\n}\n"],"names":["Modal","_a","_b","isOpen","onClose","title","children","variant","showCloseButton","footer","className","props","__objRest","modalRef","useRef","useFocusRestore","useFocusTrap","useAutoFocus","useEffect","handleEscape","e","baseClasses","getZIndexClass","overlayClasses","modalSizeClasses","modalClasses","getRadiusClass","getShadowClass","getSpacingClass","modalContent","jsxs","jsx","__spreadProps","__spreadValues","X","createPortal"],"mappings":"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"}
1	+ {"version":3,"file":"Modal.js","sources":["../../../../../src/ui/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\n\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { useEffect, useId, useRef } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { X } from \"lucide-react\";\nimport { getRadiusClass } from \"../../tokens/radius\";\nimport { getShadowClass } from \"../../tokens/shadows\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport { getZIndexClass } from \"../../tokens/z-index\";\nimport { useFocusRestore } from \"../../hooks/useFocusRestore\";\nimport { useFocusTrap } from \"../../hooks/useFocusTrap\";\nimport { useAutoFocus } from \"../../hooks/useAutoFocus\";\n\ninterface Props extends HTMLAttributes<HTMLDivElement> {\n isOpen: boolean;\n onClose: () => void;\n title?: string;\n children: ReactNode;\n variant?: \"default\" \| \"large\" \| \"fullscreen\";\n showCloseButton?: boolean;\n footer?: ReactNode;\n}\n\n/*\n Modal Component\n \n A modal/dialog component with overlay, portal rendering, and accessibility.\n \n @example\n * ```tsx\n * <Modal isOpen={isOpen} onClose={handleClose} title=\"Confirm Action\">\n * <p>Are you sure?</p>\n * </Modal>\n * ```\n */\nexport default function Modal({\n isOpen,\n onClose,\n title,\n children,\n variant = \"default\",\n showCloseButton = true,\n footer,\n className = \"\",\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ...props\n}: Props) {\n const modalRef = useRef<HTMLDivElement>(null);\n const overlayRef = useRef<HTMLDivElement>(null);\n const titleId = useId();\n // Accessible-name precedence: explicit aria-labelledby > the title\n // heading > consumer aria-label. Mirrors DrawerContent so a titleless\n // Modal can still be named from the outside (axe aria-dialog-name).\n const resolvedLabelledBy = ariaLabelledBy ?? (title ? titleId : undefined);\n\n // Modal focus contract: trap + restore + auto-focus from the shared\n // Phase 3 hooks. Replaces an inline implementation that snapshotted\n // document.activeElement, focused the modal CONTAINER (not its first\n // focusable child), and restored on cleanup. The hook variant of\n // auto-focus targets the first focusable inside the modal — matching\n // Dialog/Drawer post-PR-#138/#140 — and falls back to focusing the\n // container with tabindex=-1 when no focusable child exists, so the\n // existing tabIndex={-1} on the inner div still has a job to do in\n // that fallback path. The trap was MISSING pre-PR-#141: Modal\n // declared aria-modal=true without any Tab interception, identical\n // shape to the Drawer gap closed in #138. WCAG 2.4.3.\n useFocusRestore(isOpen);\n useFocusTrap(modalRef, isOpen);\n useAutoFocus(modalRef, isOpen);\n\n // ESC handling stays inline. Same shape as the Dialog/Drawer parallel\n // handlers — the shared hooks intentionally don't know about\n // close-callback semantics.\n useEffect(() => {\n if (!isOpen) return;\n\n const handleEscape = (e: KeyboardEvent) => {\n if (e.key === \"Escape\") {\n onClose();\n }\n };\n\n document.addEventListener(\"keydown\", handleEscape);\n return () => {\n document.removeEventListener(\"keydown\", handleEscape);\n };\n }, [isOpen, onClose]);\n\n // Prevent body scroll when modal is open\n useEffect(() => {\n if (isOpen) {\n document.body.style.overflow = \"hidden\";\n } else {\n document.body.style.overflow = \"\";\n }\n return () => {\n document.body.style.overflow = \"\";\n };\n }, [isOpen]);\n\n if (!isOpen) return null;\n\n const baseClasses = [\n \"fixed\",\n \"inset-0\",\n getZIndexClass(\"modal\"),\n \"overflow-y-auto\",\n ];\n\n const overlayClasses = [\"fixed\", \"inset-0\", \"bg-scrim\", \"transition-opacity\"];\n\n const modalSizeClasses: Record<NonNullable<Props[\"variant\"]>, string> = {\n default: \"max-w-md\",\n large: \"max-w-2xl\",\n fullscreen: \"max-w-full h-full\",\n };\n\n const modalClasses = [\n \"relative\",\n \"bg-surface-overlay\",\n getRadiusClass(\"lg\"),\n getShadowClass(\"xl\"),\n getSpacingClass(\"xl\", \"my\"),\n \"mx-auto\",\n modalSizeClasses[variant],\n getSpacingClass(\"lg\", \"p\"),\n className,\n ]\n .filter(Boolean)\n .join(\" \");\n\n const modalContent = (\n <div\n className={baseClasses.join(\" \")}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={resolvedLabelledBy}\n aria-label={resolvedLabelledBy ? undefined : ariaLabel}\n onClick={(e) => {\n // The panel calls stopPropagation, so any click reaching this\n // handler is on the backdrop. The visible dim layer is the\n // overlay div (painted above the centering div), so a real\n // pointer hits overlayRef — not currentTarget. Accept both.\n if (e.target === e.currentTarget \|\| e.target === overlayRef.current) {\n onClose();\n }\n }}\n >\n <div\n ref={overlayRef}\n className={overlayClasses.join(\" \")}\n aria-hidden=\"true\"\n />\n <div\n className={`flex min-h-full items-center justify-center ${getSpacingClass(\"base\", \"p\")}`}\n >\n <div\n ref={modalRef}\n tabIndex={-1}\n className={modalClasses}\n onClick={(e) => e.stopPropagation()}\n {...props}\n >\n {title && (\n <div\n className={`flex justify-between items-center ${getSpacingClass(\"base\", \"mb\")}`}\n >\n <h2\n id={titleId}\n className=\"text-xl font-semibold text-fg-primary\"\n >\n {title}\n </h2>\n {showCloseButton && (\n <button\n onClick={onClose}\n className=\"text-fg-tertiary hover:text-fg-secondary focus:outline-none\"\n aria-label=\"Close modal\"\n >\n <X className=\"h-6 w-6\" />\n </button>\n )}\n </div>\n )}\n {!title && showCloseButton && (\n <div\n className={`flex justify-end ${getSpacingClass(\"base\", \"mb\")}`}\n >\n <button\n onClick={onClose}\n className=\"text-fg-tertiary hover:text-fg-secondary focus:outline-none\"\n aria-label=\"Close modal\"\n >\n <X className=\"h-6 w-6\" />\n </button>\n </div>\n )}\n <div className={getSpacingClass(\"base\", \"mb\")}>{children}</div>\n {footer && (\n <div\n className={`flex justify-end ${getSpacingClass(\"sm\", \"gap\")} ${getSpacingClass(\"base\", \"mt\")}`}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n\n // Portal rendering to avoid z-index issues\n if (typeof window !== \"undefined\") {\n return createPortal(modalContent, document.body);\n }\n\n return modalContent;\n}\n"],"names":["Modal","_a","_b","isOpen","onClose","title","children","variant","showCloseButton","footer","className","ariaLabel","ariaLabelledBy","props","__objRest","modalRef","useRef","overlayRef","titleId","useId","resolvedLabelledBy","useFocusRestore","useFocusTrap","useAutoFocus","useEffect","handleEscape","e","baseClasses","getZIndexClass","overlayClasses","modalSizeClasses","modalClasses","getRadiusClass","getShadowClass","getSpacingClass","modalContent","jsxs","jsx","__spreadProps","__spreadValues","X","createPortal"],"mappings":"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"}