@arc-ui/community-mcp 0.2.0 → 0.2.2
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/dist/index.js +18593 -13463
- package/dist/types/components.d.ts +428 -29
- package/package.json +4 -4
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React$1, { ReactNode, FC } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { NavigationHeaderActionProps } from '@arc-ui/components/NavigationHeader';
|
|
3
|
+
import { HeadingLevel, HeadingProps } from '@arc-ui/components/Heading';
|
|
3
4
|
import { ImageProps, ImageSourceProps } from '@arc-ui/components/Image';
|
|
4
5
|
import { DisclosureProps } from '@arc-ui/components/Disclosure';
|
|
5
6
|
import { MediaCardProps } from '@arc-ui/components/MediaCard';
|
|
@@ -15,6 +16,56 @@ import { TypographyCardProps } from '@arc-ui/components/TypographyCard';
|
|
|
15
16
|
import { TemplateBannerProps } from '@arc-ui/components/TemplateBanner';
|
|
16
17
|
import { TagProps } from '@arc-ui/components/Tag';
|
|
17
18
|
import { ReactPlayerProps } from 'react-player/types';
|
|
19
|
+
import { VerticalSpaceProps } from '@arc-ui/components/VerticalSpace';
|
|
20
|
+
import { SurfaceBackgroundColor } from '@arc-ui/components/Surface';
|
|
21
|
+
import { TabsItemProps } from '@arc-ui/components/Tabs';
|
|
22
|
+
|
|
23
|
+
declare const HeaderBarNotification: React$1.FC<HeaderBarNotificationProps>;
|
|
24
|
+
interface HeaderBarNotificationProps {
|
|
25
|
+
/**
|
|
26
|
+
* Header Element to attach the notifcation too.
|
|
27
|
+
*/
|
|
28
|
+
headerActionProps: NavigationHeaderActionProps;
|
|
29
|
+
/**
|
|
30
|
+
* Nofication ID used to store dismissal in users session
|
|
31
|
+
*/
|
|
32
|
+
notificationId: string;
|
|
33
|
+
/**
|
|
34
|
+
* Always show on every reload, ignore saving dismissal to users session
|
|
35
|
+
*/
|
|
36
|
+
isPersistant?: boolean;
|
|
37
|
+
/**
|
|
38
|
+
* Notification Icon
|
|
39
|
+
*/
|
|
40
|
+
icon?: string;
|
|
41
|
+
/**
|
|
42
|
+
* Notification Image
|
|
43
|
+
*/
|
|
44
|
+
image?: string;
|
|
45
|
+
/**
|
|
46
|
+
* Notification Heading
|
|
47
|
+
*/
|
|
48
|
+
heading: string;
|
|
49
|
+
/**
|
|
50
|
+
* Notification tagline
|
|
51
|
+
*/
|
|
52
|
+
tagline?: string;
|
|
53
|
+
/**
|
|
54
|
+
* Notification content
|
|
55
|
+
*/
|
|
56
|
+
children?: React$1.ReactNode;
|
|
57
|
+
/**
|
|
58
|
+
* Data for the button, click events and text
|
|
59
|
+
*/
|
|
60
|
+
button?: {
|
|
61
|
+
handleClick: () => void;
|
|
62
|
+
text: string;
|
|
63
|
+
};
|
|
64
|
+
/**
|
|
65
|
+
* Specify a size or mutliple sizes where the notification only appears.
|
|
66
|
+
*/
|
|
67
|
+
showAtSize?: ("s" | "m" | "l" | "xl")[];
|
|
68
|
+
}
|
|
18
69
|
|
|
19
70
|
interface AccordionHeadingProps {
|
|
20
71
|
/**
|
|
@@ -202,7 +253,14 @@ interface CopyLeadProps {
|
|
|
202
253
|
|
|
203
254
|
declare const DownloadList: React$1.FC<DownloadListProps>;
|
|
204
255
|
interface DownloadListProps extends Omit<SectionHeadingProps, "isPadded"> {
|
|
256
|
+
/**
|
|
257
|
+
* Set the list of `Download` components.
|
|
258
|
+
*/
|
|
205
259
|
downloads: DownloadProps[];
|
|
260
|
+
/**
|
|
261
|
+
* Align the `Download` list below or to the right of the `SectionHeading`.
|
|
262
|
+
*/
|
|
263
|
+
alignment?: "below" | "right";
|
|
206
264
|
}
|
|
207
265
|
|
|
208
266
|
declare const FAQs: React$1.FC<FAQsProps>;
|
|
@@ -223,7 +281,8 @@ interface FeaturePostAppButtonFooter {
|
|
|
223
281
|
|
|
224
282
|
interface FeaturePostCtaFooter {
|
|
225
283
|
type: "cta";
|
|
226
|
-
|
|
284
|
+
/** CTA button options. The button style defaults to `secondary`. */
|
|
285
|
+
button: Pick<ButtonV2Props, "label" | "onClick" | "href" | "target" | "ariaLabel" | "buttonStyle">;
|
|
227
286
|
author?: AuthorProps;
|
|
228
287
|
}
|
|
229
288
|
|
|
@@ -317,26 +376,8 @@ interface HighlightsProps extends Omit<SectionHeadingProps, "isPadded"> {
|
|
|
317
376
|
* Optional CTA rendered at the end of Highlights.
|
|
318
377
|
* Only ONE CTA is allowed.
|
|
319
378
|
*/
|
|
320
|
-
cta?:
|
|
379
|
+
cta?: ButtonV2Props;
|
|
321
380
|
}
|
|
322
|
-
/**
|
|
323
|
-
* CTA configuration for Highlights
|
|
324
|
-
*/
|
|
325
|
-
type HighlightsCTAProps = Pick<ButtonV2Props, "label" | "href" | "onClick" | "iconPosition" | "ariaLabel" | "target"> & {
|
|
326
|
-
/**
|
|
327
|
-
* Allowed button styles only.
|
|
328
|
-
* Primary is intentionally NOT supported.
|
|
329
|
-
*/
|
|
330
|
-
buttonStyle: "secondary" | "compact";
|
|
331
|
-
/**
|
|
332
|
-
* Icon override & Active icon override
|
|
333
|
-
* - undefined → uses default BtIconArrowRightFill for compact style
|
|
334
|
-
* - null → icon disabled
|
|
335
|
-
* - string → custom icon
|
|
336
|
-
*/
|
|
337
|
-
icon?: string | null;
|
|
338
|
-
iconActive?: string | null;
|
|
339
|
-
};
|
|
340
381
|
|
|
341
382
|
/**
|
|
342
383
|
* Use `PromoListing` to give supporting information about a page or proposition in the form of the card components (`ImpactCard`, `InformationCard`, `MediaCard` and `TypographyCard`).
|
|
@@ -546,6 +587,11 @@ interface ArticleSidebarProps {
|
|
|
546
587
|
* Sharing options for the article.
|
|
547
588
|
*/
|
|
548
589
|
share?: Share;
|
|
590
|
+
/**
|
|
591
|
+
* The article URL used by the share buttons.
|
|
592
|
+
* If it is not provided, the component uses the current browser URL.
|
|
593
|
+
*/
|
|
594
|
+
url?: string;
|
|
549
595
|
}
|
|
550
596
|
|
|
551
597
|
type ListProps = InformationCardProps;
|
|
@@ -560,7 +606,7 @@ interface ProductNavigationProps extends Omit<SectionHeadingProps, "isPadded"> {
|
|
|
560
606
|
*/
|
|
561
607
|
productList: ListProps[];
|
|
562
608
|
/**
|
|
563
|
-
*
|
|
609
|
+
* Hide "show more" or "show less" button controls.
|
|
564
610
|
*/
|
|
565
611
|
hideButton?: boolean;
|
|
566
612
|
/**
|
|
@@ -604,7 +650,7 @@ interface ContentInfoWidgetProps {
|
|
|
604
650
|
}
|
|
605
651
|
|
|
606
652
|
declare const ActionTile: React$1.FC<ActionTileProps>;
|
|
607
|
-
interface ActionTileProps
|
|
653
|
+
interface ActionTileProps {
|
|
608
654
|
/**
|
|
609
655
|
* Icon to display in default state
|
|
610
656
|
*/
|
|
@@ -617,6 +663,10 @@ interface ActionTileProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
|
617
663
|
* Heading text (required)
|
|
618
664
|
*/
|
|
619
665
|
heading: string;
|
|
666
|
+
/**
|
|
667
|
+
* Whether to use the compact tile variant
|
|
668
|
+
*/
|
|
669
|
+
isCompact?: boolean;
|
|
620
670
|
/**
|
|
621
671
|
* Whether the tile is in active/selected state
|
|
622
672
|
*/
|
|
@@ -624,7 +674,7 @@ interface ActionTileProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
|
624
674
|
/**
|
|
625
675
|
* Click handler
|
|
626
676
|
*/
|
|
627
|
-
onClick?:
|
|
677
|
+
onClick?: React$1.MouseEventHandler<HTMLButtonElement>;
|
|
628
678
|
}
|
|
629
679
|
|
|
630
680
|
declare const LinkTile: React$1.FC<LinkTileProps>;
|
|
@@ -635,14 +685,20 @@ interface LinkTileProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
|
635
685
|
href?: string;
|
|
636
686
|
/** Whether to show the arrow icon. Defaults to true */
|
|
637
687
|
showIcon?: boolean;
|
|
688
|
+
/** Visual tone variant. Defaults to brand */
|
|
689
|
+
tone?: "brand" | "neutral";
|
|
638
690
|
}
|
|
639
691
|
|
|
640
692
|
declare const InlineLinkGroup: React$1.FC<InlineLinkGroupProps>;
|
|
641
693
|
interface InlineLinkGroupProps {
|
|
642
694
|
/** Optional overline label displayed above the link group */
|
|
643
695
|
label?: string;
|
|
696
|
+
/** Heading level for the label, defaults to "2" for proper heading hierarchy */
|
|
697
|
+
headingLevel?: "1" | "2" | "3" | "4" | "5" | "6";
|
|
644
698
|
/** Array of link items to display */
|
|
645
699
|
links: InlineLinkGroupItem[];
|
|
700
|
+
/** When true, removes the underline from links (shown only on focus). Defaults to false */
|
|
701
|
+
isImplied?: boolean;
|
|
646
702
|
}
|
|
647
703
|
interface InlineLinkGroupItem {
|
|
648
704
|
/** Display text for the link */
|
|
@@ -696,11 +752,16 @@ interface VideoCardPlayerProps {
|
|
|
696
752
|
playIconSize: "s" | "l";
|
|
697
753
|
thumbnail?: ReactPlayerProps["light"];
|
|
698
754
|
children?: React$1.ReactNode;
|
|
755
|
+
previewTabIndex?: number;
|
|
756
|
+
wrapper?: React$1.ReactNode;
|
|
757
|
+
fallback?: React$1.ReactNode;
|
|
699
758
|
}
|
|
700
759
|
|
|
701
760
|
interface VideoHeroCardContentProps {
|
|
702
761
|
title: string;
|
|
762
|
+
titleLevel?: HeadingLevel;
|
|
703
763
|
label: string;
|
|
764
|
+
labelLevel?: HeadingLevel;
|
|
704
765
|
description: string | ReactNode;
|
|
705
766
|
background: "dark" | "light";
|
|
706
767
|
videoDate?: string;
|
|
@@ -731,7 +792,9 @@ interface VideoPortraitCardProps {
|
|
|
731
792
|
*/
|
|
732
793
|
thumbnail?: {
|
|
733
794
|
title: string;
|
|
795
|
+
titleLevel?: HeadingLevel;
|
|
734
796
|
label: string;
|
|
797
|
+
labelLevel?: HeadingLevel;
|
|
735
798
|
img: string;
|
|
736
799
|
};
|
|
737
800
|
/**
|
|
@@ -761,16 +824,19 @@ interface BentoMediaCard extends Omit<MediaCardProps, "isContained" | "buttonIco
|
|
|
761
824
|
* Content structure for the bento grid layout within each tab.
|
|
762
825
|
* - card1 & card2: Can be either information or media cards
|
|
763
826
|
* - card3: Optional information card
|
|
764
|
-
* - card4: Typography card with label and url
|
|
827
|
+
* - card4: Typography card with label, heading and url
|
|
765
828
|
*/
|
|
766
829
|
type BentoGridContent = {
|
|
767
830
|
card1: BentoInformationCard | BentoMediaCard;
|
|
768
831
|
card2: BentoInformationCard | BentoMediaCard;
|
|
769
832
|
card3?: BentoInformationCard;
|
|
770
833
|
card4: {
|
|
771
|
-
url:
|
|
772
|
-
label?:
|
|
834
|
+
url: TypographyCardProps["url"];
|
|
835
|
+
label?: TypographyCardProps["label"];
|
|
836
|
+
/** Overrides the default heading if provided and is not falsey. */
|
|
837
|
+
heading?: string;
|
|
773
838
|
text?: TypographyCardProps["text"];
|
|
839
|
+
onClick?: TypographyCardProps["onClick"];
|
|
774
840
|
};
|
|
775
841
|
};
|
|
776
842
|
|
|
@@ -794,5 +860,338 @@ interface BusinessSegmentSwitcherProps {
|
|
|
794
860
|
}[];
|
|
795
861
|
}
|
|
796
862
|
|
|
797
|
-
|
|
798
|
-
|
|
863
|
+
/**
|
|
864
|
+
* Logo image source and alt text for screen reader accessibility.
|
|
865
|
+
*/
|
|
866
|
+
interface LogoTileItem {
|
|
867
|
+
/** Image source URL for the logo (e.g. an SVG or PNG path). */
|
|
868
|
+
src: string;
|
|
869
|
+
/** Alt text label to announce the logo to screen reader users. */
|
|
870
|
+
alt: string;
|
|
871
|
+
}
|
|
872
|
+
/**
|
|
873
|
+
* Subgroup data passed via the parent `subgroups` array.
|
|
874
|
+
*/
|
|
875
|
+
interface PartnerLogosSubgroup {
|
|
876
|
+
/** Optional subheading displayed above the logo grid. Fixed Size S Heading. */
|
|
877
|
+
subheading?: string;
|
|
878
|
+
/**
|
|
879
|
+
* Semantic heading level for the subheading. If omitted, it is automatically
|
|
880
|
+
* derived as one level below the parent headingLevel.
|
|
881
|
+
*/
|
|
882
|
+
subheadingLevel?: HeadingLevel;
|
|
883
|
+
/** Optional supporting description text. Size M, tone "supporting". */
|
|
884
|
+
text?: string;
|
|
885
|
+
/** Array of logo images to display in the grid. */
|
|
886
|
+
logos: LogoTileItem[];
|
|
887
|
+
/**
|
|
888
|
+
* Height of each logo tile in pixels.
|
|
889
|
+
* @default 72
|
|
890
|
+
*/
|
|
891
|
+
tileHeight?: number;
|
|
892
|
+
}
|
|
893
|
+
|
|
894
|
+
declare const PartnerBrandLogos: React$1.FC<PartnerBrandLogosProps>;
|
|
895
|
+
/**
|
|
896
|
+
* Props for the `PartnerBrandLogos` page section component. Renders a heading,
|
|
897
|
+
* optional content, a padded ruler, and a list of partner logo subgroups.
|
|
898
|
+
*/
|
|
899
|
+
interface PartnerBrandLogosProps {
|
|
900
|
+
/** Main section heading text. */
|
|
901
|
+
heading: string;
|
|
902
|
+
/**
|
|
903
|
+
* Additional Arc Heading properties (e.g. `size`, `fontStyle`, `color`,
|
|
904
|
+
* `isWordWrap`, `casing`, `isResponsive`). Defaults to size "l", responsive.
|
|
905
|
+
*/
|
|
906
|
+
headingProps?: Omit<HeadingProps, "children" | "level">;
|
|
907
|
+
/**
|
|
908
|
+
* Semantic heading level for the main heading. Subgroup headings are
|
|
909
|
+
* automatically derived relative to this value.
|
|
910
|
+
* @default "2"
|
|
911
|
+
*/
|
|
912
|
+
headingLevel?: HeadingLevel;
|
|
913
|
+
/** Supporting content text below the heading. Supports paragraph breaks via `\n`. */
|
|
914
|
+
content?: string;
|
|
915
|
+
/** HTML `id` attribute applied to the main heading element. */
|
|
916
|
+
id?: string;
|
|
917
|
+
/**
|
|
918
|
+
* Vertical padding above the ruler. Accepts all VerticalSpace props.
|
|
919
|
+
* @default { size: "32" }
|
|
920
|
+
*/
|
|
921
|
+
rulerTopPadding?: VerticalSpaceProps;
|
|
922
|
+
/**
|
|
923
|
+
* Vertical padding below the ruler. Accepts all VerticalSpace props.
|
|
924
|
+
* @default { size: "32" }
|
|
925
|
+
*/
|
|
926
|
+
rulerBottomPadding?: VerticalSpaceProps;
|
|
927
|
+
/** Array of partner logo subgroups. */
|
|
928
|
+
subgroups: PartnerLogosSubgroup[];
|
|
929
|
+
}
|
|
930
|
+
|
|
931
|
+
declare const ProductCard: React$1.FC<ProductCardProps>;
|
|
932
|
+
interface ProductCardProps {
|
|
933
|
+
heading: string;
|
|
934
|
+
headingLevel: HeadingLevel;
|
|
935
|
+
topSlot?: ReactNode;
|
|
936
|
+
bottomSlot?: ReactNode;
|
|
937
|
+
promoted?: {
|
|
938
|
+
content: ReactNode;
|
|
939
|
+
background: SurfaceBackgroundColor;
|
|
940
|
+
};
|
|
941
|
+
divider?: boolean;
|
|
942
|
+
button?: Omit<ButtonV2Props, "buttonStyle" | "isFullWidth">;
|
|
943
|
+
}
|
|
944
|
+
|
|
945
|
+
declare const ProductCardBenefits: React$1.FC<ProductCardBenefitsProps>;
|
|
946
|
+
interface ProductCardBenefitsProps {
|
|
947
|
+
/** Heading displayed above the benefits list */
|
|
948
|
+
heading?: string;
|
|
949
|
+
/** heading level for accessibility */
|
|
950
|
+
headingLevel?: HeadingLevel;
|
|
951
|
+
/** List of benefits with associated icons */
|
|
952
|
+
benefits: {
|
|
953
|
+
benefit: string;
|
|
954
|
+
icon: string;
|
|
955
|
+
}[];
|
|
956
|
+
}
|
|
957
|
+
|
|
958
|
+
declare const ProductCardPriceIncrease: React$1.FC<ProductCardPriceIncreaseProps>;
|
|
959
|
+
interface ProductCardPriceIncreaseProps {
|
|
960
|
+
/** Heading displayed above the price increase list */
|
|
961
|
+
heading?: string;
|
|
962
|
+
/** heading level for accessibility */
|
|
963
|
+
headingLevel?: HeadingLevel;
|
|
964
|
+
/** List of price increase entries (e.g. ["£48.99 by April 2027"]) */
|
|
965
|
+
items: string[];
|
|
966
|
+
/** Optional prop to hide the left border */
|
|
967
|
+
hideBorder?: boolean;
|
|
968
|
+
}
|
|
969
|
+
|
|
970
|
+
declare const ProductCardPrice: React$1.FC<ProductCardPriceProps>;
|
|
971
|
+
interface ProductCardPriceProps {
|
|
972
|
+
/** Text displayed above the price (e.g. "From") */
|
|
973
|
+
prefix?: string;
|
|
974
|
+
/** The price value (e.g. "£29.99") */
|
|
975
|
+
value: string;
|
|
976
|
+
/** Text displayed below the price (e.g. "a month per user") */
|
|
977
|
+
suffix?: string;
|
|
978
|
+
}
|
|
979
|
+
|
|
980
|
+
declare const ProductCardGrid: React$1.FC<ProductCardGridProps>;
|
|
981
|
+
interface Tab extends TabsItemProps {
|
|
982
|
+
cards: React$1.ReactNode[];
|
|
983
|
+
}
|
|
984
|
+
interface ProductCardGridProps extends Omit<SectionHeadingProps, "isPadded" | "isCentered" | "image"> {
|
|
985
|
+
tabs?: Tab[];
|
|
986
|
+
expanded?: boolean;
|
|
987
|
+
hideTabs?: boolean;
|
|
988
|
+
}
|
|
989
|
+
|
|
990
|
+
declare const SubHeaderCell: React$1.FC<SubHeaderCellProps>;
|
|
991
|
+
interface SubHeaderCellProps {
|
|
992
|
+
/**
|
|
993
|
+
* Price shown at the top of the sub-header cell (prefix, value, suffix).
|
|
994
|
+
*/
|
|
995
|
+
price: ProductCardPriceProps;
|
|
996
|
+
/**
|
|
997
|
+
* Optional upcoming price-increase details rendered beneath the price.
|
|
998
|
+
*/
|
|
999
|
+
priceIncrease?: ProductCardPriceIncreaseProps;
|
|
1000
|
+
/**
|
|
1001
|
+
* Optional call-to-action button rendered at the bottom of the cell. Rendered full-width.
|
|
1002
|
+
*/
|
|
1003
|
+
button?: ButtonV2Props;
|
|
1004
|
+
/**
|
|
1005
|
+
* Zero-based index of the column this cell belongs to. Used to highlight every other column, starting with the first.
|
|
1006
|
+
*/
|
|
1007
|
+
columnIndex?: number;
|
|
1008
|
+
}
|
|
1009
|
+
|
|
1010
|
+
interface ComparisonColumn {
|
|
1011
|
+
/**
|
|
1012
|
+
* Stable identifier for the column; used as a React key.
|
|
1013
|
+
*/
|
|
1014
|
+
id: string;
|
|
1015
|
+
/**
|
|
1016
|
+
* Visible label rendered in the column header cell (e.g. a plan name).
|
|
1017
|
+
*/
|
|
1018
|
+
label: string;
|
|
1019
|
+
/**
|
|
1020
|
+
* Optional promotional text displayed in a branded banner above the column
|
|
1021
|
+
* header label. When set, the banner is rendered inside the header cell with
|
|
1022
|
+
* a dark brand background.
|
|
1023
|
+
*/
|
|
1024
|
+
promoted?: string;
|
|
1025
|
+
/**
|
|
1026
|
+
* Optional sub-header content (price, upcoming price increase, call-to-action) rendered in a row beneath the header. When any column defines this, the sub-header row is shown.
|
|
1027
|
+
*/
|
|
1028
|
+
subheader?: SubHeaderCellProps;
|
|
1029
|
+
}
|
|
1030
|
+
|
|
1031
|
+
interface ComparisonSubRow {
|
|
1032
|
+
/**
|
|
1033
|
+
* One cell per column, in the same order as `columns`. Length MUST equal columns.length.
|
|
1034
|
+
*/
|
|
1035
|
+
cells: React$1.ReactNode[];
|
|
1036
|
+
}
|
|
1037
|
+
|
|
1038
|
+
declare const FeatureCell: React$1.FC<FeatureCellProps>;
|
|
1039
|
+
interface FeatureCellProps {
|
|
1040
|
+
/**
|
|
1041
|
+
* Icon shown alongside the package name.
|
|
1042
|
+
*/
|
|
1043
|
+
icon: string;
|
|
1044
|
+
/**
|
|
1045
|
+
* Package / plan title.
|
|
1046
|
+
*/
|
|
1047
|
+
title: string;
|
|
1048
|
+
/**
|
|
1049
|
+
* Optional supporting copy shown beneath the title.
|
|
1050
|
+
*/
|
|
1051
|
+
description?: string;
|
|
1052
|
+
/**
|
|
1053
|
+
* Optional popover content shown when the user interacts with the info icon.
|
|
1054
|
+
*/
|
|
1055
|
+
popoverContent?: string | React$1.ReactNode;
|
|
1056
|
+
}
|
|
1057
|
+
|
|
1058
|
+
interface ComparisonRow {
|
|
1059
|
+
/**
|
|
1060
|
+
* Feature label rendered as the row's full-width header, spanning all columns above the content row(s).
|
|
1061
|
+
*/
|
|
1062
|
+
feature: FeatureCellProps;
|
|
1063
|
+
/**
|
|
1064
|
+
* One cell per column for the row's primary content row, in the same order as `columns`. Length MUST equal columns.length.
|
|
1065
|
+
*/
|
|
1066
|
+
cells: React$1.ReactNode[];
|
|
1067
|
+
/**
|
|
1068
|
+
* Optional additional content rows rendered beneath the primary row, for the less common case where a feature spans multiple rows.
|
|
1069
|
+
*/
|
|
1070
|
+
subRows?: ComparisonSubRow[];
|
|
1071
|
+
/**
|
|
1072
|
+
* Id of the `ComparisonSection` this row belongs to. Omit to render the row before all sections. An id with no matching section logs a dev warning and renders the row unsectioned.
|
|
1073
|
+
*/
|
|
1074
|
+
sectionId?: string;
|
|
1075
|
+
}
|
|
1076
|
+
|
|
1077
|
+
interface ComparisonSection {
|
|
1078
|
+
/**
|
|
1079
|
+
* Stable identifier for the section; used as a React key and to link the toggle to its content region for accessibility.
|
|
1080
|
+
*/
|
|
1081
|
+
id: string;
|
|
1082
|
+
/**
|
|
1083
|
+
* Heading shown in the section's toggle button.
|
|
1084
|
+
*/
|
|
1085
|
+
heading: React$1.ReactNode;
|
|
1086
|
+
/**
|
|
1087
|
+
* Heading level for the section heading, for correct document outline. Defaults to a sensible level.
|
|
1088
|
+
*/
|
|
1089
|
+
headingLevel?: HeadingLevel;
|
|
1090
|
+
/**
|
|
1091
|
+
* Initial open state when the section is uncontrolled. Defaults to `false`.
|
|
1092
|
+
*/
|
|
1093
|
+
defaultOpen?: boolean;
|
|
1094
|
+
/**
|
|
1095
|
+
* Controlled open state. When provided, the section is controlled and `onOpenChange` should update it.
|
|
1096
|
+
*/
|
|
1097
|
+
open?: boolean;
|
|
1098
|
+
/**
|
|
1099
|
+
* Called with the next open state when the toggle is activated. Required for controlled usage; optional otherwise.
|
|
1100
|
+
*/
|
|
1101
|
+
onOpenChange?: (open: boolean) => void;
|
|
1102
|
+
}
|
|
1103
|
+
|
|
1104
|
+
declare const ComparisonTable: React$1.FC<ComparisonTableProps>;
|
|
1105
|
+
interface ComparisonTableProps {
|
|
1106
|
+
/**
|
|
1107
|
+
* Column definitions driving the header cells and the number of content cells
|
|
1108
|
+
* per row. Each `ComparisonColumn` has:
|
|
1109
|
+
*
|
|
1110
|
+
* - `id` (`string`) — Stable identifier; used as a React key.
|
|
1111
|
+
* - `label` (`string`) — Visible text in the column header (e.g. a plan name).
|
|
1112
|
+
* - `promoted` (`string`, optional) — Promotional banner text shown above the label in a branded Surface.
|
|
1113
|
+
* - `subheader` (`SubHeaderCellProps`, optional) — Price, price-increase items, and a CTA button rendered in a row beneath the header.
|
|
1114
|
+
*/
|
|
1115
|
+
columns: ComparisonColumn[];
|
|
1116
|
+
/**
|
|
1117
|
+
* All rows. Rows without `sectionId` render first, before any sections. Rows
|
|
1118
|
+
* with a `sectionId` render inside the matching section, in input order. On
|
|
1119
|
+
* mobile each row is a full-width feature header above its content row(s); on
|
|
1120
|
+
* desktop the feature becomes the left-hand column of the row. Each
|
|
1121
|
+
* `ComparisonRow` has:
|
|
1122
|
+
*
|
|
1123
|
+
* - `feature` (`FeatureCellProps`) — Icon, title, description, and optional popover for the feature label.
|
|
1124
|
+
* - `cells` (`ReactNode[]`) — One cell per column, in the same order as `columns`. Supports strings or rich ReactNode content (e.g. tick/cross icons).
|
|
1125
|
+
* - `subRows` (`ComparisonSubRow[]`, optional) — Additional content rows beneath the primary row, for features spanning multiple rows.
|
|
1126
|
+
* - `sectionId` (`string`, optional) — Id of the section the row belongs to. An unknown id logs a dev warning and the row renders unsectioned.
|
|
1127
|
+
*/
|
|
1128
|
+
rows?: ComparisonRow[];
|
|
1129
|
+
/**
|
|
1130
|
+
* Section metadata only. Sections render in array order, after unsectioned
|
|
1131
|
+
* rows, each with a full-width toggle that expands or collapses the rows whose
|
|
1132
|
+
* `sectionId` matches. A section with no matching rows is hidden. Each `ComparisonSection` has:
|
|
1133
|
+
*
|
|
1134
|
+
* - `id` (`string`) — Stable identifier; used as a React key and for accessibility linking.
|
|
1135
|
+
* - `heading` (`ReactNode`) — Text shown in the section's toggle button.
|
|
1136
|
+
* - `headingLevel` (`HeadingLevel`, optional) — Semantic heading level for the document outline.
|
|
1137
|
+
* - `defaultOpen` (`boolean`, optional) — Initial open state when uncontrolled. Defaults to `false`.
|
|
1138
|
+
* - `open` (`boolean`, optional) — Controlled open state.
|
|
1139
|
+
* - `onOpenChange` (`(open: boolean) => void`, optional) — Callback for controlled usage.
|
|
1140
|
+
*/
|
|
1141
|
+
sections?: ComparisonSection[];
|
|
1142
|
+
/**
|
|
1143
|
+
* Optional controls. On mobile they render in a full-width cell beneath the header; on desktop they render in the left-hand feature column beside the sub-header. Omit to hide the control row entirely.
|
|
1144
|
+
*/
|
|
1145
|
+
controls?: React$1.ReactNode;
|
|
1146
|
+
/**
|
|
1147
|
+
* When `true`, wraps the table in a rounded, clipped container with an inset shadow overlay border. Defaults to `false`.
|
|
1148
|
+
*/
|
|
1149
|
+
hasBorder?: boolean;
|
|
1150
|
+
/**
|
|
1151
|
+
* When `true`, the desktop column header row sticks to the top of the scroll container as the body scrolls. Defaults to `false`.
|
|
1152
|
+
*/
|
|
1153
|
+
hasStickyHeader?: boolean;
|
|
1154
|
+
}
|
|
1155
|
+
|
|
1156
|
+
declare const HeaderCell: React$1.FC<HeaderCellProps>;
|
|
1157
|
+
interface HeaderCellProps {
|
|
1158
|
+
/**
|
|
1159
|
+
* Content rendered inside the column header cell (typically a column label).
|
|
1160
|
+
*/
|
|
1161
|
+
children?: string;
|
|
1162
|
+
/**
|
|
1163
|
+
* Zero-based index of the column this header cell belongs to. Used to highlight every other column, starting with the first.
|
|
1164
|
+
*/
|
|
1165
|
+
columnIndex?: number;
|
|
1166
|
+
/**
|
|
1167
|
+
* Optional promotional text displayed in a branded banner above the column label.
|
|
1168
|
+
*/
|
|
1169
|
+
promoted?: string;
|
|
1170
|
+
}
|
|
1171
|
+
|
|
1172
|
+
declare const Cell: React$1.FC<CellProps>;
|
|
1173
|
+
interface CellProps {
|
|
1174
|
+
/**
|
|
1175
|
+
* Content rendered inside the content cell (text or an Arc primitive such as a tick/cross).
|
|
1176
|
+
*/
|
|
1177
|
+
children?: React$1.ReactNode;
|
|
1178
|
+
/**
|
|
1179
|
+
* Zero-based index of the column this cell belongs to. Used to highlight every other column, starting with the first.
|
|
1180
|
+
*/
|
|
1181
|
+
columnIndex?: number;
|
|
1182
|
+
/**
|
|
1183
|
+
* Whether this cell sits in the last row of the table. Highlighted cells in the last row get rounded bottom corners.
|
|
1184
|
+
*/
|
|
1185
|
+
isLastRow?: boolean;
|
|
1186
|
+
}
|
|
1187
|
+
|
|
1188
|
+
declare const ControlCell: React$1.FC<ControlCellProps>;
|
|
1189
|
+
interface ControlCellProps {
|
|
1190
|
+
/**
|
|
1191
|
+
* Control content rendered for this column.
|
|
1192
|
+
*/
|
|
1193
|
+
children?: React$1.ReactNode;
|
|
1194
|
+
}
|
|
1195
|
+
|
|
1196
|
+
export { Accordion, ActionTile, ArticleCarousel, ArticleSidebar, Author, BannerWithTabs, BusinessSegmentSwitcher, Cell, ComparisonTable, ContentInfoWidget, ControlCell, CopyLead, DownloadList, FAQs, FeatureCell, FeaturePost, HeaderBarNotification, HeaderCell, Highlights, InlineLinkGroup, LinkTile, PartnerBrandLogos, ProductCard, ProductCardBenefits, ProductCardGrid, ProductCardPrice, ProductCardPriceIncrease, ProductNavigation, PromoListing, PromoListingThumbnailSignpost, Quote, SectionHeading, Statistics, SubHeaderCell, Summary, ThumbnailSignpost, VideoHeroCard, VideoPortraitCard };
|
|
1197
|
+
export type { AccordionProps, ActionTileProps, ArticleCarouselProps, ArticleSidebarProps, AuthorProps, BannerWithTabsProps, BentoGridContent, BentoInformationCard, BentoMediaCard, BusinessSegmentSwitcherProps, CellProps, ComparisonColumn, ComparisonRow, ComparisonSection, ComparisonSubRow, ComparisonTableProps, ContentInfoWidgetProps, ControlCellProps, CopyLeadProps, DownloadListProps, FAQsProps, FeatureCellProps, FeaturePostProps, HeaderBarNotificationProps, HeaderCellProps, HighlightsProps, InlineLinkGroupItem, InlineLinkGroupProps, LinkTileProps, ListProps, LogoTileItem, PartnerBrandLogosProps, PartnerLogosSubgroup, ProductCardBenefitsProps, ProductCardGridProps, ProductCardPriceIncreaseProps, ProductCardPriceProps, ProductCardProps, ProductNavigationProps, PromoListingProps, PromoListingThumbnailSignpostProps, QuoteProps, SectionHeadingProps, StatisticsProps, SubHeaderCellProps, SummaryProps, Tab, ThumbnailSignpostProps, VideoHeroCardProps, VideoPortraitCardProps };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@arc-ui/community-mcp",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"homepage": "https://ui.digital-ent-int.bt.com",
|
|
6
6
|
"author": "BT Business Digital UI Team <ui-digital-ent-int@bt.com>",
|
|
@@ -30,9 +30,9 @@
|
|
|
30
30
|
"tslib": "^2.8.1",
|
|
31
31
|
"tsup": "^8.3.5",
|
|
32
32
|
"typescript": "^5.6.3",
|
|
33
|
-
"@arc-ui/community-components": "^3.
|
|
34
|
-
"@arc-ui/community-eslint-config": "^0.1.
|
|
35
|
-
"@arc-ui/community-typescript-config": "^0.1.
|
|
33
|
+
"@arc-ui/community-components": "^3.17.0",
|
|
34
|
+
"@arc-ui/community-eslint-config": "^0.1.2",
|
|
35
|
+
"@arc-ui/community-typescript-config": "^0.1.1"
|
|
36
36
|
},
|
|
37
37
|
"scripts": {
|
|
38
38
|
"lint:ts": "eslint .",
|