@mantine/core/cjs/components/Transition/transitions.cjs.map

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"transitions.cjs","names":[],"sources":["../../../src/components/Transition/transitions.ts"],"sourcesContent":["export interface MantineTransitionStyles {\n  common?: React.CSSProperties;\n  in: React.CSSProperties;\n  out: React.CSSProperties;\n  transitionProperty: React.CSSProperties['transitionProperty'];\n}\n\nexport type MantineTransitionName =\n  | 'fade'\n  | 'fade-down'\n  | 'fade-up'\n  | 'fade-left'\n  | 'fade-right'\n  | 'skew-up'\n  | 'skew-down'\n  | 'rotate-right'\n  | 'rotate-left'\n  | 'slide-down'\n  | 'slide-up'\n  | 'slide-right'\n  | 'slide-left'\n  | 'scale-y'\n  | 'scale-x'\n  | 'scale'\n  | 'pop'\n  | 'pop-top-left'\n  | 'pop-top-right'\n  | 'pop-bottom-left'\n  | 'pop-bottom-right';\n\nexport type MantineTransition = MantineTransitionName | MantineTransitionStyles;\n\nconst popIn = (from: 'top' | 'bottom') => ({\n  in: { opacity: 1, transform: 'scale(1)' },\n  out: { opacity: 0, transform: `scale(.9) translateY(${from === 'bottom' ? 10 : -10}px)` },\n  transitionProperty: 'transform, opacity',\n});\n\nexport const transitions: Record<MantineTransitionName, MantineTransitionStyles> = {\n  fade: {\n    in: { opacity: 1 },\n    out: { opacity: 0 },\n    transitionProperty: 'opacity',\n  },\n\n  'fade-up': {\n    in: { opacity: 1, transform: 'translateY(0)' },\n    out: { opacity: 0, transform: 'translateY(30px)' },\n    transitionProperty: 'opacity, transform',\n  },\n\n  'fade-down': {\n    in: { opacity: 1, transform: 'translateY(0)' },\n    out: { opacity: 0, transform: 'translateY(-30px)' },\n    transitionProperty: 'opacity, transform',\n  },\n\n  'fade-left': {\n    in: { opacity: 1, transform: 'translateX(0)' },\n    out: { opacity: 0, transform: 'translateX(30px)' },\n    transitionProperty: 'opacity, transform',\n  },\n\n  'fade-right': {\n    in: { opacity: 1, transform: 'translateX(0)' },\n    out: { opacity: 0, transform: 'translateX(-30px)' },\n    transitionProperty: 'opacity, transform',\n  },\n\n  scale: {\n    in: { opacity: 1, transform: 'scale(1)' },\n    out: { opacity: 0, transform: 'scale(0)' },\n    common: { transformOrigin: 'top' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'scale-y': {\n    in: { opacity: 1, transform: 'scaleY(1)' },\n    out: { opacity: 0, transform: 'scaleY(0)' },\n    common: { transformOrigin: 'top' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'scale-x': {\n    in: { opacity: 1, transform: 'scaleX(1)' },\n    out: { opacity: 0, transform: 'scaleX(0)' },\n    common: { transformOrigin: 'left' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'skew-up': {\n    in: { opacity: 1, transform: 'translateY(0) skew(0deg, 0deg)' },\n    out: { opacity: 0, transform: 'translateY(-20px) skew(-10deg, -5deg)' },\n    common: { transformOrigin: 'top' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'skew-down': {\n    in: { opacity: 1, transform: 'translateY(0) skew(0deg, 0deg)' },\n    out: { opacity: 0, transform: 'translateY(20px) skew(-10deg, -5deg)' },\n    common: { transformOrigin: 'bottom' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'rotate-left': {\n    in: { opacity: 1, transform: 'translateY(0) rotate(0deg)' },\n    out: { opacity: 0, transform: 'translateY(20px) rotate(-5deg)' },\n    common: { transformOrigin: 'bottom' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'rotate-right': {\n    in: { opacity: 1, transform: 'translateY(0) rotate(0deg)' },\n    out: { opacity: 0, transform: 'translateY(20px) rotate(5deg)' },\n    common: { transformOrigin: 'top' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'slide-down': {\n    in: { opacity: 1, transform: 'translateY(0)' },\n    out: { opacity: 0, transform: 'translateY(-100%)' },\n    common: { transformOrigin: 'top' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'slide-up': {\n    in: { opacity: 1, transform: 'translateY(0)' },\n    out: { opacity: 0, transform: 'translateY(100%)' },\n    common: { transformOrigin: 'bottom' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'slide-left': {\n    in: { opacity: 1, transform: 'translateX(0)' },\n    out: { opacity: 0, transform: 'translateX(100%)' },\n    common: { transformOrigin: 'left' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  'slide-right': {\n    in: { opacity: 1, transform: 'translateX(0)' },\n    out: { opacity: 0, transform: 'translateX(-100%)' },\n    common: { transformOrigin: 'right' },\n    transitionProperty: 'transform, opacity',\n  },\n\n  pop: {\n    ...popIn('bottom'),\n    common: { transformOrigin: 'center center' },\n  },\n\n  'pop-bottom-left': {\n    ...popIn('bottom'),\n    common: { transformOrigin: 'bottom left' },\n  },\n\n  'pop-bottom-right': {\n    ...popIn('bottom'),\n    common: { transformOrigin: 'bottom right' },\n  },\n\n  'pop-top-left': {\n    ...popIn('top'),\n    common: { transformOrigin: 'top left' },\n  },\n\n  'pop-top-right': {\n    ...popIn('top'),\n    common: { transformOrigin: 'top right' },\n  },\n};\n"],"mappings":"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"}