@evolve.ui/core-components 1.0.0

package/index-MX_CgDGs.d.mts

@@ -0,0 +1,147 @@
+import { CleanTheme, Theme } from "@evolve.ui/theme-system/themes/themeType";
+
+//#region src/mixins/propMixins.d.ts
+type LocationProp = {
+  $gridLocation?: string;
+};
+type LineClampProp = {
+  $lineClamp?: number;
+};
+type PaddingProps = {
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   *
+   * If it matches a key in the spacing scale, it will use the corresponding Tailwind token.
+   * IE if set to `sm` it would produce `p-sm`.
+   *
+   * If it matches multiple keys separated by `+` or `-`, it will compute the result and
+   * emit a Tailwind arbitrary value. IE `sm+md` -> `[padding:40px]`.
+   *
+   * Otherwise, it will emit a Tailwind arbitrary value directly. IE `auto 3px` -> `[padding:auto_3px]`.
+   */
+  $padding?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $paddingBottom?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $paddingLeft?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $paddingRight?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $paddingTop?: string;
+};
+type MarginProps = {
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $margin?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $marginBottom?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $marginLeft?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $marginRight?: string;
+  /**
+   * String used for formatting.
+   *
+   * Quick reference (px): `xxxs(2)` `xxs(4)` `xs(8)` `sm(16)` `md(24)` `lg(32)` `xl(48)` `xxl(64)` `xxxl(128)`
+   */
+  $marginTop?: string;
+};
+type ThemeSpacings = keyof Theme['spacing'];
+type SimplifiedThemeSpacings = Extract<ThemeSpacings, 'lg' | 'md' | 'sm' | 'xl' | 'xs' | 'xxl' | 'xxs' | 'xxxl' | 'xxxs'>;
+/**
+ * Static Tailwind tokens used by `getMixinClasses` for named spacing values.
+ * Keep these literal strings in source so Tailwind content scanning can include
+ * the named mixin classes in production CSS.
+ */
+declare const MIXIN_TAILWIND_STATIC_CLASSES: readonly ["p-3xl", "p-2xl", "p-xl", "p-lg", "p-md", "p-sm", "p-xs", "p-2xs", "p-3xs", "pb-3xl", "pb-2xl", "pb-xl", "pb-lg", "pb-md", "pb-sm", "pb-xs", "pb-2xs", "pb-3xs", "pl-3xl", "pl-2xl", "pl-xl", "pl-lg", "pl-md", "pl-sm", "pl-xs", "pl-2xs", "pl-3xs", "pr-3xl", "pr-2xl", "pr-xl", "pr-lg", "pr-md", "pr-sm", "pr-xs", "pr-2xs", "pr-3xs", "pt-3xl", "pt-2xl", "pt-xl", "pt-lg", "pt-md", "pt-sm", "pt-xs", "pt-2xs", "pt-3xs", "m-3xl", "m-2xl", "m-xl", "m-lg", "m-md", "m-sm", "m-xs", "m-2xs", "m-3xs", "mb-3xl", "mb-2xl", "mb-xl", "mb-lg", "mb-md", "mb-sm", "mb-xs", "mb-2xs", "mb-3xs", "ml-3xl", "ml-2xl", "ml-xl", "ml-lg", "ml-md", "ml-sm", "ml-xs", "ml-2xs", "ml-3xs", "mr-3xl", "mr-2xl", "mr-xl", "mr-lg", "mr-md", "mr-sm", "mr-xs", "mr-2xs", "mr-3xs", "mt-3xl", "mt-2xl", "mt-xl", "mt-lg", "mt-md", "mt-sm", "mt-xs", "mt-2xs", "mt-3xs", "line-clamp-1", "line-clamp-2", "line-clamp-3", "line-clamp-4", "line-clamp-5", "line-clamp-6"];
+/**
+ * Converts `GenericCSSMixinProps` to a Tailwind class string using `cn()`.
+ *
+ * Use this in place of the removed `genericCSSMixins` CSS-in-JS template to apply
+ * spacing, grid-area, and line-clamp props in plain components.
+ */
+declare const getMixinClasses: ({
+  $gridLocation,
+  $lineClamp,
+  $margin,
+  $marginBottom,
+  $marginLeft,
+  $marginRight,
+  $marginTop,
+  $padding,
+  $paddingBottom,
+  $paddingLeft,
+  $paddingRight,
+  $paddingTop
+}: GenericCSSMixinProps) => string;
+type GenericCSSMixinProps = LocationProp & PaddingProps & MarginProps & LineClampProp;
+/**
+ * @deprecated Use `getMixinClasses` with `cn()` in plain components instead.
+ *
+ * Kept for type-level reference only. Consumers using CSS-in-JS template mixins
+ * should migrate to `cn(getMixinClasses(props), ...)` in a non-styled component.
+ */
+declare const genericCSSMixins = "";
+/**
+ * @deprecated Use `getMixinClasses` with `cn()` in plain components instead.
+ * @see genericCSSMixins
+ */
+declare const paddingMixin = "";
+/**
+ * @deprecated Use `getMixinClasses` with `cn()` in plain components instead.
+ * @see genericCSSMixins
+ */
+declare const marginMixin = "";
+/**
+ * @deprecated Use `getMixinClasses` with `cn()` in plain components instead.
+ * @see genericCSSMixins
+ */
+declare const locationMixin = "";
+/**
+ * @deprecated Use `getMixinClasses` with `cn()` in plain components instead.
+ * @see genericCSSMixins
+ */
+declare const lineClampMixin = "";
+/**
+ * Parses a spacing prop string against a theme spacing object.
+ *
+ * @deprecated Prefer `getMixinClasses` for Tailwind-based components.
+ * Kept for backward compatibility where a theme spacing object is available.
+ */
+declare const themeSpacingParser: (themeSpacing: CleanTheme["spacing"], styles: string) => string;
+//#endregion
+export { MarginProps as a, genericCSSMixins as c, locationMixin as d, marginMixin as f, MIXIN_TAILWIND_STATIC_CLASSES as i, getMixinClasses as l, themeSpacingParser as m, LineClampProp as n, PaddingProps as o, paddingMixin as p, LocationProp as r, SimplifiedThemeSpacings as s, GenericCSSMixinProps as t, lineClampMixin as u };
+//# sourceMappingURL=index-MX_CgDGs.d.mts.map

package/index-MX_CgDGs.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-MX_CgDGs.d.mts","names":[],"sources":["../src/mixins/propMixins.ts"],"mappings":";;;KAKY,YAAA;EAAiB,aAAa;AAAA;AAAA,KAE9B,aAAA;EAAkB,UAAU;AAAA;AAAA,KAE5B,YAAA;EAFA;;;;AAA4B;AAExC;;;;;;;;EAcI,QAAA;EAwBW;AAAA;AAGf;;;EArBI,cAAA;EA2BA;;;;;EArBA,YAAA;EA6CU;AACZ;;;;EAxCE,aAAA;EA2CQ;;;;AACK;EAtCb,WAAA;AAAA;AAAA,KAGQ,WAAA;EAgKF;AAAA;AA+EV;;;EAzOI,OAAA;EAyO4B;;;;;EAnO5B,aAAA;EAmO4B;;;;;EA7N5B,WAAA;EA0OmB;;;;;EApOnB,YAAA;EAuN4B;;;;;EAjN5B,UAAA;AAAA;AAAA,KAGC,aAAA,SAAsB,KAAK;AAAA,KACpB,uBAAA,GAA0B,OAAO,CACzC,aAAA;;;;;;cA4BS,6BAAA;;;;;;;cAgLA,eAAA;EAAmB,aAAA;EAAA,UAAA;EAAA,OAAA;EAAA,aAAA;EAAA,WAAA;EAAA,YAAA;EAAA,UAAA;EAAA,QAAA;EAAA,cAAA;EAAA,YAAA;EAAA,aAAA;EAAA;AAAA,GAa7B,oBAAA;AAAA,KAgBS,oBAAA,GAAuB,YAAA,GAAe,YAAA,GAAe,WAAA,GAAc,aAAA;AAA/E;;;;;;AAAA,cAQa,gBAAA;;;;;cAMA,YAAA;;;AAd+E;AAQ5F;cAYa,WAAA;;;AAZgB;AAM7B;cAYa,aAAA;;;AAZY;AAMzB;cAYa,cAAA;;;AAZW;AAMxB;;;cAca,kBAAA,GAAsB,YAAA,EAAc,UAAU,aAAa,MAAA"}

package/index-NeSBj5ci.d.cts

@@ -0,0 +1,200 @@
+import { MouseEvent, ReactNode } from "react";
+
+//#region src/Carousel/Carousel.types.d.ts
+type CarouselCard = {
+  /**
+   * The rendered content of the card
+   */
+  card: ReactNode;
+  /**
+   * The unique identifier for the card
+   */
+  key: string;
+};
+type CarouselPageInfo = {
+  breakpoints: number[];
+  cardsPerPage: number;
+  numberOfPages: number;
+};
+declare const CAROUSEL_CARD_GAP_NUM = 24;
+declare const CAROUSEL_CARD_GAP_MOBILE_NUM = 16;
+declare enum CarouselGoToPageDirection {
+  Previous = -1,
+  Next = 1
+}
+/**
+ * Page navigation information based on the action the user took.
+ *
+ * @property {CarouselGoToPageDirection} buttonDirection - Populated if the user clicked the Next or Previous buttons
+ * @property {number} oneBasedPageNumber - The user navigated between cards by scrolling/dragging manually
+ */
+type CarouselGoToPageInfo = {
+  buttonDirection: CarouselGoToPageDirection;
+  oneBasedPageNumber?: never;
+} | {
+  buttonDirection?: never;
+  oneBasedPageNumber: number;
+};
+//#endregion
+//#region src/Carousel/Carousel.d.ts
+type Props = {
+  /**
+   * A Link element that a user can interact with.
+   * Usually, this will be something like a "View all" that links to a page with all the items that the carousel represents.
+   *
+   * It will appear on the right side, opposite of the title, if one exists
+   *
+   * @property {string} path - Where the user will be taken upon clicking the action
+   * @property {string} text="View All" - The text to be displayed in the action element
+   */
+  action?: {
+    hideIcon?: boolean;
+    onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
+    /**
+     * Where the user will be taken upon clicking the action
+     */
+    path: string;
+    /**
+     * The text to be displayed in the action element
+     *
+     * @default "View All"
+     */
+    text?: string;
+  };
+  /**
+   * If provided, the cards, barring the first card, will be offset so that some of the previous card will be shown on the left.
+   * This is best used for mobile carousels so that people can better see that they're in the middle of a carousel.
+   * It should be a positive number, representing a pixel amount.
+   * Gap size will be added to it, so make sure you aren't including it.
+   *
+   * @default 0
+   */
+  cardOffset?: number;
+  /**
+   * The scrollable content of the carousel.
+   * Should be individual elements, likes cards or images.
+   *
+   * @property {ReactNode} card - The rendered content
+   * @property {string} key - A unique identifier for the card
+   */
+  cards: CarouselCard[];
+  /**
+   * Are the cards taking up a full page of the carousel?
+   * This is used to use card counts to render the page-based sections of the carousel for SSR.
+   */
+  fullPage?: boolean;
+  /**
+   * Bring the slider to the selected page. Only one property will be defined, so components using this function should check
+   * which one is populated.
+   *
+   * @property {CarouselGoToPageDirection} buttonDirection - If populated, refers to which button was pressed: Previous or Next
+   * @property {number} oneBasedPageNumber - If populated, refers to which page the user is specifically going to
+   *
+   * @see CarouselGoToPageInfo
+   */
+  goToPage?: (goToPageInfo: CarouselGoToPageInfo) => void;
+  /**
+   * Callback triggered when the user scrolls through the carousel manually (either through mouse wheel or dragging)
+   */
+  onScroll?: (currentScrollPage: number) => void;
+  /**
+   * @returns The number of pages for the carousel
+   */
+  providePageCount?: (numberOfPages: number) => void;
+  /**
+   * The selected page to scroll to directly
+   */
+  selectedPage?: number;
+  /**
+   * If the user scrolls, they're automatically brought to a specific page breakpoint.
+   * Set this to `false` to avoid further scrolling after the user has stopped scrolling through the carousel.
+   *
+   * @default true
+   */
+  shouldGoToPageBreakpointsOnScrolling?: boolean;
+  /**
+   * Displays dots at the bottom of the carousel that represent a page of content.
+   * Clicking a dot will bring the user to the corresponding page.
+   * Mobile devices will NEVER show the page selector.
+   *
+   * @default false
+   */
+  showPagination?: boolean;
+  subHeaderDescription?: string;
+  /**
+   * Left side content for the carousel subheader - can be either a link or plain text.
+   */
+  subHeaderLeft?: {
+    link: {
+      ariaLabel?: string;
+      href: string;
+      label: string;
+      onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
+      variant?: 'default' | 'subtle';
+    };
+    type: 'link';
+  } | {
+    text: string;
+    type: 'text';
+  };
+  /**
+   * The title of the carousel, display above and to the left of the carousel.
+   * Even though it's a ReactNode, this is for formatMessage/other intl-based libraries
+   * to pass in populated values. You should pass in a value that is string-based, due
+   * to the carousel variant formatting the title as an h2 or h5.
+   *
+   * Optional.
+   *
+   * @variation primary - If carousel is primary, title is rendered as an H2
+   * @variation secondary - If carousel is secondary, title is rendered as an H5
+   *
+   * @see {variant}
+   */
+  title?: ReactNode;
+  /**
+   * Link configuration for the title - when provided, title becomes clickable with hover underline
+   */
+  titleLink?: {
+    /** Accessible label for the title link */ariaLabel?: string; /** URL for the title link */
+    href: string; /** Click handler for the title link */
+    onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
+  };
+  /**
+   * If true, the carousel will use overlay controls to navigate to the next and previous pages.
+   *
+   * @default false
+   */
+  useOverlayControls?: boolean;
+  /**
+   * @variation {primary} - A primary carousel displays important content relevant to the page. Should only have one per page.
+   * @variation {secondary} - A secondary carousel display content of lesser importance to the user. Can have multiple per page.
+   *
+   * @default primary
+   */
+  variant?: 'primary' | 'secondary';
+};
+/**
+ * Displays a scrollable list of cards or elements horizontally.
+ * Allows navigation via buttons, dots (pagination), or touch gestures (on mobile).
+ */
+declare const Carousel: ({
+  action,
+  cardOffset,
+  cards,
+  fullPage,
+  goToPage,
+  onScroll,
+  providePageCount,
+  selectedPage,
+  shouldGoToPageBreakpointsOnScrolling,
+  showPagination,
+  subHeaderDescription,
+  subHeaderLeft,
+  title,
+  titleLink,
+  useOverlayControls,
+  variant
+}: Props) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { CarouselGoToPageDirection as a, CarouselCard as i, CAROUSEL_CARD_GAP_MOBILE_NUM as n, CarouselGoToPageInfo as o, CAROUSEL_CARD_GAP_NUM as r, CarouselPageInfo as s, Carousel as t };
+//# sourceMappingURL=index-NeSBj5ci.d.cts.map

package/index-NeSBj5ci.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-NeSBj5ci.d.cts","names":[],"sources":["../src/Carousel/Carousel.types.ts","../src/Carousel/Carousel.tsx"],"mappings":";;;KAEY,YAAA;;AAAZ;;EAII,IAAA,EAAM,SAAS;EAAA;;;EAIf,GAAA;AAAA;AAAA,KAGQ,gBAAA;EACR,WAAA;EACA,YAAA;EACA,aAAA;AAAA;AAAA,cAIS,qBAAA;AAAA,cACA,4BAAA;AAAA,aAED,yBAAA;EACR,QAAA;EACA,IAAI;AAAA;;;;AAL0B;AAClC;;KAaY,oBAAA;EAEF,eAAA,EAAiB,yBAAyB;EAC1C,kBAAA;AAAA;EAGA,eAAA;EACA,kBAAA;AAAA;;;KCRL,KAAA;ED/BO;;;;;;;;AAQL;ECiCH,MAAA;IACI,QAAA;IACA,OAAA,IAAW,KAAA,EAAO,UAAA,CAAW,iBAAA;IDhCT;;;ICoCpB,IAAA;IDjCS;AAAA;AAIjB;;;ICmCQ,IAAA;EAAA;EDlCK;;;;AAA4B;AAEzC;;;EC0CI,UAAA;EDxCI;AASR;;;;;;ECuCI,KAAA,EAAO,YAAA;EDjCD;;;AACkB;ECqCxB,QAAA;;;AArDsB;;;;;;;EA+DtB,QAAA,IAAY,YAAA,EAAc,oBAAA;EAsCM;;;EAlChC,QAAA,IAAY,iBAAA;EA+DoB;;;EA3DhC,gBAAA,IAAoB,aAAA;EAnDhB;;;EAuDJ,YAAA;EAnDI;;;;;;EA0DJ,oCAAA;EAnB0B;;;;;;;EA2B1B,cAAA;EACA,oBAAA;EAAA;;;EAIA,aAAA;IAEU,IAAA;MACI,SAAA;MACA,IAAA;MACA,KAAA;MACA,OAAA,IAAW,KAAA,EAAO,UAAA,CAAW,iBAAA;MAC7B,OAAA;IAAA;IAEJ,IAAA;EAAA;IAEF,IAAA;IAAc,IAAA;EAAA;EAkBtB;;;;;;;;;;AAoBO;AAOX;;EA/BI,KAAA,GAAQ,SAAA;EA+Ba;;;EA3BrB,SAAA;IA2BqB,0CAzBjB,SAAA,WAyBiB;IAvBjB,IAAA,UAuBiB;IArBjB,OAAA,IAAW,KAAA,EAAO,UAAA,CAAW,iBAAA;EAAA;EAqBZ;;;;;EAdrB,kBAAA;EA+BI;;;;;;EAxBJ,OAAA;AAAA;;;;;cAOS,QAAA;EAAY,MAAA;EAAA,UAAA;EAAA,KAAA;EAAA,QAAA;EAAA,QAAA;EAAA,QAAA;EAAA,gBAAA;EAAA,YAAA;EAAA,oCAAA;EAAA,cAAA;EAAA,oBAAA;EAAA,aAAA;EAAA,KAAA;EAAA,SAAA;EAAA,kBAAA;EAAA;AAAA,GAiBtB,KAAA,iCAAK,GAAA,CAAA,OAAA"}

package/index-NeSBj5ci.d.mts

@@ -0,0 +1,200 @@
+import { MouseEvent, ReactNode } from "react";
+
+//#region src/Carousel/Carousel.types.d.ts
+type CarouselCard = {
+  /**
+   * The rendered content of the card
+   */
+  card: ReactNode;
+  /**
+   * The unique identifier for the card
+   */
+  key: string;
+};
+type CarouselPageInfo = {
+  breakpoints: number[];
+  cardsPerPage: number;
+  numberOfPages: number;
+};
+declare const CAROUSEL_CARD_GAP_NUM = 24;
+declare const CAROUSEL_CARD_GAP_MOBILE_NUM = 16;
+declare enum CarouselGoToPageDirection {
+  Previous = -1,
+  Next = 1
+}
+/**
+ * Page navigation information based on the action the user took.
+ *
+ * @property {CarouselGoToPageDirection} buttonDirection - Populated if the user clicked the Next or Previous buttons
+ * @property {number} oneBasedPageNumber - The user navigated between cards by scrolling/dragging manually
+ */
+type CarouselGoToPageInfo = {
+  buttonDirection: CarouselGoToPageDirection;
+  oneBasedPageNumber?: never;
+} | {
+  buttonDirection?: never;
+  oneBasedPageNumber: number;
+};
+//#endregion
+//#region src/Carousel/Carousel.d.ts
+type Props = {
+  /**
+   * A Link element that a user can interact with.
+   * Usually, this will be something like a "View all" that links to a page with all the items that the carousel represents.
+   *
+   * It will appear on the right side, opposite of the title, if one exists
+   *
+   * @property {string} path - Where the user will be taken upon clicking the action
+   * @property {string} text="View All" - The text to be displayed in the action element
+   */
+  action?: {
+    hideIcon?: boolean;
+    onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
+    /**
+     * Where the user will be taken upon clicking the action
+     */
+    path: string;
+    /**
+     * The text to be displayed in the action element
+     *
+     * @default "View All"
+     */
+    text?: string;
+  };
+  /**
+   * If provided, the cards, barring the first card, will be offset so that some of the previous card will be shown on the left.
+   * This is best used for mobile carousels so that people can better see that they're in the middle of a carousel.
+   * It should be a positive number, representing a pixel amount.
+   * Gap size will be added to it, so make sure you aren't including it.
+   *
+   * @default 0
+   */
+  cardOffset?: number;
+  /**
+   * The scrollable content of the carousel.
+   * Should be individual elements, likes cards or images.
+   *
+   * @property {ReactNode} card - The rendered content
+   * @property {string} key - A unique identifier for the card
+   */
+  cards: CarouselCard[];
+  /**
+   * Are the cards taking up a full page of the carousel?
+   * This is used to use card counts to render the page-based sections of the carousel for SSR.
+   */
+  fullPage?: boolean;
+  /**
+   * Bring the slider to the selected page. Only one property will be defined, so components using this function should check
+   * which one is populated.
+   *
+   * @property {CarouselGoToPageDirection} buttonDirection - If populated, refers to which button was pressed: Previous or Next
+   * @property {number} oneBasedPageNumber - If populated, refers to which page the user is specifically going to
+   *
+   * @see CarouselGoToPageInfo
+   */
+  goToPage?: (goToPageInfo: CarouselGoToPageInfo) => void;
+  /**
+   * Callback triggered when the user scrolls through the carousel manually (either through mouse wheel or dragging)
+   */
+  onScroll?: (currentScrollPage: number) => void;
+  /**
+   * @returns The number of pages for the carousel
+   */
+  providePageCount?: (numberOfPages: number) => void;
+  /**
+   * The selected page to scroll to directly
+   */
+  selectedPage?: number;
+  /**
+   * If the user scrolls, they're automatically brought to a specific page breakpoint.
+   * Set this to `false` to avoid further scrolling after the user has stopped scrolling through the carousel.
+   *
+   * @default true
+   */
+  shouldGoToPageBreakpointsOnScrolling?: boolean;
+  /**
+   * Displays dots at the bottom of the carousel that represent a page of content.
+   * Clicking a dot will bring the user to the corresponding page.
+   * Mobile devices will NEVER show the page selector.
+   *
+   * @default false
+   */
+  showPagination?: boolean;
+  subHeaderDescription?: string;
+  /**
+   * Left side content for the carousel subheader - can be either a link or plain text.
+   */
+  subHeaderLeft?: {
+    link: {
+      ariaLabel?: string;
+      href: string;
+      label: string;
+      onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
+      variant?: 'default' | 'subtle';
+    };
+    type: 'link';
+  } | {
+    text: string;
+    type: 'text';
+  };
+  /**
+   * The title of the carousel, display above and to the left of the carousel.
+   * Even though it's a ReactNode, this is for formatMessage/other intl-based libraries
+   * to pass in populated values. You should pass in a value that is string-based, due
+   * to the carousel variant formatting the title as an h2 or h5.
+   *
+   * Optional.
+   *
+   * @variation primary - If carousel is primary, title is rendered as an H2
+   * @variation secondary - If carousel is secondary, title is rendered as an H5
+   *
+   * @see {variant}
+   */
+  title?: ReactNode;
+  /**
+   * Link configuration for the title - when provided, title becomes clickable with hover underline
+   */
+  titleLink?: {
+    /** Accessible label for the title link */ariaLabel?: string; /** URL for the title link */
+    href: string; /** Click handler for the title link */
+    onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
+  };
+  /**
+   * If true, the carousel will use overlay controls to navigate to the next and previous pages.
+   *
+   * @default false
+   */
+  useOverlayControls?: boolean;
+  /**
+   * @variation {primary} - A primary carousel displays important content relevant to the page. Should only have one per page.
+   * @variation {secondary} - A secondary carousel display content of lesser importance to the user. Can have multiple per page.
+   *
+   * @default primary
+   */
+  variant?: 'primary' | 'secondary';
+};
+/**
+ * Displays a scrollable list of cards or elements horizontally.
+ * Allows navigation via buttons, dots (pagination), or touch gestures (on mobile).
+ */
+declare const Carousel: ({
+  action,
+  cardOffset,
+  cards,
+  fullPage,
+  goToPage,
+  onScroll,
+  providePageCount,
+  selectedPage,
+  shouldGoToPageBreakpointsOnScrolling,
+  showPagination,
+  subHeaderDescription,
+  subHeaderLeft,
+  title,
+  titleLink,
+  useOverlayControls,
+  variant
+}: Props) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { CarouselGoToPageDirection as a, CarouselCard as i, CAROUSEL_CARD_GAP_MOBILE_NUM as n, CarouselGoToPageInfo as o, CAROUSEL_CARD_GAP_NUM as r, CarouselPageInfo as s, Carousel as t };
+//# sourceMappingURL=index-NeSBj5ci.d.mts.map

package/index-NeSBj5ci.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-NeSBj5ci.d.mts","names":[],"sources":["../src/Carousel/Carousel.types.ts","../src/Carousel/Carousel.tsx"],"mappings":";;;KAEY,YAAA;;AAAZ;;EAII,IAAA,EAAM,SAAS;EAAA;;;EAIf,GAAA;AAAA;AAAA,KAGQ,gBAAA;EACR,WAAA;EACA,YAAA;EACA,aAAA;AAAA;AAAA,cAIS,qBAAA;AAAA,cACA,4BAAA;AAAA,aAED,yBAAA;EACR,QAAA;EACA,IAAI;AAAA;;;;AAL0B;AAClC;;KAaY,oBAAA;EAEF,eAAA,EAAiB,yBAAyB;EAC1C,kBAAA;AAAA;EAGA,eAAA;EACA,kBAAA;AAAA;;;KCRL,KAAA;ED/BO;;;;;;;;AAQL;ECiCH,MAAA;IACI,QAAA;IACA,OAAA,IAAW,KAAA,EAAO,UAAA,CAAW,iBAAA;IDhCT;;;ICoCpB,IAAA;IDjCS;AAAA;AAIjB;;;ICmCQ,IAAA;EAAA;EDlCK;;;;AAA4B;AAEzC;;;EC0CI,UAAA;EDxCI;AASR;;;;;;ECuCI,KAAA,EAAO,YAAA;EDjCD;;;AACkB;ECqCxB,QAAA;;;AArDsB;;;;;;;EA+DtB,QAAA,IAAY,YAAA,EAAc,oBAAA;EAsCM;;;EAlChC,QAAA,IAAY,iBAAA;EA+DoB;;;EA3DhC,gBAAA,IAAoB,aAAA;EAnDhB;;;EAuDJ,YAAA;EAnDI;;;;;;EA0DJ,oCAAA;EAnB0B;;;;;;;EA2B1B,cAAA;EACA,oBAAA;EAAA;;;EAIA,aAAA;IAEU,IAAA;MACI,SAAA;MACA,IAAA;MACA,KAAA;MACA,OAAA,IAAW,KAAA,EAAO,UAAA,CAAW,iBAAA;MAC7B,OAAA;IAAA;IAEJ,IAAA;EAAA;IAEF,IAAA;IAAc,IAAA;EAAA;EAkBtB;;;;;;;;;;AAoBO;AAOX;;EA/BI,KAAA,GAAQ,SAAA;EA+Ba;;;EA3BrB,SAAA;IA2BqB,0CAzBjB,SAAA,WAyBiB;IAvBjB,IAAA,UAuBiB;IArBjB,OAAA,IAAW,KAAA,EAAO,UAAA,CAAW,iBAAA;EAAA;EAqBZ;;;;;EAdrB,kBAAA;EA+BI;;;;;;EAxBJ,OAAA;AAAA;;;;;cAOS,QAAA;EAAY,MAAA;EAAA,UAAA;EAAA,KAAA;EAAA,QAAA;EAAA,QAAA;EAAA,QAAA;EAAA,gBAAA;EAAA,YAAA;EAAA,oCAAA;EAAA,cAAA;EAAA,oBAAA;EAAA,aAAA;EAAA,KAAA;EAAA,SAAA;EAAA,kBAAA;EAAA;AAAA,GAiBtB,KAAA,iCAAK,GAAA,CAAA,OAAA"}