@primer/react-brand 0.80.0-rc.e1dc6447 → 0.80.0-rc.ff22e366
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/docs/components/CarouselPagination/index.md +96 -0
- package/docs/components/IconButton/react.md +33 -15
- package/docs/components/Testimonial/react.md +28 -22
- package/docs/components/TestimonialGroup/index.md +152 -0
- package/docs/components/index.md +3 -1
- package/docs/index.md +5 -3
- package/docs/introduction/theming.md +13 -0
- package/esm/Accordion/Accordion.js +1 -1
- package/esm/Accordion/{Accordion.module-B-iFuyHy.css → Accordion.module-B-vGHUg7.css} +1 -1
- package/esm/Accordion/Accordion.module.js +1 -1
- package/esm/Accordion/Accordion.module.js.map +1 -1
- package/esm/ActionMenu/ActionMenu.js +3 -3
- package/esm/ActionMenu/ActionMenu.js.map +1 -1
- package/esm/AnchorNav/AnchorNav.js +1 -1
- package/esm/Breadcrumbs/Breadcrumbs.js +1 -1
- package/esm/Button/Button.js +1 -1
- package/esm/CTABanner/CTABanner.js +1 -1
- package/esm/Card/Card.js +1 -1
- package/esm/CarouselPagination/CarouselPagination.d.ts +42 -0
- package/esm/CarouselPagination/CarouselPagination.d.ts.map +1 -0
- package/esm/CarouselPagination/CarouselPagination.js +97 -0
- package/esm/CarouselPagination/CarouselPagination.js.map +1 -0
- package/esm/CarouselPagination/CarouselPagination.module-F-qylhO7.css +1 -0
- package/esm/CarouselPagination/CarouselPagination.module.js +14 -0
- package/esm/CarouselPagination/CarouselPagination.module.js.map +1 -0
- package/esm/CarouselPagination/index.d.ts +2 -0
- package/esm/CarouselPagination/index.d.ts.map +1 -0
- package/esm/ComparisonTable/ComparisonTable.js +1 -1
- package/esm/EyebrowBanner/EyebrowBanner.js +1 -1
- package/esm/FAQ/FAQ.js +1 -1
- package/esm/FAQ/FAQGroup.js +1 -1
- package/esm/FeatureComparisonTable/FeatureComparisonTable.js +1 -1
- package/esm/FeatureComparisonTable/FeatureComparisonTable.module-BH8n2Ttj.css +1 -0
- package/esm/FeatureComparisonTable/FeatureComparisonTable.module.js +1 -2
- package/esm/FeatureComparisonTable/FeatureComparisonTable.module.js.map +1 -1
- package/esm/FeatureComparisonTable/sub-components/FeatureComparisonTableRow.d.ts.map +1 -1
- package/esm/FeatureComparisonTable/sub-components/FeatureComparisonTableRow.js +1 -1
- package/esm/FeatureComparisonTable/sub-components/FeatureComparisonTableRow.js.map +1 -1
- package/esm/FrostedGlassVFX/FrostedGlassVFX.js +1 -1
- package/esm/Grid/Grid.js +1 -1
- package/esm/Heading/Heading.module-ChqO_lH5.css +1 -0
- package/esm/Heading/Heading.module.js +1 -1
- package/esm/Heading/Heading.module.js.map +1 -1
- package/esm/Hero/Hero.d.ts.map +1 -1
- package/esm/Hero/Hero.js +5 -3
- package/esm/Hero/Hero.js.map +1 -1
- package/esm/IDE/IDE.js +1 -1
- package/esm/Icon/Icon.js +1 -1
- package/esm/IconButton/IconButton.d.ts +1 -1
- package/esm/IconButton/IconButton.d.ts.map +1 -1
- package/esm/IconButton/IconButton.js +2 -2
- package/esm/IconButton/IconButton.js.map +1 -1
- package/esm/IconButton/{IconButton.module-D2UJBm7x.css → IconButton.module-DDLfSj96.css} +1 -1
- package/esm/IconButton/IconButton.module.js +1 -1
- package/esm/IconButton/IconButton.module.js.map +1 -1
- package/esm/InlineCode/InlineCode.js +1 -1
- package/esm/InlineLink/InlineLink.js +1 -1
- package/esm/InlineLink/{InlineLink.module-6R63us8B.css → InlineLink.module-BXx17-pO.css} +1 -1
- package/esm/InlineLink/InlineLink.module.js +1 -1
- package/esm/InlineLink/InlineLink.module.js.map +1 -1
- package/esm/Label/Label.js +1 -1
- package/esm/Label/Label.module-ChD9OmD6.css +1 -0
- package/esm/Label/Label.module.js +1 -1
- package/esm/Label/Label.module.js.map +1 -1
- package/esm/Link/Link.js +1 -1
- package/esm/LogoSuite/LogoSuite.js +1 -1
- package/esm/MediaPlaylist/MediaPlaylist.js +1 -1
- package/esm/MinimalFooter/MinimalFooter.js +1 -1
- package/esm/NavList/NavList.js +1 -1
- package/esm/NavList/{NavList.module-zvpwnkzz.css → NavList.module-f9LV2-bb.css} +1 -1
- package/esm/NavList/NavList.module.js +1 -1
- package/esm/NavList/NavList.module.js.map +1 -1
- package/esm/PricingOptions/PricingOptions.js +1 -1
- package/esm/PricingOptions/{PricingOptions.module-CgPKaZAm.css → PricingOptions.module-pBExx0-M.css} +1 -1
- package/esm/PricingOptions/PricingOptions.module.js +1 -1
- package/esm/PricingOptions/PricingOptions.module.js.map +1 -1
- package/esm/Prose/Prose.js +1 -1
- package/esm/Spinner/Spinner.js +1 -1
- package/esm/SubNav/SubNav.js +1 -1
- package/esm/SubNav/SubNav.module-kWRa0Laq.css +1 -0
- package/esm/SubNav/SubNav.module.js +1 -1
- package/esm/SubNav/SubNav.module.js.map +1 -1
- package/esm/SubdomainNavBar/SubdomainNavBar.js +1 -1
- package/esm/Tabs/Tabs.d.ts +12 -0
- package/esm/Tabs/Tabs.d.ts.map +1 -1
- package/esm/Tabs/Tabs.js +85 -121
- package/esm/Tabs/Tabs.js.map +1 -1
- package/esm/Tabs/{Tabs.module-CK_p1qwC.css → Tabs.module-B-E_MTke.css} +1 -1
- package/esm/Tabs/Tabs.module.js +4 -8
- package/esm/Tabs/Tabs.module.js.map +1 -1
- package/esm/Testimonial/Testimonial.d.ts +7 -3
- package/esm/Testimonial/Testimonial.d.ts.map +1 -1
- package/esm/Testimonial/Testimonial.js +77 -77
- package/esm/Testimonial/Testimonial.js.map +1 -1
- package/esm/Testimonial/Testimonial.module-BqMYuLeo.css +1 -0
- package/esm/Testimonial/Testimonial.module.js +9 -14
- package/esm/Testimonial/Testimonial.module.js.map +1 -1
- package/esm/TestimonialGroup/TestimonialGroup.d.ts +35 -0
- package/esm/TestimonialGroup/TestimonialGroup.d.ts.map +1 -0
- package/esm/TestimonialGroup/TestimonialGroup.js +190 -0
- package/esm/TestimonialGroup/TestimonialGroup.js.map +1 -0
- package/esm/TestimonialGroup/TestimonialGroup.module-kFxPa1k1.css +1 -0
- package/esm/TestimonialGroup/TestimonialGroup.module.js +22 -0
- package/esm/TestimonialGroup/TestimonialGroup.module.js.map +1 -0
- package/esm/TestimonialGroup/index.d.ts +2 -0
- package/esm/TestimonialGroup/index.d.ts.map +1 -0
- package/esm/Text/Text.module-Bf-3ooDP.css +1 -0
- package/esm/Text/Text.module.js +1 -1
- package/esm/Text/Text.module.js.map +1 -1
- package/esm/TextCursorAnimation/TextCursorAnimation.js +1 -1
- package/esm/ThemeProvider/ThemeProvider.d.ts +1 -0
- package/esm/ThemeProvider/ThemeProvider.d.ts.map +1 -1
- package/esm/ThemeProvider/ThemeProvider.js +11 -9
- package/esm/ThemeProvider/ThemeProvider.js.map +1 -1
- package/esm/Tiles/Tiles.js +1 -1
- package/esm/Timeline/Timeline.js +1 -1
- package/esm/Token/Token.js +1 -1
- package/esm/Token/Token.module-Di856FbT.css +1 -0
- package/esm/Token/Token.module.js +1 -1
- package/esm/Token/Token.module.js.map +1 -1
- package/esm/Tooltip/Tooltip.js +1 -1
- package/esm/VideoPlayer/VideoPlayer.js +1 -1
- package/esm/css/stylesheets.js +1 -1
- package/esm/forms/Checkbox/Checkbox.js +1 -1
- package/esm/forms/FormControl/FormControl.js +1 -1
- package/esm/forms/Radio/Radio.js +1 -1
- package/esm/forms/Select/Select.js +1 -1
- package/esm/forms/TextInput/TextInput.js +1 -1
- package/esm/forms/Textarea/Textarea.js +1 -1
- package/esm/forms/ToggleSwitch/ToggleSwitch.js +1 -1
- package/esm/index.d.ts +2 -0
- package/esm/index.d.ts.map +1 -1
- package/esm/index.esm.js +35 -33
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes-CBE7L2wV.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/colors/global-with-modes-CjksF091.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/accordion/colors-with-modes-DKHKbQRW.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/action-menu/colors-with-modes-CyS5r4GY.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/anchor-nav/colors-with-modes-CD0Na993.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/breadcrumbs/colors-with-modes-BngjsaKj.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes-Bog-yunW.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/card/colors-with-modes-BbjIdlS-.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/carousel-pagination/colors-with-modes-IFYKunDL.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/comparison-table/colors-with-modes-q-NjRozG.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-DKA7xAYz.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/cta-banner/colors-with-modes-HElP20qs.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/eyebrow-banner/colors-with-modes-BTVqJ9iR.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/faq/colors-with-modes-BygKJG38.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/feature-comparison-table/colors-with-modes-k7YIWAQV.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes-PKZWykxm.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/frosted-glass-vfx/colors-with-modes-fV7rwA0l.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/grid/colors-with-modes-Chf_t26p.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon/colors-with-modes-BPFx95T7.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes-BsaQYf6M.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/ide/colors-with-modes-CTreurKT.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/inline-code/colors-with-modes-B72y-n-A.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/inline-link/colors-with-modes-CT7QXZTs.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/label/colors-with-modes-S_161ALk.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/link/colors-with-modes-JvDrymoz.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes-BsfJ9fNj.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/media-playlist/colors-with-modes-DTTUHiv1.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/nav-list/colors-with-modes-BCIP0l57.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/pricing-options/colors-with-modes-DNrd36sc.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/prose/colors-with-modes-BVL83uw2.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river-story-scroll/colors-with-modes-DOJW-F1w.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/spinner/colors-with-modes-ufFxqo2V.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/sub-nav/colors-with-modes-8aCELL7I.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/subdomain-nav-bar/colors-with-modes-J9EPudv_.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tabs/colors-with-modes-D9l5QVGg.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/testimonial/{base-CAG7koNB.css → base-h_olG8bi.css} +1 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/testimonial/colors-with-modes-BEiXR7-X.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/testimonial-group/base-Cq-doRpg.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/colors-with-modes-wctZLA5X.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes-BLWCqYua.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/timeline/colors-with-modes-DNNJvx8C.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/toggle-switch/colors-with-modes-Byi9AmE8.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/token/colors-with-modes-CzvPUrZu.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tooltip/colors-with-modes-CjEAA-Ic.css +1 -0
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/video-player/colors-with-modes-M9ib_BKQ.css +1 -0
- package/esm/river/River/River.js +1 -1
- package/esm/river/RiverStoryScroll/RiverStoryScroll.js +1 -1
- package/lib/CarouselPagination/CarouselPagination.d.ts +41 -0
- package/lib/CarouselPagination/index.d.ts +1 -0
- package/lib/IconButton/IconButton.d.ts +1 -1
- package/lib/Tabs/Tabs.d.ts +12 -0
- package/lib/Testimonial/Testimonial.d.ts +7 -3
- package/lib/TestimonialGroup/TestimonialGroup.d.ts +34 -0
- package/lib/TestimonialGroup/index.d.ts +1 -0
- package/lib/ThemeProvider/ThemeProvider.d.ts +1 -0
- package/lib/css/main.css +1422 -276
- package/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes.css +141 -2
- package/lib/design-tokens/css/tokens/base/colors/light.css +1 -1
- package/lib/design-tokens/css/tokens/base/size/size.css +1 -1
- package/lib/design-tokens/css/tokens/base/typography/typography.css +1 -1
- package/lib/design-tokens/css/tokens/functional/animation/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/colors/global-with-modes.css +45 -2
- package/lib/design-tokens/css/tokens/functional/colors/global.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/accordion/colors-with-modes.css +38 -2
- package/lib/design-tokens/css/tokens/functional/components/action-menu/colors-with-modes.css +12 -2
- package/lib/design-tokens/css/tokens/functional/components/anchor-nav/colors-with-modes.css +10 -2
- package/lib/design-tokens/css/tokens/functional/components/bento/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/blinking-cursor/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/breadcrumbs/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/button/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes.css +35 -2
- package/lib/design-tokens/css/tokens/functional/components/card/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/card/colors-with-modes.css +10 -2
- package/lib/design-tokens/css/tokens/functional/components/card/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/carousel-pagination/colors-with-modes.css +35 -0
- package/lib/design-tokens/css/tokens/functional/components/carousel-pagination/colors.css +13 -0
- package/lib/design-tokens/css/tokens/functional/components/comparison-table/colors-with-modes.css +10 -2
- package/lib/design-tokens/css/tokens/functional/components/comparison-table/comparison-table.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css +45 -2
- package/lib/design-tokens/css/tokens/functional/components/cta-banner/colors-with-modes.css +16 -2
- package/lib/design-tokens/css/tokens/functional/components/eyebrow-banner/colors-with-modes.css +52 -2
- package/lib/design-tokens/css/tokens/functional/components/eyebrow-banner/eyebrow-banner.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/colors-with-modes.css +13 -2
- package/lib/design-tokens/css/tokens/functional/components/faq/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/faq.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/feature-comparison-table/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/feature-comparison-table/colors-with-modes.css +17 -2
- package/lib/design-tokens/css/tokens/functional/components/footer/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes.css +18 -2
- package/lib/design-tokens/css/tokens/functional/components/footer/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/frosted-glass-vfx/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/frosted-glass-vfx/colors-with-modes.css +11 -2
- package/lib/design-tokens/css/tokens/functional/components/grid/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/grid/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/grid/grid.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/hero/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/icon/colors-with-modes.css +36 -2
- package/lib/design-tokens/css/tokens/functional/components/icon/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/icon-button/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes.css +22 -2
- package/lib/design-tokens/css/tokens/functional/components/icon-button/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/ide/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/ide/colors-with-modes.css +29 -2
- package/lib/design-tokens/css/tokens/functional/components/image/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/inline-code/colors-with-modes.css +11 -2
- package/lib/design-tokens/css/tokens/functional/components/inline-code/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/inline-link/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/inline-link/colors-with-modes.css +10 -2
- package/lib/design-tokens/css/tokens/functional/components/inline-link/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/label/colors-with-modes.css +33 -2
- package/lib/design-tokens/css/tokens/functional/components/label/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/link/colors-with-modes.css +10 -2
- package/lib/design-tokens/css/tokens/functional/components/link/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/logosuite/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes.css +14 -2
- package/lib/design-tokens/css/tokens/functional/components/logosuite/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/media-playlist/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/media-playlist/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/nav-list/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/pricing-options/colors-with-modes.css +16 -2
- package/lib/design-tokens/css/tokens/functional/components/pricing-options/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/pricing-options/pricing-options.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/prose/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/prose/colors-with-modes.css +10 -2
- package/lib/design-tokens/css/tokens/functional/components/river/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/river/river.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/river-story-scroll/colors-with-modes.css +10 -2
- package/lib/design-tokens/css/tokens/functional/components/section/section.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/spinner/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/spinner/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/spinner/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/statistic/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/sub-nav/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/sub-nav/colors-with-modes.css +20 -2
- package/lib/design-tokens/css/tokens/functional/components/subdomain-nav-bar/colors-with-modes.css +19 -2
- package/lib/design-tokens/css/tokens/functional/components/tabs/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/tabs/colors-with-modes.css +14 -2
- package/lib/design-tokens/css/tokens/functional/components/tabs/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/testimonial/base.css +3 -1
- package/lib/design-tokens/css/tokens/functional/components/testimonial/colors-with-modes.css +40 -32
- package/lib/design-tokens/css/tokens/functional/components/testimonial/colors.css +1 -16
- package/lib/design-tokens/css/tokens/functional/components/testimonial-group/base.css +9 -0
- package/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/colors-with-modes.css +11 -2
- package/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/tiles/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes.css +11 -2
- package/lib/design-tokens/css/tokens/functional/components/timeline/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/timeline/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/timeline/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/toggle-switch/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/toggle-switch/colors-with-modes.css +17 -2
- package/lib/design-tokens/css/tokens/functional/components/toggle-switch/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/token/colors-with-modes.css +21 -2
- package/lib/design-tokens/css/tokens/functional/components/token/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/tooltip/colors-with-modes.css +9 -2
- package/lib/design-tokens/css/tokens/functional/components/tooltip/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/video-player/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/video-player/colors-with-modes.css +20 -2
- package/lib/design-tokens/css/tokens/functional/size/border.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/breakpoints.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size-coarse.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size-fine.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/viewport.css +1 -1
- package/lib/design-tokens/css/tokens/functional/typography/typography-responsive.css +1 -1
- package/lib/design-tokens/css/tokens/functional/typography/typography.css +1 -1
- package/lib/design-tokens/js/module/tokens/base/colors/light.js +1 -1
- package/lib/design-tokens/js/module/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/js/module/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/animation/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/bento/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/button/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/card/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/card/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/carousel-pagination/colors.js +43 -0
- package/lib/design-tokens/js/module/tokens/functional/components/comparison-table/comparison-table.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/eyebrow-banner/eyebrow-banner.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/faq/faq.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/feature-comparison-table/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/footer/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/footer/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/frosted-glass-vfx/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/grid/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/grid/grid.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/icon/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/icon-button/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/icon-button/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/ide/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/image/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/inline-code/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/inline-link/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/label/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/link/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/logosuite/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/logosuite/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/media-playlist/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/pricing-options/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/pricing-options/pricing-options.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/prose/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/river/river.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/section/section.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/spinner/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/spinner/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/statistic/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/sub-nav/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/tabs/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/tabs/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/testimonial/base.js +9 -1
- package/lib/design-tokens/js/module/tokens/functional/components/testimonial/colors.js +1 -71
- package/lib/design-tokens/js/module/tokens/functional/components/testimonial-group/base.js +13 -0
- package/lib/design-tokens/js/module/tokens/functional/components/text-cursor-animation/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/text-cursor-animation/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/tiles/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/timeline/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/timeline/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/toggle-switch/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/toggle-switch/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/token/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/tooltip/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/video-player/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/border.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/typography/typography.js +1 -1
- package/lib/design-tokens/js/tokens/base/colors/light.js +1 -1
- package/lib/design-tokens/js/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/js/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/js/tokens/functional/animation/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/bento/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/button/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/card/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/card/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/carousel-pagination/colors.js +11 -0
- package/lib/design-tokens/js/tokens/functional/components/comparison-table/comparison-table.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/eyebrow-banner/eyebrow-banner.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/faq/faq.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/feature-comparison-table/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/footer/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/footer/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/frosted-glass-vfx/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/grid/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/grid/grid.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/icon/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/icon-button/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/icon-button/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/ide/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/image/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/inline-code/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/inline-link/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/label/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/link/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/logosuite/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/logosuite/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/media-playlist/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/pricing-options/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/pricing-options/pricing-options.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/prose/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/river/river.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/section/section.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/spinner/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/spinner/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/statistic/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/sub-nav/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/tabs/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/tabs/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/testimonial/base.js +3 -1
- package/lib/design-tokens/js/tokens/functional/components/testimonial/colors.js +1 -16
- package/lib/design-tokens/js/tokens/functional/components/testimonial-group/base.js +7 -0
- package/lib/design-tokens/js/tokens/functional/components/text-cursor-animation/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/text-cursor-animation/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/tiles/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/timeline/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/timeline/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/toggle-switch/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/toggle-switch/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/token/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/tooltip/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/video-player/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/border.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/js/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/js/tokens/functional/typography/typography.js +1 -1
- package/lib/design-tokens/json/colors.json +6 -15
- package/lib/design-tokens/scss/tokens/base/colors/light.scss +1 -1
- package/lib/design-tokens/scss/tokens/base/size/size.scss +1 -1
- package/lib/design-tokens/scss/tokens/base/typography/typography.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/animation/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/colors/global.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/bento/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/button/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/card/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/card/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/carousel-pagination/colors.scss +10 -0
- package/lib/design-tokens/scss/tokens/functional/components/comparison-table/comparison-table.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/eyebrow-banner/eyebrow-banner.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/faq/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/faq/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/faq/faq.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/feature-comparison-table/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/footer/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/footer/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/frosted-glass-vfx/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/grid/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/grid/grid.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/hero/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/icon/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/icon-button/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/icon-button/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/ide/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/image/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/inline-code/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/inline-link/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/inline-link/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/label/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/link/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/logosuite/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/logosuite/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/media-playlist/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/pricing-options/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/pricing-options/pricing-options.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/prose/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/river/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/river/river.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/section/section.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/spinner/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/spinner/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/statistic/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/sub-nav/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/tabs/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/tabs/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/testimonial/base.scss +3 -1
- package/lib/design-tokens/scss/tokens/functional/components/testimonial/colors.scss +1 -16
- package/lib/design-tokens/scss/tokens/functional/components/testimonial-group/base.scss +6 -0
- package/lib/design-tokens/scss/tokens/functional/components/text-cursor-animation/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/text-cursor-animation/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/tiles/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/timeline/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/timeline/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/toggle-switch/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/toggle-switch/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/token/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/tooltip/colors.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/components/video-player/base.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/size/border.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/size/breakpoints.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/size/size-coarse.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/size/size-fine.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/size/size.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/size/viewport.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/typography/typography-responsive.scss +1 -1
- package/lib/design-tokens/scss/tokens/functional/typography/typography.scss +1 -1
- package/lib/design-tokens/ts/tokens/base/colors/light.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/colors/light.js +1 -1
- package/lib/design-tokens/ts/tokens/base/size/size.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/ts/tokens/base/typography/typography.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/animation/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/animation/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/colors/global.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/bento/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/bento/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/button/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/button/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/card/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/card/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/card/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/card/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/carousel-pagination/colors.d.ts +28 -0
- package/lib/design-tokens/ts/tokens/functional/components/carousel-pagination/colors.js +25 -0
- package/lib/design-tokens/ts/tokens/functional/components/comparison-table/comparison-table.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/comparison-table/comparison-table.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/eyebrow-banner/eyebrow-banner.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/eyebrow-banner/eyebrow-banner.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/faq.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/faq.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/feature-comparison-table/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/feature-comparison-table/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/footer/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/footer/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/footer/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/footer/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/frosted-glass-vfx/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/frosted-glass-vfx/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/grid/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/grid/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/grid/grid.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/grid/grid.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/hero/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/icon/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/icon/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/icon-button/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/icon-button/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/icon-button/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/icon-button/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/ide/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/ide/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/image/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/image/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-code/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-code/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/label/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/label/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/link/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/link/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/logosuite/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/logosuite/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/logosuite/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/logosuite/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/media-playlist/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/media-playlist/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/pricing-options/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/pricing-options/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/pricing-options/pricing-options.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/pricing-options/pricing-options.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/prose/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/prose/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/river.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/river.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/section/section.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/section/section.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/spinner/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/spinner/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/spinner/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/spinner/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/statistic/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/statistic/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/sub-nav/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/sub-nav/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tabs/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tabs/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tabs/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tabs/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/testimonial/base.d.ts +9 -1
- package/lib/design-tokens/ts/tokens/functional/components/testimonial/base.js +9 -1
- package/lib/design-tokens/ts/tokens/functional/components/testimonial/colors.d.ts +2 -27
- package/lib/design-tokens/ts/tokens/functional/components/testimonial/colors.js +1 -26
- package/lib/design-tokens/ts/tokens/functional/components/testimonial-group/base.d.ts +16 -0
- package/lib/design-tokens/ts/tokens/functional/components/testimonial-group/base.js +13 -0
- package/lib/design-tokens/ts/tokens/functional/components/text-cursor-animation/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/text-cursor-animation/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/text-cursor-animation/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/text-cursor-animation/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tiles/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tiles/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/timeline/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/timeline/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/timeline/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/timeline/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/toggle-switch/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/toggle-switch/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/toggle-switch/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/toggle-switch/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/token/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/token/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tooltip/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/tooltip/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/video-player/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/video-player/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/border.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/border.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/breakpoints.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-coarse.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-fine.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/viewport.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography.js +1 -1
- package/lib/index.d.ts +2 -0
- package/lib/index.js +1 -1
- package/llms.txt +5 -3
- package/package.json +1 -1
- package/esm/FeatureComparisonTable/FeatureComparisonTable.module-CGnj3YJu.css +0 -1
- package/esm/Heading/Heading.module-YfiTxQkR.css +0 -1
- package/esm/Label/Label.module-DDkalJAE.css +0 -1
- package/esm/SubNav/SubNav.module-cyUt0N_h.css +0 -1
- package/esm/Testimonial/Testimonial.module-_jTJvM-4.css +0 -1
- package/esm/Text/Text.module-D0UHZ0pq.css +0 -1
- package/esm/Token/Token.module-DtWE9IPI.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes-BVk7bh0Y.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/colors/global-with-modes-Bdet_nBw.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/accordion/colors-with-modes-PcQKqJQI.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/action-menu/colors-with-modes-mgXFtgvP.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/anchor-nav/colors-with-modes-98imfMkq.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/breadcrumbs/colors-with-modes-DYugDcQy.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes-kII0kqk3.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/card/colors-with-modes-C43pQ5wc.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/comparison-table/colors-with-modes-D2oNfyDt.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes-ChBPnVuN.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/cta-banner/colors-with-modes-B9zRp3WA.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/eyebrow-banner/colors-with-modes-BzV3LYhH.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/faq/colors-with-modes-Dc8Ya1HV.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/feature-comparison-table/colors-with-modes-Dw8AMSYp.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes-CMFhnjfv.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/frosted-glass-vfx/colors-with-modes-CMw13Yda.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/grid/colors-with-modes-6QocK2fy.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon/colors-with-modes-Bjhpbkke.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes-D7iaptsa.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/ide/colors-with-modes-DSf1PV6b.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/inline-code/colors-with-modes-Bj7XtHMY.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/inline-link/colors-with-modes-DujakhtG.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/label/colors-with-modes-BB1L_8rS.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/link/colors-with-modes-Dh1w7a05.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes-B8ia26TA.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/media-playlist/colors-with-modes-YId8eSZQ.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/nav-list/colors-with-modes-CGyt2t8f.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/pricing-options/colors-with-modes-DBi2l0Re.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/prose/colors-with-modes-Y3yB1rAU.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/river-story-scroll/colors-with-modes-omPmv64b.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/spinner/colors-with-modes-izIk82NS.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/sub-nav/colors-with-modes-Bna3nyXf.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/subdomain-nav-bar/colors-with-modes-C_lnz8M6.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tabs/colors-with-modes-DCEDN6wM.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/testimonial/colors-with-modes-8ryG-BX6.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/text-cursor-animation/colors-with-modes-BucKYl1n.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tiles/colors-with-modes-DTTqGOfy.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/timeline/colors-with-modes-DDIdeMJX.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/toggle-switch/colors-with-modes-Ctf2MPJ3.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/token/colors-with-modes-5VT1x9eF.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/tooltip/colors-with-modes-BrRCxJ2E.css +0 -1
- package/esm/packages/design-tokens/lib/design-tokens/css/tokens/functional/components/video-player/colors-with-modes-CTkp-z-l.css +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable___dngKP{--brand-FeatureComparisonTable-itemCount:1;--brand-FeatureComparisonTable-featureColumnWidth:var(--brand-FeatureComparisonTable-default-featureColumnWidth);width:100%;color:var(--brand-color-text-default);background-color:var(--brand-color-canvas-default);container-type:inline-size}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--items2___x2QKi{--brand-FeatureComparisonTable-itemCount:2}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--items3___PBf2a{--brand-FeatureComparisonTable-itemCount:3}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--items4___C1tK_{--brand-FeatureComparisonTable-itemCount:4;--brand-FeatureComparisonTable-featureColumnWidth:var(--brand-FeatureComparisonTable-fourItems-featureColumnWidth)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrowHeading___olgb8{padding:var(--base-size-60) var(--base-size-20);text-align:center}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrowHeading___olgb8:before{content:none}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__table___M6UcH{border-collapse:collapse;table-layout:fixed;width:100%;display:none}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableHeading___qntyG{text-align:start}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeading___lLU9H{align-items:center;gap:var(--base-size-8);display:inline-flex}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowDescription___aPLbp{margin-block-start:var(--base-size-8)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cell___KoDID{justify-content:center;align-items:center;gap:var(--base-size-8);text-align:center;word-wrap:anywhere;max-width:100%;display:inline-flex}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon___li3MO{flex:0 0 var(--base-size-24);width:var(--base-size-24);height:var(--base-size-24);justify-content:center;align-items:center;display:inline-flex}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon--included___gb5E0,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon--unlimited___6S4_o,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon--refresh___VM2hn{border-radius:var(--brand-borderRadius-full)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon--included___gb5E0{color:var(--brand-FeatureComparisonTable-includedIndicator-fgColor);background-color:var(--brand-FeatureComparisonTable-includedIndicator-bgColor)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon--unlimited___6S4_o{color:var(--brand-FeatureComparisonTable-unlimitedIndicator-fgColor);background-color:var(--brand-FeatureComparisonTable-unlimitedIndicator-bgColor)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon--refresh___VM2hn{color:var(--brand-FeatureComparisonTable-refreshIndicator-fgColor);background-color:var(--brand-FeatureComparisonTable-refreshIndicator-bgColor)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__group___XE2zK{border-inline:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__group___XE2zK~.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__group___XE2zK{border-block-start:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__summary___8PpmB{justify-content:space-between;align-items:center;gap:var(--base-size-12);min-height:var(--base-size-80);padding:var(--base-size-24) var(--base-size-20) var(--base-size-4);cursor:pointer;list-style:none;display:flex}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__summary___8PpmB::-webkit-details-marker{display:none}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__chevron___FtiUb{width:var(--base-size-16);height:var(--base-size-16);margin-inline:var(--base-size-6);flex-shrink:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__chevron--expanded___3WPYL{transform:rotate(180deg)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY{border-block-start:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY:first-child{border-block-start:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeading___lLU9H{min-height:var(--base-size-48);padding:var(--base-size-12) var(--base-size-20);justify-content:space-between;display:flex}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeadingContent___KSfue{padding:var(--base-size-12) var(--base-size-20)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeadingContent___KSfue .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeading___lLU9H{min-height:auto;padding:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planName___DTywr{word-wrap:anywhere}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cell___KoDID{text-align:end;justify-content:flex-end}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planValues___bZ2yv{grid-template-columns:minmax(0,1fr) minmax(0,2fr);margin:0;display:grid}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planTerm___mzmmH,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planValue___Ph_zM{min-width:0;min-height:calc(var(--base-size-28) + var(--base-size-24));padding-block:var(--base-size-12);margin:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planTerm___mzmmH{padding-inline:var(--base-size-20) var(--base-size-8)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planValue___Ph_zM{padding-inline:var(--base-size-8) var(--base-size-20);text-align:end}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item___bayqC{grid-row:1/span 4;grid-template-rows:subgrid;border-block-start:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);text-align:start;align-content:start;display:grid}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item--hasLabel___hvCZl{border-block-start:0;grid-row-end:span 5}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item--offset___WWEYj{grid-row-start:2}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__itemContent___xO24j{grid-row:1/span 4;grid-template-rows:subgrid;grid-template-columns:minmax(0, 1fr) fit-content(calc((100% - var(--base-size-8)) / 2));grid-column-gap:var(--base-size-8);-moz-column-gap:var(--base-size-8);column-gap:var(--base-size-8);min-width:0;padding:var(--base-size-16) var(--base-size-28);align-content:start;justify-self:stretch;display:grid}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__itemContent--hasLabel___YTcaZ{border-block-start:var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);grid-row:2/span 4}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__labelCell___5nPTu{padding:calc(var(--base-size-16) - var(--brand-borderWidth-thin)) var(--base-size-28) var(--base-size-16);border-block-start:var(--brand-borderWidth-thin) solid var(--brand-FeatureComparisonTable-label-accentColor);grid-row:1;justify-self:stretch;align-items:center;display:flex;position:relative}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__labelCell___5nPTu:before{border-inline:var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);content:"";pointer-events:none;position:absolute;inset:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__label___WoGfw{font-family:var(--brand-fontStack-monospace);font-size:var(--brand-text-size-100);font-weight:var(--base-text-weight-medium);letter-spacing:var(--brand-text-letterSpacing-100);line-height:var(--brand-text-lineHeight-200);text-transform:uppercase;display:inline-block}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__itemHeading___6bVkq{word-wrap:anywhere;grid-row:1;align-self:start}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__description___A5hme{grid-area:2/1/auto/-1;margin-block-start:var(--base-size-12)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__price___5a2qj{text-align:end;word-wrap:anywhere;grid-area:1/2;align-self:start;margin:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__actions___LF_4R{grid-gap:var(--base-size-12);gap:var(--base-size-12);width:100%;grid-area:4/1/auto/-1;align-self:start;margin-block-start:var(--base-size-12);display:grid}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planTerm___mzmmH,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planValue___Ph_zM,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx{transition:background-color var(--brand-animation-duration-fast) var(--brand-animation-easing-default)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY:focus-within{background-color:var(--brand-FeatureComparisonTable-rowHighlight-bgColor)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY a:focus-visible,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY button:focus-visible{z-index:1;position:relative}@media (width>=48rem){.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy{max-width:38.625rem;margin-inline:auto}}@media (width>=80rem){.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable___dngKP{padding-block-start:var(--base-size-60)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__table___M6UcH{display:table}:where(.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headerCell___Y2QpE,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupDivider___tbGNF){padding:var(--base-size-12) var(--base-size-28);border-block-end:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);vertical-align:top}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headerCell___Y2QpE,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupDivider___tbGNF{text-align:start}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY:last-child>*,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupDivider--noVisibleRows____IfnP{border-block-end:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headingGrid___uc4oR:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupDivider___tbGNF:after{content:none}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx{text-align:center;vertical-align:middle}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ>:first-child,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ>:last-child,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx:last-child,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item___bayqC{position:relative}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ>:first-child:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ>:last-child:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx:last-child:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item___bayqC:before{content:"";pointer-events:none;position:absolute;inset:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item___bayqC:before{inset-block-end:var(--brand-borderWidth-thin)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ>:first-child:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item___bayqC:before{border-inline-start:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx:last-child:before,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ>:last-child:before{border-inline-end:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__featureColumn___yPFyJ{width:var(--brand-FeatureComparisonTable-featureColumnWidth)}:where(.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--stickyHeaders___Vg9gu) .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headerCell___Y2QpE{background-color:var(--brand-color-canvas-default)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--stickyHeaders___Vg9gu .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headingGrid___uc4oR:before{content:"";border:0;-o-border-image:linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) 0;border-image:linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) fill 0;z-index:-1;border-image-outset:0 100vw;height:auto;inset:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--stickyHeaders___Vg9gu .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headingGrid___uc4oR:after{z-index:4}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupDivider___tbGNF{padding-block:var(--base-size-48) var(--base-size-4);position:relative}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headingGrid___uc4oR{grid-template-columns:minmax(0, var(--brand-FeatureComparisonTable-featureColumnWidth)) repeat(var(--brand-FeatureComparisonTable-itemCount), minmax(0, 1fr));display:grid}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ{pointer-events:none;position:absolute;inset:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupControl___srZUw{justify-content:flex-start;align-items:center;gap:var(--base-size-12);min-height:calc(var(--base-size-28) + var(--base-size-24));color:inherit;font:inherit;text-align:inherit;cursor:pointer;background:0 0;border:0;padding:0;display:inline-flex;position:relative}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__chevron___FtiUb{margin-inline:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headingGrid___uc4oR{grid-template-rows:repeat(4,auto);width:100cqw}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headingGrid--hasLabel___z1_Pw{grid-template-rows:repeat(5,auto)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--stickyHeaders___Vg9gu .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__head___iGAPA{z-index:2;position:sticky;inset-block-start:0}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headerCell___Y2QpE{grid-row:1/span 4;grid-template-rows:subgrid;border-block:0;padding:0;display:grid}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headerCell--hasLabel___5QsYF{grid-row-end:span 5}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableHeading___qntyG{padding:var(--base-size-28);align-self:end}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headerCell___Y2QpE:last-child .Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item___bayqC:before{border-inline-end:var(--brand-borderWidth-thin) solid var(--brand-color-border-muted)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableHeading--hasLabel___mUlr7{grid-row:2/-1;align-self:start;padding-block:0;position:relative;inset-block-start:var(--base-size-16)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__highlightedColumn___RwptH{background-color:var(--brand-FeatureComparisonTable-highlightedColumn-bgColor)}.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY:focus-within>*{background-color:var(--brand-FeatureComparisonTable-rowHighlight-bgColor)}}@media (hover:hover) and (pointer:fine){.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY:hover{background-color:var(--brand-FeatureComparisonTable-rowHighlight-bgColor)}}@media (hover:hover) and (pointer:fine) and (width>=80rem){.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY:hover>*{background-color:var(--brand-FeatureComparisonTable-rowHighlight-bgColor)}}@media (prefers-reduced-motion:reduce){.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planTerm___mzmmH,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planValue___Ph_zM,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn,.Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx{transition-duration:0s}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './FeatureComparisonTable.module-
|
|
1
|
+
import './FeatureComparisonTable.module-BH8n2Ttj.css';//#region src/FeatureComparisonTable/FeatureComparisonTable.module.css
|
|
2
2
|
var e = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable___dngKP", t = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrowHeading___olgb8", n = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__table___M6UcH", r = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableHeading___qntyG", i = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeading___lLU9H", a = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowDescription___aPLbp", o = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cell___KoDID", s = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__cellIcon___li3MO", c = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__group___XE2zK", l = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__summary___8PpmB", u = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__chevron___FtiUb", d = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__narrow___OkfDy", f = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__row___Gc3qY", p = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeadingContent___KSfue", m = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planName___DTywr", h = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planValues___bZ2yv", g = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planTerm___mzmmH", _ = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__planValue___Ph_zM", v = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__item___bayqC", y = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__itemContent___xO24j", b = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__labelCell___5nPTu", x = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__label___WoGfw", S = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__itemHeading___6bVkq", C = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__description___A5hme", w = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__price___5a2qj", T = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__actions___LF_4R", E = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__rowHeaderCell___r2pHn", D = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell___anJpx", O = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headerCell___Y2QpE", k = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupDivider___tbGNF", A = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__headingGrid___uc4oR", j = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupBackground___pFWoJ", M = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__featureColumn___yPFyJ", N = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupControl___srZUw", P = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__head___iGAPA", F = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__highlightedColumn___RwptH", I = {
|
|
3
3
|
FeatureComparisonTable: e,
|
|
4
4
|
"FeatureComparisonTable--items2": "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--items2___x2QKi",
|
|
@@ -42,7 +42,6 @@ var e = "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable___d
|
|
|
42
42
|
FeatureComparisonTable__groupDivider: k,
|
|
43
43
|
"FeatureComparisonTable__groupDivider--noVisibleRows": "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__groupDivider--noVisibleRows____IfnP",
|
|
44
44
|
FeatureComparisonTable__headingGrid: A,
|
|
45
|
-
"FeatureComparisonTable__tableCell--hasVariant": "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable__tableCell--hasVariant___a9jCs",
|
|
46
45
|
FeatureComparisonTable__groupBackground: j,
|
|
47
46
|
FeatureComparisonTable__featureColumn: M,
|
|
48
47
|
"FeatureComparisonTable--stickyHeaders": "Primer_Brand__FeatureComparisonTable-module__FeatureComparisonTable--stickyHeaders___Vg9gu",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeatureComparisonTable.module.js","names":[],"sources":["../../src/FeatureComparisonTable/FeatureComparisonTable.module.css"],"sourcesContent":[".FeatureComparisonTable {\n --brand-FeatureComparisonTable-itemCount: 1;\n --brand-FeatureComparisonTable-featureColumnWidth: var(--brand-FeatureComparisonTable-default-featureColumnWidth);\n\n container-type: inline-size;\n width: 100%;\n color: var(--brand-color-text-default);\n}\n\n.FeatureComparisonTable--items2 {\n --brand-FeatureComparisonTable-itemCount: 2;\n}\n\n.FeatureComparisonTable--items3 {\n --brand-FeatureComparisonTable-itemCount: 3;\n}\n\n.FeatureComparisonTable--items4 {\n --brand-FeatureComparisonTable-itemCount: 4;\n --brand-FeatureComparisonTable-featureColumnWidth: var(--brand-FeatureComparisonTable-fourItems-featureColumnWidth);\n}\n\n.FeatureComparisonTable__narrowHeading {\n padding: var(--base-size-60) var(--base-size-20);\n text-align: center;\n}\n\n.FeatureComparisonTable__narrowHeading::before {\n content: none;\n}\n\n.FeatureComparisonTable__table {\n display: none;\n width: 100%;\n border-collapse: collapse;\n table-layout: fixed;\n}\n\n.FeatureComparisonTable__tableHeading {\n text-align: start;\n}\n\n.FeatureComparisonTable__rowHeading {\n display: inline-flex;\n align-items: center;\n gap: var(--base-size-8);\n}\n\n.FeatureComparisonTable__rowDescription {\n margin-block-start: var(--base-size-8);\n}\n\n.FeatureComparisonTable__cell {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--base-size-8);\n max-width: 100%;\n text-align: center;\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__cellIcon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: 0 0 var(--base-size-24);\n width: var(--base-size-24);\n height: var(--base-size-24);\n}\n\n.FeatureComparisonTable__cellIcon--included,\n.FeatureComparisonTable__cellIcon--unlimited,\n.FeatureComparisonTable__cellIcon--refresh {\n border-radius: var(--brand-borderRadius-full);\n}\n\n.FeatureComparisonTable__cellIcon--included {\n color: var(--brand-FeatureComparisonTable-includedIndicator-fgColor);\n background-color: var(--brand-FeatureComparisonTable-includedIndicator-bgColor);\n}\n\n.FeatureComparisonTable__cellIcon--unlimited {\n color: var(--brand-FeatureComparisonTable-unlimitedIndicator-fgColor);\n background-color: var(--brand-FeatureComparisonTable-unlimitedIndicator-bgColor);\n}\n\n.FeatureComparisonTable__cellIcon--refresh {\n color: var(--brand-FeatureComparisonTable-refreshIndicator-fgColor);\n background-color: var(--brand-FeatureComparisonTable-refreshIndicator-bgColor);\n}\n\n.FeatureComparisonTable__group {\n border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.FeatureComparisonTable__group ~ .FeatureComparisonTable__group {\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.FeatureComparisonTable__summary {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--base-size-12);\n min-height: var(--base-size-80);\n padding: var(--base-size-24) var(--base-size-20) var(--base-size-4);\n list-style: none;\n cursor: pointer;\n}\n\n.FeatureComparisonTable__summary::-webkit-details-marker {\n display: none;\n}\n\n.FeatureComparisonTable__chevron {\n flex-shrink: 0;\n width: var(--base-size-16);\n height: var(--base-size-16);\n margin-inline: var(--base-size-6);\n}\n\n.FeatureComparisonTable__chevron--expanded {\n transform: rotate(180deg);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__row {\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__row:first-child {\n border-block-start: 0;\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__rowHeading {\n display: flex;\n justify-content: space-between;\n min-height: var(--base-size-48);\n padding: var(--base-size-12) var(--base-size-20);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__rowHeadingContent {\n padding: var(--base-size-12) var(--base-size-20);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__rowHeadingContent .FeatureComparisonTable__rowHeading {\n min-height: auto;\n padding: 0;\n}\n\n.FeatureComparisonTable__planName {\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__cell {\n justify-content: flex-end;\n text-align: end;\n}\n\n.FeatureComparisonTable__planValues {\n display: grid;\n grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);\n margin: 0;\n}\n\n.FeatureComparisonTable__planTerm,\n.FeatureComparisonTable__planValue {\n margin: 0;\n min-width: 0;\n min-height: calc(var(--base-size-28) + var(--base-size-24));\n padding-block: var(--base-size-12);\n}\n\n.FeatureComparisonTable__planTerm {\n padding-inline: var(--base-size-20) var(--base-size-8);\n}\n\n.FeatureComparisonTable__planValue {\n padding-inline: var(--base-size-8) var(--base-size-20);\n text-align: end;\n}\n\n.FeatureComparisonTable__item {\n display: grid;\n grid-row: 1 / span 4;\n grid-template-rows: subgrid;\n align-content: start;\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n text-align: start;\n}\n\n.FeatureComparisonTable__item--hasLabel {\n grid-row-end: span 5;\n border-block-start: 0;\n}\n\n.FeatureComparisonTable__item--offset {\n grid-row-start: 2;\n}\n\n.FeatureComparisonTable__itemContent {\n display: grid;\n grid-row: 1 / span 4;\n grid-template-rows: subgrid;\n grid-template-columns: minmax(0, 1fr) fit-content(calc((100% - var(--base-size-8)) / 2));\n column-gap: var(--base-size-8);\n align-content: start;\n justify-self: stretch;\n min-width: 0;\n padding: var(--base-size-16) var(--base-size-28);\n}\n\n.FeatureComparisonTable__itemContent--hasLabel {\n grid-row: 2 / span 4;\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n}\n\n.FeatureComparisonTable__labelCell {\n position: relative;\n display: flex;\n grid-row: 1;\n align-items: center;\n justify-self: stretch;\n padding: calc(var(--base-size-16) - var(--brand-borderWidth-thin)) var(--base-size-28) var(--base-size-16);\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-FeatureComparisonTable-label-accentColor);\n}\n\n.FeatureComparisonTable__labelCell::before {\n position: absolute;\n inset: 0;\n border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n content: '';\n pointer-events: none;\n}\n\n.FeatureComparisonTable__label {\n display: inline-block;\n font-family: var(--brand-fontStack-monospace);\n font-size: var(--brand-text-size-100);\n font-weight: var(--base-text-weight-medium);\n letter-spacing: var(--brand-text-letterSpacing-100);\n line-height: var(--brand-text-lineHeight-200);\n text-transform: uppercase;\n}\n\n.FeatureComparisonTable__itemHeading {\n grid-row: 1;\n align-self: start;\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__description {\n grid-row: 2;\n grid-column: 1 / -1;\n margin-block-start: var(--base-size-12);\n}\n\n.FeatureComparisonTable__price {\n grid-row: 1;\n grid-column: 2;\n align-self: start;\n margin: 0;\n text-align: end;\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__actions {\n display: grid;\n grid-row: 4;\n grid-column: 1 / -1;\n gap: var(--base-size-12);\n align-self: start;\n width: 100%;\n margin-block-start: var(--base-size-12);\n}\n\n.FeatureComparisonTable__row,\n.FeatureComparisonTable__planTerm,\n.FeatureComparisonTable__planValue,\n.FeatureComparisonTable__rowHeaderCell,\n.FeatureComparisonTable__tableCell {\n transition: background-color var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n}\n\n.FeatureComparisonTable__row:focus-within {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n}\n\n.FeatureComparisonTable__row :is(a, button):focus-visible {\n position: relative;\n z-index: 1;\n}\n\n@media (min-width: 48rem) {\n .FeatureComparisonTable__narrow {\n max-width: 38.625rem;\n margin-inline: auto;\n }\n}\n\n@media (min-width: 80rem) {\n .FeatureComparisonTable {\n padding-block-start: var(--base-size-60);\n }\n\n .FeatureComparisonTable__table {\n display: table;\n }\n\n :where(\n .FeatureComparisonTable__headerCell,\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__tableCell,\n .FeatureComparisonTable__groupDivider\n ) {\n padding: var(--base-size-12) var(--base-size-28);\n border-block-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n vertical-align: top;\n }\n\n .FeatureComparisonTable__headerCell,\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__groupDivider {\n text-align: start;\n }\n\n .FeatureComparisonTable__row:last-child > *,\n .FeatureComparisonTable__groupDivider--noVisibleRows {\n border-block-end: 0;\n }\n\n .FeatureComparisonTable__headingGrid::before,\n .FeatureComparisonTable__groupDivider::after {\n content: none;\n }\n\n .FeatureComparisonTable__tableCell {\n text-align: center;\n }\n\n .FeatureComparisonTable__tableCell--hasVariant {\n vertical-align: middle;\n }\n\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__tableCell:last-child,\n .FeatureComparisonTable__groupBackground > :is(:first-child, :last-child),\n .FeatureComparisonTable__item {\n position: relative;\n }\n\n .FeatureComparisonTable__rowHeaderCell::before,\n .FeatureComparisonTable__tableCell:last-child::before,\n .FeatureComparisonTable__groupBackground > :is(:first-child, :last-child)::before,\n .FeatureComparisonTable__item::before {\n position: absolute;\n inset: 0;\n content: '';\n pointer-events: none;\n }\n\n .FeatureComparisonTable__item::before {\n inset-block-end: var(--brand-borderWidth-thin);\n }\n\n .FeatureComparisonTable__rowHeaderCell::before,\n .FeatureComparisonTable__groupBackground > :first-child::before,\n .FeatureComparisonTable__item::before {\n border-inline-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n\n .FeatureComparisonTable__tableCell:last-child::before,\n .FeatureComparisonTable__groupBackground > :last-child::before {\n border-inline-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n\n .FeatureComparisonTable__featureColumn {\n width: var(--brand-FeatureComparisonTable-featureColumnWidth);\n }\n\n :where(.FeatureComparisonTable--stickyHeaders) .FeatureComparisonTable__headerCell {\n background-color: var(--brand-color-canvas-default);\n }\n\n .FeatureComparisonTable--stickyHeaders .FeatureComparisonTable__headingGrid::after {\n z-index: 4;\n }\n\n .FeatureComparisonTable__groupDivider {\n position: relative;\n padding-block: var(--base-size-48) var(--base-size-4);\n }\n\n .FeatureComparisonTable__groupBackground,\n .FeatureComparisonTable__headingGrid {\n display: grid;\n grid-template-columns:\n minmax(0, var(--brand-FeatureComparisonTable-featureColumnWidth))\n repeat(var(--brand-FeatureComparisonTable-itemCount), minmax(0, 1fr));\n }\n\n .FeatureComparisonTable__groupBackground {\n position: absolute;\n inset: 0;\n pointer-events: none;\n }\n\n .FeatureComparisonTable__groupControl {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: flex-start;\n gap: var(--base-size-12);\n min-height: calc(var(--base-size-28) + var(--base-size-24));\n padding: 0;\n color: inherit;\n font: inherit;\n text-align: inherit;\n background: transparent;\n border: 0;\n cursor: pointer;\n }\n\n .FeatureComparisonTable__chevron {\n margin-inline: 0;\n }\n\n .FeatureComparisonTable__headingGrid {\n width: 100cqw;\n grid-template-rows: repeat(4, auto);\n }\n\n .FeatureComparisonTable__headingGrid--hasLabel {\n grid-template-rows: repeat(5, auto);\n }\n\n .FeatureComparisonTable--stickyHeaders .FeatureComparisonTable__head {\n position: sticky;\n z-index: 2;\n inset-block-start: 0;\n }\n\n .FeatureComparisonTable__headerCell {\n display: grid;\n grid-row: 1 / span 4;\n grid-template-rows: subgrid;\n padding: 0;\n border-block-start: 0;\n border-block-end: 0;\n }\n\n .FeatureComparisonTable__headerCell--hasLabel {\n grid-row-end: span 5;\n }\n\n .FeatureComparisonTable__tableHeading {\n align-self: end;\n padding: var(--base-size-28);\n }\n\n .FeatureComparisonTable__headerCell:last-child .FeatureComparisonTable__item::before {\n border-inline-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n\n .FeatureComparisonTable__tableHeading--hasLabel {\n position: relative;\n grid-row: 2 / -1;\n align-self: start;\n padding-block: 0;\n inset-block-start: var(--base-size-16);\n }\n\n .FeatureComparisonTable__highlightedColumn {\n background-color: var(--brand-FeatureComparisonTable-highlightedColumn-bgColor);\n }\n\n .FeatureComparisonTable__row:focus-within > * {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n }\n}\n\n@media (hover: hover) and (pointer: fine) {\n .FeatureComparisonTable__row:hover {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n }\n}\n\n@media (hover: hover) and (pointer: fine) and (min-width: 80rem) {\n .FeatureComparisonTable__row:hover > * {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .FeatureComparisonTable__row,\n .FeatureComparisonTable__planTerm,\n .FeatureComparisonTable__planValue,\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__tableCell {\n transition-duration: 0s;\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"FeatureComparisonTable.module.js","names":[],"sources":["../../src/FeatureComparisonTable/FeatureComparisonTable.module.css"],"sourcesContent":[".FeatureComparisonTable {\n --brand-FeatureComparisonTable-itemCount: 1;\n --brand-FeatureComparisonTable-featureColumnWidth: var(--brand-FeatureComparisonTable-default-featureColumnWidth);\n\n container-type: inline-size;\n width: 100%;\n color: var(--brand-color-text-default);\n background-color: var(--brand-color-canvas-default);\n}\n\n.FeatureComparisonTable--items2 {\n --brand-FeatureComparisonTable-itemCount: 2;\n}\n\n.FeatureComparisonTable--items3 {\n --brand-FeatureComparisonTable-itemCount: 3;\n}\n\n.FeatureComparisonTable--items4 {\n --brand-FeatureComparisonTable-itemCount: 4;\n --brand-FeatureComparisonTable-featureColumnWidth: var(--brand-FeatureComparisonTable-fourItems-featureColumnWidth);\n}\n\n.FeatureComparisonTable__narrowHeading {\n padding: var(--base-size-60) var(--base-size-20);\n text-align: center;\n}\n\n.FeatureComparisonTable__narrowHeading::before {\n content: none;\n}\n\n.FeatureComparisonTable__table {\n display: none;\n width: 100%;\n border-collapse: collapse;\n table-layout: fixed;\n}\n\n.FeatureComparisonTable__tableHeading {\n text-align: start;\n}\n\n.FeatureComparisonTable__rowHeading {\n display: inline-flex;\n align-items: center;\n gap: var(--base-size-8);\n}\n\n.FeatureComparisonTable__rowDescription {\n margin-block-start: var(--base-size-8);\n}\n\n.FeatureComparisonTable__cell {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--base-size-8);\n max-width: 100%;\n text-align: center;\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__cellIcon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: 0 0 var(--base-size-24);\n width: var(--base-size-24);\n height: var(--base-size-24);\n}\n\n.FeatureComparisonTable__cellIcon--included,\n.FeatureComparisonTable__cellIcon--unlimited,\n.FeatureComparisonTable__cellIcon--refresh {\n border-radius: var(--brand-borderRadius-full);\n}\n\n.FeatureComparisonTable__cellIcon--included {\n color: var(--brand-FeatureComparisonTable-includedIndicator-fgColor);\n background-color: var(--brand-FeatureComparisonTable-includedIndicator-bgColor);\n}\n\n.FeatureComparisonTable__cellIcon--unlimited {\n color: var(--brand-FeatureComparisonTable-unlimitedIndicator-fgColor);\n background-color: var(--brand-FeatureComparisonTable-unlimitedIndicator-bgColor);\n}\n\n.FeatureComparisonTable__cellIcon--refresh {\n color: var(--brand-FeatureComparisonTable-refreshIndicator-fgColor);\n background-color: var(--brand-FeatureComparisonTable-refreshIndicator-bgColor);\n}\n\n.FeatureComparisonTable__group {\n border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.FeatureComparisonTable__group ~ .FeatureComparisonTable__group {\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.FeatureComparisonTable__summary {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--base-size-12);\n min-height: var(--base-size-80);\n padding: var(--base-size-24) var(--base-size-20) var(--base-size-4);\n list-style: none;\n cursor: pointer;\n}\n\n.FeatureComparisonTable__summary::-webkit-details-marker {\n display: none;\n}\n\n.FeatureComparisonTable__chevron {\n flex-shrink: 0;\n width: var(--base-size-16);\n height: var(--base-size-16);\n margin-inline: var(--base-size-6);\n}\n\n.FeatureComparisonTable__chevron--expanded {\n transform: rotate(180deg);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__row {\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__row:first-child {\n border-block-start: 0;\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__rowHeading {\n display: flex;\n justify-content: space-between;\n min-height: var(--base-size-48);\n padding: var(--base-size-12) var(--base-size-20);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__rowHeadingContent {\n padding: var(--base-size-12) var(--base-size-20);\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__rowHeadingContent .FeatureComparisonTable__rowHeading {\n min-height: auto;\n padding: 0;\n}\n\n.FeatureComparisonTable__planName {\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__narrow .FeatureComparisonTable__cell {\n justify-content: flex-end;\n text-align: end;\n}\n\n.FeatureComparisonTable__planValues {\n display: grid;\n grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);\n margin: 0;\n}\n\n.FeatureComparisonTable__planTerm,\n.FeatureComparisonTable__planValue {\n margin: 0;\n min-width: 0;\n min-height: calc(var(--base-size-28) + var(--base-size-24));\n padding-block: var(--base-size-12);\n}\n\n.FeatureComparisonTable__planTerm {\n padding-inline: var(--base-size-20) var(--base-size-8);\n}\n\n.FeatureComparisonTable__planValue {\n padding-inline: var(--base-size-8) var(--base-size-20);\n text-align: end;\n}\n\n.FeatureComparisonTable__item {\n display: grid;\n grid-row: 1 / span 4;\n grid-template-rows: subgrid;\n align-content: start;\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n text-align: start;\n}\n\n.FeatureComparisonTable__item--hasLabel {\n grid-row-end: span 5;\n border-block-start: 0;\n}\n\n.FeatureComparisonTable__item--offset {\n grid-row-start: 2;\n}\n\n.FeatureComparisonTable__itemContent {\n display: grid;\n grid-row: 1 / span 4;\n grid-template-rows: subgrid;\n grid-template-columns: minmax(0, 1fr) fit-content(calc((100% - var(--base-size-8)) / 2));\n column-gap: var(--base-size-8);\n align-content: start;\n justify-self: stretch;\n min-width: 0;\n padding: var(--base-size-16) var(--base-size-28);\n}\n\n.FeatureComparisonTable__itemContent--hasLabel {\n grid-row: 2 / span 4;\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n}\n\n.FeatureComparisonTable__labelCell {\n position: relative;\n display: flex;\n grid-row: 1;\n align-items: center;\n justify-self: stretch;\n padding: calc(var(--base-size-16) - var(--brand-borderWidth-thin)) var(--base-size-28) var(--base-size-16);\n border-block-start: var(--brand-borderWidth-thin) solid var(--brand-FeatureComparisonTable-label-accentColor);\n}\n\n.FeatureComparisonTable__labelCell::before {\n position: absolute;\n inset: 0;\n border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-subtle);\n content: '';\n pointer-events: none;\n}\n\n.FeatureComparisonTable__label {\n display: inline-block;\n font-family: var(--brand-fontStack-monospace);\n font-size: var(--brand-text-size-100);\n font-weight: var(--base-text-weight-medium);\n letter-spacing: var(--brand-text-letterSpacing-100);\n line-height: var(--brand-text-lineHeight-200);\n text-transform: uppercase;\n}\n\n.FeatureComparisonTable__itemHeading {\n grid-row: 1;\n align-self: start;\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__description {\n grid-row: 2;\n grid-column: 1 / -1;\n margin-block-start: var(--base-size-12);\n}\n\n.FeatureComparisonTable__price {\n grid-row: 1;\n grid-column: 2;\n align-self: start;\n margin: 0;\n text-align: end;\n overflow-wrap: anywhere;\n}\n\n.FeatureComparisonTable__actions {\n display: grid;\n grid-row: 4;\n grid-column: 1 / -1;\n gap: var(--base-size-12);\n align-self: start;\n width: 100%;\n margin-block-start: var(--base-size-12);\n}\n\n.FeatureComparisonTable__row,\n.FeatureComparisonTable__planTerm,\n.FeatureComparisonTable__planValue,\n.FeatureComparisonTable__rowHeaderCell,\n.FeatureComparisonTable__tableCell {\n transition: background-color var(--brand-animation-duration-fast) var(--brand-animation-easing-default);\n}\n\n.FeatureComparisonTable__row:focus-within {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n}\n\n.FeatureComparisonTable__row :is(a, button):focus-visible {\n position: relative;\n z-index: 1;\n}\n\n@media (min-width: 48rem) {\n .FeatureComparisonTable__narrow {\n max-width: 38.625rem;\n margin-inline: auto;\n }\n}\n\n@media (min-width: 80rem) {\n .FeatureComparisonTable {\n padding-block-start: var(--base-size-60);\n }\n\n .FeatureComparisonTable__table {\n display: table;\n }\n\n :where(\n .FeatureComparisonTable__headerCell,\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__tableCell,\n .FeatureComparisonTable__groupDivider\n ) {\n padding: var(--base-size-12) var(--base-size-28);\n border-block-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n vertical-align: top;\n }\n\n .FeatureComparisonTable__headerCell,\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__groupDivider {\n text-align: start;\n }\n\n .FeatureComparisonTable__row:last-child > *,\n .FeatureComparisonTable__groupDivider--noVisibleRows {\n border-block-end: 0;\n }\n\n .FeatureComparisonTable__headingGrid::before,\n .FeatureComparisonTable__groupDivider::after {\n content: none;\n }\n\n .FeatureComparisonTable__tableCell {\n text-align: center;\n vertical-align: middle;\n }\n\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__tableCell:last-child,\n .FeatureComparisonTable__groupBackground > :is(:first-child, :last-child),\n .FeatureComparisonTable__item {\n position: relative;\n }\n\n .FeatureComparisonTable__rowHeaderCell::before,\n .FeatureComparisonTable__tableCell:last-child::before,\n .FeatureComparisonTable__groupBackground > :is(:first-child, :last-child)::before,\n .FeatureComparisonTable__item::before {\n position: absolute;\n inset: 0;\n content: '';\n pointer-events: none;\n }\n\n .FeatureComparisonTable__item::before {\n inset-block-end: var(--brand-borderWidth-thin);\n }\n\n .FeatureComparisonTable__rowHeaderCell::before,\n .FeatureComparisonTable__groupBackground > :first-child::before,\n .FeatureComparisonTable__item::before {\n border-inline-start: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n\n .FeatureComparisonTable__tableCell:last-child::before,\n .FeatureComparisonTable__groupBackground > :last-child::before {\n border-inline-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n\n .FeatureComparisonTable__featureColumn {\n width: var(--brand-FeatureComparisonTable-featureColumnWidth);\n }\n\n :where(.FeatureComparisonTable--stickyHeaders) .FeatureComparisonTable__headerCell {\n background-color: var(--brand-color-canvas-default);\n }\n\n .FeatureComparisonTable--stickyHeaders .FeatureComparisonTable__headingGrid::before {\n content: '';\n inset: 0;\n height: auto;\n border: 0;\n border-image: linear-gradient(var(--brand-color-canvas-default), var(--brand-color-canvas-default)) fill 0;\n border-image-outset: 0 100vw;\n z-index: -1;\n }\n\n .FeatureComparisonTable--stickyHeaders .FeatureComparisonTable__headingGrid::after {\n z-index: 4;\n }\n\n .FeatureComparisonTable__groupDivider {\n position: relative;\n padding-block: var(--base-size-48) var(--base-size-4);\n }\n\n .FeatureComparisonTable__groupBackground,\n .FeatureComparisonTable__headingGrid {\n display: grid;\n grid-template-columns:\n minmax(0, var(--brand-FeatureComparisonTable-featureColumnWidth))\n repeat(var(--brand-FeatureComparisonTable-itemCount), minmax(0, 1fr));\n }\n\n .FeatureComparisonTable__groupBackground {\n position: absolute;\n inset: 0;\n pointer-events: none;\n }\n\n .FeatureComparisonTable__groupControl {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: flex-start;\n gap: var(--base-size-12);\n min-height: calc(var(--base-size-28) + var(--base-size-24));\n padding: 0;\n color: inherit;\n font: inherit;\n text-align: inherit;\n background: transparent;\n border: 0;\n cursor: pointer;\n }\n\n .FeatureComparisonTable__chevron {\n margin-inline: 0;\n }\n\n .FeatureComparisonTable__headingGrid {\n width: 100cqw;\n grid-template-rows: repeat(4, auto);\n }\n\n .FeatureComparisonTable__headingGrid--hasLabel {\n grid-template-rows: repeat(5, auto);\n }\n\n .FeatureComparisonTable--stickyHeaders .FeatureComparisonTable__head {\n position: sticky;\n z-index: 2;\n inset-block-start: 0;\n }\n\n .FeatureComparisonTable__headerCell {\n display: grid;\n grid-row: 1 / span 4;\n grid-template-rows: subgrid;\n padding: 0;\n border-block-start: 0;\n border-block-end: 0;\n }\n\n .FeatureComparisonTable__headerCell--hasLabel {\n grid-row-end: span 5;\n }\n\n .FeatureComparisonTable__tableHeading {\n align-self: end;\n padding: var(--base-size-28);\n }\n\n .FeatureComparisonTable__headerCell:last-child .FeatureComparisonTable__item::before {\n border-inline-end: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);\n }\n\n .FeatureComparisonTable__tableHeading--hasLabel {\n position: relative;\n grid-row: 2 / -1;\n align-self: start;\n padding-block: 0;\n inset-block-start: var(--base-size-16);\n }\n\n .FeatureComparisonTable__highlightedColumn {\n background-color: var(--brand-FeatureComparisonTable-highlightedColumn-bgColor);\n }\n\n .FeatureComparisonTable__row:focus-within > * {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n }\n}\n\n@media (hover: hover) and (pointer: fine) {\n .FeatureComparisonTable__row:hover {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n }\n}\n\n@media (hover: hover) and (pointer: fine) and (min-width: 80rem) {\n .FeatureComparisonTable__row:hover > * {\n background-color: var(--brand-FeatureComparisonTable-rowHighlight-bgColor);\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .FeatureComparisonTable__row,\n .FeatureComparisonTable__planTerm,\n .FeatureComparisonTable__planValue,\n .FeatureComparisonTable__rowHeaderCell,\n .FeatureComparisonTable__tableCell {\n transition-duration: 0s;\n }\n}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeatureComparisonTableRow.d.ts","sourceRoot":"","sources":["../../../src/FeatureComparisonTable/sub-components/FeatureComparisonTableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,KAAK,iBAAiB,EAAY,MAAM,OAAO,CAAA;AAI9D,OAAO,EAAC,KAAK,+BAA+B,EAA2B,MAAM,kCAAkC,CAAA;AAO/G,MAAM,MAAM,8BAA8B,GAAG,iBAAiB,CAAC,+BAA+B,CAAC,cAAc,CAAC,CAAC,CAAA;AAE/G,eAAO,MAAM,yBAAyB,GAAI,yBAAuB,8BAA8B,
|
|
1
|
+
{"version":3,"file":"FeatureComparisonTableRow.d.ts","sourceRoot":"","sources":["../../../src/FeatureComparisonTable/sub-components/FeatureComparisonTableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,KAAK,iBAAiB,EAAY,MAAM,OAAO,CAAA;AAI9D,OAAO,EAAC,KAAK,+BAA+B,EAA2B,MAAM,kCAAkC,CAAA;AAO/G,MAAM,MAAM,8BAA8B,GAAG,iBAAiB,CAAC,+BAA+B,CAAC,cAAc,CAAC,CAAC,CAAA;AAE/G,eAAO,MAAM,yBAAyB,GAAI,yBAAuB,8BAA8B,sBAmF9F,CAAA"}
|
|
@@ -28,7 +28,7 @@ var h = ({ children: h, className: g }) => {
|
|
|
28
28
|
"data-testid": n.rowHeading,
|
|
29
29
|
children: C
|
|
30
30
|
}), _.map((t, n) => /* @__PURE__ */ p("td", {
|
|
31
|
-
className: e(i.FeatureComparisonTable__tableCell, o(t) && i.FeatureComparisonTable__highlightedColumn
|
|
31
|
+
className: e(i.FeatureComparisonTable__tableCell, o(t) && i.FeatureComparisonTable__highlightedColumn),
|
|
32
32
|
children: S[n]
|
|
33
33
|
}, t.key))]
|
|
34
34
|
}) : /* @__PURE__ */ m("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeatureComparisonTableRow.js","names":[],"sources":["../../../src/FeatureComparisonTable/sub-components/FeatureComparisonTableRow.tsx"],"sourcesContent":["import React, {type PropsWithChildren, useEffect} from 'react'\nimport {clsx} from 'clsx'\nimport {Text} from '../../Text'\nimport styles from '../FeatureComparisonTable.module.css'\nimport {type FeatureComparisonTableBaseProps, useTableContext, testIds} from '../FeatureComparisonTableContext'\nimport {getChildrenOfType, hasItemLabel} from '../FeatureComparisonTableHelpers'\nimport {FeatureComparisonTableRowHeading} from './FeatureComparisonTableRowHeading'\nimport {FeatureComparisonTableRowDescription} from './FeatureComparisonTableRowDescription'\nimport {FeatureComparisonTableCell} from './FeatureComparisonTableCell'\nimport {FeatureComparisonTableItemHeading} from './FeatureComparisonTableItemHeading'\n\nexport type FeatureComparisonTableRowProps = PropsWithChildren<FeatureComparisonTableBaseProps<HTMLDivElement>>\n\nexport const FeatureComparisonTableRow = ({children, className}: FeatureComparisonTableRowProps) => {\n const {items, breakpoint} = useTableContext()\n const rowChildren = React.Children.toArray(children)\n const heading = getChildrenOfType(rowChildren, FeatureComparisonTableRowHeading).at(-1)\n const description = getChildrenOfType(rowChildren, FeatureComparisonTableRowDescription).at(-1)\n const cells = getChildrenOfType(rowChildren, FeatureComparisonTableCell)\n\n useEffect(() => {\n if (process.env.NODE_ENV !== 'production' && cells.length !== items.length) {\n // eslint-disable-next-line no-console\n console.warn(\n `FeatureComparisonTable.Row: expected ${items.length} Cell children to match the number of items, but received ${cells.length}. Missing cells render empty and extra cells are ignored.`,\n )\n }\n }, [cells.length, items.length])\n\n const rowHeading =\n heading && description ? (\n <div className={styles.FeatureComparisonTable__rowHeadingContent}>\n {heading}\n {description}\n </div>\n ) : (\n heading\n )\n\n if (breakpoint === 'wide') {\n return (\n <tr className={clsx(styles.FeatureComparisonTable__row, className)} data-testid={testIds.row}>\n <th className={styles.FeatureComparisonTable__rowHeaderCell} scope=\"row\" data-testid={testIds.rowHeading}>\n {rowHeading}\n </th>\n {items.map((item, index) => (\n <td\n className={clsx(\n styles.FeatureComparisonTable__tableCell,\n hasItemLabel(item) && styles.FeatureComparisonTable__highlightedColumn,\n
|
|
1
|
+
{"version":3,"file":"FeatureComparisonTableRow.js","names":[],"sources":["../../../src/FeatureComparisonTable/sub-components/FeatureComparisonTableRow.tsx"],"sourcesContent":["import React, {type PropsWithChildren, useEffect} from 'react'\nimport {clsx} from 'clsx'\nimport {Text} from '../../Text'\nimport styles from '../FeatureComparisonTable.module.css'\nimport {type FeatureComparisonTableBaseProps, useTableContext, testIds} from '../FeatureComparisonTableContext'\nimport {getChildrenOfType, hasItemLabel} from '../FeatureComparisonTableHelpers'\nimport {FeatureComparisonTableRowHeading} from './FeatureComparisonTableRowHeading'\nimport {FeatureComparisonTableRowDescription} from './FeatureComparisonTableRowDescription'\nimport {FeatureComparisonTableCell} from './FeatureComparisonTableCell'\nimport {FeatureComparisonTableItemHeading} from './FeatureComparisonTableItemHeading'\n\nexport type FeatureComparisonTableRowProps = PropsWithChildren<FeatureComparisonTableBaseProps<HTMLDivElement>>\n\nexport const FeatureComparisonTableRow = ({children, className}: FeatureComparisonTableRowProps) => {\n const {items, breakpoint} = useTableContext()\n const rowChildren = React.Children.toArray(children)\n const heading = getChildrenOfType(rowChildren, FeatureComparisonTableRowHeading).at(-1)\n const description = getChildrenOfType(rowChildren, FeatureComparisonTableRowDescription).at(-1)\n const cells = getChildrenOfType(rowChildren, FeatureComparisonTableCell)\n\n useEffect(() => {\n if (process.env.NODE_ENV !== 'production' && cells.length !== items.length) {\n // eslint-disable-next-line no-console\n console.warn(\n `FeatureComparisonTable.Row: expected ${items.length} Cell children to match the number of items, but received ${cells.length}. Missing cells render empty and extra cells are ignored.`,\n )\n }\n }, [cells.length, items.length])\n\n const rowHeading =\n heading && description ? (\n <div className={styles.FeatureComparisonTable__rowHeadingContent}>\n {heading}\n {description}\n </div>\n ) : (\n heading\n )\n\n if (breakpoint === 'wide') {\n return (\n <tr className={clsx(styles.FeatureComparisonTable__row, className)} data-testid={testIds.row}>\n <th className={styles.FeatureComparisonTable__rowHeaderCell} scope=\"row\" data-testid={testIds.rowHeading}>\n {rowHeading}\n </th>\n {items.map((item, index) => (\n <td\n className={clsx(\n styles.FeatureComparisonTable__tableCell,\n hasItemLabel(item) && styles.FeatureComparisonTable__highlightedColumn,\n )}\n key={item.key}\n >\n {cells[index]}\n </td>\n ))}\n </tr>\n )\n }\n\n return (\n <div className={clsx(styles.FeatureComparisonTable__row, className)} data-testid={testIds.row}>\n <div data-testid={testIds.rowHeading}>{rowHeading}</div>\n <dl className={styles.FeatureComparisonTable__planValues}>\n {items.map((item, index) => {\n const itemHeading = getChildrenOfType(\n React.Children.toArray(item.props.children),\n FeatureComparisonTableItemHeading,\n ).at(-1)\n const hasLabel = hasItemLabel(item)\n return (\n <React.Fragment key={item.key}>\n <dt\n className={clsx(\n styles.FeatureComparisonTable__planTerm,\n hasLabel && styles.FeatureComparisonTable__highlightedColumn,\n )}\n >\n <Text as=\"div\" size=\"200\" variant=\"muted\" className={styles.FeatureComparisonTable__planName}>\n {itemHeading ? itemHeading.props.children : index + 1}\n </Text>\n </dt>\n <dd\n className={clsx(\n styles.FeatureComparisonTable__planValue,\n hasLabel && styles.FeatureComparisonTable__highlightedColumn,\n )}\n >\n {cells[index]}\n </dd>\n </React.Fragment>\n )\n })}\n </dl>\n </div>\n )\n}\n"],"mappings":";;;;;;;;;;;;AAaA,IAAa,KAA6B,EAAC,aAAU,mBAA+C;CAClG,IAAM,EAAC,UAAO,kBAAc,EAAgB,GACtC,IAAc,EAAM,SAAS,QAAQ,CAAQ,GAC7C,IAAU,EAAkB,GAAa,CAAgC,CAAC,CAAC,GAAG,EAAE,GAChF,IAAc,EAAkB,GAAa,CAAoC,CAAC,CAAC,GAAG,EAAE,GACxF,IAAQ,EAAkB,GAAa,CAA0B;CAEvE,QAAgB;EACd,AAAA,QAAA,IAAA,aAA6B,gBAAgB,EAAM,WAAW,EAAM,UAElE,QAAQ,KACN,wCAAwC,EAAM,OAAO,4DAA4D,EAAM,OAAO,0DAChI;CAEJ,GAAG,CAAC,EAAM,QAAQ,EAAM,MAAM,CAAC;CAE/B,IAAM,IACJ,KAAW,IACT,kBAAC,OAAD;EAAK,WAAW,EAAO;YAAvB,CACG,GACA,CACE;MAEL;CAwBJ,OArBI,MAAe,SAEf,kBAAC,MAAD;EAAI,WAAW,EAAK,EAAO,6BAA6B,CAAS;EAAG,eAAa,EAAQ;YAAzF,CACE,kBAAC,MAAD;GAAI,WAAW,EAAO;GAAuC,OAAM;GAAM,eAAa,EAAQ;aAC3F;EACC,CAAA,GACH,EAAM,KAAK,GAAM,MAChB,kBAAC,MAAD;GACE,WAAW,EACT,EAAO,mCACP,EAAa,CAAI,KAAK,EAAO,yCAC/B;aAGC,EAAM;EACL,GAHG,EAAK,GAGR,CACL,CACC;MAKN,kBAAC,OAAD;EAAK,WAAW,EAAK,EAAO,6BAA6B,CAAS;EAAG,eAAa,EAAQ;YAA1F,CACE,kBAAC,OAAD;GAAK,eAAa,EAAQ;aAAa;EAAgB,CAAA,GACvD,kBAAC,MAAD;GAAI,WAAW,EAAO;aACnB,EAAM,KAAK,GAAM,MAAU;IAC1B,IAAM,IAAc,EAClB,EAAM,SAAS,QAAQ,EAAK,MAAM,QAAQ,GAC1C,CACF,CAAC,CAAC,GAAG,EAAE,GACD,IAAW,EAAa,CAAI;IAClC,OACE,kBAAC,EAAM,UAAP,EAAA,UAAA,CACE,kBAAC,MAAD;KACE,WAAW,EACT,EAAO,kCACP,KAAY,EAAO,yCACrB;eAEA,kBAAC,GAAD;MAAM,IAAG;MAAM,MAAK;MAAM,SAAQ;MAAQ,WAAW,EAAO;gBACzD,IAAc,EAAY,MAAM,WAAW,IAAQ;KAChD,CAAA;IACJ,CAAA,GACJ,kBAAC,MAAD;KACE,WAAW,EACT,EAAO,mCACP,KAAY,EAAO,yCACrB;eAEC,EAAM;IACL,CAAA,CACU,EAAA,GAnBK,EAAK,GAmBV;GAEpB,CAAC;EACC,CAAA,CACD;;AAET"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
|
|
2
|
-
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/frosted-glass-vfx/colors-with-modes-
|
|
2
|
+
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/frosted-glass-vfx/colors-with-modes-fV7rwA0l.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/frosted-glass-vfx/base-BlFewKzM.css';/* empty css */
|
|
3
3
|
/* empty css */
|
|
4
4
|
import t from "./FrostedGlassVFX.module.js";
|
|
5
5
|
import "react";
|
package/esm/Grid/Grid.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
|
|
2
|
-
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/grid/colors-with-modes-
|
|
2
|
+
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/grid/colors-with-modes-Chf_t26p.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/grid/grid-Cjk6fsH8.css';/* empty css */
|
|
3
3
|
/* empty css */
|
|
4
4
|
import t from "./Grid.module.js";
|
|
5
5
|
import { useId as n } from "../hooks/useId.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.Primer_Brand__Heading-module__Heading___fudyh{--condensed-stretch:75%;color:var(--brand-color-text-default)}.Primer_Brand__Heading-module__Heading--textWrap-balance___XJ9OD{text-wrap:balance}.Primer_Brand__Heading-module__Heading--textWrap-wrap___OlXJ0{text-wrap:wrap}.Primer_Brand__Heading-module__Heading-font--hubot-sans___wXzzm{--condensed-stretch:90%}[data-color-mode=dark] .Primer_Brand__Heading-module__Heading___fudyh{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){[data-color-mode=auto] .Primer_Brand__Heading-module__Heading___fudyh{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}.Primer_Brand__Heading-module__Heading-font--mona-sans___0OM_a{font-family:var(--brand-heading-fontFamily)}.Primer_Brand__Heading-module__Heading-font--hubot-sans___wXzzm{font-family:var(--brand-heading-fontFamilyAlt)}.Primer_Brand__Heading-module__Heading-font--monospace___wf5_H{font-family:var(--brand-fontStack-monospace)}.Primer_Brand__Heading-module__Heading--display___7ug_H{font-weight:var(--brand-heading-weight-1000);font-size:var(--brand-text-size-1000);line-height:var(--brand-text-lineHeight-1000);letter-spacing:var(--brand-text-letterSpacing-1000)}.Primer_Brand__Heading-module__Heading--subhead-large___6D5Jt{font-weight:var(--brand-text-subhead-weight-large);font-size:var(--brand-text-subhead-size-large);line-height:var(--brand-text-subhead-lineHeight-large)}.Primer_Brand__Heading-module__Heading--subhead-medium___tyzEx{font-weight:var(--brand-text-subhead-weight-medium);font-size:var(--brand-text-subhead-size-medium);line-height:var(--brand-text-subhead-lineHeight-medium)}.Primer_Brand__Heading-module__Heading--1___O9POI{font-weight:var(--brand-heading-weight-900);font-size:var(--brand-text-size-900);line-height:var(--brand-text-lineHeight-900);letter-spacing:var(--brand-text-letterSpacing-900)}.Primer_Brand__Heading-module__Heading--2___rbYCp{font-weight:var(--brand-heading-weight-800);font-size:var(--brand-text-size-800);line-height:var(--brand-text-lineHeight-800);letter-spacing:var(--brand-text-letterSpacing-800)}.Primer_Brand__Heading-module__Heading--3___N1nDw{font-weight:var(--brand-heading-weight-700);font-size:var(--brand-text-size-700);line-height:var(--brand-heading-lineHeight-700);letter-spacing:var(--brand-heading-letterSpacing-700)}.Primer_Brand__Heading-module__Heading--4___NVPNk{font-weight:var(--brand-heading-weight-600);font-size:var(--brand-text-size-600);line-height:var(--brand-text-lineHeight-600);letter-spacing:var(--brand-heading-letterSpacing-600)}.Primer_Brand__Heading-module__Heading--5___uyOtp{font-weight:var(--brand-heading-weight-500);font-size:var(--brand-text-size-500);line-height:var(--brand-text-lineHeight-500);letter-spacing:var(--brand-heading-letterSpacing-500)}.Primer_Brand__Heading-module__Heading--6___QHTZH{font-weight:var(--brand-heading-weight-400);font-size:var(--brand-text-size-400);line-height:var(--brand-text-lineHeight-400);letter-spacing:var(--brand-heading-letterSpacing-400)}.Primer_Brand__Heading-module__Heading--weight-heavy___d6IsL,.Primer_Brand__Heading-module__Heading-narrow--weight-heavy___JrPUN{font-weight:var(--base-text-weight-heavy)}.Primer_Brand__Heading-module__Heading--weight-extrabold___lc7cZ,.Primer_Brand__Heading-module__Heading-narrow--weight-extrabold___8Jgdk{font-weight:var(--base-text-weight-extrabold)}.Primer_Brand__Heading-module__Heading--weight-bold___FVf52,.Primer_Brand__Heading-module__Heading-narrow--weight-bold___FhIqs{font-weight:var(--base-text-weight-bold)}.Primer_Brand__Heading-module__Heading--weight-semibold___6RJMO,.Primer_Brand__Heading-module__Heading-narrow--weight-semibold___ZUCHu{font-weight:var(--base-text-weight-semibold)}.Primer_Brand__Heading-module__Heading--weight-medium___KODaH,.Primer_Brand__Heading-module__Heading-narrow--weight-medium___Q1AOC{font-weight:var(--base-text-weight-medium)}.Primer_Brand__Heading-module__Heading--weight-normal___Q9DlN,.Primer_Brand__Heading-module__Heading-narrow--weight-normal___GIVMK{font-weight:var(--base-text-weight-normal)}.Primer_Brand__Heading-module__Heading--weight-light___HSj3B,.Primer_Brand__Heading-module__Heading-narrow--weight-light___h7_q1{font-weight:var(--base-text-weight-light)}.Primer_Brand__Heading-module__Heading--weight-extralight___qAOib,.Primer_Brand__Heading-module__Heading-narrow--weight-extralight___xpfbE{font-weight:var(--base-text-weight-extralight)}@media screen and (width>=48rem){.Primer_Brand__Heading-module__Heading-regular--weight-heavy___truQm{font-weight:var(--base-text-weight-heavy)}.Primer_Brand__Heading-module__Heading-regular--weight-extrabold___sffNn{font-weight:var(--base-text-weight-extrabold)}.Primer_Brand__Heading-module__Heading-regular--weight-bold___RGtcC{font-weight:var(--base-text-weight-bold)}.Primer_Brand__Heading-module__Heading-regular--weight-semibold___8APrY{font-weight:var(--base-text-weight-semibold)}.Primer_Brand__Heading-module__Heading-regular--weight-medium___pBSyI{font-weight:var(--base-text-weight-medium)}.Primer_Brand__Heading-module__Heading-regular--weight-normal___AmGG1{font-weight:var(--base-text-weight-normal)}.Primer_Brand__Heading-module__Heading-regular--weight-light___9rxc0{font-weight:var(--base-text-weight-light)}.Primer_Brand__Heading-module__Heading-regular--weight-extralight___AbeG3{font-weight:var(--base-text-weight-extralight)}}@media screen and (width>=80rem){.Primer_Brand__Heading-module__Heading-wide--weight-heavy___SksCH{font-weight:var(--base-text-weight-heavy)}.Primer_Brand__Heading-module__Heading-wide--weight-extrabold___kN11J{font-weight:var(--base-text-weight-extrabold)}.Primer_Brand__Heading-module__Heading-wide--weight-bold___v_v_q{font-weight:var(--base-text-weight-bold)}.Primer_Brand__Heading-module__Heading-wide--weight-semibold___zeWDb{font-weight:var(--base-text-weight-semibold)}.Primer_Brand__Heading-module__Heading-wide--weight-medium___kJ7_X{font-weight:var(--base-text-weight-medium)}.Primer_Brand__Heading-module__Heading-wide--weight-normal___fLABE{font-weight:var(--base-text-weight-normal)}.Primer_Brand__Heading-module__Heading-wide--weight-light___HL7Zd{font-weight:var(--base-text-weight-light)}}.Primer_Brand__Heading-module__Heading--stretch-condensed___Ez__k,.Primer_Brand__Heading-module__Heading-narrow--stretch-condensed___VL30L{font-stretch:var(--condensed-stretch)}.Primer_Brand__Heading-module__Heading--stretch-normal___dmvAF,.Primer_Brand__Heading-module__Heading-narrow--stretch-normal___7bORI{font-stretch:100%}.Primer_Brand__Heading-module__Heading--stretch-expanded___Nwdhs,.Primer_Brand__Heading-module__Heading-narrow--stretch-expanded___WKHs4{font-stretch:125%}@media screen and (width>=48rem){.Primer_Brand__Heading-module__Heading-regular--stretch-condensed___TDbEr{font-stretch:var(--condensed-stretch)}.Primer_Brand__Heading-module__Heading-regular--stretch-normal___jsox0{font-stretch:100%}.Primer_Brand__Heading-module__Heading-regular--stretch-expanded___NzIf4{font-stretch:125%}}@media screen and (width>=80rem){.Primer_Brand__Heading-module__Heading-narrow--weight-expanded___Vvdsq .Primer_Brand__Heading-module__Heading-wide--stretch-condensed___KlU6K{font-stretch:var(--condensed-stretch)}.Primer_Brand__Heading-module__Heading-wide--stretch-normal___b5uOP{font-stretch:100%}.Primer_Brand__Heading-module__Heading-wide--stretch-expanded___CoaZM{font-stretch:125%}}.Primer_Brand__Heading-module__Heading--letter-spacing-condensed___qMnBL,.Primer_Brand__Heading-module__Heading-narrow--letter-spacing-condensed___X90Sz{letter-spacing:var(--brand-text-letterSpacing-900)}.Primer_Brand__Heading-module__Heading--letter-spacing-normal___2rkj6,.Primer_Brand__Heading-module__Heading-narrow--letter-spacing-normal___hvCpM{letter-spacing:var(--brand-heading-letterSpacing-700)}.Primer_Brand__Heading-module__Heading--letter-spacing-none___VkInH,.Primer_Brand__Heading-module__Heading-narrow--letter-spacing-none___kBJRm{letter-spacing:0}@media screen and (width>=48rem){.Primer_Brand__Heading-module__Heading-regular--letter-spacing-condensed___p6bvA{letter-spacing:var(--brand-text-letterSpacing-900)}.Primer_Brand__Heading-module__Heading-regular--letter-spacing-normal___BG1Fy{letter-spacing:var(--brand-heading-letterSpacing-700)}.Primer_Brand__Heading-module__Heading-regular--letter-spacing-none___xEpD3{letter-spacing:0}}@media screen and (width>=80rem){.Primer_Brand__Heading-module__Heading-narrow--weight-wide___fk4LZ .Primer_Brand__Heading-module__Heading-wide--letter-spacing-condensed___GfFJl{letter-spacing:var(--brand-text-letterSpacing-900)}.Primer_Brand__Heading-module__Heading-wide--letter-spacing-normal___oYnG_{letter-spacing:var(--brand-heading-letterSpacing-700)}.Primer_Brand__Heading-module__Heading-wide--letter-spacing-none___Mtq_D{letter-spacing:0}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './Heading.module-
|
|
1
|
+
import './Heading.module-ChqO_lH5.css';//#region src/Heading/Heading.module.css
|
|
2
2
|
var e = "Primer_Brand__Heading-module__Heading___fudyh", t = {
|
|
3
3
|
Heading: e,
|
|
4
4
|
"Heading--textWrap-balance": "Primer_Brand__Heading-module__Heading--textWrap-balance___XJ9OD",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Heading.module.js","names":[],"sources":["../../src/Heading/Heading.module.css"],"sourcesContent":[".Heading {\n --condensed-stretch: 75%;\n color: var(--brand-color-text-default);\n}\n\n.Heading--textWrap-balance {\n text-wrap: balance;\n}\n\n.Heading--textWrap-wrap {\n text-wrap: wrap;\n}\n\n.Heading-font--hubot-sans {\n --condensed-stretch: 90%;\n}\n\n[data-color-mode='dark'] .Heading {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n.Heading-font--mona-sans {\n font-family: var(--brand-heading-fontFamily);\n}\n\n.Heading-font--hubot-sans {\n font-family: var(--brand-heading-fontFamilyAlt);\n}\n\n.Heading-font--monospace {\n font-family: var(--brand-fontStack-monospace);\n}\n\n.Heading--display {\n font-weight: var(--brand-heading-weight-1000);\n font-size: var(--brand-text-size-1000);\n line-height: var(--brand-text-lineHeight-1000);\n letter-spacing: var(--brand-text-letterSpacing-1000);\n}\n\n.Heading--subhead-large {\n font-weight: var(--brand-text-subhead-weight-large);\n font-size: var(--brand-text-subhead-size-large);\n line-height: var(--brand-text-subhead-lineHeight-large);\n}\n\n.Heading--subhead-medium {\n font-weight: var(--brand-text-subhead-weight-medium);\n font-size: var(--brand-text-subhead-size-medium);\n line-height: var(--brand-text-subhead-lineHeight-medium);\n}\n\n.Heading--1 {\n font-weight: var(--brand-heading-weight-900);\n font-size: var(--brand-text-size-900);\n line-height: var(--brand-text-lineHeight-900);\n letter-spacing: var(--brand-text-letterSpacing-900);\n}\n\n.Heading--2 {\n font-weight: var(--brand-heading-weight-800);\n font-size: var(--brand-text-size-800);\n line-height: var(--brand-text-lineHeight-800);\n letter-spacing: var(--brand-text-letterSpacing-800);\n}\n\n.Heading--3 {\n font-weight: var(--brand-heading-weight-700);\n font-size: var(--brand-text-size-700);\n line-height: var(--brand-heading-lineHeight-700);\n letter-spacing: var(--brand-heading-letterSpacing-700);\n}\n\n.Heading--4 {\n font-weight: var(--brand-heading-weight-600);\n font-size: var(--brand-text-size-600);\n line-height: var(--brand-text-lineHeight-600);\n letter-spacing: var(--brand-heading-letterSpacing-600);\n}\n\n.Heading--5 {\n font-weight: var(--brand-heading-weight-500);\n font-size: var(--brand-text-size-500);\n line-height: var(--brand-text-lineHeight-500);\n letter-spacing: var(--brand-heading-letterSpacing-500);\n}\n\n.Heading--6 {\n font-weight: var(--brand-heading-weight-400);\n font-size: var(--brand-text-size-400);\n line-height: var(--brand-text-lineHeight-400);\n letter-spacing: var(--brand-heading-letterSpacing-400);\n}\n\n.Heading--weight-heavy,\n.Heading-narrow--weight-heavy {\n font-weight: var(--base-text-weight-heavy);\n}\n\n.Heading--weight-extrabold,\n.Heading-narrow--weight-extrabold {\n font-weight: var(--base-text-weight-extrabold);\n}\n\n.Heading--weight-bold,\n.Heading-narrow--weight-bold {\n font-weight: var(--base-text-weight-bold);\n}\n\n.Heading--weight-semibold,\n.Heading-narrow--weight-semibold {\n font-weight: var(--base-text-weight-semibold);\n}\n\n.Heading--weight-medium,\n.Heading-narrow--weight-medium {\n font-weight: var(--base-text-weight-medium);\n}\n\n.Heading--weight-normal,\n.Heading-narrow--weight-normal {\n font-weight: var(--base-text-weight-normal);\n}\n\n.Heading--weight-light,\n.Heading-narrow--weight-light {\n font-weight: var(--base-text-weight-light);\n}\n\n.Heading--weight-extralight,\n.Heading-narrow--weight-extralight {\n font-weight: var(--base-text-weight-extralight);\n}\n\n@media screen and (min-width: 48rem) {\n .Heading-regular--weight-heavy {\n font-weight: var(--base-text-weight-heavy);\n }\n\n .Heading-regular--weight-extrabold {\n font-weight: var(--base-text-weight-extrabold);\n }\n\n .Heading-regular--weight-bold {\n font-weight: var(--base-text-weight-bold);\n }\n\n .Heading-regular--weight-semibold {\n font-weight: var(--base-text-weight-semibold);\n }\n\n .Heading-regular--weight-medium {\n font-weight: var(--base-text-weight-medium);\n }\n\n .Heading-regular--weight-normal {\n font-weight: var(--base-text-weight-normal);\n }\n\n .Heading-regular--weight-light {\n font-weight: var(--base-text-weight-light);\n }\n\n .Heading-regular--weight-extralight {\n font-weight: var(--base-text-weight-extralight);\n }\n}\n\n@media screen and (min-width: 80rem) {\n .Heading-wide--weight-heavy {\n font-weight: var(--base-text-weight-heavy);\n }\n\n .Heading-wide--weight-extrabold {\n font-weight: var(--base-text-weight-extrabold);\n }\n\n .Heading-wide--weight-bold {\n font-weight: var(--base-text-weight-bold);\n }\n\n .Heading-wide--weight-semibold {\n font-weight: var(--base-text-weight-semibold);\n }\n\n .Heading-wide--weight-medium {\n font-weight: var(--base-text-weight-medium);\n }\n\n .Heading-wide--weight-normal {\n font-weight: var(--base-text-weight-normal);\n }\n\n .Heading-wide--weight-light {\n font-weight: var(--base-text-weight-light);\n }\n}\n\n/**\n * Heading widths\n */\n\n.Heading--stretch-condensed,\n.Heading-narrow--stretch-condensed {\n font-stretch: var(--condensed-stretch);\n}\n\n.Heading--stretch-normal,\n.Heading-narrow--stretch-normal {\n font-stretch: 100%;\n}\n\n.Heading--stretch-expanded,\n.Heading-narrow--stretch-expanded {\n font-stretch: 125%;\n}\n\n@media screen and (min-width: 48rem) {\n .Heading-regular--stretch-condensed {\n font-stretch: var(--condensed-stretch);\n }\n\n .Heading-regular--stretch-normal {\n font-stretch: 100%;\n }\n\n .Heading-regular--stretch-expanded {\n font-stretch: 125%;\n }\n}\n\n@media screen and (min-width: 80rem) {\n .Heading-narrow--weight-expanded .Heading-wide--stretch-condensed {\n font-stretch: var(--condensed-stretch);\n }\n\n .Heading-wide--stretch-normal {\n font-stretch: 100%;\n }\n\n .Heading-wide--stretch-expanded {\n font-stretch: 125%;\n }\n}\n\n/**\n * Heading letter spacing\n */\n\n.Heading--letter-spacing-condensed,\n.Heading-narrow--letter-spacing-condensed {\n letter-spacing: var(--brand-text-letterSpacing-900);\n}\n\n.Heading--letter-spacing-normal,\n.Heading-narrow--letter-spacing-normal {\n letter-spacing: var(--brand-heading-letterSpacing-700);\n}\n\n.Heading--letter-spacing-none,\n.Heading-narrow--letter-spacing-none {\n letter-spacing: 0;\n}\n\n@media screen and (min-width: 48rem) {\n .Heading-regular--letter-spacing-condensed {\n letter-spacing: var(--brand-text-letterSpacing-900);\n }\n\n .Heading-regular--letter-spacing-normal {\n letter-spacing: var(--brand-heading-letterSpacing-700);\n }\n\n .Heading-regular--letter-spacing-none {\n letter-spacing: 0;\n }\n}\n\n@media screen and (min-width: 80rem) {\n .Heading-narrow--weight-wide .Heading-wide--letter-spacing-condensed {\n letter-spacing: var(--brand-text-letterSpacing-900);\n }\n\n .Heading-wide--letter-spacing-normal {\n letter-spacing: var(--brand-heading-letterSpacing-700);\n }\n\n .Heading-wide--letter-spacing-none {\n letter-spacing: 0;\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"Heading.module.js","names":[],"sources":["../../src/Heading/Heading.module.css"],"sourcesContent":[".Heading {\n --condensed-stretch: 75%;\n color: var(--brand-color-text-default);\n}\n\n.Heading--textWrap-balance {\n text-wrap: balance;\n}\n\n.Heading--textWrap-wrap {\n text-wrap: wrap;\n}\n\n.Heading-font--hubot-sans {\n --condensed-stretch: 90%;\n}\n\n[data-color-mode='dark'] .Heading {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n@media (prefers-color-scheme: dark) {\n [data-color-mode='auto'] .Heading {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n}\n\n.Heading-font--mona-sans {\n font-family: var(--brand-heading-fontFamily);\n}\n\n.Heading-font--hubot-sans {\n font-family: var(--brand-heading-fontFamilyAlt);\n}\n\n.Heading-font--monospace {\n font-family: var(--brand-fontStack-monospace);\n}\n\n.Heading--display {\n font-weight: var(--brand-heading-weight-1000);\n font-size: var(--brand-text-size-1000);\n line-height: var(--brand-text-lineHeight-1000);\n letter-spacing: var(--brand-text-letterSpacing-1000);\n}\n\n.Heading--subhead-large {\n font-weight: var(--brand-text-subhead-weight-large);\n font-size: var(--brand-text-subhead-size-large);\n line-height: var(--brand-text-subhead-lineHeight-large);\n}\n\n.Heading--subhead-medium {\n font-weight: var(--brand-text-subhead-weight-medium);\n font-size: var(--brand-text-subhead-size-medium);\n line-height: var(--brand-text-subhead-lineHeight-medium);\n}\n\n.Heading--1 {\n font-weight: var(--brand-heading-weight-900);\n font-size: var(--brand-text-size-900);\n line-height: var(--brand-text-lineHeight-900);\n letter-spacing: var(--brand-text-letterSpacing-900);\n}\n\n.Heading--2 {\n font-weight: var(--brand-heading-weight-800);\n font-size: var(--brand-text-size-800);\n line-height: var(--brand-text-lineHeight-800);\n letter-spacing: var(--brand-text-letterSpacing-800);\n}\n\n.Heading--3 {\n font-weight: var(--brand-heading-weight-700);\n font-size: var(--brand-text-size-700);\n line-height: var(--brand-heading-lineHeight-700);\n letter-spacing: var(--brand-heading-letterSpacing-700);\n}\n\n.Heading--4 {\n font-weight: var(--brand-heading-weight-600);\n font-size: var(--brand-text-size-600);\n line-height: var(--brand-text-lineHeight-600);\n letter-spacing: var(--brand-heading-letterSpacing-600);\n}\n\n.Heading--5 {\n font-weight: var(--brand-heading-weight-500);\n font-size: var(--brand-text-size-500);\n line-height: var(--brand-text-lineHeight-500);\n letter-spacing: var(--brand-heading-letterSpacing-500);\n}\n\n.Heading--6 {\n font-weight: var(--brand-heading-weight-400);\n font-size: var(--brand-text-size-400);\n line-height: var(--brand-text-lineHeight-400);\n letter-spacing: var(--brand-heading-letterSpacing-400);\n}\n\n.Heading--weight-heavy,\n.Heading-narrow--weight-heavy {\n font-weight: var(--base-text-weight-heavy);\n}\n\n.Heading--weight-extrabold,\n.Heading-narrow--weight-extrabold {\n font-weight: var(--base-text-weight-extrabold);\n}\n\n.Heading--weight-bold,\n.Heading-narrow--weight-bold {\n font-weight: var(--base-text-weight-bold);\n}\n\n.Heading--weight-semibold,\n.Heading-narrow--weight-semibold {\n font-weight: var(--base-text-weight-semibold);\n}\n\n.Heading--weight-medium,\n.Heading-narrow--weight-medium {\n font-weight: var(--base-text-weight-medium);\n}\n\n.Heading--weight-normal,\n.Heading-narrow--weight-normal {\n font-weight: var(--base-text-weight-normal);\n}\n\n.Heading--weight-light,\n.Heading-narrow--weight-light {\n font-weight: var(--base-text-weight-light);\n}\n\n.Heading--weight-extralight,\n.Heading-narrow--weight-extralight {\n font-weight: var(--base-text-weight-extralight);\n}\n\n@media screen and (min-width: 48rem) {\n .Heading-regular--weight-heavy {\n font-weight: var(--base-text-weight-heavy);\n }\n\n .Heading-regular--weight-extrabold {\n font-weight: var(--base-text-weight-extrabold);\n }\n\n .Heading-regular--weight-bold {\n font-weight: var(--base-text-weight-bold);\n }\n\n .Heading-regular--weight-semibold {\n font-weight: var(--base-text-weight-semibold);\n }\n\n .Heading-regular--weight-medium {\n font-weight: var(--base-text-weight-medium);\n }\n\n .Heading-regular--weight-normal {\n font-weight: var(--base-text-weight-normal);\n }\n\n .Heading-regular--weight-light {\n font-weight: var(--base-text-weight-light);\n }\n\n .Heading-regular--weight-extralight {\n font-weight: var(--base-text-weight-extralight);\n }\n}\n\n@media screen and (min-width: 80rem) {\n .Heading-wide--weight-heavy {\n font-weight: var(--base-text-weight-heavy);\n }\n\n .Heading-wide--weight-extrabold {\n font-weight: var(--base-text-weight-extrabold);\n }\n\n .Heading-wide--weight-bold {\n font-weight: var(--base-text-weight-bold);\n }\n\n .Heading-wide--weight-semibold {\n font-weight: var(--base-text-weight-semibold);\n }\n\n .Heading-wide--weight-medium {\n font-weight: var(--base-text-weight-medium);\n }\n\n .Heading-wide--weight-normal {\n font-weight: var(--base-text-weight-normal);\n }\n\n .Heading-wide--weight-light {\n font-weight: var(--base-text-weight-light);\n }\n}\n\n/**\n * Heading widths\n */\n\n.Heading--stretch-condensed,\n.Heading-narrow--stretch-condensed {\n font-stretch: var(--condensed-stretch);\n}\n\n.Heading--stretch-normal,\n.Heading-narrow--stretch-normal {\n font-stretch: 100%;\n}\n\n.Heading--stretch-expanded,\n.Heading-narrow--stretch-expanded {\n font-stretch: 125%;\n}\n\n@media screen and (min-width: 48rem) {\n .Heading-regular--stretch-condensed {\n font-stretch: var(--condensed-stretch);\n }\n\n .Heading-regular--stretch-normal {\n font-stretch: 100%;\n }\n\n .Heading-regular--stretch-expanded {\n font-stretch: 125%;\n }\n}\n\n@media screen and (min-width: 80rem) {\n .Heading-narrow--weight-expanded .Heading-wide--stretch-condensed {\n font-stretch: var(--condensed-stretch);\n }\n\n .Heading-wide--stretch-normal {\n font-stretch: 100%;\n }\n\n .Heading-wide--stretch-expanded {\n font-stretch: 125%;\n }\n}\n\n/**\n * Heading letter spacing\n */\n\n.Heading--letter-spacing-condensed,\n.Heading-narrow--letter-spacing-condensed {\n letter-spacing: var(--brand-text-letterSpacing-900);\n}\n\n.Heading--letter-spacing-normal,\n.Heading-narrow--letter-spacing-normal {\n letter-spacing: var(--brand-heading-letterSpacing-700);\n}\n\n.Heading--letter-spacing-none,\n.Heading-narrow--letter-spacing-none {\n letter-spacing: 0;\n}\n\n@media screen and (min-width: 48rem) {\n .Heading-regular--letter-spacing-condensed {\n letter-spacing: var(--brand-text-letterSpacing-900);\n }\n\n .Heading-regular--letter-spacing-normal {\n letter-spacing: var(--brand-heading-letterSpacing-700);\n }\n\n .Heading-regular--letter-spacing-none {\n letter-spacing: 0;\n }\n}\n\n@media screen and (min-width: 80rem) {\n .Heading-narrow--weight-wide .Heading-wide--letter-spacing-condensed {\n letter-spacing: var(--brand-text-letterSpacing-900);\n }\n\n .Heading-wide--letter-spacing-normal {\n letter-spacing: var(--brand-heading-letterSpacing-700);\n }\n\n .Heading-wide--letter-spacing-none {\n letter-spacing: 0;\n }\n}\n"],"mappings":""}
|
package/esm/Hero/Hero.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Hero.d.ts","sourceRoot":"","sources":["../../src/Hero/Hero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAA;AAK7E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAInD,OAAO,KAAK,EAA0B,SAAS,EAAE,WAAW,EAAC,MAAM,eAAe,CAAA;AAclF;;GAEG;AACH,OAAO,2FAA2F,CAAA;AAkBlG,MAAM,MAAM,SAAS,GAAG,SAAS,CAAC,WAAW,CAAC,GAAG;IAC/C,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,uBAAuB,CAAC,EAAE,MAAM,CAAA;IAChC,mBAAmB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IACzC,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC1D,oBAAoB,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC3C,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IAC3C,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;
|
|
1
|
+
{"version":3,"file":"Hero.d.ts","sourceRoot":"","sources":["../../src/Hero/Hero.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAA;AAK7E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAInD,OAAO,KAAK,EAA0B,SAAS,EAAE,WAAW,EAAC,MAAM,eAAe,CAAA;AAclF;;GAEG;AACH,OAAO,2FAA2F,CAAA;AAkBlG,MAAM,MAAM,SAAS,GAAG,SAAS,CAAC,WAAW,CAAC,GAAG;IAC/C,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,uBAAuB,CAAC,EAAE,MAAM,CAAA;IAChC,mBAAmB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IACzC,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC1D,oBAAoB,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;IAC3C,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IAC3C,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAiTD,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIf;;;OAGG;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOH,CAAA"}
|
package/esm/Hero/Hero.js
CHANGED
|
@@ -29,7 +29,8 @@ var S = {
|
|
|
29
29
|
get imageWrapper() {
|
|
30
30
|
return `${this.root}-imageWrapper`;
|
|
31
31
|
}
|
|
32
|
-
}
|
|
32
|
+
};
|
|
33
|
+
function C({ className: _, align: C = "start", children: w, imageContainerClassName: T, imageContainerStyle: E, imageContainerRef: D, imageBackgroundColor: O, variant: k = "default", trailingComponent: A, enableAnimation: j = !1, "data-testid": ne, ...M }, N) {
|
|
33
34
|
let { HeroActions: P, HeroButtonGroupChild: re, HeroChildren: ie, HeroImageChild: F, HeroVideoChild: I, HeroHeaderChildren: L, HeroDescriptionChild: R } = v(() => {
|
|
34
35
|
let e = g.Children.toArray(w).reduce((e, t) => (g.isValidElement(t) && (t.type === m || t.type === h ? e.HeroActions.push(t) : t.type === u ? e.HeroButtonGroupChild = t : t.type === d ? e.HeroImageChild = t : t.type === f ? e.HeroVideoChild = t : (e.HeroChildren.push(t), t.type === s || t.type === p || t.type === c ? e.HeroHeaderChildren.push(t) : t.type === l && (e.HeroDescriptionChild = t))), e), {
|
|
35
36
|
HeroActions: [],
|
|
@@ -163,7 +164,8 @@ var S = {
|
|
|
163
164
|
})
|
|
164
165
|
})
|
|
165
166
|
});
|
|
166
|
-
}
|
|
167
|
+
}
|
|
168
|
+
var w = _(C), T = Object.assign(w, {
|
|
167
169
|
Heading: c,
|
|
168
170
|
Description: l,
|
|
169
171
|
ButtonGroup: u,
|
|
@@ -176,6 +178,6 @@ var S = {
|
|
|
176
178
|
testIds: S
|
|
177
179
|
});
|
|
178
180
|
//#endregion
|
|
179
|
-
export {
|
|
181
|
+
export { T as Hero };
|
|
180
182
|
|
|
181
183
|
//# sourceMappingURL=Hero.js.map
|
package/esm/Hero/Hero.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Hero.js","names":[],"sources":["../../src/Hero/Hero.tsx"],"sourcesContent":["import React, {forwardRef, Fragment, PropsWithChildren, useMemo} from 'react'\nimport {clsx} from 'clsx'\nimport {Grid} from '../Grid'\nimport {Stack} from '../Stack'\nimport {Box} from '../Box'\nimport type {BaseProps} from '../component-helpers'\nimport {AnimationProvider} from '../animation'\n\nimport {HeroContext, HeroMediaInlinePositionOptions} from './HeroContext'\nimport type {HeroMediaInlinePosition, HeroAlign, HeroVariant} from './HeroContext'\nimport {\n HeroLabel,\n HeroHeading,\n HeroDescription,\n HeroButtonGroup,\n HeroImage,\n HeroVideo,\n HeroEyebrow,\n HeroPrimaryAction,\n HeroSecondaryAction,\n} from './sub-components'\nimport type {HeroImageProps, HeroVideoProps} from './sub-components'\n\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/hero/base.css'\n\n/** * Main Stylesheet (as a CSS Module) */\nimport styles from './Hero.module.css'\n\nconst testIds = {\n root: 'Hero',\n get video() {\n return `${this.root}-video`\n },\n get grid() {\n return `${this.root}-grid`\n },\n get imageWrapper() {\n return `${this.root}-imageWrapper`\n },\n}\n\nexport type HeroProps = BaseProps<HTMLElement> & {\n align?: HeroAlign\n imageContainerClassName?: string\n imageContainerStyle?: React.CSSProperties\n imageContainerRef?: React.RefObject<HTMLDivElement | null>\n imageBackgroundColor?: 'default' | 'subtle'\n variant?: HeroVariant\n enableAnimation?: boolean\n /**\n * Escape-hatch for inserting custom React components.\n * Warning:\n * This prop isn't advertised in our docs but remains part of the public API for edge-cases.\n * Need to use this prop? Please check in with #primer-brand first to confirm correct usage.\n */\n trailingComponent?: React.FunctionComponent\n 'data-testid'?: string\n}\n\nconst Root = forwardRef<HTMLElement, PropsWithChildren<HeroProps>>(\n (\n {\n className,\n align: alignProp = 'start',\n children,\n imageContainerClassName,\n imageContainerStyle,\n imageContainerRef,\n imageBackgroundColor,\n variant = 'default',\n trailingComponent: TrailingComponent,\n enableAnimation = false,\n 'data-testid': testId,\n ...rest\n },\n ref,\n ) => {\n const {\n HeroActions,\n HeroButtonGroupChild,\n HeroChildren,\n HeroImageChild,\n HeroVideoChild,\n HeroHeaderChildren,\n HeroDescriptionChild,\n } = useMemo(() => {\n const result = React.Children.toArray(children).reduce<{\n HeroActions: React.ReactElement[]\n HeroButtonGroupChild?: React.ReactElement\n HeroImageChild?: React.ReactElement<HeroImageProps>\n HeroVideoChild?: React.ReactElement<HeroVideoProps>\n HeroChildren: React.ReactElement[]\n HeroHeaderChildren: React.ReactElement[]\n HeroDescriptionChild?: React.ReactElement\n }>(\n (acc, child) => {\n if (React.isValidElement(child)) {\n if (child.type === HeroPrimaryAction || child.type === HeroSecondaryAction) {\n acc.HeroActions.push(child)\n } else if (child.type === HeroButtonGroup) {\n acc.HeroButtonGroupChild = child\n } else if (child.type === HeroImage) {\n acc.HeroImageChild = child as React.ReactElement<HeroImageProps>\n } else if (child.type === HeroVideo) {\n acc.HeroVideoChild = child as React.ReactElement<HeroVideoProps>\n } else {\n acc.HeroChildren.push(child)\n if (child.type === HeroLabel || child.type === HeroEyebrow || child.type === HeroHeading) {\n acc.HeroHeaderChildren.push(child)\n } else if (child.type === HeroDescription) {\n acc.HeroDescriptionChild = child\n }\n }\n }\n return acc\n },\n {\n HeroActions: [],\n HeroButtonGroupChild: undefined,\n HeroChildren: [],\n HeroImageChild: undefined,\n HeroVideoChild: undefined,\n HeroHeaderChildren: [],\n HeroDescriptionChild: undefined,\n },\n )\n\n // Prefer Hero.Image - don't show both\n if (result.HeroImageChild && result.HeroVideoChild) {\n result.HeroVideoChild = undefined\n }\n\n return result\n }, [children])\n\n const mediaPositionProp = HeroImageChild?.props.position || HeroVideoChild?.props.position\n\n const mediaPosition = (() => {\n if (variant === 'gridline-expressive' && mediaPositionProp?.startsWith('inline-')) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.warn(\n `Hero: \"gridline-expressive\" variant does not support \"${mediaPositionProp}\" position. Defaulting to \"block-end\".`,\n )\n }\n return 'block-end'\n }\n return mediaPositionProp || 'block-end'\n })()\n const mediaWrapperHasBorder = HeroImageChild?.props.enableBorder ?? HeroVideoChild?.props.enableBorder ?? true\n const mediaPadding = HeroImageChild?.props.padding ?? HeroVideoChild?.props.padding ?? 'default'\n const hasInlineMedia = HeroMediaInlinePositionOptions.includes(mediaPosition as HeroMediaInlinePosition)\n const mediaChild = HeroImageChild || HeroVideoChild\n const isGridline = variant === 'gridline'\n const isGridlineExpressive = variant === 'gridline-expressive'\n const isBlockEndPosition = mediaPosition === 'block-end'\n\n if (\n variant === 'default' &&\n mediaPadding !== 'default' &&\n (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test')\n ) {\n // eslint-disable-next-line no-console\n console.warn(\n `Hero: media padding is only supported by the \"gridline\" and \"gridline-expressive\" variants; ignoring padding=\"${mediaPadding}\".`,\n )\n }\n\n const isInvalidGridlineAlignment = isGridlineExpressive && alignProp === 'center'\n const align: HeroAlign = isInvalidGridlineAlignment ? 'start' : alignProp\n\n if (isInvalidGridlineAlignment && (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test')) {\n // eslint-disable-next-line no-console\n console.warn('Hero: the \"gridline-expressive\" variant does not support align=\"center\"; using \"start\" instead.')\n }\n\n const Tag = (isGridline || isGridlineExpressive) && enableAnimation ? AnimationProvider : Fragment\n const tagProps =\n (isGridline || isGridlineExpressive) && enableAnimation\n ? {\n autoStaggerChildren: false,\n animationTrigger: 'immediate' as const,\n }\n : {}\n\n const useContainedLayout = (isGridline || isGridlineExpressive) && isBlockEndPosition\n const useInlineGridline = isGridline && hasInlineMedia\n\n const heroLayoutClass = HeroImageChild ? styles['Hero--layout-image'] : styles['Hero--layout-default']\n const isInlineStart = mediaPosition === 'inline-start'\n\n const renderTrailingComponent = (shouldAnimate: boolean) =>\n TrailingComponent && (\n <Box animate={shouldAnimate ? {variant: 'slide-in-up' as const, delay: 1000, duration: 1000} : undefined}>\n <div className={styles['Hero-trailing']}>\n <TrailingComponent />\n </div>\n </Box>\n )\n\n const renderActions = () => (\n <>\n {HeroButtonGroupChild}\n {HeroActions.length > 0 && <div className={styles['Hero-actions']}>{HeroActions}</div>}\n </>\n )\n\n return (\n <Tag {...tagProps}>\n <HeroContext.Provider value={{imagePosition: mediaPosition, variant, align, hasInlineMedia, enableAnimation}}>\n <section\n className={clsx(\n styles.Hero,\n styles[`Hero--variant-${variant}`],\n !hasInlineMedia && styles[`Hero--align-${align}`],\n heroLayoutClass,\n (HeroImageChild || HeroVideoChild) && styles[`Hero--image-pos-${mediaPosition}`],\n (HeroImageChild || HeroVideoChild) && hasInlineMedia && styles['Hero--image-pos-inline'],\n useInlineGridline && styles['Hero--variant-inline-gridline'],\n className,\n )}\n ref={ref}\n aria-labelledby=\"hero-section-brand-heading\"\n data-testid={testId || testIds.root}\n {...rest}\n >\n <Grid\n fullWidth={!useContainedLayout && !useInlineGridline}\n data-testid={testIds.grid}\n className={clsx(\n styles['Hero-grid'],\n styles[`Hero-grid--${mediaPosition}`],\n useContainedLayout && !isGridlineExpressive && styles['Hero-grid--contained'],\n useInlineGridline && styles['Hero-grid--bordered-inline'],\n isGridlineExpressive && styles['Hero-grid--expressive'],\n )}\n >\n {isGridlineExpressive ? (\n <>\n {/* Expressive variant: header column (left) */}\n <Grid.Column\n span={{medium: 12, large: HeroDescriptionChild ? 7 : 6}}\n className={styles['Hero-expressive-header-column']}\n >\n <Stack direction=\"vertical\" gap=\"none\" padding=\"none\" alignItems=\"flex-start\">\n {HeroHeaderChildren}\n </Stack>\n </Grid.Column>\n {/* Expressive variant: body column (right) */}\n <Grid.Column\n span={{medium: 12, large: HeroDescriptionChild ? 5 : 6}}\n className={styles['Hero-expressive-body-column']}\n >\n <Stack direction=\"vertical\" gap=\"none\" padding=\"none\" alignItems=\"flex-start\">\n {HeroDescriptionChild}\n {renderActions()}\n {renderTrailingComponent(enableAnimation)}\n </Stack>\n </Grid.Column>\n </>\n ) : (\n <>\n {/* Standard GridLine variant: text column */}\n {isInlineStart && mediaChild && !useContainedLayout && (\n <Grid.Column\n ref={imageContainerRef}\n span={{large: 6}}\n className={clsx(\n imageBackgroundColor &&\n mediaPadding !== 'none' &&\n styles[`Hero-imageContainer--bg-${imageBackgroundColor}`],\n useInlineGridline &&\n mediaPadding === 'all' &&\n styles['Hero-imageContainer--inline-padding-all'],\n useInlineGridline &&\n mediaPadding === 'none' &&\n styles['Hero-imageContainer--inline-padding-none'],\n useInlineGridline && styles['Hero-imageContainer--inline-bordered'],\n )}\n >\n <div\n className={clsx(styles['Hero-mediaContainer'], imageContainerClassName)}\n style={imageContainerStyle}\n >\n {mediaChild}\n </div>\n </Grid.Column>\n )}\n <Grid.Column span={{large: mediaChild && hasInlineMedia ? 6 : 12}}>\n <Stack\n className={clsx(\n useInlineGridline && styles['Hero-text-column--inline-gridline'],\n useInlineGridline && styles['Hero-contentColumn--bordered-inline'],\n )}\n direction=\"vertical\"\n gap=\"none\"\n padding=\"none\"\n alignItems={hasInlineMedia ? 'flex-start' : align === 'start' ? 'flex-start' : 'center'}\n justifyContent={hasInlineMedia ? undefined : align === 'start' ? 'flex-start' : 'center'}\n >\n {HeroChildren}\n {renderActions()}\n {renderTrailingComponent(isGridline && enableAnimation)}\n </Stack>\n </Grid.Column>\n {!isInlineStart && mediaChild && !useContainedLayout && (\n <Grid.Column\n ref={imageContainerRef}\n span={{large: hasInlineMedia ? 6 : 12}}\n className={clsx(\n imageBackgroundColor &&\n mediaPadding !== 'none' &&\n styles[`Hero-imageContainer--bg-${imageBackgroundColor}`],\n useInlineGridline &&\n mediaPadding === 'all' &&\n styles['Hero-imageContainer--inline-padding-all'],\n useInlineGridline &&\n mediaPadding === 'none' &&\n styles['Hero-imageContainer--inline-padding-none'],\n useInlineGridline && styles['Hero-imageContainer--inline-bordered'],\n )}\n >\n <div\n className={clsx(styles['Hero-mediaContainer'], imageContainerClassName)}\n style={imageContainerStyle}\n >\n {mediaChild}\n </div>\n </Grid.Column>\n )}\n </>\n )}\n </Grid>\n {mediaChild && useContainedLayout && (\n <div\n ref={imageContainerRef}\n data-testid={testIds.imageWrapper}\n className={clsx(\n styles['Hero-imageWrapper'],\n imageContainerClassName,\n imageBackgroundColor &&\n mediaPadding !== 'none' &&\n styles[`Hero-imageWrapper--bg-${imageBackgroundColor}`],\n mediaPadding === 'none' && styles['Hero-imageWrapper--padding-none'],\n )}\n style={imageContainerStyle}\n >\n <div\n className={clsx(\n styles['Hero-imageWrapper-inner'],\n mediaPadding === 'all' && styles['Hero-imageWrapper-inner--padding-all'],\n mediaPadding === 'none' && styles['Hero-imageWrapper-inner--padding-none'],\n mediaWrapperHasBorder && styles['Hero-imageWrapper-inner--with-gridline'],\n )}\n >\n {mediaChild}\n </div>\n </div>\n )}\n </section>\n </HeroContext.Provider>\n </Tag>\n )\n },\n)\n\nexport const Hero = Object.assign(Root, {\n Heading: HeroHeading,\n Description: HeroDescription,\n ButtonGroup: HeroButtonGroup,\n /**\n * @deprecated Use `Hero.ButtonGroup` with `Button` or `ActionMenu` children instead.\n * This component will be removed in a future release.\n */\n PrimaryAction: HeroPrimaryAction,\n /**\n * @deprecated Use `Hero.ButtonGroup` with `Button` or `ActionMenu` children instead.\n * This component will be removed in a future release.\n */\n SecondaryAction: HeroSecondaryAction,\n Image: HeroImage,\n Video: HeroVideo,\n Label: HeroLabel,\n Eyebrow: HeroEyebrow,\n testIds,\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Hero.js","names":[],"sources":["../../src/Hero/Hero.tsx"],"sourcesContent":["import React, {forwardRef, Fragment, PropsWithChildren, useMemo} from 'react'\nimport {clsx} from 'clsx'\nimport {Grid} from '../Grid'\nimport {Stack} from '../Stack'\nimport {Box} from '../Box'\nimport type {BaseProps} from '../component-helpers'\nimport {AnimationProvider} from '../animation'\n\nimport {HeroContext, HeroMediaInlinePositionOptions} from './HeroContext'\nimport type {HeroMediaInlinePosition, HeroAlign, HeroVariant} from './HeroContext'\nimport {\n HeroLabel,\n HeroHeading,\n HeroDescription,\n HeroButtonGroup,\n HeroImage,\n HeroVideo,\n HeroEyebrow,\n HeroPrimaryAction,\n HeroSecondaryAction,\n} from './sub-components'\nimport type {HeroImageProps, HeroVideoProps} from './sub-components'\n\n/**\n * Design tokens\n */\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/hero/base.css'\n\n/** * Main Stylesheet (as a CSS Module) */\nimport styles from './Hero.module.css'\n\nconst testIds = {\n root: 'Hero',\n get video() {\n return `${this.root}-video`\n },\n get grid() {\n return `${this.root}-grid`\n },\n get imageWrapper() {\n return `${this.root}-imageWrapper`\n },\n}\n\nexport type HeroProps = BaseProps<HTMLElement> & {\n align?: HeroAlign\n imageContainerClassName?: string\n imageContainerStyle?: React.CSSProperties\n imageContainerRef?: React.RefObject<HTMLDivElement | null>\n imageBackgroundColor?: 'default' | 'subtle'\n variant?: HeroVariant\n enableAnimation?: boolean\n /**\n * Escape-hatch for inserting custom React components.\n * Warning:\n * This prop isn't advertised in our docs but remains part of the public API for edge-cases.\n * Need to use this prop? Please check in with #primer-brand first to confirm correct usage.\n */\n trailingComponent?: React.FunctionComponent\n 'data-testid'?: string\n}\n\nfunction HeroBase(\n {\n className,\n align: alignProp = 'start',\n children,\n imageContainerClassName,\n imageContainerStyle,\n imageContainerRef,\n imageBackgroundColor,\n variant = 'default',\n trailingComponent: TrailingComponent,\n enableAnimation = false,\n 'data-testid': testId,\n ...rest\n }: PropsWithChildren<HeroProps>,\n ref: React.ForwardedRef<HTMLElement>,\n) {\n const {\n HeroActions,\n HeroButtonGroupChild,\n HeroChildren,\n HeroImageChild,\n HeroVideoChild,\n HeroHeaderChildren,\n HeroDescriptionChild,\n } = useMemo(() => {\n const result = React.Children.toArray(children).reduce<{\n HeroActions: React.ReactElement[]\n HeroButtonGroupChild?: React.ReactElement\n HeroImageChild?: React.ReactElement<HeroImageProps>\n HeroVideoChild?: React.ReactElement<HeroVideoProps>\n HeroChildren: React.ReactElement[]\n HeroHeaderChildren: React.ReactElement[]\n HeroDescriptionChild?: React.ReactElement\n }>(\n (acc, child) => {\n if (React.isValidElement(child)) {\n if (child.type === HeroPrimaryAction || child.type === HeroSecondaryAction) {\n acc.HeroActions.push(child)\n } else if (child.type === HeroButtonGroup) {\n acc.HeroButtonGroupChild = child\n } else if (child.type === HeroImage) {\n acc.HeroImageChild = child as React.ReactElement<HeroImageProps>\n } else if (child.type === HeroVideo) {\n acc.HeroVideoChild = child as React.ReactElement<HeroVideoProps>\n } else {\n acc.HeroChildren.push(child)\n if (child.type === HeroLabel || child.type === HeroEyebrow || child.type === HeroHeading) {\n acc.HeroHeaderChildren.push(child)\n } else if (child.type === HeroDescription) {\n acc.HeroDescriptionChild = child\n }\n }\n }\n return acc\n },\n {\n HeroActions: [],\n HeroButtonGroupChild: undefined,\n HeroChildren: [],\n HeroImageChild: undefined,\n HeroVideoChild: undefined,\n HeroHeaderChildren: [],\n HeroDescriptionChild: undefined,\n },\n )\n\n // Prefer Hero.Image - don't show both\n if (result.HeroImageChild && result.HeroVideoChild) {\n result.HeroVideoChild = undefined\n }\n\n return result\n }, [children])\n\n const mediaPositionProp = HeroImageChild?.props.position || HeroVideoChild?.props.position\n\n const mediaPosition = (() => {\n if (variant === 'gridline-expressive' && mediaPositionProp?.startsWith('inline-')) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.warn(\n `Hero: \"gridline-expressive\" variant does not support \"${mediaPositionProp}\" position. Defaulting to \"block-end\".`,\n )\n }\n return 'block-end'\n }\n return mediaPositionProp || 'block-end'\n })()\n const mediaWrapperHasBorder = HeroImageChild?.props.enableBorder ?? HeroVideoChild?.props.enableBorder ?? true\n const mediaPadding = HeroImageChild?.props.padding ?? HeroVideoChild?.props.padding ?? 'default'\n const hasInlineMedia = HeroMediaInlinePositionOptions.includes(mediaPosition as HeroMediaInlinePosition)\n const mediaChild = HeroImageChild || HeroVideoChild\n const isGridline = variant === 'gridline'\n const isGridlineExpressive = variant === 'gridline-expressive'\n const isBlockEndPosition = mediaPosition === 'block-end'\n\n if (\n variant === 'default' &&\n mediaPadding !== 'default' &&\n (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test')\n ) {\n // eslint-disable-next-line no-console\n console.warn(\n `Hero: media padding is only supported by the \"gridline\" and \"gridline-expressive\" variants; ignoring padding=\"${mediaPadding}\".`,\n )\n }\n\n const isInvalidGridlineAlignment = isGridlineExpressive && alignProp === 'center'\n const align: HeroAlign = isInvalidGridlineAlignment ? 'start' : alignProp\n\n if (isInvalidGridlineAlignment && (process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test')) {\n // eslint-disable-next-line no-console\n console.warn('Hero: the \"gridline-expressive\" variant does not support align=\"center\"; using \"start\" instead.')\n }\n\n const Tag = (isGridline || isGridlineExpressive) && enableAnimation ? AnimationProvider : Fragment\n const tagProps =\n (isGridline || isGridlineExpressive) && enableAnimation\n ? {\n autoStaggerChildren: false,\n animationTrigger: 'immediate' as const,\n }\n : {}\n\n const useContainedLayout = (isGridline || isGridlineExpressive) && isBlockEndPosition\n const useInlineGridline = isGridline && hasInlineMedia\n\n const heroLayoutClass = HeroImageChild ? styles['Hero--layout-image'] : styles['Hero--layout-default']\n const isInlineStart = mediaPosition === 'inline-start'\n\n const renderTrailingComponent = (shouldAnimate: boolean) =>\n TrailingComponent && (\n <Box animate={shouldAnimate ? {variant: 'slide-in-up' as const, delay: 1000, duration: 1000} : undefined}>\n <div className={styles['Hero-trailing']}>\n <TrailingComponent />\n </div>\n </Box>\n )\n\n const renderActions = () => (\n <>\n {HeroButtonGroupChild}\n {HeroActions.length > 0 && <div className={styles['Hero-actions']}>{HeroActions}</div>}\n </>\n )\n\n return (\n <Tag {...tagProps}>\n <HeroContext.Provider value={{imagePosition: mediaPosition, variant, align, hasInlineMedia, enableAnimation}}>\n <section\n className={clsx(\n styles.Hero,\n styles[`Hero--variant-${variant}`],\n !hasInlineMedia && styles[`Hero--align-${align}`],\n heroLayoutClass,\n (HeroImageChild || HeroVideoChild) && styles[`Hero--image-pos-${mediaPosition}`],\n (HeroImageChild || HeroVideoChild) && hasInlineMedia && styles['Hero--image-pos-inline'],\n useInlineGridline && styles['Hero--variant-inline-gridline'],\n className,\n )}\n ref={ref}\n aria-labelledby=\"hero-section-brand-heading\"\n data-testid={testId || testIds.root}\n {...rest}\n >\n <Grid\n fullWidth={!useContainedLayout && !useInlineGridline}\n data-testid={testIds.grid}\n className={clsx(\n styles['Hero-grid'],\n styles[`Hero-grid--${mediaPosition}`],\n useContainedLayout && !isGridlineExpressive && styles['Hero-grid--contained'],\n useInlineGridline && styles['Hero-grid--bordered-inline'],\n isGridlineExpressive && styles['Hero-grid--expressive'],\n )}\n >\n {isGridlineExpressive ? (\n <>\n {/* Expressive variant: header column (left) */}\n <Grid.Column\n span={{medium: 12, large: HeroDescriptionChild ? 7 : 6}}\n className={styles['Hero-expressive-header-column']}\n >\n <Stack direction=\"vertical\" gap=\"none\" padding=\"none\" alignItems=\"flex-start\">\n {HeroHeaderChildren}\n </Stack>\n </Grid.Column>\n {/* Expressive variant: body column (right) */}\n <Grid.Column\n span={{medium: 12, large: HeroDescriptionChild ? 5 : 6}}\n className={styles['Hero-expressive-body-column']}\n >\n <Stack direction=\"vertical\" gap=\"none\" padding=\"none\" alignItems=\"flex-start\">\n {HeroDescriptionChild}\n {renderActions()}\n {renderTrailingComponent(enableAnimation)}\n </Stack>\n </Grid.Column>\n </>\n ) : (\n <>\n {/* Standard GridLine variant: text column */}\n {isInlineStart && mediaChild && !useContainedLayout && (\n <Grid.Column\n ref={imageContainerRef}\n span={{large: 6}}\n className={clsx(\n imageBackgroundColor &&\n mediaPadding !== 'none' &&\n styles[`Hero-imageContainer--bg-${imageBackgroundColor}`],\n useInlineGridline && mediaPadding === 'all' && styles['Hero-imageContainer--inline-padding-all'],\n useInlineGridline &&\n mediaPadding === 'none' &&\n styles['Hero-imageContainer--inline-padding-none'],\n useInlineGridline && styles['Hero-imageContainer--inline-bordered'],\n )}\n >\n <div\n className={clsx(styles['Hero-mediaContainer'], imageContainerClassName)}\n style={imageContainerStyle}\n >\n {mediaChild}\n </div>\n </Grid.Column>\n )}\n <Grid.Column span={{large: mediaChild && hasInlineMedia ? 6 : 12}}>\n <Stack\n className={clsx(\n useInlineGridline && styles['Hero-text-column--inline-gridline'],\n useInlineGridline && styles['Hero-contentColumn--bordered-inline'],\n )}\n direction=\"vertical\"\n gap=\"none\"\n padding=\"none\"\n alignItems={hasInlineMedia ? 'flex-start' : align === 'start' ? 'flex-start' : 'center'}\n justifyContent={hasInlineMedia ? undefined : align === 'start' ? 'flex-start' : 'center'}\n >\n {HeroChildren}\n {renderActions()}\n {renderTrailingComponent(isGridline && enableAnimation)}\n </Stack>\n </Grid.Column>\n {!isInlineStart && mediaChild && !useContainedLayout && (\n <Grid.Column\n ref={imageContainerRef}\n span={{large: hasInlineMedia ? 6 : 12}}\n className={clsx(\n imageBackgroundColor &&\n mediaPadding !== 'none' &&\n styles[`Hero-imageContainer--bg-${imageBackgroundColor}`],\n useInlineGridline && mediaPadding === 'all' && styles['Hero-imageContainer--inline-padding-all'],\n useInlineGridline &&\n mediaPadding === 'none' &&\n styles['Hero-imageContainer--inline-padding-none'],\n useInlineGridline && styles['Hero-imageContainer--inline-bordered'],\n )}\n >\n <div\n className={clsx(styles['Hero-mediaContainer'], imageContainerClassName)}\n style={imageContainerStyle}\n >\n {mediaChild}\n </div>\n </Grid.Column>\n )}\n </>\n )}\n </Grid>\n {mediaChild && useContainedLayout && (\n <div\n ref={imageContainerRef}\n data-testid={testIds.imageWrapper}\n className={clsx(\n styles['Hero-imageWrapper'],\n imageContainerClassName,\n imageBackgroundColor &&\n mediaPadding !== 'none' &&\n styles[`Hero-imageWrapper--bg-${imageBackgroundColor}`],\n mediaPadding === 'none' && styles['Hero-imageWrapper--padding-none'],\n )}\n style={imageContainerStyle}\n >\n <div\n className={clsx(\n styles['Hero-imageWrapper-inner'],\n mediaPadding === 'all' && styles['Hero-imageWrapper-inner--padding-all'],\n mediaPadding === 'none' && styles['Hero-imageWrapper-inner--padding-none'],\n mediaWrapperHasBorder && styles['Hero-imageWrapper-inner--with-gridline'],\n )}\n >\n {mediaChild}\n </div>\n </div>\n )}\n </section>\n </HeroContext.Provider>\n </Tag>\n )\n}\n\nconst Root = forwardRef<HTMLElement, PropsWithChildren<HeroProps>>(HeroBase)\n\nexport const Hero = Object.assign(Root, {\n Heading: HeroHeading,\n Description: HeroDescription,\n ButtonGroup: HeroButtonGroup,\n /**\n * @deprecated Use `Hero.ButtonGroup` with `Button` or `ActionMenu` children instead.\n * This component will be removed in a future release.\n */\n PrimaryAction: HeroPrimaryAction,\n /**\n * @deprecated Use `Hero.ButtonGroup` with `Button` or `ActionMenu` children instead.\n * This component will be removed in a future release.\n */\n SecondaryAction: HeroSecondaryAction,\n Image: HeroImage,\n Video: HeroVideo,\n Label: HeroLabel,\n Eyebrow: HeroEyebrow,\n testIds,\n})\n"],"mappings":"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"}
|
package/esm/IDE/IDE.js
CHANGED
|
@@ -7,7 +7,7 @@ import { PaperAirplaneIcon as a } from "../node_modules/@primer/octicons-react/d
|
|
|
7
7
|
import { useTabs as o } from "../hooks/useTabs.js";
|
|
8
8
|
import { TextInput as s } from "../forms/TextInput/TextInput.js";
|
|
9
9
|
import { Avatar as c } from "../Avatar/Avatar.js";
|
|
10
|
-
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/ide/colors-with-modes-
|
|
10
|
+
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/ide/colors-with-modes-CTreurKT.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/ide/base-Cg4X8uay.css';/* empty css */
|
|
11
11
|
/* empty css */
|
|
12
12
|
import l from "./IDE.module.js";
|
|
13
13
|
import u, { Children as d, createElement as f, forwardRef as p, isValidElement as m, memo as h, useCallback as g, useEffect as _, useImperativeHandle as v, useMemo as y, useRef as b, useState as x } from "react";
|
package/esm/Icon/Icon.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
|
|
2
2
|
import { Colors as t } from "../constants.js";
|
|
3
3
|
import n from "./Icon.module.js";
|
|
4
|
-
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon/colors-with-modes-
|
|
4
|
+
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon/colors-with-modes-BPFx95T7.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon/colors-CctMSz17.css';/* empty css */
|
|
5
5
|
/* empty css */
|
|
6
6
|
import r from "react";
|
|
7
7
|
import { jsx as i } from "react/jsx-runtime";
|
|
@@ -13,7 +13,7 @@ export type IconButtonSize = (typeof IconButtonSizes)[number];
|
|
|
13
13
|
type IconButtonBaseProps<C extends React.ElementType> = Omit<BaseProps<C>, 'ref'> & {
|
|
14
14
|
as?: C;
|
|
15
15
|
variant?: IconButtonVariant;
|
|
16
|
-
icon: Icon
|
|
16
|
+
icon: Icon | React.ReactElement<React.SVGProps<SVGSVGElement>>;
|
|
17
17
|
'aria-label': string;
|
|
18
18
|
description?: string;
|
|
19
19
|
inactive?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/IconButton/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAA6B,MAAM,OAAO,CAAA;AACjD,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAA;AAUhD,OAAO,EAA0B,KAAK,gBAAgB,EAAC,MAAM,YAAY,CAAA;AACzE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAGnD,OAAO,kGAAkG,CAAA;AACzG,OAAO,+GAA+G,CAAA;AAGtH,eAAO,MAAM,kBAAkB,oEAAsD,CAAA;AACrF,eAAO,MAAM,eAAe,uCAA4B,CAAA;AACxD,eAAO,MAAM,wBAAwB,aAAuB,CAAA;AAC5D,eAAO,MAAM,qBAAqB,UAAoB,CAAA;AAEtD,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAA;AACnE,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAE7D,KAAK,mBAAmB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,GAAG;IAClF,EAAE,CAAC,EAAE,CAAC,CAAA;IACN,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,IAAI,EAAE,IAAI,CAAA;
|
|
1
|
+
{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/IconButton/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAA6B,MAAM,OAAO,CAAA;AACjD,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAA;AAUhD,OAAO,EAA0B,KAAK,gBAAgB,EAAC,MAAM,YAAY,CAAA;AACzE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAA;AAGnD,OAAO,kGAAkG,CAAA;AACzG,OAAO,+GAA+G,CAAA;AAGtH,eAAO,MAAM,kBAAkB,oEAAsD,CAAA;AACrF,eAAO,MAAM,eAAe,uCAA4B,CAAA;AACxD,eAAO,MAAM,wBAAwB,aAAuB,CAAA;AAC5D,eAAO,MAAM,qBAAqB,UAAoB,CAAA;AAEtD,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAA;AACnE,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAE7D,KAAK,mBAAmB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,GAAG;IAClF,EAAE,CAAC,EAAE,CAAC,CAAA;IACN,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,IAAI,EAAE,IAAI,GAAG,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAA;IAC9D,YAAY,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;CACpC,CAAA;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,mBAAmB,CAAC,CAAC,CAAC,GAC1F,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,mBAAmB,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAA;AAYpF,KAAK,mBAAmB,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAChE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAC/D,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;AA4G9B,eAAO,MAAM,UAAU,EAAiC,mBAAmB,CAAA"}
|
|
@@ -2,7 +2,7 @@ import { clsx as e } from "../node_modules/clsx/dist/clsx.js";
|
|
|
2
2
|
import { Button as t, ButtonSizes as n, ButtonVariants as r, defaultButtonSize as i, defaultButtonVariant as a } from "../Button/Button.js";
|
|
3
3
|
import { Tooltip as o, TooltipContext as s } from "../Tooltip/Tooltip.js";
|
|
4
4
|
import { Spinner as c } from "../Spinner/Spinner.js";
|
|
5
|
-
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes-
|
|
5
|
+
import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes-BsaQYf6M.css';import '../packages/design-tokens/lib/design-tokens/css/tokens/functional/components/icon-button/base-_lTjJKpQ.css';/* empty css */
|
|
6
6
|
/* empty css */
|
|
7
7
|
import l from "./IconButton.module.js";
|
|
8
8
|
import u, { forwardRef as d } from "react";
|
|
@@ -32,7 +32,7 @@ function b({ as: n, icon: r, "aria-label": i, description: a, loading: d = !1, l
|
|
|
32
32
|
accessibleLabel: null,
|
|
33
33
|
className: l.IconButton__spinner,
|
|
34
34
|
"data-testid": y.spinner
|
|
35
|
-
}) : /* @__PURE__ */ p(r, { className: l.IconButton__icon }), B = /* @__PURE__ */ p(t, {
|
|
35
|
+
}) : u.isValidElement(r) ? u.cloneElement(r, { className: e(r.props.className, l.IconButton__icon) }) : /* @__PURE__ */ p(r, { className: l.IconButton__icon }), B = /* @__PURE__ */ p(t, {
|
|
36
36
|
...j,
|
|
37
37
|
ref: I ? void 0 : M,
|
|
38
38
|
as: n,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.js","names":[],"sources":["../../src/IconButton/IconButton.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {forwardRef, type Ref} from 'react'\nimport type {Icon} from '@primer/octicons-react'\n\nimport {\n Button,\n ButtonSizes,\n ButtonVariants,\n defaultButtonSize,\n defaultButtonVariant,\n type ButtonVariant,\n} from '../Button'\nimport {Tooltip, TooltipContext, type TooltipDirection} from '../Tooltip'\nimport type {BaseProps} from '../component-helpers'\nimport {Spinner} from '../Spinner/Spinner'\n\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/icon-button/base.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes.css'\nimport styles from './IconButton.module.css'\n\nexport const IconButtonVariants = [...ButtonVariants, 'danger', 'invisible'] as const\nexport const IconButtonSizes = [...ButtonSizes] as const\nexport const defaultIconButtonVariant = defaultButtonVariant\nexport const defaultIconButtonSize = defaultButtonSize\n\nexport type IconButtonVariant = (typeof IconButtonVariants)[number]\nexport type IconButtonSize = (typeof IconButtonSizes)[number]\n\ntype IconButtonBaseProps<C extends React.ElementType> = Omit<BaseProps<C>, 'ref'> & {\n as?: C\n variant?: IconButtonVariant\n icon: Icon
|
|
1
|
+
{"version":3,"file":"IconButton.js","names":[],"sources":["../../src/IconButton/IconButton.tsx"],"sourcesContent":["import {clsx} from 'clsx'\nimport React, {forwardRef, type Ref} from 'react'\nimport type {Icon} from '@primer/octicons-react'\n\nimport {\n Button,\n ButtonSizes,\n ButtonVariants,\n defaultButtonSize,\n defaultButtonVariant,\n type ButtonVariant,\n} from '../Button'\nimport {Tooltip, TooltipContext, type TooltipDirection} from '../Tooltip'\nimport type {BaseProps} from '../component-helpers'\nimport {Spinner} from '../Spinner/Spinner'\n\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/icon-button/base.css'\nimport '@primer/brand-primitives/lib/design-tokens/css/tokens/functional/components/icon-button/colors-with-modes.css'\nimport styles from './IconButton.module.css'\n\nexport const IconButtonVariants = [...ButtonVariants, 'danger', 'invisible'] as const\nexport const IconButtonSizes = [...ButtonSizes] as const\nexport const defaultIconButtonVariant = defaultButtonVariant\nexport const defaultIconButtonSize = defaultButtonSize\n\nexport type IconButtonVariant = (typeof IconButtonVariants)[number]\nexport type IconButtonSize = (typeof IconButtonSizes)[number]\n\ntype IconButtonBaseProps<C extends React.ElementType> = Omit<BaseProps<C>, 'ref'> & {\n as?: C\n variant?: IconButtonVariant\n icon: Icon | React.ReactElement<React.SVGProps<SVGSVGElement>>\n 'aria-label': string\n description?: string\n inactive?: boolean\n loading?: boolean\n loadingAnnouncement?: string\n rounded?: boolean\n size?: IconButtonSize\n tooltipDirection?: TooltipDirection\n}\n\nexport type IconButtonProps<C extends React.ElementType = 'button'> = IconButtonBaseProps<C> &\n Omit<React.ComponentPropsWithoutRef<C>, keyof IconButtonBaseProps<C> | 'children'>\n\nconst iconButtonTestIds = {\n root: 'IconButton',\n get spinner() {\n return `${this.root}-spinner`\n },\n get loadingAnnouncement() {\n return `${this.root}-loading-announcement`\n },\n}\n\ntype IconButtonComponent = <C extends React.ElementType = 'button'>(\n props: IconButtonProps<C> & React.RefAttributes<HTMLButtonElement>,\n) => React.ReactElement | null\n\nfunction IconButtonRoot(\n {\n as,\n icon: IconComponent,\n 'aria-label': ariaLabel,\n description,\n loading = false,\n loadingAnnouncement = 'Loading',\n rounded = false,\n tooltipDirection = 's',\n size = defaultIconButtonSize,\n variant = defaultIconButtonVariant,\n inactive = false,\n disabled,\n className,\n onClick,\n 'aria-disabled': ariaDisabled,\n 'aria-expanded': ariaExpanded,\n 'aria-haspopup': ariaHasPopup,\n 'data-testid': testId,\n ...props\n }: React.PropsWithoutRef<IconButtonProps<React.ElementType>>,\n ref: Ref<HTMLButtonElement>,\n) {\n const {tooltipId: externalTooltipId} = React.useContext(TooltipContext)\n const isLoading = loading && !disabled\n const isInactive = inactive && !disabled && !isLoading\n const shouldRenderTooltip = !disabled && !externalTooltipId\n const tooltipText = description || ariaLabel\n const buttonVariant: ButtonVariant = variant === 'danger' ? 'secondary' : variant === 'invisible' ? 'subtle' : variant\n\n if (process.env.NODE_ENV !== 'production') {\n if (!ariaLabel.trim()) {\n // eslint-disable-next-line no-console\n console.warn('IconButton requires a non-empty `aria-label`.')\n }\n\n if ([disabled, loading, inactive].filter(Boolean).length > 1) {\n // eslint-disable-next-line no-console\n console.warn('IconButton has conflicting props for `disabled`, `loading`, or `inactive` states.')\n }\n }\n\n const ButtonIcon = isLoading ? (\n <Spinner accessibleLabel={null} className={styles.IconButton__spinner} data-testid={iconButtonTestIds.spinner} />\n ) : React.isValidElement<React.SVGProps<SVGSVGElement>>(IconComponent) ? (\n React.cloneElement(IconComponent, {\n className: clsx(IconComponent.props.className, styles.IconButton__icon),\n })\n ) : (\n <IconComponent className={styles.IconButton__icon} />\n )\n\n const ButtonElement = (\n <Button\n {...props}\n ref={shouldRenderTooltip ? undefined : ref}\n as={as}\n variant={buttonVariant}\n size={size}\n disabled={disabled}\n aria-disabled={isLoading || isInactive ? true : ariaDisabled}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-label={!shouldRenderTooltip || description ? ariaLabel : undefined}\n className={clsx(\n styles.IconButton,\n styles[`IconButton--${size}`],\n styles[`IconButton--variant-${variant}`],\n isInactive && styles['IconButton--inactive'],\n rounded && styles['IconButton--rounded'],\n className,\n )}\n data-testid={testId || iconButtonTestIds.root}\n leadingVisual={ButtonIcon}\n onClick={\n isLoading\n ? event => {\n event.preventDefault()\n event.stopPropagation()\n }\n : onClick\n }\n />\n )\n\n return (\n <>\n {shouldRenderTooltip ? (\n <Tooltip ref={ref} direction={tooltipDirection} text={tooltipText} type={description ? 'description' : 'label'}>\n {ButtonElement}\n </Tooltip>\n ) : (\n ButtonElement\n )}\n <span\n aria-live=\"polite\"\n className={styles.IconButton__loadingAnnouncement}\n data-testid={iconButtonTestIds.loadingAnnouncement}\n >\n {isLoading ? loadingAnnouncement : null}\n </span>\n </>\n )\n}\n\nexport const IconButton = forwardRef(IconButtonRoot) as IconButtonComponent\n"],"mappings":";;;;;;;;;;AAoBA,IAAa,IAAqB;CAAC,GAAG;CAAgB;CAAU;AAAW,GAC9D,IAAkB,CAAC,GAAG,CAAW,GACjC,IAA2B,GAC3B,IAAwB,GAsB/B,IAAoB;CACxB,MAAM;CACN,IAAI,UAAU;EACZ,OAAO,GAAG,KAAK,KAAK;CACtB;CACA,IAAI,sBAAsB;EACxB,OAAO,GAAG,KAAK,KAAK;CACtB;AACF;AAMA,SAAS,EACP,EACE,OACA,MAAM,GACN,cAAc,GACd,gBACA,aAAU,IACV,yBAAsB,WACtB,aAAU,IACV,sBAAmB,KACnB,UAAO,GACP,aAAU,GACV,cAAW,IACX,aACA,cACA,YACA,iBAAiB,GACjB,iBAAiB,GACjB,iBAAiB,GACjB,eAAe,GACf,GAAG,KAEL,GACA;CACA,IAAM,EAAC,WAAW,MAAqB,EAAM,WAAW,CAAc,GAChE,IAAY,KAAW,CAAC,GACxB,IAAa,KAAY,CAAC,KAAY,CAAC,GACvC,IAAsB,CAAC,KAAY,CAAC,GACpC,IAAc,KAAe,GAC7B,IAA+B,MAAY,WAAW,cAAc,MAAY,cAAc,WAAW;CAE/G,AAAA,QAAA,IAAA,aAA6B,iBACtB,EAAU,KAAK,KAElB,QAAQ,KAAK,+CAA+C,GAG1D;EAAC;EAAU;EAAS;CAAQ,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,SAAS,KAEzD,QAAQ,KAAK,mFAAmF;CAIpG,IAAM,IAAa,IACjB,kBAAC,GAAD;EAAS,iBAAiB;EAAM,WAAW,EAAO;EAAqB,eAAa,EAAkB;CAAU,CAAA,IAC9G,EAAM,eAA8C,CAAa,IACnE,EAAM,aAAa,GAAe,EAChC,WAAW,EAAK,EAAc,MAAM,WAAW,EAAO,gBAAgB,EACxE,CAAC,IAED,kBAAC,GAAD,EAAe,WAAW,EAAO,iBAAmB,CAAA,GAGhD,IACJ,kBAAC,GAAD;EACE,GAAI;EACJ,KAAK,IAAsB,KAAA,IAAY;EACnC;EACJ,SAAS;EACH;EACI;EACV,iBAAe,KAAa,IAAa,KAAO;EAChD,iBAAe;EACf,iBAAe;EACf,cAAY,CAAC,KAAuB,IAAc,IAAY,KAAA;EAC9D,WAAW,EACT,EAAO,YACP,EAAO,eAAe,MACtB,EAAO,uBAAuB,MAC9B,KAAc,EAAO,yBACrB,KAAW,EAAO,wBAClB,CACF;EACA,eAAa,KAAU,EAAkB;EACzC,eAAe;EACf,SACE,KACI,MAAS;GAEP,AADA,EAAM,eAAe,GACrB,EAAM,gBAAgB;EACxB,IACA;CAEP,CAAA;CAGH,OACE,kBAAA,GAAA,EAAA,UAAA,CACG,IACC,kBAAC,GAAD;EAAc;EAAK,WAAW;EAAkB,MAAM;EAAa,MAAM,IAAc,gBAAgB;YACpG;CACM,CAAA,IAET,GAEF,kBAAC,QAAD;EACE,aAAU;EACV,WAAW,EAAO;EAClB,eAAa,EAAkB;YAE9B,IAAY,IAAsB;CAC/B,CAAA,CACN,EAAA,CAAA;AAEN;AAEA,IAAa,IAAa,EAAW,CAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Primer_Brand__IconButton-module__IconButton___68DKi{flex:none;gap:0;padding:0}.Primer_Brand__IconButton-module__IconButton___68DKi.Primer_Brand__IconButton-module__IconButton___68DKi{min-width:var(--brand-IconButton-control-size-medium);width:var(--brand-IconButton-control-size-medium);height:var(--brand-IconButton-control-size-medium)}.Primer_Brand__IconButton-module__IconButton--small___KXgb_.Primer_Brand__IconButton-module__IconButton--small___KXgb_{min-width:var(--brand-IconButton-control-size-small);width:var(--brand-IconButton-control-size-small);height:var(--brand-IconButton-control-size-small)}.Primer_Brand__IconButton-module__IconButton--large___ypAna.Primer_Brand__IconButton-module__IconButton--large___ypAna{min-width:var(--brand-IconButton-control-size-large);width:var(--brand-IconButton-control-size-large);height:var(--brand-IconButton-control-size-large)}.Primer_Brand__IconButton-module__IconButton--rounded___g_ngl.Primer_Brand__IconButton-module__IconButton--rounded___g_ngl{border-radius:var(--brand-borderRadius-full)}.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true]){color:var(--brand-IconButton-danger-fgColor-rest);background-color:var(--brand-IconButton-danger-bgColor-rest);border-color:var(--brand-IconButton-danger-borderColor-rest)}.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true]):not([aria-expanded=true]):hover{color:var(--brand-IconButton-danger-fgColor-hover);background-color:var(--brand-IconButton-danger-bgColor-hover);border-color:var(--brand-IconButton-danger-borderColor-hover)}.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true]):active,.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true])[aria-expanded=true]{color:var(--brand-IconButton-danger-fgColor-active);background-color:var(--brand-IconButton-danger-bgColor-active);border-color:var(--brand-IconButton-danger-borderColor-active)}.Primer_Brand__IconButton-module__IconButton--variant-invisible___gp_QC.Primer_Brand__IconButton-module__IconButton--variant-invisible___gp_QC:where(:not(:hover):not(:active):not([aria-expanded=true])){background-color:var(--brand-IconButton-invisible-bgColor-rest);border-color:var(--brand-IconButton-invisible-borderColor-rest);-webkit-backdrop-filter:none;backdrop-filter:none}.Primer_Brand__IconButton-module__IconButton--inactive___UanYd.Primer_Brand__IconButton-module__IconButton--inactive___UanYd,.Primer_Brand__IconButton-module__IconButton--inactive___UanYd.Primer_Brand__IconButton-module__IconButton--inactive___UanYd:hover,.Primer_Brand__IconButton-module__IconButton--inactive___UanYd.Primer_Brand__IconButton-module__IconButton--inactive___UanYd:active{color:var(--brand-IconButton-inactive-fgColor);cursor:auto;background-color:var(--brand-IconButton-inactive-bgColor);border-color:var(--brand-IconButton-inactive-borderColor);-webkit-backdrop-filter:none;backdrop-filter:none}.Primer_Brand__IconButton-module__IconButton--inactive___UanYd .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{color:inherit}.Primer_Brand__IconButton-module__IconButton--small___KXgb_ .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{width:var(--brand-IconButton-icon-size-small);height:var(--brand-IconButton-icon-size-small)}.Primer_Brand__IconButton-module__IconButton--medium____oYr1 .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{width:var(--brand-IconButton-icon-size-medium);height:var(--brand-IconButton-icon-size-medium)}.Primer_Brand__IconButton-module__IconButton--large___ypAna .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{width:var(--brand-IconButton-icon-size-large);height:var(--brand-IconButton-icon-size-large)}.Primer_Brand__IconButton-module__IconButton__spinner___I4dHE.Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{width:var(--brand-IconButton-icon-size-medium);height:var(--brand-IconButton-icon-size-medium);animation-duration:var(--brand-IconButton-spinner-animationDuration-default);display:block}.Primer_Brand__IconButton-module__IconButton--small___KXgb_ .Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{width:var(--brand-IconButton-icon-size-small);height:var(--brand-IconButton-icon-size-small)}.Primer_Brand__IconButton-module__IconButton--large___ypAna .Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{width:var(--brand-IconButton-icon-size-large);height:var(--brand-IconButton-icon-size-large)}.Primer_Brand__IconButton-module__IconButton__loadingAnnouncement___Ga8mZ{width:var(--base-size-1);height:var(--base-size-1);margin:calc(var(--base-size-1) * -1);clip:
|
|
1
|
+
.Primer_Brand__IconButton-module__IconButton___68DKi{flex:none;gap:0;padding:0}.Primer_Brand__IconButton-module__IconButton___68DKi.Primer_Brand__IconButton-module__IconButton___68DKi{min-width:var(--brand-IconButton-control-size-medium);width:var(--brand-IconButton-control-size-medium);height:var(--brand-IconButton-control-size-medium)}.Primer_Brand__IconButton-module__IconButton--small___KXgb_.Primer_Brand__IconButton-module__IconButton--small___KXgb_{min-width:var(--brand-IconButton-control-size-small);width:var(--brand-IconButton-control-size-small);height:var(--brand-IconButton-control-size-small)}.Primer_Brand__IconButton-module__IconButton--large___ypAna.Primer_Brand__IconButton-module__IconButton--large___ypAna{min-width:var(--brand-IconButton-control-size-large);width:var(--brand-IconButton-control-size-large);height:var(--brand-IconButton-control-size-large)}.Primer_Brand__IconButton-module__IconButton--rounded___g_ngl.Primer_Brand__IconButton-module__IconButton--rounded___g_ngl{border-radius:var(--brand-borderRadius-full)}.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true]){color:var(--brand-IconButton-danger-fgColor-rest);background-color:var(--brand-IconButton-danger-bgColor-rest);border-color:var(--brand-IconButton-danger-borderColor-rest)}.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true]):not([aria-expanded=true]):hover{color:var(--brand-IconButton-danger-fgColor-hover);background-color:var(--brand-IconButton-danger-bgColor-hover);border-color:var(--brand-IconButton-danger-borderColor-hover)}.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true]):active,.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH.Primer_Brand__IconButton-module__IconButton--variant-danger____mjeH:not([disabled]):not([aria-disabled=true])[aria-expanded=true]{color:var(--brand-IconButton-danger-fgColor-active);background-color:var(--brand-IconButton-danger-bgColor-active);border-color:var(--brand-IconButton-danger-borderColor-active)}.Primer_Brand__IconButton-module__IconButton--variant-invisible___gp_QC.Primer_Brand__IconButton-module__IconButton--variant-invisible___gp_QC:where(:not(:hover):not(:active):not([aria-expanded=true])){background-color:var(--brand-IconButton-invisible-bgColor-rest);border-color:var(--brand-IconButton-invisible-borderColor-rest);-webkit-backdrop-filter:none;backdrop-filter:none}.Primer_Brand__IconButton-module__IconButton--inactive___UanYd.Primer_Brand__IconButton-module__IconButton--inactive___UanYd,.Primer_Brand__IconButton-module__IconButton--inactive___UanYd.Primer_Brand__IconButton-module__IconButton--inactive___UanYd:hover,.Primer_Brand__IconButton-module__IconButton--inactive___UanYd.Primer_Brand__IconButton-module__IconButton--inactive___UanYd:active{color:var(--brand-IconButton-inactive-fgColor);cursor:auto;background-color:var(--brand-IconButton-inactive-bgColor);border-color:var(--brand-IconButton-inactive-borderColor);-webkit-backdrop-filter:none;backdrop-filter:none}.Primer_Brand__IconButton-module__IconButton--inactive___UanYd .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{color:inherit}.Primer_Brand__IconButton-module__IconButton--small___KXgb_ .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{width:var(--brand-IconButton-icon-size-small);height:var(--brand-IconButton-icon-size-small)}.Primer_Brand__IconButton-module__IconButton--medium____oYr1 .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{width:var(--brand-IconButton-icon-size-medium);height:var(--brand-IconButton-icon-size-medium)}.Primer_Brand__IconButton-module__IconButton--large___ypAna .Primer_Brand__IconButton-module__IconButton__icon___ilqkK{width:var(--brand-IconButton-icon-size-large);height:var(--brand-IconButton-icon-size-large)}.Primer_Brand__IconButton-module__IconButton__spinner___I4dHE.Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{width:var(--brand-IconButton-icon-size-medium);height:var(--brand-IconButton-icon-size-medium);animation-duration:var(--brand-IconButton-spinner-animationDuration-default);display:block}.Primer_Brand__IconButton-module__IconButton--small___KXgb_ .Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{width:var(--brand-IconButton-icon-size-small);height:var(--brand-IconButton-icon-size-small)}.Primer_Brand__IconButton-module__IconButton--large___ypAna .Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{width:var(--brand-IconButton-icon-size-large);height:var(--brand-IconButton-icon-size-large)}.Primer_Brand__IconButton-module__IconButton__loadingAnnouncement___Ga8mZ{width:var(--base-size-1);height:var(--base-size-1);margin:calc(var(--base-size-1) * -1);clip-path:inset(50%);white-space:nowrap;border:0;padding:0;position:absolute;overflow:hidden}@media (forced-colors:active){.Primer_Brand__IconButton-module__IconButton--inactive___UanYd{color:graytext;border-color:graytext}.Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{color:buttontext}}@media (prefers-reduced-motion:reduce){.Primer_Brand__IconButton-module__IconButton__spinner___I4dHE{animation-duration:var(--brand-IconButton-spinner-animationDuration-reducedMotion)}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './IconButton.module-
|
|
1
|
+
import './IconButton.module-DDLfSj96.css';//#region src/IconButton/IconButton.module.css
|
|
2
2
|
var e = "Primer_Brand__IconButton-module__IconButton___68DKi", t = "Primer_Brand__IconButton-module__IconButton__icon___ilqkK", n = "Primer_Brand__IconButton-module__IconButton__spinner___I4dHE", r = "Primer_Brand__IconButton-module__IconButton__loadingAnnouncement___Ga8mZ", i = {
|
|
3
3
|
IconButton: e,
|
|
4
4
|
"IconButton--small": "Primer_Brand__IconButton-module__IconButton--small___KXgb_",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.module.js","names":[],"sources":["../../src/IconButton/IconButton.module.css"],"sourcesContent":[".IconButton {\n flex: none;\n gap: 0;\n padding: 0;\n}\n\n.IconButton.IconButton {\n min-width: var(--brand-IconButton-control-size-medium);\n width: var(--brand-IconButton-control-size-medium);\n height: var(--brand-IconButton-control-size-medium);\n}\n\n.IconButton--small.IconButton--small {\n min-width: var(--brand-IconButton-control-size-small);\n width: var(--brand-IconButton-control-size-small);\n height: var(--brand-IconButton-control-size-small);\n}\n\n.IconButton--large.IconButton--large {\n min-width: var(--brand-IconButton-control-size-large);\n width: var(--brand-IconButton-control-size-large);\n height: var(--brand-IconButton-control-size-large);\n}\n\n.IconButton--rounded.IconButton--rounded {\n border-radius: var(--brand-borderRadius-full);\n}\n\n.IconButton--variant-danger.IconButton--variant-danger:not([disabled], [aria-disabled='true']) {\n color: var(--brand-IconButton-danger-fgColor-rest);\n background-color: var(--brand-IconButton-danger-bgColor-rest);\n border-color: var(--brand-IconButton-danger-borderColor-rest);\n}\n\n.IconButton--variant-danger.IconButton--variant-danger:not(\n [disabled],\n [aria-disabled='true'],\n [aria-expanded='true']\n ):hover {\n color: var(--brand-IconButton-danger-fgColor-hover);\n background-color: var(--brand-IconButton-danger-bgColor-hover);\n border-color: var(--brand-IconButton-danger-borderColor-hover);\n}\n\n.IconButton--variant-danger.IconButton--variant-danger:not([disabled], [aria-disabled='true']):active,\n.IconButton--variant-danger.IconButton--variant-danger:not([disabled], [aria-disabled='true'])[aria-expanded='true'] {\n color: var(--brand-IconButton-danger-fgColor-active);\n background-color: var(--brand-IconButton-danger-bgColor-active);\n border-color: var(--brand-IconButton-danger-borderColor-active);\n}\n\n.IconButton--variant-invisible.IconButton--variant-invisible:where(:not(:hover, :active, [aria-expanded='true'])) {\n background-color: var(--brand-IconButton-invisible-bgColor-rest);\n border-color: var(--brand-IconButton-invisible-borderColor-rest);\n backdrop-filter: none;\n}\n\n.IconButton--inactive.IconButton--inactive,\n.IconButton--inactive.IconButton--inactive:hover,\n.IconButton--inactive.IconButton--inactive:active {\n color: var(--brand-IconButton-inactive-fgColor);\n cursor: auto;\n background-color: var(--brand-IconButton-inactive-bgColor);\n border-color: var(--brand-IconButton-inactive-borderColor);\n backdrop-filter: none;\n}\n\n.IconButton--inactive .IconButton__icon {\n color: inherit;\n}\n\n.IconButton--small .IconButton__icon {\n width: var(--brand-IconButton-icon-size-small);\n height: var(--brand-IconButton-icon-size-small);\n}\n\n.IconButton--medium .IconButton__icon {\n width: var(--brand-IconButton-icon-size-medium);\n height: var(--brand-IconButton-icon-size-medium);\n}\n\n.IconButton--large .IconButton__icon {\n width: var(--brand-IconButton-icon-size-large);\n height: var(--brand-IconButton-icon-size-large);\n}\n\n.IconButton__spinner.IconButton__spinner {\n display: block;\n width: var(--brand-IconButton-icon-size-medium);\n height: var(--brand-IconButton-icon-size-medium);\n animation-duration: var(--brand-IconButton-spinner-animationDuration-default);\n}\n\n.IconButton--small .IconButton__spinner {\n width: var(--brand-IconButton-icon-size-small);\n height: var(--brand-IconButton-icon-size-small);\n}\n\n.IconButton--large .IconButton__spinner {\n width: var(--brand-IconButton-icon-size-large);\n height: var(--brand-IconButton-icon-size-large);\n}\n\n.IconButton__loadingAnnouncement {\n position: absolute;\n width: var(--base-size-1);\n height: var(--base-size-1);\n padding: 0;\n margin: calc(var(--base-size-1) * -1);\n overflow: hidden;\n clip:
|
|
1
|
+
{"version":3,"file":"IconButton.module.js","names":[],"sources":["../../src/IconButton/IconButton.module.css"],"sourcesContent":[".IconButton {\n flex: none;\n gap: 0;\n padding: 0;\n}\n\n.IconButton.IconButton {\n min-width: var(--brand-IconButton-control-size-medium);\n width: var(--brand-IconButton-control-size-medium);\n height: var(--brand-IconButton-control-size-medium);\n}\n\n.IconButton--small.IconButton--small {\n min-width: var(--brand-IconButton-control-size-small);\n width: var(--brand-IconButton-control-size-small);\n height: var(--brand-IconButton-control-size-small);\n}\n\n.IconButton--large.IconButton--large {\n min-width: var(--brand-IconButton-control-size-large);\n width: var(--brand-IconButton-control-size-large);\n height: var(--brand-IconButton-control-size-large);\n}\n\n.IconButton--rounded.IconButton--rounded {\n border-radius: var(--brand-borderRadius-full);\n}\n\n.IconButton--variant-danger.IconButton--variant-danger:not([disabled], [aria-disabled='true']) {\n color: var(--brand-IconButton-danger-fgColor-rest);\n background-color: var(--brand-IconButton-danger-bgColor-rest);\n border-color: var(--brand-IconButton-danger-borderColor-rest);\n}\n\n.IconButton--variant-danger.IconButton--variant-danger:not(\n [disabled],\n [aria-disabled='true'],\n [aria-expanded='true']\n ):hover {\n color: var(--brand-IconButton-danger-fgColor-hover);\n background-color: var(--brand-IconButton-danger-bgColor-hover);\n border-color: var(--brand-IconButton-danger-borderColor-hover);\n}\n\n.IconButton--variant-danger.IconButton--variant-danger:not([disabled], [aria-disabled='true']):active,\n.IconButton--variant-danger.IconButton--variant-danger:not([disabled], [aria-disabled='true'])[aria-expanded='true'] {\n color: var(--brand-IconButton-danger-fgColor-active);\n background-color: var(--brand-IconButton-danger-bgColor-active);\n border-color: var(--brand-IconButton-danger-borderColor-active);\n}\n\n.IconButton--variant-invisible.IconButton--variant-invisible:where(:not(:hover, :active, [aria-expanded='true'])) {\n background-color: var(--brand-IconButton-invisible-bgColor-rest);\n border-color: var(--brand-IconButton-invisible-borderColor-rest);\n backdrop-filter: none;\n}\n\n.IconButton--inactive.IconButton--inactive,\n.IconButton--inactive.IconButton--inactive:hover,\n.IconButton--inactive.IconButton--inactive:active {\n color: var(--brand-IconButton-inactive-fgColor);\n cursor: auto;\n background-color: var(--brand-IconButton-inactive-bgColor);\n border-color: var(--brand-IconButton-inactive-borderColor);\n backdrop-filter: none;\n}\n\n.IconButton--inactive .IconButton__icon {\n color: inherit;\n}\n\n.IconButton--small .IconButton__icon {\n width: var(--brand-IconButton-icon-size-small);\n height: var(--brand-IconButton-icon-size-small);\n}\n\n.IconButton--medium .IconButton__icon {\n width: var(--brand-IconButton-icon-size-medium);\n height: var(--brand-IconButton-icon-size-medium);\n}\n\n.IconButton--large .IconButton__icon {\n width: var(--brand-IconButton-icon-size-large);\n height: var(--brand-IconButton-icon-size-large);\n}\n\n.IconButton__spinner.IconButton__spinner {\n display: block;\n width: var(--brand-IconButton-icon-size-medium);\n height: var(--brand-IconButton-icon-size-medium);\n animation-duration: var(--brand-IconButton-spinner-animationDuration-default);\n}\n\n.IconButton--small .IconButton__spinner {\n width: var(--brand-IconButton-icon-size-small);\n height: var(--brand-IconButton-icon-size-small);\n}\n\n.IconButton--large .IconButton__spinner {\n width: var(--brand-IconButton-icon-size-large);\n height: var(--brand-IconButton-icon-size-large);\n}\n\n.IconButton__loadingAnnouncement {\n position: absolute;\n width: var(--base-size-1);\n height: var(--base-size-1);\n padding: 0;\n margin: calc(var(--base-size-1) * -1);\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n border: 0;\n}\n\n@media (forced-colors: active) {\n .IconButton--inactive {\n color: GrayText;\n border-color: GrayText;\n }\n\n .IconButton__spinner {\n color: ButtonText;\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .IconButton__spinner {\n animation-duration: var(--brand-IconButton-spinner-animationDuration-reducedMotion);\n }\n}\n"],"mappings":""}
|