@arc-ui/components 12.0.0-alpha.0 → 12.0.0-beta.10

package/dist/types/components/Calendar/helpers/is-disabled-date.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/Calendar/helpers/is-month-after-max-date.d.ts

@@ -0,0 +1 @@
+export declare const isMonthAfterMaxDate: (date: Date, maxDate: Date) => boolean;

package/dist/types/components/Calendar/helpers/is-month-after-max-date.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/Calendar/helpers/is-month-before-min-date.d.ts

@@ -0,0 +1 @@
+export declare const isMonthBeforeMinDate: (month: Date, minDate: Date) => boolean;

package/dist/types/components/Calendar/helpers/is-month-before-min-date.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/Calendar/helpers/process-selected-range.d.ts

@@ -0,0 +1,9 @@
+import { RangeSelection } from "../types";
+export declare const processSelectedRange: ({ range, value, disabledDates, }: {
+    range: Date[];
+    value: Date;
+    disabledDates?: Date[] | undefined;
+}) => {
+    rangeValue: Date[];
+    rangeOnChangeValue: RangeSelection;
+};

package/dist/types/components/Calendar/helpers/process-selected-range.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/Calendar/index.d.ts

@@ -0,0 +1,2 @@
+export { Calendar } from "./Calendar";
+export { type RangeSelection as ArcCalendarRangeSelection, type SelectionType as ArcCalendarSelectionType, } from "./types";

package/dist/types/components/Calendar/state/handlers/calendar-keydown-handler.d.ts

@@ -0,0 +1,3 @@
+import { CALENDAR_KEYDOWN_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const calendarKeydownHandler: StateHandler<CALENDAR_KEYDOWN_ACTION>;

package/dist/types/components/Calendar/state/handlers/day-grid-leave-handler.d.ts

@@ -0,0 +1,3 @@
+import { DAY_GRID_LEAVE_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const dayGridLeaveHandler: StateHandler<DAY_GRID_LEAVE_ACTION>;

package/dist/types/components/Calendar/state/handlers/day-number-select-handler.d.ts

@@ -0,0 +1,3 @@
+import { DAY_NUMBER_SELECT_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const dayNumberSelectHandler: StateHandler<DAY_NUMBER_SELECT_ACTION>;

package/dist/types/components/Calendar/state/handlers/default-handler.d.ts

@@ -0,0 +1,2 @@
+import { State } from "../types/state";
+export declare const defaultHandler: (state: State) => State;

package/dist/types/components/Calendar/state/handlers/dropdown-change-month-handler.d.ts

@@ -0,0 +1,3 @@
+import { DROPDOWN_CHANGE_MONTH_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const dropDownChangeMonthHandler: StateHandler<DROPDOWN_CHANGE_MONTH_ACTION>;

package/dist/types/components/Calendar/state/handlers/dropdown-change-year-handler.d.ts

@@ -0,0 +1,3 @@
+import { DROPDOWN_CHANGE_YEAR_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const dropDownChangeYearHandler: StateHandler<DROPDOWN_CHANGE_YEAR_ACTION>;

package/dist/types/components/Calendar/state/handlers/highlight-range-handler.d.ts

@@ -0,0 +1,3 @@
+import { HIGHLIGHT_RANGE_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const highlightRangeHandler: StateHandler<HIGHLIGHT_RANGE_ACTION>;

package/dist/types/components/Calendar/state/handlers/index.d.ts

@@ -0,0 +1,12 @@
+export { showPreviousMonthHandler } from "./show-previous-month-handler";
+export { showNextMonthHandler } from "./show-next-month-handler";
+export { showPreviousDoubleMonthHandler } from "./show-previous-double-month-handler";
+export { showNextDoubleMonthHandler } from "./show-next-double-month-handler";
+export { rangeSelectHandler } from "./range-select-handler";
+export { highlightRangeHandler } from "./highlight-range-handler";
+export { dayNumberSelectHandler } from "./day-number-select-handler";
+export { dayGridLeaveHandler } from "./day-grid-leave-handler";
+export { dropDownChangeYearHandler } from "./dropdown-change-year-handler";
+export { dropDownChangeMonthHandler } from "./dropdown-change-month-handler";
+export { calendarKeydownHandler } from "./calendar-keydown-handler";
+export { defaultHandler } from "./default-handler";

package/dist/types/components/Calendar/state/handlers/range-select-handler.d.ts

@@ -0,0 +1,3 @@
+import { RANGE_SELECT_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const rangeSelectHandler: StateHandler<RANGE_SELECT_ACTION>;

package/dist/types/components/Calendar/state/handlers/show-next-double-month-handler.d.ts

@@ -0,0 +1,3 @@
+import { SHOW_NEXT_DOUBLE_MONTH_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const showNextDoubleMonthHandler: StateHandler<SHOW_NEXT_DOUBLE_MONTH_ACTION>;

package/dist/types/components/Calendar/state/handlers/show-next-month-handler.d.ts

@@ -0,0 +1,3 @@
+import { SHOW_NEXT_MONTH_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const showNextMonthHandler: StateHandler<SHOW_NEXT_MONTH_ACTION>;

package/dist/types/components/Calendar/state/handlers/show-previous-double-month-handler.d.ts

@@ -0,0 +1,3 @@
+import { SHOW_PREVIOUS_DOUBLE_MONTH_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const showPreviousDoubleMonthHandler: StateHandler<SHOW_PREVIOUS_DOUBLE_MONTH_ACTION>;

package/dist/types/components/Calendar/state/handlers/show-previous-month-handler.d.ts

@@ -0,0 +1,3 @@
+import { SHOW_PREVIOUS_MONTH_ACTION } from "../types/actions";
+import { StateHandler } from "../types/state-handler";
+export declare const showPreviousMonthHandler: StateHandler<SHOW_PREVIOUS_MONTH_ACTION>;

package/dist/types/components/Calendar/state/index.d.ts

@@ -0,0 +1,2 @@
+export { type Action } from "./types/actions";
+export { reducer } from "./reducer";

package/dist/types/components/Calendar/state/reducer.d.ts

@@ -0,0 +1,3 @@
+import { Action } from "./types/actions";
+import { State } from "./types/state";
+export declare const reducer: (state: State, action: Action) => State;

package/dist/types/components/Calendar/state/reducer.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/Calendar/state/types/actions.d.ts

@@ -0,0 +1,81 @@
+import { CalendarType, KeyNames, SelectionType } from "../../types";
+export type DAY_NUMBER_SELECT_ACTION = {
+    type: "DAY_NUMBER_SELECT";
+    payload: Date;
+};
+export type RANGE_SELECT_ACTION = {
+    type: "RANGE_SELECT";
+    payload: {
+        date: Date;
+        range: Date[];
+    };
+};
+export type SHOW_PREVIOUS_MONTH_ACTION = {
+    type: "SHOW_PREVIOUS_MONTH";
+    payload: {
+        minDate?: Date;
+    };
+};
+export type SHOW_NEXT_MONTH_ACTION = {
+    type: "SHOW_NEXT_MONTH";
+    payload: {
+        maxDate?: Date;
+    };
+};
+export type SHOW_PREVIOUS_DOUBLE_MONTH_ACTION = {
+    type: "SHOW_PREVIOUS_DOUBLE_MONTH";
+    payload: {
+        minDate?: Date;
+    };
+};
+export type SHOW_NEXT_DOUBLE_MONTH_ACTION = {
+    type: "SHOW_NEXT_DOUBLE_MONTH";
+    payload: {
+        maxDate?: Date;
+    };
+};
+export type DROPDOWN_CHANGE_YEAR_ACTION = {
+    type: "DROPDOWN_CHANGE_YEAR";
+    payload: {
+        year: number;
+        minDate?: Date;
+        maxDate?: Date;
+    };
+};
+export type DROPDOWN_CHANGE_MONTH_ACTION = {
+    type: "DROPDOWN_CHANGE_MONTH";
+    payload: {
+        month: number;
+        minDate?: Date;
+        maxDate?: Date;
+    };
+};
+export type HIGHLIGHT_RANGE_ACTION = {
+    type: "HIGHLIGHT_RANGE";
+    payload: {
+        date: Date;
+        range: Date[];
+        minDate?: Date;
+        maxDate?: Date;
+    };
+};
+export type DAY_GRID_LEAVE_ACTION = {
+    type: "DAY_GRID_LEAVE";
+    payload: {
+        range: Date[];
+        selectionType: SelectionType;
+    };
+};
+export type CALENDAR_KEYDOWN_ACTION = {
+    type: "CALENDAR_KEYDOWN";
+    payload: {
+        minDate?: Date;
+        maxDate?: Date;
+        range: Date[];
+        selectionType: SelectionType;
+        calendarType: CalendarType;
+        key: KeyNames;
+        shiftKey: boolean;
+    };
+};
+export type Action = DAY_NUMBER_SELECT_ACTION | RANGE_SELECT_ACTION | SHOW_PREVIOUS_MONTH_ACTION | SHOW_NEXT_MONTH_ACTION | SHOW_PREVIOUS_DOUBLE_MONTH_ACTION | SHOW_NEXT_DOUBLE_MONTH_ACTION | DROPDOWN_CHANGE_YEAR_ACTION | DROPDOWN_CHANGE_MONTH_ACTION | HIGHLIGHT_RANGE_ACTION | DAY_GRID_LEAVE_ACTION | CALENDAR_KEYDOWN_ACTION;

package/dist/types/components/Calendar/state/types/state-handler.d.ts

@@ -0,0 +1,3 @@
+import { Action } from "../types/actions";
+import { State } from "../types/state";
+export type StateHandler<T extends Action> = (payload: T["payload"], state: State) => State;

package/dist/types/components/Calendar/state/types/state.d.ts

@@ -0,0 +1,5 @@
+export interface State {
+    displayDate: Date;
+    focusDate: Date;
+    highlightedRange: Date[];
+}

package/dist/types/components/Calendar/types/calendar-type.d.ts

@@ -0,0 +1 @@
+export type CalendarType = "month" | "year" | "double";

package/dist/types/components/Calendar/types/date-select-value.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export type DateSelectValue = React.SelectHTMLAttributes<HTMLSelectElement>["value"];

package/dist/types/components/Calendar/types/index.d.ts

@@ -0,0 +1,6 @@
+export { WeekDays, WeekDaysAbbr } from "./week-days";
+export { KeyNames } from "./key-names";
+export { type RangeSelection } from "./range-selection";
+export { type SelectionType } from "./selection-type";
+export { type DateSelectValue } from "./date-select-value";
+export { type CalendarType } from "./calendar-type";

package/dist/types/components/Calendar/types/key-names.d.ts

@@ -0,0 +1,13 @@
+export declare enum KeyNames {
+    ArrowUp = "ArrowUp",
+    ArrowDown = "ArrowDown",
+    ArrowLeft = "ArrowLeft",
+    ArrowRight = "ArrowRight",
+    Home = "Home",
+    End = "End",
+    PageUp = "PageUp",
+    PageDown = "PageDown",
+    Tab = "Tab",
+    Enter = "Enter",
+    Space = " "
+}

package/dist/types/components/Calendar/types/range-selection.d.ts

@@ -0,0 +1,10 @@
+export interface RangeSelection {
+    dates: {
+        disabled: boolean;
+        value: Date;
+    }[];
+    selectedDate: Date;
+    isSelectionComplete: boolean;
+    start: Date;
+    end: Date;
+}

package/dist/types/components/Calendar/types/selection-type.d.ts

@@ -0,0 +1 @@
+export type SelectionType = "single" | "range";

package/dist/types/components/Calendar/types/week-days.d.ts

@@ -0,0 +1,18 @@
+export declare enum WeekDaysAbbr {
+    MON = "Mon",
+    TUE = "Tue",
+    WED = "Wed",
+    THUR = "Thur",
+    FRI = "Fri",
+    SAT = "Sat",
+    SUN = "Sun"
+}
+export declare enum WeekDays {
+    MONDAY = "Monday",
+    TUESDAY = "Tuesday",
+    WEDNESDAY = "Wednesday",
+    THURSDAY = "Thursday",
+    FRIDAY = "Friday",
+    SATURDAY = "Saturday",
+    SUNDAY = "Sunday"
+}

package/dist/types/components/CardFooter/CardFooter.d.ts

@@ -0,0 +1,11 @@
+import { FC } from "react";
+export declare const CardFooter: FC<CardFooterProps>;
+type CardFooterIcon = "play" | "arrow";
+export interface CardFooterProps {
+    metaText?: string | Date;
+    isDarkPathway?: boolean;
+    buttonIcon?: CardFooterIcon;
+    showButton?: boolean;
+    isHovered?: boolean;
+}
+export {};

package/dist/types/components/CardFooter/index.d.ts

@@ -0,0 +1 @@
+export { CardFooter, type CardFooterProps } from "./CardFooter";

package/dist/types/components/CardHeading/CardHeading.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import { type HeadingLevel, type HeadingSize } from "../../components/Heading/Heading";
+export declare const CardHeading: React.FC<CardHeadingProps>;
+export type CardHeadingSize = Extract<HeadingSize, "m" | "l">;
+interface CardHeadingProps {
+    heading: string;
+    size?: CardHeadingSize;
+    href?: string;
+    headingLevel?: HeadingLevel;
+    onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    linkData?: {
+        [key: string]: string;
+    };
+}
+export {};

package/dist/types/components/CardHeading/index.d.ts

@@ -0,0 +1 @@
+export { CardHeading, type CardHeadingSize } from "./CardHeading";

package/dist/types/components/Carousel/Carousel.d.ts

@@ -0,0 +1,34 @@
+import React from "react";
+import { type Responsive } from "./types/responsive";
+export declare const Carousel: React.FC<CarouselProps>;
+interface CarouselProps {
+    /**
+     * Adds a gap between the slides.
+     */
+    withGutter?: boolean;
+    /**
+     * How many slides to scroll on each navigation.
+     */
+    itemsToScroll?: number;
+    /**
+     * How many items to show for each slide.
+     */
+    itemsPerSlide?: number;
+    /**
+     * Shows some of the first item in the next slide if true.
+     */
+    isPartialVisible?: boolean;
+    /**
+     * Allows the carousel to scroll infinitely.
+     */
+    loop?: boolean;
+    /**
+     * Configure the carousel options for different breakpoints.
+     */
+    responsive?: Responsive;
+    /**
+     * items for the carousel.
+     */
+    children: React.ReactNode;
+}
+export {};

package/dist/types/components/Carousel/components/DotButton.d.ts

@@ -0,0 +1,10 @@
+import React, { type KeyboardEvent } from "react";
+export declare const DotButton: React.FC<DotButtonProps>;
+interface DotButtonProps {
+    onKeyDown: (scrollSnapIndex: number) => (e: KeyboardEvent<HTMLButtonElement>) => void;
+    onClick: (scrollSnapIndex: number) => void;
+    visibleSlideIndex: number;
+    scrollSnapIndex: number;
+    focusIndex?: number;
+}
+export {};

package/dist/types/components/Carousel/constants/breakpoints.d.ts

@@ -0,0 +1,5 @@
+export declare const XS_BREAKPOINT: string;
+export declare const S_BREAKPOINT: string;
+export declare const M_BREAKPOINT: string;
+export declare const L_BREAKPOINT: string;
+export declare const XL_BREAKPOINT: string;

package/dist/types/components/Carousel/helpers/get-options.d.ts

@@ -0,0 +1,3 @@
+import { type EmblaOptionsType } from "embla-carousel";
+import { type Responsive } from "../types/responsive";
+export declare const getOptions: (itemsToScroll: number, loop: boolean, responsive?: Responsive) => EmblaOptionsType;

package/dist/types/components/Carousel/helpers/get-slide-width.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { type Responsive } from "../types/responsive";
+import { type ScreenSizes } from "../types/screen-sizes";
+export declare const getSlideWidth: ({ screenSizes, itemsPerSlide, isPartialVisible, responsive, children, }: getSlideWidthParams) => number;
+interface getSlideWidthParams {
+    itemsPerSlide: number;
+    isPartialVisible: boolean;
+    screenSizes: ScreenSizes;
+    responsive?: Responsive;
+    children: React.ReactNode;
+}
+export {};

package/dist/types/components/Carousel/index.d.ts

@@ -0,0 +1 @@
+export { Carousel } from "./Carousel";

package/dist/types/components/Carousel/types/breakpoints.d.ts

@@ -0,0 +1 @@
+export type BreakPoints = "xs" | "s" | "m" | "l" | "xl";

package/dist/types/components/Carousel/types/keynames.d.ts

@@ -0,0 +1,5 @@
+export declare enum KeyNames {
+    ArrowLeft = "ArrowLeft",
+    ArrowRight = "ArrowRight",
+    Escape = "Escape"
+}

package/dist/types/components/Carousel/types/responsive.d.ts

@@ -0,0 +1,3 @@
+import { type BreakPoints } from "./breakpoints";
+import { type SlideConfig } from "./slide-config";
+export type Responsive = Partial<Record<BreakPoints, SlideConfig>>;

package/dist/types/components/Carousel/types/screen-sizes.d.ts

@@ -0,0 +1,2 @@
+import { BreakPoints } from "./breakpoints";
+export type ScreenSizes = Record<BreakPoints, boolean>;

package/dist/types/components/Carousel/types/slide-config.d.ts

@@ -0,0 +1,5 @@
+export interface SlideConfig {
+    itemsToScroll?: number;
+    itemsPerSlide?: number;
+    isPartialVisible?: boolean;
+}

package/dist/types/components/Checkbox/Checkbox.d.ts

@@ -1,9 +1,9 @@
-import React from "react";
+import React, { FC } from "react";
 type EventType = React.ChangeEvent<HTMLInputElement>;
 /**
  *  Use `Checkbox` to allow users to select individual options.
  */
-export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export declare const Checkbox: FC<CheckboxProps>;
 export interface CheckboxProps {
     /**
      * Error message for the Checkbox.
@@ -14,8 +14,7 @@ export interface CheckboxProps {
      */
     helper?: React.ReactNode;
     /**
-     * Determine the alignment the Checkbox.
-     *
+     * Determine the alignment of the Checkbox.
      */
     checkboxAlignment?: "top" | "center";
     /**
@@ -38,6 +37,10 @@ export interface CheckboxProps {
      * Label for the Checkbox.
      */
     label: React.ReactNode;
+    /**
+     * Use `hideLabel` to visually hide the `Checkbox` label. This still allows screen readers to have access to labels. This is set to `false` by default.
+     */
+    hideLabel?: boolean;
     /**
      * Name for the Checkbox.
      */
@@ -54,7 +57,7 @@ export interface CheckboxProps {
     /**
      * Size of the Checkbox.
      */
-    size?: "s" | "l";
+    size?: "s" | "m";
     /**
      * Value for the Checkbox.
      */

package/dist/types/components/ConditionalWrapper/ConditionalWrapper.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+export declare const ConditionalWrapper: React.FC<{
+    condition: boolean;
+    wrapper: (children: React.ReactNode) => React.ReactNode;
+    fallback?: (children: React.ReactNode) => React.ReactNode;
+    children: React.ReactNode;
+}>;

package/dist/types/components/ConditionalWrapper/index.d.ts

@@ -0,0 +1 @@
+export { ConditionalWrapper } from "./ConditionalWrapper";

package/dist/types/components/ContentSwitcher/ContentSwitcher.d.ts

@@ -0,0 +1,32 @@
+import { FC, ReactNode } from "react";
+import { ContentSwitcherTab } from "./ContentSwitcherTab";
+import { ContentSwitcherContent } from "./ContentSwitcherContent";
+import { ContentSwitcherList } from "./ContentSwitcherList";
+/** Use `ContentSwitcher` to allow users to navigate between different sections of relevant content. */
+export declare const ContentSwitcher: FC<ContentSwitcherProps> & {
+    Tab: typeof ContentSwitcherTab;
+    Content: typeof ContentSwitcherContent;
+    List: typeof ContentSwitcherList;
+};
+export interface ContentSwitcherProps {
+    /**
+     * Render children
+     */
+    children: ReactNode;
+    /**
+     * Default to an inital value of a tab. If this is left blank it is possible for there to be no active tabs
+     */
+    defaultValue?: string;
+    /**
+     * Event handler called when the value changes.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * When automatic, tabs are activated when receiving focus. When manual, tabs are activated when clicked.
+     */
+    activationMode?: "automatic" | "manual";
+    /**
+     * value for the `ContentSwitcher`. Passing a value makes the Select a controlled component.
+     */
+    value?: string;
+}

package/dist/types/components/ContentSwitcher/ContentSwitcherContent/ContentSwitcherContent.d.ts

@@ -0,0 +1,12 @@
+import { FC, ReactNode } from "react";
+export declare const ContentSwitcherContent: FC<ContentSwitcherContentProps>;
+export interface ContentSwitcherContentProps {
+    /**
+     * Content to display
+     */
+    children: ReactNode;
+    /**
+     * This value links the `ContentSwitcherContent` with `ContentSwitcherTab`
+     */
+    value: string;
+}

package/dist/types/components/ContentSwitcher/ContentSwitcherContent/index.d.ts

@@ -0,0 +1 @@
+export { ContentSwitcherContent } from "./ContentSwitcherContent";

package/dist/types/components/ContentSwitcher/ContentSwitcherList/ContentSwitcherList.d.ts

@@ -0,0 +1,24 @@
+import { FC, ReactNode } from "react";
+export declare const ContentSwitcherList: FC<ContentSwitcherListProps>;
+export interface ContentSwitcherListProps {
+    /**
+     * Contents of the `ContentSwitcherList` Should contain `Tab`
+     */
+    children: ReactNode;
+    /**
+     * Determine if `ContentSwitcherList` should be justified
+     */
+    isJustified?: boolean;
+    /**
+     * Determine the type of `ContentSwitcherList`. Default is standard
+     */
+    type?: "standard" | "contained";
+    /**
+     * Determine a accessible label for `ContentSwitcherList`
+     */
+    ariaLabel?: string;
+    /**
+     * Determines if the `ContentSwitcherList` should be inset within the content panel.
+     */
+    isInset?: boolean;
+}

package/dist/types/components/ContentSwitcher/ContentSwitcherList/index.d.ts

@@ -0,0 +1 @@
+export { ContentSwitcherList } from "./ContentSwitcherList";

package/dist/types/components/ContentSwitcher/ContentSwitcherTab/ContentSwitcherTab.d.ts

@@ -0,0 +1,17 @@
+import { FC } from "react";
+export declare const ContentSwitcherTab: FC<ContentSwitcherTabProps>;
+interface ContentSwitcherTabProps {
+    /**
+     * Label to display on the ContentSwitcherTab
+     */
+    label: string;
+    /**
+     * Value to link `ContentSwitcherTab` to `ContentSwitcherTabContent`
+     */
+    value: string;
+    /**
+     * Pass a function to `ContentSwitcherTab`
+     */
+    onClick?: () => void;
+}
+export {};

package/dist/types/components/ContentSwitcher/ContentSwitcherTab/index.d.ts

@@ -0,0 +1 @@
+export { ContentSwitcherTab } from "./ContentSwitcherTab";

package/dist/types/components/ContentSwitcher/index.d.ts

@@ -0,0 +1 @@
+export { ContentSwitcher } from "./ContentSwitcher";

package/dist/types/components/ContentSwitcherDropdown/ContentSwitcherDropdown.d.ts

@@ -0,0 +1,57 @@
+import { FC, ReactNode } from "react";
+export declare const ContentSwitcherDropdown: FC<ContentSwitcherDropdownProps> & {
+    Content: typeof ContentSwitcherDropdownContent;
+};
+declare const ContentSwitcherDropdownContent: FC<ContentSwitcherDropdownContentProps>;
+export interface ContentSwitcherDropdownContentProps {
+    /**
+     * Content to display
+     */
+    children: ReactNode;
+    /**
+     * This value links the `ContentSwitcherDropdown.Content` with `ContentSwitcherDropdown` property `Tabs`
+     */
+    value: string;
+}
+export interface ContentSwitcherDropdownProps {
+    /**
+     * Render children
+     */
+    children?: ReactNode;
+    /**
+     * Default to an inital value of a tab. If this is not set default to first tab.
+     */
+    defaultValue?: string;
+    /**
+     * Event handler called when the value changes. This can only be active when child elements are not present
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Determine what tabs to render. They need both a `value` and `label` prop
+     */
+    tabs: {
+        value: string;
+        label: string;
+    }[];
+    /**
+     * Determines if the `ContentSwitcherDropdown` should be inset within the content panel.
+     */
+    isInset?: boolean;
+    /**
+     * value for the `ContentSwitcherDropdown`. Passing a value makes the Select a controlled component.
+     */
+    value?: string;
+    /**
+     * Aria label for the `ContentSwitcherDropdown`.
+     */
+    ariaLabel?: string;
+    /**
+     * Sets the `ContentSwitcherDropdown` to 100% width.
+     */
+    isFluid?: boolean;
+    /**
+     * Sets the width of the `ContentSwitcherDropdown`.
+     */
+    width?: string;
+}
+export {};