@builder.io/sdk-qwik 0.0.26 → 0.0.28

package/README.md

@@ -35,12 +35,11 @@ import { useLocation } from "@builder.io/qwik-city";
 import { getContent, RenderContent, getBuilderSearchParams } from "@builder.io/sdk-qwik";
 
 export const BUILDER_PUBLIC_API_KEY = "YOUR_API_KEY_GOES_HERE"; // ggignore
-export const BUILDER_MODEL = "page";
 export default component$(() => {
   const location = useLocation();
   const builderContentRsrc = useResource$<any>(() => {
     return getContent({
-      model: BUILDER_MODEL,
+      model: "page",
       apiKey: BUILDER_PUBLIC_API_KEY,
       options: getBuilderSearchParams(location.query),
       userAttributes: {
@@ -51,11 +50,11 @@ export default component$(() => {
 
   return (
     <Resource
-      value={builderContentRsrc}
+      resource={builderContentRsrc}
       onPending={() => <div>Loading...</div>}
       onResolved={(content) => (
         <RenderContent
-          model={BUILDER_MODEL}
+          model="page"
           content={content}
           apiKey={BUILDER_PUBLIC_API_KEY}
         />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@builder.io/sdk-qwik",
-  "version": "0.0.26",
+  "version": "0.0.28",
   "description": "Builder.io Qwik SDK",
   "type": "module",
   "main": "./lib/index.qwik.cjs",

package/types/blocks/BaseText.d.ts

@@ -0,0 +1,5 @@
+export interface BaseTextProps {
+    text: string;
+}
+export declare const BaseText: import("@builder.io/qwik").Component<BaseTextProps>;
+export default BaseText;

package/types/blocks/avatar/avatar.d.ts

@@ -0,0 +1,267 @@
+export declare const avatarService: any;
+export declare const Avatar: import("@builder.io/qwik").Component<any>;
+export default Avatar;
+export declare const COMPONENT: {
+    "@type": string;
+    children: {
+        "@type": string;
+        bindings: {
+            when: {
+                code: string;
+            };
+        };
+        children: ({
+            "@type": string;
+            bindings: {
+                class?: undefined;
+                title?: undefined;
+            };
+            children: never[];
+            meta: {};
+            name: string;
+            properties: {
+                _text: string;
+            };
+            scope: {};
+        } | {
+            "@type": string;
+            bindings: {
+                class: {
+                    code: string;
+                };
+                title: {
+                    code: string;
+                };
+            };
+            children: ({
+                "@type": string;
+                bindings: {
+                    when?: undefined;
+                };
+                children: never[];
+                meta: {};
+                name: string;
+                properties: {
+                    _text: string;
+                };
+                scope: {};
+            } | {
+                "@type": string;
+                bindings: {
+                    when: {
+                        code: string;
+                    };
+                };
+                children: ({
+                    "@type": string;
+                    bindings: {
+                        class?: undefined;
+                        style?: undefined;
+                    };
+                    children: never[];
+                    meta: {};
+                    name: string;
+                    properties: {
+                        _text: string;
+                    };
+                    scope: {};
+                } | {
+                    "@type": string;
+                    bindings: {
+                        class: {
+                            code: string;
+                        };
+                        style: {
+                            code: string;
+                        };
+                    };
+                    children: ({
+                        "@type": string;
+                        bindings: {
+                            when?: undefined;
+                        };
+                        children: never[];
+                        meta: {};
+                        name: string;
+                        properties: {
+                            _text: string;
+                        };
+                        scope: {};
+                    } | {
+                        "@type": string;
+                        bindings: {
+                            when: {
+                                code: string;
+                            };
+                        };
+                        children: ({
+                            "@type": string;
+                            bindings: {
+                                alt?: undefined;
+                                src?: undefined;
+                            };
+                            children: never[];
+                            meta: {};
+                            name: string;
+                            properties: {
+                                _text: string;
+                                class?: undefined;
+                            };
+                            scope: {};
+                        } | {
+                            "@type": string;
+                            bindings: {
+                                alt: {
+                                    code: string;
+                                };
+                                src: {
+                                    code: string;
+                                };
+                            };
+                            children: never[];
+                            meta: {};
+                            name: string;
+                            properties: {
+                                class: string;
+                                _text?: undefined;
+                            };
+                            scope: {};
+                        })[];
+                        meta: {};
+                        name: string;
+                        properties: {
+                            _text?: undefined;
+                        };
+                        scope: {};
+                    } | {
+                        "@type": string;
+                        bindings: {
+                            when: {
+                                code: string;
+                            };
+                        };
+                        children: ({
+                            "@type": string;
+                            bindings: {};
+                            children: never[];
+                            meta: {};
+                            name: string;
+                            properties: {
+                                _text: string;
+                            };
+                            scope: {};
+                        } | {
+                            "@type": string;
+                            bindings: {};
+                            children: {
+                                "@type": string;
+                                bindings: {
+                                    _text: {
+                                        code: string;
+                                    };
+                                };
+                                children: never[];
+                                meta: {};
+                                name: string;
+                                properties: {};
+                                scope: {};
+                            }[];
+                            meta: {};
+                            name: string;
+                            properties: {
+                                _text?: undefined;
+                            };
+                            scope: {};
+                        })[];
+                        meta: {};
+                        name: string;
+                        properties: {
+                            _text?: undefined;
+                        };
+                        scope: {};
+                    })[];
+                    meta: {};
+                    name: string;
+                    properties: {
+                        _text?: undefined;
+                    };
+                    scope: {};
+                })[];
+                meta: {};
+                name: string;
+                properties: {
+                    _text?: undefined;
+                };
+                scope: {};
+            })[];
+            meta: {};
+            name: string;
+            properties: {
+                _text?: undefined;
+            };
+            scope: {};
+        })[];
+        meta: {};
+        name: string;
+        properties: {};
+        scope: {};
+    }[];
+    context: {
+        get: {};
+        set: {};
+    };
+    exports: {
+        avatarService: {
+            code: string;
+            isFunction: boolean;
+            usedInLocal: boolean;
+        };
+    };
+    hooks: {
+        onMount: {
+            code: string;
+        };
+    };
+    imports: {
+        imports: {};
+        path: string;
+    }[];
+    inputs: never[];
+    meta: {
+        useMetadata: {
+            isAttachedToShadowDom: boolean;
+        };
+    };
+    name: string;
+    propsTypeRef: string;
+    refs: {};
+    state: {
+        classes: {
+            code: {
+                base: string;
+                container: string;
+            };
+            type: string;
+        };
+        initials: {
+            code: null;
+            type: string;
+        };
+        loaded: {
+            code: boolean;
+            type: string;
+        };
+        source: {
+            code: null;
+            type: string;
+        };
+        styles: {
+            code: {
+                container: null;
+            };
+            type: string;
+        };
+    };
+    subComponents: never[];
+    types: string[];
+};

package/types/blocks/avatar/avatar.model.d.ts

@@ -0,0 +1,19 @@
+import { BaseProps, BaseState, CSS, Dynamic, Variant } from '~/models';
+export declare type AvatarProps = {
+    variant?: Dynamic<Variant>;
+    name?: string;
+    unavatar?: string;
+    url?: string;
+    disabled?: boolean;
+} & BaseProps;
+export declare type AvatarState = {
+    classes: {
+        base: string;
+        container: string;
+    };
+    styles: {
+        container: CSS;
+    };
+    initials: string;
+    source: string;
+} & BaseState;

package/types/blocks/image/image.d.ts

@@ -22,4 +22,4 @@ export declare const srcSetToUse: (props: any, state: any) => any;
 export declare const webpSrcSet: (props: any, state: any) => any;
 export declare const Image: import("@builder.io/qwik").Component<ImageProps>;
 export default Image;
-export declare const STYLES = ".div-Image { \nposition: relative; }.img-Image { \nopacity: 1;\ntransition: opacity 0.2s ease-in-out;\nposition: absolute;\nheight: 100%;\nwidth: 100%;\ntop: 0px;\nleft: 0px; }.div-Image-2 { \nwidth: 100%;\npointer-events: none;\nfont-size: 0; }.div-Image-3 { \ndisplay: flex;\nflex-direction: column;\nalign-items: stretch;\nposition: absolute;\ntop: 0;\nleft: 0;\nwidth: 100%;\nheight: 100%; }";
+export declare const STYLES = ".img-Image { \nopacity: 1;\ntransition: opacity 0.2s ease-in-out;\nposition: absolute;\nheight: 100%;\nwidth: 100%;\ntop: 0px;\nleft: 0px; }.div-Image { \nwidth: 100%;\npointer-events: none;\nfont-size: 0; }.div-Image-2 { \ndisplay: flex;\nflex-direction: column;\nalign-items: stretch;\nposition: absolute;\ntop: 0;\nleft: 0;\nwidth: 100%;\nheight: 100%; }";

package/types/blocks/symbol/symbol.d.ts

@@ -16,5 +16,6 @@ export interface SymbolProps {
     attributes?: any;
     inheritState?: boolean;
 }
+export declare const contentToUse: (props: any, state: any, builderContext: any) => any;
 export declare const Symbol: import("@builder.io/qwik").Component<SymbolProps>;
 export default Symbol;

package/types/blocks/util.d.ts

@@ -1 +1,4 @@
-export declare function markSerializable<FN extends (...args: any[]) => any>(fn: FN): FN;
+/**
+ * Input attributes that are functions must be converted to strings before being serialized to JSON.
+ */
+export declare const serializeFn: (fnValue: Function) => string;

package/types/blocks/video/video.d.ts

@@ -21,5 +21,6 @@ export declare const videoProps: (props: any, state: any) => {
     muted?: boolean | undefined;
     autoPlay?: boolean | undefined;
 };
+export declare const spreadProps: (props: any, state: any) => any;
 export declare const Video: import("@builder.io/qwik").Component<VideoProps>;
 export default Video;

package/types/components/render-block/render-block.d.ts

@@ -1,31 +1,46 @@
 import type { BuilderContextInterface } from "../../context/types.js";
 import type { BuilderBlock } from "../../types/builder-block.js";
+import type { RenderComponentProps } from "./render-component";
 import type { RepeatData } from "./types.js";
 export declare type RenderBlockProps = {
     block: BuilderBlock;
     context: BuilderContextInterface;
 };
 export declare const component: (props: any, state: any) => any;
-export declare const componentInfo: (props: any, state: any) => any;
-export declare const componentRef: (props: any, state: any) => any;
-export declare const tagName: (props: any, state: any) => string;
+export declare const tag: (props: any, state: any) => string;
 export declare const useBlock: (props: any, state: any) => any;
 export declare const attributes: (props: any, state: any) => {
-    style: Partial<CSSStyleDeclaration>;
+    style?: CSSStyleDeclaration | Record<string, string | undefined> | undefined;
     'builder-id': string | undefined;
     class: string;
 };
 export declare const shouldWrap: (props: any, state: any) => boolean;
-export declare const componentOptions: (props: any, state: any) => any;
 export declare const renderComponentProps: (props: any, state: any) => {
     blockChildren: any;
     componentRef: any;
     componentOptions: any;
-    context: any;
+    context: {
+        apiKey: any;
+        state: any;
+        content: any;
+        context: any;
+        registeredComponents: any;
+        inheritedStyles: Partial<CSSStyleDeclaration>;
+    };
 };
-export declare const children: (props: any, state: any) => any;
+export declare const useChildren: (props: any, state: any) => any;
 export declare const childrenWithoutParentComponent: (props: any, state: any) => any;
 export declare const repeatItemData: (props: any, state: any) => RepeatData[] | undefined;
+export declare const inheritedTextStyles: (props: any, state: any) => Partial<CSSStyleDeclaration>;
+export declare const childrenContext: (props: any, state: any) => {
+    apiKey: any;
+    state: any;
+    content: any;
+    context: any;
+    registeredComponents: any;
+    inheritedStyles: Partial<CSSStyleDeclaration>;
+};
+export declare const renderComponentTag: (props: any, state: any) => import("@builder.io/qwik").Component<RenderComponentProps> | "RenderComponent";
 export declare const RenderBlock: (props: RenderBlockProps & {
     key?: any;
 }) => import("@builder.io/qwik/jsx-runtime").JSX.Element;

package/types/components/render-block/render-component-with-context.d.ts

@@ -0,0 +1,3 @@
+import type { RenderComponentProps } from "./render-component";
+export declare const RenderComponentWithContext: import("@builder.io/qwik").Component<RenderComponentProps>;
+export default RenderComponentWithContext;

package/types/components/render-blocks.d.ts

@@ -3,7 +3,7 @@ export declare type RenderBlockProps = {
     blocks?: BuilderBlock[];
     parent?: string;
     path?: string;
-    style?: Record<string, any>;
+    styleProp?: Record<string, any>;
 };
 export declare const className: (props: any, state: any, builderContext: any) => string;
 export declare const onClick: (props: any, state: any, builderContext: any) => void;

package/types/components/render-content/builder-editing.d.ts

@@ -0,0 +1,2 @@
+export declare const BuilderEditing: import("@builder.io/qwik").Component<any>;
+export default BuilderEditing;

package/types/components/render-inlined-styles.d.ts

@@ -2,7 +2,7 @@ interface Props {
     styles: string;
 }
 export declare const injectedStyleScript: (props: any, state: any) => string;
-export declare const tagName: (props: any, state: any) => string;
+export declare const tag: (props: any, state: any) => string;
 export declare const RenderInlinedStyles: (props: Props & {
     key?: any;
 }) => import("@builder.io/qwik/jsx-runtime").JSX.Element;

package/types/constants/device-sizes.d.ts

@@ -1,2 +1,13 @@
 export declare type SizeName = 'large' | 'medium' | 'small';
-export declare const getMaxWidthQueryForSize: (size: SizeName) => string;
+interface Size {
+    min: number;
+    default: number;
+    max: number;
+}
+export declare const getMaxWidthQueryForSize: (size: SizeName, sizeValues?: Record<SizeName, Size>) => string;
+interface Breakpoints {
+    small?: number;
+    medium?: number;
+}
+export declare const getSizesForBreakpoints: ({ small, medium }: Breakpoints) => Record<SizeName, Size>;
+export {};

package/types/context/types.d.ts

@@ -13,4 +13,5 @@ export interface BuilderContextInterface {
     state: BuilderRenderState;
     apiKey: string | null;
     registeredComponents: RegisteredComponents;
+    inheritedStyles: Record<string, unknown>;
 }

package/types/functions/extract-text-styles.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Extract styles that apply to text from a style object.
+ */
+export declare const extractTextStyles: (styles: Partial<CSSStyleDeclaration>) => Partial<CSSStyleDeclaration>;

package/types/functions/fast-clone.d.ts

@@ -0,0 +1,4 @@
+/**
+ * We need to serialize values to a string in case there are Proxy values, as is the case with SolidJS etc.
+ */
+export declare const fastClone: <T extends object>(obj: T) => T;

package/types/functions/get-content/types.d.ts

@@ -28,4 +28,8 @@ export interface GetContentOptions {
      * Defaults to `true`.
      */
     canTrack?: boolean;
+    /**
+     * Include references in the response. Defaults to `true`.
+     */
+    includeRefs?: boolean;
 }

package/types/functions/get-react-native-block-styles.d.ts

@@ -0,0 +1,6 @@
+import type { BuilderContextInterface } from '../context/types.js';
+import type { BuilderBlock } from '../types/builder-block.js';
+export declare function getReactNativeBlockStyles({ block, context, }: {
+    block: BuilderBlock;
+    context: BuilderContextInterface;
+}): CSSStyleDeclaration | Record<string, string | undefined>;

package/types/functions/mark-mutable.d.ts

@@ -1,2 +1,2 @@
-export declare function markMutable<T>(value: T): T;
-export declare function markPropsMutable<T>(props: T): T;
+export declare function markMutable<T = any>(value: T): T;
+export declare function markPropsMutable<T = any>(props: T): T;

package/types/functions/register-component.d.ts

@@ -8,7 +8,7 @@ export declare const components: RegisteredComponent[];
  * @deprecated.  Use the `customComponents` prop in RenderContent instead to provide your custom components to the builder SDK.
  */
 export declare function registerComponent(component: any, info: ComponentInfo): void;
-export declare const createRegisterComponentMessage: ({ component, ...info }: RegisteredComponent) => {
+export declare const createRegisterComponentMessage: ({ component: _, ...info }: RegisteredComponent) => {
     type: string;
     data: ComponentInfo;
 };

package/types/functions/sanitize-react-native-block-styles.d.ts

@@ -0,0 +1,3 @@
+declare type Styles = Record<string, string | number>;
+export declare const sanitizeReactNativeBlockStyles: (styles: Styles) => Styles;
+export {};

package/types/functions/track.d.ts

@@ -2,20 +2,50 @@ import type { CanTrack } from '../types/can-track.js';
 interface Event {
     type: 'click' | 'impression';
     data: {
+        /**
+         * (Optional) The content's ID. Useful if this event pertains to a specific piece of content.
+         */
         contentId?: string;
+        /**
+         * This is the ID of the space that the content belongs to.
+         */
         ownerId: string;
+        /**
+         * Stringified JSON object containing any additional metadata you want to track.
+         */
         metadata?: string;
+        /**
+         * Session ID of the user. This is provided by the SDK by checking session storage.
+         */
         sessionId: string | undefined;
+        /**
+         * Visitor ID of the user. This is provided by the SDK by checking cookies.
+         */
         visitorId: string | undefined;
+        /**
+         * (Optional) If running an A/B test, the ID of the variation that the user is in.
+         */
+        variationId?: string;
         [index: string]: any;
     };
 }
-declare type EventProperties = {
-    type: Event['type'];
-    orgId: Event['data']['ownerId'];
-    contentId: Event['data']['contentId'];
+declare type EventProperties = Pick<Event, 'type'> & Pick<Event['data'], 'contentId' | 'variationId'> & {
+    /**
+     * Your organization's API key.
+     */
+    apiKey: Event['data']['ownerId'];
+    /**
+     * (Optional) metadata that you want to provide with your event.
+     */
+    metadata?: {
+        [index: string]: any;
+    };
+    /**
+     * (Optional) Any additional (non-metadata) properties to add to the event.
+     */
     [index: string]: any;
 };
 export declare type EventProps = EventProperties & CanTrack;
-export declare function track(eventProps: EventProps): Promise<void | Response>;
+export declare function _track(eventProps: EventProps): Promise<void | Response>;
+export declare const track: (args: EventProperties) => Promise<void | Response>;
 export {};

package/types/helpers/css.d.ts

@@ -1 +1,5 @@
-export declare const convertStyleMaptoCSS: (style: Partial<CSSStyleDeclaration>) => string;
+export declare const createCssClass: ({ mediaQuery, className, styles, }: {
+    mediaQuery?: string | undefined;
+    className: string;
+    styles: Partial<CSSStyleDeclaration>;
+}) => string;

package/types/index.d.ts

@@ -1,4 +1,4 @@
-import './index-helpers/top-of-file.js';
+export * from './index-helpers/top-of-file.js';
 import './scripts/init-editing.js';
 export * from './index-helpers/blocks-exports.js';
 export * from './functions/is-editing.js';
@@ -8,3 +8,6 @@ export * from './functions/register.js';
 export * from './functions/set-editor-settings.js';
 export * from './functions/get-content/index.js';
 export * from './functions/get-builder-search-params/index.js';
+export { track } from './functions/track';
+export type { RegisteredComponent } from './context/types';
+export type { ComponentInfo } from './types/components';

package/types/types/builder-content.d.ts

@@ -18,6 +18,13 @@ export interface BuilderContentVariation {
     name?: string;
     testRatio?: number;
     id?: string;
+    meta?: {
+        breakpoints?: {
+            small: number;
+            medium: number;
+        };
+        [key: string]: any;
+    };
 }
 export interface BuilderContent extends BuilderContentVariation {
     '@version'?: number;