You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
131 lines
7.2 KiB
131 lines
7.2 KiB
"use strict";
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
Object.defineProperty(exports, "BounceAndSpin", {
|
|
enumerable: true,
|
|
get: function() {
|
|
return BounceAndSpin;
|
|
}
|
|
});
|
|
var _assert_this_initialized = require("@swc/helpers/_/_assert_this_initialized");
|
|
var _class_call_check = require("@swc/helpers/_/_class_call_check");
|
|
var _define_property = require("@swc/helpers/_/_define_property");
|
|
var _inherits = require("@swc/helpers/_/_inherits");
|
|
var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
|
var _object_spread = require("@swc/helpers/_/_object_spread");
|
|
var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
|
|
var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
|
|
var _create_super = require("@swc/helpers/_/_create_super");
|
|
var _lodash = require("lodash");
|
|
var _defaultTheme = /*#__PURE__*/ _interop_require_default._(require("tailwindcss/defaultTheme"));
|
|
var _base = require("./base");
|
|
var _transform = require("../css-utilities/transform");
|
|
var _translate = require("../css-utilities/translate");
|
|
var _cssvalue = require("../utils/css-value");
|
|
var _generateguard = require("../utils/generate-guard");
|
|
var _lodashtransformers = require("../utils/lodash-transformers");
|
|
var BounceAndSpin = /*#__PURE__*/ function(Base) {
|
|
"use strict";
|
|
_inherits._(BounceAndSpin, Base);
|
|
var _super = _create_super._(BounceAndSpin);
|
|
function BounceAndSpin() {
|
|
_class_call_check._(this, BounceAndSpin);
|
|
var _this;
|
|
_this = _super.apply(this, arguments);
|
|
_define_property._(_assert_this_initialized._(_this), "isProcessablePrimitive", (0, _generateguard.generateGuard)(_lodash.isString, _lodash.isUndefined));
|
|
_define_property._(_assert_this_initialized._(_this), "isProcessableValue", (0, _generateguard.generateGuard)([
|
|
_lodash.isArray,
|
|
function(maybe) {
|
|
return maybe.length === 2;
|
|
},
|
|
function(maybe) {
|
|
return (0, _lodash.every)((0, _lodash.values)(maybe), _this.isProcessablePrimitive);
|
|
}
|
|
]));
|
|
_define_property._(_assert_this_initialized._(_this), "isProcessableValues", (0, _generateguard.generateGuard)([
|
|
_lodash.isPlainObject,
|
|
function(maybe) {
|
|
return (0, _lodash.every)((0, _lodash.keys)(maybe), _lodash.isString);
|
|
},
|
|
function(maybe) {
|
|
return (0, _lodash.every)((0, _lodash.values)(maybe), _this.isProcessableValue);
|
|
}
|
|
]));
|
|
_define_property._(_assert_this_initialized._(_this), "normaliseValues", function(values) {
|
|
return _this.isProcessableValues(values) ? (0, _lodash.chain)(values).mapKeys(function(_value, modifier) {
|
|
return (0, _cssvalue.normaliseNumberValue)(modifier);
|
|
}).mapValues(function(param) {
|
|
var _param = _sliced_to_array._(param, 2), duration = _param[0], distance = _param[1];
|
|
return [
|
|
(0, _cssvalue.normaliseTimeValue)(duration),
|
|
(0, _cssvalue.normaliseLengthPercentageValue)(distance)
|
|
];
|
|
}).pickBy(function(value, modifier) {
|
|
var _value = _sliced_to_array._(value, 2), duration = _value[0], distance = _value[1];
|
|
return (0, _lodash.isString)(modifier) && modifier !== "" && (0, _lodash.isString)(duration) && (0, _lodash.isString)(distance);
|
|
}).value() : {};
|
|
});
|
|
_define_property._(_assert_this_initialized._(_this), "defaultTheme", _this.normaliseValues((0, _lodash.chain)(_defaultTheme.default.spacing).transform((0, _lodashtransformers.addDurationWithGravity)(), {}).mapValues(function(param) {
|
|
var distance = param.value, duration = param.duration;
|
|
return [
|
|
duration,
|
|
distance
|
|
];
|
|
}).value()));
|
|
_define_property._(_assert_this_initialized._(_this), "keyframes", function(param) {
|
|
var theme = param.theme;
|
|
var values = _this.normaliseValues(theme("bounceAndSpin"));
|
|
var translateDeclarations = function(axis, value) {
|
|
var translateProperty = "translate".concat(axis.toUpperCase());
|
|
return {
|
|
translate: _translate.Translate.normaliseFunctionValues(_define_property._({}, translateProperty, value))
|
|
};
|
|
};
|
|
var rotateDeclarations = function(axis, value) {
|
|
if (axis === "z") {
|
|
return {
|
|
rotate: value
|
|
};
|
|
}
|
|
var rotateProperty = "rotate".concat(axis.toUpperCase());
|
|
var transformValue = _transform.Transform.normaliseFunctionValues(_define_property._({}, rotateProperty, value));
|
|
return {
|
|
"--webkit-transform": transformValue,
|
|
transform: transformValue
|
|
};
|
|
};
|
|
return (0, _lodash.chain)(values).transform((0, _lodashtransformers.axesModifier)()).transform((0, _lodashtransformers.nameModifier)("bounce-and-spin")).transform((0, _lodashtransformers.signModifier)()).mapValues(function(param) {
|
|
var _param_value = _sliced_to_array._(param.value, 2), _duration = _param_value[0], distance = _param_value[1], axis = param.axis, sign = param.sign;
|
|
return {
|
|
"0%, 100%": _object_spread_props._(_object_spread._({}, translateDeclarations(axis, "0")), {
|
|
animationTimingFunction: "cubic-bezier(0, 0, 0.2, 1)"
|
|
}),
|
|
"0%, 5%": _object_spread_props._(_object_spread._({}, rotateDeclarations(axis, "0deg")), {
|
|
animationTimingFunction: "ease-in"
|
|
}),
|
|
"50%": _object_spread_props._(_object_spread._({}, translateDeclarations(axis, "".concat(sign).concat(distance))), {
|
|
animationTimingFunction: "cubic-bezier(0.8, 0, 1, 1)"
|
|
}),
|
|
"50.1%": _object_spread_props._(_object_spread._({}, rotateDeclarations(axis, "".concat(sign, "180deg"))), {
|
|
animationTimingFunction: "linear"
|
|
}),
|
|
"95%, 100%": _object_spread_props._(_object_spread._({}, rotateDeclarations(axis, "".concat(sign, "360deg"))), {
|
|
animationTimingFunction: "ease-out"
|
|
})
|
|
};
|
|
}).value();
|
|
});
|
|
_define_property._(_assert_this_initialized._(_this), "animation", function(param) {
|
|
var theme = param.theme;
|
|
var values = _this.normaliseValues(theme("bounceAndSpin"));
|
|
return (0, _lodash.chain)(values).transform((0, _lodashtransformers.axesModifier)()).transform((0, _lodashtransformers.nameModifier)("bounce-and-spin")).transform((0, _lodashtransformers.signModifier)()).mapValues(function(param, modifier) {
|
|
var _param_value = _sliced_to_array._(param.value, 1), duration = _param_value[0];
|
|
return "".concat(modifier, " ").concat(duration, " infinite");
|
|
}).value();
|
|
});
|
|
return _this;
|
|
}
|
|
return BounceAndSpin;
|
|
}(_base.Base);
|