@deckai/deck-ui 0.0.20 → 0.0.22
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.
- package/dist/components/AboutCard.cjs +5 -5
- package/dist/components/AboutCard.cjs.map +1 -1
- package/dist/components/AboutCard.d.cts +4 -3
- package/dist/components/AboutCard.d.ts +4 -3
- package/dist/components/AboutCard.js +5 -5
- package/dist/components/AboutCard.js.map +1 -1
- package/dist/components/Accordion.cjs +3 -3
- package/dist/components/Accordion.cjs.map +1 -1
- package/dist/components/Accordion.d.cts +5 -1
- package/dist/components/Accordion.d.ts +5 -1
- package/dist/components/Accordion.js +3 -3
- package/dist/components/Accordion.js.map +1 -1
- package/dist/components/AddWorkCard.cjs +2 -2
- package/dist/components/AddWorkCard.cjs.map +1 -1
- package/dist/components/AddWorkCard.js +2 -2
- package/dist/components/AddWorkCard.js.map +1 -1
- package/dist/components/AutocompleteInput.cjs +2 -2
- package/dist/components/AutocompleteInput.cjs.map +1 -1
- package/dist/components/AutocompleteInput.js +2 -2
- package/dist/components/AutocompleteInput.js.map +1 -1
- package/dist/components/Avatar.cjs +1 -1
- package/dist/components/Avatar.cjs.map +1 -1
- package/dist/components/Avatar.d.cts +3 -1
- package/dist/components/Avatar.d.ts +3 -1
- package/dist/components/Avatar.js +1 -1
- package/dist/components/Avatar.js.map +1 -1
- package/dist/components/Badge.cjs +4 -4
- package/dist/components/Badge.cjs.map +1 -1
- package/dist/components/Badge.js +4 -4
- package/dist/components/Badge.js.map +1 -1
- package/dist/components/Breadcrumbs.cjs +3 -3
- package/dist/components/Breadcrumbs.cjs.map +1 -1
- package/dist/components/Breadcrumbs.d.cts +1 -1
- package/dist/components/Breadcrumbs.d.ts +1 -1
- package/dist/components/Breadcrumbs.js +3 -3
- package/dist/components/Breadcrumbs.js.map +1 -1
- package/dist/components/Button.cjs.map +1 -1
- package/dist/components/Button.js.map +1 -1
- package/dist/components/Carousel.cjs +1 -1
- package/dist/components/Carousel.cjs.map +1 -1
- package/dist/components/Carousel.js +1 -1
- package/dist/components/Carousel.js.map +1 -1
- package/dist/components/Collapsible.cjs +6 -6
- package/dist/components/Collapsible.cjs.map +1 -1
- package/dist/components/Collapsible.js +6 -6
- package/dist/components/Collapsible.js.map +1 -1
- package/dist/components/Combobox.cjs +6 -6
- package/dist/components/Combobox.cjs.map +1 -1
- package/dist/components/Combobox.js +6 -6
- package/dist/components/Combobox.js.map +1 -1
- package/dist/components/ContactItem.cjs +5 -5
- package/dist/components/ContactItem.cjs.map +1 -1
- package/dist/components/ContactItem.d.cts +5 -4
- package/dist/components/ContactItem.d.ts +5 -4
- package/dist/components/ContactItem.js +5 -5
- package/dist/components/ContactItem.js.map +1 -1
- package/dist/components/Dropdown.cjs +4 -4
- package/dist/components/Dropdown.cjs.map +1 -1
- package/dist/components/Dropdown.js +4 -4
- package/dist/components/Dropdown.js.map +1 -1
- package/dist/components/EditButton.cjs +5 -5
- package/dist/components/EditButton.cjs.map +1 -1
- package/dist/components/EditButton.js +5 -5
- package/dist/components/EditButton.js.map +1 -1
- package/dist/components/Fallback.cjs +2 -0
- package/dist/components/Fallback.cjs.map +1 -0
- package/dist/components/Fallback.d.cts +30 -0
- package/dist/components/Fallback.d.ts +30 -0
- package/dist/components/Fallback.js +2 -0
- package/dist/components/Fallback.js.map +1 -0
- package/dist/components/Icon.cjs +1 -1
- package/dist/components/Icon.cjs.map +1 -1
- package/dist/components/Icon.js +1 -1
- package/dist/components/Icon.js.map +1 -1
- package/dist/components/Input.cjs +4 -4
- package/dist/components/Input.cjs.map +1 -1
- package/dist/components/Input.d.cts +2 -2
- package/dist/components/Input.d.ts +2 -2
- package/dist/components/Input.js +4 -4
- package/dist/components/Input.js.map +1 -1
- package/dist/components/Link.cjs.map +1 -1
- package/dist/components/Link.js.map +1 -1
- package/dist/components/Logo.cjs +1 -1
- package/dist/components/Logo.cjs.map +1 -1
- package/dist/components/Logo.js +1 -1
- package/dist/components/Logo.js.map +1 -1
- package/dist/components/Modal.cjs +1 -1
- package/dist/components/Modal.cjs.map +1 -1
- package/dist/components/Modal.js +1 -1
- package/dist/components/Modal.js.map +1 -1
- package/dist/components/MultiSelectCombobox.cjs +2 -2
- package/dist/components/MultiSelectCombobox.cjs.map +1 -1
- package/dist/components/MultiSelectCombobox.js +2 -2
- package/dist/components/MultiSelectCombobox.js.map +1 -1
- package/dist/components/Navbar.cjs +7 -7
- package/dist/components/Navbar.cjs.map +1 -1
- package/dist/components/Navbar.d.cts +5 -5
- package/dist/components/Navbar.d.ts +5 -5
- package/dist/components/Navbar.js +7 -7
- package/dist/components/Navbar.js.map +1 -1
- package/dist/components/NavbarItem.cjs +3 -3
- package/dist/components/NavbarItem.cjs.map +1 -1
- package/dist/components/NavbarItem.js +3 -3
- package/dist/components/NavbarItem.js.map +1 -1
- package/dist/components/Option.cjs +3 -3
- package/dist/components/Option.cjs.map +1 -1
- package/dist/components/Option.js +3 -3
- package/dist/components/Option.js.map +1 -1
- package/dist/components/ProfileCard.cjs +6 -6
- package/dist/components/ProfileCard.cjs.map +1 -1
- package/dist/components/ProfileCard.d.cts +5 -4
- package/dist/components/ProfileCard.d.ts +5 -4
- package/dist/components/ProfileCard.js +6 -6
- package/dist/components/ProfileCard.js.map +1 -1
- package/dist/components/ProgressBar.cjs.map +1 -1
- package/dist/components/ProgressBar.js.map +1 -1
- package/dist/components/RadioGroup.cjs.map +1 -1
- package/dist/components/RadioGroup.js.map +1 -1
- package/dist/components/SegmentedTabs.cjs +3 -3
- package/dist/components/SegmentedTabs.cjs.map +1 -1
- package/dist/components/SegmentedTabs.js +3 -3
- package/dist/components/SegmentedTabs.js.map +1 -1
- package/dist/components/Sidebar.cjs +1 -1
- package/dist/components/Sidebar.cjs.map +1 -1
- package/dist/components/Sidebar.js +1 -1
- package/dist/components/Sidebar.js.map +1 -1
- package/dist/components/SlideButton.cjs.map +1 -1
- package/dist/components/SlideButton.js.map +1 -1
- package/dist/components/Slider.cjs +1 -1
- package/dist/components/Slider.cjs.map +1 -1
- package/dist/components/Slider.js +1 -1
- package/dist/components/Slider.js.map +1 -1
- package/dist/components/SocialCard.cjs +4 -4
- package/dist/components/SocialCard.cjs.map +1 -1
- package/dist/components/SocialCard.d.cts +2 -1
- package/dist/components/SocialCard.d.ts +2 -1
- package/dist/components/SocialCard.js +4 -4
- package/dist/components/SocialCard.js.map +1 -1
- package/dist/components/Spinner.d.cts +2 -2
- package/dist/components/Spinner.d.ts +2 -2
- package/dist/components/Switch.cjs +1 -1
- package/dist/components/Switch.cjs.map +1 -1
- package/dist/components/Switch.js +1 -1
- package/dist/components/Switch.js.map +1 -1
- package/dist/components/Tabs.cjs +4 -4
- package/dist/components/Tabs.cjs.map +1 -1
- package/dist/components/Tabs.js +4 -4
- package/dist/components/Tabs.js.map +1 -1
- package/dist/components/Tag.cjs +5 -5
- package/dist/components/Tag.cjs.map +1 -1
- package/dist/components/Tag.js +5 -5
- package/dist/components/Tag.js.map +1 -1
- package/dist/components/Text.cjs.map +1 -1
- package/dist/components/Text.d.cts +1 -1
- package/dist/components/Text.d.ts +1 -1
- package/dist/components/Text.js.map +1 -1
- package/dist/components/TextArea.cjs.map +1 -1
- package/dist/components/TextArea.js.map +1 -1
- package/dist/components/Toast.cjs +5 -5
- package/dist/components/Toast.cjs.map +1 -1
- package/dist/components/Toast.d.cts +2 -2
- package/dist/components/Toast.d.ts +2 -2
- package/dist/components/Toast.js +5 -5
- package/dist/components/Toast.js.map +1 -1
- package/dist/components/Tooltip.cjs +2 -2
- package/dist/components/Tooltip.cjs.map +1 -1
- package/dist/components/Tooltip.js +2 -2
- package/dist/components/Tooltip.js.map +1 -1
- package/dist/components/VideoPlayer.cjs +2 -2
- package/dist/components/VideoPlayer.cjs.map +1 -1
- package/dist/components/VideoPlayer.js +2 -2
- package/dist/components/VideoPlayer.js.map +1 -1
- package/dist/components/WorkCard.cjs +14 -6
- package/dist/components/WorkCard.cjs.map +1 -1
- package/dist/components/WorkCard.d.cts +8 -5
- package/dist/components/WorkCard.d.ts +8 -5
- package/dist/components/WorkCard.js +14 -6
- package/dist/components/WorkCard.js.map +1 -1
- package/dist/index.cjs +8 -8
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +8 -8
- package/dist/index.js.map +1 -1
- package/dist/styles/styles.css +2 -2
- package/dist/styles/styles.css.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/hooks/useMediaQuery.ts","../../src/utils/index.ts","../../src/utils/responsive.ts","../../src/components/Icon.tsx","../../src/utils/tailwind.ts","../../src/components/Pressable.tsx","../../src/components/Sidebar.tsx"],"names":["useIsomorphicLayoutEffect","useEffect","useMediaQuery","query","matches","setMatches","useState","getMatches","useCallback","mediaQuery","handleChange","cn","inputs","twMerge","clsx","BASE_SIZES","RESPONSIVE_SIZES","getSizeKey","size","getResponsiveSize","baseSize","classes","styles","key","baseKey","responsiveClasses","s","breakpoint","valueStr","value","valueKey","COLOR_MAP","Icon","React","name","color","title","className","style","props","ref","IconComponent","IconMap","responsiveSizeClasses","responsiveSizeStyles","focusRingStyles","Pressable","children","type","disabled","Sidebar","open","onClose","width","footer","position","isMobile","handleEscapeKey","event","positionClasses","useMemo"],"mappings":"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","file":"Sidebar.js","sourcesContent":["import { useCallback, useEffect, useState } from \"react\";\n\nconst useIsomorphicLayoutEffect =\n typeof window !== \"undefined\" ? useEffect : () => {};\n\nexport const useMediaQuery = (query: string): boolean => {\n // Initialize with null to prevent hydration mismatch\n const [matches, setMatches] = useState<boolean | null>(null);\n\n const getMatches = useCallback((query: string): boolean => {\n if (typeof window !== \"undefined\") {\n return window.matchMedia(query).matches;\n }\n return false;\n }, []);\n\n // Update matches after mount to prevent hydration mismatch\n useIsomorphicLayoutEffect(() => {\n setMatches(getMatches(query));\n }, [query, getMatches]);\n\n useEffect(() => {\n if (typeof window !== \"undefined\") {\n const mediaQuery = window.matchMedia(query);\n\n const handleChange = () => {\n setMatches(getMatches(query));\n };\n\n mediaQuery.addEventListener(\"change\", handleChange);\n\n return () => {\n mediaQuery.removeEventListener(\"change\", handleChange);\n };\n }\n }, [query, getMatches]);\n\n // Return false during SSR, actual value after hydration\n return matches ?? false;\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","export type Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport type ResponsiveSize = number | `${Breakpoint}:${number}`;\n\ntype SizeKey =\n | \"12\"\n | \"16\"\n | \"18\"\n | \"20\"\n | \"24\"\n | \"32\"\n | \"36\"\n | \"40\"\n | \"42\"\n | \"48\"\n | \"64\"\n | \"72\";\n\n// These constants help Tailwind identify the classes during compilation\nconst BASE_SIZES: Record<SizeKey, string> = {\n \"12\": \"h-[12px] w-[12px]\",\n \"16\": \"h-[16px] w-[16px]\",\n \"18\": \"h-[18px] w-[18px]\",\n \"20\": \"h-[20px] w-[20px]\",\n \"24\": \"h-[24px] w-[24px]\",\n \"32\": \"h-[32px] w-[32px]\",\n \"36\": \"h-[36px] w-[36px]\",\n \"40\": \"h-[40px] w-[40px]\",\n \"42\": \"h-[42px] w-[42px]\",\n \"48\": \"h-[48px] w-[48px]\",\n \"64\": \"h-[64px] w-[64px]\",\n \"72\": \"h-[72px] w-[72px]\"\n};\n\nconst RESPONSIVE_SIZES: Record<Breakpoint, Record<SizeKey, string>> = {\n sm: {\n \"12\": \"sm:h-[12px] sm:w-[12px]\",\n \"16\": \"sm:h-[16px] sm:w-[16px]\",\n \"18\": \"sm:h-[18px] sm:w-[18px]\",\n \"20\": \"sm:h-[20px] sm:w-[20px]\",\n \"24\": \"sm:h-[24px] sm:w-[24px]\",\n \"32\": \"sm:h-[32px] sm:w-[32px]\",\n \"36\": \"sm:h-[36px] sm:w-[36px]\",\n \"40\": \"sm:h-[40px] sm:w-[40px]\",\n \"42\": \"sm:h-[42px] sm:w-[42px]\",\n \"48\": \"sm:h-[48px] sm:w-[48px]\",\n \"64\": \"sm:h-[64px] sm:w-[64px]\",\n \"72\": \"sm:h-[72px] sm:w-[72px]\"\n },\n md: {\n \"12\": \"md:h-[12px] md:w-[12px]\",\n \"16\": \"md:h-[16px] md:w-[16px]\",\n \"18\": \"md:h-[18px] md:w-[18px]\",\n \"20\": \"md:h-[20px] md:w-[20px]\",\n \"24\": \"md:h-[24px] md:w-[24px]\",\n \"32\": \"md:h-[32px] md:w-[32px]\",\n \"36\": \"md:h-[36px] md:w-[36px]\",\n \"40\": \"md:h-[40px] md:w-[40px]\",\n \"42\": \"md:h-[42px] md:w-[42px]\",\n \"48\": \"md:h-[48px] md:w-[48px]\",\n \"64\": \"md:h-[64px] md:w-[64px]\",\n \"72\": \"md:h-[72px] md:w-[72px]\"\n },\n lg: {\n \"12\": \"lg:h-[12px] lg:w-[12px]\",\n \"16\": \"lg:h-[16px] lg:w-[16px]\",\n \"18\": \"lg:h-[18px] lg:w-[18px]\",\n \"20\": \"lg:h-[20px] lg:w-[20px]\",\n \"24\": \"lg:h-[24px] lg:w-[24px]\",\n \"32\": \"lg:h-[32px] lg:w-[32px]\",\n \"36\": \"lg:h-[36px] lg:w-[36px]\",\n \"40\": \"lg:h-[40px] lg:w-[40px]\",\n \"42\": \"lg:h-[42px] lg:w-[42px]\",\n \"48\": \"lg:h-[48px] lg:w-[48px]\",\n \"64\": \"lg:h-[64px] lg:w-[64px]\",\n \"72\": \"lg:h-[72px] lg:w-[72px]\"\n },\n xl: {\n \"12\": \"xl:h-[12px] xl:w-[12px]\",\n \"16\": \"xl:h-[16px] xl:w-[16px]\",\n \"18\": \"xl:h-[18px] xl:w-[18px]\",\n \"20\": \"xl:h-[20px] xl:w-[20px]\",\n \"24\": \"xl:h-[24px] xl:w-[24px]\",\n \"32\": \"xl:h-[32px] xl:w-[32px]\",\n \"36\": \"xl:h-[36px] xl:w-[36px]\",\n \"40\": \"xl:h-[40px] xl:w-[40px]\",\n \"42\": \"xl:h-[42px] xl:w-[42px]\",\n \"48\": \"xl:h-[48px] xl:w-[48px]\",\n \"64\": \"xl:h-[64px] xl:w-[64px]\",\n \"72\": \"xl:h-[72px] xl:w-[72px]\"\n },\n \"2xl\": {\n \"12\": \"2xl:h-[12px] 2xl:w-[12px]\",\n \"16\": \"2xl:h-[16px] 2xl:w-[16px]\",\n \"18\": \"2xl:h-[18px] 2xl:w-[18px]\",\n \"20\": \"2xl:h-[20px] 2xl:w-[20px]\",\n \"24\": \"2xl:h-[24px] 2xl:w-[24px]\",\n \"32\": \"2xl:h-[32px] 2xl:w-[32px]\",\n \"36\": \"2xl:h-[36px] 2xl:w-[36px]\",\n \"40\": \"2xl:h-[40px] 2xl:w-[40px]\",\n \"42\": \"2xl:h-[42px] 2xl:w-[42px]\",\n \"48\": \"2xl:h-[48px] 2xl:w-[48px]\",\n \"64\": \"2xl:h-[64px] 2xl:w-[64px]\",\n \"72\": \"2xl:h-[72px] 2xl:w-[72px]\"\n }\n};\n\nconst getSizeKey = (size: number): SizeKey | undefined => {\n return String(size) as SizeKey;\n};\n\nexport const getResponsiveSize = (\n size: ResponsiveSize | ResponsiveSize[] | undefined,\n baseSize: number = 24\n): {\n responsiveSizeClasses: string;\n responsiveSizeStyles: Record<string, string>;\n} => {\n const classes: string[] = [];\n const styles: Record<string, string> = {};\n\n // If no size provided, use baseSize\n if (size === undefined) {\n const key = getSizeKey(baseSize);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${baseSize}px`;\n styles.width = `${baseSize}px`;\n }\n }\n\n // If size is a number, use that directly\n if (typeof size === \"number\") {\n const key = getSizeKey(size);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${size}px`;\n styles.width = `${size}px`;\n }\n }\n\n // If array of responsive sizes, generate responsive classes\n if (Array.isArray(size)) {\n const baseKey = getSizeKey(baseSize);\n const responsiveClasses = [\n (baseKey && BASE_SIZES[baseKey]) || `h-[${baseSize}px] w-[${baseSize}px]`\n ];\n\n size.forEach((s) => {\n if (typeof s === \"string\") {\n const [breakpoint, valueStr] = s.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const key = getSizeKey(value);\n classes.push(\n (key && RESPONSIVE_SIZES[breakpoint]?.[key]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n });\n\n classes.push(...responsiveClasses);\n }\n\n if (typeof size === \"string\") {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const valueKey = getSizeKey(value);\n classes.push(\n (valueKey && RESPONSIVE_SIZES[breakpoint]?.[valueKey]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n\n return {\n responsiveSizeClasses: classes.join(\" \"),\n responsiveSizeStyles: styles\n };\n};\n","import { IconMap, IconName } from \"@deckai/icons\";\nimport React, { SVGProps } from \"react\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\nimport { ResponsiveSize, getResponsiveSize } from \"../utils/responsive\";\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"#080808\",\n secondary: \"#666666\",\n white: \"#ffffff\",\n primaryBlue: \"#089CCB\",\n disabled: \"#888888\",\n danger: \"#FF0000\"\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const { responsiveSizeClasses, responsiveSizeStyles } = getResponsiveSize(\n size,\n 24\n );\n\n return (\n <div\n className={cn(\n \"flex justify-center items-center\",\n responsiveSizeClasses,\n className\n )}\n style={{\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...responsiveSizeStyles,\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const sizes = [\"24\", \"42\", \"48\", \"64\", \"72\"]; // Add all the sizes you need\n\n const safelist: (string | { pattern: RegExp; variants: string[] })[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n // Generate size classes with responsive variants\n const sizeClasses = sizes.flatMap((size) => [\n `h-[${size}px]`,\n `w-[${size}px]`,\n ...breakpoints.flatMap((bp) => [\n `${bp}:h-[${size}px]`,\n `${bp}:w-[${size}px]`\n ])\n ]);\n\n return [...typographyClasses, ...responsiveTypographyClasses, ...sizeClasses];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\";\nexport const focusRingWithinStyles =\n \"focus-within:outline-none focus-within:ring-2 focus-within:ring-primary-100\";\nexport const focusRingStylesCoerced = \"ring-2 ring-primary-100\";\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import * as Dialog from \"@radix-ui/react-dialog\";\nimport React, { useCallback, useEffect, useMemo, type ReactNode } from \"react\";\nimport { useMediaQuery } from \"../hooks/useMediaQuery\";\nimport { cn } from \"../utils\";\nimport { Icon } from \"./Icon\";\nimport { Pressable } from \"./Pressable\";\n\nexport type SidebarProps = {\n /**\n * The content to be rendered inside the sidebar\n */\n children: ReactNode;\n /**\n * Whether the sidebar is open\n */\n open: boolean;\n /**\n * Callback fired when the sidebar is closed\n */\n onClose: () => void;\n /** @default left */\n position?: \"left\" | \"right\";\n /**\n * The width of the sidebar on desktop. Defaults to 480px.\n */\n width?: number;\n /**\n * Additional class names to be applied to the sidebar\n */\n className?: string;\n /**\n * The title to display in the header\n */\n title?: string;\n /**\n * Optional footer content\n */\n footer?: ReactNode;\n};\n\nexport const Sidebar = ({\n children,\n open,\n onClose,\n width = 480,\n className,\n title,\n footer,\n position = \"left\"\n}: SidebarProps) => {\n const isMobile = useMediaQuery(\"(max-width: 834px)\");\n\n // Handle escape key press\n const handleEscapeKey = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onClose();\n }\n },\n [onClose]\n );\n\n useEffect(() => {\n if (open) {\n document.addEventListener(\"keydown\", handleEscapeKey);\n // Prevent body scroll when sidebar is open\n document.body.style.overflow = \"hidden\";\n } else {\n // Ensure we clean up when sidebar is closed\n document.removeEventListener(\"keydown\", handleEscapeKey);\n document.body.style.overflow = \"unset\";\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleEscapeKey);\n document.body.style.overflow = \"unset\";\n };\n }, [open, handleEscapeKey]);\n\n const positionClasses = useMemo(\n () =>\n position === \"right\"\n ? {\n position: \"right-0\",\n enter: \"data-[state=open]:animate-slide-in-from-right\",\n exit: \"data-[state=closed]:animate-slide-out-to-right\",\n transform: \"translate-x-full\"\n }\n : {\n position: \"left-0\",\n enter: \"data-[state=open]:animate-slide-in-from-left\",\n exit: \"data-[state=closed]:animate-slide-out-to-left\",\n transform: \"-translate-x-full\"\n },\n [position]\n );\n\n return (\n <Dialog.Root open={open} onOpenChange={onClose}>\n <Dialog.Portal>\n <Dialog.Overlay\n className={cn(\n \"fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]\",\n \"data-[state=open]:animate-overlay-show\",\n \"data-[state=closed]:animate-overlay-hide\"\n )}\n />\n <Dialog.Content\n className={cn(\n \"fixed top-0 z-50 flex h-full flex-col bg-white\",\n positionClasses.position,\n positionClasses.enter,\n positionClasses.exit,\n // During SSR, default to desktop layout\n typeof window === \"undefined\" || !isMobile\n ? position === \"right\"\n ? \"border-l\"\n : \"border-r\"\n : \"w-full\",\n \"border-stroke\",\n className\n )}\n style={{\n width: typeof window === \"undefined\" || !isMobile ? width : \"100%\"\n }}\n >\n {/* Header */}\n <div className=\"flex items-center justify-between border-b border-secondary-50 px-8 py-6\">\n <Dialog.Title className=\"text-heading-xs text-center w-full\">\n {title}\n </Dialog.Title>\n <Dialog.Close asChild>\n <Pressable\n className=\"inline-flex items-center justify-center text-secondary\"\n aria-label=\"Close\"\n >\n <Icon name=\"close\" size={12} />\n </Pressable>\n </Dialog.Close>\n </div>\n\n {/* Content */}\n <div className=\"flex-1 overflow-y-auto\">\n <div className=\"p-6\">{children}</div>\n </div>\n\n {/* Footer */}\n {footer && <div className=\"px-6 pb-6 bg-background\">{footer}</div>}\n </Dialog.Content>\n </Dialog.Portal>\n </Dialog.Root>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/useMediaQuery.ts","../../src/utils/index.ts","../../src/utils/responsive.ts","../../src/components/Icon.tsx","../../src/utils/tailwind.ts","../../src/components/Pressable.tsx","../../src/components/Sidebar.tsx"],"names":["useIsomorphicLayoutEffect","useEffect","useMediaQuery","query","matches","setMatches","useState","getMatches","useCallback","mediaQuery","handleChange","cn","inputs","twMerge","clsx","BASE_SIZES","RESPONSIVE_SIZES","getSizeKey","size","getResponsiveSize","baseSize","classes","styles","key","baseKey","responsiveClasses","s","breakpoint","valueStr","value","valueKey","COLOR_MAP","Icon","React","name","color","title","className","style","props","ref","IconComponent","IconMap","responsiveSizeClasses","responsiveSizeStyles","focusRingStyles","Pressable","children","type","disabled","Sidebar","open","onClose","width","footer","position","isMobile","handleEscapeKey","event","positionClasses","useMemo"],"mappings":"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","file":"Sidebar.js","sourcesContent":["import { useCallback, useEffect, useState } from \"react\";\n\nconst useIsomorphicLayoutEffect =\n typeof window !== \"undefined\" ? useEffect : () => {};\n\nexport const useMediaQuery = (query: string): boolean => {\n // Initialize with null to prevent hydration mismatch\n const [matches, setMatches] = useState<boolean | null>(null);\n\n const getMatches = useCallback((query: string): boolean => {\n if (typeof window !== \"undefined\") {\n return window.matchMedia(query).matches;\n }\n return false;\n }, []);\n\n // Update matches after mount to prevent hydration mismatch\n useIsomorphicLayoutEffect(() => {\n setMatches(getMatches(query));\n }, [query, getMatches]);\n\n useEffect(() => {\n if (typeof window !== \"undefined\") {\n const mediaQuery = window.matchMedia(query);\n\n const handleChange = () => {\n setMatches(getMatches(query));\n };\n\n mediaQuery.addEventListener(\"change\", handleChange);\n\n return () => {\n mediaQuery.removeEventListener(\"change\", handleChange);\n };\n }\n }, [query, getMatches]);\n\n // Return false during SSR, actual value after hydration\n return matches ?? false;\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","export type Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport type ResponsiveSize = number | `${Breakpoint}:${number}`;\n\ntype SizeKey =\n | \"12\"\n | \"16\"\n | \"18\"\n | \"20\"\n | \"24\"\n | \"32\"\n | \"36\"\n | \"40\"\n | \"42\"\n | \"48\"\n | \"64\"\n | \"72\";\n\n// These constants help Tailwind identify the classes during compilation\nconst BASE_SIZES: Record<SizeKey, string> = {\n \"12\": \"h-[12px] w-[12px]\",\n \"16\": \"h-[16px] w-[16px]\",\n \"18\": \"h-[18px] w-[18px]\",\n \"20\": \"h-[20px] w-[20px]\",\n \"24\": \"h-[24px] w-[24px]\",\n \"32\": \"h-[32px] w-[32px]\",\n \"36\": \"h-[36px] w-[36px]\",\n \"40\": \"h-[40px] w-[40px]\",\n \"42\": \"h-[42px] w-[42px]\",\n \"48\": \"h-[48px] w-[48px]\",\n \"64\": \"h-[64px] w-[64px]\",\n \"72\": \"h-[72px] w-[72px]\"\n};\n\nconst RESPONSIVE_SIZES: Record<Breakpoint, Record<SizeKey, string>> = {\n sm: {\n \"12\": \"sm:h-[12px] sm:w-[12px]\",\n \"16\": \"sm:h-[16px] sm:w-[16px]\",\n \"18\": \"sm:h-[18px] sm:w-[18px]\",\n \"20\": \"sm:h-[20px] sm:w-[20px]\",\n \"24\": \"sm:h-[24px] sm:w-[24px]\",\n \"32\": \"sm:h-[32px] sm:w-[32px]\",\n \"36\": \"sm:h-[36px] sm:w-[36px]\",\n \"40\": \"sm:h-[40px] sm:w-[40px]\",\n \"42\": \"sm:h-[42px] sm:w-[42px]\",\n \"48\": \"sm:h-[48px] sm:w-[48px]\",\n \"64\": \"sm:h-[64px] sm:w-[64px]\",\n \"72\": \"sm:h-[72px] sm:w-[72px]\"\n },\n md: {\n \"12\": \"md:h-[12px] md:w-[12px]\",\n \"16\": \"md:h-[16px] md:w-[16px]\",\n \"18\": \"md:h-[18px] md:w-[18px]\",\n \"20\": \"md:h-[20px] md:w-[20px]\",\n \"24\": \"md:h-[24px] md:w-[24px]\",\n \"32\": \"md:h-[32px] md:w-[32px]\",\n \"36\": \"md:h-[36px] md:w-[36px]\",\n \"40\": \"md:h-[40px] md:w-[40px]\",\n \"42\": \"md:h-[42px] md:w-[42px]\",\n \"48\": \"md:h-[48px] md:w-[48px]\",\n \"64\": \"md:h-[64px] md:w-[64px]\",\n \"72\": \"md:h-[72px] md:w-[72px]\"\n },\n lg: {\n \"12\": \"lg:h-[12px] lg:w-[12px]\",\n \"16\": \"lg:h-[16px] lg:w-[16px]\",\n \"18\": \"lg:h-[18px] lg:w-[18px]\",\n \"20\": \"lg:h-[20px] lg:w-[20px]\",\n \"24\": \"lg:h-[24px] lg:w-[24px]\",\n \"32\": \"lg:h-[32px] lg:w-[32px]\",\n \"36\": \"lg:h-[36px] lg:w-[36px]\",\n \"40\": \"lg:h-[40px] lg:w-[40px]\",\n \"42\": \"lg:h-[42px] lg:w-[42px]\",\n \"48\": \"lg:h-[48px] lg:w-[48px]\",\n \"64\": \"lg:h-[64px] lg:w-[64px]\",\n \"72\": \"lg:h-[72px] lg:w-[72px]\"\n },\n xl: {\n \"12\": \"xl:h-[12px] xl:w-[12px]\",\n \"16\": \"xl:h-[16px] xl:w-[16px]\",\n \"18\": \"xl:h-[18px] xl:w-[18px]\",\n \"20\": \"xl:h-[20px] xl:w-[20px]\",\n \"24\": \"xl:h-[24px] xl:w-[24px]\",\n \"32\": \"xl:h-[32px] xl:w-[32px]\",\n \"36\": \"xl:h-[36px] xl:w-[36px]\",\n \"40\": \"xl:h-[40px] xl:w-[40px]\",\n \"42\": \"xl:h-[42px] xl:w-[42px]\",\n \"48\": \"xl:h-[48px] xl:w-[48px]\",\n \"64\": \"xl:h-[64px] xl:w-[64px]\",\n \"72\": \"xl:h-[72px] xl:w-[72px]\"\n },\n \"2xl\": {\n \"12\": \"2xl:h-[12px] 2xl:w-[12px]\",\n \"16\": \"2xl:h-[16px] 2xl:w-[16px]\",\n \"18\": \"2xl:h-[18px] 2xl:w-[18px]\",\n \"20\": \"2xl:h-[20px] 2xl:w-[20px]\",\n \"24\": \"2xl:h-[24px] 2xl:w-[24px]\",\n \"32\": \"2xl:h-[32px] 2xl:w-[32px]\",\n \"36\": \"2xl:h-[36px] 2xl:w-[36px]\",\n \"40\": \"2xl:h-[40px] 2xl:w-[40px]\",\n \"42\": \"2xl:h-[42px] 2xl:w-[42px]\",\n \"48\": \"2xl:h-[48px] 2xl:w-[48px]\",\n \"64\": \"2xl:h-[64px] 2xl:w-[64px]\",\n \"72\": \"2xl:h-[72px] 2xl:w-[72px]\"\n }\n};\n\nconst getSizeKey = (size: number): SizeKey | undefined => {\n return String(size) as SizeKey;\n};\n\nexport const getResponsiveSize = (\n size: ResponsiveSize | ResponsiveSize[] | undefined,\n baseSize: number = 24\n): {\n responsiveSizeClasses: string;\n responsiveSizeStyles: Record<string, string>;\n} => {\n const classes: string[] = [];\n const styles: Record<string, string> = {};\n\n // If no size provided, use baseSize\n if (size === undefined) {\n const key = getSizeKey(baseSize);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${baseSize}px`;\n styles.width = `${baseSize}px`;\n }\n }\n\n // If size is a number, use that directly\n if (typeof size === \"number\") {\n const key = getSizeKey(size);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${size}px`;\n styles.width = `${size}px`;\n }\n }\n\n // If array of responsive sizes, generate responsive classes\n if (Array.isArray(size)) {\n const baseKey = getSizeKey(baseSize);\n const responsiveClasses = [\n (baseKey && BASE_SIZES[baseKey]) || `h-[${baseSize}px] w-[${baseSize}px]`\n ];\n\n size.forEach((s) => {\n if (typeof s === \"string\") {\n const [breakpoint, valueStr] = s.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const key = getSizeKey(value);\n classes.push(\n (key && RESPONSIVE_SIZES[breakpoint]?.[key]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n });\n\n classes.push(...responsiveClasses);\n }\n\n if (typeof size === \"string\") {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const valueKey = getSizeKey(value);\n classes.push(\n (valueKey && RESPONSIVE_SIZES[breakpoint]?.[valueKey]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n\n return {\n responsiveSizeClasses: classes.join(\" \"),\n responsiveSizeStyles: styles\n };\n};\n","import { IconMap, IconName } from \"@deckai/icons\";\nimport React, { SVGProps } from \"react\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\nimport { ResponsiveSize, getResponsiveSize } from \"../utils/responsive\";\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\n// Using CSS variables to support dark mode\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"var(--color-primary)\",\n secondary: \"var(--color-secondary)\",\n white: \"var(--color-white)\",\n primaryBlue: \"var(--color-primary-100)\",\n disabled: \"var(--color-disabled)\",\n danger: \"var(--color-danger)\"\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const { responsiveSizeClasses, responsiveSizeStyles } = getResponsiveSize(\n size,\n 24\n );\n\n return (\n <div\n className={cn(\n \"flex justify-center items-center\",\n responsiveSizeClasses,\n className\n )}\n style={{\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...responsiveSizeStyles,\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const sizes = [\"24\", \"42\", \"48\", \"64\", \"72\"]; // Add all the sizes you need\n\n const safelist: (string | { pattern: RegExp; variants: string[] })[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n // Generate size classes with responsive variants\n const sizeClasses = sizes.flatMap((size) => [\n `h-[${size}px]`,\n `w-[${size}px]`,\n ...breakpoints.flatMap((bp) => [\n `${bp}:h-[${size}px]`,\n `${bp}:w-[${size}px]`\n ])\n ]);\n\n return [...typographyClasses, ...responsiveTypographyClasses, ...sizeClasses];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\";\nexport const focusRingWithinStyles =\n \"focus-within:outline-none focus-within:ring-2 focus-within:ring-primary-100\";\nexport const focusRingStylesCoerced = \"ring-2 ring-primary-100\";\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import * as Dialog from \"@radix-ui/react-dialog\";\nimport React, { useCallback, useEffect, useMemo, type ReactNode } from \"react\";\nimport { useMediaQuery } from \"../hooks/useMediaQuery\";\nimport { cn } from \"../utils\";\nimport { Icon } from \"./Icon\";\nimport { Pressable } from \"./Pressable\";\n\nexport type SidebarProps = {\n /**\n * The content to be rendered inside the sidebar\n */\n children: ReactNode;\n /**\n * Whether the sidebar is open\n */\n open: boolean;\n /**\n * Callback fired when the sidebar is closed\n */\n onClose: () => void;\n /** @default left */\n position?: \"left\" | \"right\";\n /**\n * The width of the sidebar on desktop. Defaults to 480px.\n */\n width?: number;\n /**\n * Additional class names to be applied to the sidebar\n */\n className?: string;\n /**\n * The title to display in the header\n */\n title?: string;\n /**\n * Optional footer content\n */\n footer?: ReactNode;\n};\n\nexport const Sidebar = ({\n children,\n open,\n onClose,\n width = 480,\n className,\n title,\n footer,\n position = \"left\"\n}: SidebarProps) => {\n const isMobile = useMediaQuery(\"(max-width: 834px)\");\n\n // Handle escape key press\n const handleEscapeKey = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n onClose();\n }\n },\n [onClose]\n );\n\n useEffect(() => {\n if (open) {\n document.addEventListener(\"keydown\", handleEscapeKey);\n // Prevent body scroll when sidebar is open\n document.body.style.overflow = \"hidden\";\n } else {\n // Ensure we clean up when sidebar is closed\n document.removeEventListener(\"keydown\", handleEscapeKey);\n document.body.style.overflow = \"unset\";\n }\n\n return () => {\n document.removeEventListener(\"keydown\", handleEscapeKey);\n document.body.style.overflow = \"unset\";\n };\n }, [open, handleEscapeKey]);\n\n const positionClasses = useMemo(\n () =>\n position === \"right\"\n ? {\n position: \"right-0\",\n enter: \"data-[state=open]:animate-slide-in-from-right\",\n exit: \"data-[state=closed]:animate-slide-out-to-right\",\n transform: \"translate-x-full\"\n }\n : {\n position: \"left-0\",\n enter: \"data-[state=open]:animate-slide-in-from-left\",\n exit: \"data-[state=closed]:animate-slide-out-to-left\",\n transform: \"-translate-x-full\"\n },\n [position]\n );\n\n return (\n <Dialog.Root open={open} onOpenChange={onClose}>\n <Dialog.Portal>\n <Dialog.Overlay\n className={cn(\n \"fixed inset-0 z-50 bg-sidebarOverlay backdrop-blur-[2px]\",\n \"data-[state=open]:animate-overlay-show\",\n \"data-[state=closed]:animate-overlay-hide\"\n )}\n />\n <Dialog.Content\n className={cn(\n \"fixed top-0 z-50 flex h-full flex-col bg-background-0\",\n positionClasses.position,\n positionClasses.enter,\n positionClasses.exit,\n // During SSR, default to desktop layout\n typeof window === \"undefined\" || !isMobile\n ? position === \"right\"\n ? \"border-l\"\n : \"border-r\"\n : \"w-full\",\n \"border-stroke\",\n className\n )}\n style={{\n width: typeof window === \"undefined\" || !isMobile ? width : \"100%\"\n }}\n >\n {/* Header */}\n <div className=\"flex items-center justify-between border-b border-secondary-50 px-8 py-6\">\n <Dialog.Title className=\"text-heading-xs text-center w-full\">\n {title}\n </Dialog.Title>\n <Dialog.Close asChild>\n <Pressable\n className=\"inline-flex items-center justify-center text-secondary\"\n aria-label=\"Close\"\n >\n <Icon name=\"close\" size={12} />\n </Pressable>\n </Dialog.Close>\n </div>\n\n {/* Content */}\n <div className=\"flex-1 overflow-y-auto\">\n <div className=\"p-6\">{children}</div>\n </div>\n\n {/* Footer */}\n {footer && <div className=\"px-6 pb-6 bg-background\">{footer}</div>}\n </Dialog.Content>\n </Dialog.Portal>\n </Dialog.Root>\n );\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/SlideButton.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","SlideButton","e","text","confirmText","onConfirm","disabled","ariaLabel","isDragging","setIsDragging","slidePosition","setSlidePosition","isConfirmed","setIsConfirmed","buttonRef","thumbRef","isFocused","setIsFocused","handleKeyDown","thumbElement","trackElement","maxSlide","newPosition","handleDragStart","handleDragMove","clientX","buttonRect","thumbRect","handleMouseMove","handleTouchMove","handleDragEnd","progressPercentage"],"mappings":"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","file":"SlideButton.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\nimport { Breakpoint } from \"../utils/responsive\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type SlideButtonProps = {\n /** The text to display when not sliding */\n text: string;\n /** The text to display when sliding is complete */\n confirmText?: string;\n /** Callback fired when sliding is complete */\n onConfirm: () => void;\n /** Optional variant for different visual styles */\n variant?: \"primary\" | \"danger\";\n /** Optional className for custom styling */\n className?: string;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** Optional ARIA label */\n \"aria-label\"?: string;\n};\n\nexport const SlideButton = React.forwardRef<HTMLDivElement, SlideButtonProps>(\n (\n {\n text,\n confirmText = \"Confirmed!\",\n onConfirm,\n variant = \"primary\",\n className,\n disabled = false,\n \"aria-label\": ariaLabel,\n ...props\n },\n ref\n ) => {\n const [isDragging, setIsDragging] = React.useState(false);\n const [slidePosition, setSlidePosition] = React.useState(0);\n const [isConfirmed, setIsConfirmed] = React.useState(false);\n const buttonRef = React.useRef<HTMLDivElement>(null);\n const thumbRef = React.useRef<HTMLDivElement>(null);\n const [isFocused, setIsFocused] = React.useState(false);\n\n const variants = {\n primary: {\n track: \"bg-primary-100/10 hover:bg-primary-100/20\",\n thumb: \"bg-primary-100\",\n text: \"text-primary-100\"\n },\n danger: {\n track: \"bg-tertiary-5 hover:bg-tertiary-5\",\n thumb: \"bg-tertiary-10\",\n text: \"text-tertiary-10\"\n }\n };\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled || isConfirmed) return;\n\n const thumbElement = thumbRef.current;\n const trackElement = buttonRef.current;\n if (!thumbElement || !trackElement) return;\n\n const maxSlide = trackElement.clientWidth - thumbElement.clientWidth;\n\n switch (e.key) {\n case \"ArrowRight\":\n case \"ArrowUp\":\n e.preventDefault();\n const newPosition = Math.min(\n maxSlide,\n slidePosition + maxSlide * 0.1\n );\n setSlidePosition(newPosition);\n\n if (newPosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n case \"ArrowLeft\":\n case \"ArrowDown\":\n e.preventDefault();\n setSlidePosition(Math.max(0, slidePosition - maxSlide * 0.1));\n break;\n case \"Home\":\n e.preventDefault();\n setSlidePosition(0);\n break;\n case \"End\":\n e.preventDefault();\n setSlidePosition(maxSlide);\n setIsConfirmed(true);\n onConfirm();\n break;\n case \"Enter\":\n case \" \":\n e.preventDefault();\n if (slidePosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n }\n },\n [disabled, isConfirmed, onConfirm, slidePosition]\n );\n\n const handleDragStart = React.useCallback(\n (e: React.MouseEvent | React.TouchEvent) => {\n if (disabled || isConfirmed) return;\n setIsDragging(true);\n // Prevent text selection during drag\n e.preventDefault();\n },\n [disabled, isConfirmed]\n );\n\n const handleDragMove = React.useCallback(\n (clientX: number) => {\n if (!isDragging || !buttonRef.current || !thumbRef.current) return;\n\n const buttonRect = buttonRef.current.getBoundingClientRect();\n const thumbRect = thumbRef.current.getBoundingClientRect();\n const maxSlide = buttonRect.width - thumbRect.width;\n\n const newPosition = Math.max(\n 0,\n Math.min(maxSlide, clientX - buttonRect.left - thumbRect.width / 2)\n );\n\n setSlidePosition(newPosition);\n\n // Check if slide is complete (e.g., 90% of the way)\n if (newPosition >= maxSlide * 0.9) {\n setIsDragging(false);\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n },\n [isDragging, onConfirm]\n );\n\n const handleMouseMove = React.useCallback(\n (e: MouseEvent) => {\n handleDragMove(e.clientX);\n },\n [handleDragMove]\n );\n\n const handleTouchMove = React.useCallback(\n (e: TouchEvent) => {\n handleDragMove(e.touches[0].clientX);\n },\n [handleDragMove]\n );\n\n const handleDragEnd = React.useCallback(() => {\n if (!isConfirmed) {\n setSlidePosition(0);\n }\n setIsDragging(false);\n }, [isConfirmed]);\n\n React.useEffect(() => {\n if (isDragging) {\n document.addEventListener(\"mousemove\", handleMouseMove);\n document.addEventListener(\"mouseup\", handleDragEnd);\n document.addEventListener(\"touchmove\", handleTouchMove);\n document.addEventListener(\"touchend\", handleDragEnd);\n }\n\n return () => {\n document.removeEventListener(\"mousemove\", handleMouseMove);\n document.removeEventListener(\"mouseup\", handleDragEnd);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n document.removeEventListener(\"touchend\", handleDragEnd);\n };\n }, [isDragging, handleMouseMove, handleTouchMove, handleDragEnd]);\n\n // Reset state when disabled prop changes\n React.useEffect(() => {\n if (disabled) {\n setSlidePosition(0);\n setIsConfirmed(false);\n setIsDragging(false);\n }\n }, [disabled]);\n\n const progressPercentage = React.useMemo(() => {\n if (!buttonRef.current || !thumbRef.current) return 0;\n const maxSlide =\n buttonRef.current.clientWidth - thumbRef.current.clientWidth;\n return Math.round((slidePosition / maxSlide) * 100);\n }, [slidePosition]);\n\n return (\n <div\n ref={ref}\n className={cn(\n \"relative h-12 rounded-full transition-colors\",\n variants[variant].track,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n <div\n ref={buttonRef}\n role=\"slider\"\n aria-label={ariaLabel || text}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progressPercentage}\n aria-valuetext={\n isConfirmed ? confirmText : `${progressPercentage}% complete`\n }\n aria-disabled={disabled}\n tabIndex={disabled ? -1 : 0}\n className=\"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-offset-2\"\n onKeyDown={handleKeyDown}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n >\n {/* Track text */}\n <div\n className=\"absolute inset-0 flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n (isDragging || isConfirmed) && \"opacity-0\"\n )}\n >\n {text}\n </Text>\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n !isConfirmed && \"opacity-0\"\n )}\n >\n {confirmText}\n </Text>\n </div>\n\n {/* Sliding thumb */}\n <div\n ref={thumbRef}\n className={cn(\n \"absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform\",\n variants[variant].thumb,\n disabled && \"cursor-not-allowed\",\n isFocused && \"ring-2 ring-white\"\n )}\n style={{\n transform: `translateX(${slidePosition}px)`\n }}\n onMouseDown={handleDragStart}\n onTouchStart={handleDragStart}\n aria-hidden=\"true\"\n >\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n </div>\n </div>\n </div>\n );\n }\n);\n\nSlideButton.displayName = \"SlideButton\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/SlideButton.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","SlideButton","e","text","confirmText","onConfirm","disabled","ariaLabel","isDragging","setIsDragging","slidePosition","setSlidePosition","isConfirmed","setIsConfirmed","buttonRef","thumbRef","isFocused","setIsFocused","handleKeyDown","thumbElement","trackElement","maxSlide","newPosition","handleDragStart","handleDragMove","clientX","buttonRect","thumbRect","handleMouseMove","handleTouchMove","handleDragEnd","progressPercentage"],"mappings":"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","file":"SlideButton.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\nimport { Breakpoint } from \"../utils/responsive\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type SlideButtonProps = {\n /** The text to display when not sliding */\n text: string;\n /** The text to display when sliding is complete */\n confirmText?: string;\n /** Callback fired when sliding is complete */\n onConfirm: () => void;\n /** Optional variant for different visual styles */\n variant?: \"primary\" | \"danger\";\n /** Optional className for custom styling */\n className?: string;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** Optional ARIA label */\n \"aria-label\"?: string;\n};\n\nexport const SlideButton = React.forwardRef<HTMLDivElement, SlideButtonProps>(\n (\n {\n text,\n confirmText = \"Confirmed!\",\n onConfirm,\n variant = \"primary\",\n className,\n disabled = false,\n \"aria-label\": ariaLabel,\n ...props\n },\n ref\n ) => {\n const [isDragging, setIsDragging] = React.useState(false);\n const [slidePosition, setSlidePosition] = React.useState(0);\n const [isConfirmed, setIsConfirmed] = React.useState(false);\n const buttonRef = React.useRef<HTMLDivElement>(null);\n const thumbRef = React.useRef<HTMLDivElement>(null);\n const [isFocused, setIsFocused] = React.useState(false);\n\n const variants = {\n primary: {\n track: \"bg-primary-100/10 hover:bg-primary-100/20\",\n thumb: \"bg-primary-100\",\n text: \"text-primary-100\"\n },\n danger: {\n track: \"bg-tertiary-5 hover:bg-tertiary-5\",\n thumb: \"bg-tertiary-10\",\n text: \"text-tertiary-10\"\n }\n };\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled || isConfirmed) return;\n\n const thumbElement = thumbRef.current;\n const trackElement = buttonRef.current;\n if (!thumbElement || !trackElement) return;\n\n const maxSlide = trackElement.clientWidth - thumbElement.clientWidth;\n\n switch (e.key) {\n case \"ArrowRight\":\n case \"ArrowUp\":\n e.preventDefault();\n const newPosition = Math.min(\n maxSlide,\n slidePosition + maxSlide * 0.1\n );\n setSlidePosition(newPosition);\n\n if (newPosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n case \"ArrowLeft\":\n case \"ArrowDown\":\n e.preventDefault();\n setSlidePosition(Math.max(0, slidePosition - maxSlide * 0.1));\n break;\n case \"Home\":\n e.preventDefault();\n setSlidePosition(0);\n break;\n case \"End\":\n e.preventDefault();\n setSlidePosition(maxSlide);\n setIsConfirmed(true);\n onConfirm();\n break;\n case \"Enter\":\n case \" \":\n e.preventDefault();\n if (slidePosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n }\n },\n [disabled, isConfirmed, onConfirm, slidePosition]\n );\n\n const handleDragStart = React.useCallback(\n (e: React.MouseEvent | React.TouchEvent) => {\n if (disabled || isConfirmed) return;\n setIsDragging(true);\n // Prevent text selection during drag\n e.preventDefault();\n },\n [disabled, isConfirmed]\n );\n\n const handleDragMove = React.useCallback(\n (clientX: number) => {\n if (!isDragging || !buttonRef.current || !thumbRef.current) return;\n\n const buttonRect = buttonRef.current.getBoundingClientRect();\n const thumbRect = thumbRef.current.getBoundingClientRect();\n const maxSlide = buttonRect.width - thumbRect.width;\n\n const newPosition = Math.max(\n 0,\n Math.min(maxSlide, clientX - buttonRect.left - thumbRect.width / 2)\n );\n\n setSlidePosition(newPosition);\n\n // Check if slide is complete (e.g., 90% of the way)\n if (newPosition >= maxSlide * 0.9) {\n setIsDragging(false);\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n },\n [isDragging, onConfirm]\n );\n\n const handleMouseMove = React.useCallback(\n (e: MouseEvent) => {\n handleDragMove(e.clientX);\n },\n [handleDragMove]\n );\n\n const handleTouchMove = React.useCallback(\n (e: TouchEvent) => {\n handleDragMove(e.touches[0].clientX);\n },\n [handleDragMove]\n );\n\n const handleDragEnd = React.useCallback(() => {\n if (!isConfirmed) {\n setSlidePosition(0);\n }\n setIsDragging(false);\n }, [isConfirmed]);\n\n React.useEffect(() => {\n if (isDragging) {\n document.addEventListener(\"mousemove\", handleMouseMove);\n document.addEventListener(\"mouseup\", handleDragEnd);\n document.addEventListener(\"touchmove\", handleTouchMove);\n document.addEventListener(\"touchend\", handleDragEnd);\n }\n\n return () => {\n document.removeEventListener(\"mousemove\", handleMouseMove);\n document.removeEventListener(\"mouseup\", handleDragEnd);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n document.removeEventListener(\"touchend\", handleDragEnd);\n };\n }, [isDragging, handleMouseMove, handleTouchMove, handleDragEnd]);\n\n // Reset state when disabled prop changes\n React.useEffect(() => {\n if (disabled) {\n setSlidePosition(0);\n setIsConfirmed(false);\n setIsDragging(false);\n }\n }, [disabled]);\n\n const progressPercentage = React.useMemo(() => {\n if (!buttonRef.current || !thumbRef.current) return 0;\n const maxSlide =\n buttonRef.current.clientWidth - thumbRef.current.clientWidth;\n return Math.round((slidePosition / maxSlide) * 100);\n }, [slidePosition]);\n\n return (\n <div\n ref={ref}\n className={cn(\n \"relative h-12 rounded-full transition-colors\",\n variants[variant].track,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n <div\n ref={buttonRef}\n role=\"slider\"\n aria-label={ariaLabel || text}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progressPercentage}\n aria-valuetext={\n isConfirmed ? confirmText : `${progressPercentage}% complete`\n }\n aria-disabled={disabled}\n tabIndex={disabled ? -1 : 0}\n className=\"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-offset-2\"\n onKeyDown={handleKeyDown}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n >\n {/* Track text */}\n <div\n className=\"absolute inset-0 flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n (isDragging || isConfirmed) && \"opacity-0\"\n )}\n >\n {text}\n </Text>\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n !isConfirmed && \"opacity-0\"\n )}\n >\n {confirmText}\n </Text>\n </div>\n\n {/* Sliding thumb */}\n <div\n ref={thumbRef}\n className={cn(\n \"absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform\",\n variants[variant].thumb,\n disabled && \"cursor-not-allowed\",\n isFocused && \"ring-2 ring-white\"\n )}\n style={{\n transform: `translateX(${slidePosition}px)`\n }}\n onMouseDown={handleDragStart}\n onTouchStart={handleDragStart}\n aria-hidden=\"true\"\n >\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n </div>\n </div>\n </div>\n );\n }\n);\n\nSlideButton.displayName = \"SlideButton\";\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/SlideButton.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","SlideButton","text","confirmText","onConfirm","disabled","ariaLabel","isDragging","setIsDragging","slidePosition","setSlidePosition","isConfirmed","setIsConfirmed","buttonRef","thumbRef","isFocused","setIsFocused","handleKeyDown","e","thumbElement","trackElement","maxSlide","newPosition","handleDragStart","handleDragMove","clientX","buttonRect","thumbRect","handleMouseMove","handleTouchMove","handleDragEnd","progressPercentage"],"mappings":"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","file":"SlideButton.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\nimport { Breakpoint } from \"../utils/responsive\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type SlideButtonProps = {\n /** The text to display when not sliding */\n text: string;\n /** The text to display when sliding is complete */\n confirmText?: string;\n /** Callback fired when sliding is complete */\n onConfirm: () => void;\n /** Optional variant for different visual styles */\n variant?: \"primary\" | \"danger\";\n /** Optional className for custom styling */\n className?: string;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** Optional ARIA label */\n \"aria-label\"?: string;\n};\n\nexport const SlideButton = React.forwardRef<HTMLDivElement, SlideButtonProps>(\n (\n {\n text,\n confirmText = \"Confirmed!\",\n onConfirm,\n variant = \"primary\",\n className,\n disabled = false,\n \"aria-label\": ariaLabel,\n ...props\n },\n ref\n ) => {\n const [isDragging, setIsDragging] = React.useState(false);\n const [slidePosition, setSlidePosition] = React.useState(0);\n const [isConfirmed, setIsConfirmed] = React.useState(false);\n const buttonRef = React.useRef<HTMLDivElement>(null);\n const thumbRef = React.useRef<HTMLDivElement>(null);\n const [isFocused, setIsFocused] = React.useState(false);\n\n const variants = {\n primary: {\n track: \"bg-primary-100/10 hover:bg-primary-100/20\",\n thumb: \"bg-primary-100\",\n text: \"text-primary-100\"\n },\n danger: {\n track: \"bg-tertiary-5 hover:bg-tertiary-5\",\n thumb: \"bg-tertiary-10\",\n text: \"text-tertiary-10\"\n }\n };\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled || isConfirmed) return;\n\n const thumbElement = thumbRef.current;\n const trackElement = buttonRef.current;\n if (!thumbElement || !trackElement) return;\n\n const maxSlide = trackElement.clientWidth - thumbElement.clientWidth;\n\n switch (e.key) {\n case \"ArrowRight\":\n case \"ArrowUp\":\n e.preventDefault();\n const newPosition = Math.min(\n maxSlide,\n slidePosition + maxSlide * 0.1\n );\n setSlidePosition(newPosition);\n\n if (newPosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n case \"ArrowLeft\":\n case \"ArrowDown\":\n e.preventDefault();\n setSlidePosition(Math.max(0, slidePosition - maxSlide * 0.1));\n break;\n case \"Home\":\n e.preventDefault();\n setSlidePosition(0);\n break;\n case \"End\":\n e.preventDefault();\n setSlidePosition(maxSlide);\n setIsConfirmed(true);\n onConfirm();\n break;\n case \"Enter\":\n case \" \":\n e.preventDefault();\n if (slidePosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n }\n },\n [disabled, isConfirmed, onConfirm, slidePosition]\n );\n\n const handleDragStart = React.useCallback(\n (e: React.MouseEvent | React.TouchEvent) => {\n if (disabled || isConfirmed) return;\n setIsDragging(true);\n // Prevent text selection during drag\n e.preventDefault();\n },\n [disabled, isConfirmed]\n );\n\n const handleDragMove = React.useCallback(\n (clientX: number) => {\n if (!isDragging || !buttonRef.current || !thumbRef.current) return;\n\n const buttonRect = buttonRef.current.getBoundingClientRect();\n const thumbRect = thumbRef.current.getBoundingClientRect();\n const maxSlide = buttonRect.width - thumbRect.width;\n\n const newPosition = Math.max(\n 0,\n Math.min(maxSlide, clientX - buttonRect.left - thumbRect.width / 2)\n );\n\n setSlidePosition(newPosition);\n\n // Check if slide is complete (e.g., 90% of the way)\n if (newPosition >= maxSlide * 0.9) {\n setIsDragging(false);\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n },\n [isDragging, onConfirm]\n );\n\n const handleMouseMove = React.useCallback(\n (e: MouseEvent) => {\n handleDragMove(e.clientX);\n },\n [handleDragMove]\n );\n\n const handleTouchMove = React.useCallback(\n (e: TouchEvent) => {\n handleDragMove(e.touches[0].clientX);\n },\n [handleDragMove]\n );\n\n const handleDragEnd = React.useCallback(() => {\n if (!isConfirmed) {\n setSlidePosition(0);\n }\n setIsDragging(false);\n }, [isConfirmed]);\n\n React.useEffect(() => {\n if (isDragging) {\n document.addEventListener(\"mousemove\", handleMouseMove);\n document.addEventListener(\"mouseup\", handleDragEnd);\n document.addEventListener(\"touchmove\", handleTouchMove);\n document.addEventListener(\"touchend\", handleDragEnd);\n }\n\n return () => {\n document.removeEventListener(\"mousemove\", handleMouseMove);\n document.removeEventListener(\"mouseup\", handleDragEnd);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n document.removeEventListener(\"touchend\", handleDragEnd);\n };\n }, [isDragging, handleMouseMove, handleTouchMove, handleDragEnd]);\n\n // Reset state when disabled prop changes\n React.useEffect(() => {\n if (disabled) {\n setSlidePosition(0);\n setIsConfirmed(false);\n setIsDragging(false);\n }\n }, [disabled]);\n\n const progressPercentage = React.useMemo(() => {\n if (!buttonRef.current || !thumbRef.current) return 0;\n const maxSlide =\n buttonRef.current.clientWidth - thumbRef.current.clientWidth;\n return Math.round((slidePosition / maxSlide) * 100);\n }, [slidePosition]);\n\n return (\n <div\n ref={ref}\n className={cn(\n \"relative h-12 rounded-full transition-colors\",\n variants[variant].track,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n <div\n ref={buttonRef}\n role=\"slider\"\n aria-label={ariaLabel || text}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progressPercentage}\n aria-valuetext={\n isConfirmed ? confirmText : `${progressPercentage}% complete`\n }\n aria-disabled={disabled}\n tabIndex={disabled ? -1 : 0}\n className=\"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-offset-2\"\n onKeyDown={handleKeyDown}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n >\n {/* Track text */}\n <div\n className=\"absolute inset-0 flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n (isDragging || isConfirmed) && \"opacity-0\"\n )}\n >\n {text}\n </Text>\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n !isConfirmed && \"opacity-0\"\n )}\n >\n {confirmText}\n </Text>\n </div>\n\n {/* Sliding thumb */}\n <div\n ref={thumbRef}\n className={cn(\n \"absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform\",\n variants[variant].thumb,\n disabled && \"cursor-not-allowed\",\n isFocused && \"ring-2 ring-white\"\n )}\n style={{\n transform: `translateX(${slidePosition}px)`\n }}\n onMouseDown={handleDragStart}\n onTouchStart={handleDragStart}\n aria-hidden=\"true\"\n >\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n </div>\n </div>\n </div>\n );\n }\n);\n\nSlideButton.displayName = \"SlideButton\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/SlideButton.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","SlideButton","text","confirmText","onConfirm","disabled","ariaLabel","isDragging","setIsDragging","slidePosition","setSlidePosition","isConfirmed","setIsConfirmed","buttonRef","thumbRef","isFocused","setIsFocused","handleKeyDown","e","thumbElement","trackElement","maxSlide","newPosition","handleDragStart","handleDragMove","clientX","buttonRect","thumbRect","handleMouseMove","handleTouchMove","handleDragEnd","progressPercentage"],"mappings":"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","file":"SlideButton.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\nimport { Breakpoint } from \"../utils/responsive\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles using Tailwind classes that reference CSS variables\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type SlideButtonProps = {\n /** The text to display when not sliding */\n text: string;\n /** The text to display when sliding is complete */\n confirmText?: string;\n /** Callback fired when sliding is complete */\n onConfirm: () => void;\n /** Optional variant for different visual styles */\n variant?: \"primary\" | \"danger\";\n /** Optional className for custom styling */\n className?: string;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** Optional ARIA label */\n \"aria-label\"?: string;\n};\n\nexport const SlideButton = React.forwardRef<HTMLDivElement, SlideButtonProps>(\n (\n {\n text,\n confirmText = \"Confirmed!\",\n onConfirm,\n variant = \"primary\",\n className,\n disabled = false,\n \"aria-label\": ariaLabel,\n ...props\n },\n ref\n ) => {\n const [isDragging, setIsDragging] = React.useState(false);\n const [slidePosition, setSlidePosition] = React.useState(0);\n const [isConfirmed, setIsConfirmed] = React.useState(false);\n const buttonRef = React.useRef<HTMLDivElement>(null);\n const thumbRef = React.useRef<HTMLDivElement>(null);\n const [isFocused, setIsFocused] = React.useState(false);\n\n const variants = {\n primary: {\n track: \"bg-primary-100/10 hover:bg-primary-100/20\",\n thumb: \"bg-primary-100\",\n text: \"text-primary-100\"\n },\n danger: {\n track: \"bg-tertiary-5 hover:bg-tertiary-5\",\n thumb: \"bg-tertiary-10\",\n text: \"text-tertiary-10\"\n }\n };\n\n const handleKeyDown = React.useCallback(\n (e: React.KeyboardEvent) => {\n if (disabled || isConfirmed) return;\n\n const thumbElement = thumbRef.current;\n const trackElement = buttonRef.current;\n if (!thumbElement || !trackElement) return;\n\n const maxSlide = trackElement.clientWidth - thumbElement.clientWidth;\n\n switch (e.key) {\n case \"ArrowRight\":\n case \"ArrowUp\":\n e.preventDefault();\n const newPosition = Math.min(\n maxSlide,\n slidePosition + maxSlide * 0.1\n );\n setSlidePosition(newPosition);\n\n if (newPosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n case \"ArrowLeft\":\n case \"ArrowDown\":\n e.preventDefault();\n setSlidePosition(Math.max(0, slidePosition - maxSlide * 0.1));\n break;\n case \"Home\":\n e.preventDefault();\n setSlidePosition(0);\n break;\n case \"End\":\n e.preventDefault();\n setSlidePosition(maxSlide);\n setIsConfirmed(true);\n onConfirm();\n break;\n case \"Enter\":\n case \" \":\n e.preventDefault();\n if (slidePosition >= maxSlide * 0.9) {\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n break;\n }\n },\n [disabled, isConfirmed, onConfirm, slidePosition]\n );\n\n const handleDragStart = React.useCallback(\n (e: React.MouseEvent | React.TouchEvent) => {\n if (disabled || isConfirmed) return;\n setIsDragging(true);\n // Prevent text selection during drag\n e.preventDefault();\n },\n [disabled, isConfirmed]\n );\n\n const handleDragMove = React.useCallback(\n (clientX: number) => {\n if (!isDragging || !buttonRef.current || !thumbRef.current) return;\n\n const buttonRect = buttonRef.current.getBoundingClientRect();\n const thumbRect = thumbRef.current.getBoundingClientRect();\n const maxSlide = buttonRect.width - thumbRect.width;\n\n const newPosition = Math.max(\n 0,\n Math.min(maxSlide, clientX - buttonRect.left - thumbRect.width / 2)\n );\n\n setSlidePosition(newPosition);\n\n // Check if slide is complete (e.g., 90% of the way)\n if (newPosition >= maxSlide * 0.9) {\n setIsDragging(false);\n setIsConfirmed(true);\n setSlidePosition(maxSlide);\n onConfirm();\n }\n },\n [isDragging, onConfirm]\n );\n\n const handleMouseMove = React.useCallback(\n (e: MouseEvent) => {\n handleDragMove(e.clientX);\n },\n [handleDragMove]\n );\n\n const handleTouchMove = React.useCallback(\n (e: TouchEvent) => {\n handleDragMove(e.touches[0].clientX);\n },\n [handleDragMove]\n );\n\n const handleDragEnd = React.useCallback(() => {\n if (!isConfirmed) {\n setSlidePosition(0);\n }\n setIsDragging(false);\n }, [isConfirmed]);\n\n React.useEffect(() => {\n if (isDragging) {\n document.addEventListener(\"mousemove\", handleMouseMove);\n document.addEventListener(\"mouseup\", handleDragEnd);\n document.addEventListener(\"touchmove\", handleTouchMove);\n document.addEventListener(\"touchend\", handleDragEnd);\n }\n\n return () => {\n document.removeEventListener(\"mousemove\", handleMouseMove);\n document.removeEventListener(\"mouseup\", handleDragEnd);\n document.removeEventListener(\"touchmove\", handleTouchMove);\n document.removeEventListener(\"touchend\", handleDragEnd);\n };\n }, [isDragging, handleMouseMove, handleTouchMove, handleDragEnd]);\n\n // Reset state when disabled prop changes\n React.useEffect(() => {\n if (disabled) {\n setSlidePosition(0);\n setIsConfirmed(false);\n setIsDragging(false);\n }\n }, [disabled]);\n\n const progressPercentage = React.useMemo(() => {\n if (!buttonRef.current || !thumbRef.current) return 0;\n const maxSlide =\n buttonRef.current.clientWidth - thumbRef.current.clientWidth;\n return Math.round((slidePosition / maxSlide) * 100);\n }, [slidePosition]);\n\n return (\n <div\n ref={ref}\n className={cn(\n \"relative h-12 rounded-full transition-colors\",\n variants[variant].track,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n <div\n ref={buttonRef}\n role=\"slider\"\n aria-label={ariaLabel || text}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progressPercentage}\n aria-valuetext={\n isConfirmed ? confirmText : `${progressPercentage}% complete`\n }\n aria-disabled={disabled}\n tabIndex={disabled ? -1 : 0}\n className=\"relative w-full h-full overflow-hidden rounded-full outline-none focus-visible:ring-2 focus-visible:ring-offset-2\"\n onKeyDown={handleKeyDown}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n >\n {/* Track text */}\n <div\n className=\"absolute inset-0 flex items-center justify-center\"\n aria-hidden=\"true\"\n >\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n (isDragging || isConfirmed) && \"opacity-0\"\n )}\n >\n {text}\n </Text>\n <Text\n variant=\"body-default-semibold\"\n className={cn(\n variants[variant].text,\n \"transition-opacity select-none\",\n !isConfirmed && \"opacity-0\"\n )}\n >\n {confirmText}\n </Text>\n </div>\n\n {/* Sliding thumb */}\n <div\n ref={thumbRef}\n className={cn(\n \"absolute top-1 bottom-1 left-1 w-10 rounded-full cursor-grab active:cursor-grabbing transition-transform\",\n variants[variant].thumb,\n disabled && \"cursor-not-allowed\",\n isFocused && \"ring-2 ring-white\"\n )}\n style={{\n transform: `translateX(${slidePosition}px)`\n }}\n onMouseDown={handleDragStart}\n onTouchStart={handleDragStart}\n aria-hidden=\"true\"\n >\n <div className=\"absolute inset-0 flex items-center justify-center\">\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13.5 10L8.5 15L7.5 14L11.5 10L7.5 6L8.5 5L13.5 10Z\"\n fill=\"white\"\n />\n </svg>\n </div>\n </div>\n </div>\n </div>\n );\n }\n);\n\nSlideButton.displayName = \"SlideButton\";\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var r=require('@radix-ui/react-slider'),e=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var r__namespace=/*#__PURE__*/_interopNamespace(r);var e__default=/*#__PURE__*/_interopDefault(e);function o(...i){return tailwindMerge.twMerge(clsx.clsx(i))}var s=e__default.default.forwardRef((i,l)=>e__default.default.createElement(r__namespace.Root,{ref:l,className:o("relative flex w-full touch-none select-none items-center"),...i},e__default.default.createElement(r__namespace.Track,{className:"relative h-[2px] w-full grow bg-stroke"},e__default.default.createElement(r__namespace.Range,{className:"absolute h-full bg-primary-100"})),e__default.default.createElement(r__namespace.Thumb,{className:"block h-4 w-4 rounded-full bg-
|
|
1
|
+
'use strict';var r=require('@radix-ui/react-slider'),e=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var r__namespace=/*#__PURE__*/_interopNamespace(r);var e__default=/*#__PURE__*/_interopDefault(e);function o(...i){return tailwindMerge.twMerge(clsx.clsx(i))}var s=e__default.default.forwardRef((i,l)=>e__default.default.createElement(r__namespace.Root,{ref:l,className:o("relative flex w-full touch-none select-none items-center"),...i},e__default.default.createElement(r__namespace.Track,{className:"relative h-[2px] w-full grow bg-stroke"},e__default.default.createElement(r__namespace.Range,{className:"absolute h-full bg-primary-100"})),e__default.default.createElement(r__namespace.Thumb,{className:"block h-4 w-4 rounded-full bg-background-0 border border-secondary focus:border-primary-100"})));s.displayName="Slider";exports.Slider=s;//# sourceMappingURL=Slider.cjs.map
|
|
2
2
|
//# sourceMappingURL=Slider.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Slider.tsx"],"names":["cn","inputs","twMerge","clsx","Slider","React","props","ref","r"],"mappings":"2lBAGO,SAASA,CAAAA,CAAAA,GAAMC,CAAsB,CAAA,CAC1C,OAAOC,qBAAAA,CAAQC,SAAKF,CAAAA,CAAM,CAAC,CAC7B,CCCaG,IAAAA,CAAAA,CAASC,kBAAM,CAAA,UAAA,CAG1B,CAACC,CAAAA,CAAOC,IAENF,kBAAA,CAAA,aAAA,CAAiBG,YAAhB,CAAA,IAAA,CAAA,CACC,GAAKD,CAAAA,CAAAA,CACL,SAAWP,CAAAA,CAAAA,CAAG,0DAA0D,CACvE,CAAA,GAAGM,CAEJD,CAAAA,CAAAA,kBAAAA,CAAA,aAAiB,CAAAG,YAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,0CAC/BH,kBAAA,CAAA,aAAA,CAAiBG,YAAhB,CAAA,KAAA,CAAA,CAAsB,SAAU,CAAA,gCAAA,CAAiC,CACpE,CAAA,CACAH,mBAAA,aAAiB,CAAAG,YAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Slider.tsx"],"names":["cn","inputs","twMerge","clsx","Slider","React","props","ref","r"],"mappings":"2lBAGO,SAASA,CAAAA,CAAAA,GAAMC,CAAsB,CAAA,CAC1C,OAAOC,qBAAAA,CAAQC,SAAKF,CAAAA,CAAM,CAAC,CAC7B,CCCaG,IAAAA,CAAAA,CAASC,kBAAM,CAAA,UAAA,CAG1B,CAACC,CAAAA,CAAOC,IAENF,kBAAA,CAAA,aAAA,CAAiBG,YAAhB,CAAA,IAAA,CAAA,CACC,GAAKD,CAAAA,CAAAA,CACL,SAAWP,CAAAA,CAAAA,CAAG,0DAA0D,CACvE,CAAA,GAAGM,CAEJD,CAAAA,CAAAA,kBAAAA,CAAA,aAAiB,CAAAG,YAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,0CAC/BH,kBAAA,CAAA,aAAA,CAAiBG,YAAhB,CAAA,KAAA,CAAA,CAAsB,SAAU,CAAA,gCAAA,CAAiC,CACpE,CAAA,CACAH,mBAAA,aAAiB,CAAAG,YAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,6FAA8F,CAAA,CACjI,CAEH,EAEDJ,EAAO,WAAc,CAAA,QAAA","file":"Slider.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import * as SliderPrimitive from \"@radix-ui/react-slider\";\nimport React from \"react\";\nimport { cn } from \"../utils\";\n\nexport type SliderProps = SliderPrimitive.SliderProps;\n\nexport const Slider = React.forwardRef<\n React.ElementRef<typeof SliderPrimitive.Root>,\n SliderProps\n>((props, ref) => {\n return (\n <SliderPrimitive.Root\n ref={ref}\n className={cn(\"relative flex w-full touch-none select-none items-center\")}\n {...props}\n >\n <SliderPrimitive.Track className=\"relative h-[2px] w-full grow bg-stroke\">\n <SliderPrimitive.Range className=\"absolute h-full bg-primary-100\" />\n </SliderPrimitive.Track>\n <SliderPrimitive.Thumb className=\"block h-4 w-4 rounded-full bg-background-0 border border-secondary focus:border-primary-100\" />\n </SliderPrimitive.Root>\n );\n});\n\nSlider.displayName = \"Slider\";\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as r from'@radix-ui/react-slider';import e from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';function o(...i){return twMerge(clsx(i))}var s=e.forwardRef((i,l)=>e.createElement(r.Root,{ref:l,className:o("relative flex w-full touch-none select-none items-center"),...i},e.createElement(r.Track,{className:"relative h-[2px] w-full grow bg-stroke"},e.createElement(r.Range,{className:"absolute h-full bg-primary-100"})),e.createElement(r.Thumb,{className:"block h-4 w-4 rounded-full bg-
|
|
1
|
+
import*as r from'@radix-ui/react-slider';import e from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';function o(...i){return twMerge(clsx(i))}var s=e.forwardRef((i,l)=>e.createElement(r.Root,{ref:l,className:o("relative flex w-full touch-none select-none items-center"),...i},e.createElement(r.Track,{className:"relative h-[2px] w-full grow bg-stroke"},e.createElement(r.Range,{className:"absolute h-full bg-primary-100"})),e.createElement(r.Thumb,{className:"block h-4 w-4 rounded-full bg-background-0 border border-secondary focus:border-primary-100"})));s.displayName="Slider";export{s as Slider};//# sourceMappingURL=Slider.js.map
|
|
2
2
|
//# sourceMappingURL=Slider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Slider.tsx"],"names":["cn","inputs","twMerge","clsx","Slider","React","props","ref"],"mappings":"2HAGO,SAASA,CAAAA,CAAAA,GAAMC,CAAsB,CAAA,CAC1C,OAAOC,OAAAA,CAAQC,IAAKF,CAAAA,CAAM,CAAC,CAC7B,CCCaG,IAAAA,CAAAA,CAASC,CAAM,CAAA,UAAA,CAG1B,CAACC,CAAAA,CAAOC,IAENF,CAAA,CAAA,aAAA,CAAiB,CAAhB,CAAA,IAAA,CAAA,CACC,GAAKE,CAAAA,CAAAA,CACL,SAAWP,CAAAA,CAAAA,CAAG,0DAA0D,CACvE,CAAA,GAAGM,CAEJD,CAAAA,CAAAA,CAAAA,CAAA,aAAiB,CAAA,CAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,0CAC/BA,CAAA,CAAA,aAAA,CAAiB,CAAhB,CAAA,KAAA,CAAA,CAAsB,SAAU,CAAA,gCAAA,CAAiC,CACpE,CAAA,CACAA,EAAA,aAAiB,CAAA,CAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Slider.tsx"],"names":["cn","inputs","twMerge","clsx","Slider","React","props","ref"],"mappings":"2HAGO,SAASA,CAAAA,CAAAA,GAAMC,CAAsB,CAAA,CAC1C,OAAOC,OAAAA,CAAQC,IAAKF,CAAAA,CAAM,CAAC,CAC7B,CCCaG,IAAAA,CAAAA,CAASC,CAAM,CAAA,UAAA,CAG1B,CAACC,CAAAA,CAAOC,IAENF,CAAA,CAAA,aAAA,CAAiB,CAAhB,CAAA,IAAA,CAAA,CACC,GAAKE,CAAAA,CAAAA,CACL,SAAWP,CAAAA,CAAAA,CAAG,0DAA0D,CACvE,CAAA,GAAGM,CAEJD,CAAAA,CAAAA,CAAAA,CAAA,aAAiB,CAAA,CAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,0CAC/BA,CAAA,CAAA,aAAA,CAAiB,CAAhB,CAAA,KAAA,CAAA,CAAsB,SAAU,CAAA,gCAAA,CAAiC,CACpE,CAAA,CACAA,EAAA,aAAiB,CAAA,CAAA,CAAA,KAAA,CAAhB,CAAsB,SAAA,CAAU,6FAA8F,CAAA,CACjI,CAEH,EAEDD,EAAO,WAAc,CAAA,QAAA","file":"Slider.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import * as SliderPrimitive from \"@radix-ui/react-slider\";\nimport React from \"react\";\nimport { cn } from \"../utils\";\n\nexport type SliderProps = SliderPrimitive.SliderProps;\n\nexport const Slider = React.forwardRef<\n React.ElementRef<typeof SliderPrimitive.Root>,\n SliderProps\n>((props, ref) => {\n return (\n <SliderPrimitive.Root\n ref={ref}\n className={cn(\"relative flex w-full touch-none select-none items-center\")}\n {...props}\n >\n <SliderPrimitive.Track className=\"relative h-[2px] w-full grow bg-stroke\">\n <SliderPrimitive.Range className=\"absolute h-full bg-primary-100\" />\n </SliderPrimitive.Track>\n <SliderPrimitive.Thumb className=\"block h-4 w-4 rounded-full bg-background-0 border border-secondary focus:border-primary-100\" />\n </SliderPrimitive.Root>\n );\n});\n\nSlider.displayName = \"Slider\";\n"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
'use strict';var
|
|
1
|
+
'use strict';var n=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),icons=require('@deckai/icons');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var n__default=/*#__PURE__*/_interopDefault(n);function a(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var E={sm:"h-4",md:"h-6",lg:"h-8"},P={sm:"w-20",md:"w-32",lg:"w-48"},b={sm:"w-8 h-8",md:"w-12 h-12",lg:"w-16 h-16"},g=n__default.default.forwardRef(({variant:e="text",size:t="md",lines:s=1,className:r,animate:p=true},m)=>{let o="bg-secondary-50 rounded-lg overflow-hidden",l=p?"animate-pulse":"",x=typeof t=="number"?(u=>({height:`${u}px`,width:e==="avatar"||e==="image"?`${u}px`:undefined}))(t):undefined,d=()=>{switch(e){case "text":return n__default.default.createElement("div",{className:"flex flex-col gap-2"},Array.from({length:s}).map((u,f)=>n__default.default.createElement("div",{key:f,style:x,className:a(o,l,typeof t=="string"?E[t]:undefined,f===s-1&&s>1?"w-3/4":"w-full",r)})));case "image":return n__default.default.createElement("div",{style:x,className:a(o,l,(!x||!r)&&"aspect-square w-full max-w-[300px]",r)});case "button":return n__default.default.createElement("div",{style:x,className:a(o,l,typeof t=="string"&&[E[t],P[t]],r)});case "card":return n__default.default.createElement("div",{className:a("flex flex-col gap-4 p-6 border border-stroke rounded-xl",r)},n__default.default.createElement("div",{className:a(o,l,"w-16 h-16 rounded-full")}),n__default.default.createElement("div",{className:"space-y-2"},n__default.default.createElement("div",{className:a(o,l,"h-6 w-3/4")}),n__default.default.createElement("div",{className:a(o,l,"h-4 w-1/2")})),n__default.default.createElement("div",{className:"space-y-2"},n__default.default.createElement("div",{className:a(o,l,"h-4 w-full")}),n__default.default.createElement("div",{className:a(o,l,"h-4 w-full")}),n__default.default.createElement("div",{className:a(o,l,"h-4 w-2/3")})));case "avatar":return n__default.default.createElement("div",{style:x,className:a(o,l,"rounded-full",{[b.sm]:t==="sm",[b.md]:t==="md",[b.lg]:t==="lg"},r)});default:return null}};return n__default.default.createElement("div",{ref:m,className:a("w-full",r)},d())});g.displayName="Fallback";var T={12:"h-[12px] w-[12px]",16:"h-[16px] w-[16px]",18:"h-[18px] w-[18px]",20:"h-[20px] w-[20px]",24:"h-[24px] w-[24px]",32:"h-[32px] w-[32px]",36:"h-[36px] w-[36px]",40:"h-[40px] w-[40px]",42:"h-[42px] w-[42px]",48:"h-[48px] w-[48px]",64:"h-[64px] w-[64px]",72:"h-[72px] w-[72px]"},L={sm:{12:"sm:h-[12px] sm:w-[12px]",16:"sm:h-[16px] sm:w-[16px]",18:"sm:h-[18px] sm:w-[18px]",20:"sm:h-[20px] sm:w-[20px]",24:"sm:h-[24px] sm:w-[24px]",32:"sm:h-[32px] sm:w-[32px]",36:"sm:h-[36px] sm:w-[36px]",40:"sm:h-[40px] sm:w-[40px]",42:"sm:h-[42px] sm:w-[42px]",48:"sm:h-[48px] sm:w-[48px]",64:"sm:h-[64px] sm:w-[64px]",72:"sm:h-[72px] sm:w-[72px]"},md:{12:"md:h-[12px] md:w-[12px]",16:"md:h-[16px] md:w-[16px]",18:"md:h-[18px] md:w-[18px]",20:"md:h-[20px] md:w-[20px]",24:"md:h-[24px] md:w-[24px]",32:"md:h-[32px] md:w-[32px]",36:"md:h-[36px] md:w-[36px]",40:"md:h-[40px] md:w-[40px]",42:"md:h-[42px] md:w-[42px]",48:"md:h-[48px] md:w-[48px]",64:"md:h-[64px] md:w-[64px]",72:"md:h-[72px] md:w-[72px]"},lg:{12:"lg:h-[12px] lg:w-[12px]",16:"lg:h-[16px] lg:w-[16px]",18:"lg:h-[18px] lg:w-[18px]",20:"lg:h-[20px] lg:w-[20px]",24:"lg:h-[24px] lg:w-[24px]",32:"lg:h-[32px] lg:w-[32px]",36:"lg:h-[36px] lg:w-[36px]",40:"lg:h-[40px] lg:w-[40px]",42:"lg:h-[42px] lg:w-[42px]",48:"lg:h-[48px] lg:w-[48px]",64:"lg:h-[64px] lg:w-[64px]",72:"lg:h-[72px] lg:w-[72px]"},xl:{12:"xl:h-[12px] xl:w-[12px]",16:"xl:h-[16px] xl:w-[16px]",18:"xl:h-[18px] xl:w-[18px]",20:"xl:h-[20px] xl:w-[20px]",24:"xl:h-[24px] xl:w-[24px]",32:"xl:h-[32px] xl:w-[32px]",36:"xl:h-[36px] xl:w-[36px]",40:"xl:h-[40px] xl:w-[40px]",42:"xl:h-[42px] xl:w-[42px]",48:"xl:h-[48px] xl:w-[48px]",64:"xl:h-[64px] xl:w-[64px]",72:"xl:h-[72px] xl:w-[72px]"},"2xl":{12:"2xl:h-[12px] 2xl:w-[12px]",16:"2xl:h-[16px] 2xl:w-[16px]",18:"2xl:h-[18px] 2xl:w-[18px]",20:"2xl:h-[20px] 2xl:w-[20px]",24:"2xl:h-[24px] 2xl:w-[24px]",32:"2xl:h-[32px] 2xl:w-[32px]",36:"2xl:h-[36px] 2xl:w-[36px]",40:"2xl:h-[40px] 2xl:w-[40px]",42:"2xl:h-[42px] 2xl:w-[42px]",48:"2xl:h-[48px] 2xl:w-[48px]",64:"2xl:h-[64px] 2xl:w-[64px]",72:"2xl:h-[72px] 2xl:w-[72px]"}},y=e=>String(e),$=(e,t=24)=>{let s=[],r={};if(e===undefined){let p=y(t);p?s.push(T[p]):(r.height=`${t}px`,r.width=`${t}px`);}if(typeof e=="number"){let p=y(e);p?s.push(T[p]):(r.height=`${e}px`,r.width=`${e}px`);}if(Array.isArray(e)){let p=y(t),m=[p&&T[p]||`h-[${t}px] w-[${t}px]`];e.forEach(o=>{if(typeof o=="string"){let[l,h]=o.split(":"),x=parseInt(h,10),d=y(x);s.push(d&&L[l]?.[d]||`${l}:h-[${x}px] ${l}:w-[${x}px]`);}}),s.push(...m);}if(typeof e=="string"){let[p,m]=e.split(":"),o=parseInt(m,10),l=y(o);s.push(l&&L[p]?.[l]||`${p}:h-[${o}px] ${p}:w-[${o}px]`);}return {responsiveSizeClasses:s.join(" "),responsiveSizeStyles:r}};var S={primary:"var(--color-primary)",secondary:"var(--color-secondary)",white:"var(--color-white)",primaryBlue:"var(--color-primary-100)",disabled:"var(--color-disabled)",danger:"var(--color-danger)"},c=n__default.default.forwardRef(({name:e,size:t=24,color:s="primary",title:r,className:p,style:m={},...o},l)=>{let h=icons.IconMap[e],{responsiveSizeClasses:x,responsiveSizeStyles:d}=$(t,24);return n__default.default.createElement("div",{className:a("flex justify-center items-center",x,p),style:{"--icon-stroke":S[s],...d,...m}},n__default.default.createElement(h,{ref:l,"aria-hidden":!r,"aria-label":r,stroke:e.includes("filled")?undefined:S[s],...o}))});c.displayName="Icon";var k="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100";var M=n__default.default.forwardRef(({children:e,type:t="button",className:s,disabled:r,...p},m)=>n__default.default.createElement("button",{ref:m,type:t,disabled:r,className:a("appearance-none hover:opacity-80 transition-all active:scale-95",k,r&&"opacity-50 cursor-not-allowed",s),...p},e));M.displayName="Pressable";var I={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},R=e=>{let[t,s]=e.split("-");return t==="heading"?I[s]||"p":t==="label"?"label":"p"},B={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},K=e=>e?(Array.isArray(e)?e:[e]).map(s=>{if(s.includes(":")){let[r,p]=s.split(":");return `${r}:text-${p}`}return `text-${s}`}).join(" "):"text-body-default",w=n__default.default.forwardRef(({variant:e="body-default",color:t="primary",as:s,className:r,children:p,weight:m,...o},l)=>{let h=K(e),x=t==="inherit"?"text-inherit":`text-${t}`,d=n__default.default.useMemo(()=>{let f=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return R(f)},[e]);return n__default.default.createElement(s||d,{ref:l,className:`
|
|
2
2
|
font-sans antialiased
|
|
3
|
-
${
|
|
3
|
+
${h}
|
|
4
4
|
${x}
|
|
5
|
-
${
|
|
5
|
+
${m&&`!${B[m]}`}
|
|
6
6
|
${r}
|
|
7
|
-
`,...
|
|
7
|
+
`,...o},p)});w.displayName="Text";var he=({icon:e,followers:t,engagement:s,isLoading:r,...p})=>r?n__default.default.createElement("div",{className:"sm:w-max w-full"},n__default.default.createElement("div",{className:"flex sm:flex-row flex-col items-center sm:gap-4 gap-1 sm:px-6 sm:py-4 p-2 border border-stroke rounded-lg"},n__default.default.createElement("div",{className:"w-8 h-8"},n__default.default.createElement(g,{variant:"image",className:"w-full h-full rounded"})),n__default.default.createElement("div",{className:"flex sm:flex-row flex-col items-center gap-4"},n__default.default.createElement("div",{className:"flex items-center gap-1"},n__default.default.createElement(c,{name:"profile",size:["sm:20",16],color:"secondary"}),n__default.default.createElement(g,{variant:"text",size:"sm",className:"w-12"})),n__default.default.createElement("div",{className:"flex items-center gap-1"},n__default.default.createElement(c,{name:"like-1",size:["sm:20",16],color:"secondary"}),n__default.default.createElement(g,{variant:"text",size:"sm",className:"w-12"}))))):n__default.default.createElement(M,{className:"sm:w-max w-full hover:bg-secondary-400 rounded-lg",...p},n__default.default.createElement("div",{className:"flex sm:flex-row flex-col items-center sm:gap-4 gap-1 sm:px-6 sm:py-4 p-2 border border-stroke rounded-lg"},n__default.default.createElement(c,{name:e,size:["lg:40",32],color:"primaryBlue"}),t&&n__default.default.createElement("div",{className:"flex items-center"},n__default.default.createElement(c,{name:"profile",size:["sm:20",16]}),n__default.default.createElement(w,{variant:["body-default-medium","md:body-xs-medium"]},t)),s&&n__default.default.createElement("div",{className:"flex items-center"},n__default.default.createElement(c,{name:"like-1",size:["sm:20",16]}),n__default.default.createElement(w,{variant:["body-default-medium","md:body-xs-medium"]},s))));exports.SocialCard=he;//# sourceMappingURL=SocialCard.cjs.map
|
|
8
8
|
//# sourceMappingURL=SocialCard.cjs.map
|