@slicemachine/adapter-next 0.3.15-dev-next-release.7 → 0.3.15-dev-next-release.9

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 (30) hide show
  1. package/dist/CustomerLogos/screenshot-default.png +0 -0
  2. package/dist/Hero/screenshot-default.png +0 -0
  3. package/dist/Hero/screenshot-imageRight.png +0 -0
  4. package/dist/hooks/sliceTemplateLibrary-read.cjs +5 -4
  5. package/dist/hooks/sliceTemplateLibrary-read.cjs.map +1 -1
  6. package/dist/hooks/sliceTemplateLibrary-read.js +5 -4
  7. package/dist/hooks/sliceTemplateLibrary-read.js.map +1 -1
  8. package/dist/sliceTemplates/AlternateGrid/index.cjs +425 -411
  9. package/dist/sliceTemplates/AlternateGrid/index.cjs.map +1 -1
  10. package/dist/sliceTemplates/AlternateGrid/index.js +425 -411
  11. package/dist/sliceTemplates/AlternateGrid/index.js.map +1 -1
  12. package/dist/sliceTemplates/CallToAction/index.cjs +2 -0
  13. package/dist/sliceTemplates/CallToAction/index.cjs.map +1 -1
  14. package/dist/sliceTemplates/CallToAction/index.js +2 -0
  15. package/dist/sliceTemplates/CallToAction/index.js.map +1 -1
  16. package/dist/sliceTemplates/CustomerLogos/index.cjs +258 -257
  17. package/dist/sliceTemplates/CustomerLogos/index.cjs.map +1 -1
  18. package/dist/sliceTemplates/CustomerLogos/index.js +258 -257
  19. package/dist/sliceTemplates/CustomerLogos/index.js.map +1 -1
  20. package/dist/sliceTemplates/Hero/index.cjs +814 -0
  21. package/dist/sliceTemplates/Hero/index.cjs.map +1 -0
  22. package/dist/sliceTemplates/Hero/index.d.ts +9 -0
  23. package/dist/sliceTemplates/Hero/index.js +814 -0
  24. package/dist/sliceTemplates/Hero/index.js.map +1 -0
  25. package/package.json +3 -3
  26. package/src/hooks/sliceTemplateLibrary-read.ts +2 -1
  27. package/src/sliceTemplates/AlternateGrid/index.ts +425 -411
  28. package/src/sliceTemplates/CallToAction/index.ts +2 -0
  29. package/src/sliceTemplates/CustomerLogos/index.ts +258 -257
  30. package/src/sliceTemplates/Hero/index.ts +824 -0
@@ -302,6 +302,7 @@ export const createComponentContents = (
302
302
  };
303
303
 
304
304
  export default ${pascalName};
305
+
305
306
  `;
306
307
  }
307
308
 
@@ -439,6 +440,7 @@ export const createComponentContents = (
439
440
  };
440
441
 
441
442
  export default ${pascalName};
443
+
442
444
  `;
443
445
  };
444
446
 
@@ -259,270 +259,271 @@ export const createComponentContents = (
259
259
 
260
260
  if (isTypeScriptProject) {
261
261
  return stripIndent`
262
- import { Content, isFilled, asText } from "@prismicio/client";
263
- import {
264
- SliceComponentProps,
265
- PrismicLink,
266
- PrismicImage,
267
- } from "@prismicio/react";
268
-
269
- export type ${pascalName}Props =
270
- SliceComponentProps<Content.${pascalName}Slice>;
271
-
272
- const ${pascalName} = ({ slice }: ${pascalName}Props): JSX.Element => {
273
- return (
274
- <section
275
- data-slice-type={slice.slice_type}
276
- data-slice-variation={slice.variation}
277
- className="essential-slice es-bounded es-customer-logos"
278
- >
279
- <div className="es-bounded-content es-customer-logos__content">
280
- {isFilled.richText(slice.primary.eyebrowHeadline) && (
281
- <h2 className="es-customer-logos__heading">
282
- {asText(slice.primary.eyebrowHeadline)}
283
- </h2>
284
- )}
285
- {slice.items.length > 0 && (
286
- <ul className="es-customer-logos__logos">
287
- {slice.items.map(
288
- (item) =>
289
- isFilled.image(item.image) && (
290
- <li key={item.image.url} className="es-customer-logos__logo">
291
- <PrismicLink
292
- field={item.link}
293
- className="es-customer-logos__link"
294
- >
295
- <PrismicImage
296
- field={item.image}
297
- height={26}
298
- width={160}
299
- className="es-customer-logos__logo__link__image"
300
- />
301
- </PrismicLink>
302
- </li>
303
- )
304
- )}
305
- </ul>
306
- )}
307
- <PrismicLink
308
- field={slice.primary.callToActionLink}
309
- className="es-customer-logos__button"
310
- >
311
- {slice.primary.callToActionLabel || "Learn more..."}
312
- </PrismicLink>
313
- </div>
314
- <style>
315
- {\`
316
- .es-bounded {
317
- margin: 0px;
318
- min-width: 0px;
319
- position: relative;
320
- padding: 8vw 1.25rem;
321
- }
262
+ import { Content, isFilled, asText } from "@prismicio/client";
263
+ import { PrismicNextLink, PrismicNextImage } from "@prismicio/next";
264
+ import { SliceComponentProps } from "@prismicio/react";
265
+
266
+ /**
267
+ * Props for \`${pascalName}\`.
268
+ */
269
+ export type ${pascalName}Props = SliceComponentProps<Content.${pascalName}Slice>;
270
+
271
+ /**
272
+ * Component for "${model.name}" Slices.
273
+ */
274
+ const ${pascalName} = ({ slice }: ${pascalName}Props): JSX.Element => {
275
+ return (
276
+ <section
277
+ data-slice-type={slice.slice_type}
278
+ data-slice-variation={slice.variation}
279
+ className="es-bounded es-customer-logos"
280
+ >
281
+ <div className="es-bounded-content es-customer-logos__content">
282
+ {isFilled.richText(slice.primary.eyebrowHeadline) && (
283
+ <h2 className="es-customer-logos__heading">
284
+ {asText(slice.primary.eyebrowHeadline)}
285
+ </h2>
286
+ )}
287
+ {slice.items.length > 0 && (
288
+ <ul className="es-customer-logos__logos">
289
+ {slice.items.map(
290
+ (item) =>
291
+ isFilled.image(item.image) && (
292
+ <li key={item.image.url} className="es-customer-logos__logo">
293
+ <PrismicNextLink
294
+ field={item.link}
295
+ className="es-customer-logos__link"
296
+ >
297
+ <PrismicNextImage
298
+ field={item.image}
299
+ height={26}
300
+ width={160}
301
+ className="es-customer-logos__logo__link__image"
302
+ />
303
+ </PrismicNextLink>
304
+ </li>
305
+ )
306
+ )}
307
+ </ul>
308
+ )}
309
+ <PrismicNextLink
310
+ field={slice.primary.callToActionLink}
311
+ className="es-customer-logos__button"
312
+ >
313
+ {slice.primary.callToActionLabel || "Learn more..."}
314
+ </PrismicNextLink>
315
+ </div>
316
+ <style>
317
+ {\`
318
+ .es-bounded {
319
+ margin: 0px;
320
+ min-width: 0px;
321
+ position: relative;
322
+ padding: 8vw 1.25rem;
323
+ }
322
324
 
323
- .es-bounded-content {
324
- min-width: 0px;
325
- max-width: 90%;
326
- margin: 0px auto;
327
- font-family: system-ui, sans-serif;
328
- }
325
+ .es-bounded-content {
326
+ min-width: 0px;
327
+ max-width: 90%;
328
+ margin: 0px auto;
329
+ font-family: system-ui, sans-serif;
330
+ }
329
331
 
330
- .es-customer-logos {
331
- background-color: #f4f0ec;
332
- color: #333;
333
- }
334
-
335
- .es-customer-logos__content {
336
- display: grid;
337
- gap: 2rem;
338
- justify-items: center;
339
- }
340
-
341
- .es-customer-logos__heading {
342
- color: #8592e0;
343
- font-size: 1.5rem;
344
- font-weight: 500;
345
- text-align: center;
346
- }
347
-
348
- .es-customer-logos__logos {
349
- display: grid;
350
- grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
351
- grid-column-gap: 1.25rem;
352
- grid-row-gap: 2rem;
353
- align-items: center;
354
- list-style-type: none;
355
- width: 100%;
356
- }
357
-
358
- @media (min-width: 1200px) {
359
- .es-customer-logos__logos {
360
- margin-left: -3rem;
361
- }
362
- }
363
-
364
- .es-customer-logos__logo {
365
- margin: 0;
366
- display: flex;
367
- justify-content: center;
368
- }
369
-
370
- @media (min-width: 1200px) {
371
- .es-customer-logos__logo {
372
- margin-left: 3rem;
373
- }
374
- }
375
-
376
- .es-customer-logos__logo__link__image {
377
- max-width: 10rem;
378
- }
379
-
380
- .es-customer-logos__button {
381
- justify-self: center;
382
- }
383
- \`}
384
- </style>
385
- </section>
386
- );
387
- };
388
-
389
- export default ${pascalName};
390
- `;
332
+ .es-customer-logos {
333
+ background-color: #f4f0ec;
334
+ color: #333;
335
+ }
336
+
337
+ .es-customer-logos__content {
338
+ display: grid;
339
+ gap: 2rem;
340
+ justify-items: center;
341
+ }
342
+
343
+ .es-customer-logos__heading {
344
+ color: #8592e0;
345
+ font-size: 1.5rem;
346
+ font-weight: 500;
347
+ text-align: center;
348
+ }
349
+
350
+ .es-customer-logos__logos {
351
+ display: grid;
352
+ grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
353
+ grid-column-gap: 1.25rem;
354
+ grid-row-gap: 2rem;
355
+ align-items: center;
356
+ list-style-type: none;
357
+ width: 100%;
358
+ }
359
+
360
+ @media (min-width: 1200px) {
361
+ .es-customer-logos__logos {
362
+ margin-left: -3rem;
363
+ }
364
+ }
365
+
366
+ .es-customer-logos__logo {
367
+ margin: 0;
368
+ display: flex;
369
+ justify-content: center;
370
+ }
371
+
372
+ @media (min-width: 1200px) {
373
+ .es-customer-logos__logo {
374
+ margin-left: 3rem;
375
+ }
376
+ }
377
+
378
+ .es-customer-logos__logo__link__image {
379
+ max-width: 10rem;
380
+ }
381
+
382
+ .es-customer-logos__button {
383
+ justify-self: center;
384
+ text-decoration: underline;
385
+ }
386
+ \`}
387
+ </style>
388
+ </section>
389
+ );
390
+ };
391
+
392
+ export default ${pascalName};
393
+
394
+ `;
391
395
  }
392
396
 
393
397
  return stripIndent`
394
- import { isFilled, asText } from "@prismicio/client";
395
- import {
396
- PrismicLink,
397
- PrismicImage,
398
- } from "@prismicio/react";
399
-
400
- /**
401
- * @typedef {import("@prismicio/client").Content.${pascalName}Slice} ${pascalName}Slice
402
- * @typedef {import("@prismicio/react").SliceComponentProps<${pascalName}Slice>} ${pascalName}Props
403
- * @param {${pascalName}Props}
404
- */
405
-
406
- const ${pascalName} = ({ slice }) => {
407
- return (
408
- <section
409
- data-slice-type={slice.slice_type}
410
- data-slice-variation={slice.variation}
411
- className="essential-slice es-bounded es-customer-logos"
412
- >
413
- <div className="es-bounded-content es-customer-logos__content">
414
- {isFilled.richText(slice.primary.eyebrowHeadline) && (
415
- <h2 className="es-customer-logos__heading">
416
- {asText(slice.primary.eyebrowHeadline)}
417
- </h2>
418
- )}
419
- {slice.items.length > 0 && (
420
- <ul className="es-customer-logos__logos">
421
- {slice.items.map(
422
- (item) =>
423
- isFilled.image(item.image) && (
424
- <li key={item.image.url} className="es-customer-logos__logo">
425
- <PrismicLink
426
- field={item.link}
427
- className="es-customer-logos__link"
428
- >
429
- <PrismicImage
430
- field={item.image}
431
- height={26}
432
- width={160}
433
- className="es-customer-logos__logo__link__image"
434
- />
435
- </PrismicLink>
436
- </li>
437
- )
438
- )}
439
- </ul>
440
- )}
441
- <PrismicLink
442
- field={slice.primary.callToActionLink}
443
- className="es-customer-logos__button"
444
- >
445
- {slice.primary.callToActionLabel || "Learn more..."}
446
- </PrismicLink>
447
- </div>
448
- <style>
449
- {\`
450
- .es-bounded {
451
- margin: 0px;
452
- min-width: 0px;
453
- position: relative;
454
- padding: 8vw 1.25rem;
455
- }
398
+ import { isFilled, asText } from "@prismicio/client";
399
+ import { PrismicNextLink, PrismicNextImage } from "@prismicio/next";
400
+
401
+ /**
402
+ * @typedef {import("@prismicio/client").Content.${pascalName}Slice} ${pascalName}Slice
403
+ * @typedef {import("@prismicio/react").SliceComponentProps<${pascalName}Slice>} ${pascalName}Props
404
+ * @param {${pascalName}Props}
405
+ */
406
+ const ${pascalName} = ({ slice }) => {
407
+ return (
408
+ <section
409
+ data-slice-type={slice.slice_type}
410
+ data-slice-variation={slice.variation}
411
+ className="es-bounded es-customer-logos"
412
+ >
413
+ <div className="es-bounded-content es-customer-logos__content">
414
+ {isFilled.richText(slice.primary.eyebrowHeadline) && (
415
+ <h2 className="es-customer-logos__heading">
416
+ {asText(slice.primary.eyebrowHeadline)}
417
+ </h2>
418
+ )}
419
+ {slice.items.length > 0 && (
420
+ <ul className="es-customer-logos__logos">
421
+ {slice.items.map(
422
+ (item) =>
423
+ isFilled.image(item.image) && (
424
+ <li key={item.image.url} className="es-customer-logos__logo">
425
+ <PrismicNextLink
426
+ field={item.link}
427
+ className="es-customer-logos__link"
428
+ >
429
+ <PrismicNextImage
430
+ field={item.image}
431
+ height={26}
432
+ width={160}
433
+ className="es-customer-logos__logo__link__image"
434
+ />
435
+ </PrismicNextLink>
436
+ </li>
437
+ )
438
+ )}
439
+ </ul>
440
+ )}
441
+ <PrismicNextLink
442
+ field={slice.primary.callToActionLink}
443
+ className="es-customer-logos__button"
444
+ >
445
+ {slice.primary.callToActionLabel || "Learn more..."}
446
+ </PrismicNextLink>
447
+ </div>
448
+ <style>
449
+ {\`
450
+ .es-bounded {
451
+ margin: 0px;
452
+ min-width: 0px;
453
+ position: relative;
454
+ padding: 8vw 1.25rem;
455
+ }
456
456
 
457
- .es-bounded-content {
458
- min-width: 0px;
459
- max-width: 90%;
460
- margin: 0px auto;
461
- font-family: system-ui, sans-serif;
462
- }
457
+ .es-bounded-content {
458
+ min-width: 0px;
459
+ max-width: 90%;
460
+ margin: 0px auto;
461
+ font-family: system-ui, sans-serif;
462
+ }
463
463
 
464
- .es-customer-logos {
465
- background-color: #f4f0ec;
466
- color: #333;
467
- }
468
-
469
- .es-customer-logos__content {
470
- display: grid;
471
- gap: 2rem;
472
- justify-items: center;
473
- }
474
-
475
- .es-customer-logos__heading {
476
- color: #8592e0;
477
- font-size: 1.5rem;
478
- font-weight: 500;
479
- text-align: center;
480
- }
481
-
482
- .es-customer-logos__logos {
483
- display: grid;
484
- grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
485
- grid-column-gap: 1.25rem;
486
- grid-row-gap: 2rem;
487
- align-items: center;
488
- list-style-type: none;
489
- width: 100%;
490
- }
491
-
492
- @media (min-width: 1200px) {
493
- .es-customer-logos__logos {
494
- margin-left: -3rem;
495
- }
496
- }
497
-
498
- .es-customer-logos__logo {
499
- margin: 0;
500
- display: flex;
501
- justify-content: center;
502
- }
503
-
504
- @media (min-width: 1200px) {
505
- .es-customer-logos__logo {
506
- margin-left: 3rem;
507
- }
508
- }
509
-
510
- .es-customer-logos__logo__link__image {
511
- max-width: 10rem;
512
- }
513
-
514
- .es-customer-logos__button {
515
- justify-self: center;
516
- }
517
- \`}
518
- </style>
519
- </section>
520
- );
521
- };
522
-
523
- export default ${pascalName};
524
-
525
- `;
464
+ .es-customer-logos {
465
+ background-color: #f4f0ec;
466
+ color: #333;
467
+ }
468
+
469
+ .es-customer-logos__content {
470
+ display: grid;
471
+ gap: 2rem;
472
+ justify-items: center;
473
+ }
474
+
475
+ .es-customer-logos__heading {
476
+ color: #8592e0;
477
+ font-size: 1.5rem;
478
+ font-weight: 500;
479
+ text-align: center;
480
+ }
481
+
482
+ .es-customer-logos__logos {
483
+ display: grid;
484
+ grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
485
+ grid-column-gap: 1.25rem;
486
+ grid-row-gap: 2rem;
487
+ align-items: center;
488
+ list-style-type: none;
489
+ width: 100%;
490
+ }
491
+
492
+ @media (min-width: 1200px) {
493
+ .es-customer-logos__logos {
494
+ margin-left: -3rem;
495
+ }
496
+ }
497
+
498
+ .es-customer-logos__logo {
499
+ margin: 0;
500
+ display: flex;
501
+ justify-content: center;
502
+ }
503
+
504
+ @media (min-width: 1200px) {
505
+ .es-customer-logos__logo {
506
+ margin-left: 3rem;
507
+ }
508
+ }
509
+
510
+ .es-customer-logos__logo__link__image {
511
+ max-width: 10rem;
512
+ }
513
+
514
+ .es-customer-logos__button {
515
+ justify-self: center;
516
+ text-decoration: underline;
517
+ }
518
+ \`}
519
+ </style>
520
+ </section>
521
+ );
522
+ };
523
+
524
+ export default ${pascalName};
525
+
526
+ `;
526
527
  };
527
528
 
528
529
  export const model: SharedSlice = {