@lobehub/ui/es/base-ui/focusRing.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"focusRing.mjs","names":[],"sources":["../../src/base-ui/focusRing.ts"],"sourcesContent":["import { css, cssVar, keyframes } from 'antd-style';\n\nconst tint = (color: string, alpha: number) =>\n  `color-mix(in srgb, ${color} ${alpha}%, transparent)`;\n\nconst glow = (color: string, scale = 1) =>\n  `0 0 0 ${3 * scale}px ${tint(color, 70)}, 0 0 ${5 * scale}px ${4 * scale}px ${tint(color, 35)}`;\n\nconst ringIn = (color: string) => keyframes`\n  from {\n    box-shadow: ${glow(color, 2.5)};\n  }\n`;\n\nconst ring = (color: string) => css`\n  &:focus-visible {\n    outline: none;\n    box-shadow: ${glow(color)};\n    animation: ${ringIn(color)} 560ms cubic-bezier(0.32, 0.72, 0, 1);\n\n    @media (prefers-reduced-motion: reduce) {\n      animation: none;\n    }\n\n    @media (forced-colors: active) {\n      outline: 2px solid CanvasText;\n      animation: none;\n    }\n  }\n`;\n\nexport const focusRing = ring(cssVar.colorInfo);\n\nexport const focusRingColor = ring;\n"],"mappings":";;AAEA,MAAM,QAAQ,OAAe,UAC3B,sBAAsB,MAAM,GAAG,MAAM;AAEvC,MAAM,QAAQ,OAAe,QAAQ,MACnC,SAAS,IAAI,MAAM,KAAK,KAAK,OAAO,EAAE,EAAE,QAAQ,IAAI,MAAM,KAAK,IAAI,MAAM,KAAK,KAAK,OAAO,EAAE;AAE9F,MAAM,UAAU,UAAkB,SAAS;;kBAEzB,KAAK,OAAO,GAAG,EAAE;;;AAInC,MAAM,QAAQ,UAAkB,GAAG;;;kBAGjB,KAAK,KAAK,EAAE;iBACb,OAAO,KAAK,EAAE;;;;;;;;;;;;AAa/B,MAAa,YAAY,KAAK,OAAO,SAAS;AAE9C,MAAa,iBAAiB"}