@builder.io/sdk-vue 0.6.1-1 → 0.6.1

package/vue3/lib/edge/types/builder-block.d.ts

@@ -0,0 +1,66 @@
+type JSONValue = string | number | boolean | JSONObject | JSONArray;
+interface JSONObject {
+    [x: string]: JSONValue;
+}
+interface JSONArray extends Array<JSONValue> {
+}
+/** @todo typedoc this */
+export interface BuilderBlock {
+    '@type': '@builder.io/sdk:Element';
+    '@version'?: number;
+    id?: string;
+    tagName?: string;
+    layerName?: string;
+    groupLocked?: boolean;
+    layerLocked?: boolean;
+    /** @todo make alias for properties.class */
+    class?: string;
+    children?: BuilderBlock[];
+    responsiveStyles?: {
+        large?: Partial<CSSStyleDeclaration>;
+        medium?: Partial<CSSStyleDeclaration>;
+        small?: Partial<CSSStyleDeclaration>;
+        /** @deprecated */
+        xsmall?: Partial<CSSStyleDeclaration>;
+    };
+    component?: {
+        name: string;
+        options?: any;
+        tag?: string;
+    };
+    bindings?: {
+        [key: string]: string;
+    };
+    meta?: {
+        [key: string]: JSONValue;
+    };
+    actions?: {
+        [key: string]: string;
+    };
+    properties?: {
+        [key: string]: string;
+    };
+    code?: {
+        bindings?: {
+            [key: string]: string;
+        };
+        actions?: {
+            [key: string]: string;
+        };
+    };
+    repeat?: {
+        collection: string;
+        itemName?: string;
+    } | null;
+    animations?: any[];
+    style?: Partial<CSSStyleDeclaration>;
+    /**
+     * generated by the "Hide If" binding
+     */
+    hide?: boolean;
+    /**
+     * generated by the "Show If" binding
+     */
+    show?: boolean;
+}
+export {};

package/vue3/lib/edge/types/builder-content.d.ts

@@ -0,0 +1,44 @@
+import type { BuilderBlock } from './builder-block.js';
+import type { Input } from './input.js';
+import type { Nullable } from './typescript.js';
+export interface Breakpoints {
+    small: number;
+    medium: number;
+}
+export interface BuilderContentVariation {
+    data?: {
+        title?: string;
+        blocks?: BuilderBlock[];
+        inputs?: Input[];
+        state?: {
+            [key: string]: any;
+        };
+        jsCode?: string;
+        tsCode?: string;
+        httpRequests?: {
+            [key: string]: string;
+        };
+        [key: string]: any;
+    };
+    name?: string;
+    testRatio?: number;
+    id?: string;
+    meta?: {
+        breakpoints?: Nullable<Breakpoints>;
+        [key: string]: any;
+    };
+}
+export interface BuilderContent extends BuilderContentVariation {
+    '@version'?: number;
+    published?: 'published' | 'draft' | 'archived';
+    modelId?: string;
+    priority?: number;
+    lastUpdated?: number;
+    startDate?: number;
+    endDate?: number;
+    variations?: {
+        [id: string]: BuilderContentVariation;
+    };
+    testVariationId?: string;
+    testVariationName?: string;
+}

package/vue3/lib/edge/types/builder-props.d.ts

@@ -0,0 +1,9 @@
+import type { BuilderContextInterface, RegisteredComponents } from '../context/types.js';
+import type { BuilderBlock } from './builder-block.js';
+export type PropsWithBuilderData<T> = T & {
+    builderBlock: BuilderBlock;
+    builderContext: BuilderContextInterface;
+};
+export type BuilderComponentsProp = {
+    builderComponents: RegisteredComponents;
+};

package/vue3/lib/edge/types/can-track.d.ts

@@ -0,0 +1,3 @@
+export type CanTrack = {
+    canTrack: boolean;
+};

package/vue3/lib/edge/types/components.d.ts

@@ -0,0 +1,111 @@
+import type { BuilderElement } from './element.js';
+import type { Input } from './input.js';
+export interface ComponentInfo {
+    /**
+     * Name your component something unique, e.g. 'MyButton'. You can override built-in components
+     * by registering a component with the same name, e.g. 'Text', to replace the built-in text component
+     */
+    name: string;
+    description?: string;
+    /**
+     * Link to a documentation page for this component
+     */
+    docsLink?: string;
+    image?: string;
+    /**
+     * Input schema for your component for users to fill in the options
+     */
+    inputs?: Input[];
+    class?: any;
+    type?: 'angular' | 'webcomponent' | 'react' | 'vue';
+    defaultStyles?: {
+        [key: string]: string;
+    };
+    /**
+     * Turn on if your component can accept children. Be sure to use in combination with
+     * withChildren(YourComponent) like here
+     * github.com/BuilderIO/builder/blob/master/examples/react-design-system/src/components/HeroWithChildren/HeroWithChildren.builder.js#L5
+     */
+    canHaveChildren?: boolean;
+    fragment?: boolean;
+    /**
+     * Do not wrap a component in a dom element. Be sure to use {...props.attributes} with this option
+     * like here github.com/BuilderIO/builder/blob/master/packages/react/src/blocks/forms/Input.tsx#L34
+     */
+    noWrap?: boolean;
+    /**
+     * TO-DO: make this optional only for RSC SDK.
+     *
+     * Set this to `true` if your component is a React Server Component (RSC).
+     */
+    isRSC?: boolean;
+    /**
+     * Default children
+     */
+    defaultChildren?: BuilderElement[];
+    defaults?: Partial<BuilderElement>;
+    hooks?: {
+        [key: string]: string | Function;
+    };
+    /**
+     * Hide your component in editor, useful for gradually deprecating components
+     */
+    hideFromInsertMenu?: boolean;
+    tag?: string;
+    static?: boolean;
+    /**
+     * Passing a list of model names will restrict using the component to only the models listed here, otherwise it'll be available for all models
+     */
+    models?: string[];
+    /**
+     * Specify restrictions direct children must match
+     */
+    childRequirements?: {
+        /** Message to show when this doesn't match, e.g. "Children of 'Columns' must be a 'Column'" */
+        message: string;
+        /** Simple way to say children must be a specific component name */
+        component?: string;
+        /**
+         * More advanced - specify a MongoDB-style query (using sift.js github.com/crcn/sift.js)
+         * of what the children objects should match, e.g.
+         *
+         * @example
+         *  query: {
+         *    // Child of this element must be a 'Button' or 'Text' component
+         *    'component.name': { $in: ['Button', 'Text'] }
+         *  }
+         */
+        query?: any;
+    };
+    /**
+     * Specify restrictions any parent must match
+     */
+    requiresParent?: {
+        /** Message to show when this doesn't match, e.g. "'Add to cart' buttons must be within a 'Product box'" */
+        message: string;
+        /** Simple way to say a parent must be a specific component name, e.g. 'Product box' */
+        component?: string;
+        /**
+         * More advanced - specify a MongoDB-style query (using sift.js github.com/crcn/sift.js)
+         * of what at least one parent in the parents hierarchy should match, e.g.
+         *
+         * @example
+         *  query: {
+         *    // Thils element must be somewhere inside either a 'Product box' or 'Collection' component
+         *    'component.name': { $in: ['Product Box', 'Collection'] }
+         *  }
+         */
+        query?: any;
+    };
+    /** not yet implemented */
+    friendlyName?: string;
+    /**
+     * Use to restrict access to your component based on a the current user permissions
+     * By default components will show to all users
+     * for more information on permissions in builder check https://www.builder.io/c/docs/guides/roles-and-permissions
+     */
+    requiredPermissions?: Array<Permission>;
+    hidden?: boolean;
+}
+type Permission = 'read' | 'publish' | 'editCode' | 'editDesigns' | 'admin' | 'create';
+export {};

package/vue3/lib/edge/types/deep-partial.d.ts

@@ -0,0 +1,3 @@
+export type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends Array<infer U> ? Array<DeepPartial<U>> : T[P] extends ReadonlyArray<infer U> ? ReadonlyArray<DeepPartial<U>> : DeepPartial<T[P]>;
+};

package/vue3/lib/edge/types/element.d.ts

@@ -0,0 +1,59 @@
+type JSONValue = string | number | boolean | JSONObject | JSONArray;
+interface JSONObject {
+    [x: string]: JSONValue;
+}
+interface JSONArray extends Array<JSONValue> {
+}
+/** @todo typedoc this */
+export interface BuilderElement {
+    '@type': '@builder.io/sdk:Element';
+    '@version'?: number;
+    id?: string;
+    tagName?: string;
+    layerName?: string;
+    groupLocked?: boolean;
+    layerLocked?: boolean;
+    /** @todo make alias for properties.class */
+    class?: string;
+    children?: BuilderElement[];
+    responsiveStyles?: {
+        large?: Partial<CSSStyleDeclaration>;
+        medium?: Partial<CSSStyleDeclaration>;
+        small?: Partial<CSSStyleDeclaration>;
+        /** @deprecated */
+        xsmall?: Partial<CSSStyleDeclaration>;
+    };
+    component?: {
+        name: string;
+        options?: any;
+        tag?: string;
+    };
+    bindings?: {
+        [key: string]: string;
+    };
+    meta?: {
+        [key: string]: JSONValue;
+    };
+    actions?: {
+        [key: string]: string;
+    };
+    properties?: {
+        [key: string]: string;
+    };
+    code?: {
+        bindings?: {
+            [key: string]: string;
+        };
+        actions?: {
+            [key: string]: string;
+        };
+    };
+    repeat?: {
+        collection: string;
+        itemName?: string;
+    } | null;
+    animations?: Animation[];
+}
+interface Animation {
+}
+export {};

package/vue3/lib/edge/types/enforced-partials.d.ts

@@ -0,0 +1,21 @@
+import type { Prettify } from './typescript.js';
+type OptionalFieldsOnly<T> = {
+    [K in keyof T as T[K] extends Required<T>[K] ? never : K]: T[K];
+};
+type RequiredFieldsOnly<T> = {
+    [K in keyof T as T[K] extends Required<T>[K] ? K : never]: T[K];
+};
+type Enforced<T> = {
+    [K in keyof T]-?: T[K];
+};
+type AndUndefined<T> = {
+    [K in keyof T]: T[K] | undefined;
+};
+/**
+ * Enforce that all optional fields are undefined
+ * @example
+ * type Foo = { a: string, b?: number }
+ * type Bar = EnforcePartials<Foo> // { a: string, b: number | undefined }
+ */
+export type EnforcePartials<From> = Prettify<AndUndefined<Enforced<OptionalFieldsOnly<From>>> & RequiredFieldsOnly<From>>;
+export {};

package/vue3/lib/edge/types/input.d.ts

@@ -0,0 +1,121 @@
+export interface Input {
+    /** This is the name of the component prop this input represents */
+    name: string;
+    /** A friendlier name to show in the UI if the component prop name is not ideal for end users */
+    friendlyName?: string;
+    /** @hidden @deprecated */
+    description?: string;
+    /** A default value to use */
+    defaultValue?: any;
+    /**
+     * The type of input to use, such as 'text'
+     *
+     * See all available inputs [here](https://www.builder.io/c/docs/custom-react-components#input-types)
+     * and you can create your own custom input types and associated editor UIs with [plugins](https://www.builder.io/c/docs/extending/plugins)
+     */
+    type: string;
+    /** Is this input mandatory or not */
+    required?: boolean;
+    /** @hidden */
+    autoFocus?: boolean;
+    subFields?: Input[];
+    /**
+     * Additional text to render in the UI to give guidance on how to use this
+     *
+     * @example
+     * ```js
+     * helperText: 'Be sure to use a proper URL, starting with "https://"'
+     * 111
+     */
+    helperText?: string;
+    /** @hidden */
+    allowedFileTypes?: string[];
+    /** @hidden */
+    imageHeight?: number;
+    /** @hidden */
+    imageWidth?: number;
+    /** @hidden */
+    mediaHeight?: number;
+    /** @hidden */
+    mediaWidth?: number;
+    /** @hidden */
+    hideFromUI?: boolean;
+    /** @hidden */
+    modelId?: string;
+    /**
+     * Number field type validation maximum accepted input
+     */
+    max?: number;
+    /**
+     * Number field type validation minimum accepted input
+     */
+    min?: number;
+    /**
+     * Number field type step size when using arrows
+     */
+    step?: number;
+    /**
+     * Set this to `true` to show the editor for this input when
+     * children of this component are selected. This is useful for things
+     * like Tabs, such that users may not always select the Tabs component
+     * directly but will still be looking for how to add additional tabs
+     */
+    broadcast?: boolean;
+    /**
+     * Set this to `true` to show the editor for this input when
+     * group locked parents of this component are selected. This is useful
+     * to bubble up important inputs for locked groups, like text and images
+     */
+    bubble?: boolean;
+    /**
+     * Set this to `true` if you want this component to be translatable
+     */
+    localized?: boolean;
+    /** @hidden */
+    options?: {
+        [key: string]: any;
+    };
+    /**
+     * For "text" input type, specifying an enum will show a dropdown of options instead
+     */
+    enum?: string[] | {
+        label: string;
+        value: any;
+        helperText?: string;
+    }[];
+    /** Regex field validation for all string types (text, longText, html, url, etc) */
+    regex?: {
+        /** pattern to test, like "^\/[a-z]$" */
+        pattern: string;
+        /** flags for the RegExp constructor, e.g. "gi"  */
+        options?: string;
+        /**
+         * Friendly message to display to end-users if the regex fails, e.g.
+         * "You must use a relative url starting with '/...' "
+         */
+        message: string;
+    };
+    /**
+     * Set this to `true` to put this under the "show more" section of
+     * the options editor. Useful for things that are more advanced
+     * or more rarely used and don't need to be too prominent
+     */
+    advanced?: boolean;
+    /** @hidden */
+    /** @hidden */
+    code?: boolean;
+    /** @hidden */
+    richText?: boolean;
+    /** @hidden */
+    showIf?: ((options: Map<string, any>) => boolean) | string;
+    /** @hidden */
+    copyOnAdd?: boolean;
+    /**
+     * Use optionally with inputs of type `reference`. Restricts the content entry picker to a specific model by name.
+     */
+    model?: string;
+    valueType?: {
+        type?: string;
+    };
+    onChange?: ((options: Map<string, any>) => void | Promise<void>) | string;
+}

package/vue3/lib/edge/types/targets.d.ts

@@ -0,0 +1 @@
+export type Target = 'vue3' | 'vue2' | 'reactNative' | 'svelte' | 'qwik' | 'react' | 'solid' | 'rsc';

package/vue3/lib/edge/types/typescript.d.ts

@@ -0,0 +1,11 @@
+export type Nullable<T> = T | null | undefined;
+export type Dictionary<T> = {
+    [key: string]: T;
+};
+export type Overwrite<T, U> = keyof U extends keyof T ? Pick<T, Exclude<keyof T, keyof U>> & U : never;
+export type Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+export type PropsWithChildren<P> = P & {
+    children?: any;
+};

package/vue3/lib/node/block-wrapper.ae2637e5.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),t=require("./get-block-actions.9a71b975.cjs"),r=require("./index.eed52cb2.cjs"),n=o.defineComponent({name:"block-wrapper",props:["Wrapper","block","context","hasChildren"],data(){return{getBlockActions:t.getBlockActions,getBlockProperties:t.getBlockProperties}}});function c(e,a,s,p,i,k){return e.hasChildren?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.Wrapper),o.mergeProps({key:0},e.getBlockProperties({block:e.block,context:e.context}),o.toHandlers(e.getBlockActions({block:e.block,rootState:e.context.rootState,rootSetState:e.context.rootSetState,localState:e.context.localState,context:e.context.context,stripPrefix:!0}))),{default:o.withCtx(()=>[o.renderSlot(e.$slots,"default")]),_:3},16)):(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.Wrapper),o.mergeProps({key:1},e.getBlockProperties({block:e.block,context:e.context}),o.toHandlers(e.getBlockActions({block:e.block,rootState:e.context.rootState,rootSetState:e.context.rootSetState,localState:e.context.localState,context:e.context.context,stripPrefix:!0}))),null,16))}const l=r._export_sfc(n,[["render",c],["__file","/Users/samijaber/code/work/builder/packages/sdks/output/vue/vue3/src/components/block/components/block-wrapper.vue"]]);exports.default=l;

package/vue3/lib/node/block-wrapper.f1e0d99f.js

@@ -0,0 +1,54 @@
+import { defineComponent as l, openBlock as o, createBlock as t, resolveDynamicComponent as r, mergeProps as n, toHandlers as a, withCtx as c, renderSlot as s } from "vue";
+import { g as p, a as k } from "./get-block-actions.05d2bf89.js";
+import { _ as i } from "./index.bb9d2170.js";
+const S = l({
+  name: "block-wrapper",
+  props: ["Wrapper", "block", "context", "hasChildren"],
+  data() {
+    return { getBlockActions: p, getBlockProperties: k };
+  }
+});
+function u(e, b, d, m, f, g) {
+  return e.hasChildren ? (o(), t(r(e.Wrapper), n(
+    { key: 0 },
+    e.getBlockProperties({
+      block: e.block,
+      context: e.context
+    }),
+    a(
+      e.getBlockActions({
+        block: e.block,
+        rootState: e.context.rootState,
+        rootSetState: e.context.rootSetState,
+        localState: e.context.localState,
+        context: e.context.context,
+        stripPrefix: !0
+      })
+    )
+  ), {
+    default: c(() => [
+      s(e.$slots, "default")
+    ]),
+    _: 3
+  }, 16)) : (o(), t(r(e.Wrapper), n(
+    { key: 1 },
+    e.getBlockProperties({
+      block: e.block,
+      context: e.context
+    }),
+    a(
+      e.getBlockActions({
+        block: e.block,
+        rootState: e.context.rootState,
+        rootSetState: e.context.rootSetState,
+        localState: e.context.localState,
+        context: e.context.context,
+        stripPrefix: !0
+      })
+    )
+  ), null, 16));
+}
+const C = /* @__PURE__ */ i(S, [["render", u], ["__file", "/Users/samijaber/code/work/builder/packages/sdks/output/vue/vue3/src/components/block/components/block-wrapper.vue"]]);
+export {
+  C as default
+};

package/vue3/lib/node/blocks/button/button.vue.d.ts

@@ -0,0 +1,30 @@
+import { filterAttrs } from "../helpers.js";
+/**
+ * This import is used by the Svelte SDK. Do not remove.
+ */ export interface ButtonProps {
+    attributes?: any;
+    text?: string;
+    link?: string;
+    openLinkInNewTab?: boolean;
+}
+declare const _default: import("vue").DefineComponent<Readonly<{
+    text?: any;
+    link?: any;
+    attributes?: any;
+    openLinkInNewTab?: any;
+}>, unknown, {
+    filterAttrs: typeof filterAttrs;
+}, {}, {
+    _classStringToObject(str: string): Record<string, boolean>;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<Readonly<{
+    text?: any;
+    link?: any;
+    attributes?: any;
+    openLinkInNewTab?: any;
+}>>>, {
+    readonly text?: any;
+    readonly link?: any;
+    readonly attributes?: any;
+    readonly openLinkInNewTab?: any;
+}, {}>;
+export default _default;

package/vue3/lib/node/blocks/button/component-info.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentInfo } from '../../types/components.js';
+export declare const componentInfo: ComponentInfo;

package/vue3/lib/node/blocks/columns/columns.vue.d.ts

@@ -0,0 +1,69 @@
+import type { BuilderBlock } from "../../types/builder-block.js";
+import type { SizeName } from "../../constants/device-sizes.js";
+import type { Dictionary } from "../../types/typescript.js";
+import type { BuilderComponentsProp } from "../../types/builder-props.js";
+type Column = {
+    blocks: BuilderBlock[];
+    width?: number;
+};
+type CSSVal = string | number;
+type StackColumnsAt = "tablet" | "mobile" | "never";
+export interface ColumnProps extends BuilderComponentsProp {
+    columns?: Column[];
+    builderBlock: BuilderBlock;
+    space?: number;
+    stackColumnsAt?: StackColumnsAt;
+    reverseColumnsWhenStacked?: boolean;
+}
+declare const _default: import("vue").DefineComponent<Readonly<{
+    builderContext?: any;
+    columns?: any;
+    builderBlock?: any;
+    builderComponents?: any;
+    js?: any;
+    space?: any;
+    stackColumnsAt?: any;
+    reverseColumnsWhenStacked?: any;
+}>, unknown, {
+    gutterSize: number;
+    cols: any;
+    stackAt: any;
+    flexDir: string;
+    TARGET: import("../../types/targets").Target;
+}, {
+    columnsCssVars(): Dictionary<string>;
+    columnsStyles(): string;
+}, {
+    getWidth(index: number): any;
+    getColumnCssWidth(index: number): string;
+    getTabletStyle({ stackedStyle, desktopStyle, }: {
+        stackedStyle: CSSVal;
+        desktopStyle: CSSVal;
+    }): CSSVal;
+    getMobileStyle({ stackedStyle, desktopStyle, }: {
+        stackedStyle: CSSVal;
+        desktopStyle: CSSVal;
+    }): CSSVal;
+    columnCssVars(index: number): Dictionary<string>;
+    getWidthForBreakpointSize(size: SizeName): number;
+    _classStringToObject(str: string): Record<string, boolean>;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<Readonly<{
+    builderContext?: any;
+    columns?: any;
+    builderBlock?: any;
+    builderComponents?: any;
+    js?: any;
+    space?: any;
+    stackColumnsAt?: any;
+    reverseColumnsWhenStacked?: any;
+}>>>, {
+    readonly builderContext?: any;
+    readonly columns?: any;
+    readonly builderBlock?: any;
+    readonly builderComponents?: any;
+    readonly js?: any;
+    readonly space?: any;
+    readonly stackColumnsAt?: any;
+    readonly reverseColumnsWhenStacked?: any;
+}, {}>;
+export default _default;

package/vue3/lib/node/blocks/columns/component-info.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentInfo } from '../../types/components.js';
+export declare const componentInfo: ComponentInfo;

package/vue3/lib/node/blocks/custom-code/component-info.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentInfo } from '../../types/components.js';
+export declare const componentInfo: ComponentInfo;

package/vue3/lib/node/blocks/custom-code/custom-code.vue.d.ts

@@ -0,0 +1,21 @@
+export interface CustomCodeProps {
+    code: string;
+    replaceNodes?: boolean;
+}
+declare const _default: import("vue").DefineComponent<Readonly<{
+    code?: any;
+    replaceNodes?: any;
+}>, unknown, {
+    scriptsInserted: never[];
+    scriptsRun: never[];
+}, {}, {
+    findAndRunScripts(): void;
+    _classStringToObject(str: string): Record<string, boolean>;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<Readonly<{
+    code?: any;
+    replaceNodes?: any;
+}>>>, {
+    readonly code?: any;
+    readonly replaceNodes?: any;
+}, {}>;
+export default _default;

package/vue3/lib/node/blocks/embed/component-info.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentInfo } from '../../types/components.js';
+export declare const componentInfo: ComponentInfo;