@digital-b2c/coreui-kit 0.1.0 → 0.2.1
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.
- package/LICENSE.txt +21 -21
- package/README.md +7 -1
- package/dist/index.cjs +749 -69
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +630 -123
- package/dist/index.css.map +1 -1
- package/dist/index.d.cts +244 -43
- package/dist/index.d.ts +244 -43
- package/dist/index.mjs +738 -64
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,43 @@
|
|
|
1
|
-
import React$1, { ImgHTMLAttributes, AnchorHTMLAttributes, HTMLAttributes, ReactNode, FC, PropsWithChildren } from 'react';
|
|
2
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import React$1, { ImgHTMLAttributes, ReactNode, AnchorHTMLAttributes, HTMLAttributes, FC, PropsWithChildren } from 'react';
|
|
3
|
+
|
|
4
|
+
interface IPicture {
|
|
5
|
+
src: string;
|
|
6
|
+
alt?: string;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
type SrcOnly = {
|
|
10
|
+
src: string;
|
|
11
|
+
desktop?: never;
|
|
12
|
+
mobile?: never;
|
|
13
|
+
};
|
|
14
|
+
type ResponsiveSources = {
|
|
15
|
+
src?: never;
|
|
16
|
+
desktop: IPicture;
|
|
17
|
+
mobile?: IPicture;
|
|
18
|
+
};
|
|
19
|
+
type PictureProps = ImgHTMLAttributes<HTMLImageElement> & (SrcOnly | ResponsiveSources);
|
|
20
|
+
|
|
21
|
+
interface ICta {
|
|
22
|
+
label: string;
|
|
23
|
+
url: string;
|
|
24
|
+
isExternal?: boolean;
|
|
25
|
+
}
|
|
26
|
+
interface ICtaLogo extends ICta {
|
|
27
|
+
pictures: PictureProps[];
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
interface BrandsStripProps {
|
|
31
|
+
className?: string;
|
|
32
|
+
variant?: 'light' | 'dark';
|
|
33
|
+
title?: string;
|
|
34
|
+
logos?: PictureProps[];
|
|
35
|
+
cta?: ICta;
|
|
36
|
+
size?: 'small';
|
|
37
|
+
animate?: boolean;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
declare const BrandsStrip: ({ className, variant, title, logos, cta, size, animate, }: BrandsStripProps) => react_jsx_runtime.JSX.Element;
|
|
3
41
|
|
|
4
42
|
declare const svgs: {
|
|
5
43
|
ads: React$1.FunctionComponent<React$1.SVGProps<SVGSVGElement> & {
|
|
@@ -162,55 +200,78 @@ interface IconProps extends React$1.ComponentPropsWithRef<'svg'> {
|
|
|
162
200
|
}
|
|
163
201
|
declare const Icon: React$1.FC<IconProps>;
|
|
164
202
|
|
|
203
|
+
declare const ButtonVariantReadOnly: readonly ["primary", "secondary", "ghost", "nofill", "grey", "nofillblack", "shiny"];
|
|
204
|
+
type TButtonVariant = (typeof ButtonVariantReadOnly)[number];
|
|
165
205
|
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
166
|
-
variant?:
|
|
206
|
+
variant?: TButtonVariant;
|
|
167
207
|
fullWidth?: boolean;
|
|
168
208
|
href?: string;
|
|
169
209
|
isExternal?: boolean;
|
|
170
210
|
icon?: IconType;
|
|
211
|
+
logo?: IPicture;
|
|
171
212
|
}
|
|
172
213
|
|
|
173
214
|
declare const Button: React.FC<ButtonProps>;
|
|
174
215
|
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
216
|
+
type CardSubtitleProps = {
|
|
217
|
+
children: ReactNode;
|
|
218
|
+
};
|
|
219
|
+
|
|
220
|
+
type CardTitleProps = {
|
|
221
|
+
children: ReactNode;
|
|
222
|
+
};
|
|
180
223
|
|
|
181
224
|
interface CardProps {
|
|
182
225
|
className?: string;
|
|
183
|
-
title?:
|
|
184
|
-
subtitle?:
|
|
226
|
+
title?: ReactNode;
|
|
227
|
+
subtitle?: ReactNode;
|
|
185
228
|
icon?: IconType;
|
|
186
229
|
cta?: ICta;
|
|
230
|
+
children?: ReactNode;
|
|
187
231
|
}
|
|
188
232
|
|
|
189
|
-
declare const Card: ({ className, title, subtitle, cta, icon }: CardProps) => react_jsx_runtime.JSX.Element
|
|
233
|
+
declare const Card: (({ className, title, subtitle, cta, icon, children }: CardProps) => react_jsx_runtime.JSX.Element) & {
|
|
234
|
+
Title: ({ children }: CardTitleProps) => react_jsx_runtime.JSX.Element;
|
|
235
|
+
Subtitle: ({ children }: CardSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
236
|
+
};
|
|
190
237
|
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
}
|
|
238
|
+
type CountingCardTitleProps = {
|
|
239
|
+
children: ReactNode;
|
|
240
|
+
};
|
|
195
241
|
|
|
196
242
|
interface CountingCardProps {
|
|
197
243
|
className?: string;
|
|
198
244
|
count?: number;
|
|
199
|
-
title?:
|
|
245
|
+
title?: ReactNode;
|
|
200
246
|
image?: IPicture;
|
|
247
|
+
children?: ReactNode;
|
|
201
248
|
}
|
|
202
249
|
|
|
203
|
-
declare const CountingCard: ({ className, title, count, image }: CountingCardProps) => react_jsx_runtime.JSX.Element
|
|
250
|
+
declare const CountingCard: (({ className, title, count, image, children }: CountingCardProps) => react_jsx_runtime.JSX.Element) & {
|
|
251
|
+
Title: ({ children }: CountingCardTitleProps) => react_jsx_runtime.JSX.Element;
|
|
252
|
+
};
|
|
253
|
+
|
|
254
|
+
type InfoCardSubtitleProps = {
|
|
255
|
+
children: ReactNode;
|
|
256
|
+
};
|
|
257
|
+
|
|
258
|
+
type InfoCardTitleProps = {
|
|
259
|
+
children: ReactNode;
|
|
260
|
+
};
|
|
204
261
|
|
|
205
262
|
interface InfoCardProps {
|
|
206
263
|
className?: string;
|
|
207
264
|
icon?: IconType;
|
|
208
265
|
badge?: string;
|
|
209
|
-
title?:
|
|
210
|
-
subtitle?:
|
|
266
|
+
title?: ReactNode;
|
|
267
|
+
subtitle?: ReactNode;
|
|
268
|
+
children?: ReactNode;
|
|
211
269
|
}
|
|
212
270
|
|
|
213
|
-
declare const InfoCard: ({ className, title, subtitle, icon, badge }: InfoCardProps) => react_jsx_runtime.JSX.Element
|
|
271
|
+
declare const InfoCard: (({ className, title, subtitle, icon, badge, children }: InfoCardProps) => react_jsx_runtime.JSX.Element) & {
|
|
272
|
+
Title: ({ children }: InfoCardTitleProps) => react_jsx_runtime.JSX.Element;
|
|
273
|
+
Subtitle: ({ children }: InfoCardSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
274
|
+
};
|
|
214
275
|
|
|
215
276
|
interface PaginationProps {
|
|
216
277
|
className?: string;
|
|
@@ -224,20 +285,17 @@ interface PaginationProps {
|
|
|
224
285
|
|
|
225
286
|
declare const Pagination: ({ className, totalPages, currentPage, loop, hasNumber, disableArrows, onPageChange, }: PaginationProps) => react_jsx_runtime.JSX.Element;
|
|
226
287
|
|
|
227
|
-
type SrcOnly = {
|
|
228
|
-
src: string;
|
|
229
|
-
desktop?: never;
|
|
230
|
-
mobile?: never;
|
|
231
|
-
};
|
|
232
|
-
type ResponsiveSources = {
|
|
233
|
-
src?: never;
|
|
234
|
-
desktop: IPicture;
|
|
235
|
-
mobile?: IPicture;
|
|
236
|
-
};
|
|
237
|
-
type PictureProps = ImgHTMLAttributes<HTMLImageElement> & (SrcOnly | ResponsiveSources);
|
|
238
|
-
|
|
239
288
|
declare const Picture: ({ className, ...props }: PictureProps) => react_jsx_runtime.JSX.Element;
|
|
240
289
|
|
|
290
|
+
interface PracticeCardProps {
|
|
291
|
+
className?: string;
|
|
292
|
+
title?: string;
|
|
293
|
+
cta?: ICta;
|
|
294
|
+
image?: IPicture;
|
|
295
|
+
}
|
|
296
|
+
|
|
297
|
+
declare const PracticeCard: ({ className, title, cta, image }: PracticeCardProps) => react_jsx_runtime.JSX.Element;
|
|
298
|
+
|
|
241
299
|
interface AnchorProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
242
300
|
isExternal?: boolean;
|
|
243
301
|
}
|
|
@@ -262,45 +320,188 @@ type ConditionalWrapperProps = {
|
|
|
262
320
|
|
|
263
321
|
declare const ConditionalWrapper: React.FC<PropsWithChildren<ConditionalWrapperProps>>;
|
|
264
322
|
|
|
323
|
+
type CardCollectionSubtitleProps = {
|
|
324
|
+
children: ReactNode;
|
|
325
|
+
};
|
|
326
|
+
|
|
327
|
+
type CardCollectionTitleProps = {
|
|
328
|
+
children: ReactNode;
|
|
329
|
+
};
|
|
330
|
+
|
|
265
331
|
interface CardCollectionProps {
|
|
266
332
|
className?: string;
|
|
267
333
|
variant?: 'default' | 'threeCols' | 'examCard' | 'cardCarousel';
|
|
268
|
-
title?:
|
|
269
|
-
subtitle?:
|
|
334
|
+
title?: ReactNode;
|
|
335
|
+
subtitle?: ReactNode;
|
|
270
336
|
cards?: CardProps[];
|
|
337
|
+
children?: ReactNode;
|
|
338
|
+
}
|
|
339
|
+
|
|
340
|
+
declare const CardCollection: (({ className, variant, title, subtitle, cards, children, }: CardCollectionProps) => react_jsx_runtime.JSX.Element) & {
|
|
341
|
+
Title: ({ children }: CardCollectionTitleProps) => react_jsx_runtime.JSX.Element;
|
|
342
|
+
Subtitle: ({ children }: CardCollectionSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
343
|
+
};
|
|
344
|
+
|
|
345
|
+
type ContactModuleSubtitleProps = {
|
|
346
|
+
children: ReactNode;
|
|
347
|
+
};
|
|
348
|
+
|
|
349
|
+
type ContactModuleTitleProps = {
|
|
350
|
+
children: ReactNode;
|
|
351
|
+
};
|
|
352
|
+
|
|
353
|
+
interface ContactModuleProps {
|
|
354
|
+
className?: string;
|
|
355
|
+
children?: ReactNode;
|
|
356
|
+
image?: IPicture;
|
|
357
|
+
title?: ReactNode;
|
|
358
|
+
subtitle?: ReactNode;
|
|
359
|
+
ctas?: ICta[];
|
|
360
|
+
blurred?: boolean;
|
|
271
361
|
}
|
|
272
362
|
|
|
273
|
-
declare const
|
|
363
|
+
declare const ContactModule: (({ className, children, title, subtitle, ctas, image, blurred, }: ContactModuleProps) => react_jsx_runtime.JSX.Element) & {
|
|
364
|
+
Title: ({ children }: ContactModuleTitleProps) => react_jsx_runtime.JSX.Element;
|
|
365
|
+
Subtitle: ({ children }: ContactModuleSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
366
|
+
};
|
|
367
|
+
|
|
368
|
+
type HeroBannerSubtitleProps = {
|
|
369
|
+
children: ReactNode;
|
|
370
|
+
};
|
|
371
|
+
|
|
372
|
+
type HeroBannerTitleProps = {
|
|
373
|
+
children: ReactNode;
|
|
374
|
+
};
|
|
375
|
+
|
|
376
|
+
interface HeroBannerProps {
|
|
377
|
+
className?: string;
|
|
378
|
+
variant?: 'pageHeroBanner' | 'bannerPodcast' | 'mainHeroBanner';
|
|
379
|
+
title?: ReactNode;
|
|
380
|
+
subtitle?: ReactNode;
|
|
381
|
+
backgroundImage?: PictureProps;
|
|
382
|
+
logo?: PictureProps;
|
|
383
|
+
cta?: ICta[];
|
|
384
|
+
ctaLogo?: ICtaLogo[];
|
|
385
|
+
brands?: BrandsStripProps;
|
|
386
|
+
children?: ReactNode;
|
|
387
|
+
}
|
|
388
|
+
|
|
389
|
+
declare const HeroBanner: (({ className, variant, title, subtitle, backgroundImage, logo, cta, brands, children, }: HeroBannerProps) => react_jsx_runtime.JSX.Element) & {
|
|
390
|
+
Title: ({ children }: HeroBannerTitleProps) => react_jsx_runtime.JSX.Element;
|
|
391
|
+
Subtitle: ({ children }: HeroBannerSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
392
|
+
};
|
|
393
|
+
|
|
394
|
+
type MiniBannerSubtitleProps = {
|
|
395
|
+
children: ReactNode;
|
|
396
|
+
};
|
|
397
|
+
|
|
398
|
+
type MiniBannerTitleProps = {
|
|
399
|
+
children: ReactNode;
|
|
400
|
+
};
|
|
401
|
+
|
|
402
|
+
interface MiniBannerProps {
|
|
403
|
+
className?: string;
|
|
404
|
+
variant?: 'default' | 'miniBannerNoBG';
|
|
405
|
+
logo?: IPicture;
|
|
406
|
+
background?: PictureProps;
|
|
407
|
+
title?: ReactNode;
|
|
408
|
+
subtitle?: ReactNode;
|
|
409
|
+
children?: ReactNode;
|
|
410
|
+
}
|
|
411
|
+
|
|
412
|
+
declare const MiniBanner: (({ className, variant, title, subtitle, logo, background, children, }: MiniBannerProps) => react_jsx_runtime.JSX.Element) & {
|
|
413
|
+
Title: ({ children }: MiniBannerTitleProps) => react_jsx_runtime.JSX.Element;
|
|
414
|
+
Subtitle: ({ children }: MiniBannerSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
415
|
+
};
|
|
416
|
+
|
|
417
|
+
type MiniSectionCtaSubtitleProps = {
|
|
418
|
+
children: ReactNode;
|
|
419
|
+
};
|
|
420
|
+
|
|
421
|
+
type MiniSectionCtaTitleProps = {
|
|
422
|
+
children: ReactNode;
|
|
423
|
+
};
|
|
274
424
|
|
|
275
425
|
interface MiniSectionCtaProps {
|
|
276
426
|
className?: string;
|
|
277
427
|
variant?: 'headerCTA' | 'BgColorBlack' | 'BgColorGrey' | 'infoCallout' | 'miniTextCenterCta';
|
|
278
|
-
|
|
279
|
-
|
|
428
|
+
cta?: ICta;
|
|
429
|
+
title?: ReactNode;
|
|
430
|
+
subtitle?: ReactNode;
|
|
431
|
+
children?: ReactNode;
|
|
432
|
+
}
|
|
433
|
+
|
|
434
|
+
declare const MiniSectionCta: (({ className, variant, title, subtitle, cta, children, }: MiniSectionCtaProps) => react_jsx_runtime.JSX.Element) & {
|
|
435
|
+
Title: ({ children }: MiniSectionCtaTitleProps) => react_jsx_runtime.JSX.Element;
|
|
436
|
+
Subtitle: ({ children }: MiniSectionCtaSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
437
|
+
};
|
|
438
|
+
|
|
439
|
+
type PracticePathCardsFooterProps = {
|
|
440
|
+
children: ReactNode;
|
|
441
|
+
};
|
|
442
|
+
|
|
443
|
+
type PracticePathCardsSubtitleProps = {
|
|
444
|
+
children: ReactNode;
|
|
445
|
+
};
|
|
446
|
+
|
|
447
|
+
type PracticePathCardsTitleProps = {
|
|
448
|
+
children: ReactNode;
|
|
449
|
+
};
|
|
450
|
+
|
|
451
|
+
interface PracticePathCardsProps {
|
|
452
|
+
className?: string;
|
|
453
|
+
children?: ReactNode;
|
|
454
|
+
cards?: PracticeCardProps[];
|
|
455
|
+
title?: ReactNode;
|
|
456
|
+
subtitle?: ReactNode;
|
|
457
|
+
footer?: ReactNode;
|
|
280
458
|
cta?: ICta;
|
|
281
459
|
}
|
|
282
460
|
|
|
283
|
-
declare const
|
|
461
|
+
declare const PracticePathCards: (({ className, children, cards, title, subtitle, footer, cta, }: PracticePathCardsProps) => react_jsx_runtime.JSX.Element) & {
|
|
462
|
+
Title: ({ children }: PracticePathCardsTitleProps) => react_jsx_runtime.JSX.Element;
|
|
463
|
+
Subtitle: ({ children }: PracticePathCardsSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
464
|
+
Footer: ({ children }: PracticePathCardsFooterProps) => react_jsx_runtime.JSX.Element;
|
|
465
|
+
};
|
|
466
|
+
|
|
467
|
+
type Teaser5050With3TextTitleProps = {
|
|
468
|
+
children: ReactNode;
|
|
469
|
+
};
|
|
284
470
|
|
|
285
471
|
interface Teaser5050With3TextProps {
|
|
286
472
|
className?: string;
|
|
287
473
|
variant?: 'left' | 'right';
|
|
288
|
-
title?:
|
|
474
|
+
title?: ReactNode;
|
|
289
475
|
cards?: InfoCardProps[];
|
|
290
476
|
image?: PictureProps;
|
|
477
|
+
children?: ReactNode;
|
|
291
478
|
}
|
|
292
479
|
|
|
293
|
-
declare const Teaser5050With3Text: ({ className, variant, title, cards, image, }: Teaser5050With3TextProps) => react_jsx_runtime.JSX.Element
|
|
480
|
+
declare const Teaser5050With3Text: (({ className, variant, title, cards, image, children, }: Teaser5050With3TextProps) => react_jsx_runtime.JSX.Element) & {
|
|
481
|
+
Title: ({ children }: Teaser5050With3TextTitleProps) => react_jsx_runtime.JSX.Element;
|
|
482
|
+
};
|
|
483
|
+
|
|
484
|
+
type Teaser5050WithCtaSubtitleProps = {
|
|
485
|
+
children: ReactNode;
|
|
486
|
+
};
|
|
487
|
+
|
|
488
|
+
type Teaser5050WithCtaTitleProps = {
|
|
489
|
+
children: ReactNode;
|
|
490
|
+
};
|
|
294
491
|
|
|
295
492
|
interface Teaser5050WithCtaProps {
|
|
296
493
|
className?: string;
|
|
297
494
|
variant?: 'left' | 'right';
|
|
298
|
-
title?:
|
|
299
|
-
subtitle?:
|
|
495
|
+
title?: ReactNode;
|
|
496
|
+
subtitle?: ReactNode;
|
|
300
497
|
cta?: ICta;
|
|
301
498
|
image?: PictureProps;
|
|
499
|
+
children?: ReactNode;
|
|
302
500
|
}
|
|
303
501
|
|
|
304
|
-
declare const Teaser5050WithCta: ({ className, variant, title, subtitle, cta, image, }: Teaser5050WithCtaProps) => react_jsx_runtime.JSX.Element
|
|
502
|
+
declare const Teaser5050WithCta: (({ className, variant, title, subtitle, cta, image, children, }: Teaser5050WithCtaProps) => react_jsx_runtime.JSX.Element) & {
|
|
503
|
+
Title: ({ children }: Teaser5050WithCtaTitleProps) => react_jsx_runtime.JSX.Element;
|
|
504
|
+
Subtitle: ({ children }: Teaser5050WithCtaSubtitleProps) => react_jsx_runtime.JSX.Element;
|
|
505
|
+
};
|
|
305
506
|
|
|
306
|
-
export { Anchor, type AnchorProps, Button, type ButtonProps, Card, CardCollection, type CardCollectionProps, type CardProps, ConditionalWrapper, type ConditionalWrapperProps, Container, type ContainerProps, CountingCard, type CountingCardProps, Icon, type IconType, InfoCard, type InfoCardProps, MiniSectionCta, type MiniSectionCtaProps, Pagination, type PaginationProps, Picture, type PictureProps, Teaser5050With3Text, type Teaser5050With3TextProps, Teaser5050WithCta, type Teaser5050WithCtaProps, svgs };
|
|
507
|
+
export { Anchor, type AnchorProps, BrandsStrip, type BrandsStripProps, Button, type ButtonProps, Card, CardCollection, type CardCollectionProps, type CardProps, ConditionalWrapper, type ConditionalWrapperProps, ContactModule, type ContactModuleProps, Container, type ContainerProps, CountingCard, type CountingCardProps, HeroBanner, type HeroBannerProps, Icon, type IconType, InfoCard, type InfoCardProps, MiniBanner, type MiniBannerProps, MiniSectionCta, type MiniSectionCtaProps, Pagination, type PaginationProps, Picture, type PictureProps, PracticeCard, type PracticeCardProps, PracticePathCards, type PracticePathCardsProps, Teaser5050With3Text, type Teaser5050With3TextProps, Teaser5050WithCta, type Teaser5050WithCtaProps, svgs };
|