@seed-design/figma 0.0.21 → 0.0.22

package/lib/codegen/targets/react/index.d.ts

@@ -0,0 +1,270 @@
+import * as FigmaRestSpec from '@figma/rest-api-spec';
+
+type NormalizedIsLayerTrait = Pick<FigmaRestSpec.IsLayerTrait, "type" | "id" | "name" | "boundVariables">;
+type NormalizedCornerTrait = Pick<FigmaRestSpec.CornerTrait, "cornerRadius" | "rectangleCornerRadii">;
+type NormalizedHasChildrenTrait = {
+    children: NormalizedSceneNode[];
+};
+type NormalizedHasLayoutTrait = Pick<FigmaRestSpec.HasLayoutTrait, "layoutAlign" | "layoutGrow" | "absoluteBoundingBox" | "relativeTransform" | "layoutPositioning" | "layoutSizingHorizontal" | "layoutSizingVertical" | "minHeight" | "minWidth" | "maxHeight" | "maxWidth">;
+type NormalizedHasGeometryTrait = Pick<FigmaRestSpec.HasGeometryTrait, "fills" | "strokes" | "strokeWeight" | "styles">;
+type NormalizedHasFramePropertiesTrait = Pick<FigmaRestSpec.HasFramePropertiesTrait, "layoutMode" | "layoutWrap" | "paddingLeft" | "paddingRight" | "paddingTop" | "paddingBottom" | "primaryAxisAlignItems" | "primaryAxisSizingMode" | "counterAxisAlignItems" | "counterAxisSizingMode" | "itemSpacing" | "counterAxisSpacing">;
+interface NormalizedTextSegment {
+    characters: string;
+    start: number;
+    end: number;
+    style: {
+        fontFamily?: string;
+        fontWeight?: number;
+        fontSize?: number;
+        italic?: boolean;
+        textDecoration?: string;
+        letterSpacing?: number;
+        lineHeight?: number | {
+            unit: string;
+            value: number;
+        };
+    };
+}
+type NormalizedTypePropertiesTrait = Pick<FigmaRestSpec.TypePropertiesTrait, "style" | "characters"> & {
+    segments: NormalizedTextSegment[];
+    textStyleKey?: string;
+};
+type NormalizedDefaultShapeTrait = NormalizedIsLayerTrait & NormalizedHasLayoutTrait & NormalizedHasGeometryTrait;
+type NormalizedFrameTrait = NormalizedIsLayerTrait & NormalizedHasLayoutTrait & NormalizedHasGeometryTrait & NormalizedHasChildrenTrait & NormalizedCornerTrait & NormalizedHasFramePropertiesTrait;
+interface NormalizedFrameNode extends NormalizedFrameTrait {
+    type: FigmaRestSpec.FrameNode["type"];
+}
+interface NormalizedRectangleNode extends NormalizedDefaultShapeTrait, NormalizedCornerTrait {
+    type: FigmaRestSpec.RectangleNode["type"];
+}
+interface NormalizedTextNode extends NormalizedDefaultShapeTrait, NormalizedTypePropertiesTrait {
+    type: FigmaRestSpec.TextNode["type"];
+}
+interface NormalizedComponentNode extends NormalizedFrameTrait {
+    type: FigmaRestSpec.ComponentNode["type"];
+}
+interface NormalizedInstanceNode extends NormalizedFrameTrait {
+    type: FigmaRestSpec.InstanceNode["type"];
+    componentProperties: {
+        [key: string]: FigmaRestSpec.ComponentProperty & {
+            componentKey?: string;
+            componentSetKey?: string;
+        };
+    };
+    componentKey: string;
+    componentSetKey?: string;
+    children: NormalizedSceneNode[];
+}
+interface NormalizedVectorNode extends NormalizedDefaultShapeTrait, NormalizedCornerTrait {
+    type: FigmaRestSpec.VectorNode["type"];
+}
+interface NormalizedBooleanOperationNode extends NormalizedIsLayerTrait, NormalizedHasChildrenTrait, NormalizedHasLayoutTrait, NormalizedHasGeometryTrait {
+    type: FigmaRestSpec.BooleanOperationNode["type"];
+}
+interface NormalizedUnhandledNode {
+    type: "UNHANDLED";
+    id: string;
+    original: FigmaRestSpec.Node | SceneNode;
+}
+type NormalizedSceneNode = NormalizedFrameNode | NormalizedRectangleNode | NormalizedTextNode | NormalizedComponentNode | NormalizedInstanceNode | NormalizedVectorNode | NormalizedBooleanOperationNode | NormalizedUnhandledNode;
+
+interface CodegenOptions {
+    shouldInferAutoLayout: boolean;
+    shouldInferVariableName: boolean;
+}
+
+interface ElementNode {
+    __IS_JSX_ELEMENT_NODE: true;
+    tag: string;
+    props: Record<string, string | number | boolean | ElementNode | object | undefined>;
+    children: (ElementNode | string)[];
+    comment?: string;
+    source?: string;
+}
+
+type ElementTransformer<T extends NormalizedSceneNode> = (node: T, traverse: (node: NormalizedSceneNode) => ElementNode | undefined) => ElementNode | undefined;
+
+interface ComponentHandler<T extends NormalizedInstanceNode["componentProperties"] = NormalizedInstanceNode["componentProperties"]> {
+    key: string;
+    transform: (node: NormalizedInstanceNode & {
+        componentProperties: T;
+    }) => ElementNode;
+}
+
+type PropsConverter<T extends Record<string, any> = Record<string, any>, R extends Record<string, any> = Record<string, any>> = (node: T) => R;
+
+interface ValueResolver<TColor, TDimension, TFontDimension, TFontWeight> {
+    getFormattedValue: {
+        frameFill: (node: NormalizedHasGeometryTrait & NormalizedIsLayerTrait) => string | TColor | undefined;
+        shapeFill: (node: NormalizedHasGeometryTrait & NormalizedIsLayerTrait) => string | TColor | undefined;
+        textFill: (node: NormalizedHasGeometryTrait & NormalizedIsLayerTrait) => string | TColor | undefined;
+        stroke: (node: NormalizedHasGeometryTrait & NormalizedIsLayerTrait) => string | TColor | undefined;
+        width: (node: NormalizedHasLayoutTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        height: (node: NormalizedHasLayoutTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        minWidth: (node: NormalizedHasLayoutTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        minHeight: (node: NormalizedHasLayoutTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        maxWidth: (node: NormalizedHasLayoutTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        maxHeight: (node: NormalizedHasLayoutTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        paddingLeft: (node: NormalizedHasFramePropertiesTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        paddingRight: (node: NormalizedHasFramePropertiesTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        paddingTop: (node: NormalizedHasFramePropertiesTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        paddingBottom: (node: NormalizedHasFramePropertiesTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        itemSpacing: (node: NormalizedHasFramePropertiesTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        topLeftRadius: (node: NormalizedCornerTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        topRightRadius: (node: NormalizedCornerTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        bottomLeftRadius: (node: NormalizedCornerTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        bottomRightRadius: (node: NormalizedCornerTrait & NormalizedIsLayerTrait) => string | TDimension | undefined;
+        fontSize: (node: NormalizedTypePropertiesTrait & NormalizedIsLayerTrait) => string | TFontDimension | undefined;
+        fontWeight: (node: NormalizedTypePropertiesTrait & NormalizedIsLayerTrait) => string | TFontWeight | undefined;
+        lineHeight: (node: NormalizedTypePropertiesTrait & NormalizedIsLayerTrait) => string | TFontDimension | undefined;
+    };
+    getTextStyleValue: (node: NormalizedTypePropertiesTrait & NormalizedIsLayerTrait) => string | undefined;
+}
+
+type ReactValueResolver = ValueResolver<string, string, string, number>;
+
+interface PropsConverters {
+    containerLayout: PropsConverter<ContainerLayoutTrait, ContainerLayoutProps>;
+    selfLayout: PropsConverter<SelfLayoutTrait, SelfLayoutProps>;
+    iconSelfLayout: PropsConverter<SelfLayoutTrait, IconSelfLayoutProps>;
+    radius: PropsConverter<RadiusTrait, RadiusProps>;
+    frameFill: PropsConverter<FillTrait, FrameFillProps>;
+    shapeFill: PropsConverter<FillTrait, ShapeFillProps>;
+    textFill: PropsConverter<FillTrait, TextFillProps>;
+    vectorChildrenFill: PropsConverter<ContainerLayoutTrait, VectorChildrenFillProps>;
+    stroke: PropsConverter<StrokeTrait, StrokeProps>;
+    typeStyle: PropsConverter<TypeStyleTrait, TypeStyleProps>;
+}
+type ContainerLayoutTrait = NormalizedHasFramePropertiesTrait & NormalizedHasChildrenTrait & NormalizedHasLayoutTrait & NormalizedIsLayerTrait;
+type SelfLayoutTrait = NormalizedIsLayerTrait & NormalizedHasLayoutTrait;
+type RadiusTrait = NormalizedCornerTrait & NormalizedIsLayerTrait;
+type FillTrait = NormalizedIsLayerTrait & NormalizedHasGeometryTrait;
+type StrokeTrait = NormalizedIsLayerTrait & NormalizedHasGeometryTrait;
+type TypeStyleTrait = NormalizedTypePropertiesTrait & NormalizedIsLayerTrait;
+interface ContainerLayoutProps {
+    direction?: "row" | "column";
+    justify?: "flex-start" | "center" | "flex-end" | "space-between";
+    align?: "stretch" | "flex-start" | "center" | "flex-end" | "baseline";
+    wrap?: "wrap" | "nowrap" | true;
+    gap?: string | 0;
+    pb?: string | 0;
+    pl?: string | 0;
+    pr?: string | 0;
+    pt?: string | 0;
+    px?: string | 0;
+    py?: string | 0;
+    p?: string | 0;
+}
+declare function createContainerLayoutPropsConverter(valueResolver: ReactValueResolver): PropsConverter<ContainerLayoutTrait, ContainerLayoutProps>;
+interface SelfLayoutProps {
+    grow?: 0 | 1 | true;
+    alignSelf?: "stretch";
+    width?: string | number;
+    height?: string | number;
+    minWidth?: string | number;
+    minHeight?: string | number;
+    maxWidth?: string | number;
+    maxHeight?: string | number;
+}
+declare function createSelfLayoutPropsConverter(valueResolver: ReactValueResolver): PropsConverter<SelfLayoutTrait, SelfLayoutProps>;
+interface IconSelfLayoutProps {
+    size?: string | number;
+}
+declare function createIconSelfLayoutPropsConverter(valueResolver: ReactValueResolver): PropsConverter<SelfLayoutTrait, IconSelfLayoutProps>;
+interface RadiusProps {
+    borderRadius?: string | 0;
+    borderTopLeftRadius?: string | 0;
+    borderTopRightRadius?: string | 0;
+    borderBottomLeftRadius?: string | 0;
+    borderBottomRightRadius?: string | 0;
+}
+declare function createRadiusPropsConverter(valueResolver: ReactValueResolver): PropsConverter<RadiusTrait, RadiusProps>;
+interface TypeStyleProps {
+    textStyle?: string;
+    fontSize?: string;
+    fontWeight?: string | number;
+    lineHeight?: string;
+    maxLines?: number;
+}
+declare function createTypeStylePropsConverter({ valueResolver, }: {
+    valueResolver: ReactValueResolver;
+}): PropsConverter<TypeStyleTrait, TypeStyleProps>;
+interface FrameFillProps {
+    bg?: string;
+}
+declare function createFrameFillPropsConverter(valueResolver: ReactValueResolver): PropsConverter<FillTrait, FrameFillProps>;
+interface ShapeFillProps {
+    color?: string;
+}
+declare function createShapeFillPropsConverter(valueResolver: ReactValueResolver): PropsConverter<FillTrait, ShapeFillProps>;
+interface TextFillProps {
+    color?: string;
+}
+declare function createTextFillPropsConverter(valueResolver: ReactValueResolver): PropsConverter<FillTrait, TextFillProps>;
+interface VectorChildrenFillProps {
+    color?: string;
+}
+declare function createVectorChildrenFillPropsConverter(valueResolver: ReactValueResolver): PropsConverter<ContainerLayoutTrait, VectorChildrenFillProps>;
+interface StrokeProps {
+    borderWidth?: number;
+    borderColor?: string;
+}
+declare function createStrokePropsConverter(valueResolver: ReactValueResolver): PropsConverter<StrokeTrait, StrokeProps>;
+
+interface RectangleTransformerDeps {
+    propsConverters: PropsConverters;
+}
+declare function createRectangleTransformer({ propsConverters, }: RectangleTransformerDeps): ElementTransformer<NormalizedRectangleNode>;
+declare function createVectorTransformer(): ElementTransformer<NormalizedVectorNode>;
+declare function createBooleanOperationTransformer(): ElementTransformer<NormalizedBooleanOperationNode>;
+
+interface FrameTransformerDeps {
+    propsConverters: PropsConverters;
+}
+declare function createFrameTransformer({ propsConverters, }: FrameTransformerDeps): ElementTransformer<NormalizedFrameNode | NormalizedInstanceNode | NormalizedComponentNode>;
+
+interface IconHandler {
+    isIconInstance: (node: {
+        componentKey: string;
+    }) => boolean;
+    transform: (node: {
+        componentKey: string;
+    }) => ElementNode;
+}
+
+interface InstanceTransformerDeps {
+    iconHandler?: IconHandler;
+    propsConverters: PropsConverters;
+    componentHandlers: Record<string, ComponentHandler>;
+    frameTransformer: ElementTransformer<NormalizedInstanceNode>;
+}
+declare function createInstanceTransformer({ iconHandler, propsConverters, componentHandlers, frameTransformer, }: InstanceTransformerDeps): ElementTransformer<NormalizedInstanceNode>;
+
+interface TextTransformerDeps {
+    propsConverters: PropsConverters;
+}
+declare function createTextTransformer({ propsConverters, }: TextTransformerDeps): ElementTransformer<NormalizedTextNode>;
+
+interface ComponentHandlerDeps {
+    iconHandler: IconHandler;
+    valueResolver: ReactValueResolver;
+}
+
+type UnboundComponentHandler<T extends NormalizedInstanceNode["componentProperties"]> = (deps: ComponentHandlerDeps) => ComponentHandler<T>;
+declare function bindComponentHandler<T extends NormalizedInstanceNode["componentProperties"]>(unbound: UnboundComponentHandler<T>, deps: ComponentHandlerDeps): ComponentHandler<T>;
+declare const unboundSeedComponentHandlers: Array<UnboundComponentHandler<any>>;
+
+interface CreatePipelineConfig {
+    extend?: {
+        componentHandlers?: Array<UnboundComponentHandler<any>>;
+    };
+}
+declare function createPipeline(options?: CreatePipelineConfig): {
+    generateJsxTree: (node: NormalizedSceneNode, options: CodegenOptions) => any;
+    generateCode: (node: NormalizedSceneNode, options: CodegenOptions & {
+        shouldPrintSource: boolean;
+    }) => string | undefined;
+};
+
+export { bindComponentHandler, createBooleanOperationTransformer, createContainerLayoutPropsConverter, createFrameFillPropsConverter, createFrameTransformer, createIconSelfLayoutPropsConverter, createInstanceTransformer, createPipeline, createRadiusPropsConverter, createRectangleTransformer, createSelfLayoutPropsConverter, createShapeFillPropsConverter, createStrokePropsConverter, createTextFillPropsConverter, createTextTransformer, createTypeStylePropsConverter, createVectorChildrenFillPropsConverter, createVectorTransformer, unboundSeedComponentHandlers };
+export type { ComponentHandlerDeps, ContainerLayoutProps, ContainerLayoutTrait, CreatePipelineConfig, FillTrait, FrameFillProps, FrameTransformerDeps, IconSelfLayoutProps, InstanceTransformerDeps, PropsConverters, RadiusProps, RadiusTrait, RectangleTransformerDeps, SelfLayoutProps, SelfLayoutTrait, ShapeFillProps, StrokeProps, StrokeTrait, TextFillProps, TextTransformerDeps, TypeStyleProps, TypeStyleTrait, UnboundComponentHandler, VectorChildrenFillProps };