// #region Imports
import { animation } from '../animation';
// #endregion
// -----------------------------------------------------------------------
// Elastic Snap presets - TypeScript equivalents of all Joy theme
// @keyframes animations. Asymmetric timing: slow tension build
// (55-65%), fast snap to rest (18-25%), dead time / settle (15-20%).
// One overshoot max. Material decelerate easing.
// Use the AnimationView playground to preview.
// -----------------------------------------------------------------------
/**
 * Material Decelerate easing - used by all Elastic Snap presets.
 *
 * @internal
 */
const ELASTIC_EASING = 'cubic-bezier(0.4, 0, 0.2, 1)';
// -----------------------------------------------------------------------
// 1. Elastic Enter - element appears with tension build → snap to final
// -----------------------------------------------------------------------
/**
 * Elastic enter - element scales in with slow tension build then fast
 * snap to rest. One slight overshoot, then settle.
 */
const elasticEnter = animation([
    {
        offset: 0,
        transform: 'scale(0.2)',
        opacity: '0'
    },
    {
        offset: 0.12,
        transform: 'scale(0.35)',
        opacity: '0.6'
    },
    {
        offset: 0.25,
        transform: 'scale(0.55)',
        opacity: '0.85'
    },
    {
        offset: 0.40,
        transform: 'scale(0.75)',
        opacity: '0.95'
    },
    {
        offset: 0.55,
        transform: 'scale(0.90)',
        opacity: '1'
    },
    {
        offset: 0.65,
        transform: 'scale(1.06)'
    },
    {
        offset: 0.75,
        transform: 'scale(0.98)'
    },
    {
        offset: 0.85,
        transform: 'scale(1)'
    },
    {
        offset: 1,
        transform: 'scale(1)',
        opacity: '1'
    }
], {
    duration: 600,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 2. Elastic Exit - element scales out with tension → snap away
// -----------------------------------------------------------------------
/**
 * Elastic exit - slow scale-up tension then fast snap to invisible.
 */
const elasticExit = animation([
    {
        offset: 0,
        transform: 'scale(1)',
        opacity: '1'
    },
    {
        offset: 0.15,
        transform: 'scale(1.04)',
        opacity: '1'
    },
    {
        offset: 0.35,
        transform: 'scale(1.10)',
        opacity: '0.9'
    },
    {
        offset: 0.55,
        transform: 'scale(1.12)',
        opacity: '0.8'
    },
    {
        offset: 0.68,
        transform: 'scale(0.6)',
        opacity: '0.3'
    },
    {
        offset: 0.78,
        transform: 'scale(0.2)',
        opacity: '0'
    },
    {
        offset: 1,
        transform: 'scale(0.2)',
        opacity: '0'
    }
], {
    duration: 600,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 3. Elastic Toggle - switch/knob snap-back from deformed state
// -----------------------------------------------------------------------
/**
 * Elastic toggle - starts at peak deformation, fast snap to rest,
 * one tiny overshoot. Mirrors: `elastic-switch-snap` (CheckmarkElement).
 */
const elasticToggle = animation([
    {
        offset: 0,
        transform: 'scaleX(1.30) scaleY(0.78)'
    },
    {
        offset: 0.20,
        transform: 'scaleX(1.05) scaleY(0.96)'
    },
    {
        offset: 0.35,
        transform: 'scaleX(0.97) scaleY(1.02)'
    },
    {
        offset: 0.50,
        transform: 'scaleX(1.01) scaleY(0.99)'
    },
    {
        offset: 0.65,
        transform: 'scale(1)'
    },
    {
        offset: 1,
        transform: 'scale(1)'
    }
], {
    duration: 600,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 4. Elastic Press - tactile :active feedback with tension
// -----------------------------------------------------------------------
/**
 * Elastic press - slow stretch then fast snap back.
 */
const elasticPress = animation([
    {
        offset: 0,
        transform: 'scale(1)'
    },
    {
        offset: 0.15,
        transform: 'scaleX(1.08) scaleY(0.94)'
    },
    {
        offset: 0.35,
        transform: 'scaleX(1.18) scaleY(0.86)'
    },
    {
        offset: 0.55,
        transform: 'scaleX(1.22) scaleY(0.83)'
    },
    {
        offset: 0.68,
        transform: 'scaleX(1.02) scaleY(0.99)'
    },
    {
        offset: 0.78,
        transform: 'scaleX(0.98) scaleY(1.01)'
    },
    {
        offset: 0.88,
        transform: 'scale(1)'
    },
    {
        offset: 1,
        transform: 'scale(1)'
    }
], {
    duration: 200,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
/**
 * Elastic press vertical - slow vertical stretch then fast snap back.
 */
const elasticPressVertical = animation([
    {
        offset: 0,
        transform: 'scale(1)'
    },
    {
        offset: 0.15,
        transform: 'scaleX(0.94) scaleY(1.08)'
    },
    {
        offset: 0.35,
        transform: 'scaleX(0.86) scaleY(1.18)'
    },
    {
        offset: 0.55,
        transform: 'scaleX(0.83) scaleY(1.22)'
    },
    {
        offset: 0.68,
        transform: 'scaleX(0.99) scaleY(1.02)'
    },
    {
        offset: 0.78,
        transform: 'scaleX(1.01) scaleY(0.98)'
    },
    {
        offset: 0.88,
        transform: 'scale(1)'
    },
    {
        offset: 1,
        transform: 'scale(1)'
    }
], {
    duration: 200,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 5. Elastic Digit Up/Down - per-digit counter with tension
// -----------------------------------------------------------------------
/**
 * Elastic digit up - slow stretch tall (tension), fast snap back.
 * Mirrors: `elastic-digit-up` (NumberCounterElement).
 */
const elasticDigitUp = animation([
    {
        offset: 0,
        transform: 'scaleX(1) scaleY(1)'
    },
    {
        offset: 0.15,
        transform: 'scaleX(0.92) scaleY(1.08)'
    },
    {
        offset: 0.30,
        transform: 'scaleX(0.85) scaleY(1.18)'
    },
    {
        offset: 0.45,
        transform: 'scaleX(0.80) scaleY(1.25)'
    },
    {
        offset: 0.55,
        transform: 'scaleX(0.95) scaleY(1.05)'
    },
    {
        offset: 0.65,
        transform: 'scaleX(1.02) scaleY(0.98)'
    },
    {
        offset: 0.78,
        transform: 'scaleX(1) scaleY(1)'
    },
    {
        offset: 1,
        transform: 'scaleX(1) scaleY(1)'
    }
], {
    duration: 200,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
/**
 * Elastic digit down - slow stretch wide (tension), fast snap back.
 * Mirrors: `elastic-digit-down` (NumberCounterElement).
 */
const elasticDigitDown = animation([
    {
        offset: 0,
        transform: 'scaleX(1) scaleY(1)'
    },
    {
        offset: 0.15,
        transform: 'scaleX(1.08) scaleY(0.92)'
    },
    {
        offset: 0.30,
        transform: 'scaleX(1.18) scaleY(0.85)'
    },
    {
        offset: 0.45,
        transform: 'scaleX(1.25) scaleY(0.80)'
    },
    {
        offset: 0.55,
        transform: 'scaleX(1.05) scaleY(0.95)'
    },
    {
        offset: 0.65,
        transform: 'scaleX(0.98) scaleY(1.02)'
    },
    {
        offset: 0.78,
        transform: 'scaleX(1) scaleY(1)'
    },
    {
        offset: 1,
        transform: 'scaleX(1) scaleY(1)'
    }
], {
    duration: 200,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 6. Elastic Sweep - indeterminate progress bar
// -----------------------------------------------------------------------
/**
 * Elastic sweep - fill stretches wide as it enters (slow tension),
 * snaps narrow as it exits (fast snap), then dead time.
 * Mirrors: `elastic-indeterminate` (ProgressBarElement).
 */
const elasticSweep = animation([
    {
        offset: 0,
        transform: 'translateX(-100%) scaleX(0.02)'
    },
    {
        offset: 0.08,
        transform: 'translateX(-72%) scaleX(0.08)'
    },
    {
        offset: 0.16,
        transform: 'translateX(-38%) scaleX(0.22)'
    },
    {
        offset: 0.24,
        transform: 'translateX(-10%) scaleX(0.42)'
    },
    {
        offset: 0.28,
        transform: 'translateX(-2%) scaleX(0.50)'
    },
    {
        offset: 0.32,
        transform: 'translateX(4%) scaleX(0.54)'
    },
    {
        offset: 0.40,
        transform: 'translateX(16%) scaleX(0.46)'
    },
    {
        offset: 0.48,
        transform: 'translateX(28%) scaleX(0.30)'
    },
    {
        offset: 0.56,
        transform: 'translateX(42%) scaleX(0.16)'
    },
    {
        offset: 0.64,
        transform: 'translateX(58%) scaleX(0.09)'
    },
    {
        offset: 0.72,
        transform: 'translateX(74%) scaleX(0.05)'
    },
    {
        offset: 0.80,
        transform: 'translateX(90%) scaleX(0.03)'
    },
    {
        offset: 0.88,
        transform: 'translateX(102%) scaleX(0.02)'
    },
    {
        offset: 1,
        transform: 'translateX(105%) scaleX(0.02)'
    }
], {
    duration: 1500,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 7. Elastic Shimmer - skeleton loading sweep
// -----------------------------------------------------------------------
/**
 * Elastic shimmer - slow stretch across, fast narrow exit.
 * Mirrors: `elastic-shimmer` (SkeletonElement).
 */
const elasticShimmer = animation([
    {
        offset: 0,
        transform: 'translateX(-50%) scaleX(0.8)'
    },
    {
        offset: 0.12,
        transform: 'translateX(-40%) scaleX(0.9)'
    },
    {
        offset: 0.25,
        transform: 'translateX(-28%) scaleX(1.0)'
    },
    {
        offset: 0.38,
        transform: 'translateX(-15%) scaleX(1.10)'
    },
    {
        offset: 0.48,
        transform: 'translateX(-5%) scaleX(1.15)'
    },
    {
        offset: 0.55,
        transform: 'translateX(5%) scaleX(1.12)'
    },
    {
        offset: 0.62,
        transform: 'translateX(18%) scaleX(1.0)'
    },
    {
        offset: 0.70,
        transform: 'translateX(30%) scaleX(0.85)'
    },
    {
        offset: 0.78,
        transform: 'translateX(42%) scaleX(0.8)'
    },
    {
        offset: 0.85,
        transform: 'translateX(50%) scaleX(0.8)'
    },
    {
        offset: 1,
        transform: 'translateX(50%) scaleX(0.8)'
    }
], {
    duration: 1800,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 8. Elastic Breathe - idle tension pulse
// -----------------------------------------------------------------------
/**
 * Elastic breathe - gentle scale cycle: slow grow (tension),
 * fast shrink (snap), settle. For typing indicators, idle states.
 */
const elasticBreathe = animation([
    {
        offset: 0,
        transform: 'translateY(0) scale(1)'
    },
    {
        offset: 0.15,
        transform: 'translateY(-1px) scaleX(0.92) scaleY(1.08)'
    },
    {
        offset: 0.30,
        transform: 'translateY(-3px) scaleX(0.85) scaleY(1.18)'
    },
    {
        offset: 0.45,
        transform: 'translateY(-5px) scaleX(0.82) scaleY(1.22)'
    },
    {
        offset: 0.55,
        transform: 'translateY(-6px) scaleX(0.80) scaleY(1.25)'
    },
    {
        offset: 0.68,
        transform: 'translateY(-1px) scaleX(0.98) scaleY(1.02)'
    },
    {
        offset: 0.78,
        transform: 'translateY(0) scaleX(1.02) scaleY(0.98)'
    },
    {
        offset: 0.88,
        transform: 'translateY(0) scale(1)'
    },
    {
        offset: 1,
        transform: 'translateY(0) scale(1)'
    }
], {
    duration: 1800,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 9. Elastic Tile Expand / Contract - tile management
// -----------------------------------------------------------------------
/**
 * Elastic tile expand - slow scale-up with tension, fast settle.
 * Mirrors: tile maximize animation.
 */
const elasticTileExpand = animation([
    {
        offset: 0,
        transform: 'scale(0.15)',
        opacity: '0'
    },
    {
        offset: 0.12,
        transform: 'scale(0.30)',
        opacity: '0.5'
    },
    {
        offset: 0.25,
        transform: 'scale(0.50)',
        opacity: '0.75'
    },
    {
        offset: 0.40,
        transform: 'scale(0.72)',
        opacity: '0.9'
    },
    {
        offset: 0.55,
        transform: 'scale(0.90)',
        opacity: '1'
    },
    {
        offset: 0.65,
        transform: 'scale(1.05)'
    },
    {
        offset: 0.75,
        transform: 'scale(0.98)'
    },
    {
        offset: 0.85,
        transform: 'scale(1)'
    },
    {
        offset: 1,
        transform: 'scale(1)',
        opacity: '1'
    }
], {
    duration: 600,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
/**
 * Elastic tile contract - slow tension pull then fast snap down.
 */
const elasticTileContract = animation([
    {
        offset: 0,
        transform: 'scale(1.5)',
        opacity: '0'
    },
    {
        offset: 0.12,
        transform: 'scale(1.35)',
        opacity: '0.5'
    },
    {
        offset: 0.25,
        transform: 'scale(1.20)',
        opacity: '0.75'
    },
    {
        offset: 0.40,
        transform: 'scale(1.10)',
        opacity: '0.9'
    },
    {
        offset: 0.55,
        transform: 'scale(1.04)',
        opacity: '1'
    },
    {
        offset: 0.65,
        transform: 'scale(0.97)'
    },
    {
        offset: 0.75,
        transform: 'scale(1.01)'
    },
    {
        offset: 0.85,
        transform: 'scale(1)'
    },
    {
        offset: 1,
        transform: 'scale(1)',
        opacity: '1'
    }
], {
    duration: 600,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 10. Elastic Focus Grow / Shrink - focus ring
// -----------------------------------------------------------------------
/**
 * Elastic focus grow - slow outline build with overshoot, fast snap
 * to final width. Mirrors: `elastic-outward-grow` (FocusRingElement).
 */
const elasticFocusGrow = animation([
    {
        offset: 0,
        outlineWidth: '0px'
    },
    {
        offset: 0.20,
        outlineWidth: '1.2px'
    },
    {
        offset: 0.40,
        outlineWidth: '2.4px'
    },
    {
        offset: 0.55,
        outlineWidth: '3.4px'
    },
    {
        offset: 0.65,
        outlineWidth: '4.4px'
    },
    {
        offset: 0.75,
        outlineWidth: '3.8px'
    },
    {
        offset: 0.85,
        outlineWidth: '4px'
    },
    {
        offset: 1,
        outlineWidth: '4px'
    }
], {
    duration: 400,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
/**
 * Elastic focus shrink - tiny tension bump then fast retract.
 * Mirrors: `elastic-outward-shrink` (FocusRingElement).
 */
const elasticFocusShrink = animation([
    {
        offset: 0,
        outlineWidth: '4px'
    },
    {
        offset: 0.10,
        outlineWidth: '4.2px'
    },
    {
        offset: 0.30,
        outlineWidth: '1.6px'
    },
    {
        offset: 0.50,
        outlineWidth: '0.4px'
    },
    {
        offset: 0.65,
        outlineWidth: '0px'
    },
    {
        offset: 1,
        outlineWidth: '0px'
    }
], {
    duration: 400,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// 11. Elastic Ink Settle - ink bar settle after tab change
// -----------------------------------------------------------------------
/**
 * Elastic ink settle - slow release from deformed state, fast snap
 * to rest. Mirrors: `elastic-ink-settle-a` (InkBarElement).
 */
const elasticInkSettle = animation([
    {
        offset: 0,
        transform: 'scaleX(1.20) scaleY(0.65)'
    },
    {
        offset: 0.20,
        transform: 'scaleX(1.10) scaleY(0.80)'
    },
    {
        offset: 0.40,
        transform: 'scaleX(1.04) scaleY(0.92)'
    },
    {
        offset: 0.55,
        transform: 'scaleX(1.01) scaleY(0.98)'
    },
    {
        offset: 0.65,
        transform: 'scaleX(0.98) scaleY(1.01)'
    },
    {
        offset: 0.75,
        transform: 'scaleX(1.01) scaleY(1.00)'
    },
    {
        offset: 0.85,
        transform: 'scale(1)'
    },
    {
        offset: 1,
        transform: 'scale(1)'
    }
], {
    duration: 400,
    easing: ELASTIC_EASING,
    fill: 'forwards'
});
// -----------------------------------------------------------------------
// Exports
// -----------------------------------------------------------------------
export { elasticBreathe, elasticDigitDown, elasticDigitUp, elasticEnter, elasticExit, elasticFocusGrow, elasticFocusShrink, elasticInkSettle, elasticPress, elasticPressVertical, elasticShimmer, elasticSweep, elasticTileContract, elasticTileExpand, elasticToggle };
//# sourceMappingURL=ElasticSnap.js.map