npm - erp-pro-ui - Versions diffs - 0.1.8 → 0.2.0 - Mend

erp-pro-ui 0.1.8 → 0.2.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 (309) hide show

package/dist/chunks/select-D0GOBB-b.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"select-D0GOBB-b.mjs","names":[],"sources":["../../src/components/forms/select/Select.tsx"],"sourcesContent":["import {\n forwardRef,\n useEffect,\n useRef,\n useState,\n type ChangeEvent,\n type ForwardedRef,\n type KeyboardEvent,\n type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { CheckIcon, ChevronDownIcon } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { TruncatedText } from \"../../typography/truncated-text\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SelectProps } from \"./types\";\n\nexport const Select = forwardRef(function SelectComponent(\n {\n className = \"\",\n containerClassName = \"\",\n triggerClassName = \"\",\n dropdownClassName = \"\",\n optionClassName = \"\",\n label,\n error,\n helperText,\n options,\n value,\n onChange,\n placeholder = \"Select...\",\n noOptionsText = \"No options\",\n disabled,\n bgClassName = \"bg-ds-surface-1\",\n size = \"default\",\n selectionIndicator = \"check\",\n ...props\n }: SelectProps,\n ref: ForwardedRef<HTMLSelectElement>,\n) {\n const [open, setOpen] = useState(false);\n const [visible, setVisible] = useState(false);\n const hiddenSelectRef = useRef<HTMLSelectElement>(null);\n const selectedOptionRef = useRef<HTMLDivElement>(null);\n const mouseX = useMotionValue(0);\n const mouseY = useMotionValue(0);\n const radius = 100;\n const isCompact = size === \"compact\";\n const selectedOption = options.find((option) => option.value === value);\n\n useEffect(() => {\n if (typeof ref === \"function\") {\n ref(hiddenSelectRef.current);\n return;\n }\n\n if (ref) {\n ref.current = hiddenSelectRef.current;\n }\n }, [ref]);\n\n useEffect(() => {\n if (!open || !selectedOptionRef.current) {\n return;\n }\n\n const frameId = window.requestAnimationFrame(() => {\n selectedOptionRef.current?.scrollIntoView({ block: \"nearest\" });\n });\n\n return () => {\n window.cancelAnimationFrame(frameId);\n };\n }, [open, value]);\n\n const handleMouseMove = (event: ReactMouseEvent<HTMLDivElement>) => {\n const { left, top } = event.currentTarget.getBoundingClientRect();\n mouseX.set(event.clientX - left);\n mouseY.set(event.clientY - top);\n };\n\n const handleSelect = (optionValue: string) => {\n if (onChange && hiddenSelectRef.current) {\n const syntheticEvent = {\n target: { value: optionValue, name: props.name },\n currentTarget: { value: optionValue, name: props.name },\n } as ChangeEvent<HTMLSelectElement>;\n\n onChange(syntheticEvent);\n }\n\n setOpen(false);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (disabled) {\n return;\n }\n\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n setOpen((current) => !current);\n }\n\n if (event.key === \"Escape\") {\n setOpen(false);\n }\n };\n\n return (\n <div\n className={mergeClassNames(\n \"w-full\",\n isCompact ? \"min-w-0\" : \"min-w-48\",\n containerClassName,\n )}\n >\n {label ? (\n <label className=\"mb-2 block text-sm leading-none font-medium text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">\n {label}\n </label>\n ) : null}\n\n <select\n ref={hiddenSelectRef}\n className=\"sr-only\"\n value={value}\n onChange={onChange}\n disabled={disabled}\n {...props}\n >\n <option value=\"\">{placeholder}</option>\n {options.map((option) => (\n <option key={option.value} value={option.value}>\n {option.label}\n </option>\n ))}\n </select>\n\n <DropdownMenu\n className={mergeClassNames(\"w-full\", className)}\n open={open}\n onOpenChange={(nextOpen) => {\n if (disabled) {\n setOpen(false);\n return;\n }\n\n setOpen(nextOpen);\n }}\n panelClassName={mergeClassNames(\n \" left-0 top-[40px] z-20 mt-1 flex flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition\",\n isCompact ? \"max-h-56\" : \"max-h-60\",\n dropdownClassName,\n )}\n animationClassName=\"origin-top-left\"\n trigger={\n <motion.div\n style={{\n backgroundImage: disabled\n ? \"none\"\n : useMotionTemplate`\n radial-gradient(\n ${visible ? `${radius}px` : \"0px\"} circle at ${mouseX}px ${mouseY}px,\n var(--ds-color-accent),\n transparent 90%\n )\n `,\n }}\n onMouseMove={!disabled ? handleMouseMove : undefined}\n onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n className={mergeClassNames(\n \"group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent\",\n disabled\n ? \"border-none bg-ds-surface-1\"\n : error\n ? \"border-ds-state-error-border\"\n : \"border-ds-border-2\",\n )}\n >\n <div\n className={mergeClassNames(\n \"flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out\",\n isCompact\n ? \"h-9 px-2.5 py-2 text-sm\"\n : \"h-10 px-3 py-2 text-sm\",\n bgClassName,\n disabled ? \"cursor-not-allowed opacity-50\" : \"text-ds-1\",\n error\n ? \"border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border\"\n : \"\",\n triggerClassName,\n )}\n onKeyDown={handleKeyDown}\n role=\"button\"\n tabIndex={disabled ? -1 : 0}\n aria-haspopup=\"listbox\"\n aria-expanded={open}\n >\n {selectedOption ? (\n <TruncatedText\n as=\"span\"\n showTitleOnHover\n className=\"flex-1 text-ds-1\"\n >\n {selectedOption.label}\n </TruncatedText>\n ) : (\n <TruncatedText as=\"span\" className=\"flex-1 text-ds-2\">\n {placeholder}\n </TruncatedText>\n )}\n\n <span\n className={mergeClassNames(\n \"ml-2 shrink-0 text-ds-2 transition-transform duration-300\",\n open ? \"rotate-180\" : \"rotate-0\",\n )}\n >\n <ChevronDownIcon\n width={24}\n height={24}\n color=\"currentColor\"\n className={isCompact ? \"h-4 w-4\" : \"h-5 w-5\"}\n />\n </span>\n </div>\n </motion.div>\n }\n >\n {!disabled ? (\n <>\n {options.length === 0 ? (\n <div className=\"px-3 py-2 text-ds-2\">{noOptionsText}</div>\n ) : null}\n\n {options.map((option) => (\n <div\n key={option.value}\n ref={option.value === value ? selectedOptionRef : null}\n className={mergeClassNames(\n \"mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition\",\n isCompact\n ? \"gap-1.5 px-2.5 py-2 text-sm\"\n : \"gap-2 px-3 py-2 text-sm\",\n option.value === value\n ? \"bg-ds-accent-subtle font-semibold text-ds-1\"\n : \"\",\n \"hover:bg-ds-accent hover:text-ds-on-accent\",\n optionClassName,\n )}\n onClick={() => handleSelect(option.value)}\n >\n {selectionIndicator === \"check\" ? (\n <span\n className={mergeClassNames(\n \"flex items-center justify-center\",\n isCompact ? \"w-4\" : \"w-5\",\n )}\n >\n {option.value === value ? (\n <CheckIcon\n className=\"text-ds-1\"\n width={isCompact ? 16 : 18}\n height={isCompact ? 16 : 18}\n />\n ) : null}\n </span>\n ) : null}\n <TruncatedText as=\"span\" showTitleOnHover className=\"flex-1\">\n {option.label}\n </TruncatedText>\n </div>\n ))}\n </>\n ) : null}\n </DropdownMenu>\n\n {error ? (\n <p className=\"mt-1 text-sm font-medium text-ds-state-error-text\">\n {error}\n </p>\n ) : null}\n {helperText && !error ? (\n <p className=\"mt-1 text-sm text-ds-2\">{helperText}</p>\n ) : null}\n </div>\n );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":"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"}

package/dist/chunks/sidebar-BrOLz89T.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sidebar-BrOLz89T.mjs","names":[],"sources":["../../src/components/navigation/sidebar/HamburgerIcon.tsx","../../src/components/navigation/sidebar/NavLink.tsx","../../src/components/navigation/sidebar/SidebarLinks.tsx","../../src/components/navigation/sidebar/Sidebar.tsx","../../src/components/navigation/sidebar/DashboardSidebarShell.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\n\nexport interface HamburgerIconProps {\n isOpen: boolean;\n className?: string;\n}\n\nconst lineClassName =\n \"block h-0.5 w-full rounded-lg bg-current transition-all duration-300 ease-in-out\";\n\nexport function HamburgerIcon({ isOpen, className }: HamburgerIconProps) {\n return (\n <span\n className={mergeClassNames(\n \"relative flex h-4 w-5 flex-col items-center justify-between\",\n className,\n )}\n aria-hidden=\"true\"\n >\n <span\n className={mergeClassNames(\n lineClassName,\n isOpen && \"translate-y-[5px] rotate-45 transform\",\n )}\n />\n <span className={mergeClassNames(lineClassName, isOpen && \"w-0\")} />\n <span\n className={mergeClassNames(\n lineClassName,\n isOpen && \"-translate-y-[9px] -rotate-45 transform\",\n )}\n />\n </span>\n );\n}\n","import { useMemo } from \"react\";\n\nimport { Button } from \"../../forms/button\";\nimport type { SidebarNavLinkProps } from \"./types\";\n\nexport function NavLink({\n className,\n children,\n style,\n borderRadius,\n disabled = false,\n href,\n target,\n rel,\n onClick,\n}: SidebarNavLinkProps) {\n const memoizedStyle = useMemo(\n () => (borderRadius !== undefined ? { ...style, borderRadius } : style),\n [borderRadius, style],\n );\n\n if (href) {\n const resolvedRel = target === \"_blank\" ? (rel ?? \"noreferrer noopener\") : rel;\n\n return (\n <a\n href={href}\n className={className}\n style={memoizedStyle}\n target={target}\n rel={resolvedRel}\n aria-disabled={disabled}\n onClick={(event) => {\n if (disabled) {\n event.preventDefault();\n return;\n }\n\n onClick?.(event);\n }}\n >\n {children}\n </a>\n );\n }\n\n return (\n <Button\n type=\"button\"\n variant=\"tertiary\"\n className={className}\n style={memoizedStyle}\n disabled={disabled}\n onClick={onClick}\n >\n {children}\n </Button>\n );\n}\n","import { mergeClassNames } from \"../../../utils\";\nimport { NavLink } from \"./NavLink\";\nimport type { SidebarDirection, SidebarItem, SidebarLinksProps } from \"./types\";\n\nconst rtlLanguages = /^(ar|fa|ur|he)(-|$)/i;\n\nfunction resolveDirection(\n direction: SidebarDirection,\n): Exclude<SidebarDirection, \"auto\"> {\n if (direction !== \"auto\") {\n return direction;\n }\n\n if (typeof document === \"undefined\") {\n return \"ltr\";\n }\n\n const explicitDirection =\n document.documentElement.getAttribute(\"dir\") ?? undefined;\n\n if (explicitDirection === \"rtl\" || explicitDirection === \"ltr\") {\n return explicitDirection;\n }\n\n if (\n typeof navigator !== \"undefined\" &&\n rtlLanguages.test(navigator.language)\n ) {\n return \"rtl\";\n }\n\n return \"ltr\";\n}\n\nfunction isRouteActive(item: SidebarItem, activePath?: string): boolean {\n if (typeof item.active === \"boolean\") {\n return item.active;\n }\n\n if (!activePath || !item.href) {\n return false;\n }\n\n return activePath === item.href || activePath.startsWith(`${item.href}/`);\n}\n\nexport function SidebarLinks({\n items,\n activePath,\n onItemSelect,\n direction = \"auto\",\n className,\n itemClassName,\n activeItemClassName,\n}: SidebarLinksProps) {\n const effectiveDirection = resolveDirection(direction);\n const visibleItems = items.filter((item) => !item.hidden);\n\n return (\n <ul className={mergeClassNames(\"space-y-1.5\", className)}>\n {visibleItems.map((item) => {\n const active = isRouteActive(item, activePath);\n\n return (\n <li key={item.id} className=\"relative\">\n <NavLink\n href={item.href}\n disabled={item.disabled}\n className={mergeClassNames(\n \"group relative flex w-full items-center gap-2.5 rounded-md border px-3 py-2.5 transition-all duration-200\",\n effectiveDirection === \"rtl\" ? \"text-right\" : \"text-left\",\n \"border-transparent text-ds-2 hover:border-ds-border-3 hover:bg-ds-surface-2/80 hover:text-ds-1\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ds-focus/60 focus-visible:ring-offset-2 focus-visible:ring-offset-ds-canvas\",\n item.disabled && \"cursor-not-allowed opacity-50\",\n active &&\n \"border-ds-border-accent/35 bg-ds-accent-subtle text-ds-1 shadow-[0_4px_12px_color-mix(in_srgb,var(--ds-color-fg)_8%,transparent)]\",\n active && activeItemClassName,\n itemClassName,\n )}\n onClick={(event) => {\n item.onSelect?.(event);\n onItemSelect?.(item, event);\n }}\n >\n <span\n className={mergeClassNames(\n \"inline-flex h-5 w-5 shrink-0 items-center justify-center\",\n active ? \"text-ds-1\" : \"text-ds-2 group-hover:text-ds-1\",\n )}\n aria-hidden=\"true\"\n >\n {item.icon}\n </span>\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {item.label}\n </span>\n {item.badge ? (\n <span className=\"shrink-0 text-xs text-ds-2\">{item.badge}</span>\n ) : null}\n </NavLink>\n {active ? (\n <span\n className={mergeClassNames(\n \"pointer-events-none absolute top-1.5 h-[calc(100%-12px)] w-2\",\n effectiveDirection === \"rtl\" ? \"right-0\" : \"left-0\",\n )}\n aria-hidden=\"true\"\n >\n {/* <span className=\"absolute inset-y-1 left-1/2 w-2 -translate-x-1/2 rounded-full bg-ds-accent/25 blur-[4px]\" /> */}\n {/* <span className=\"absolute inset-y-0 left-1/6 w-[2px] -translate-x-1/2 rounded-full bg-ds-accent motion-safe:animate-pulse\" /> */}\n {/* <span className=\"absolute top-2.5 left-1/2 h-2 w-2 -translate-x-1/2 rounded-full bg-ds-accent shadow-[0_0_10px_color-mix(in_srgb,var(--ds-color-accent)_55%,transparent)] motion-safe:animate-pulse\" /> */}\n </span>\n ) : null}\n </li>\n );\n })}\n </ul>\n );\n}\n","import { useCallback, useMemo, useState } from \"react\";\n\nimport { Button } from \"../../forms/button\";\nimport { mergeClassNames } from \"../../../utils\";\nimport { HamburgerIcon } from \"./HamburgerIcon\";\nimport { SidebarLinks } from \"./SidebarLinks\";\nimport type { SidebarProps } from \"./types\";\n\nfunction useControllableOpenState(\n open: boolean | undefined,\n defaultOpen: boolean,\n onOpenChange?: (open: boolean) => void,\n) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n const isControlled = open !== undefined;\n const resolvedOpen = isControlled ? open : internalOpen;\n\n const setOpen = useCallback(\n (nextOpen: boolean) => {\n if (!isControlled) {\n setInternalOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n },\n [isControlled, onOpenChange],\n );\n\n return [resolvedOpen, setOpen] as const;\n}\n\nconst fallbackBrand = (\n <div className=\"text-xl font-bold uppercase tracking-wide text-ds-1\">\n <span className=\"text-ds-accent\">ERP</span>\n <span className=\"font-medium\">PRO</span>\n </div>\n);\n\nexport function Sidebar({\n items,\n open,\n defaultOpen = false,\n onOpenChange,\n activePath,\n onItemSelect,\n direction = \"auto\",\n navbar,\n brand = fallbackBrand,\n footer,\n className,\n linksClassName,\n itemClassName,\n activeItemClassName,\n overlayClassName,\n closeLabel = \"Toggle sidebar\",\n showOverlay = true,\n}: SidebarProps) {\n const [resolvedOpen, setOpen] = useControllableOpenState(\n open,\n defaultOpen,\n onOpenChange,\n );\n\n const content = useMemo(\n () => (\n <aside\n dir={direction === \"auto\" ? undefined : direction}\n className={mergeClassNames(\n \"fixed inset-y-2 z-50 flex w-72 flex-col rounded-xl border border-ds-border-3 bg-ds-surface-1/92 p-3 shadow-[0_10px_28px_color-mix(in_srgb,var(--ds-color-fg)_9%,transparent)] backdrop-blur-xl\",\n \"transition-transform duration-200 ease-out xl:translate-x-0\",\n direction === \"rtl\" ? \"right-2\" : \"left-2\",\n resolvedOpen\n ? \"translate-x-0\"\n : direction === \"rtl\"\n ? \"translate-x-[110%] xl:translate-x-0\"\n : \"-translate-x-[110%] xl:translate-x-0\",\n className,\n )}\n style={{\n backdropFilter: \"blur(14px) saturate(120%)\",\n WebkitBackdropFilter: \"blur(14px) saturate(120%)\",\n }}\n >\n {navbar ? (\n <div className=\"mb-4\">{navbar}</div>\n ) : (\n <div className=\"mb-4 flex items-center justify-between gap-3 rounded-xl border border-ds-border-3 bg-ds-surface-2/85 px-3 py-2\">\n <div className=\"min-w-0 flex-1\">{brand}</div>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n aria-label={closeLabel}\n className={mergeClassNames(\n \"p-1! text-ds-2 transition-colors hover:bg-ds-surface-2 hover:text-ds-1\",\n \"xl:hidden\",\n )}\n onClick={() => setOpen(!resolvedOpen)}\n >\n <HamburgerIcon isOpen={resolvedOpen} />\n </Button>\n </div>\n )}\n\n <div className=\"mb-5 h-px bg-ds-border-3\" />\n\n <div className=\"min-h-0 flex-1 overflow-y-auto pr-1\">\n <SidebarLinks\n items={items}\n activePath={activePath}\n onItemSelect={onItemSelect}\n direction={direction}\n className={linksClassName}\n itemClassName={itemClassName}\n activeItemClassName={activeItemClassName}\n />\n </div>\n\n {footer ? <div className=\"mt-4\">{footer}</div> : null}\n </aside>\n ),\n [\n activeItemClassName,\n activePath,\n brand,\n className,\n closeLabel,\n direction,\n footer,\n itemClassName,\n items,\n linksClassName,\n onItemSelect,\n resolvedOpen,\n setOpen,\n ],\n );\n\n if (!showOverlay) {\n return content;\n }\n\n return (\n <>\n {content}\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n aria-hidden={!resolvedOpen}\n tabIndex={resolvedOpen ? 0 : -1}\n className={mergeClassNames(\n \"fixed inset-0 z-40 p-0! bg-black/30 backdrop-blur-[2px] transition-opacity duration-200 xl:hidden\",\n resolvedOpen\n ? \"pointer-events-auto opacity-100\"\n : \"pointer-events-none opacity-0\",\n overlayClassName,\n )}\n onClick={() => setOpen(false)}\n />\n </>\n );\n}\n","import { useCallback, useEffect, useMemo, useState } from \"react\";\n\nimport { BellIcon, CircleIcon, FullScreenIcon } from \"../../icons\";\nimport { Button } from \"../../forms/button\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { Typography } from \"../../typography\";\nimport { mergeClassNames } from \"../../../utils\";\nimport { HamburgerIcon } from \"./HamburgerIcon\";\nimport { Sidebar } from \"./Sidebar\";\nimport type { SidebarItem, SidebarProps } from \"./types\";\nimport { SunToMoonButton } from \"../../effects\";\n\nexport interface DashboardHeaderRenderContext {\n isSidebarOpen: boolean;\n toggleSidebar: () => void;\n}\n\nconst notificationItems = [\n {\n id: \"stock\",\n title: \"Low stock alert\",\n description: \"Wireless Mouse is below reorder point.\",\n time: \"4m\",\n toneClassName:\n \"bg-ds-state-warning-surface text-ds-state-warning-text border-ds-state-warning-border\",\n },\n {\n id: \"invoice\",\n title: \"Invoice paid\",\n description: \"INV-2048 was settled successfully.\",\n time: \"18m\",\n toneClassName:\n \"bg-ds-state-success-surface text-ds-state-success-text border-ds-state-success-border\",\n },\n {\n id: \"sync\",\n title: \"Catalog sync complete\",\n description: \"128 product records refreshed.\",\n time: \"42m\",\n toneClassName:\n \"bg-ds-state-info-surface text-ds-state-info-text border-ds-state-info-border\",\n },\n] as const;\n\ninterface DashboardSidebarShellProps {\n items: readonly SidebarItem[];\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n direction?: SidebarProps[\"direction\"];\n activePath?: string;\n onItemSelect?: SidebarProps[\"onItemSelect\"];\n brand?: SidebarProps[\"brand\"];\n sidebarFooter?: SidebarProps[\"footer\"];\n header?:\n | React.ReactNode\n | ((context: DashboardHeaderRenderContext) => React.ReactNode);\n breadcrumb?: React.ReactNode;\n title?: React.ReactNode;\n children?: React.ReactNode;\n className?: string;\n contentClassName?: string;\n mainClassName?: string;\n autoHideOnMobileBreakpoint?: boolean;\n}\n\nfunction useControllableOpenState(\n open: boolean | undefined,\n defaultOpen: boolean,\n onOpenChange?: (open: boolean) => void,\n) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n const isControlled = open !== undefined;\n const resolvedOpen = isControlled ? open : internalOpen;\n\n const setOpen = useCallback(\n (nextOpen: boolean) => {\n if (!isControlled) {\n setInternalOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n },\n [isControlled, onOpenChange],\n );\n\n return [resolvedOpen, setOpen] as const;\n}\n\nexport function DashboardSidebarShell({\n items,\n open,\n defaultOpen = false,\n onOpenChange,\n direction = \"auto\",\n activePath,\n onItemSelect,\n brand,\n sidebarFooter,\n header,\n breadcrumb = \"Pages / Dashboard\",\n title = \"Dashboard\",\n children,\n className,\n contentClassName,\n mainClassName,\n autoHideOnMobileBreakpoint = true,\n}: DashboardSidebarShellProps) {\n const [resolvedOpen, setOpen] = useControllableOpenState(\n open,\n defaultOpen,\n onOpenChange,\n );\n\n useEffect(() => {\n if (!autoHideOnMobileBreakpoint || typeof window === \"undefined\") {\n return;\n }\n\n const mediaQuery = window.matchMedia(\"(max-width: 1279px)\");\n\n const handleMobileEnter = (event: MediaQueryListEvent | MediaQueryList) => {\n if (event.matches) {\n setOpen(false);\n }\n };\n\n // Ensure first render on smaller screens starts closed.\n handleMobileEnter(mediaQuery);\n\n const listener = (event: MediaQueryListEvent) => handleMobileEnter(event);\n mediaQuery.addEventListener(\"change\", listener);\n\n return () => mediaQuery.removeEventListener(\"change\", listener);\n }, [autoHideOnMobileBreakpoint, setOpen]);\n\n const defaultHeader = useMemo(\n () => (\n <nav className=\"sticky top-2 z-40 mb-4 rounded-md border border-ds-border-3 bg-ds-surface-1/95 px-4 py-3 shadow-[0_4px_14px_color-mix(in_srgb,var(--ds-color-fg)_8%,transparent)] backdrop-blur-md flex items-center \">\n <div className=\"flex w-full justify-between gap-4\">\n <div className=\"min-w-0\">\n <Typography variant=\"caption\" className=\"text-ds-3 capitalize\">\n {breadcrumb}\n </Typography>\n <Typography\n variant=\"h5\"\n weight=\"black\"\n className=\"truncate leading-7 capitalize\"\n >\n {title}\n </Typography>\n </div>\n\n <div className=\"border-ds-border-4 hidden min-h-11 items-center gap-1 rounded-full border bg-ds-surface-1 px-2 py-1 shadow-[0_2px_8px_color-mix(in_srgb,var(--ds-color-fg)_6%,transparent)] sm:flex\">\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0! xl:hidden\"\n aria-label=\"Toggle sidebar\"\n onClick={() => setOpen(!resolvedOpen)}\n >\n <HamburgerIcon isOpen={resolvedOpen} />\n </Button>\n\n <DropdownMenu\n panelClassName=\"right-0 top-[44px]\"\n trigger={\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"relative h-9 w-9 rounded-full p-0!\"\n aria-label=\"Open notifications\"\n >\n <BellIcon className=\"h-5 w-5\" />\n <span className=\"bg-ds-state-danger text-ds-on-accent absolute -right-0.5 -top-0.5 flex h-5 min-w-5 items-center justify-center rounded-full px-1 text-[0.68rem] font-bold\">\n {notificationItems.length}\n </span>\n </Button>\n }\n >\n <div className=\"w-[340px] rounded-lg border border-ds-border-3 bg-ds-surface-1 p-3 shadow-xl\">\n <div className=\"mb-2 flex items-center justify-between\">\n <Typography variant=\"body2\" weight=\"black\">\n Notifications\n </Typography>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"px-2 py-1 text-xs\"\n >\n Mark all read\n </Button>\n </div>\n <div className=\"space-y-2\">\n {notificationItems.map((item) => (\n <Button\n key={item.id}\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"w-full justify-start rounded-lg border border-ds-border-3 px-2.5 py-2 text-left\"\n >\n <span\n className={`mt-0.5 inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-md border ${item.toneClassName}`}\n >\n <BellIcon className=\"h-3.5 w-3.5\" />\n </span>\n <span className=\"min-w-0 flex-1\">\n <span className=\"block truncate text-xs font-semibold text-ds-1\">\n {item.title}\n </span>\n <span className=\"block truncate text-[11px] text-ds-3\">\n {item.description}\n </span>\n </span>\n <span className=\"text-[11px] text-ds-3\">{item.time}</span>\n </Button>\n ))}\n </div>\n </div>\n </DropdownMenu>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle theme\"\n >\n <span className=\"flex cursor-pointer rounded-full\">\n <SunToMoonButton showLabelAndImage={false} />\n </span>\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle fullscreen\"\n onClick={() => {\n if (document.fullscreenElement) {\n document.exitFullscreen();\n } else {\n document.documentElement.requestFullscreen();\n }\n }}\n >\n <FullScreenIcon className=\"h-5 w-5\" />\n </Button>\n\n <DropdownMenu\n panelClassName=\"right-0 top-[44px]\"\n trigger={\n <Button\n type=\"button\"\n variant=\"primary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0! text-sm font-black\"\n aria-label=\"Open user menu\"\n >\n JD\n </Button>\n }\n >\n <div className=\"w-52 rounded-lg border border-ds-border-3 bg-ds-surface-1 p-3 shadow-xl\">\n <div className=\"mb-2 flex items-center gap-2\">\n <span className=\"bg-ds-accent text-ds-on-accent inline-flex h-8 w-8 items-center justify-center rounded-full text-xs font-black\">\n JD\n </span>\n <div className=\"min-w-0\">\n <Typography\n variant=\"body2\"\n weight=\"black\"\n className=\"truncate\"\n >\n John Doe\n </Typography>\n <Typography variant=\"caption\" className=\"text-ds-3\">\n Administrator\n </Typography>\n </div>\n </div>\n <div className=\"my-2 border-t border-ds-border-3\" />\n <div className=\"flex flex-col gap-1\">\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"justify-start px-2 py-1.5 text-sm\"\n >\n Profile\n </Button>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"justify-start px-2 py-1.5 text-sm\"\n >\n Settings\n </Button>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"justify-start px-2 py-1.5 text-sm text-ds-state-error-text\"\n >\n Log Out\n </Button>\n </div>\n </div>\n </DropdownMenu>\n </div>\n </div>\n\n <div className=\"mt-2 flex items-center gap-1 sm:hidden\">\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"p-1!\"\n aria-label=\"Toggle sidebar\"\n onClick={() => setOpen(!resolvedOpen)}\n >\n <HamburgerIcon isOpen={resolvedOpen} />\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"relative h-9 w-9 rounded-full p-0!\"\n aria-label=\"Open notifications\"\n >\n <BellIcon className=\"h-5 w-5\" />\n <span className=\"text-ds-1 absolute -right-3 top-2 text-xs font-bold\">\n 3\n </span>\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle theme\"\n >\n <CircleIcon className=\"h-4 w-4 text-ds-warning\" />\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle fullscreen\"\n >\n <FullScreenIcon className=\"h-5 w-5\" />\n </Button>\n\n <Button\n type=\"button\"\n variant=\"primary\"\n size=\"small\"\n className=\"ml-1 h-9 w-9 rounded-full p-0! text-sm font-black\"\n aria-label=\"Open user menu\"\n >\n JD\n </Button>\n </div>\n </nav>\n ),\n [breadcrumb, resolvedOpen, setOpen, title],\n );\n\n const resolvedHeader =\n typeof header === \"function\"\n ? header({\n isSidebarOpen: resolvedOpen,\n toggleSidebar: () => setOpen(!resolvedOpen),\n })\n : header;\n\n return (\n <div className={mergeClassNames(\"flex h-full w-full\", className)}>\n <Sidebar\n items={items}\n open={resolvedOpen}\n onOpenChange={setOpen}\n activePath={activePath}\n onItemSelect={onItemSelect}\n direction={direction}\n brand={brand}\n footer={sidebarFooter}\n />\n\n <div className=\"h-full w-full\">\n <main\n className={mergeClassNames(\n \"mx-2 flex-none transition-all duration-200 ease-in-out\",\n direction === \"rtl\" ? \"xl:mr-[18.5rem]\" : \"xl:ml-[18.5rem]\",\n mainClassName,\n )}\n >\n {resolvedHeader ?? defaultHeader}\n\n <section\n className={mergeClassNames(\n \"mx-auto min-h-[calc(100dvh-180px)] rounded-md md:min-h-[calc(100dvh-116px)]\",\n contentClassName,\n )}\n >\n {children}\n </section>\n </main>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/chunks/sidebar-D9D651F6.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sidebar-D9D651F6.cjs","names":[],"sources":["../../src/components/navigation/sidebar/HamburgerIcon.tsx","../../src/components/navigation/sidebar/NavLink.tsx","../../src/components/navigation/sidebar/SidebarLinks.tsx","../../src/components/navigation/sidebar/Sidebar.tsx","../../src/components/navigation/sidebar/DashboardSidebarShell.tsx"],"sourcesContent":["import { mergeClassNames } from \"../../../utils\";\n\nexport interface HamburgerIconProps {\n isOpen: boolean;\n className?: string;\n}\n\nconst lineClassName =\n \"block h-0.5 w-full rounded-lg bg-current transition-all duration-300 ease-in-out\";\n\nexport function HamburgerIcon({ isOpen, className }: HamburgerIconProps) {\n return (\n <span\n className={mergeClassNames(\n \"relative flex h-4 w-5 flex-col items-center justify-between\",\n className,\n )}\n aria-hidden=\"true\"\n >\n <span\n className={mergeClassNames(\n lineClassName,\n isOpen && \"translate-y-[5px] rotate-45 transform\",\n )}\n />\n <span className={mergeClassNames(lineClassName, isOpen && \"w-0\")} />\n <span\n className={mergeClassNames(\n lineClassName,\n isOpen && \"-translate-y-[9px] -rotate-45 transform\",\n )}\n />\n </span>\n );\n}\n","import { useMemo } from \"react\";\n\nimport { Button } from \"../../forms/button\";\nimport type { SidebarNavLinkProps } from \"./types\";\n\nexport function NavLink({\n className,\n children,\n style,\n borderRadius,\n disabled = false,\n href,\n target,\n rel,\n onClick,\n}: SidebarNavLinkProps) {\n const memoizedStyle = useMemo(\n () => (borderRadius !== undefined ? { ...style, borderRadius } : style),\n [borderRadius, style],\n );\n\n if (href) {\n const resolvedRel = target === \"_blank\" ? (rel ?? \"noreferrer noopener\") : rel;\n\n return (\n <a\n href={href}\n className={className}\n style={memoizedStyle}\n target={target}\n rel={resolvedRel}\n aria-disabled={disabled}\n onClick={(event) => {\n if (disabled) {\n event.preventDefault();\n return;\n }\n\n onClick?.(event);\n }}\n >\n {children}\n </a>\n );\n }\n\n return (\n <Button\n type=\"button\"\n variant=\"tertiary\"\n className={className}\n style={memoizedStyle}\n disabled={disabled}\n onClick={onClick}\n >\n {children}\n </Button>\n );\n}\n","import { mergeClassNames } from \"../../../utils\";\nimport { NavLink } from \"./NavLink\";\nimport type { SidebarDirection, SidebarItem, SidebarLinksProps } from \"./types\";\n\nconst rtlLanguages = /^(ar|fa|ur|he)(-|$)/i;\n\nfunction resolveDirection(\n direction: SidebarDirection,\n): Exclude<SidebarDirection, \"auto\"> {\n if (direction !== \"auto\") {\n return direction;\n }\n\n if (typeof document === \"undefined\") {\n return \"ltr\";\n }\n\n const explicitDirection =\n document.documentElement.getAttribute(\"dir\") ?? undefined;\n\n if (explicitDirection === \"rtl\" || explicitDirection === \"ltr\") {\n return explicitDirection;\n }\n\n if (\n typeof navigator !== \"undefined\" &&\n rtlLanguages.test(navigator.language)\n ) {\n return \"rtl\";\n }\n\n return \"ltr\";\n}\n\nfunction isRouteActive(item: SidebarItem, activePath?: string): boolean {\n if (typeof item.active === \"boolean\") {\n return item.active;\n }\n\n if (!activePath || !item.href) {\n return false;\n }\n\n return activePath === item.href || activePath.startsWith(`${item.href}/`);\n}\n\nexport function SidebarLinks({\n items,\n activePath,\n onItemSelect,\n direction = \"auto\",\n className,\n itemClassName,\n activeItemClassName,\n}: SidebarLinksProps) {\n const effectiveDirection = resolveDirection(direction);\n const visibleItems = items.filter((item) => !item.hidden);\n\n return (\n <ul className={mergeClassNames(\"space-y-1.5\", className)}>\n {visibleItems.map((item) => {\n const active = isRouteActive(item, activePath);\n\n return (\n <li key={item.id} className=\"relative\">\n <NavLink\n href={item.href}\n disabled={item.disabled}\n className={mergeClassNames(\n \"group relative flex w-full items-center gap-2.5 rounded-md border px-3 py-2.5 transition-all duration-200\",\n effectiveDirection === \"rtl\" ? \"text-right\" : \"text-left\",\n \"border-transparent text-ds-2 hover:border-ds-border-3 hover:bg-ds-surface-2/80 hover:text-ds-1\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ds-focus/60 focus-visible:ring-offset-2 focus-visible:ring-offset-ds-canvas\",\n item.disabled && \"cursor-not-allowed opacity-50\",\n active &&\n \"border-ds-border-accent/35 bg-ds-accent-subtle text-ds-1 shadow-[0_4px_12px_color-mix(in_srgb,var(--ds-color-fg)_8%,transparent)]\",\n active && activeItemClassName,\n itemClassName,\n )}\n onClick={(event) => {\n item.onSelect?.(event);\n onItemSelect?.(item, event);\n }}\n >\n <span\n className={mergeClassNames(\n \"inline-flex h-5 w-5 shrink-0 items-center justify-center\",\n active ? \"text-ds-1\" : \"text-ds-2 group-hover:text-ds-1\",\n )}\n aria-hidden=\"true\"\n >\n {item.icon}\n </span>\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {item.label}\n </span>\n {item.badge ? (\n <span className=\"shrink-0 text-xs text-ds-2\">{item.badge}</span>\n ) : null}\n </NavLink>\n {active ? (\n <span\n className={mergeClassNames(\n \"pointer-events-none absolute top-1.5 h-[calc(100%-12px)] w-2\",\n effectiveDirection === \"rtl\" ? \"right-0\" : \"left-0\",\n )}\n aria-hidden=\"true\"\n >\n {/* <span className=\"absolute inset-y-1 left-1/2 w-2 -translate-x-1/2 rounded-full bg-ds-accent/25 blur-[4px]\" /> */}\n {/* <span className=\"absolute inset-y-0 left-1/6 w-[2px] -translate-x-1/2 rounded-full bg-ds-accent motion-safe:animate-pulse\" /> */}\n {/* <span className=\"absolute top-2.5 left-1/2 h-2 w-2 -translate-x-1/2 rounded-full bg-ds-accent shadow-[0_0_10px_color-mix(in_srgb,var(--ds-color-accent)_55%,transparent)] motion-safe:animate-pulse\" /> */}\n </span>\n ) : null}\n </li>\n );\n })}\n </ul>\n );\n}\n","import { useCallback, useMemo, useState } from \"react\";\n\nimport { Button } from \"../../forms/button\";\nimport { mergeClassNames } from \"../../../utils\";\nimport { HamburgerIcon } from \"./HamburgerIcon\";\nimport { SidebarLinks } from \"./SidebarLinks\";\nimport type { SidebarProps } from \"./types\";\n\nfunction useControllableOpenState(\n open: boolean | undefined,\n defaultOpen: boolean,\n onOpenChange?: (open: boolean) => void,\n) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n const isControlled = open !== undefined;\n const resolvedOpen = isControlled ? open : internalOpen;\n\n const setOpen = useCallback(\n (nextOpen: boolean) => {\n if (!isControlled) {\n setInternalOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n },\n [isControlled, onOpenChange],\n );\n\n return [resolvedOpen, setOpen] as const;\n}\n\nconst fallbackBrand = (\n <div className=\"text-xl font-bold uppercase tracking-wide text-ds-1\">\n <span className=\"text-ds-accent\">ERP</span>\n <span className=\"font-medium\">PRO</span>\n </div>\n);\n\nexport function Sidebar({\n items,\n open,\n defaultOpen = false,\n onOpenChange,\n activePath,\n onItemSelect,\n direction = \"auto\",\n navbar,\n brand = fallbackBrand,\n footer,\n className,\n linksClassName,\n itemClassName,\n activeItemClassName,\n overlayClassName,\n closeLabel = \"Toggle sidebar\",\n showOverlay = true,\n}: SidebarProps) {\n const [resolvedOpen, setOpen] = useControllableOpenState(\n open,\n defaultOpen,\n onOpenChange,\n );\n\n const content = useMemo(\n () => (\n <aside\n dir={direction === \"auto\" ? undefined : direction}\n className={mergeClassNames(\n \"fixed inset-y-2 z-50 flex w-72 flex-col rounded-xl border border-ds-border-3 bg-ds-surface-1/92 p-3 shadow-[0_10px_28px_color-mix(in_srgb,var(--ds-color-fg)_9%,transparent)] backdrop-blur-xl\",\n \"transition-transform duration-200 ease-out xl:translate-x-0\",\n direction === \"rtl\" ? \"right-2\" : \"left-2\",\n resolvedOpen\n ? \"translate-x-0\"\n : direction === \"rtl\"\n ? \"translate-x-[110%] xl:translate-x-0\"\n : \"-translate-x-[110%] xl:translate-x-0\",\n className,\n )}\n style={{\n backdropFilter: \"blur(14px) saturate(120%)\",\n WebkitBackdropFilter: \"blur(14px) saturate(120%)\",\n }}\n >\n {navbar ? (\n <div className=\"mb-4\">{navbar}</div>\n ) : (\n <div className=\"mb-4 flex items-center justify-between gap-3 rounded-xl border border-ds-border-3 bg-ds-surface-2/85 px-3 py-2\">\n <div className=\"min-w-0 flex-1\">{brand}</div>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n aria-label={closeLabel}\n className={mergeClassNames(\n \"p-1! text-ds-2 transition-colors hover:bg-ds-surface-2 hover:text-ds-1\",\n \"xl:hidden\",\n )}\n onClick={() => setOpen(!resolvedOpen)}\n >\n <HamburgerIcon isOpen={resolvedOpen} />\n </Button>\n </div>\n )}\n\n <div className=\"mb-5 h-px bg-ds-border-3\" />\n\n <div className=\"min-h-0 flex-1 overflow-y-auto pr-1\">\n <SidebarLinks\n items={items}\n activePath={activePath}\n onItemSelect={onItemSelect}\n direction={direction}\n className={linksClassName}\n itemClassName={itemClassName}\n activeItemClassName={activeItemClassName}\n />\n </div>\n\n {footer ? <div className=\"mt-4\">{footer}</div> : null}\n </aside>\n ),\n [\n activeItemClassName,\n activePath,\n brand,\n className,\n closeLabel,\n direction,\n footer,\n itemClassName,\n items,\n linksClassName,\n onItemSelect,\n resolvedOpen,\n setOpen,\n ],\n );\n\n if (!showOverlay) {\n return content;\n }\n\n return (\n <>\n {content}\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n aria-hidden={!resolvedOpen}\n tabIndex={resolvedOpen ? 0 : -1}\n className={mergeClassNames(\n \"fixed inset-0 z-40 p-0! bg-black/30 backdrop-blur-[2px] transition-opacity duration-200 xl:hidden\",\n resolvedOpen\n ? \"pointer-events-auto opacity-100\"\n : \"pointer-events-none opacity-0\",\n overlayClassName,\n )}\n onClick={() => setOpen(false)}\n />\n </>\n );\n}\n","import { useCallback, useEffect, useMemo, useState } from \"react\";\n\nimport { BellIcon, CircleIcon, FullScreenIcon } from \"../../icons\";\nimport { Button } from \"../../forms/button\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { Typography } from \"../../typography\";\nimport { mergeClassNames } from \"../../../utils\";\nimport { HamburgerIcon } from \"./HamburgerIcon\";\nimport { Sidebar } from \"./Sidebar\";\nimport type { SidebarItem, SidebarProps } from \"./types\";\nimport { SunToMoonButton } from \"../../effects\";\n\nexport interface DashboardHeaderRenderContext {\n isSidebarOpen: boolean;\n toggleSidebar: () => void;\n}\n\nconst notificationItems = [\n {\n id: \"stock\",\n title: \"Low stock alert\",\n description: \"Wireless Mouse is below reorder point.\",\n time: \"4m\",\n toneClassName:\n \"bg-ds-state-warning-surface text-ds-state-warning-text border-ds-state-warning-border\",\n },\n {\n id: \"invoice\",\n title: \"Invoice paid\",\n description: \"INV-2048 was settled successfully.\",\n time: \"18m\",\n toneClassName:\n \"bg-ds-state-success-surface text-ds-state-success-text border-ds-state-success-border\",\n },\n {\n id: \"sync\",\n title: \"Catalog sync complete\",\n description: \"128 product records refreshed.\",\n time: \"42m\",\n toneClassName:\n \"bg-ds-state-info-surface text-ds-state-info-text border-ds-state-info-border\",\n },\n] as const;\n\ninterface DashboardSidebarShellProps {\n items: readonly SidebarItem[];\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n direction?: SidebarProps[\"direction\"];\n activePath?: string;\n onItemSelect?: SidebarProps[\"onItemSelect\"];\n brand?: SidebarProps[\"brand\"];\n sidebarFooter?: SidebarProps[\"footer\"];\n header?:\n | React.ReactNode\n | ((context: DashboardHeaderRenderContext) => React.ReactNode);\n breadcrumb?: React.ReactNode;\n title?: React.ReactNode;\n children?: React.ReactNode;\n className?: string;\n contentClassName?: string;\n mainClassName?: string;\n autoHideOnMobileBreakpoint?: boolean;\n}\n\nfunction useControllableOpenState(\n open: boolean | undefined,\n defaultOpen: boolean,\n onOpenChange?: (open: boolean) => void,\n) {\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n const isControlled = open !== undefined;\n const resolvedOpen = isControlled ? open : internalOpen;\n\n const setOpen = useCallback(\n (nextOpen: boolean) => {\n if (!isControlled) {\n setInternalOpen(nextOpen);\n }\n onOpenChange?.(nextOpen);\n },\n [isControlled, onOpenChange],\n );\n\n return [resolvedOpen, setOpen] as const;\n}\n\nexport function DashboardSidebarShell({\n items,\n open,\n defaultOpen = false,\n onOpenChange,\n direction = \"auto\",\n activePath,\n onItemSelect,\n brand,\n sidebarFooter,\n header,\n breadcrumb = \"Pages / Dashboard\",\n title = \"Dashboard\",\n children,\n className,\n contentClassName,\n mainClassName,\n autoHideOnMobileBreakpoint = true,\n}: DashboardSidebarShellProps) {\n const [resolvedOpen, setOpen] = useControllableOpenState(\n open,\n defaultOpen,\n onOpenChange,\n );\n\n useEffect(() => {\n if (!autoHideOnMobileBreakpoint || typeof window === \"undefined\") {\n return;\n }\n\n const mediaQuery = window.matchMedia(\"(max-width: 1279px)\");\n\n const handleMobileEnter = (event: MediaQueryListEvent | MediaQueryList) => {\n if (event.matches) {\n setOpen(false);\n }\n };\n\n // Ensure first render on smaller screens starts closed.\n handleMobileEnter(mediaQuery);\n\n const listener = (event: MediaQueryListEvent) => handleMobileEnter(event);\n mediaQuery.addEventListener(\"change\", listener);\n\n return () => mediaQuery.removeEventListener(\"change\", listener);\n }, [autoHideOnMobileBreakpoint, setOpen]);\n\n const defaultHeader = useMemo(\n () => (\n <nav className=\"sticky top-2 z-40 mb-4 rounded-md border border-ds-border-3 bg-ds-surface-1/95 px-4 py-3 shadow-[0_4px_14px_color-mix(in_srgb,var(--ds-color-fg)_8%,transparent)] backdrop-blur-md flex items-center \">\n <div className=\"flex w-full justify-between gap-4\">\n <div className=\"min-w-0\">\n <Typography variant=\"caption\" className=\"text-ds-3 capitalize\">\n {breadcrumb}\n </Typography>\n <Typography\n variant=\"h5\"\n weight=\"black\"\n className=\"truncate leading-7 capitalize\"\n >\n {title}\n </Typography>\n </div>\n\n <div className=\"border-ds-border-4 hidden min-h-11 items-center gap-1 rounded-full border bg-ds-surface-1 px-2 py-1 shadow-[0_2px_8px_color-mix(in_srgb,var(--ds-color-fg)_6%,transparent)] sm:flex\">\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0! xl:hidden\"\n aria-label=\"Toggle sidebar\"\n onClick={() => setOpen(!resolvedOpen)}\n >\n <HamburgerIcon isOpen={resolvedOpen} />\n </Button>\n\n <DropdownMenu\n panelClassName=\"right-0 top-[44px]\"\n trigger={\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"relative h-9 w-9 rounded-full p-0!\"\n aria-label=\"Open notifications\"\n >\n <BellIcon className=\"h-5 w-5\" />\n <span className=\"bg-ds-state-danger text-ds-on-accent absolute -right-0.5 -top-0.5 flex h-5 min-w-5 items-center justify-center rounded-full px-1 text-[0.68rem] font-bold\">\n {notificationItems.length}\n </span>\n </Button>\n }\n >\n <div className=\"w-[340px] rounded-lg border border-ds-border-3 bg-ds-surface-1 p-3 shadow-xl\">\n <div className=\"mb-2 flex items-center justify-between\">\n <Typography variant=\"body2\" weight=\"black\">\n Notifications\n </Typography>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"px-2 py-1 text-xs\"\n >\n Mark all read\n </Button>\n </div>\n <div className=\"space-y-2\">\n {notificationItems.map((item) => (\n <Button\n key={item.id}\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"w-full justify-start rounded-lg border border-ds-border-3 px-2.5 py-2 text-left\"\n >\n <span\n className={`mt-0.5 inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-md border ${item.toneClassName}`}\n >\n <BellIcon className=\"h-3.5 w-3.5\" />\n </span>\n <span className=\"min-w-0 flex-1\">\n <span className=\"block truncate text-xs font-semibold text-ds-1\">\n {item.title}\n </span>\n <span className=\"block truncate text-[11px] text-ds-3\">\n {item.description}\n </span>\n </span>\n <span className=\"text-[11px] text-ds-3\">{item.time}</span>\n </Button>\n ))}\n </div>\n </div>\n </DropdownMenu>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle theme\"\n >\n <span className=\"flex cursor-pointer rounded-full\">\n <SunToMoonButton showLabelAndImage={false} />\n </span>\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle fullscreen\"\n onClick={() => {\n if (document.fullscreenElement) {\n document.exitFullscreen();\n } else {\n document.documentElement.requestFullscreen();\n }\n }}\n >\n <FullScreenIcon className=\"h-5 w-5\" />\n </Button>\n\n <DropdownMenu\n panelClassName=\"right-0 top-[44px]\"\n trigger={\n <Button\n type=\"button\"\n variant=\"primary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0! text-sm font-black\"\n aria-label=\"Open user menu\"\n >\n JD\n </Button>\n }\n >\n <div className=\"w-52 rounded-lg border border-ds-border-3 bg-ds-surface-1 p-3 shadow-xl\">\n <div className=\"mb-2 flex items-center gap-2\">\n <span className=\"bg-ds-accent text-ds-on-accent inline-flex h-8 w-8 items-center justify-center rounded-full text-xs font-black\">\n JD\n </span>\n <div className=\"min-w-0\">\n <Typography\n variant=\"body2\"\n weight=\"black\"\n className=\"truncate\"\n >\n John Doe\n </Typography>\n <Typography variant=\"caption\" className=\"text-ds-3\">\n Administrator\n </Typography>\n </div>\n </div>\n <div className=\"my-2 border-t border-ds-border-3\" />\n <div className=\"flex flex-col gap-1\">\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"justify-start px-2 py-1.5 text-sm\"\n >\n Profile\n </Button>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"justify-start px-2 py-1.5 text-sm\"\n >\n Settings\n </Button>\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"justify-start px-2 py-1.5 text-sm text-ds-state-error-text\"\n >\n Log Out\n </Button>\n </div>\n </div>\n </DropdownMenu>\n </div>\n </div>\n\n <div className=\"mt-2 flex items-center gap-1 sm:hidden\">\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"p-1!\"\n aria-label=\"Toggle sidebar\"\n onClick={() => setOpen(!resolvedOpen)}\n >\n <HamburgerIcon isOpen={resolvedOpen} />\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"relative h-9 w-9 rounded-full p-0!\"\n aria-label=\"Open notifications\"\n >\n <BellIcon className=\"h-5 w-5\" />\n <span className=\"text-ds-1 absolute -right-3 top-2 text-xs font-bold\">\n 3\n </span>\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle theme\"\n >\n <CircleIcon className=\"h-4 w-4 text-ds-warning\" />\n </Button>\n\n <Button\n type=\"button\"\n variant=\"tertiary\"\n size=\"small\"\n className=\"h-9 w-9 rounded-full p-0!\"\n aria-label=\"Toggle fullscreen\"\n >\n <FullScreenIcon className=\"h-5 w-5\" />\n </Button>\n\n <Button\n type=\"button\"\n variant=\"primary\"\n size=\"small\"\n className=\"ml-1 h-9 w-9 rounded-full p-0! text-sm font-black\"\n aria-label=\"Open user menu\"\n >\n JD\n </Button>\n </div>\n </nav>\n ),\n [breadcrumb, resolvedOpen, setOpen, title],\n );\n\n const resolvedHeader =\n typeof header === \"function\"\n ? header({\n isSidebarOpen: resolvedOpen,\n toggleSidebar: () => setOpen(!resolvedOpen),\n })\n : header;\n\n return (\n <div className={mergeClassNames(\"flex h-full w-full\", className)}>\n <Sidebar\n items={items}\n open={resolvedOpen}\n onOpenChange={setOpen}\n activePath={activePath}\n onItemSelect={onItemSelect}\n direction={direction}\n brand={brand}\n footer={sidebarFooter}\n />\n\n <div className=\"h-full w-full\">\n <main\n className={mergeClassNames(\n \"mx-2 flex-none transition-all duration-200 ease-in-out\",\n direction === \"rtl\" ? \"xl:mr-[18.5rem]\" : \"xl:ml-[18.5rem]\",\n mainClassName,\n )}\n >\n {resolvedHeader ?? defaultHeader}\n\n <section\n className={mergeClassNames(\n \"mx-auto min-h-[calc(100dvh-180px)] rounded-md md:min-h-[calc(100dvh-116px)]\",\n contentClassName,\n )}\n >\n {children}\n </section>\n </main>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/chunks/sun-to-moon-button-DcRX0obV.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sun-to-moon-button-DcRX0obV.mjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/ThemeSwitcherButtons.tsx"],"sourcesContent":["import type {\n ThemeColorType,\n ThemeModeType,\n ThemeVariantType,\n} from \"../../../foundations/theme\";\nimport { useThemeContext } from \"../../../foundations/theme\";\nimport { Button } from \"../../forms/button\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { CSSProperties } from \"react\";\n\nexport interface ThemeSwitcherButtonsProps {\n className?: string;\n}\n\nconst BRAND_OPTIONS: Array<{\n value: ThemeColorType;\n label: string;\n swatch: string;\n}> = [\n { value: \"purple\", label: \"Purple\", swatch: \"var(--ds-brand-purple)\" },\n { value: \"teal\", label: \"Teal\", swatch: \"var(--ds-brand-teal)\" },\n { value: \"yellow\", label: \"Yellow\", swatch: \"var(--ds-brand-yellow)\" },\n { value: \"green\", label: \"Green\", swatch: \"var(--ds-brand-green)\" },\n];\n\nconst VARIANT_OPTIONS: Array<{\n value: ThemeVariantType;\n label: string;\n}> = [\n { value: \"default\", label: \"Default\" },\n { value: \"alt\", label: \"Alt\" },\n];\n\nfunction ToggleButton({\n label,\n active,\n onClick,\n swatch,\n showBrandState = false,\n mode,\n}: {\n label: string;\n active: boolean;\n onClick: () => void;\n swatch?: string;\n showBrandState?: boolean;\n mode?: ThemeModeType;\n}) {\n const isLightMode = mode === \"light\";\n const toneStyle: CSSProperties | undefined = (() => {\n if (!showBrandState || !swatch) {\n return undefined;\n }\n\n if (isLightMode) {\n return {\n borderColor: active ? swatch : \"var(--ds-border-2)\",\n backgroundColor: active\n ? `color-mix(in srgb, ${swatch} 12%, #ffffff)`\n : \"#ffffff\",\n color: active\n ? `color-mix(in srgb, ${swatch} 76%, var(--ds-text-1))`\n : \"var(--ds-text-2)\",\n boxShadow: active\n ? `0 0 0 1px color-mix(in srgb, ${swatch} 24%, transparent)`\n : \"none\",\n };\n }\n\n return {\n borderColor: active\n ? swatch\n : `color-mix(in srgb, ${swatch} 42%, var(--ds-border-3))`,\n backgroundColor: active\n ? `color-mix(in srgb, ${swatch} 16%, var(--ds-surface-1))`\n : `color-mix(in srgb, ${swatch} 6%, var(--ds-surface-1))`,\n };\n })();\n\n return (\n <Button\n variant=\"secondary\"\n size=\"small\"\n onClick={onClick}\n className={mergeClassNames(\n \"group rounded-full border px-3 py-1.5 text-xs font-semibold transition-all duration-200\",\n active\n ? \"border-ds-border-1 bg-ds-surface-2 text-ds-1 shadow-sm\"\n : \"border-ds-border-3 bg-ds-surface-1 text-ds-2 hover:border-ds-border-2 hover:text-ds-1\",\n showBrandState && isLightMode\n ? \"bg-ds-surface-1! hover:bg-ds-surface-1!\"\n : null,\n showBrandState && active ? \"text-ds-1\" : null,\n )}\n style={toneStyle}\n aria-pressed={active}\n >\n {swatch ? (\n <span\n className={mergeClassNames(\n \"h-2.5 w-2.5 rounded-full ring-1 ring-black/10 transition-transform duration-200 group-hover:scale-110\",\n active\n ? isLightMode\n ? \"scale-110 ring-2 ring-black/15\"\n : \"scale-110 ring-2 ring-white/35\"\n : \"scale-100 opacity-90\",\n )}\n style={{ backgroundColor: swatch }}\n aria-hidden=\"true\"\n />\n ) : null}\n <span>{label}</span>\n </Button>\n );\n}\n\nexport default function ThemeSwitcherButtons({\n className,\n}: ThemeSwitcherButtonsProps) {\n const { mode, theme, variant, setMode, setTheme, setVariant } =\n useThemeContext();\n\n return (\n <div\n className={mergeClassNames(\n \"w-full rounded-2xl border border-ds-border-2 bg-ds-surface-1 p-4 shadow-sm\",\n className,\n )}\n >\n <div className=\"space-y-3\">\n <div>\n <p className=\"mb-2 text-[11px] font-semibold uppercase tracking-[0.12em] text-ds-3\">\n Mode\n </p>\n <div className=\"flex flex-wrap gap-2\">\n <ToggleButton\n label=\"Light\"\n active={mode === \"light\"}\n onClick={() => setMode(\"light\")}\n />\n <ToggleButton\n label=\"Dark\"\n active={mode === \"dark\"}\n onClick={() => setMode(\"dark\")}\n />\n </div>\n </div>\n\n <div>\n <p className=\"mb-2 text-[11px] font-semibold uppercase tracking-[0.12em] text-ds-3\">\n Brand\n </p>\n <div className=\"flex flex-wrap gap-2\">\n {BRAND_OPTIONS.map((option) => (\n <ToggleButton\n key={option.value}\n label={option.label}\n active={theme === option.value}\n onClick={() => setTheme(option.value)}\n swatch={option.swatch}\n showBrandState\n mode={mode}\n />\n ))}\n </div>\n </div>\n\n <div>\n <p className=\"mb-2 text-[11px] font-semibold uppercase tracking-[0.12em] text-ds-3\">\n Variant\n </p>\n <div className=\"flex flex-wrap gap-2\">\n {VARIANT_OPTIONS.map((option) => (\n <ToggleButton\n key={option.value}\n label={option.label}\n active={variant === option.value}\n onClick={() => setVariant(option.value)}\n />\n ))}\n </div>\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;AAcA,IAAM,gBAID;CACH;EAAE,OAAO;EAAU,OAAO;EAAU,QAAQ;EAA0B;CACtE;EAAE,OAAO;EAAQ,OAAO;EAAQ,QAAQ;EAAwB;CAChE;EAAE,OAAO;EAAU,OAAO;EAAU,QAAQ;EAA0B;CACtE;EAAE,OAAO;EAAS,OAAO;EAAS,QAAQ;EAAyB;CACpE;AAED,IAAM,kBAGD,CACH;CAAE,OAAO;CAAW,OAAO;CAAW,EACtC;CAAE,OAAO;CAAO,OAAO;CAAO,CAC/B;AAED,SAAS,aAAa,EACpB,OACA,QACA,SACA,QACA,iBAAiB,OACjB,QAQC;CACD,MAAM,cAAc,SAAS;CAC7B,MAAM,mBAA8C;AAClD,MAAI,CAAC,kBAAkB,CAAC,OACtB;AAGF,MAAI,YACF,QAAO;GACL,aAAa,SAAS,SAAS;GAC/B,iBAAiB,SACb,sBAAsB,OAAO,kBAC7B;GACJ,OAAO,SACH,sBAAsB,OAAO,2BAC7B;GACJ,WAAW,SACP,gCAAgC,OAAO,sBACvC;GACL;AAGH,SAAO;GACL,aAAa,SACT,SACA,sBAAsB,OAAO;GACjC,iBAAiB,SACb,sBAAsB,OAAO,8BAC7B,sBAAsB,OAAO;GAClC;KACC;AAEJ,QACE,qBAAC,QAAD;EACE,SAAQ;EACR,MAAK;EACI;EACT,WAAW,gBACT,2FACA,SACI,2DACA,yFACJ,kBAAkB,cACd,4CACA,MACJ,kBAAkB,SAAS,cAAc,KAC1C;EACD,OAAO;EACP,gBAAc;YAfhB,CAiBG,SACC,oBAAC,QAAD;GACE,WAAW,gBACT,yGACA,SACI,cACE,mCACA,mCACF,uBACL;GACD,OAAO,EAAE,iBAAiB,QAAQ;GAClC,eAAY;GACZ,CAAA,GACA,MACJ,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA,CACb;;;AAIb,SAAwB,qBAAqB,EAC3C,aAC4B;CAC5B,MAAM,EAAE,MAAM,OAAO,SAAS,SAAS,UAAU,eAC/C,iBAAiB;AAEnB,QACE,oBAAC,OAAD;EACE,WAAW,gBACT,8EACA,UACD;YAED,qBAAC,OAAD;GAAK,WAAU;aAAf;IACE,qBAAC,OAAD,EAAA,UAAA,CACE,oBAAC,KAAD;KAAG,WAAU;eAAuE;KAEhF,CAAA,EACJ,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,cAAD;MACE,OAAM;MACN,QAAQ,SAAS;MACjB,eAAe,QAAQ,QAAQ;MAC/B,CAAA,EACF,oBAAC,cAAD;MACE,OAAM;MACN,QAAQ,SAAS;MACjB,eAAe,QAAQ,OAAO;MAC9B,CAAA,CACE;OACF,EAAA,CAAA;IAEN,qBAAC,OAAD,EAAA,UAAA,CACE,oBAAC,KAAD;KAAG,WAAU;eAAuE;KAEhF,CAAA,EACJ,oBAAC,OAAD;KAAK,WAAU;eACZ,cAAc,KAAK,WAClB,oBAAC,cAAD;MAEE,OAAO,OAAO;MACd,QAAQ,UAAU,OAAO;MACzB,eAAe,SAAS,OAAO,MAAM;MACrC,QAAQ,OAAO;MACf,gBAAA;MACM;MACN,EAPK,OAAO,MAOZ,CACF;KACE,CAAA,CACF,EAAA,CAAA;IAEN,qBAAC,OAAD,EAAA,UAAA,CACE,oBAAC,KAAD;KAAG,WAAU;eAAuE;KAEhF,CAAA,EACJ,oBAAC,OAAD;KAAK,WAAU;eACZ,gBAAgB,KAAK,WACpB,oBAAC,cAAD;MAEE,OAAO,OAAO;MACd,QAAQ,YAAY,OAAO;MAC3B,eAAe,WAAW,OAAO,MAAM;MACvC,EAJK,OAAO,MAIZ,CACF;KACE,CAAA,CACF,EAAA,CAAA;IACF;;EACF,CAAA"}

package/dist/chunks/sun-to-moon-button-De0_Sf01.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"sun-to-moon-button-De0_Sf01.cjs","names":[],"sources":["../../src/components/effects/sun-to-moon-button/ThemeSwitcherButtons.tsx"],"sourcesContent":["import type {\n ThemeColorType,\n ThemeModeType,\n ThemeVariantType,\n} from \"../../../foundations/theme\";\nimport { useThemeContext } from \"../../../foundations/theme\";\nimport { Button } from \"../../forms/button\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { CSSProperties } from \"react\";\n\nexport interface ThemeSwitcherButtonsProps {\n className?: string;\n}\n\nconst BRAND_OPTIONS: Array<{\n value: ThemeColorType;\n label: string;\n swatch: string;\n}> = [\n { value: \"purple\", label: \"Purple\", swatch: \"var(--ds-brand-purple)\" },\n { value: \"teal\", label: \"Teal\", swatch: \"var(--ds-brand-teal)\" },\n { value: \"yellow\", label: \"Yellow\", swatch: \"var(--ds-brand-yellow)\" },\n { value: \"green\", label: \"Green\", swatch: \"var(--ds-brand-green)\" },\n];\n\nconst VARIANT_OPTIONS: Array<{\n value: ThemeVariantType;\n label: string;\n}> = [\n { value: \"default\", label: \"Default\" },\n { value: \"alt\", label: \"Alt\" },\n];\n\nfunction ToggleButton({\n label,\n active,\n onClick,\n swatch,\n showBrandState = false,\n mode,\n}: {\n label: string;\n active: boolean;\n onClick: () => void;\n swatch?: string;\n showBrandState?: boolean;\n mode?: ThemeModeType;\n}) {\n const isLightMode = mode === \"light\";\n const toneStyle: CSSProperties | undefined = (() => {\n if (!showBrandState || !swatch) {\n return undefined;\n }\n\n if (isLightMode) {\n return {\n borderColor: active ? swatch : \"var(--ds-border-2)\",\n backgroundColor: active\n ? `color-mix(in srgb, ${swatch} 12%, #ffffff)`\n : \"#ffffff\",\n color: active\n ? `color-mix(in srgb, ${swatch} 76%, var(--ds-text-1))`\n : \"var(--ds-text-2)\",\n boxShadow: active\n ? `0 0 0 1px color-mix(in srgb, ${swatch} 24%, transparent)`\n : \"none\",\n };\n }\n\n return {\n borderColor: active\n ? swatch\n : `color-mix(in srgb, ${swatch} 42%, var(--ds-border-3))`,\n backgroundColor: active\n ? `color-mix(in srgb, ${swatch} 16%, var(--ds-surface-1))`\n : `color-mix(in srgb, ${swatch} 6%, var(--ds-surface-1))`,\n };\n })();\n\n return (\n <Button\n variant=\"secondary\"\n size=\"small\"\n onClick={onClick}\n className={mergeClassNames(\n \"group rounded-full border px-3 py-1.5 text-xs font-semibold transition-all duration-200\",\n active\n ? \"border-ds-border-1 bg-ds-surface-2 text-ds-1 shadow-sm\"\n : \"border-ds-border-3 bg-ds-surface-1 text-ds-2 hover:border-ds-border-2 hover:text-ds-1\",\n showBrandState && isLightMode\n ? \"bg-ds-surface-1! hover:bg-ds-surface-1!\"\n : null,\n showBrandState && active ? \"text-ds-1\" : null,\n )}\n style={toneStyle}\n aria-pressed={active}\n >\n {swatch ? (\n <span\n className={mergeClassNames(\n \"h-2.5 w-2.5 rounded-full ring-1 ring-black/10 transition-transform duration-200 group-hover:scale-110\",\n active\n ? isLightMode\n ? \"scale-110 ring-2 ring-black/15\"\n : \"scale-110 ring-2 ring-white/35\"\n : \"scale-100 opacity-90\",\n )}\n style={{ backgroundColor: swatch }}\n aria-hidden=\"true\"\n />\n ) : null}\n <span>{label}</span>\n </Button>\n );\n}\n\nexport default function ThemeSwitcherButtons({\n className,\n}: ThemeSwitcherButtonsProps) {\n const { mode, theme, variant, setMode, setTheme, setVariant } =\n useThemeContext();\n\n return (\n <div\n className={mergeClassNames(\n \"w-full rounded-2xl border border-ds-border-2 bg-ds-surface-1 p-4 shadow-sm\",\n className,\n )}\n >\n <div className=\"space-y-3\">\n <div>\n <p className=\"mb-2 text-[11px] font-semibold uppercase tracking-[0.12em] text-ds-3\">\n Mode\n </p>\n <div className=\"flex flex-wrap gap-2\">\n <ToggleButton\n label=\"Light\"\n active={mode === \"light\"}\n onClick={() => setMode(\"light\")}\n />\n <ToggleButton\n label=\"Dark\"\n active={mode === \"dark\"}\n onClick={() => setMode(\"dark\")}\n />\n </div>\n </div>\n\n <div>\n <p className=\"mb-2 text-[11px] font-semibold uppercase tracking-[0.12em] text-ds-3\">\n Brand\n </p>\n <div className=\"flex flex-wrap gap-2\">\n {BRAND_OPTIONS.map((option) => (\n <ToggleButton\n key={option.value}\n label={option.label}\n active={theme === option.value}\n onClick={() => setTheme(option.value)}\n swatch={option.swatch}\n showBrandState\n mode={mode}\n />\n ))}\n </div>\n </div>\n\n <div>\n <p className=\"mb-2 text-[11px] font-semibold uppercase tracking-[0.12em] text-ds-3\">\n Variant\n </p>\n <div className=\"flex flex-wrap gap-2\">\n {VARIANT_OPTIONS.map((option) => (\n <ToggleButton\n key={option.value}\n label={option.label}\n active={variant === option.value}\n onClick={() => setVariant(option.value)}\n />\n ))}\n </div>\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/chunks/switch-C1gKE0m0.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"switch-C1gKE0m0.mjs","names":[],"sources":["../../src/components/forms/switch/Switch.tsx"],"sourcesContent":["import { forwardRef, useId } from \"react\";\n\nimport type { SwitchProps } from \"./types\";\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\nconst rtlLanguages = /^(ar|fa|ur|he)(-|$)/i;\n\nfunction resolveDirection(\n direction: string | undefined,\n): \"ltr\" | \"rtl\" {\n if (direction === \"rtl\" || direction === \"ltr\") {\n return direction;\n }\n\n if (typeof document !== \"undefined\") {\n const explicitDirection =\n document.documentElement.getAttribute(\"dir\") ?? undefined;\n\n if (explicitDirection === \"rtl\" || explicitDirection === \"ltr\") {\n return explicitDirection;\n }\n }\n\n if (\n typeof navigator !== \"undefined\" &&\n rtlLanguages.test(navigator.language)\n ) {\n return \"rtl\";\n }\n\n return \"ltr\";\n}\n\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n ({ className = \"\", label, error, id, checked, dir, ...props }, ref) => {\n const generatedId = useId();\n const switchId = id || `switch-${sanitizeId(generatedId)}`;\n const isRtl = resolveDirection(dir) === \"rtl\";\n const containerClasses = `flex items-center gap-2 ${className}`\n .trim()\n .replace(/\\s+/g, \" \");\n\n return (\n <div className={containerClasses} dir={dir}>\n <label\n htmlFor={switchId}\n style={{\n borderRadius: \"var(--border-radius-full, 9999px)\",\n ...(checked ? {} : { background: \"#E0E5F2\" }),\n }}\n className={`\n relative inline-flex h-6 w-11 cursor-pointer items-center rounded-full transition-colors duration-200\n focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ds-focus focus-visible:ring-offset-2 focus-visible:ring-offset-ds-surface-1\n disabled:cursor-not-allowed disabled:opacity-50\n ${checked ? \"bg-ds-accent\" : \"\"}\n `\n .trim()\n .replace(/\\s+/g, \" \")}\n >\n <input\n ref={ref}\n type=\"checkbox\"\n id={switchId}\n className=\"sr-only\"\n checked={checked}\n {...props}\n />\n <span\n className={`\n pointer-events-none\n inline-block\n h-4\n w-4\n transform\n rounded-full\n bg-ds-surface-1\n shadow-lg\n ring-0\n transition-transform\n duration-300\n ease-in-out\n ${checked\n ? isRtl\n ? \"translate-x-1\"\n : \"translate-x-6\"\n : isRtl\n ? \"translate-x-6\"\n : \"translate-x-1\"}\n `\n .trim()\n .replace(/\\s+/g, \" \")}\n />\n </label>\n {label && (\n <label\n htmlFor={switchId}\n className={`cursor-pointer text-sm font-medium leading-none text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70 ${\n isRtl ? \"text-right\" : \"text-left\"\n }`}\n >\n {label}\n </label>\n )}\n {error && (\n <p className=\"text-sm font-medium text-destructive mt-1\">{error}</p>\n )}\n </div>\n );\n },\n);\n\nSwitch.displayName = \"Switch\";\n"],"mappings":";;;AAIA,IAAM,cAAc,UAAkB,MAAM,QAAQ,mBAAmB,IAAI;AAC3E,IAAM,eAAe;AAErB,SAAS,iBACP,WACe;AACf,KAAI,cAAc,SAAS,cAAc,MACvC,QAAO;AAGT,KAAI,OAAO,aAAa,aAAa;EACnC,MAAM,oBACJ,SAAS,gBAAgB,aAAa,MAAM,IAAI,KAAA;AAElD,MAAI,sBAAsB,SAAS,sBAAsB,MACvD,QAAO;;AAIX,KACE,OAAO,cAAc,eACrB,aAAa,KAAK,UAAU,SAAS,CAErC,QAAO;AAGT,QAAO;;AAGT,IAAa,SAAS,YACnB,EAAE,YAAY,IAAI,OAAO,OAAO,IAAI,SAAS,KAAK,GAAG,SAAS,QAAQ;CACrE,MAAM,cAAc,OAAO;CAC3B,MAAM,WAAW,MAAM,UAAU,WAAW,YAAY;CACxD,MAAM,QAAQ,iBAAiB,IAAI,KAAK;AAKxC,QACE,qBAAC,OAAD;EAAK,WALkB,2BAA2B,YACjD,MAAM,CACN,QAAQ,QAAQ,IAAI;EAGkB;YAAvC;GACE,qBAAC,SAAD;IACE,SAAS;IACT,OAAO;KACL,cAAc;KACd,GAAI,UAAU,EAAE,GAAG,EAAE,YAAY,WAAW;KAC7C;IACD,WAAW;;;;cAIP,UAAU,iBAAiB,GAAG;YAE/B,MAAM,CACN,QAAQ,QAAQ,IAAI;cAbzB,CAeE,oBAAC,SAAD;KACO;KACL,MAAK;KACL,IAAI;KACJ,WAAU;KACD;KACT,GAAI;KACJ,CAAA,EACF,oBAAC,QAAD,EACE,WAAW;;;;;;;;;;;;;gBAaP,UACR,QACE,kBACA,kBACF,QACE,kBACA,gBAAgB;cAEX,MAAM,CACN,QAAQ,QAAQ,IAAI,EACvB,CAAA,CACI;;GACP,SACC,oBAAC,SAAD;IACE,SAAS;IACT,WAAW,uHACT,QAAQ,eAAe;cAGxB;IACK,CAAA;GAET,SACC,oBAAC,KAAD;IAAG,WAAU;cAA6C;IAAU,CAAA;GAElE;;EAGX;AAED,OAAO,cAAc"}

package/dist/chunks/switch-DPyzVrNh.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"switch-DPyzVrNh.cjs","names":[],"sources":["../../src/components/forms/switch/Switch.tsx"],"sourcesContent":["import { forwardRef, useId } from \"react\";\n\nimport type { SwitchProps } from \"./types\";\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\nconst rtlLanguages = /^(ar|fa|ur|he)(-|$)/i;\n\nfunction resolveDirection(\n direction: string | undefined,\n): \"ltr\" | \"rtl\" {\n if (direction === \"rtl\" || direction === \"ltr\") {\n return direction;\n }\n\n if (typeof document !== \"undefined\") {\n const explicitDirection =\n document.documentElement.getAttribute(\"dir\") ?? undefined;\n\n if (explicitDirection === \"rtl\" || explicitDirection === \"ltr\") {\n return explicitDirection;\n }\n }\n\n if (\n typeof navigator !== \"undefined\" &&\n rtlLanguages.test(navigator.language)\n ) {\n return \"rtl\";\n }\n\n return \"ltr\";\n}\n\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n ({ className = \"\", label, error, id, checked, dir, ...props }, ref) => {\n const generatedId = useId();\n const switchId = id || `switch-${sanitizeId(generatedId)}`;\n const isRtl = resolveDirection(dir) === \"rtl\";\n const containerClasses = `flex items-center gap-2 ${className}`\n .trim()\n .replace(/\\s+/g, \" \");\n\n return (\n <div className={containerClasses} dir={dir}>\n <label\n htmlFor={switchId}\n style={{\n borderRadius: \"var(--border-radius-full, 9999px)\",\n ...(checked ? {} : { background: \"#E0E5F2\" }),\n }}\n className={`\n relative inline-flex h-6 w-11 cursor-pointer items-center rounded-full transition-colors duration-200\n focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ds-focus focus-visible:ring-offset-2 focus-visible:ring-offset-ds-surface-1\n disabled:cursor-not-allowed disabled:opacity-50\n ${checked ? \"bg-ds-accent\" : \"\"}\n `\n .trim()\n .replace(/\\s+/g, \" \")}\n >\n <input\n ref={ref}\n type=\"checkbox\"\n id={switchId}\n className=\"sr-only\"\n checked={checked}\n {...props}\n />\n <span\n className={`\n pointer-events-none\n inline-block\n h-4\n w-4\n transform\n rounded-full\n bg-ds-surface-1\n shadow-lg\n ring-0\n transition-transform\n duration-300\n ease-in-out\n ${checked\n ? isRtl\n ? \"translate-x-1\"\n : \"translate-x-6\"\n : isRtl\n ? \"translate-x-6\"\n : \"translate-x-1\"}\n `\n .trim()\n .replace(/\\s+/g, \" \")}\n />\n </label>\n {label && (\n <label\n htmlFor={switchId}\n className={`cursor-pointer text-sm font-medium leading-none text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70 ${\n isRtl ? \"text-right\" : \"text-left\"\n }`}\n >\n {label}\n </label>\n )}\n {error && (\n <p className=\"text-sm font-medium text-destructive mt-1\">{error}</p>\n )}\n </div>\n );\n },\n);\n\nSwitch.displayName = \"Switch\";\n"],"mappings":";;;;AAIA,IAAM,cAAc,UAAkB,MAAM,QAAQ,mBAAmB,IAAI;AAC3E,IAAM,eAAe;AAErB,SAAS,iBACP,WACe;AACf,KAAI,cAAc,SAAS,cAAc,MACvC,QAAO;AAGT,KAAI,OAAO,aAAa,aAAa;EACnC,MAAM,oBACJ,SAAS,gBAAgB,aAAa,MAAM,IAAI,KAAA;AAElD,MAAI,sBAAsB,SAAS,sBAAsB,MACvD,QAAO;;AAIX,KACE,OAAO,cAAc,eACrB,aAAa,KAAK,UAAU,SAAS,CAErC,QAAO;AAGT,QAAO;;AAGT,IAAa,UAAA,GAAA,MAAA,aACV,EAAE,YAAY,IAAI,OAAO,OAAO,IAAI,SAAS,KAAK,GAAG,SAAS,QAAQ;CACrE,MAAM,eAAA,GAAA,MAAA,QAAqB;CAC3B,MAAM,WAAW,MAAM,UAAU,WAAW,YAAY;CACxD,MAAM,QAAQ,iBAAiB,IAAI,KAAK;AAKxC,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,WALkB,2BAA2B,YACjD,MAAM,CACN,QAAQ,QAAQ,IAAI;EAGkB;YAAvC;GACE,iBAAA,GAAA,kBAAA,MAAC,SAAD;IACE,SAAS;IACT,OAAO;KACL,cAAc;KACd,GAAI,UAAU,EAAE,GAAG,EAAE,YAAY,WAAW;KAC7C;IACD,WAAW;;;;cAIP,UAAU,iBAAiB,GAAG;YAE/B,MAAM,CACN,QAAQ,QAAQ,IAAI;cAbzB,CAeE,iBAAA,GAAA,kBAAA,KAAC,SAAD;KACO;KACL,MAAK;KACL,IAAI;KACJ,WAAU;KACD;KACT,GAAI;KACJ,CAAA,EACF,iBAAA,GAAA,kBAAA,KAAC,QAAD,EACE,WAAW;;;;;;;;;;;;;gBAaP,UACR,QACE,kBACA,kBACF,QACE,kBACA,gBAAgB;cAEX,MAAM,CACN,QAAQ,QAAQ,IAAI,EACvB,CAAA,CACI;;GACP,SACC,iBAAA,GAAA,kBAAA,KAAC,SAAD;IACE,SAAS;IACT,WAAW,uHACT,QAAQ,eAAe;cAGxB;IACK,CAAA;GAET,SACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;IAAG,WAAU;cAA6C;IAAU,CAAA;GAElE;;EAGX;AAED,OAAO,cAAc"}