@builder.io/sdk-qwik 0.0.9 → 0.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/lib/index.qwik.cjs +151 -207
  2. package/lib/index.qwik.mjs +152 -208
  3. package/package.json +3 -3
  4. package/src/blocks/button/button.jsx +0 -175
  5. package/src/blocks/columns/columns.jsx +27 -197
  6. package/src/blocks/custom-code/custom-code.jsx +16 -75
  7. package/src/blocks/embed/embed.jsx +20 -87
  8. package/src/blocks/form/builder-blocks.jsx +0 -75
  9. package/src/blocks/form/form.jsx +57 -536
  10. package/src/blocks/fragment/fragment.jsx +8 -56
  11. package/src/blocks/image/image.jsx +49 -493
  12. package/src/blocks/img/img.jsx +15 -72
  13. package/src/blocks/input/input.jsx +17 -83
  14. package/src/blocks/raw-text/raw-text.jsx +9 -50
  15. package/src/blocks/section/section.jsx +17 -94
  16. package/src/blocks/select/select.jsx +20 -145
  17. package/src/blocks/submit-button/submit-button.jsx +8 -84
  18. package/src/blocks/symbol/symbol.jsx +60 -194
  19. package/src/blocks/text/text.jsx +4 -43
  20. package/src/blocks/textarea/textarea.jsx +12 -62
  21. package/src/blocks/video/video.jsx +21 -71
  22. package/src/components/render-block/block-styles.jsx +0 -114
  23. package/src/components/render-block/render-block.jsx +0 -514
  24. package/src/components/render-block/render-component.jsx +0 -211
  25. package/src/components/render-block/render-repeated-block.jsx +0 -67
  26. package/src/components/render-blocks.jsx +40 -334
  27. package/src/components/render-content/components/render-styles.jsx +0 -50
  28. package/src/components/render-content/render-content.jsx +86 -385
  29. package/src/components/render-inlined-styles.jsx +0 -116
package/src/blocks/fragment/fragment.jsx CHANGED
@@ -1,59 +1,11 @@
1
1
  // GENERATED BY MITOSIS
2
2
 
3
- import { Fragment, Host, Slot, component$, h } from "@builder.io/qwik";
4
- export const FragmentComponent = component$(
5
- (props) => {
6
- return (
7
- <Host>
8
- <Slot></Slot>
9
- </Host>
10
- );
11
- },
12
- { tagName: "span" }
13
- );
3
+ import { Fragment, Slot, component$, h } from "@builder.io/qwik";
4
+ export const FragmentComponent = component$((props) => {
5
+ return (
6
+ <span>
7
+ <Slot></Slot>
8
+ </span>
9
+ );
10
+ });
14
11
  export default FragmentComponent;
15
- export const COMPONENT = {
16
- "@type": "@builder.io/mitosis/component",
17
- imports: [],
18
- exports: {},
19
- inputs: [],
20
- meta: {},
21
- refs: {},
22
- state: {},
23
- children: [
24
- {
25
- "@type": "@builder.io/mitosis/node",
26
- name: "Host",
27
- meta: {},
28
- scope: {},
29
- properties: {},
30
- bindings: {},
31
- children: [
32
- {
33
- "@type": "@builder.io/mitosis/node",
34
- name: "div",
35
- meta: {},
36
- scope: {},
37
- properties: {},
38
- bindings: {
39
- _text: {
40
- code: "props.children",
41
- },
42
- },
43
- children: [],
44
- },
45
- ],
46
- },
47
- ],
48
- hooks: {},
49
- context: {
50
- get: {},
51
- set: {},
52
- },
53
- name: "FragmentComponent",
54
- subComponents: [],
55
- interfaces: [
56
- "export interface FragmentProps {\n maxWidth?: number;\n attributes?: any;\n children?: any;\n}",
57
- ],
58
- propsTypeRef: "FragmentProps",
59
- };
package/src/blocks/image/image.jsx CHANGED
@@ -3,7 +3,6 @@
3
3
  import { getSrcSet } from "./image.helpers";
4
4
  import {
5
5
  Fragment,
6
- Host,
7
6
  Slot,
8
7
  component$,
9
8
  h,
@@ -39,63 +38,55 @@ export const webpSrcSet = function webpSrcSet(props, state) {
39
38
  return "";
40
39
  }
41
40
  };
42
- export const Image = component$(
43
- (props) => {
44
- useStylesScoped$(STYLES);
45
- const state = {};
46
- return (
47
- <Host class="div-Image">
48
- <>
49
- <picture>
50
- {webpSrcSet(props, state) ? (
51
- <source
52
- type="image/webp"
53
- srcset={webpSrcSet(props, state)}
54
- ></source>
55
- ) : null}
56
- <img
57
- loading="lazy"
58
- alt={props.altText}
59
- role={props.altText ? "presentation" : undefined}
60
- style={{
61
- objectPosition: props.backgroundSize || "center",
62
- objectFit: props.backgroundSize || "cover",
63
- }}
64
- class={
65
- "builder-image" +
66
- (props.className ? " " + props.className : "") +
67
- " img-Image"
68
- }
69
- src={props.image}
70
- srcset={srcSetToUse(props, state)}
71
- sizes={props.sizes}
72
- ></img>
73
- <source srcset={srcSetToUse(props, state)}></source>
74
- </picture>
75
- {props.aspectRatio &&
76
- !(props.fitContent && props.builderBlock?.children?.length) ? (
77
- <div
78
- class="builder-image-sizer div-Image-2"
79
- style={{
80
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
81
- paddingTop: props.aspectRatio * 100 + "%",
82
- }}
83
- ></div>
84
- ) : null}
85
- {props.builderBlock?.children?.length && props.fitContent ? (
86
- <Slot></Slot>
87
- ) : null}
88
- {!props.fitContent ? (
89
- <div class="div-Image-3">
90
- <Slot></Slot>
91
- </div>
92
- ) : null}
93
- </>
94
- </Host>
95
- );
96
- },
97
- { tagName: "div" }
98
- );
41
+ export const Image = component$((props) => {
42
+ useStylesScoped$(STYLES);
43
+ const state = {};
44
+ return (
45
+ <div class="div-Image">
46
+ <picture>
47
+ {webpSrcSet(props, state) ? (
48
+ <source type="image/webp" srcset={webpSrcSet(props, state)}></source>
49
+ ) : null}
50
+ <img
51
+ loading="lazy"
52
+ alt={props.altText}
53
+ role={props.altText ? "presentation" : undefined}
54
+ style={{
55
+ objectPosition: props.backgroundSize || "center",
56
+ objectFit: props.backgroundSize || "cover",
57
+ }}
58
+ class={
59
+ "builder-image" +
60
+ (props.className ? " " + props.className : "") +
61
+ " img-Image"
62
+ }
63
+ src={props.image}
64
+ srcset={srcSetToUse(props, state)}
65
+ sizes={props.sizes}
66
+ ></img>
67
+ <source srcset={srcSetToUse(props, state)}></source>
68
+ </picture>
69
+ {props.aspectRatio &&
70
+ !(props.fitContent && props.builderBlock?.children?.length) ? (
71
+ <div
72
+ class="builder-image-sizer div-Image-2"
73
+ style={{
74
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
75
+ paddingTop: props.aspectRatio * 100 + "%",
76
+ }}
77
+ ></div>
78
+ ) : null}
79
+ {props.builderBlock?.children?.length && props.fitContent ? (
80
+ <Slot></Slot>
81
+ ) : null}
82
+ {!props.fitContent ? (
83
+ <div class="div-Image-3">
84
+ <Slot></Slot>
85
+ </div>
86
+ ) : null}
87
+ </div>
88
+ );
89
+ });
99
90
  export default Image;
100
91
  export const STYLES = `.div-Image {
101
92
  position: relative; }.img-Image {
@@ -117,438 +108,3 @@ top: 0;
117
108
  left: 0;
118
109
  width: 100%;
119
110
  height: 100%; }`;
120
- export const COMPONENT = {
121
- "@type": "@builder.io/mitosis/component",
122
- imports: [
123
- {
124
- imports: {
125
- getSrcSet: "getSrcSet",
126
- },
127
- path: "./image.helpers",
128
- },
129
- ],
130
- exports: {},
131
- inputs: [],
132
- meta: {},
133
- refs: {},
134
- state: {
135
- srcSetToUse:
136
- "@builder.io/mitosis/method:get srcSetToUse() {\n const imageToUse = props.image || props.src;\n const url = imageToUse;\n\n if (!url || // We can auto add srcset for cdn.builder.io and shopify\n // images, otherwise you can supply this prop manually\n !(url.match(/builder\\.io/) || url.match(/cdn\\.shopify\\.com/))) {\n return props.srcset;\n }\n\n if (props.srcset && props.image?.includes('builder.io/api/v1/image')) {\n if (!props.srcset.includes(props.image.split('?')[0])) {\n console.debug('Removed given srcset');\n return getSrcSet(url);\n }\n } else if (props.image && !props.srcset) {\n return getSrcSet(url);\n }\n\n return getSrcSet(url);\n}",
137
- webpSrcSet:
138
- "@builder.io/mitosis/method:get webpSrcSet() {\n if (srcSetToUse(props,state)?.match(/builder\\.io/) && !props.noWebp) {\n return srcSetToUse(props,state).replace(/\\?/g, '?format=webp&');\n } else {\n return '';\n }\n}",
139
- },
140
- children: [
141
- {
142
- "@type": "@builder.io/mitosis/node",
143
- name: "Host",
144
- meta: {},
145
- scope: {},
146
- properties: {
147
- class: "div-Image",
148
- },
149
- bindings: {},
150
- children: [
151
- {
152
- "@type": "@builder.io/mitosis/node",
153
- name: "div",
154
- meta: {},
155
- scope: {},
156
- properties: {
157
- _text: "\n ",
158
- },
159
- bindings: {},
160
- children: [],
161
- },
162
- {
163
- "@type": "@builder.io/mitosis/node",
164
- name: "picture",
165
- meta: {},
166
- scope: {},
167
- properties: {},
168
- bindings: {},
169
- children: [
170
- {
171
- "@type": "@builder.io/mitosis/node",
172
- name: "div",
173
- meta: {},
174
- scope: {},
175
- properties: {
176
- _text: "\n ",
177
- },
178
- bindings: {},
179
- children: [],
180
- },
181
- {
182
- "@type": "@builder.io/mitosis/node",
183
- name: "Show",
184
- meta: {},
185
- scope: {},
186
- properties: {},
187
- bindings: {
188
- when: {
189
- code: "webpSrcSet(props,state)",
190
- },
191
- },
192
- children: [
193
- {
194
- "@type": "@builder.io/mitosis/node",
195
- name: "div",
196
- meta: {},
197
- scope: {},
198
- properties: {
199
- _text: "\n ",
200
- },
201
- bindings: {},
202
- children: [],
203
- },
204
- {
205
- "@type": "@builder.io/mitosis/node",
206
- name: "source",
207
- meta: {},
208
- scope: {},
209
- properties: {
210
- type: "image/webp",
211
- },
212
- bindings: {
213
- srcset: {
214
- code: "webpSrcSet(props,state)",
215
- },
216
- },
217
- children: [],
218
- },
219
- {
220
- "@type": "@builder.io/mitosis/node",
221
- name: "div",
222
- meta: {},
223
- scope: {},
224
- properties: {
225
- _text: "\n ",
226
- },
227
- bindings: {},
228
- children: [],
229
- },
230
- ],
231
- },
232
- {
233
- "@type": "@builder.io/mitosis/node",
234
- name: "div",
235
- meta: {},
236
- scope: {},
237
- properties: {
238
- _text: "\n ",
239
- },
240
- bindings: {},
241
- children: [],
242
- },
243
- {
244
- "@type": "@builder.io/mitosis/node",
245
- name: "img",
246
- meta: {},
247
- scope: {},
248
- properties: {
249
- loading: "lazy",
250
- },
251
- bindings: {
252
- alt: {
253
- code: "props.altText",
254
- },
255
- role: {
256
- code: "props.altText ? 'presentation' : undefined",
257
- },
258
- style: {
259
- code: "{\n objectPosition: props.backgroundSize || 'center',\n objectFit: props.backgroundSize || 'cover'\n}",
260
- },
261
- class: {
262
- code: "'builder-image' + (props.className ? ' ' + props.className : '') + ' img-Image'",
263
- },
264
- src: {
265
- code: "props.image",
266
- },
267
- srcset: {
268
- code: "srcSetToUse(props,state)",
269
- },
270
- sizes: {
271
- code: "props.sizes",
272
- },
273
- },
274
- children: [],
275
- },
276
- {
277
- "@type": "@builder.io/mitosis/node",
278
- name: "div",
279
- meta: {},
280
- scope: {},
281
- properties: {
282
- _text: "\n ",
283
- },
284
- bindings: {},
285
- children: [],
286
- },
287
- {
288
- "@type": "@builder.io/mitosis/node",
289
- name: "source",
290
- meta: {},
291
- scope: {},
292
- properties: {},
293
- bindings: {
294
- srcset: {
295
- code: "srcSetToUse(props,state)",
296
- },
297
- },
298
- children: [],
299
- },
300
- {
301
- "@type": "@builder.io/mitosis/node",
302
- name: "div",
303
- meta: {},
304
- scope: {},
305
- properties: {
306
- _text: "\n ",
307
- },
308
- bindings: {},
309
- children: [],
310
- },
311
- ],
312
- },
313
- {
314
- "@type": "@builder.io/mitosis/node",
315
- name: "div",
316
- meta: {},
317
- scope: {},
318
- properties: {
319
- _text: "\n ",
320
- },
321
- bindings: {},
322
- children: [],
323
- },
324
- {
325
- "@type": "@builder.io/mitosis/node",
326
- name: "Show",
327
- meta: {},
328
- scope: {},
329
- properties: {},
330
- bindings: {
331
- when: {
332
- code: "props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)",
333
- },
334
- },
335
- children: [
336
- {
337
- "@type": "@builder.io/mitosis/node",
338
- name: "div",
339
- meta: {},
340
- scope: {},
341
- properties: {
342
- _text: "\n ",
343
- },
344
- bindings: {},
345
- children: [],
346
- },
347
- {
348
- "@type": "@builder.io/mitosis/node",
349
- name: "div",
350
- meta: {},
351
- scope: {},
352
- properties: {
353
- class: "builder-image-sizer div-Image-2",
354
- },
355
- bindings: {
356
- style: {
357
- code: "{\n paddingTop: // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n props.aspectRatio * 100 + '%'\n}",
358
- },
359
- },
360
- children: [],
361
- },
362
- {
363
- "@type": "@builder.io/mitosis/node",
364
- name: "div",
365
- meta: {},
366
- scope: {},
367
- properties: {
368
- _text: "\n ",
369
- },
370
- bindings: {},
371
- children: [],
372
- },
373
- ],
374
- },
375
- {
376
- "@type": "@builder.io/mitosis/node",
377
- name: "div",
378
- meta: {},
379
- scope: {},
380
- properties: {
381
- _text: "\n ",
382
- },
383
- bindings: {},
384
- children: [],
385
- },
386
- {
387
- "@type": "@builder.io/mitosis/node",
388
- name: "Show",
389
- meta: {},
390
- scope: {},
391
- properties: {},
392
- bindings: {
393
- when: {
394
- code: "props.builderBlock?.children?.length && props.fitContent",
395
- },
396
- },
397
- children: [
398
- {
399
- "@type": "@builder.io/mitosis/node",
400
- name: "div",
401
- meta: {},
402
- scope: {},
403
- properties: {
404
- _text: "\n ",
405
- },
406
- bindings: {},
407
- children: [],
408
- },
409
- {
410
- "@type": "@builder.io/mitosis/node",
411
- name: "div",
412
- meta: {},
413
- scope: {},
414
- properties: {},
415
- bindings: {
416
- _text: {
417
- code: "props.children",
418
- },
419
- },
420
- children: [],
421
- },
422
- {
423
- "@type": "@builder.io/mitosis/node",
424
- name: "div",
425
- meta: {},
426
- scope: {},
427
- properties: {
428
- _text: "\n ",
429
- },
430
- bindings: {},
431
- children: [],
432
- },
433
- ],
434
- },
435
- {
436
- "@type": "@builder.io/mitosis/node",
437
- name: "div",
438
- meta: {},
439
- scope: {},
440
- properties: {
441
- _text: "\n\n ",
442
- },
443
- bindings: {},
444
- children: [],
445
- },
446
- {
447
- "@type": "@builder.io/mitosis/node",
448
- name: "Show",
449
- meta: {},
450
- scope: {},
451
- properties: {},
452
- bindings: {
453
- when: {
454
- code: "!props.fitContent",
455
- },
456
- },
457
- children: [
458
- {
459
- "@type": "@builder.io/mitosis/node",
460
- name: "div",
461
- meta: {},
462
- scope: {},
463
- properties: {
464
- _text: "\n ",
465
- },
466
- bindings: {},
467
- children: [],
468
- },
469
- {
470
- "@type": "@builder.io/mitosis/node",
471
- name: "div",
472
- meta: {},
473
- scope: {},
474
- properties: {
475
- class: "div-Image-3",
476
- },
477
- bindings: {},
478
- children: [
479
- {
480
- "@type": "@builder.io/mitosis/node",
481
- name: "div",
482
- meta: {},
483
- scope: {},
484
- properties: {
485
- _text: "\n ",
486
- },
487
- bindings: {},
488
- children: [],
489
- },
490
- {
491
- "@type": "@builder.io/mitosis/node",
492
- name: "div",
493
- meta: {},
494
- scope: {},
495
- properties: {},
496
- bindings: {
497
- _text: {
498
- code: "props.children",
499
- },
500
- },
501
- children: [],
502
- },
503
- {
504
- "@type": "@builder.io/mitosis/node",
505
- name: "div",
506
- meta: {},
507
- scope: {},
508
- properties: {
509
- _text: "\n ",
510
- },
511
- bindings: {},
512
- children: [],
513
- },
514
- ],
515
- },
516
- {
517
- "@type": "@builder.io/mitosis/node",
518
- name: "div",
519
- meta: {},
520
- scope: {},
521
- properties: {
522
- _text: "\n ",
523
- },
524
- bindings: {},
525
- children: [],
526
- },
527
- ],
528
- },
529
- {
530
- "@type": "@builder.io/mitosis/node",
531
- name: "div",
532
- meta: {},
533
- scope: {},
534
- properties: {
535
- _text: "\n ",
536
- },
537
- bindings: {},
538
- children: [],
539
- },
540
- ],
541
- },
542
- ],
543
- hooks: {},
544
- context: {
545
- get: {},
546
- set: {},
547
- },
548
- name: "Image",
549
- subComponents: [],
550
- interfaces: [
551
- "export interface ImageProps {\n className?: string;\n image: string;\n sizes?: string;\n lazy?: boolean;\n height?: number;\n width?: number;\n altText?: string;\n backgroundSize?: string;\n backgroundPosition?: string;\n srcset?: string;\n aspectRatio?: number;\n children?: JSX.Element;\n fitContent?: boolean;\n builderBlock?: BuilderBlock;\n noWebp?: boolean;\n src?: string;\n}",
552
- ],
553
- propsTypeRef: "ImageProps",
554
- };