@wix/motion 1.0.73 → 1.572.0

package/dist/cjs/library/entrance/SpinIn.js

@@ -0,0 +1,65 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+function getNames(_) {
+  return ['motion-fadeIn', 'motion-spinIn'];
+}
+const SCALE_MAP = {
+  soft: 1,
+  medium: 0.6,
+  hard: 0
+};
+const DIRECTION_MAP = {
+  clockwise: -1,
+  'counter-clockwise': 1
+};
+function web(options) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    direction = 'clockwise',
+    spins = 0.5,
+    initialScale = 0,
+    power
+  } = options.namedEffect;
+  const [fadeIn, spinIn] = getNames(options);
+  const easing = options.easing || 'cubicInOut';
+  const scale = typeof power !== 'undefined' ? SCALE_MAP[power] : initialScale;
+  const transformRotate = (DIRECTION_MAP[direction] > 0 ? 1 : -1) * 360 * spins;
+  const custom = {
+    '--motion-scale': `${scale}`,
+    '--motion-rotate': `${transformRotate}deg`
+  };
+  return [{
+    ...options,
+    name: fadeIn,
+    easing: 'cubicIn',
+    duration: options.duration * scale,
+    custom: {},
+    keyframes: [{
+      offset: 0,
+      opacity: 0
+    }, {
+      opacity: 'var(--comp-opacity, 1)'
+    }]
+  }, {
+    ...options,
+    name: spinIn,
+    easing,
+    custom,
+    keyframes: [{
+      offset: _utils.INITIAL_FRAME_OFFSET,
+      scale: (0, _utils.toKeyframeValue)(custom, '--motion-scale', asWeb),
+      rotate: (0, _utils.toKeyframeValue)(custom, '--motion-rotate', asWeb)
+    }, {
+      scale: '1',
+      rotate: `0deg`
+    }]
+  }];
+}
+//# sourceMappingURL=SpinIn.js.map

package/dist/cjs/library/entrance/SpinIn.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","getNames","_","SCALE_MAP","soft","medium","hard","DIRECTION_MAP","clockwise","web","options","style","asWeb","direction","spins","initialScale","power","namedEffect","fadeIn","spinIn","easing","scale","transformRotate","custom","name","duration","keyframes","offset","opacity","INITIAL_FRAME_OFFSET","toKeyframeValue","rotate"],"sources":["../../../../src/library/entrance/SpinIn.ts"],"sourcesContent":["import type {\n  SpinIn,\n  AnimationExtraOptions,\n  TimeAnimationOptions,\n} from '../../types';\nimport { INITIAL_FRAME_OFFSET, toKeyframeValue } from '../../utils';\n\nexport function getNames(_: TimeAnimationOptions) {\n  return ['motion-fadeIn', 'motion-spinIn'];\n}\n\nconst SCALE_MAP = {\n  soft: 1,\n  medium: 0.6,\n  hard: 0,\n};\n\nconst DIRECTION_MAP = {\n  clockwise: -1,\n  'counter-clockwise': 1,\n};\n\nexport function web(options: TimeAnimationOptions & AnimationExtraOptions) {\n  return style(options, true);\n}\n\nexport function style(options: TimeAnimationOptions, asWeb = false) {\n  const {\n    direction = 'clockwise',\n    spins = 0.5,\n    initialScale = 0,\n    power,\n  } = options.namedEffect as SpinIn;\n  const [fadeIn, spinIn] = getNames(options);\n\n  const easing = options.easing || 'cubicInOut';\n  const scale = typeof power !== 'undefined' ? SCALE_MAP[power] : initialScale;\n  const transformRotate = (DIRECTION_MAP[direction] > 0 ? 1 : -1) * 360 * spins;\n\n  const custom = {\n    '--motion-scale': `${scale}`,\n    '--motion-rotate': `${transformRotate}deg`,\n  };\n\n  return [\n    {\n      ...options,\n      name: fadeIn,\n      easing: 'cubicIn',\n      duration: options.duration! * scale,\n      custom: {},\n      keyframes: [\n        { offset: 0, opacity: 0 },\n        { opacity: 'var(--comp-opacity, 1)' },\n      ],\n    },\n    {\n      ...options,\n      name: spinIn,\n      easing,\n      custom,\n      keyframes: [\n        {\n          offset: INITIAL_FRAME_OFFSET,\n          scale: toKeyframeValue(custom, '--motion-scale', asWeb),\n          rotate: toKeyframeValue(custom, '--motion-rotate', asWeb),\n        },\n        {\n          scale: '1',\n          rotate: `0deg`,\n        },\n      ],\n    },\n  ];\n}\n"],"mappings":";;;;;;AAKA,IAAAA,MAAA,GAAAC,OAAA;AAEO,SAASC,QAAQA,CAACC,CAAuB,EAAE;EAChD,OAAO,CAAC,eAAe,EAAE,eAAe,CAAC;AAC3C;AAEA,MAAMC,SAAS,GAAG;EAChBC,IAAI,EAAE,CAAC;EACPC,MAAM,EAAE,GAAG;EACXC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,aAAa,GAAG;EACpBC,SAAS,EAAE,CAAC,CAAC;EACb,mBAAmB,EAAE;AACvB,CAAC;AAEM,SAASC,GAAGA,CAACC,OAAqD,EAAE;EACzE,OAAOC,KAAK,CAACD,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEO,SAASC,KAAKA,CAACD,OAA6B,EAAEE,KAAK,GAAG,KAAK,EAAE;EAClE,MAAM;IACJC,SAAS,GAAG,WAAW;IACvBC,KAAK,GAAG,GAAG;IACXC,YAAY,GAAG,CAAC;IAChBC;EACF,CAAC,GAAGN,OAAO,CAACO,WAAqB;EACjC,MAAM,CAACC,MAAM,EAAEC,MAAM,CAAC,GAAGlB,QAAQ,CAACS,OAAO,CAAC;EAE1C,MAAMU,MAAM,GAAGV,OAAO,CAACU,MAAM,IAAI,YAAY;EAC7C,MAAMC,KAAK,GAAG,OAAOL,KAAK,KAAK,WAAW,GAAGb,SAAS,CAACa,KAAK,CAAC,GAAGD,YAAY;EAC5E,MAAMO,eAAe,GAAG,CAACf,aAAa,CAACM,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,GAAGC,KAAK;EAE7E,MAAMS,MAAM,GAAG;IACb,gBAAgB,EAAE,GAAGF,KAAK,EAAE;IAC5B,iBAAiB,EAAE,GAAGC,eAAe;EACvC,CAAC;EAED,OAAO,CACL;IACE,GAAGZ,OAAO;IACVc,IAAI,EAAEN,MAAM;IACZE,MAAM,EAAE,SAAS;IACjBK,QAAQ,EAAEf,OAAO,CAACe,QAAQ,GAAIJ,KAAK;IACnCE,MAAM,EAAE,CAAC,CAAC;IACVG,SAAS,EAAE,CACT;MAAEC,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAC,EACzB;MAAEA,OAAO,EAAE;IAAyB,CAAC;EAEzC,CAAC,EACD;IACE,GAAGlB,OAAO;IACVc,IAAI,EAAEL,MAAM;IACZC,MAAM;IACNG,MAAM;IACNG,SAAS,EAAE,CACT;MACEC,MAAM,EAAEE,2BAAoB;MAC5BR,KAAK,EAAE,IAAAS,sBAAe,EAACP,MAAM,EAAE,gBAAgB,EAAEX,KAAK,CAAC;MACvDmB,MAAM,EAAE,IAAAD,sBAAe,EAACP,MAAM,EAAE,iBAAiB,EAAEX,KAAK;IAC1D,CAAC,EACD;MACES,KAAK,EAAE,GAAG;MACVU,MAAM,EAAE;IACV,CAAC;EAEL,CAAC,CACF;AACH","ignoreList":[]}

package/dist/cjs/library/entrance/TiltIn.js

@@ -0,0 +1,102 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.prepare = prepare;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+function getNames(_) {
+  return ['motion-fadeIn', 'motion-tiltInRotate', 'motion-tiltInClip'];
+}
+const ROTATION_MAP = {
+  left: 30,
+  right: -30
+};
+const DIRECTIONS = ['top', 'right', 'bottom', 'left'];
+function getClipStart(rotateZ) {
+  const clipDirection = (0, _utils.getAdjustedDirection)(DIRECTIONS, 'top', rotateZ);
+  return (0, _utils.getClipPolygonParams)({
+    direction: clipDirection,
+    minimum: 0
+  });
+}
+function web(options, dom) {
+  prepare(options, dom);
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    direction = 'left'
+  } = options.namedEffect;
+  const [fadeIn, tiltInRotate, tiltInClip] = getNames(options);
+  const easing = options.easing || 'cubicOut';
+  const clipStart = getClipStart(0);
+  const rotationZ = ROTATION_MAP[direction];
+  const clipEnd = (0, _utils.getClipPolygonParams)({
+    direction: 'initial'
+  });
+  const translateZ = '(var(--motion-height, 200px) / 2)';
+  const clipCustom = {
+    '--motion-rotate-z': `${rotationZ}deg`,
+    '--motion-clip-start': clipStart
+  };
+  return [{
+    ...options,
+    name: fadeIn,
+    duration: options.duration * 0.2,
+    easing: 'cubicOut',
+    custom: {},
+    keyframes: [{
+      offset: 0,
+      opacity: 0
+    }, {
+      opacity: 'var(--comp-opacity, 1)'
+    }]
+  }, {
+    ...options,
+    name: tiltInRotate,
+    easing,
+    custom: {},
+    keyframes: [{
+      offset: 0,
+      easing: 'step-end',
+      transform: 'perspective(800px)'
+    }, {
+      offset: _utils.INITIAL_FRAME_OFFSET,
+      transform: `perspective(800px) translateZ(calc(${translateZ} * -1)) rotateX(-90deg) translateZ(calc${translateZ}) rotate(var(--comp-rotate-z, 0deg))`
+    }, {
+      transform: `perspective(800px) translateZ(calc(${translateZ} * -1)) rotateX(0deg) translateZ(calc${translateZ}) rotate(var(--comp-rotate-z, 0deg))`
+    }]
+  }, {
+    ...options,
+    name: tiltInClip,
+    easing,
+    composite: 'add',
+    duration: options.duration * 0.8,
+    custom: clipCustom,
+    keyframes: [{
+      offset: _utils.INITIAL_FRAME_OFFSET,
+      clipPath: `var(--motion-clip-start, ${clipCustom['--motion-clip-start']})`,
+      transform: `rotateZ(${(0, _utils.toKeyframeValue)(clipCustom, '--motion-rotate-z', asWeb)})`
+    }, {
+      clipPath: clipEnd,
+      transform: `rotateZ(0deg)`
+    }]
+  }];
+}
+function prepare(_, dom) {
+  if (dom) {
+    let rotation = '0deg';
+    dom.measure(target => {
+      if (!target) {
+        return;
+      }
+      rotation = getComputedStyle(target).getPropertyValue('--comp-rotate-z') || '0deg';
+    });
+    dom.mutate(target_ => {
+      target_ == null || target_.style.setProperty('--motion-clip-start', getClipStart(parseInt(rotation, 10)));
+    });
+  }
+}
+//# sourceMappingURL=TiltIn.js.map

package/dist/cjs/library/entrance/TiltIn.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","getNames","_","ROTATION_MAP","left","right","DIRECTIONS","getClipStart","rotateZ","clipDirection","getAdjustedDirection","getClipPolygonParams","direction","minimum","web","options","dom","prepare","style","asWeb","namedEffect","fadeIn","tiltInRotate","tiltInClip","easing","clipStart","rotationZ","clipEnd","translateZ","clipCustom","name","duration","custom","keyframes","offset","opacity","transform","INITIAL_FRAME_OFFSET","composite","clipPath","toKeyframeValue","rotation","measure","target","getComputedStyle","getPropertyValue","mutate","target_","setProperty","parseInt"],"sources":["../../../../src/library/entrance/TiltIn.ts"],"sourcesContent":["import {\n  getAdjustedDirection,\n  getClipPolygonParams,\n  INITIAL_FRAME_OFFSET,\n  toKeyframeValue,\n} from '../../utils';\nimport type { TiltIn, TimeAnimationOptions, DomApi } from '../../types';\n\nexport function getNames(_: TimeAnimationOptions) {\n  return ['motion-fadeIn', 'motion-tiltInRotate', 'motion-tiltInClip'];\n}\n\nconst ROTATION_MAP = {\n  left: 30,\n  right: -30,\n};\n\nconst DIRECTIONS = [\n  'top',\n  'right',\n  'bottom',\n  'left',\n] as (keyof typeof ROTATION_MAP)[];\n\nfunction getClipStart(rotateZ: number) {\n  const clipDirection = getAdjustedDirection(\n    DIRECTIONS,\n    'top',\n    rotateZ,\n  ) as (typeof DIRECTIONS)[number];\n\n  return getClipPolygonParams({\n    direction: clipDirection,\n    minimum: 0,\n  });\n}\n\nexport function web(options: TimeAnimationOptions, dom?: DomApi) {\n  prepare(options, dom);\n\n  return style(options, true);\n}\n\nexport function style(options: TimeAnimationOptions, asWeb = false) {\n  const { direction = 'left' } = options.namedEffect as TiltIn;\n  const [fadeIn, tiltInRotate, tiltInClip] = getNames(options);\n\n  const easing = options.easing || 'cubicOut';\n  const clipStart = getClipStart(0);\n  const rotationZ = ROTATION_MAP[direction];\n  const clipEnd = getClipPolygonParams({ direction: 'initial' });\n  const translateZ = '(var(--motion-height, 200px) / 2)';\n\n  const clipCustom = {\n    '--motion-rotate-z': `${rotationZ}deg`,\n    '--motion-clip-start': clipStart,\n  };\n\n  return [\n    {\n      ...options,\n      name: fadeIn,\n      duration: options.duration! * 0.2,\n      easing: 'cubicOut',\n      custom: {},\n      keyframes: [\n        { offset: 0, opacity: 0 },\n        { opacity: 'var(--comp-opacity, 1)' },\n      ],\n    },\n    {\n      ...options,\n      name: tiltInRotate,\n      easing,\n      custom: {},\n      keyframes: [\n        {\n          offset: 0,\n          easing: 'step-end',\n          transform: 'perspective(800px)',\n        },\n        {\n          offset: INITIAL_FRAME_OFFSET,\n          transform: `perspective(800px) translateZ(calc(${translateZ} * -1)) rotateX(-90deg) translateZ(calc${translateZ}) rotate(var(--comp-rotate-z, 0deg))`,\n        },\n        {\n          transform: `perspective(800px) translateZ(calc(${translateZ} * -1)) rotateX(0deg) translateZ(calc${translateZ}) rotate(var(--comp-rotate-z, 0deg))`,\n        },\n      ],\n    },\n    {\n      ...options,\n      name: tiltInClip,\n      easing,\n      composite: 'add' as const,\n      duration: options.duration! * 0.8,\n      custom: clipCustom,\n      keyframes: [\n        {\n          offset: INITIAL_FRAME_OFFSET,\n          clipPath: `var(--motion-clip-start, ${clipCustom['--motion-clip-start']})`,\n          transform: `rotateZ(${toKeyframeValue(\n            clipCustom,\n            '--motion-rotate-z',\n            asWeb,\n          )})`,\n        },\n        {\n          clipPath: clipEnd,\n          transform: `rotateZ(0deg)`,\n        },\n      ],\n    },\n  ];\n}\n\nexport function prepare(_: TimeAnimationOptions, dom?: DomApi) {\n  if (dom) {\n    let rotation = '0deg';\n\n    dom.measure((target) => {\n      if (!target) {\n        return;\n      }\n      rotation =\n        getComputedStyle(target).getPropertyValue('--comp-rotate-z') || '0deg';\n    });\n\n    dom.mutate((target_) => {\n      target_?.style.setProperty(\n        '--motion-clip-start',\n        getClipStart(parseInt(rotation, 10)),\n      );\n    });\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/library/entrance/TurnIn.js

@@ -0,0 +1,85 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+function getNames(_) {
+  return ['motion-fadeIn', 'motion-turnIn'];
+}
+const EASING_MAP = {
+  soft: 'cubicInOut',
+  medium: 'quintInOut',
+  hard: 'backOut'
+};
+const DIRECTION_TO_TRANSFORM_MAP = {
+  'top-left': {
+    angle: -50,
+    x: -50,
+    y: -50
+  },
+  'top-right': {
+    angle: 50,
+    x: 50,
+    y: -50
+  },
+  'bottom-right': {
+    angle: 50,
+    x: 50,
+    y: 50
+  },
+  'bottom-left': {
+    angle: -50,
+    x: -50,
+    y: 50
+  }
+};
+function web(options) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    direction = 'top-left',
+    power
+  } = options.namedEffect;
+  const [fadeIn, turnIn] = getNames(options);
+  const easing = power && EASING_MAP[power] ? EASING_MAP[power] : options.easing || 'backOut';
+  const {
+    x,
+    y
+  } = DIRECTION_TO_TRANSFORM_MAP[direction];
+  const transformRotate = DIRECTION_TO_TRANSFORM_MAP[direction].angle;
+  const custom = {
+    '--motion-origin': `${x}%, ${y}%`,
+    '--motion-origin-invert': `${-x}%, ${-y}%`,
+    '--motion-rotate-z': `${transformRotate}deg`
+  };
+  const origin = (0, _utils.toKeyframeValue)(custom, '--motion-origin', asWeb);
+  const invertedOrigin = (0, _utils.toKeyframeValue)(custom, '--motion-origin-invert', asWeb);
+  return [{
+    ...options,
+    name: fadeIn,
+    duration: options.duration * 0.6,
+    easing: 'sineIn',
+    custom: {},
+    keyframes: [{
+      offset: 0,
+      opacity: 0
+    }, {
+      opacity: 'var(--comp-opacity, 1)'
+    }]
+  }, {
+    ...options,
+    name: turnIn,
+    easing,
+    custom,
+    keyframes: [{
+      offset: _utils.INITIAL_FRAME_OFFSET,
+      transform: `translate(${origin}) rotate(${(0, _utils.toKeyframeValue)(custom, '--motion-rotate-z', asWeb)}) translate(${invertedOrigin}) rotate(var(--comp-rotate-z, 0deg))`
+    }, {
+      transform: `translate(${origin}) rotate(0deg) translate(${invertedOrigin}) rotate(var(--comp-rotate-z, 0deg))`
+    }]
+  }];
+}
+//# sourceMappingURL=TurnIn.js.map

package/dist/cjs/library/entrance/TurnIn.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","getNames","_","EASING_MAP","soft","medium","hard","DIRECTION_TO_TRANSFORM_MAP","angle","x","y","web","options","style","asWeb","direction","power","namedEffect","fadeIn","turnIn","easing","transformRotate","custom","origin","toKeyframeValue","invertedOrigin","name","duration","keyframes","offset","opacity","INITIAL_FRAME_OFFSET","transform"],"sources":["../../../../src/library/entrance/TurnIn.ts"],"sourcesContent":["import type {\n  TurnIn,\n  TimeAnimationOptions,\n  EffectFourCorners,\n} from '../../types';\nimport { INITIAL_FRAME_OFFSET, toKeyframeValue } from '../../utils';\n\nexport function getNames(_: TimeAnimationOptions) {\n  return ['motion-fadeIn', 'motion-turnIn'];\n}\n\nconst EASING_MAP = {\n  soft: 'cubicInOut',\n  medium: 'quintInOut',\n  hard: 'backOut',\n};\n\nconst DIRECTION_TO_TRANSFORM_MAP: Record<\n  EffectFourCorners,\n  {\n    x: number;\n    y: number;\n    angle?: number;\n  }\n> = {\n  'top-left': {\n    angle: -50,\n    x: -50,\n    y: -50,\n  },\n  'top-right': {\n    angle: 50,\n    x: 50,\n    y: -50,\n  },\n  'bottom-right': {\n    angle: 50,\n    x: 50,\n    y: 50,\n  },\n  'bottom-left': {\n    angle: -50,\n    x: -50,\n    y: 50,\n  },\n};\n\nexport function web(options: TimeAnimationOptions) {\n  return style(options, true);\n}\n\nexport function style(options: TimeAnimationOptions, asWeb = false) {\n  const { direction = 'top-left', power } = options.namedEffect as TurnIn;\n  const [fadeIn, turnIn] = getNames(options);\n\n  const easing =\n    power && EASING_MAP[power]\n      ? EASING_MAP[power]\n      : options.easing || 'backOut';\n  const { x, y } = DIRECTION_TO_TRANSFORM_MAP[direction];\n  const transformRotate = DIRECTION_TO_TRANSFORM_MAP[direction].angle;\n\n  const custom = {\n    '--motion-origin': `${x}%, ${y}%`,\n    '--motion-origin-invert': `${-x}%, ${-y}%`,\n    '--motion-rotate-z': `${transformRotate}deg`,\n  };\n\n  const origin = toKeyframeValue(custom, '--motion-origin', asWeb);\n  const invertedOrigin = toKeyframeValue(\n    custom,\n    '--motion-origin-invert',\n    asWeb,\n  );\n\n  return [\n    {\n      ...options,\n      name: fadeIn,\n      duration: options.duration! * 0.6,\n      easing: 'sineIn',\n      custom: {},\n      keyframes: [\n        { offset: 0, opacity: 0 },\n        { opacity: 'var(--comp-opacity, 1)' },\n      ],\n    },\n    {\n      ...options,\n      name: turnIn,\n      easing,\n      custom,\n      keyframes: [\n        {\n          offset: INITIAL_FRAME_OFFSET,\n          transform: `translate(${origin}) rotate(${toKeyframeValue(\n            custom,\n            '--motion-rotate-z',\n            asWeb,\n          )}) translate(${invertedOrigin}) rotate(var(--comp-rotate-z, 0deg))`,\n        },\n        {\n          transform: `translate(${origin}) rotate(0deg) translate(${invertedOrigin}) rotate(var(--comp-rotate-z, 0deg))`,\n        },\n      ],\n    },\n  ];\n}\n"],"mappings":";;;;;;AAKA,IAAAA,MAAA,GAAAC,OAAA;AAEO,SAASC,QAAQA,CAACC,CAAuB,EAAE;EAChD,OAAO,CAAC,eAAe,EAAE,eAAe,CAAC;AAC3C;AAEA,MAAMC,UAAU,GAAG;EACjBC,IAAI,EAAE,YAAY;EAClBC,MAAM,EAAE,YAAY;EACpBC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,0BAOL,GAAG;EACF,UAAU,EAAE;IACVC,KAAK,EAAE,CAAC,EAAE;IACVC,CAAC,EAAE,CAAC,EAAE;IACNC,CAAC,EAAE,CAAC;EACN,CAAC;EACD,WAAW,EAAE;IACXF,KAAK,EAAE,EAAE;IACTC,CAAC,EAAE,EAAE;IACLC,CAAC,EAAE,CAAC;EACN,CAAC;EACD,cAAc,EAAE;IACdF,KAAK,EAAE,EAAE;IACTC,CAAC,EAAE,EAAE;IACLC,CAAC,EAAE;EACL,CAAC;EACD,aAAa,EAAE;IACbF,KAAK,EAAE,CAAC,EAAE;IACVC,CAAC,EAAE,CAAC,EAAE;IACNC,CAAC,EAAE;EACL;AACF,CAAC;AAEM,SAASC,GAAGA,CAACC,OAA6B,EAAE;EACjD,OAAOC,KAAK,CAACD,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEO,SAASC,KAAKA,CAACD,OAA6B,EAAEE,KAAK,GAAG,KAAK,EAAE;EAClE,MAAM;IAAEC,SAAS,GAAG,UAAU;IAAEC;EAAM,CAAC,GAAGJ,OAAO,CAACK,WAAqB;EACvE,MAAM,CAACC,MAAM,EAAEC,MAAM,CAAC,GAAGlB,QAAQ,CAACW,OAAO,CAAC;EAE1C,MAAMQ,MAAM,GACVJ,KAAK,IAAIb,UAAU,CAACa,KAAK,CAAC,GACtBb,UAAU,CAACa,KAAK,CAAC,GACjBJ,OAAO,CAACQ,MAAM,IAAI,SAAS;EACjC,MAAM;IAAEX,CAAC;IAAEC;EAAE,CAAC,GAAGH,0BAA0B,CAACQ,SAAS,CAAC;EACtD,MAAMM,eAAe,GAAGd,0BAA0B,CAACQ,SAAS,CAAC,CAACP,KAAK;EAEnE,MAAMc,MAAM,GAAG;IACb,iBAAiB,EAAE,GAAGb,CAAC,MAAMC,CAAC,GAAG;IACjC,wBAAwB,EAAE,GAAG,CAACD,CAAC,MAAM,CAACC,CAAC,GAAG;IAC1C,mBAAmB,EAAE,GAAGW,eAAe;EACzC,CAAC;EAED,MAAME,MAAM,GAAG,IAAAC,sBAAe,EAACF,MAAM,EAAE,iBAAiB,EAAER,KAAK,CAAC;EAChE,MAAMW,cAAc,GAAG,IAAAD,sBAAe,EACpCF,MAAM,EACN,wBAAwB,EACxBR,KACF,CAAC;EAED,OAAO,CACL;IACE,GAAGF,OAAO;IACVc,IAAI,EAAER,MAAM;IACZS,QAAQ,EAAEf,OAAO,CAACe,QAAQ,GAAI,GAAG;IACjCP,MAAM,EAAE,QAAQ;IAChBE,MAAM,EAAE,CAAC,CAAC;IACVM,SAAS,EAAE,CACT;MAAEC,MAAM,EAAE,CAAC;MAAEC,OAAO,EAAE;IAAE,CAAC,EACzB;MAAEA,OAAO,EAAE;IAAyB,CAAC;EAEzC,CAAC,EACD;IACE,GAAGlB,OAAO;IACVc,IAAI,EAAEP,MAAM;IACZC,MAAM;IACNE,MAAM;IACNM,SAAS,EAAE,CACT;MACEC,MAAM,EAAEE,2BAAoB;MAC5BC,SAAS,EAAE,aAAaT,MAAM,YAAY,IAAAC,sBAAe,EACvDF,MAAM,EACN,mBAAmB,EACnBR,KACF,CAAC,eAAeW,cAAc;IAChC,CAAC,EACD;MACEO,SAAS,EAAE,aAAaT,MAAM,4BAA4BE,cAAc;IAC1E,CAAC;EAEL,CAAC,CACF;AACH","ignoreList":[]}

package/dist/cjs/library/entrance/WinkIn.js

@@ -0,0 +1,115 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.prepare = prepare;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+function getNames(_) {
+  return ['motion-fadeIn', 'motion-winkInClip', 'motion-winkInRotate'];
+}
+const PARAM_MAP = {
+  vertical: {
+    scaleY: 0,
+    scaleX: 1
+  },
+  horizontal: {
+    scaleY: 1,
+    scaleX: 0
+  }
+};
+const DIRECTIONS = ['vertical', 'horizontal'];
+function web(options, dom) {
+  prepare(options, dom);
+  return style(options);
+}
+function style(options) {
+  const {
+    direction = 'horizontal'
+  } = options.namedEffect;
+  const [fadeIn, winkInClip, winkInRotate] = getNames(options);
+  const adjustedDirection = (0, _utils.getAdjustedDirection)(DIRECTIONS, direction, 0);
+  const {
+    scaleX,
+    scaleY
+  } = PARAM_MAP[adjustedDirection];
+  const easing = options.easing || 'quintInOut';
+  const start = (0, _utils.getClipPolygonParams)({
+    direction,
+    minimum: 100
+  });
+  const end = (0, _utils.getClipPolygonParams)({
+    direction: 'initial'
+  });
+  const custom = {
+    '--motion-scale-x': scaleX,
+    '--motion-scale-y': scaleY,
+    '--motion-clip-start': start
+  };
+  return [{
+    ...options,
+    easing: 'quadOut',
+    name: fadeIn,
+    custom: {},
+    keyframes: [{
+      offset: 0,
+      opacity: 0
+    }, {
+      opacity: 'var(--comp-opacity, 1)'
+    }]
+  }, {
+    ...options,
+    easing,
+    name: winkInClip,
+    custom,
+    keyframes: [{
+      offset: _utils.INITIAL_FRAME_OFFSET,
+      clipPath: `var(--motion-clip-start, ${custom['--motion-clip-start']})`
+    }, {
+      clipPath: end
+    }]
+  }, {
+    ...options,
+    duration: options.duration * 0.85,
+    easing,
+    name: winkInRotate,
+    custom,
+    keyframes: [{
+      offset: _utils.INITIAL_FRAME_OFFSET,
+      transform: `rotate(var(--comp-rotate-z, 0deg)) scale(var(--motion-scale-x, ${custom['--motion-scale-x']}), var(--motion-scale-y, ${custom['--motion-scale-y']}))`
+    }, {
+      transform: 'rotate(var(--comp-rotate-z, 0deg)) scale(1, 1)'
+    }]
+  }];
+}
+function prepare(options, dom) {
+  const {
+    direction = 'horizontal'
+  } = options.namedEffect;
+  if (dom) {
+    let scale = PARAM_MAP.horizontal;
+    let rotatedClip = (0, _utils.getClipPolygonParams)({
+      direction: 'horizontal',
+      minimum: 100
+    });
+    dom.measure(target => {
+      if (!target) {
+        return;
+      }
+      const rotation = getComputedStyle(target).getPropertyValue('--comp-rotate-z') || '0';
+      const rotatedDirection = (0, _utils.getAdjustedDirection)(DIRECTIONS, direction, parseInt(rotation, 10));
+      scale = PARAM_MAP[rotatedDirection];
+      rotatedClip = (0, _utils.getClipPolygonParams)({
+        direction: rotatedDirection,
+        minimum: 100
+      });
+    });
+    dom.mutate(target => {
+      target == null || target.style.setProperty('--motion-clip-start', rotatedClip);
+      target == null || target.style.setProperty('--motion-scale-x', `${scale.scaleX}`);
+      target == null || target.style.setProperty('--motion-scale-y', `${scale.scaleY}`);
+    });
+  }
+}
+//# sourceMappingURL=WinkIn.js.map

package/dist/cjs/library/entrance/WinkIn.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","getNames","_","PARAM_MAP","vertical","scaleY","scaleX","horizontal","DIRECTIONS","web","options","dom","prepare","style","direction","namedEffect","fadeIn","winkInClip","winkInRotate","adjustedDirection","getAdjustedDirection","easing","start","getClipPolygonParams","minimum","end","custom","name","keyframes","offset","opacity","INITIAL_FRAME_OFFSET","clipPath","duration","transform","scale","rotatedClip","measure","target","rotation","getComputedStyle","getPropertyValue","rotatedDirection","parseInt","mutate","setProperty"],"sources":["../../../../src/library/entrance/WinkIn.ts"],"sourcesContent":["import {\n  getClipPolygonParams,\n  getAdjustedDirection,\n  INITIAL_FRAME_OFFSET,\n} from '../../utils';\nimport type { WinkIn, TimeAnimationOptions, DomApi } from '../../types';\n\nexport function getNames(_: TimeAnimationOptions) {\n  return ['motion-fadeIn', 'motion-winkInClip', 'motion-winkInRotate'];\n}\n\nconst PARAM_MAP = {\n  vertical: { scaleY: 0, scaleX: 1 },\n  horizontal: { scaleY: 1, scaleX: 0 },\n};\nconst DIRECTIONS = ['vertical', 'horizontal'] as (keyof typeof PARAM_MAP)[];\n\nexport function web(options: TimeAnimationOptions, dom?: DomApi) {\n  prepare(options, dom);\n\n  return style(options);\n}\n\nexport function style(options: TimeAnimationOptions) {\n  const { direction = 'horizontal' } = options.namedEffect as WinkIn;\n  const [fadeIn, winkInClip, winkInRotate] = getNames(options);\n\n  const adjustedDirection = getAdjustedDirection(\n    DIRECTIONS,\n    direction,\n    0,\n  ) as (typeof DIRECTIONS)[number];\n  const { scaleX, scaleY } = PARAM_MAP[adjustedDirection];\n  const easing = options.easing || 'quintInOut';\n\n  const start = getClipPolygonParams({ direction, minimum: 100 });\n  const end = getClipPolygonParams({ direction: 'initial' });\n\n  const custom = {\n    '--motion-scale-x': scaleX,\n    '--motion-scale-y': scaleY,\n    '--motion-clip-start': start,\n  };\n\n  return [\n    {\n      ...options,\n      easing: 'quadOut',\n      name: fadeIn,\n      custom: {},\n      keyframes: [\n        { offset: 0, opacity: 0 },\n        { opacity: 'var(--comp-opacity, 1)' },\n      ],\n    },\n    {\n      ...options,\n      easing,\n      name: winkInClip,\n      custom,\n      keyframes: [\n        {\n          offset: INITIAL_FRAME_OFFSET,\n          clipPath: `var(--motion-clip-start, ${custom['--motion-clip-start']})`,\n        },\n        {\n          clipPath: end,\n        },\n      ],\n    },\n    {\n      ...options,\n      duration: options.duration! * 0.85,\n      easing,\n      name: winkInRotate,\n      custom,\n      keyframes: [\n        {\n          offset: INITIAL_FRAME_OFFSET,\n          transform: `rotate(var(--comp-rotate-z, 0deg)) scale(var(--motion-scale-x, ${custom['--motion-scale-x']}), var(--motion-scale-y, ${custom['--motion-scale-y']}))`,\n        },\n        {\n          transform: 'rotate(var(--comp-rotate-z, 0deg)) scale(1, 1)',\n        },\n      ],\n    },\n  ];\n}\n\nexport function prepare(options: TimeAnimationOptions, dom?: DomApi) {\n  const { direction = 'horizontal' } = options.namedEffect as WinkIn;\n\n  if (dom) {\n    let scale = PARAM_MAP.horizontal;\n    let rotatedClip = getClipPolygonParams({\n      direction: 'horizontal',\n      minimum: 100,\n    });\n\n    dom.measure((target) => {\n      if (!target) {\n        return;\n      }\n\n      const rotation =\n        getComputedStyle(target).getPropertyValue('--comp-rotate-z') || '0';\n      const rotatedDirection = getAdjustedDirection(\n        DIRECTIONS,\n        direction,\n        parseInt(rotation, 10),\n      ) as (typeof DIRECTIONS)[number];\n      scale = PARAM_MAP[rotatedDirection];\n      rotatedClip = getClipPolygonParams({\n        direction: rotatedDirection,\n        minimum: 100,\n      });\n    });\n\n    dom.mutate((target) => {\n      target?.style.setProperty('--motion-clip-start', rotatedClip);\n      target?.style.setProperty('--motion-scale-x', `${scale.scaleX}`);\n      target?.style.setProperty('--motion-scale-y', `${scale.scaleY}`);\n    });\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/library/entrance/index.js

@@ -0,0 +1,55 @@
+"use strict";
+
+exports.__esModule = true;
+exports.entranceAnimations = void 0;
+var ArcIn = _interopRequireWildcard(require("./ArcIn"));
+var BlurIn = _interopRequireWildcard(require("./BlurIn"));
+var ShuttersIn = _interopRequireWildcard(require("./ShuttersIn"));
+var BounceIn = _interopRequireWildcard(require("./BounceIn"));
+var CurveIn = _interopRequireWildcard(require("./CurveIn"));
+var CircleIn = _interopRequireWildcard(require("./CircleIn"));
+var DropIn = _interopRequireWildcard(require("./DropIn"));
+var ExpandIn = _interopRequireWildcard(require("./ExpandIn"));
+var FadeIn = _interopRequireWildcard(require("./FadeIn"));
+var FlipIn = _interopRequireWildcard(require("./FlipIn"));
+var FloatIn = _interopRequireWildcard(require("./FloatIn"));
+var FoldIn = _interopRequireWildcard(require("./FoldIn"));
+var GlideIn = _interopRequireWildcard(require("./GlideIn"));
+var GlitchIn = _interopRequireWildcard(require("./GlitchIn"));
+var GrowIn = _interopRequireWildcard(require("./GrowIn"));
+var PunchIn = _interopRequireWildcard(require("./PunchIn"));
+var ShapeIn = _interopRequireWildcard(require("./ShapeIn"));
+var RevealIn = _interopRequireWildcard(require("./RevealIn"));
+var SlideIn = _interopRequireWildcard(require("./SlideIn"));
+var SpinIn = _interopRequireWildcard(require("./SpinIn"));
+var TiltIn = _interopRequireWildcard(require("./TiltIn"));
+var TurnIn = _interopRequireWildcard(require("./TurnIn"));
+var WinkIn = _interopRequireWildcard(require("./WinkIn"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const entranceAnimations = exports.entranceAnimations = {
+  ArcIn,
+  BlurIn,
+  ShuttersIn,
+  BounceIn,
+  CurveIn,
+  CircleIn,
+  DropIn,
+  ExpandIn,
+  FadeIn,
+  FlipIn,
+  FloatIn,
+  FoldIn,
+  GlideIn,
+  GlitchIn,
+  GrowIn,
+  PunchIn,
+  ShapeIn,
+  RevealIn,
+  SlideIn,
+  SpinIn,
+  TiltIn,
+  TurnIn,
+  WinkIn
+};
+//# sourceMappingURL=index.js.map

package/dist/cjs/library/entrance/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ArcIn","_interopRequireWildcard","require","BlurIn","ShuttersIn","BounceIn","CurveIn","CircleIn","DropIn","ExpandIn","FadeIn","FlipIn","FloatIn","FoldIn","GlideIn","GlitchIn","GrowIn","PunchIn","ShapeIn","RevealIn","SlideIn","SpinIn","TiltIn","TurnIn","WinkIn","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","entranceAnimations","exports"],"sources":["../../../../src/library/entrance/index.ts"],"sourcesContent":["import * as ArcIn from './ArcIn';\nimport * as BlurIn from './BlurIn';\nimport * as ShuttersIn from './ShuttersIn';\nimport * as BounceIn from './BounceIn';\nimport * as CurveIn from './CurveIn';\nimport * as CircleIn from './CircleIn';\nimport * as DropIn from './DropIn';\nimport * as ExpandIn from './ExpandIn';\nimport * as FadeIn from './FadeIn';\nimport * as FlipIn from './FlipIn';\nimport * as FloatIn from './FloatIn';\nimport * as FoldIn from './FoldIn';\nimport * as GlideIn from './GlideIn';\nimport * as GlitchIn from './GlitchIn';\nimport * as GrowIn from './GrowIn';\nimport * as PunchIn from './PunchIn';\nimport * as ShapeIn from './ShapeIn';\nimport * as RevealIn from './RevealIn';\nimport * as SlideIn from './SlideIn';\nimport * as SpinIn from './SpinIn';\nimport * as TiltIn from './TiltIn';\nimport * as TurnIn from './TurnIn';\nimport * as WinkIn from './WinkIn';\nimport type { EntranceAnimations } from '../../types';\n\nexport const entranceAnimations: EntranceAnimations = {\n  ArcIn,\n  BlurIn,\n  ShuttersIn,\n  BounceIn,\n  CurveIn,\n  CircleIn,\n  DropIn,\n  ExpandIn,\n  FadeIn,\n  FlipIn,\n  FloatIn,\n  FoldIn,\n  GlideIn,\n  GlitchIn,\n  GrowIn,\n  PunchIn,\n  ShapeIn,\n  RevealIn,\n  SlideIn,\n  SpinIn,\n  TiltIn,\n  TurnIn,\n  WinkIn,\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/library/entrance/test/testUtils.js

@@ -0,0 +1,9 @@
+"use strict";
+
+exports.__esModule = true;
+exports.baseMockOptions = void 0;
+const baseMockOptions = exports.baseMockOptions = {
+  id: '1',
+  type: 'TimeAnimationOptions'
+};
+//# sourceMappingURL=testUtils.js.map

package/dist/cjs/library/entrance/test/testUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["baseMockOptions","exports","id","type"],"sources":["../../../../../src/library/entrance/test/testUtils.ts"],"sourcesContent":["import type { TimeAnimationOptions } from '../../../types';\n\nexport const baseMockOptions: TimeAnimationOptions = {\n  id: '1',\n  type: 'TimeAnimationOptions',\n};\n"],"mappings":";;;;AAEO,MAAMA,eAAqC,GAAAC,OAAA,CAAAD,eAAA,GAAG;EACnDE,EAAE,EAAE,GAAG;EACPC,IAAI,EAAE;AACR,CAAC","ignoreList":[]}

package/dist/cjs/library/mouse/AiryMouse.js

@@ -0,0 +1,76 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = create;
+var _utils = require("../../utils");
+var _CustomMouse = require("./CustomMouse");
+const paramsMap = {
+  soft: {
+    angle: 10,
+    easing: 'easeOut'
+  },
+  medium: {
+    angle: 50,
+    easing: 'easeOut'
+  },
+  hard: {
+    angle: 85,
+    easing: 'easeOut'
+  }
+};
+class AiryMouseAnimation extends _CustomMouse.CustomMouse {
+  progress({
+    x: progressX,
+    y: progressY
+  }) {
+    let translateX = 0;
+    let translateY = 0;
+    const {
+      distance,
+      invert,
+      angle,
+      axis
+    } = this.options;
+    if (axis !== 'vertical') {
+      translateX = (0, _utils.mapRange)(0, 1, -distance.value, distance.value, progressX) * invert;
+    }
+    if (axis !== 'horizontal') {
+      translateY = (0, _utils.mapRange)(0, 1, -distance.value, distance.value, progressY) * invert;
+    }
+
+    // if progress  === 0, rotate === angle, if progress === 0.5, rotate === 0, if progress === 1, rotate === angle
+    const rotate = (0, _utils.mapRange)(0, 1, -angle, angle, progressX) * invert;
+    const units = (0, _utils.getCssUnits)(distance.type);
+    this.target.style.transform = `translateX(${translateX}${units}) translateY(${translateY}${units}) rotate(calc(${rotate}deg + var(--comp-rotate-z, 0deg)))`;
+  }
+  cancel() {
+    this.target.style.transform = '';
+    this.target.style.transition = '';
+  }
+}
+function create(options) {
+  const {
+    transitionDuration,
+    transitionEasing
+  } = options;
+  const {
+    power,
+    inverted = false,
+    distance = {
+      value: 200,
+      type: 'px'
+    },
+    angle = 30,
+    axis = 'both'
+  } = options.namedEffect;
+  const invert = inverted ? -1 : 1;
+  const animationOptions = {
+    transition: transitionDuration ? `transform ${transitionDuration}ms ${(0, _utils.getMouseTransitionEasing)(power ? paramsMap[power].easing : transitionEasing)}` : '',
+    invert,
+    distance,
+    angle: power ? paramsMap[power].angle : angle,
+    axis
+  };
+  return target => new AiryMouseAnimation(target, animationOptions);
+}
+//# sourceMappingURL=AiryMouse.js.map

package/dist/cjs/library/mouse/AiryMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","_CustomMouse","paramsMap","soft","angle","easing","medium","hard","AiryMouseAnimation","CustomMouse","progress","x","progressX","y","progressY","translateX","translateY","distance","invert","axis","options","mapRange","value","rotate","units","getCssUnits","type","target","style","transform","cancel","transition","create","transitionDuration","transitionEasing","power","inverted","namedEffect","animationOptions","getMouseTransitionEasing"],"sources":["../../../../src/library/mouse/AiryMouse.ts"],"sourcesContent":["import { getCssUnits, getMouseTransitionEasing, mapRange } from '../../utils';\nimport type {\n  ScrubAnimationOptions,\n  AiryMouse,\n  AnimationExtraOptions,\n  Progress,\n  ScrubTransitionEasing,\n  EffectPower,\n} from '../../types';\nimport { CustomMouse } from './CustomMouse';\n\nconst paramsMap: Record<\n  EffectPower,\n  { angle: number; easing: ScrubTransitionEasing }\n> = {\n  soft: { angle: 10, easing: 'easeOut' },\n  medium: { angle: 50, easing: 'easeOut' },\n  hard: { angle: 85, easing: 'easeOut' },\n};\n\nclass AiryMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    let translateX = 0;\n    let translateY = 0;\n    const { distance, invert, angle, axis } = this.options;\n\n    if (axis !== 'vertical') {\n      translateX =\n        mapRange(0, 1, -distance.value, distance.value, progressX) * invert;\n    }\n    if (axis !== 'horizontal') {\n      translateY =\n        mapRange(0, 1, -distance.value, distance.value, progressY) * invert;\n    }\n\n    // if progress  === 0, rotate === angle, if progress === 0.5, rotate === 0, if progress === 1, rotate === angle\n    const rotate = mapRange(0, 1, -angle, angle, progressX) * invert;\n    const units = getCssUnits(distance.type);\n\n    this.target.style.transform = `translateX(${translateX}${units}) translateY(${translateY}${units}) rotate(calc(${rotate}deg + var(--comp-rotate-z, 0deg)))`;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing } = options;\n  const {\n    power,\n    inverted = false,\n    distance = { value: 200, type: 'px' },\n    angle = 30,\n    axis = 'both',\n  } = options.namedEffect as AiryMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[power].easing : transitionEasing,\n        )}`\n      : '',\n    invert,\n    distance,\n    angle: power ? paramsMap[power].angle : angle,\n    axis,\n  };\n\n  return (target: HTMLElement) =>\n    new AiryMouseAnimation(target, animationOptions);\n}\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AASA,IAAAC,YAAA,GAAAD,OAAA;AAEA,MAAME,SAGL,GAAG;EACFC,IAAI,EAAE;IAAEC,KAAK,EAAE,EAAE;IAAEC,MAAM,EAAE;EAAU,CAAC;EACtCC,MAAM,EAAE;IAAEF,KAAK,EAAE,EAAE;IAAEC,MAAM,EAAE;EAAU,CAAC;EACxCE,IAAI,EAAE;IAAEH,KAAK,EAAE,EAAE;IAAEC,MAAM,EAAE;EAAU;AACvC,CAAC;AAED,MAAMG,kBAAkB,SAASC,wBAAW,CAAC;EAC3CC,QAAQA,CAAC;IAAEC,CAAC,EAAEC,SAAS;IAAEC,CAAC,EAAEC;EAAoB,CAAC,EAAE;IACjD,IAAIC,UAAU,GAAG,CAAC;IAClB,IAAIC,UAAU,GAAG,CAAC;IAClB,MAAM;MAAEC,QAAQ;MAAEC,MAAM;MAAEd,KAAK;MAAEe;IAAK,CAAC,GAAG,IAAI,CAACC,OAAO;IAEtD,IAAID,IAAI,KAAK,UAAU,EAAE;MACvBJ,UAAU,GACR,IAAAM,eAAQ,EAAC,CAAC,EAAE,CAAC,EAAE,CAACJ,QAAQ,CAACK,KAAK,EAAEL,QAAQ,CAACK,KAAK,EAAEV,SAAS,CAAC,GAAGM,MAAM;IACvE;IACA,IAAIC,IAAI,KAAK,YAAY,EAAE;MACzBH,UAAU,GACR,IAAAK,eAAQ,EAAC,CAAC,EAAE,CAAC,EAAE,CAACJ,QAAQ,CAACK,KAAK,EAAEL,QAAQ,CAACK,KAAK,EAAER,SAAS,CAAC,GAAGI,MAAM;IACvE;;IAEA;IACA,MAAMK,MAAM,GAAG,IAAAF,eAAQ,EAAC,CAAC,EAAE,CAAC,EAAE,CAACjB,KAAK,EAAEA,KAAK,EAAEQ,SAAS,CAAC,GAAGM,MAAM;IAChE,MAAMM,KAAK,GAAG,IAAAC,kBAAW,EAACR,QAAQ,CAACS,IAAI,CAAC;IAExC,IAAI,CAACC,MAAM,CAACC,KAAK,CAACC,SAAS,GAAG,cAAcd,UAAU,GAAGS,KAAK,gBAAgBR,UAAU,GAAGQ,KAAK,iBAAiBD,MAAM,oCAAoC;EAC7J;EAEAO,MAAMA,CAAA,EAAG;IACP,IAAI,CAACH,MAAM,CAACC,KAAK,CAACC,SAAS,GAAG,EAAE;IAChC,IAAI,CAACF,MAAM,CAACC,KAAK,CAACG,UAAU,GAAG,EAAE;EACnC;AACF;AAEe,SAASC,MAAMA,CAC5BZ,OAAsD,EACtD;EACA,MAAM;IAAEa,kBAAkB;IAAEC;EAAiB,CAAC,GAAGd,OAAO;EACxD,MAAM;IACJe,KAAK;IACLC,QAAQ,GAAG,KAAK;IAChBnB,QAAQ,GAAG;MAAEK,KAAK,EAAE,GAAG;MAAEI,IAAI,EAAE;IAAK,CAAC;IACrCtB,KAAK,GAAG,EAAE;IACVe,IAAI,GAAG;EACT,CAAC,GAAGC,OAAO,CAACiB,WAAwB;EACpC,MAAMnB,MAAM,GAAGkB,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC;EAChC,MAAME,gBAAgB,GAAG;IACvBP,UAAU,EAAEE,kBAAkB,GAC1B,aAAaA,kBAAkB,MAAM,IAAAM,+BAAwB,EAC3DJ,KAAK,GAAGjC,SAAS,CAACiC,KAAK,CAAC,CAAC9B,MAAM,GAAG6B,gBACpC,CAAC,EAAE,GACH,EAAE;IACNhB,MAAM;IACND,QAAQ;IACRb,KAAK,EAAE+B,KAAK,GAAGjC,SAAS,CAACiC,KAAK,CAAC,CAAC/B,KAAK,GAAGA,KAAK;IAC7Ce;EACF,CAAC;EAED,OAAQQ,MAAmB,IACzB,IAAInB,kBAAkB,CAACmB,MAAM,EAAEW,gBAAgB,CAAC;AACpD","ignoreList":[]}