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