@builder.io/sdk-svelte 0.4.5 → 0.5.0

package/package/blocks/columns/component-info.js

@@ -1,19 +1,16 @@
-import { serializeFn } from '../util.js';
 export const componentInfo = {
     // TODO: ways to statically preprocess JSON for references, functions, etc
     name: 'Columns',
-    inputs: [
-        {
+    isRSC: true,
+    inputs: [{
             name: 'columns',
             type: 'array',
             broadcast: true,
-            subFields: [
-                {
+            subFields: [{
                     name: 'blocks',
                     type: 'array',
                     hideFromUI: true,
-                    defaultValue: [
-                        {
+                    defaultValue: [{
                             '@type': '@builder.io/sdk:Element',
                             responsiveStyles: {
                                 large: {
@@ -28,8 +25,8 @@ export const componentInfo = {
                                     height: 'auto',
                                     minHeight: '20px',
                                     minWidth: '20px',
-                                    overflow: 'hidden',
-                                },
+                                    overflow: 'hidden'
+                                }
                             },
                             component: {
                                 name: 'Image',
@@ -37,11 +34,10 @@ export const componentInfo = {
                                     image: 'https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d',
                                     backgroundPosition: 'center',
                                     backgroundSize: 'cover',
-                                    aspectRatio: 0.7004048582995948,
-                                },
-                            },
-                        },
-                        {
+                                    aspectRatio: 0.7004048582995948
+                                }
+                            }
+                        }, {
                             '@type': '@builder.io/sdk:Element',
                             responsiveStyles: {
                                 large: {
@@ -53,34 +49,28 @@ export const componentInfo = {
                                     marginTop: '30px',
                                     textAlign: 'center',
                                     lineHeight: 'normal',
-                                    height: 'auto',
-                                },
+                                    height: 'auto'
+                                }
                             },
                             component: {
                                 name: 'Text',
                                 options: {
-                                    text: '<p>Enter some text...</p>',
-                                },
-                            },
-                        },
-                    ],
-                },
-                {
+                                    text: '<p>Enter some text...</p>'
+                                }
+                            }
+                        }]
+                }, {
                     name: 'width',
                     type: 'number',
                     hideFromUI: true,
-                    helperText: 'Width %, e.g. set to 50 to fill half of the space',
-                },
-                {
+                    helperText: 'Width %, e.g. set to 50 to fill half of the space'
+                }, {
                     name: 'link',
                     type: 'url',
-                    helperText: 'Optionally set a url that clicking this column will link to',
-                },
-            ],
-            defaultValue: [
-                {
-                    blocks: [
-                        {
+                    helperText: 'Optionally set a url that clicking this column will link to'
+                }],
+            defaultValue: [{
+                    blocks: [{
                             '@type': '@builder.io/sdk:Element',
                             responsiveStyles: {
                                 large: {
@@ -95,8 +85,8 @@ export const componentInfo = {
                                     height: 'auto',
                                     minHeight: '20px',
                                     minWidth: '20px',
-                                    overflow: 'hidden',
-                                },
+                                    overflow: 'hidden'
+                                }
                             },
                             component: {
                                 name: 'Image',
@@ -104,11 +94,10 @@ export const componentInfo = {
                                     image: 'https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d',
                                     backgroundPosition: 'center',
                                     backgroundSize: 'cover',
-                                    aspectRatio: 0.7004048582995948,
-                                },
-                            },
-                        },
-                        {
+                                    aspectRatio: 0.7004048582995948
+                                }
+                            }
+                        }, {
                             '@type': '@builder.io/sdk:Element',
                             responsiveStyles: {
                                 large: {
@@ -120,21 +109,18 @@ export const componentInfo = {
                                     marginTop: '30px',
                                     textAlign: 'center',
                                     lineHeight: 'normal',
-                                    height: 'auto',
-                                },
+                                    height: 'auto'
+                                }
                             },
                             component: {
                                 name: 'Text',
                                 options: {
-                                    text: '<p>Enter some text...</p>',
-                                },
-                            },
-                        },
-                    ],
-                },
-                {
-                    blocks: [
-                        {
+                                    text: '<p>Enter some text...</p>'
+                                }
+                            }
+                        }]
+                }, {
+                    blocks: [{
                             '@type': '@builder.io/sdk:Element',
                             responsiveStyles: {
                                 large: {
@@ -149,8 +135,8 @@ export const componentInfo = {
                                     height: 'auto',
                                     minHeight: '20px',
                                     minWidth: '20px',
-                                    overflow: 'hidden',
-                                },
+                                    overflow: 'hidden'
+                                }
                             },
                             component: {
                                 name: 'Image',
@@ -158,11 +144,10 @@ export const componentInfo = {
                                     image: 'https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d',
                                     backgroundPosition: 'center',
                                     backgroundSize: 'cover',
-                                    aspectRatio: 0.7004048582995948,
-                                },
-                            },
-                        },
-                        {
+                                    aspectRatio: 0.7004048582995948
+                                }
+                            }
+                        }, {
                             '@type': '@builder.io/sdk:Element',
                             responsiveStyles: {
                                 large: {
@@ -174,30 +159,28 @@ export const componentInfo = {
                                     marginTop: '30px',
                                     textAlign: 'center',
                                     lineHeight: 'normal',
-                                    height: 'auto',
-                                },
+                                    height: 'auto'
+                                }
                             },
                             component: {
                                 name: 'Text',
                                 options: {
-                                    text: '<p>Enter some text...</p>',
-                                },
-                            },
-                        },
-                    ],
-                },
-            ],
-            onChange: serializeFn((options) => {
+                                    text: '<p>Enter some text...</p>'
+                                }
+                            }
+                        }]
+                }],
+            onChange: (options) => {
                 function clearWidths() {
-                    columns.forEach((col) => {
+                    columns.forEach(col => {
                         col.delete('width');
                     });
                 }
                 const columns = options.get('columns');
                 if (Array.isArray(columns)) {
-                    const containsColumnWithWidth = !!columns.find((col) => col.get('width'));
+                    const containsColumnWithWidth = !!columns.find(col => col.get('width'));
                     if (containsColumnWithWidth) {
-                        const containsColumnWithoutWidth = !!columns.find((col) => !col.get('width'));
+                        const containsColumnWithoutWidth = !!columns.find(col => !col.get('width'));
                         if (containsColumnWithoutWidth) {
                             clearWidths();
                         }
@@ -212,29 +195,25 @@ export const componentInfo = {
                         }
                     }
                 }
-            }),
-        },
-        {
+            }
+        }, {
             name: 'space',
             type: 'number',
             defaultValue: 20,
             helperText: 'Size of gap between columns',
-            advanced: true,
-        },
-        {
+            advanced: true
+        }, {
             name: 'stackColumnsAt',
             type: 'string',
             defaultValue: 'tablet',
             helperText: 'Convert horizontal columns to vertical at what device size',
             enum: ['tablet', 'mobile', 'never'],
-            advanced: true,
-        },
-        {
+            advanced: true
+        }, {
             name: 'reverseColumnsWhenStacked',
             type: 'boolean',
             defaultValue: false,
             helperText: 'When stacking columns for mobile devices, reverse the ordering',
-            advanced: true,
-        },
-    ],
+            advanced: true
+        }]
 };

package/package/blocks/custom-code/component-info.d.ts

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

package/package/blocks/custom-code/component-info.js

@@ -2,26 +2,22 @@ export const componentInfo = {
     name: 'Custom Code',
     static: true,
     requiredPermissions: ['editCode'],
-    inputs: [
-        {
+    inputs: [{
             name: 'code',
             type: 'html',
             required: true,
             defaultValue: '<p>Hello there, I am custom HTML code!</p>',
-            code: true,
-        },
-        {
+            code: true
+        }, {
             name: 'replaceNodes',
             type: 'boolean',
             helperText: 'Preserve server rendered dom nodes',
-            advanced: true,
-        },
-        {
+            advanced: true
+        }, {
             name: 'scriptsClientOnly',
             type: 'boolean',
             defaultValue: false,
             helperText: 'Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads',
-            advanced: true,
-        },
-    ],
+            advanced: true
+        }]
 };

package/package/blocks/embed/component-info.d.ts

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

package/package/blocks/embed/component-info.js

@@ -1,23 +1,19 @@
-import { serializeFn } from '../util.js';
 export const componentInfo = {
     name: 'Embed',
     static: true,
-    inputs: [
-        {
+    inputs: [{
             name: 'url',
             type: 'url',
             required: true,
             defaultValue: '',
             helperText: 'e.g. enter a youtube url, google map, etc',
-            onChange: serializeFn((options) => {
+            onChange: (options) => {
                 const url = options.get('url');
                 if (url) {
                     options.set('content', 'Loading...');
                     // TODO: get this out of here!
                     const apiKey = 'ae0e60e78201a3f2b0de4b';
-                    return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`)
-                        .then((res) => res.json())
-                        .then((data) => {
+                    return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then(res => res.json()).then(data => {
                         if (options.get('url') === url) {
                             if (data.html) {
                                 options.set('content', data.html);
@@ -26,21 +22,18 @@ export const componentInfo = {
                                 options.set('content', 'Invalid url, please try another');
                             }
                         }
-                    })
-                        .catch((_err) => {
+                    }).catch(_err => {
                         options.set('content', 'There was an error embedding this URL, please try again or another URL');
                     });
                 }
                 else {
                     options.delete('content');
                 }
-            }),
-        },
-        {
+            }
+        }, {
             name: 'content',
             type: 'html',
             defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
-            hideFromUI: true,
-        },
-    ],
+            hideFromUI: true
+        }]
 };

package/package/blocks/embed/helpers.js

@@ -1,6 +1,2 @@
-const SCRIPT_MIME_TYPES = [
-    'text/javascript',
-    'application/javascript',
-    'application/ecmascript',
-];
+const SCRIPT_MIME_TYPES = ['text/javascript', 'application/javascript', 'application/ecmascript'];
 export const isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);

package/package/blocks/form/component-info.d.ts

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