@nova-design-system/nova-webcomponents 3.24.0 → 3.25.0

package/dist/components/p-D1C_pu0E.js

@@ -1,218 +1 @@
-import { a as animate } from './p-Dz1GUhVy.js';
-
-const a = (a1, a2) => 1.0 - 3.0 * a2 + 3.0 * a1;
-const b = (a1, a2) => 3.0 * a2 - 6.0 * a1;
-const c = (a1) => 3.0 * a1;
-const calcBezier = (t, a1, a2) => ((a(a1, a2) * t + b(a1, a2)) * t + c(a1)) * t;
-const getSlope = (t, a1, a2) => 3.0 * a(a1, a2) * t * t + 2.0 * b(a1, a2) * t + c(a1);
-const subdivisionPrecision = 0.0000001;
-const subdivisionMaxIterations = 10;
-function binarySubdivide(aX, aA, aB, mX1, mX2) {
-    let currentX;
-    let currentT;
-    let i = 0;
-    do {
-        currentT = aA + (aB - aA) / 2.0;
-        currentX = calcBezier(currentT, mX1, mX2) - aX;
-        if (currentX > 0.0) {
-            aB = currentT;
-        }
-        else {
-            aA = currentT;
-        }
-    } while (Math.abs(currentX) > subdivisionPrecision &&
-        ++i < subdivisionMaxIterations);
-    return currentT;
-}
-const newtonIterations = 8;
-const newtonMinSlope = 0.001;
-function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) {
-    for (let i = 0; i < newtonIterations; ++i) {
-        const currentSlope = getSlope(aGuessT, mX1, mX2);
-        if (currentSlope === 0.0) {
-            return aGuessT;
-        }
-        const currentX = calcBezier(aGuessT, mX1, mX2) - aX;
-        aGuessT -= currentX / currentSlope;
-    }
-    return aGuessT;
-}
-const kSplineTableSize = 11;
-const kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
-function cubicBezier(mX1, mY1, mX2, mY2) {
-    const sampleValues = new Float32Array(kSplineTableSize);
-    for (let i = 0; i < kSplineTableSize; ++i) {
-        sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
-    }
-    function getTForX(aX) {
-        let intervalStart = 0.0;
-        let currentSample = 1;
-        const lastSample = kSplineTableSize - 1;
-        for (; currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
-            intervalStart += kSampleStepSize;
-        }
-        --currentSample;
-        const dist = (aX - sampleValues[currentSample]) /
-            (sampleValues[currentSample + 1] - sampleValues[currentSample]);
-        const guessForT = intervalStart + dist * kSampleStepSize;
-        const initialSlope = getSlope(guessForT, mX1, mX2);
-        if (initialSlope >= newtonMinSlope) {
-            return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
-        }
-        else if (initialSlope === 0.0) {
-            return guessForT;
-        }
-        else {
-            return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2);
-        }
-    }
-    return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);
-}
-
-/**
- * Read current box metrics (height + vertical margins).
- * @param {HTMLElement} node - The element to measure.
- * @returns {object} The box metrics.
- */
-function getBoxMetrics(node) {
-    const rectHeight = node.getBoundingClientRect().height;
-    const style = getComputedStyle(node);
-    const marginTop = parseFloat(style.marginTop) || 0;
-    const marginBottom = parseFloat(style.marginBottom) || 0;
-    const total = rectHeight + marginTop + marginBottom;
-    return { height: rectHeight, marginTop, marginBottom, total };
-}
-const useCollapse = (node, { duration = 200, overflow = 'hidden' } = {}) => {
-    let currentAnimation = null;
-    const stop = () => {
-        if (currentAnimation) {
-            currentAnimation.stop();
-            currentAnimation = null;
-        }
-    };
-    const setStyle = (styles) => {
-        for (const [k, v] of Object.entries(styles)) {
-            node.style[k] = v;
-        }
-    };
-    /** Instantly apply collapsed styles (no animation). */
-    function setCollapsed() {
-        stop();
-        setStyle({
-            height: '0px',
-            marginTop: '0px',
-            marginBottom: '0px',
-            overflow,
-        });
-    }
-    /** Instantly apply expanded styles (no animation). */
-    function setExpanded() {
-        stop();
-        setStyle({
-            height: '',
-            marginTop: '',
-            marginBottom: '',
-            overflow: '',
-        });
-    }
-    /**
-     * Collapse: animate from current box (height + margins) down to 0.
-     */
-    function collapse() {
-        stop();
-        return new Promise(resolve => {
-            const { height, marginTop, marginBottom, total } = getBoxMetrics(node);
-            // Lock current box
-            setStyle({
-                height: `${height}px`,
-                marginTop: `${marginTop}px`,
-                marginBottom: `${marginBottom}px`,
-                overflow,
-                willChange: 'height, margin',
-            });
-            const denom = total > 0 ? total : 0.0001; // avoid divide-by-zero
-            currentAnimation = animate({
-                from: total,
-                to: 0,
-                duration,
-                ease: cubicBezier(0.2, 0, 0, 1),
-                onUpdate: v => {
-                    const ratio = v / denom;
-                    setStyle({
-                        height: `${height * ratio}px`,
-                        marginTop: `${marginTop * ratio}px`,
-                        marginBottom: `${marginBottom * ratio}px`,
-                    });
-                },
-                onComplete: () => {
-                    setStyle({
-                        height: '0px',
-                        marginTop: '0px',
-                        marginBottom: '0px',
-                        willChange: '',
-                    });
-                    resolve();
-                },
-            });
-        });
-    }
-    /**
-     * Expand: animate from 0 box to the element's natural box (height + margins),
-     * then restore `height: auto` and computed margins.
-     */
-    async function expand() {
-        stop();
-        // Make sure any pending screen updates are done
-        await new Promise(resolve => requestAnimationFrame(resolve));
-        return new Promise(resolve => {
-            // Let the element size naturally to measure the target box
-            // await next animation frame
-            setStyle({
-                height: '',
-                marginTop: '',
-                marginBottom: '',
-                overflow,
-            });
-            const { height, marginTop, marginBottom, total } = getBoxMetrics(node);
-            // Start locked at zero box
-            setStyle({
-                height: '0px',
-                marginTop: '0px',
-                marginBottom: '0px',
-                willChange: 'height, margin',
-            });
-            const denom = total > 0 ? total : 0.0001;
-            currentAnimation = animate({
-                from: 0,
-                to: total,
-                duration,
-                ease: cubicBezier(0.2, 0, 0, 1),
-                onUpdate: v => {
-                    const ratio = v / denom;
-                    setStyle({
-                        height: `${height * ratio}px`,
-                        marginTop: `${marginTop * ratio}px`,
-                        marginBottom: `${marginBottom * ratio}px`,
-                    });
-                },
-                onComplete: () => {
-                    // Restore natural layout
-                    setStyle({
-                        height: '',
-                        marginTop: '',
-                        marginBottom: '',
-                        overflow: '',
-                        willChange: '',
-                    });
-                    resolve();
-                },
-            });
-        });
-    }
-    return { collapse, expand, setCollapsed, setExpanded };
-};
-
-export { useCollapse as u };
-//# sourceMappingURL=p-D1C_pu0E.js.map
-
-//# sourceMappingURL=p-D1C_pu0E.js.map
+import{a as o}from"./p-Dz1GUhVy.js";const t=(o,t)=>1-3*t+3*o,n=(o,t)=>3*t-6*o,e=o=>3*o,r=(o,r,i)=>((t(r,i)*o+n(r,i))*o+e(r))*o,i=(o,r,i)=>3*t(r,i)*o*o+2*n(r,i)*o+e(r),a=.1;function m(o,t,n,e){const m=new Float32Array(11);for(let t=0;t<11;++t)m[t]=r(t*a,o,n);return g=>0===g||1===g?g:r(function(t){let e=0,g=1;for(;10!==g&&m[g]<=t;++g)e+=a;--g;const p=e+(t-m[g])/(m[g+1]-m[g])*a,l=i(p,o,n);return l>=.001?function(o,t,n,e){for(let a=0;a<8;++a){const a=i(t,n,e);if(0===a)return t;t-=(r(t,n,e)-o)/a}return t}(t,p,o,n):0===l?p:function(o,t,n,e,i){let a,m,g=0;do{m=t+(n-t)/2,a=r(m,e,i)-o,a>0?n=m:t=m}while(Math.abs(a)>1e-7&&++g<10);return m}(t,e,e+a,o,n)}(g),t,e)}function g(o){const t=o.getBoundingClientRect().height,n=getComputedStyle(o),e=parseFloat(n.marginTop)||0,r=parseFloat(n.marginBottom)||0;return{height:t,marginTop:e,marginBottom:r,total:t+e+r}}const p=(t,{duration:n=200,overflow:e="hidden"}={})=>{let r=null;const i=()=>{r&&(r.stop(),r=null)},a=o=>{for(const[n,e]of Object.entries(o))t.style[n]=e};return{collapse:function(){return i(),new Promise((i=>{const{height:p,marginTop:l,marginBottom:h,total:s}=g(t);a({height:`${p}px`,marginTop:`${l}px`,marginBottom:`${h}px`,overflow:e,willChange:"height, margin"});const c=s>0?s:1e-4;r=o({from:s,to:0,duration:n,ease:m(.2,0,0,1),onUpdate:o=>{const t=o/c;a({height:p*t+"px",marginTop:l*t+"px",marginBottom:h*t+"px"})},onComplete:()=>{a({height:"0px",marginTop:"0px",marginBottom:"0px",willChange:""}),i()}})}))},expand:async function(){return i(),await new Promise((o=>requestAnimationFrame(o))),new Promise((i=>{a({height:"",marginTop:"",marginBottom:"",overflow:e});const{height:p,marginTop:l,marginBottom:h,total:s}=g(t);a({height:"0px",marginTop:"0px",marginBottom:"0px",willChange:"height, margin"});const c=s>0?s:1e-4;r=o({from:0,to:s,duration:n,ease:m(.2,0,0,1),onUpdate:o=>{const t=o/c;a({height:p*t+"px",marginTop:l*t+"px",marginBottom:h*t+"px"})},onComplete:()=>{a({height:"",marginTop:"",marginBottom:"",overflow:"",willChange:""}),i()}})}))},setCollapsed:function(){i(),a({height:"0px",marginTop:"0px",marginBottom:"0px",overflow:e})},setExpanded:function(){i(),a({height:"",marginTop:"",marginBottom:"",overflow:""})}}};export{p as u}

package/dist/components/p-D2otK4Ce.js

@@ -1,91 +1 @@
-import { i as index } from './p-9xYwU7ku.js';
-import { a as animate, g as easeOut } from './p-Dz1GUhVy.js';
-
-const useSlide = (node, { duration } = { duration: 200 }) => {
-    const nodeStyler = index(node);
-    /**
-     * Will animate the translateX property.
-     *
-     * @param {object} options - The options for the animation.
-     * @param {number} options.from - The starting value for the translateX property.
-     * @param {number} options.to - The ending value for the translateX property.
-     * @returns {Promise<void>} - A promise that resolves when the animation is
-     * complete.
-     */
-    const slideX = (options = { from: 0, to: 100 }) => () => {
-        return new Promise(resolve => {
-            animate({
-                from: { x: options.from },
-                to: { x: options.to },
-                ease: easeOut,
-                duration,
-                onUpdate(latest) {
-                    nodeStyler.set({ transform: `translateX(${latest.x}%)` });
-                },
-                onComplete() {
-                    resolve();
-                },
-            });
-        });
-    };
-    /**
-     * Will animate the translateY property.
-     *
-     * @param {object} options - The options for the animation.
-     * @param {number} options.from - The starting value for the translateY property.
-     * @param {number} options.to - The ending value for the translateY property.
-     * @returns {Promise<void>} - A promise that resolves when the animation is
-     * complete.
-     */
-    const slideY = (options = { from: 0, to: 100 }) => () => {
-        return new Promise(resolve => {
-            animate({
-                from: { y: options.from },
-                to: { y: options.to },
-                ease: easeOut,
-                duration,
-                onUpdate(latest) {
-                    nodeStyler.set({ transform: `translateY(${latest.y}%)` });
-                },
-                onComplete() {
-                    resolve();
-                },
-            });
-        });
-    };
-    /**
-     * Applies the slideX styles without animating, useful when initial state
-     * is slid out.
-     *
-     * @param {number} amount - The amount to translate the element by.
-     * @returns {function} - A function that applies the slideX styles.
-     */
-    const setSlideX = (amount = 100) => nodeStyler.set({ transform: `translateX(${amount}%)` });
-    /**
-     * Applies the slideY styles without animating, useful when initial state
-     * is slid out.
-     *
-     * @param {number} amount - The amount to translate the element by.
-     * @returns {function} - A function that applies the slideY styles.
-     */
-    const setSlideY = (amount = 100) => nodeStyler.set({ transform: `translateY(${amount}%)` });
-    /**
-     * Applies the slideIn styles without animating, useful when initial state
-     * is slid in.
-     */
-    function setSlideReset() {
-        nodeStyler.set({ transform: `translateX(${0}%) translateY(${0}%)` });
-    }
-    return {
-        slideX,
-        slideY,
-        setSlideX,
-        setSlideY,
-        setSlideReset,
-    };
-};
-
-export { useSlide as u };
-//# sourceMappingURL=p-D2otK4Ce.js.map
-
-//# sourceMappingURL=p-D2otK4Ce.js.map
+import{i as t}from"./p-9xYwU7ku.js";import{a as o,g as r}from"./p-Dz1GUhVy.js";const e=(e,{duration:a}={duration:200})=>{const s=t(e);return{slideX:(t={from:0,to:100})=>()=>new Promise((e=>{o({from:{x:t.from},to:{x:t.to},ease:r,duration:a,onUpdate(t){s.set({transform:`translateX(${t.x}%)`})},onComplete(){e()}})})),slideY:(t={from:0,to:100})=>()=>new Promise((e=>{o({from:{y:t.from},to:{y:t.to},ease:r,duration:a,onUpdate(t){s.set({transform:`translateY(${t.y}%)`})},onComplete(){e()}})})),setSlideX:(t=100)=>s.set({transform:`translateX(${t}%)`}),setSlideY:(t=100)=>s.set({transform:`translateY(${t}%)`}),setSlideReset:function(){s.set({transform:"translateX(0%) translateY(0%)"})}}};export{e as u}