tandem-front-end
Version:
Visual editor for web components
117 lines • 3.47 kB
JavaScript
// import * as React from "react";
// import { Dispatch } from "redux";
// import { compose, pure, withHandlers } from "recompose";
// import {
// SyntheticVisibleNode,
// getSyntheticVisibleNodeSourceComponent,
// getComponentInstanceSyntheticVisibleNode,
// getSyntheticVisibleNodeOriginComponent,
// getSyntheticSourceNode,
// getComponentInstanceSourceNode,
// getSourceNodeById,
// isComponentInstanceSourceNode,
// PCVisibleNode,
// PCSourceNamespaces,
// getComponentVariants
// } from "paperclip";
// import { RootState } from "../../../../../state";
// import { elementVariantToggled } from "../../../../../actions";
// const { VariantOption: BaseVariantOption } = require("./index.pc");
// type VariantOptionProps = {
// name: string;
// checked: boolean;
// onChange: (name: string) => any;
// };
// const VariantOption = compose<VariantOptionProps, VariantOptionProps>(pure)(
// ({ name, checked, onChange }) => {
// return (
// <BaseVariantOption
// checkboxContainerChildren={
// <input
// type="checkbox"
// checked={checked}
// onClick={() => onChange(name)}
// />
// }
// nameContainerChildren={name}
// />
// );
// }
// );
// type VariantInputOuterProps = {
// node: SyntheticVisibleNode;
// root: RootState;
// dispatch: Dispatch<any>;
// };
// type VariantInputInnerProps = {
// onVariantToggle: (name: string) => any;
// } & VariantInputOuterProps;
// const getVariant = (node: SyntheticVisibleNode, root: RootState) => {
// const sourceNode = getSyntheticSourceNode(
// node.id,
// root.browser
// ) as PCVisibleNode;
// return sourceNode.attributes.core.variants || [];
// };
// export const BaseVariantInput = ({
// node,
// root,
// onVariantToggle
// }: VariantInputInnerProps) => {
// const sourceNode = getSyntheticSourceNode(node.id, root.browser);
// if (1 + 1) {
// return null;
// }
// if (!isComponentInstanceSourceNode(sourceNode)) {
// return null;
// }
// const originComponent = getSyntheticVisibleNodeOriginComponent(
// node.id,
// root.browser
// );
// const component = getSyntheticVisibleNodeSourceComponent(node.id, root.browser);
// if (originComponent.id === component.id) {
// return null;
// }
// const variants = getVariant(node, root);
// return (
// <div>
// Variant:{" "}
// {getComponentVariants(originComponent).map(
// ({
// attributes: {
// [PCSourceNamespaces.CORE]: { name }
// }
// }) => {
// return (
// <VariantOption
// key={name}
// name={name}
// checked={variants.indexOf(name) !== -1}
// onChange={onVariantToggle}
// />
// );
// }
// )}
// </div>
// );
// };
// export const VariantInput = compose<
// VariantInputInnerProps,
// VariantInputOuterProps
// >(
// pure,
// withHandlers({
// onVariantToggle: ({ dispatch, node, root }) => (name: string) => {
// const variants = [...getVariant(node, root)];
// let i = variants.indexOf(name);
// if (i !== -1) {
// variants.splice(i, 1);
// } else {
// variants.push(name);
// }
// dispatch(elementVariantToggled(variants, node));
// }
// })
// )(BaseVariantInput);
//# sourceMappingURL=index.js.map