@react-av/editor
Version:
Editor Timeline Components built on React AV.
52 lines • 4.42 kB
JavaScript
;
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.PlayheadLine = exports.TimelineElement = exports.DraftElement = exports.DragElement = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const Editor_1 = require("./Editor");
exports.DragElement = (0, react_1.forwardRef)(function DragElement(_a, ref) {
var { className, selected, children, style, base } = _a, props = __rest(_a, ["className", "selected", "children", "style", "base"]);
const { styling } = (0, Editor_1.useEditorContext)();
const baseStyling = base !== null && base !== void 0 ? base : styling === null || styling === void 0 ? void 0 : styling.timelineDragElementBase;
return (0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, props, { className: [
className ? className : '',
selected
? typeof (styling === null || styling === void 0 ? void 0 : styling.timelineDragElementSelected) === 'string' ? styling.timelineDragElementSelected : ''
: typeof baseStyling === 'string' ? baseStyling : ''
].join(' '), style: Object.assign(Object.assign(Object.assign({ top: 0 }, (selected
? typeof (styling === null || styling === void 0 ? void 0 : styling.timelineDragElementSelected) === 'string' ? {} : styling === null || styling === void 0 ? void 0 : styling.timelineDragElementSelected
: typeof baseStyling === 'string' ? {} : baseStyling)), { position: 'absolute', height: 'calc(40px - 1rem)', textOverflow: 'ellipsis', whiteSpace: 'nowrap', overflow: 'hidden', outline: 'none' }), style), children: children }));
});
exports.DraftElement = (0, react_1.forwardRef)(function DraftElement(_a, ref) {
var { children } = _a, props = __rest(_a, ["children"]);
const { styling } = (0, Editor_1.useEditorContext)();
return (0, jsx_runtime_1.jsx)(exports.DragElement, Object.assign({}, props, { ref: ref, base: styling === null || styling === void 0 ? void 0 : styling.timelineDraftElementBase, children: children }));
});
exports.TimelineElement = (0, react_1.forwardRef)(function TimelineElement(_a, ref) {
var { className, children, style } = _a, props = __rest(_a, ["className", "children", "style"]);
const { styling } = (0, Editor_1.useEditorContext)();
return (0, jsx_runtime_1.jsx)(exports.DragElement, Object.assign({}, props, { ref: ref, base: styling === null || styling === void 0 ? void 0 : styling.timelineTimelineElementBase, className: [
className ? className : '',
typeof (styling === null || styling === void 0 ? void 0 : styling.timelineTimelineElement) === 'string' ? styling.timelineTimelineElement : ''
].join(' '), style: Object.assign(Object.assign({}, (typeof (styling === null || styling === void 0 ? void 0 : styling.timelineTimelineElement) === 'string' ? {} : styling === null || styling === void 0 ? void 0 : styling.timelineTimelineElement)), style), children: children }));
});
exports.PlayheadLine = (0, react_1.forwardRef)(function PlayheadLine(_a, ref) {
var { className, children, style } = _a, props = __rest(_a, ["className", "children", "style"]);
const { styling } = (0, Editor_1.useEditorContext)();
return (0, jsx_runtime_1.jsx)("div", Object.assign({}, props, { ref: ref, style: Object.assign(Object.assign({}, (typeof (styling === null || styling === void 0 ? void 0 : styling.timelinePlayheadLine) === 'string' ? {} : styling === null || styling === void 0 ? void 0 : styling.timelinePlayheadLine)), { left: '50%', transform: 'translateX(-50%)', zIndex: 2, position: 'absolute' }), className: [
className ? className : '',
typeof (styling === null || styling === void 0 ? void 0 : styling.timelinePlayheadLine) === 'string' ? styling.timelinePlayheadLine : ''
].join(' '), children: children }));
});
//# sourceMappingURL=TimelineElements.js.map