@dev-dga/react 0.13.0 → 1.1.0

package/dist/index.js

@@ -1,5 +1,14 @@
 "use client";
 import "./chunk-ZY5XXYXJ.js";
+import {
+  Textarea,
+  textareaVariants
+} from "./chunk-DUJ2QWTC.js";
+import "./chunk-L2D4TPJW.js";
+import {
+  Toggle,
+  toggleVariants
+} from "./chunk-VISVU5LS.js";
 import "./chunk-Q3XKCP3I.js";
 import {
   Timeline,
@@ -12,27 +21,22 @@ import {
   timelineMarkerVariants,
   timelineVariants
 } from "./chunk-NS4IRTKQ.js";
-import "./chunk-L2D4TPJW.js";
-import {
-  Toggle,
-  toggleVariants
-} from "./chunk-VISVU5LS.js";
 import "./chunk-XBAAHOCP.js";
 import "./chunk-ZCO5QKH2.js";
 import {
   TagInput,
   tagInputVariants
-} from "./chunk-WRCHASO2.js";
+} from "./chunk-6LRMCCGU.js";
 import "./chunk-VB5VOUED.js";
 import {
   Tag,
   tagVariants
 } from "./chunk-JWOG4I4P.js";
-import {
-  Textarea,
-  textareaVariants
-} from "./chunk-BQZ4XAYH.js";
 import "./chunk-T2E5XT7P.js";
+import {
+  StatusTag,
+  statusTagVariants
+} from "./chunk-QG3PLYK6.js";
 import "./chunk-MS6HASC6.js";
 import {
   StructuredList,
@@ -42,12 +46,12 @@ import {
   StructuredListHeader,
   StructuredListRow,
   structuredListVariants
-} from "./chunk-U7SCEB34.js";
+} from "./chunk-VAGYICPO.js";
 import "./chunk-DPHQAA3B.js";
 import {
   Switch,
   switchVariants
-} from "./chunk-GHJEE4NW.js";
+} from "./chunk-6AWYGPVV.js";
 import "./chunk-VP7DRJUZ.js";
 import {
   Table,
@@ -75,17 +79,12 @@ import {
   SlideoutMenuTitle,
   SlideoutMenuTrigger,
   slideoutMenuContentVariants
-} from "./chunk-KSEN4ESR.js";
+} from "./chunk-WU3IBHA4.js";
 import "./chunk-JVUANKS3.js";
 import {
   Slider,
   sliderVariants
-} from "./chunk-55RHNN3T.js";
-import {
-  StatusTag,
-  statusTagVariants
-} from "./chunk-QG3PLYK6.js";
-import "./chunk-KGXGTWUL.js";
+} from "./chunk-Y4JUMIH4.js";
 import "./chunk-R2JNRNK4.js";
 import {
   Sidebar,
@@ -97,7 +96,7 @@ import {
   SidebarRail,
   SidebarSeparator,
   SidebarTrigger
-} from "./chunk-NKCBDSI2.js";
+} from "./chunk-C7QGHL2M.js";
 import {
   SidebarGroup,
   SidebarGroupAction,
@@ -116,7 +115,7 @@ import {
   SidebarMenuSubItem,
   sidebarMenuButtonVariants,
   sidebarMenuSubButtonVariants
-} from "./chunk-WHKNCDTX.js";
+} from "./chunk-N2OE2MUB.js";
 import "./chunk-66R54X6R.js";
 import {
   HelpIcon,
@@ -124,37 +123,48 @@ import {
   TooltipContent,
   TooltipTrigger,
   tooltipContentVariants
-} from "./chunk-FF4QNJOQ.js";
+} from "./chunk-MFBGKD5J.js";
 import "./chunk-WY4KTEIL.js";
+import {
+  Skeleton,
+  skeletonVariants
+} from "./chunk-6LV62GNU.js";
 import {
   useSidebar
 } from "./chunk-F7NPGAKU.js";
 import {
   useIsMobile
 } from "./chunk-QHCXQQ2J.js";
+import "./chunk-KGXGTWUL.js";
 import {
-  Skeleton,
-  skeletonVariants
-} from "./chunk-6LV62GNU.js";
+  Select,
+  SelectItem,
+  selectTriggerVariants
+} from "./chunk-3BDWXIO2.js";
 import "./chunk-TQYLAWHW.js";
+import {
+  Rating,
+  ratingVariants
+} from "./chunk-SHP4KSPL.js";
 import "./chunk-7PSLMVCX.js";
 import {
   SaudiRiyal,
   SaudiRiyalSymbol,
   saudiRiyalSymbolVariants,
   saudiRiyalVariants
-} from "./chunk-7EEKESAA.js";
+} from "./chunk-4IUOTHJC.js";
 import "./chunk-JQJSYOJP.js";
 import {
   ScrollArea,
   scrollAreaVariants
 } from "./chunk-TXQK3BAO.js";
-import {
-  Select,
-  SelectItem,
-  selectTriggerVariants
-} from "./chunk-TPD2GNR6.js";
 import "./chunk-IW7UX7SA.js";
+import {
+  CircularProgress,
+  Progress,
+  circularProgressVariants,
+  progressVariants
+} from "./chunk-JADNUODB.js";
 import "./chunk-2I7URBEK.js";
 import {
   ProgressIndicator,
@@ -177,16 +187,12 @@ import {
   RadioGroup,
   radioGroupVariants,
   radioVariants
-} from "./chunk-WGCK6KKL.js";
-import {
-  Rating,
-  ratingVariants
-} from "./chunk-VJV3K53D.js";
+} from "./chunk-SZRP2ODO.js";
 import "./chunk-J7AM52HN.js";
 import {
   NumberInput,
   numberInputVariants
-} from "./chunk-GS7QTYLD.js";
+} from "./chunk-S3JTU4FH.js";
 import "./chunk-B6ODWTVF.js";
 import {
   Pagination,
@@ -199,17 +205,15 @@ import {
   PaginationPrevious,
   paginationLinkVariants,
   paginationVariants
-} from "./chunk-PLT3EZZ5.js";
+} from "./chunk-7NXFVPPR.js";
 import {
   paginationRange
 } from "./chunk-HIZSEYQY.js";
-import {
-  CircularProgress,
-  Progress,
-  circularProgressVariants,
-  progressVariants
-} from "./chunk-ANHZT2X2.js";
 import "./chunk-F5YD6T5D.js";
+import {
+  MetricGroup,
+  metricGroupVariants
+} from "./chunk-JXATJSBR.js";
 import "./chunk-WAIVED2F.js";
 import {
   Modal,
@@ -222,7 +226,7 @@ import {
   ModalTitle,
   ModalTrigger,
   modalContentVariants
-} from "./chunk-ZNDJS2W7.js";
+} from "./chunk-P4AMGEAG.js";
 import "./chunk-YD2UW3PB.js";
 import {
   Notification,
@@ -240,6 +244,7 @@ import {
   toast,
   toastStore
 } from "./chunk-HMXCWHVT.js";
+import "./chunk-JEBCK5VJ.js";
 import "./chunk-XLJTCZEJ.js";
 import {
   Link,
@@ -269,21 +274,47 @@ import {
   MenubarTrigger,
   menubarContentVariants,
   menubarTriggerVariants
-} from "./chunk-KDV7V5S4.js";
+} from "./chunk-3GW6NMDL.js";
 import {
   Metric,
   MetricChange,
   MetricChart,
   metricVariants
 } from "./chunk-NOXQQACO.js";
-import {
-  MetricGroup,
-  metricGroupVariants
-} from "./chunk-JXATJSBR.js";
 import "./chunk-MZALAXZZ.js";
+import "./chunk-44S33DGQ.js";
 import {
-  FileUpload
-} from "./chunk-WLJHHTE2.js";
+  Filtration,
+  FiltrationCheckboxFilter,
+  FiltrationFooter,
+  FiltrationOption,
+  FiltrationOptionList,
+  FiltrationPanel,
+  FiltrationResults,
+  FiltrationSection,
+  FiltrationTrigger,
+  filtrationPanelVariants
+} from "./chunk-IS7NNFV3.js";
+import "./chunk-HBCSQSOP.js";
+import {
+  SearchBox
+} from "./chunk-S7KATX5T.js";
+import "./chunk-CWUZ4SZN.js";
+import {
+  TextInput,
+  TextInputAffix,
+  TextInputDropdown,
+  textInputVariants
+} from "./chunk-4G42XPSB.js";
+import "./chunk-ZPUYNM37.js";
+import {
+  Popover,
+  PopoverAnchor,
+  PopoverClose,
+  PopoverContent,
+  PopoverTrigger,
+  popoverContentVariants
+} from "./chunk-JHWACBNX.js";
 import "./chunk-5DBKWVTZ.js";
 import {
   FloatingButton,
@@ -295,11 +326,11 @@ import {
   InlineAlertAction,
   inlineAlertVariants
 } from "./chunk-MVKIXWKJ.js";
-import "./chunk-JEBCK5VJ.js";
 import {
   InputOTP,
   inputOTPVariants
-} from "./chunk-BP6BOEVE.js";
+} from "./chunk-EBV35LZE.js";
+import "./chunk-O6AFVTKN.js";
 import "./chunk-AMYFRY7K.js";
 import {
   Dropdown,
@@ -307,7 +338,7 @@ import {
   DropdownItem,
   DropdownSeparator,
   dropdownTriggerVariants
-} from "./chunk-GEVXV4RL.js";
+} from "./chunk-GGWMXMBP.js";
 import "./chunk-2PESUXE3.js";
 import "./chunk-AMRMIZNY.js";
 import {
@@ -318,39 +349,9 @@ import {
   EmptyStateTitle,
   emptyStateVariants
 } from "./chunk-VRPFA4CN.js";
-import "./chunk-44S33DGQ.js";
-import {
-  Filtration,
-  FiltrationCheckboxFilter,
-  FiltrationFooter,
-  FiltrationOption,
-  FiltrationOptionList,
-  FiltrationPanel,
-  FiltrationResults,
-  FiltrationSection,
-  FiltrationTrigger,
-  filtrationPanelVariants
-} from "./chunk-J53OY747.js";
-import "./chunk-HBCSQSOP.js";
-import {
-  SearchBox
-} from "./chunk-4S2DSEXR.js";
-import "./chunk-CWUZ4SZN.js";
-import {
-  TextInput,
-  TextInputAffix,
-  TextInputDropdown,
-  textInputVariants
-} from "./chunk-4HBVLISS.js";
-import "./chunk-ZPUYNM37.js";
 import {
-  Popover,
-  PopoverAnchor,
-  PopoverClose,
-  PopoverContent,
-  PopoverTrigger,
-  popoverContentVariants
-} from "./chunk-APD5WA65.js";
+  FileUpload
+} from "./chunk-TPZTJDCN.js";
 import "./chunk-L23ETA7K.js";
 import {
   DescriptionDetails,
@@ -369,7 +370,6 @@ import {
   Divider,
   dividerVariants
 } from "./chunk-CUGEH7EB.js";
-import "./chunk-O6AFVTKN.js";
 import {
   Drawer,
   DrawerBody,
@@ -381,7 +381,8 @@ import {
   DrawerTitle,
   DrawerTrigger,
   drawerVariants
-} from "./chunk-TG2IDU3W.js";
+} from "./chunk-6UMASQFJ.js";
+import "./chunk-4WUUV44R.js";
 import "./chunk-FAHKOTCS.js";
 import {
   Command,
@@ -393,41 +394,34 @@ import {
   CommandList,
   CommandSeparator,
   commandVariants
-} from "./chunk-FPXFD5XT.js";
+} from "./chunk-KXBRKW25.js";
 import "./chunk-GIHJ4J47.js";
 import {
   ContentSwitcher,
   ContentSwitcherItem,
   contentSwitcherVariants
 } from "./chunk-QE3ZFSJK.js";
-import "./chunk-4SDRJW3D.js";
-import {
-  DatePicker,
-  datePickerVariants
-} from "./chunk-BC2DJQ3Y.js";
-import "./chunk-7WDQQSRQ.js";
-import {
-  DateRangePicker,
-  dateRangePickerTriggerVariants,
-  dateRangePickerVariants
-} from "./chunk-XIJKAUCN.js";
-import "./chunk-SDFMITFO.js";
-import "./chunk-AR7K3D3Z.js";
+import "./chunk-AVHWS36I.js";
 import "./chunk-TZWNX7FF.js";
 import {
   Checkbox,
   checkboxVariants
-} from "./chunk-TNIRKGXY.js";
+} from "./chunk-T6RGNFKN.js";
 import "./chunk-TPNCV7KA.js";
 import {
   Chip,
   chipVariants
 } from "./chunk-SQ7NQVEK.js";
-import "./chunk-4WUUV44R.js";
+import "./chunk-S5JMXY7Z.js";
+import {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger
+} from "./chunk-775MRN7R.js";
 import {
   CodeSnippet,
   CodeSnippetInline
-} from "./chunk-54KSDBGC.js";
+} from "./chunk-JXMXEBXP.js";
 import {
   Tabs,
   TabsContent,
@@ -435,7 +429,7 @@ import {
   TabsTrigger,
   tabsListVariants,
   tabsVariants
-} from "./chunk-G6LUBXN2.js";
+} from "./chunk-OXMWQMYF.js";
 import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
@@ -451,25 +445,8 @@ import {
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
   dropdownMenuVariants
-} from "./chunk-XB6YHZAG.js";
-import "./chunk-S5JMXY7Z.js";
-import {
-  Collapsible,
-  CollapsibleContent,
-  CollapsibleTrigger
-} from "./chunk-775MRN7R.js";
+} from "./chunk-JBTM3SFO.js";
 import "./chunk-FHORBVCQ.js";
-import {
-  Breadcrumb,
-  BreadcrumbEllipsis,
-  BreadcrumbEllipsisTrigger,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbList,
-  BreadcrumbPage,
-  BreadcrumbSeparator,
-  breadcrumbVariants
-} from "./chunk-AMF37AOD.js";
 import "./chunk-OF7NTZ2I.js";
 import {
   Card,
@@ -482,7 +459,17 @@ import {
   CardImage,
   CardTitle,
   cardVariants
-} from "./chunk-MECGQLHL.js";
+} from "./chunk-NJIQJHJS.js";
+import "./chunk-N5JDL4VE.js";
+import {
+  Button,
+  buttonVariants
+} from "./chunk-GQAX2CH6.js";
+import "./chunk-TH3ITGUM.js";
+import {
+  Spinner,
+  spinnerVariants
+} from "./chunk-FO7IICMM.js";
 import "./chunk-MKQBAQIH.js";
 import {
   Carousel,
@@ -495,12 +482,11 @@ import {
   carouselDotsVariants,
   carouselVariants
 } from "./chunk-LEDIOXDM.js";
-import "./chunk-AVHWS36I.js";
 import {
   BarChart,
   LineChart,
   PieChart
-} from "./chunk-5GDTEDDH.js";
+} from "./chunk-OUS6KAYF.js";
 import "./chunk-L6HWOYOY.js";
 import {
   Accordion,
@@ -509,7 +495,6 @@ import {
   AccordionTrigger,
   accordionVariants
 } from "./chunk-CYHSWWH6.js";
-import "./chunk-FFGALWM2.js";
 import "./chunk-2F6V4OWR.js";
 import {
   AspectRatio
@@ -522,16 +507,34 @@ import {
   AvatarImage,
   avatarVariants
 } from "./chunk-Y2E2RLBI.js";
-import "./chunk-N5JDL4VE.js";
 import {
-  Button,
-  buttonVariants
-} from "./chunk-GQAX2CH6.js";
-import "./chunk-TH3ITGUM.js";
+  Breadcrumb,
+  BreadcrumbEllipsis,
+  BreadcrumbEllipsisTrigger,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbList,
+  BreadcrumbPage,
+  BreadcrumbSeparator,
+  breadcrumbVariants
+} from "./chunk-AMF37AOD.js";
+import "./chunk-7WDQQSRQ.js";
+import "./chunk-4SDRJW3D.js";
 import {
-  Spinner,
-  spinnerVariants
-} from "./chunk-FO7IICMM.js";
+  DatePicker,
+  datePickerVariants
+} from "./chunk-BC2DJQ3Y.js";
+import {
+  DateRangePicker,
+  dateRangePickerTriggerVariants,
+  dateRangePickerVariants
+} from "./chunk-XIJKAUCN.js";
+import "./chunk-SDFMITFO.js";
+import "./chunk-AR7K3D3Z.js";
+import "./chunk-FFGALWM2.js";
+import {
+  cn
+} from "./chunk-7NTT2UXP.js";
 import "./chunk-WI5UIBM5.js";
 import {
   FieldMessage
@@ -544,13 +547,10 @@ import {
 } from "./chunk-XFVRBYPC.js";
 import {
   DgaProvider
-} from "./chunk-YVB5RTKR.js";
+} from "./chunk-TZ6IKB3E.js";
 import {
   useDga
 } from "./chunk-TMXABSFE.js";
-import {
-  cn
-} from "./chunk-7NTT2UXP.js";
 export {
   Accordion,
   AccordionContent,

package/dist/providers/DgaProvider.cjs

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _chunkP2CSX4DZcjs = require('../chunk-P2CSX4DZ.cjs');
+var _chunkTBI3YP65cjs = require('../chunk-TBI3YP65.cjs');
 require('../chunk-FQLVTLUI.cjs');
 
 
-exports.DgaProvider = _chunkP2CSX4DZcjs.DgaProvider;
+exports.DgaProvider = _chunkTBI3YP65cjs.DgaProvider;
 //# sourceMappingURL=DgaProvider.cjs.map

package/dist/providers/DgaProvider.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   DgaProvider
-} from "../chunk-YVB5RTKR.js";
+} from "../chunk-TZ6IKB3E.js";
 import "../chunk-TMXABSFE.js";
 export {
   DgaProvider

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dev-dga/react",
-  "version": "0.13.0",
+  "version": "1.1.0",
   "description": "Independent React 19 component library implementing Saudi Arabia's DGA (Digital Government Authority) Platforms Code design system. Accessible (WCAG 2.2 AA), RTL-native, Arabic-first, dark-mode ready, RSC-compatible. Not affiliated with the DGA.",
   "keywords": [
     "react",
@@ -53,6 +53,16 @@
         "types": "./dist/index.d.cts",
         "default": "./dist/index.cjs"
       }
+    },
+    "./date-picker": {
+      "import": {
+        "types": "./dist/date-picker.d.ts",
+        "default": "./dist/date-picker.js"
+      },
+      "require": {
+        "types": "./dist/date-picker.d.cts",
+        "default": "./dist/date-picker.cjs"
+      }
     }
   },
   "engines": {
@@ -65,12 +75,12 @@
     "cmdk": "^1.1.1",
     "radix-ui": "^1.0.0",
     "react-aria-components": "^1.17.0",
-    "@dev-dga/tokens": "0.13.0"
+    "@dev-dga/tokens": "1.1.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@dev-dga/css": "0.13.0"
+    "@dev-dga/css": "1.1.0"
   },
   "devDependencies": {
     "@storybook/react-vite": "^10.2.15",

package/dist/chunk-KSEN4ESR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/SlideoutMenu/SlideoutMenu.tsx"],"sourcesContent":["'use client';\n\nimport { useContext, useId } from 'react';\nimport { Dialog as DialogPrimitive, Slot as SlotPrimitive } from 'radix-ui';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\nimport { DgaContext } from '../../providers/DgaContext';\nimport { Close } from '../../internal/icons';\n\n// Nav panel on Radix Dialog. Uses <ul>/<li>/link semantics, NOT role=\"menu\" (which breaks SR browse mode for site nav).\n\nconst slideoutMenuContentVariants = cva('ddga-slideout-menu', {\n  variants: {\n    side: {\n      start: 'ddga-slideout-menu--start',\n      end: 'ddga-slideout-menu--end',\n    },\n    /** Panel surface — SDGA \"Background Color\". Gray (`gray-100`) or White. */\n    background: {\n      gray: 'ddga-slideout-menu--gray',\n      white: 'ddga-slideout-menu--white',\n    },\n  },\n  defaultVariants: {\n    side: 'start',\n    background: 'gray',\n  },\n});\n\ntype SlideoutMenuProps = React.ComponentProps<typeof DialogPrimitive.Root>;\ntype SlideoutMenuTriggerProps = React.ComponentProps<typeof DialogPrimitive.Trigger>;\ntype SlideoutMenuCloseProps = React.ComponentProps<typeof DialogPrimitive.Close>;\n\ninterface SlideoutMenuContentProps\n  extends\n    React.ComponentProps<typeof DialogPrimitive.Content>,\n    VariantProps<typeof slideoutMenuContentVariants> {}\n\ninterface SlideoutMenuHeaderProps extends React.ComponentProps<'div'> {\n  /** Optional featured icon, shown in a 32px brand-tinted disc before the title. */\n  icon?: React.ReactNode;\n  /** Render the close (X) button. Defaults to `true`. */\n  showClose?: boolean;\n  /** Localized aria-label for the close button. Defaults to `\"Close\"`. */\n  closeLabel?: string;\n}\n\ninterface SlideoutMenuTitleProps extends React.ComponentProps<typeof DialogPrimitive.Title> {\n  asChild?: boolean;\n}\n\ninterface SlideoutMenuDescriptionProps extends React.ComponentProps<\n  typeof DialogPrimitive.Description\n> {\n  asChild?: boolean;\n}\n\ntype SlideoutMenuSectionProps = React.ComponentProps<'div'> & { asChild?: boolean };\n\ninterface SlideoutMenuGroupProps extends React.ComponentProps<'div'> {\n  /** Section heading rendered above the list (SDGA \"Group Label\"). */\n  label?: React.ReactNode;\n}\n\ninterface SlideoutMenuItemProps extends React.ComponentProps<'button'> {\n  /** Render as the child element (e.g. an `<a>` or router `<Link>`). */\n  asChild?: boolean;\n  /** Leading 24px icon. */\n  icon?: React.ReactNode;\n  /** Trailing slot — counter text, an icon button, a check, a `Tag`, etc. */\n  trailing?: React.ReactNode;\n  /** Marks the current page — sets `aria-current=\"page\"` and the active style. */\n  active?: boolean;\n}\n\nfunction SlideoutMenu(props: SlideoutMenuProps) {\n  return <DialogPrimitive.Root {...props} />;\n}\n\nfunction SlideoutMenuTrigger({ className, ...props }: SlideoutMenuTriggerProps) {\n  return (\n    <DialogPrimitive.Trigger data-slot=\"slideout-menu-trigger\" className={className} {...props} />\n  );\n}\n\nfunction SlideoutMenuContent({\n  side,\n  background,\n  className,\n  children,\n  ...props\n}: SlideoutMenuContentProps) {\n  // Portal anchored to the provider root so theme/dark-mode inherit and the fixed panel escapes ancestor transforms.\n  const ctx = useContext(DgaContext);\n  const portalContainer = ctx?.portalEl ?? ctx?.rootEl ?? undefined;\n\n  return (\n    <DialogPrimitive.Portal container={portalContainer}>\n      <DialogPrimitive.Overlay\n        className=\"ddga-slideout-menu__overlay\"\n        data-slot=\"slideout-menu-overlay\"\n      />\n      <DialogPrimitive.Content\n        data-slot=\"slideout-menu-content\"\n        className={cn(slideoutMenuContentVariants({ side, background }), className)}\n        {...props}\n      >\n        {children}\n      </DialogPrimitive.Content>\n    </DialogPrimitive.Portal>\n  );\n}\n\nfunction SlideoutMenuHeader({\n  icon,\n  showClose = true,\n  closeLabel = 'Close',\n  className,\n  children,\n  ...props\n}: SlideoutMenuHeaderProps) {\n  return (\n    <div\n      data-slot=\"slideout-menu-header\"\n      className={cn('ddga-slideout-menu__header', className)}\n      {...props}\n    >\n      <div className=\"ddga-slideout-menu__header-content\">\n        {icon ? (\n          <span\n            data-slot=\"slideout-menu-featured-icon\"\n            className=\"ddga-slideout-menu__featured-icon\"\n            aria-hidden=\"true\"\n          >\n            {icon}\n          </span>\n        ) : null}\n        <div className=\"ddga-slideout-menu__header-text\">{children}</div>\n      </div>\n      {showClose ? (\n        <DialogPrimitive.Close\n          className=\"ddga-slideout-menu__close\"\n          aria-label={closeLabel}\n          data-slot=\"slideout-menu-close-x\"\n        >\n          <Close aria-hidden=\"true\" />\n        </DialogPrimitive.Close>\n      ) : null}\n    </div>\n  );\n}\n\nfunction SlideoutMenuTitle({ asChild, className, ...props }: SlideoutMenuTitleProps) {\n  return (\n    <DialogPrimitive.Title\n      asChild={asChild}\n      data-slot=\"slideout-menu-title\"\n      className={cn('ddga-slideout-menu__title', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SlideoutMenuDescription({ asChild, className, ...props }: SlideoutMenuDescriptionProps) {\n  return (\n    <DialogPrimitive.Description\n      asChild={asChild}\n      data-slot=\"slideout-menu-description\"\n      className={cn('ddga-slideout-menu__description', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SlideoutMenuBody({ asChild, className, ...props }: SlideoutMenuSectionProps) {\n  // asChild lets consumers make the scroll region a `<nav aria-label>` landmark.\n  const Comp = asChild ? SlotPrimitive.Slot : 'div';\n  return (\n    <Comp\n      data-slot=\"slideout-menu-body\"\n      className={cn('ddga-slideout-menu__body', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SlideoutMenuGroup({ label, className, children, ...props }: SlideoutMenuGroupProps) {\n  const labelId = useId();\n  return (\n    <div\n      data-slot=\"slideout-menu-group\"\n      className={cn('ddga-slideout-menu__group', className)}\n      {...props}\n    >\n      {label != null ? (\n        <div id={labelId} className=\"ddga-slideout-menu__group-label\">\n          {label}\n        </div>\n      ) : null}\n      <ul\n        className=\"ddga-slideout-menu__list\"\n        {...(label != null ? { 'aria-labelledby': labelId } : {})}\n      >\n        {children}\n      </ul>\n    </div>\n  );\n}\n\nfunction SlideoutMenuItem({\n  asChild,\n  icon,\n  trailing,\n  active,\n  className,\n  children,\n  ...props\n}: SlideoutMenuItemProps) {\n  const Comp = asChild ? SlotPrimitive.Slot : 'button';\n  return (\n    <li data-slot=\"slideout-menu-item-wrapper\" className=\"ddga-slideout-menu__item-wrapper\">\n      <Comp\n        data-slot=\"slideout-menu-item\"\n        className={cn('ddga-slideout-menu__item', className)}\n        data-active={active ? '' : undefined}\n        aria-current={active ? 'page' : undefined}\n        {...(asChild ? {} : { type: 'button' as const })}\n        {...props}\n      >\n        {icon ? (\n          <span className=\"ddga-slideout-menu__item-icon\" aria-hidden=\"true\">\n            {icon}\n          </span>\n        ) : null}\n        {asChild ? (\n          <SlotPrimitive.Slottable>{children}</SlotPrimitive.Slottable>\n        ) : (\n          <span className=\"ddga-slideout-menu__item-label\">{children}</span>\n        )}\n        {trailing ? <span className=\"ddga-slideout-menu__item-trailing\">{trailing}</span> : null}\n      </Comp>\n    </li>\n  );\n}\n\nfunction SlideoutMenuSeparator({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"slideout-menu-separator\"\n      role=\"separator\"\n      className={cn('ddga-slideout-menu__separator', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SlideoutMenuFooter({ asChild, className, ...props }: SlideoutMenuSectionProps) {\n  const Comp = asChild ? SlotPrimitive.Slot : 'div';\n  return (\n    <Comp\n      data-slot=\"slideout-menu-footer\"\n      className={cn('ddga-slideout-menu__footer', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SlideoutMenuClose({ className, ...props }: SlideoutMenuCloseProps) {\n  return <DialogPrimitive.Close data-slot=\"slideout-menu-close\" className={className} {...props} />;\n}\n\nexport {\n  SlideoutMenu,\n  SlideoutMenuTrigger,\n  SlideoutMenuContent,\n  SlideoutMenuHeader,\n  SlideoutMenuTitle,\n  SlideoutMenuDescription,\n  SlideoutMenuBody,\n  SlideoutMenuGroup,\n  SlideoutMenuItem,\n  SlideoutMenuSeparator,\n  SlideoutMenuFooter,\n  SlideoutMenuClose,\n  slideoutMenuContentVariants,\n};\nexport type {\n  SlideoutMenuProps,\n  SlideoutMenuTriggerProps,\n  SlideoutMenuContentProps,\n  SlideoutMenuHeaderProps,\n  SlideoutMenuTitleProps,\n  SlideoutMenuDescriptionProps,\n  SlideoutMenuSectionProps,\n  SlideoutMenuGroupProps,\n  SlideoutMenuItemProps,\n  SlideoutMenuCloseProps,\n};\n"],"mappings":"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","names":[]}

package/dist/chunk-P2CSX4DZ.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-P2CSX4DZ.cjs","../src/providers/DgaProvider.tsx"],"names":[],"mappings":"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","file":"/home/devdhaif/work/react/dga-dev/packages/react/dist/chunk-P2CSX4DZ.cjs","sourcesContent":[null,"'use client';\n\nimport { useState, useMemo, useContext, useEffect, useRef } from 'react';\nimport { Direction as DirectionPrimitive, Tooltip as TooltipPrimitive } from 'radix-ui';\nimport { buildTheme, type DgaTheme } from '@dev-dga/tokens';\nimport { DgaContext, type DgaContextValue } from './DgaContext';\n\ntype DgaRootElement =\n  | 'div'\n  | 'main'\n  | 'nav'\n  | 'section'\n  | 'article'\n  | 'aside'\n  | 'header'\n  | 'footer';\n\nexport interface DgaProviderProps {\n  dir?: 'ltr' | 'rtl';\n  locale?: string;\n  mode?: 'light' | 'dark';\n  /**\n   * Brand theme. `theme.primary` accepts a palette name (`'lavender'`),\n   * any CSS color string (`'#7C3AED'` , hover/active auto-derived via\n   * `color-mix()`), or an explicit `{ base, hover, active, foreground? }`\n   * triplet. The override-object pattern (`style={{ '--ddga-color-primary':\n   * '...' }}`) still works , `style` wins over `theme`.\n   */\n  theme?: DgaTheme;\n  as?: DgaRootElement;\n  className?: string;\n  style?: React.CSSProperties;\n  children: React.ReactNode;\n}\n\nexport function DgaProvider({\n  dir = 'ltr',\n  locale,\n  mode = 'light',\n  theme,\n  as: Component = 'div',\n  className,\n  style: consumerStyle,\n  children,\n}: DgaProviderProps) {\n  const parentCtx = useContext(DgaContext);\n  const isNested = parentCtx !== null;\n  // Callback ref + state so context subscribers (e.g. Select's portal\n  // container) re-render when the element actually mounts. With useRef\n  // the .current update wouldn't trigger a render and a defaultOpen\n  // portal would race to <body> before the ref populated.\n  const [rootEl, setRootEl] = useState<HTMLElement | null>(null);\n  // The portal element is held in a ref (we directly mutate its attributes\n  // + inline CSS variables, which the react-hooks/immutability lint rule\n  // forbids on state values). A parallel `portalEl` state mirrors the ref\n  // so context subscribers re-render once the element mounts.\n  const portalRef = useRef<HTMLDivElement | null>(null);\n  const [portalEl, setPortalEl] = useState<HTMLElement | null>(null);\n  const resolvedLocale = locale ?? (dir === 'rtl' ? 'ar' : 'en');\n\n  // Memoize by reference. Stable palette-name themes (`{ primary: 'lavender' }`\n  // declared at module scope) never recompute; consumers passing an inline\n  // object accept a per-render `buildTheme` call (cheap , small switch\n  // statement over a single string).\n  const themeVars = useMemo(() => (theme ? buildTheme(theme) : null), [theme]);\n\n  // ─── Body-level portal container ─── //\n  //\n  // Create a sibling-of-body div that mirrors this provider's theme\n  // attributes. Overlay portals (Modal, Drawer, DropdownMenu, etc.) anchor\n  // here instead of `rootEl` so:\n  //\n  //  - They escape `overflow: hidden` / `transform` ancestors the consumer\n  //    might wrap us in (Storybook's docs-story preview block is the\n  //    motivating case — a `transform` ancestor breaks `position: fixed`\n  //    descendants, clipping modals to the preview rect).\n  //  - Theme variables, dark mode, RTL still resolve because we copy\n  //    `data-theme`, `dir`, and inline CSS vars from this provider onto\n  //    the portal element.\n  //\n  // One container per DgaProvider instance — cleaned up on unmount. SSR-safe\n  // (effects only run client-side; consumers see `portalEl: null` and the\n  // overlays fall back to `rootEl`).\n  useEffect(() => {\n    if (typeof document === 'undefined') return;\n    const el = document.createElement('div');\n    el.setAttribute('data-slot', 'dga-portal');\n    // Position relative for any child popper computing offset against\n    // nearest positioned ancestor; z-index so the portal sits above the\n    // main content stack.\n    el.style.position = 'relative';\n    el.style.zIndex = '50';\n    document.body.appendChild(el);\n    portalRef.current = el;\n    // The setState here exposes the freshly-mounted DOM element to context\n    // subscribers (overlay components) so they re-render and target the\n    // portal on first commit. Single call on mount + single on unmount;\n    // not the cascading-render footgun the lint rule guards against.\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setPortalEl(el);\n    return () => {\n      el.remove();\n      portalRef.current = null;\n\n      setPortalEl(null);\n    };\n  }, []);\n\n  // Mirror theme attributes onto the portal element so its descendants\n  // resolve `var(--ddga-*)` and respect dark mode / RTL the same way as\n  // descendants of `rootEl`. We mutate via the ref (not the state) so the\n  // react-hooks/immutability rule stays happy — and run this on every prop\n  // change that affects appearance.\n  useEffect(() => {\n    const el = portalRef.current;\n    if (!el) return;\n    el.setAttribute('data-theme', mode);\n    el.setAttribute('dir', dir);\n    el.style.colorScheme = mode;\n    if (themeVars) {\n      for (const [k, v] of Object.entries(themeVars)) {\n        el.style.setProperty(k, String(v));\n      }\n    }\n  }, [mode, dir, themeVars, portalEl]);\n\n  const ctxValue = useMemo<DgaContextValue>(\n    () => ({ dir, locale: resolvedLocale, mode, rootEl, portalEl }),\n    [dir, resolvedLocale, mode, rootEl, portalEl],\n  );\n\n  // Radix's Direction.Provider propagates `dir` to portal-rendered content\n  // (Tooltip/Select/Toast/Modal) that would otherwise inherit body dir,\n  // not the dir on this wrapper element. Nested providers reuse the parent\n  // direction via their own Direction.Provider, so this is safe to repeat.\n  const inner = <DirectionPrimitive.Provider dir={dir}>{children}</DirectionPrimitive.Provider>;\n\n  return (\n    <DgaContext.Provider value={ctxValue}>\n      <Component\n        ref={setRootEl}\n        dir={dir}\n        lang={resolvedLocale}\n        data-slot=\"dga-root\"\n        data-theme={mode}\n        className={className}\n        // Order: colorScheme → theme vars → consumer style. A manually-\n        // supplied `style` overrides `theme` (escape hatch preserved per\n        // THEMING-PLAN.md: every `--ddga-*` remains plain-CSS overridable).\n        style={{ colorScheme: mode, ...(themeVars ?? {}), ...consumerStyle }}\n      >\n        {isNested ? (\n          inner\n        ) : (\n          <TooltipPrimitive.Provider delayDuration={300} skipDelayDuration={100}>\n            {inner}\n          </TooltipPrimitive.Provider>\n        )}\n      </Component>\n    </DgaContext.Provider>\n  );\n}\n"]}