@hero-design/rn 8.82.0-alpha.0 → 8.82.0

package/types/theme/components/toolbar.d.ts

@@ -0,0 +1,47 @@
+import type { GlobalTheme } from '../global';
+declare const getToolbarTheme: (theme: GlobalTheme) => {
+    colors: {
+        background: string;
+        border: string;
+        primary: string;
+        secondary: string;
+        info: string;
+        success: string;
+        danger: string;
+        error: string;
+        disabled: string;
+        iconButtonBackground: string;
+        inputContainerBackground: string;
+    };
+    space: {
+        verticalPadding: number;
+        horizontalPadding: number;
+        iconButtonLabelMarginLeft: number;
+        iconButtonWrapperPadding: number;
+        messageWrapperMarginHorizontal: number;
+        messageWrapperPaddingVertical: number;
+        messageWrapperPaddingHorizontal: number;
+        messageInputPaddingHorizontal: number;
+        messageInputPaddingVertical: number;
+        affixInnerMargin: number;
+    };
+    borderWidths: {
+        default: number;
+    };
+    sizes: {
+        itemWrapperHeight: number;
+        messageWrapperHeight: number;
+        messageInputHeight: number;
+    };
+    radii: {
+        iconButtonWrapperBorderRadius: number;
+        messageContainer: number;
+    };
+    fontSizes: {
+        text: number;
+    };
+    fonts: {
+        text: string;
+    };
+};
+export default getToolbarTheme;

package/types/theme/components/typography.d.ts

@@ -0,0 +1,165 @@
+import type { GlobalTheme } from '../global';
+declare const getTypographyTheme: (theme: GlobalTheme) => {
+    colors: {
+        body: string;
+        subdued: string;
+        primary: string;
+        secondary: string;
+        info: string;
+        danger: string;
+        warning: string;
+        success: string;
+        inverted: string;
+        archived: string;
+        disabled: string;
+        muted: string;
+    };
+    fonts: import("../global/typography").Fonts;
+    fontSizes: {
+        xsmall: number;
+        small: number;
+        medium: number;
+        large: number;
+        xlarge: number;
+        xxxlarge: number;
+        xxxxlarge: number;
+        xxxxxlarge: number;
+        '6xlarge': number;
+        '7xlarge': number;
+        caption: number;
+        label: number;
+        titles: {
+            neutral: {
+                h1: number;
+                h2: number;
+                h3: number;
+                h4: number;
+                h5: number;
+                h6: number;
+            };
+            playful: {
+                h1: number;
+                h2: number;
+                h3: number;
+                h4: number;
+                h5: number;
+                h6: number;
+            };
+        };
+        body: {
+            neutral: {
+                regular: number;
+                small: number;
+            };
+            playful: {
+                regular: number;
+                small: number;
+            };
+        };
+    };
+    lineHeights: {
+        xsmall: number;
+        small: number;
+        medium: number;
+        large: number;
+        xlarge: number;
+        xxxlarge: number;
+        xxxxlarge: number;
+        xxxxxlarge: number;
+        '6xlarge': number;
+        '7xlarge': number;
+        caption: number;
+        label: number;
+        titles: {
+            neutral: {
+                h1: number;
+                h2: number;
+                h3: number;
+                h4: number;
+                h5: number;
+                h6: number;
+            };
+            playful: {
+                h1: number;
+                h2: number;
+                h3: number;
+                h4: number;
+                h5: number;
+                h6: number;
+            };
+        };
+        body: {
+            neutral: {
+                regular: number;
+                small: number;
+            };
+            playful: {
+                regular: number;
+                small: number;
+            };
+        };
+    };
+    letterSpacings: {
+        titles: {
+            neutral: {
+                h1: number;
+                h2: number;
+                h3: number;
+                h4: number;
+                h5: number;
+                h6: number;
+            };
+            playful: {
+                h1: number;
+                h2: number;
+                h3: number;
+                h4: number;
+                h5: number;
+                h6: number;
+            };
+        };
+        body: {
+            neutral: {
+                semiBold: number;
+                regular: number;
+                small: number;
+            };
+            playful: {
+                semiBold: number;
+                regular: number;
+                small: number;
+            };
+        };
+    };
+    fontWeights: {
+        titles: {
+            neutral: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+            };
+            playful: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+            };
+        };
+        body: {
+            neutral: {
+                semiBold: string;
+                regular: string;
+            };
+            playful: {
+                semiBold: string;
+                regular: string;
+            };
+        };
+    };
+};
+export default getTypographyTheme;

package/types/theme/getTheme.d.ts

@@ -0,0 +1,106 @@
+import getAccordionTheme from './components/accordion';
+import getAlertTheme from './components/alert';
+import getAttachmentTheme from './components/attachment';
+import getAvatarTheme from './components/avatar';
+import { BadgeThemeType } from './components/badge';
+import getBottomNavigationTheme from './components/bottomNavigation';
+import getBottomSheetTheme from './components/bottomSheet';
+import { ButtonThemeType } from './components/button';
+import getCalendarTheme from './components/calendar';
+import getCardTheme from './components/card';
+import { CarouselThemeType } from './components/carousel';
+import getCardCarouselTheme from './components/cardCarousel';
+import getCheckboxTheme from './components/checkbox';
+import getChipTheme from './components/chip';
+import getContentNavigatorTheme from './components/contentNavigator';
+import getDatePickerTheme from './components/datePicker';
+import getDividerTheme from './components/divider';
+import getDrawerTheme from './components/drawer';
+import { EmptyThemeType } from './components/empty';
+import { ErrorThemeType } from './components/error';
+import { FABThemeType } from './components/fab';
+import getIconTheme from './components/icon';
+import getImageTheme from './components/image';
+import getListTheme from './components/list';
+import getPageControlTheme from './components/pageControl';
+import { PinInputThemeType } from './components/pinInput';
+import getProgressTheme from './components/progress';
+import getRadioTheme from './components/radio';
+import getRateTheme from './components/rate';
+import getRefreshControlTheme from './components/refreshControl';
+import getRichTextEditorTheme from './components/richTextEditor';
+import getSectionHeadingTheme from './components/sectionHeading';
+import getSelectTheme from './components/select';
+import getSkeletonTheme from './components/skeleton';
+import getSliderTheme from './components/slider';
+import getSpinnerTheme from './components/spinner';
+import { SuccessThemeType } from './components/success';
+import getSwipeableTheme from './components/swipeable';
+import getSwitchTheme from './components/switch';
+import getTabsTheme from './components/tabs';
+import { TagThemeType } from './components/tag';
+import getTextInputTheme from './components/textInput';
+import getTimePickerTheme from './components/timePicker';
+import getToastTheme from './components/toast';
+import getToolbarTheme from './components/toolbar';
+import getTypographyTheme from './components/typography';
+import type { GlobalTheme, Scale, SystemPalette } from './global';
+import getSearchTheme from './components/search';
+import getMapPinTheme from './components/mapPin';
+import getFloatingIslandTheme from './components/floatingIsland';
+declare type Theme = GlobalTheme & {
+    __hd__: {
+        accordion: ReturnType<typeof getAccordionTheme>;
+        alert: ReturnType<typeof getAlertTheme>;
+        attachment: ReturnType<typeof getAttachmentTheme>;
+        avatar: ReturnType<typeof getAvatarTheme>;
+        badge: BadgeThemeType;
+        bottomNavigation: ReturnType<typeof getBottomNavigationTheme>;
+        bottomSheet: ReturnType<typeof getBottomSheetTheme>;
+        button: ButtonThemeType;
+        calendar: ReturnType<typeof getCalendarTheme>;
+        card: ReturnType<typeof getCardTheme>;
+        carousel: CarouselThemeType;
+        cardCarousel: ReturnType<typeof getCardCarouselTheme>;
+        checkbox: ReturnType<typeof getCheckboxTheme>;
+        chip: ReturnType<typeof getChipTheme>;
+        contentNavigator: ReturnType<typeof getContentNavigatorTheme>;
+        datePicker: ReturnType<typeof getDatePickerTheme>;
+        divider: ReturnType<typeof getDividerTheme>;
+        drawer: ReturnType<typeof getDrawerTheme>;
+        empty: EmptyThemeType;
+        error: ErrorThemeType;
+        fab: FABThemeType;
+        icon: ReturnType<typeof getIconTheme>;
+        image: ReturnType<typeof getImageTheme>;
+        list: ReturnType<typeof getListTheme>;
+        mapPin: ReturnType<typeof getMapPinTheme>;
+        pageControl: ReturnType<typeof getPageControlTheme>;
+        pinInput: PinInputThemeType;
+        progress: ReturnType<typeof getProgressTheme>;
+        radio: ReturnType<typeof getRadioTheme>;
+        rate: ReturnType<typeof getRateTheme>;
+        refreshControl: ReturnType<typeof getRefreshControlTheme>;
+        richTextEditor: ReturnType<typeof getRichTextEditorTheme>;
+        search: ReturnType<typeof getSearchTheme>;
+        sectionHeading: ReturnType<typeof getSectionHeadingTheme>;
+        select: ReturnType<typeof getSelectTheme>;
+        skeleton: ReturnType<typeof getSkeletonTheme>;
+        slider: ReturnType<typeof getSliderTheme>;
+        spinner: ReturnType<typeof getSpinnerTheme>;
+        success: SuccessThemeType;
+        swipeable: ReturnType<typeof getSwipeableTheme>;
+        switch: ReturnType<typeof getSwitchTheme>;
+        tabs: ReturnType<typeof getTabsTheme>;
+        tag: TagThemeType;
+        textInput: ReturnType<typeof getTextInputTheme>;
+        timePicker: ReturnType<typeof getTimePickerTheme>;
+        toast: ReturnType<typeof getToastTheme>;
+        toolbar: ReturnType<typeof getToolbarTheme>;
+        typography: ReturnType<typeof getTypographyTheme>;
+        floatingIsland: ReturnType<typeof getFloatingIslandTheme>;
+    };
+};
+declare const getTheme: (scale?: Scale, systemPallete?: SystemPalette) => Theme;
+export default getTheme;
+export type { Theme };

package/types/theme/global/borders.d.ts

@@ -0,0 +1,18 @@
+interface BorderWidths {
+    base: number;
+    medium: number;
+}
+interface Radii {
+    rounded: number;
+    base: number;
+    medium: number;
+    large: number;
+    xlarge: number;
+    xxlarge: number;
+    xxxlarge: number;
+    '5xlarge': number;
+}
+declare const getBorderWidths: (baseBorderWidth: number) => BorderWidths;
+declare const getRadii: (baseRadius: number) => Radii;
+export { getBorderWidths, getRadii };
+export type { BorderWidths, Radii };

package/types/theme/global/colors/eBens.d.ts

@@ -0,0 +1,3 @@
+import type { SystemPalette } from './types';
+declare const eBensSystemPalette: SystemPalette;
+export default eBensSystemPalette;

package/types/theme/global/colors/global.d.ts

@@ -0,0 +1,3 @@
+import type { GlobalSystemPalette } from './types';
+declare const globalPalette: GlobalSystemPalette;
+export default globalPalette;

package/types/theme/global/colors/globalDark.d.ts

@@ -0,0 +1,3 @@
+import type { GlobalSystemPalette } from './types';
+declare const globalPalette: GlobalSystemPalette;
+export default globalPalette;

package/types/theme/global/colors/jobs.d.ts

@@ -0,0 +1,3 @@
+import type { SystemPalette } from './types';
+declare const jobsSystemPalette: SystemPalette;
+export default jobsSystemPalette;

package/types/theme/global/colors/swag.d.ts

@@ -0,0 +1,3 @@
+import type { SystemPalette } from './types';
+declare const swagSystemPalette: SystemPalette;
+export default swagSystemPalette;

package/types/theme/global/colors/swagDark.d.ts

@@ -0,0 +1,3 @@
+import type { SystemPalette } from './types';
+declare const swagDarkSystemPalette: SystemPalette;
+export default swagDarkSystemPalette;

package/types/theme/global/colors/swagLight.d.ts

@@ -0,0 +1,3 @@
+import type { SystemPalette } from './types';
+declare const swagSystemPalette: SystemPalette;
+export default swagSystemPalette;

package/types/theme/global/colors/swagLightGlobal.d.ts

@@ -0,0 +1,3 @@
+import type { GlobalSystemPalette } from './types';
+declare const swagLightGlobalPalette: GlobalSystemPalette;
+export default swagLightGlobalPalette;

package/types/theme/global/colors/swagLightJobs.d.ts

@@ -0,0 +1,48 @@
+declare const swagLightJobsSystemPalette: {
+    secondary: string;
+    onSecondary: string;
+    secondaryHighlightedSurface: string;
+    decorativeSecondary: string;
+    decorativeSecondarySurface: string;
+    defaultGlobalSurface: string;
+    onDefaultGlobalSurface: string;
+    neutralGlobalSurface: string;
+    mutedOnDefaultGlobalSurface: string;
+    inactiveOnDefaultGlobalSurface: string;
+    disabledOnDefaultGlobalSurface: string;
+    darkGlobalSurface: string;
+    onDarkGlobalSurface: string;
+    overlayGlobalSurface: string;
+    primaryOutline: string;
+    secondaryOutline: string;
+    inactiveOutline: string;
+    disabledOutline: string;
+    error: string;
+    mutedError: string;
+    errorSurface: string;
+    onErrorSurface: string;
+    warning: string;
+    mutedWarning: string;
+    warningSurface: string;
+    onWarningSurface: string;
+    success: string;
+    mutedSuccess: string;
+    successSurface: string;
+    onSuccessSurface: string;
+    info: string;
+    mutedInfo: string;
+    infoSurface: string;
+    onInfoSurface: string;
+    archived: string;
+    mutedArchived: string;
+    archivedSurface: string;
+    onArchivedSurface: string;
+    primary: string;
+    onPrimary: string;
+    defaultSurface: string;
+    highlightedSurface: string;
+    pressedSurface: string;
+    decorativePrimary: string;
+    decorativePrimarySurface: string;
+};
+export default swagLightJobsSystemPalette;

package/types/theme/global/colors/types.d.ts

@@ -0,0 +1,50 @@
+export declare type GlobalSystemPalette = {
+    defaultGlobalSurface: string;
+    onDefaultGlobalSurface: string;
+    neutralGlobalSurface: string;
+    mutedOnDefaultGlobalSurface: string;
+    inactiveOnDefaultGlobalSurface: string;
+    disabledOnDefaultGlobalSurface: string;
+    darkGlobalSurface: string;
+    onDarkGlobalSurface: string;
+    overlayGlobalSurface: string;
+    primaryOutline: string;
+    secondaryOutline: string;
+    inactiveOutline: string;
+    disabledOutline: string;
+    error: string;
+    mutedError: string;
+    errorSurface: string;
+    onErrorSurface: string;
+    warning: string;
+    mutedWarning: string;
+    warningSurface: string;
+    onWarningSurface: string;
+    success: string;
+    mutedSuccess: string;
+    successSurface: string;
+    onSuccessSurface: string;
+    info: string;
+    mutedInfo: string;
+    infoSurface: string;
+    onInfoSurface: string;
+    archived: string;
+    mutedArchived: string;
+    archivedSurface: string;
+    onArchivedSurface: string;
+};
+export declare type BrandSystemPalette = {
+    primary: string;
+    onPrimary: string;
+    secondary: string;
+    onSecondary: string;
+    defaultSurface: string;
+    highlightedSurface: string;
+    secondaryHighlightedSurface?: string;
+    pressedSurface: string;
+    decorativePrimary: string;
+    decorativePrimarySurface: string;
+    decorativeSecondary?: string;
+    decorativeSecondarySurface?: string;
+};
+export declare type SystemPalette = GlobalSystemPalette & BrandSystemPalette;

package/types/theme/global/colors/wallet.d.ts

@@ -0,0 +1,3 @@
+import type { SystemPalette } from './types';
+declare const walletSystemPalette: SystemPalette;
+export default walletSystemPalette;

package/types/theme/global/colors/work.d.ts

@@ -0,0 +1,3 @@
+import type { SystemPalette } from './types';
+declare const workSystemPalette: SystemPalette;
+export default workSystemPalette;

package/types/theme/global/index.d.ts

@@ -0,0 +1,82 @@
+import { scale as defaultScale } from './scale';
+import swagSystemPalette from './colors/swag';
+import swagDarkSystemPalette from './colors/swagDark';
+import swagLightSystemPalette from './colors/swagLight';
+import swagLightJobsSystemPalette from './colors/swagLightJobs';
+import workSystemPalette from './colors/work';
+import jobsSystemPalette from './colors/jobs';
+import walletSystemPalette from './colors/wallet';
+import eBensSystemPalette from './colors/eBens';
+import type { Scale } from './scale';
+import type { SystemPalette } from './colors/types';
+declare const getGlobalTheme: (scale: Scale, systemPalette: SystemPalette) => {
+    colors: {
+        defaultGlobalSurface: string;
+        onDefaultGlobalSurface: string;
+        neutralGlobalSurface: string;
+        mutedOnDefaultGlobalSurface: string;
+        inactiveOnDefaultGlobalSurface: string;
+        disabledOnDefaultGlobalSurface: string;
+        darkGlobalSurface: string;
+        onDarkGlobalSurface: string;
+        overlayGlobalSurface: string;
+        primaryOutline: string;
+        secondaryOutline: string;
+        inactiveOutline: string;
+        disabledOutline: string;
+        error: string;
+        mutedError: string;
+        errorSurface: string;
+        onErrorSurface: string;
+        warning: string;
+        mutedWarning: string;
+        warningSurface: string;
+        onWarningSurface: string;
+        success: string;
+        mutedSuccess: string;
+        successSurface: string;
+        onSuccessSurface: string;
+        info: string;
+        mutedInfo: string;
+        infoSurface: string;
+        onInfoSurface: string;
+        archived: string;
+        mutedArchived: string;
+        archivedSurface: string;
+        onArchivedSurface: string;
+        primary: string;
+        onPrimary: string;
+        secondary: string;
+        onSecondary: string;
+        defaultSurface: string;
+        highlightedSurface: string;
+        secondaryHighlightedSurface?: string | undefined;
+        pressedSurface: string;
+        decorativePrimary: string;
+        decorativePrimarySurface: string;
+        decorativeSecondary?: string | undefined;
+        decorativeSecondarySurface?: string | undefined;
+    };
+    fonts: import("./typography").Fonts;
+    fontSizes: import("./typography").FontSizes;
+    lineHeights: import("./typography").FontSizes;
+    borderWidths: import("./borders").BorderWidths;
+    space: import("./space").Space;
+    sizes: import("./sizes").Sizes;
+    radii: import("./borders").Radii;
+    shadows: {
+        default: {
+            shadowOffset: {
+                width: number;
+                height: number;
+            };
+            shadowColor: string;
+            shadowOpacity: number;
+            shadowRadius: number;
+            elevation: number;
+        };
+    };
+};
+declare type GlobalTheme = ReturnType<typeof getGlobalTheme>;
+export type { GlobalTheme, Scale, SystemPalette };
+export { getGlobalTheme, defaultScale, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, };

package/types/theme/global/scale.d.ts

@@ -0,0 +1,14 @@
+declare const scale: {
+    borderWidth: number;
+    space: number;
+    size: number;
+    font: {
+        neutral: string;
+        playful: string;
+    };
+    fontSize: number;
+    radius: number;
+};
+declare type Scale = typeof scale;
+export { scale };
+export type { Scale };

package/types/theme/global/shadows.d.ts

@@ -0,0 +1,16 @@
+import type { SystemPalette } from '.';
+declare const getShadows: (systemPalette: SystemPalette) => {
+    default: {
+        shadowOffset: {
+            width: number;
+            height: number;
+        };
+        shadowColor: string;
+        shadowOpacity: number;
+        shadowRadius: number;
+        elevation: number;
+    };
+};
+declare type Shadows = ReturnType<typeof getShadows>;
+export { getShadows };
+export type { Shadows };

package/types/theme/global/sizes.d.ts

@@ -0,0 +1,14 @@
+import type { Space } from './space';
+interface Sizes extends Space {
+    xxxxxlarge: number;
+    '6xlarge': number;
+    '7xlarge': number;
+    '9xlarge': number;
+    '14xlarge': number;
+    '15xlarge': number;
+    '18xlarge': number;
+    '19xlarge': number;
+}
+declare const getSizes: (baseSize: number) => Sizes;
+export { getSizes };
+export type { Sizes };

package/types/theme/global/space.d.ts

@@ -0,0 +1,16 @@
+interface Space {
+    large: number;
+    medium: number;
+    small: number;
+    smallMedium: number;
+    xlarge: number;
+    xsmall: number;
+    xxlarge: number;
+    xxsmall: number;
+    xxxlarge: number;
+    xxxxlarge: number;
+    '5xlarge': number;
+}
+declare const getSpace: (baseSpace: number) => Space;
+export { getSpace };
+export type { Space };

package/types/theme/global/typography.d.ts

@@ -0,0 +1,31 @@
+interface FontWeights {
+    light: string;
+    regular: string;
+    semiBold: string;
+}
+interface Fonts {
+    neutral: FontWeights;
+    playful: FontWeights;
+}
+interface FontSizes {
+    '7xlarge': number;
+    '6xlarge': number;
+    xxxxxlarge: number;
+    xxxxlarge: number;
+    xxxlarge: number;
+    xxlarge: number;
+    xlarge: number;
+    large: number;
+    medium: number;
+    small: number;
+    xsmall: number;
+}
+declare type LineHeights = FontSizes;
+declare const getFonts: ({ neutral, playful, }: {
+    neutral: string;
+    playful: string;
+}) => Fonts;
+declare const getFontSizes: (baseFontSize: number) => FontSizes;
+declare const getLineHeights: (fontSizes: FontSizes) => LineHeights;
+export { getFonts, getFontSizes, getLineHeights };
+export type { Fonts, FontSizes, LineHeights };

package/types/theme/index.d.ts

@@ -0,0 +1,9 @@
+import getTheme from './getTheme';
+import ThemeProvider, { useTheme } from './ThemeProvider';
+import ThemeSwitcher, { withTheme } from './ThemeSwitcher';
+import { swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette } from './global';
+import type { Theme } from './getTheme';
+declare const defaultTheme: Theme;
+export type { Theme };
+export { withTheme, getTheme, ThemeProvider, ThemeSwitcher, useTheme, swagSystemPalette, swagLightSystemPalette, swagLightJobsSystemPalette, swagDarkSystemPalette, workSystemPalette, jobsSystemPalette, walletSystemPalette, eBensSystemPalette, };
+export default defaultTheme;