@react-av/editor
Version:
Editor Timeline Components built on React AV.
49 lines • 4.07 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;
};
import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef } from "react";
import { useEditorContext } from "./Editor";
export const DragElement = forwardRef(function DragElement(_a, ref) {
var { className, selected, children, style, base } = _a, props = __rest(_a, ["className", "selected", "children", "style", "base"]);
const { styling } = useEditorContext();
const baseStyling = base !== null && base !== void 0 ? base : styling === null || styling === void 0 ? void 0 : styling.timelineDragElementBase;
return _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 }));
});
export const DraftElement = forwardRef(function DraftElement(_a, ref) {
var { children } = _a, props = __rest(_a, ["children"]);
const { styling } = useEditorContext();
return _jsx(DragElement, Object.assign({}, props, { ref: ref, base: styling === null || styling === void 0 ? void 0 : styling.timelineDraftElementBase, children: children }));
});
export const TimelineElement = forwardRef(function TimelineElement(_a, ref) {
var { className, children, style } = _a, props = __rest(_a, ["className", "children", "style"]);
const { styling } = useEditorContext();
return _jsx(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 }));
});
export const PlayheadLine = forwardRef(function PlayheadLine(_a, ref) {
var { className, children, style } = _a, props = __rest(_a, ["className", "children", "style"]);
const { styling } = useEditorContext();
return _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