{"version":3,"sources":["../src/components/Progress/Progress.css"],"sourcesContent":["/*\n * Progress Indicator Animations\n * Material Design 3 motion tokens for indeterminate and wavy progress states.\n *\n * Keyframes are defined here (co-located with the component) per project\n * convention — they are NOT added to the global tokens.css.\n *\n * All timing values reference MD3 motion token CSS custom properties.\n * Hardcoded durations are forbidden — use the token vars below.\n *\n * Motion tokens referenced (from packages/tokens/src/tokens.css):\n *   --md-sys-motion-duration-long2          : 500ms  (linear indeterminate cycle)\n *   --md-sys-motion-duration-long4          : 600ms  (circular indeterminate rotation)\n *   --md-sys-motion-duration-extra-long4    : 1000ms (wave horizontal translation)\n *   --md-sys-motion-easing-standard         : cubic-bezier(0.2, 0, 0, 1)\n */\n\n/* ---------------------------------------------------------------------------\n   LINEAR INDETERMINATE\n   Two-segment bar animation per MD3 spec.\n   First segment: starts narrow at left, expands, then slides off right.\n   Second segment: follows the first with a short delay.\n   Duration: long2 = 500ms per cycle (repeating).\n   --------------------------------------------------------------------------- */\n\n@keyframes progress-linear-indeterminate-1 {\n  0% {\n    left: -35%;\n    right: 100%;\n  }\n  60% {\n    left: 100%;\n    right: -90%;\n  }\n  100% {\n    left: 100%;\n    right: -90%;\n  }\n}\n\n@keyframes progress-linear-indeterminate-2 {\n  0% {\n    left: -200%;\n    right: 100%;\n  }\n  60% {\n    left: 107%;\n    right: -8%;\n  }\n  100% {\n    left: 107%;\n    right: -8%;\n  }\n}\n\n/* ---------------------------------------------------------------------------\n   CIRCULAR INDETERMINATE\n   Two-part animation per MD3 spec:\n   1. Container rotation: continuous 360° spin.\n   2. Dash animation: stroke-dasharray pulses between a short and long arc.\n   Rotation duration: long4 = 600ms per cycle (repeating).\n   --------------------------------------------------------------------------- */\n\n@keyframes progress-circular-rotate {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes progress-circular-dash {\n  0% {\n    stroke-dasharray: 1, 200;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 89, 200;\n    stroke-dashoffset: -35px;\n  }\n  100% {\n    stroke-dasharray: 89, 200;\n    stroke-dashoffset: -124px;\n  }\n}\n\n/* ---------------------------------------------------------------------------\n   WAVY TRANSLATION\n   Horizontal wave motion: the wavy path translates one full wavelength so\n   the wave appears to flow continuously.\n   Duration: extra-long4 = 1000ms per cycle (repeating).\n   --------------------------------------------------------------------------- */\n\n@keyframes progress-wave-translate {\n  0% {\n    transform: translateX(0);\n  }\n  100% {\n    /* Translate exactly one wavelength. The wavelength is baked into the SVG\n       path so the visual loop is seamless. The actual translate distance is\n       set via --progress-wave-wavelength CSS custom property on the element. */\n    transform: translateX(var(--progress-wave-wavelength, -40px));\n  }\n}\n\n/* ---------------------------------------------------------------------------\n   TAILWIND @theme INTEGRATION\n   Register animations so they can be used as Tailwind utilities.\n   --------------------------------------------------------------------------- */\n\n@theme {\n  --animate-progress-linear-indeterminate-1: progress-linear-indeterminate-1\n    var(--md-sys-motion-duration-long2) var(--md-sys-motion-easing-standard) infinite;\n\n  --animate-progress-linear-indeterminate-2: progress-linear-indeterminate-2\n    var(--md-sys-motion-duration-long2) var(--md-sys-motion-easing-standard) infinite;\n\n  --animate-progress-circular-rotate: progress-circular-rotate var(--md-sys-motion-duration-long4)\n    linear infinite;\n\n  --animate-progress-circular-dash: progress-circular-dash var(--md-sys-motion-duration-long4)\n    var(--md-sys-motion-easing-standard) infinite;\n\n  --animate-progress-wave-translate: progress-wave-translate\n    var(--md-sys-motion-duration-extra-long4) linear infinite;\n}\n"],"mappings":";AAyBA,WAAW;AACT;AACE,UAAM;AACN,WAAO;AACT;AACA;AACE,UAAM;AACN,WAAO;AACT;AACA;AACE,UAAM;AACN,WAAO;AACT;AACF;AAEA,WAAW;AACT;AACE,UAAM;AACN,WAAO;AACT;AACA;AACE,UAAM;AACN,WAAO;AACT;AACA;AACE,UAAM;AACN,WAAO;AACT;AACF;AAUA,WAAW;AACT;AACE,eAAW,OAAO;AACpB;AACA;AACE,eAAW,OAAO;AACpB;AACF;AAEA,WAAW;AACT;AACE,sBAAkB,CAAC,EAAE;AACrB,uBAAmB;AACrB;AACA;AACE,sBAAkB,EAAE,EAAE;AACtB,uBAAmB;AACrB;AACA;AACE,sBAAkB,EAAE,EAAE;AACtB,uBAAmB;AACrB;AACF;AASA,WAAW;AACT;AACE,eAAW,WAAW;AACxB;AACA;AAIE,eAAW,WAAW,IAAI,0BAA0B,EAAE;AACxD;AACF;AAOA,OAAO,EACL,yCAAyC,EAAE,gCACzC,IAAI,gCAAgC,IAAI,iCAAiC,QAAQ,EAEnF,yCAAyC,EAAE,gCACzC,IAAI,gCAAgC,IAAI,iCAAiC,QAAQ,EAEnF,kCAAkC,EAAE,yBAAyB,IAAI,gCAC/D,OAAO,QAAQ,EAEjB,gCAAgC,EAAE,uBAAuB,IAAI,gCAC3D,IAAI,iCAAiC,QAAQ,EAE/C,iCAAiC,EAAE,wBACjC,IAAI,sCAAsC,OAAO,QAAQ;","names":[]}