@metamask-previews/design-system-react-native 0.0.0-preview.bf69b6b → 0.0.0-preview.e1b50dd

package/dist/components/TextButton/TextButton.utilities.js

@@ -0,0 +1,77 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateTextButtonTextClassNames = exports.generateTextButtonContainerClassNames = void 0;
+/**
+ * Generates a Tailwind class name for the text button container based on its state and optional additional classes.
+ *
+ * This function computes the appropriate background class name for a text button's container, considering its
+ * `isPressed` and `isLoading` states. Additional Tailwind class names can also be appended using the `twClassName` parameter.
+ *
+ * @param isPressed - Indicates whether the button is currently being pressed.
+ * @param isLoading - Indicates whether the button is in a loading state.
+ * @param isDisabled - Indicates whether the button is in a disabled state.
+ * @param twClassName - Additional Tailwind class names for customization.
+ * @returns A combined string of Tailwind class names for the container's background styling.
+ *
+ * Example:
+ * ```
+ * const classNames = generateTextButtonContainerClassNames({
+ *   isPressed: true,
+ *   isLoading: false,
+ *   twClassName: 'rounded-full',
+ * });
+ *
+ * console.log(classNames);
+ * // Output: "bg-background-pressed rounded-full"
+ * ```
+ */
+const generateTextButtonContainerClassNames = ({ isPressed = false, isLoading = false, isDisabled = false, twClassName = '', }) => {
+    const isPressedOrLoading = isPressed || isLoading;
+    const backgroundStyle = isPressedOrLoading
+        ? 'bg-background-pressed'
+        : 'bg-transparent';
+    const opacityStyle = `opacity-${isDisabled ? 50 : 100}`;
+    return `${backgroundStyle} ${opacityStyle} ${twClassName}`;
+};
+exports.generateTextButtonContainerClassNames = generateTextButtonContainerClassNames;
+/**
+ * Generates a Tailwind class name for the text button's text based on its state.
+ *
+ * This function computes the appropriate text color and style class names for a text button,
+ * considering its `isPressed`, `isInverse`, and `isLoading` states.
+ *
+ * @param isPressed - Indicates whether the button is currently being pressed.
+ * @param isInverse - Indicates whether the button is using an "inverse" theme.
+ * @param isLoading - Indicates whether the button is in a loading state.
+ * @returns A combined string of Tailwind class names for the text's color and style.
+ *
+ * Example:
+ * ```
+ * const classNames = generateTextButtonTextClassNames({
+ *   isPressed: true,
+ *   isInverse: false,
+ *   isLoading: false,
+ * });
+ *
+ * console.log(classNames);
+ * // Output: "text-primary-defaultPressed underline"
+ * ```
+ */
+const generateTextButtonTextClassNames = ({ isPressed = false, isInverse = false, isLoading = false, }) => {
+    let textColor, textStyle;
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    const isPressedOrLoading = isPressed || isLoading;
+    if (isInverse) {
+        textColor = 'text-primary-inverse';
+        textStyle = 'underline';
+    }
+    else {
+        textColor = isPressedOrLoading
+            ? 'text-primary-defaultPressed'
+            : 'text-primary-default';
+        textStyle = isPressedOrLoading ? 'underline' : 'no-underline';
+    }
+    return `${textColor} ${textStyle}`;
+};
+exports.generateTextButtonTextClassNames = generateTextButtonTextClassNames;
+//# sourceMappingURL=TextButton.utilities.js.map

package/dist/components/TextButton/TextButton.utilities.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextButton.utilities.js","sourceRoot":"","sources":["../../../src/components/TextButton/TextButton.utilities.ts"],"names":[],"mappings":";;;AAIA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACI,MAAM,qCAAqC,GAAG,CAAC,EACpD,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,WAAW,GAAG,EAAE,GAGjB,EAAU,EAAE;IACX,MAAM,kBAAkB,GAAG,SAAS,IAAI,SAAS,CAAC;IAClD,MAAM,eAAe,GAAG,kBAAkB;QACxC,CAAC,CAAC,uBAAuB;QACzB,CAAC,CAAC,gBAAgB,CAAC;IACrB,MAAM,YAAY,GAAG,WAAW,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;IAExD,OAAO,GAAG,eAAe,IAAI,YAAY,IAAI,WAAW,EAAE,CAAC;AAC7D,CAAC,CAAC;AAfW,QAAA,qCAAqC,yCAehD;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACI,MAAM,gCAAgC,GAAG,CAAC,EAC/C,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,GAGlB,EAAU,EAAE;IACX,IAAI,SAAS,EAAE,SAAS,CAAC;IACzB,wEAAwE;IACxE,MAAM,kBAAkB,GAAG,SAAS,IAAI,SAAS,CAAC;IAClD,IAAI,SAAS,EAAE;QACb,SAAS,GAAG,sBAAsB,CAAC;QACnC,SAAS,GAAG,WAAW,CAAC;KACzB;SAAM;QACL,SAAS,GAAG,kBAAkB;YAC5B,CAAC,CAAC,6BAA6B;YAC/B,CAAC,CAAC,sBAAsB,CAAC;QAC3B,SAAS,GAAG,kBAAkB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,cAAc,CAAC;KAC/D;IAED,OAAO,GAAG,SAAS,IAAI,SAAS,EAAE,CAAC;AACrC,CAAC,CAAC;AArBW,QAAA,gCAAgC,oCAqB3C","sourcesContent":["/* eslint-disable jsdoc/check-param-names */\n/* eslint-disable jsdoc/require-param */\nimport type { TextButtonProps } from './TextButton.types';\n\n/**\n * Generates a Tailwind class name for the text button container based on its state and optional additional classes.\n *\n * This function computes the appropriate background class name for a text button's container, considering its\n * `isPressed` and `isLoading` states. Additional Tailwind class names can also be appended using the `twClassName` parameter.\n *\n * @param isPressed - Indicates whether the button is currently being pressed.\n * @param isLoading - Indicates whether the button is in a loading state.\n * @param isDisabled - Indicates whether the button is in a disabled state.\n * @param twClassName - Additional Tailwind class names for customization.\n * @returns A combined string of Tailwind class names for the container's background styling.\n *\n * Example:\n * ```\n * const classNames = generateTextButtonContainerClassNames({\n *   isPressed: true,\n *   isLoading: false,\n *   twClassName: 'rounded-full',\n * });\n *\n * console.log(classNames);\n * // Output: \"bg-background-pressed rounded-full\"\n * ```\n */\nexport const generateTextButtonContainerClassNames = ({\n  isPressed = false,\n  isLoading = false,\n  isDisabled = false,\n  twClassName = '',\n}: Partial<TextButtonProps> & {\n  isPressed?: boolean;\n}): string => {\n  const isPressedOrLoading = isPressed || isLoading;\n  const backgroundStyle = isPressedOrLoading\n    ? 'bg-background-pressed'\n    : 'bg-transparent';\n  const opacityStyle = `opacity-${isDisabled ? 50 : 100}`;\n\n  return `${backgroundStyle} ${opacityStyle} ${twClassName}`;\n};\n\n/**\n * Generates a Tailwind class name for the text button's text based on its state.\n *\n * This function computes the appropriate text color and style class names for a text button,\n * considering its `isPressed`, `isInverse`, and `isLoading` states.\n *\n * @param isPressed - Indicates whether the button is currently being pressed.\n * @param isInverse - Indicates whether the button is using an \"inverse\" theme.\n * @param isLoading - Indicates whether the button is in a loading state.\n * @returns A combined string of Tailwind class names for the text's color and style.\n *\n * Example:\n * ```\n * const classNames = generateTextButtonTextClassNames({\n *   isPressed: true,\n *   isInverse: false,\n *   isLoading: false,\n * });\n *\n * console.log(classNames);\n * // Output: \"text-primary-defaultPressed underline\"\n * ```\n */\nexport const generateTextButtonTextClassNames = ({\n  isPressed = false,\n  isInverse = false,\n  isLoading = false,\n}: Partial<TextButtonProps> & {\n  isPressed?: boolean;\n}): string => {\n  let textColor, textStyle;\n  // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n  const isPressedOrLoading = isPressed || isLoading;\n  if (isInverse) {\n    textColor = 'text-primary-inverse';\n    textStyle = 'underline';\n  } else {\n    textColor = isPressedOrLoading\n      ? 'text-primary-defaultPressed'\n      : 'text-primary-default';\n    textStyle = isPressedOrLoading ? 'underline' : 'no-underline';\n  }\n\n  return `${textColor} ${textStyle}`;\n};\n"]}

package/dist/components/TextButton/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './TextButton';
+export type { TextButtonProps } from './TextButton.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/TextButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TextButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/TextButton/index.js

@@ -0,0 +1,9 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var TextButton_1 = require("./TextButton");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(TextButton_1).default; } });
+//# sourceMappingURL=index.js.map

package/dist/components/TextButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/TextButton/index.ts"],"names":[],"mappings":";;;;;;AAAA,2CAAuC;AAA9B,sHAAA,OAAO,OAAA","sourcesContent":["export { default } from './TextButton';\nexport type { TextButtonProps } from './TextButton.types';\n"]}

package/dist/index.d.ts

@@ -1,10 +1,136 @@
-export declare const Text: import("react").ForwardRefExoticComponent<Omit<{
+export declare const AvatarAccount: import("react").ForwardRefExoticComponent<{
+    address: string;
+    variant?: import("./components/AvatarAccount").AvatarAccountVariant | undefined;
+} & Omit<import("./primitives/AvatarBase").AvatarBaseProps, "children" | "fallbackTextProps" | "fallbackText"> & import("react").RefAttributes<any>>;
+export { AvatarAccountProps, AvatarAccountVariant, AvatarAccountSize, } from './components/AvatarAccount';
+export declare const AvatarBase: import("react").ForwardRefExoticComponent<{
+    children?: import("react").ReactNode;
+    size?: import("./shared/enums").AvatarSize | undefined;
+    shape?: import("./shared/enums").AvatarShape | undefined;
+    fallbackText?: string | undefined;
+    fallbackTextProps?: Omit<import("./components/Text").TextProps, "children"> | undefined;
+    hasBorder?: boolean | undefined;
+    hasSolidBackgroundColor?: boolean | undefined;
+    twClassName?: string | undefined;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & import("react-native").ViewProps & import("react").RefAttributes<any>>;
+export { AvatarBaseProps, AvatarBaseSize } from './primitives/AvatarBase';
+export declare const AvatarFavicon: import("react").ForwardRefExoticComponent<{
+    name?: string | undefined;
+} & Omit<import("./primitives/AvatarBase").AvatarBaseProps, "children"> & import("./primitives/ImageOrSvg").ImageOrSvgProps & import("react").RefAttributes<any>>;
+export { AvatarFaviconProps, AvatarFaviconSize, } from './components/AvatarFavicon';
+export declare const AvatarGroup: import("react").ForwardRefExoticComponent<import("./components/AvatarGroup").AvatarGroupProps & import("react").RefAttributes<any>>;
+export { AvatarGroupProps, AvatarGroupSize, AvatarGroupVariant, } from './components/AvatarGroup';
+export declare const AvatarIcon: import("react").ForwardRefExoticComponent<{
+    severity?: import("./components/AvatarIcon").AvatarIconSeverity | undefined;
+    iconName: import("./components/Icon").IconName;
+    iconProps?: Omit<import("./components/Icon").IconProps, "name"> | undefined;
+} & Omit<import("./primitives/AvatarBase").AvatarBaseProps, "children" | "fallbackTextProps" | "fallbackText"> & import("react").RefAttributes<any>>;
+export { AvatarIconProps, AvatarIconSeverity, AvatarIconSize, } from './components/AvatarIcon';
+export declare const AvatarNetwork: import("react").ForwardRefExoticComponent<{
+    name?: string | undefined;
+} & Omit<import("./primitives/AvatarBase").AvatarBaseProps, "children"> & import("./primitives/ImageOrSvg").ImageOrSvgProps & import("react").RefAttributes<any>>;
+export { AvatarNetworkProps, AvatarNetworkSize, } from './components/AvatarNetwork';
+export declare const AvatarToken: import("react").ForwardRefExoticComponent<{
+    name?: string | undefined;
+} & Omit<import("./primitives/AvatarBase").AvatarBaseProps, "children"> & import("./primitives/ImageOrSvg").ImageOrSvgProps & import("react").RefAttributes<any>>;
+export { AvatarTokenProps, AvatarTokenSize } from './components/AvatarToken';
+export declare const BadgeCount: import("react").ForwardRefExoticComponent<{
+    size?: import("./components/BadgeCount").BadgeCountSize | undefined;
+    count: number;
+    max?: number | undefined;
+    textProps?: Partial<import("./components/Text").TextProps> | undefined;
+    twClassName?: string | undefined;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "children"> & import("react").RefAttributes<any>>;
+export { BadgeCountProps, BadgeCountSize } from './components/BadgeCount';
+export declare const BadgeIcon: import("react").ForwardRefExoticComponent<{
+    iconName: import("./components/Icon").IconName;
+    iconProps?: Omit<import("./components/Icon").IconProps, "name"> | undefined;
+    twClassName?: string | undefined;
+} & Omit<import("react-native").ViewProps, "children"> & import("react").RefAttributes<any>>;
+export { BadgeIconProps } from './components/BadgeIcon';
+export declare const BadgeNetwork: import("react").ForwardRefExoticComponent<import("./components/BadgeNetwork").BadgeNetworkProps & import("react").RefAttributes<any>>;
+export { BadgeNetworkProps } from './components/BadgeNetwork';
+export declare const BadgeStatus: import("react").ForwardRefExoticComponent<{
+    status: import("./components/BadgeStatus").BadgeStatusStatus;
+    hasBorder?: boolean | undefined;
+    size?: import("./components/BadgeStatus").BadgeStatusSize | undefined;
+    twClassName?: string | undefined;
+} & Omit<import("react-native").ViewProps, "children"> & import("react").RefAttributes<any>>;
+export { BadgeStatusProps, BadgeStatusStatus, BadgeStatusSize, } from './components/BadgeStatus';
+export declare const Blockies: ({ address, size, ...props }: import("./primitives/Blockies").BlockiesProps) => import("react").JSX.Element;
+export { BlockiesProps } from './primitives/Blockies';
+export declare const ButtonAnimated: import("react").ForwardRefExoticComponent<import("react-native").PressableProps & import("react").RefAttributes<any>>;
+export { ButtonAnimatedProps } from './primitives/ButtonAnimated';
+export declare const ButtonBase: import("react").ForwardRefExoticComponent<{
+    children: import("react").ReactNode;
+    textProps?: Omit<Partial<import("./components/Text").TextProps>, "children"> | undefined;
+    size?: import("./primitives/ButtonBase").ButtonBaseSize | undefined;
+    isLoading?: boolean | undefined;
+    loadingText?: string | undefined;
+    spinnerProps?: Partial<import("./temp-components/Spinner").SpinnerProps> | undefined;
+    startIconName?: import("./components/Icon").IconName | undefined;
+    startIconProps?: Partial<import("./components/Icon").IconProps> | undefined;
+    startAccessory?: import("react").ReactNode;
+    endIconName?: import("./components/Icon").IconName | undefined;
+    endIconProps?: Partial<import("./components/Icon").IconProps> | undefined;
+    endAccessory?: import("react").ReactNode;
+    isDisabled?: boolean | undefined;
+    isFullWidth?: boolean | undefined;
+    twClassName?: string | undefined;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & import("react-native").PressableProps & import("react").RefAttributes<any>>;
+export { ButtonBaseProps, ButtonBaseSize } from './primitives/ButtonBase';
+export declare const Button: import("react").ForwardRefExoticComponent<import("./components/Button").ButtonProps & import("react").RefAttributes<any>>;
+export { ButtonProps, ButtonSize, ButtonVariant } from './components/Button';
+export declare const ButtonIcon: import("react").ForwardRefExoticComponent<{
+    size?: import("./components/ButtonIcon").ButtonIconSize | undefined;
+    iconName: import("./components/Icon").IconName;
+    iconProps?: Partial<import("./components/Icon").IconProps> | undefined;
+    isDisabled?: boolean | undefined;
+    isInverse?: boolean | undefined;
+    isFloating?: boolean | undefined;
+    twClassName?: string | undefined;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").PressableProps, "children"> & import("react").RefAttributes<any>>;
+export { ButtonIconProps, ButtonIconSize } from './components/ButtonIcon';
+export declare const Icon: import("react").ForwardRefExoticComponent<{
+    name: import("./components/Icon").IconName;
+    size?: import("./components/Icon").IconSize | undefined;
+    color?: import("./components/Icon").IconColor | undefined;
+    twClassName?: string | undefined;
+} & import("react-native").ViewProps & import("react").RefAttributes<any>>;
+export { IconColor, IconName, IconProps, IconSize } from './components/Icon';
+export declare const Jazzicon: ({ testID, ...props }: import("./primitives/Jazzicon").JazziconProps) => import("react").JSX.Element;
+export { JazziconProps } from './primitives/Jazzicon';
+export declare const TextButton: import("react").ForwardRefExoticComponent<{
+    children: string;
+    textProps?: Omit<Partial<import("./components/Text").TextProps>, "children"> | undefined;
+    isLoading?: boolean | undefined;
+    loadingText?: string | undefined;
+    spinnerProps?: Partial<import("./temp-components/Spinner").SpinnerProps> | undefined;
+    startIconName?: import("./components/Icon").IconName | undefined;
+    startIconProps?: Partial<import("./components/Icon").IconProps> | undefined;
+    startAccessory?: import("react").ReactNode;
+    endIconName?: import("./components/Icon").IconName | undefined;
+    endIconProps?: Partial<import("./components/Icon").IconProps> | undefined;
+    endAccessory?: import("react").ReactNode;
+    isDisabled?: boolean | undefined;
+    isInverse?: boolean | undefined;
+    twClassName?: string | undefined;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").PressableProps, "disabled"> & import("react").RefAttributes<any>>;
+export { TextButtonProps } from './components/TextButton';
+export declare const Text: import("react").ForwardRefExoticComponent<{
     variant?: import("./components/Text").TextVariant | undefined;
     children: import("react").ReactNode;
     color?: import("./components/Text").TextColor | undefined;
     fontWeight?: import("./components/Text").FontWeight | undefined;
     fontStyle?: import("./components/Text").FontStyle | undefined;
     twClassName?: string | undefined;
-} & import("react-native").TextProps & import("react").RefAttributes<any>, "ref"> & import("react").RefAttributes<any>>;
-export { TextVariant, TextColor, FontWeight, FontStyle, } from './components/Text';
+} & import("react-native").TextProps & import("react").RefAttributes<any>>;
+export { FontWeight, FontStyle, TextColor, TextProps, TextVariant, } from './components/Text';
+export declare const TextOrChildren: import("react").ForwardRefExoticComponent<import("./primitives/TextOrChildren").TextOrChildrenProps & import("react").RefAttributes<any>>;
+export { TextOrChildrenProps } from './primitives/TextOrChildren/';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI;;;;;;;uHAAmC,CAAC;AACrD,OAAO,EACL,WAAW,EACX,SAAS,EACT,UAAU,EACV,SAAS,GACV,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa;;;oJAA4C,CAAC;AACvE,OAAO,EACL,kBAAkB,EAClB,oBAAoB,EACpB,iBAAiB,GAClB,MAAM,4BAA4B,CAAC;AAGpC,eAAO,MAAM,UAAU;;;;;;;;;;0EAAyC,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAG1E,eAAO,MAAM,aAAa;;iKAA4C,CAAC;AACvE,OAAO,EACL,kBAAkB,EAClB,iBAAiB,GAClB,MAAM,4BAA4B,CAAC;AAGpC,eAAO,MAAM,WAAW,qIAA0C,CAAC;AACnE,OAAO,EACL,gBAAgB,EAChB,eAAe,EACf,kBAAkB,GACnB,MAAM,0BAA0B,CAAC;AAGlC,eAAO,MAAM,UAAU;;;;oJAAyC,CAAC;AACjE,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,GACf,MAAM,yBAAyB,CAAC;AAGjC,eAAO,MAAM,aAAa;;iKAA4C,CAAC;AACvE,OAAO,EACL,kBAAkB,EAClB,iBAAiB,GAClB,MAAM,4BAA4B,CAAC;AAGpC,eAAO,MAAM,WAAW;;iKAA0C,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAG7E,eAAO,MAAM,UAAU;;;;;;;4FAAyC,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAG1E,eAAO,MAAM,SAAS;;;;4FAAwC,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxD,eAAO,MAAM,YAAY,uIAA2C,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAG9D,eAAO,MAAM,WAAW;;;;;4FAA0C,CAAC;AACnE,OAAO,EACL,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,GAChB,MAAM,0BAA0B,CAAC;AAGlC,eAAO,MAAM,QAAQ,6GAAoB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAGtD,eAAO,MAAM,cAAc,uHAA6C,CAAC;AACzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAGlE,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;+EAAyC,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAG1E,eAAO,MAAM,MAAM,2HAAqC,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAG7E,eAAO,MAAM,UAAU;;;;;;;;;iGAAyC,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAG1E,eAAO,MAAM,IAAI;;;;;0EAAmC,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG7E,eAAO,MAAM,QAAQ,sGAAoB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAGtD,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;iGAAyC,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAG1D,eAAO,MAAM,IAAI;;;;;;;0EAAmC,CAAC;AACrD,OAAO,EACL,UAAU,EACV,SAAS,EACT,SAAS,EACT,SAAS,EACT,WAAW,GACZ,MAAM,mBAAmB,CAAC;AAG3B,eAAO,MAAM,cAAc,2IAA6C,CAAC;AACzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/index.js

@@ -3,13 +3,86 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FontStyle = exports.FontWeight = exports.TextColor = exports.TextVariant = exports.Text = void 0;
+exports.TextOrChildren = exports.TextVariant = exports.TextColor = exports.FontStyle = exports.FontWeight = exports.Text = exports.TextButton = exports.Jazzicon = exports.IconSize = exports.IconName = exports.IconColor = exports.Icon = exports.ButtonIconSize = exports.ButtonIcon = exports.ButtonVariant = exports.ButtonSize = exports.Button = exports.ButtonBaseSize = exports.ButtonBase = exports.ButtonAnimated = exports.Blockies = exports.BadgeStatusSize = exports.BadgeStatusStatus = exports.BadgeStatus = exports.BadgeNetwork = exports.BadgeIcon = exports.BadgeCountSize = exports.BadgeCount = exports.AvatarTokenSize = exports.AvatarToken = exports.AvatarNetworkSize = exports.AvatarNetwork = exports.AvatarIconSize = exports.AvatarIconSeverity = exports.AvatarIcon = exports.AvatarGroupVariant = exports.AvatarGroupSize = exports.AvatarGroup = exports.AvatarFaviconSize = exports.AvatarFavicon = exports.AvatarBaseSize = exports.AvatarBase = exports.AvatarAccountSize = exports.AvatarAccountVariant = exports.AvatarAccount = void 0;
 const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
+const AvatarAccount_1 = __importDefault(require("./components/AvatarAccount"));
+exports.AvatarAccount = (0, design_system_twrnc_preset_1.withThemeProvider)(AvatarAccount_1.default);
+var AvatarAccount_2 = require("./components/AvatarAccount");
+Object.defineProperty(exports, "AvatarAccountVariant", { enumerable: true, get: function () { return AvatarAccount_2.AvatarAccountVariant; } });
+Object.defineProperty(exports, "AvatarAccountSize", { enumerable: true, get: function () { return AvatarAccount_2.AvatarAccountSize; } });
+const AvatarBase_1 = __importDefault(require("./primitives/AvatarBase"));
+exports.AvatarBase = (0, design_system_twrnc_preset_1.withThemeProvider)(AvatarBase_1.default);
+var AvatarBase_2 = require("./primitives/AvatarBase");
+Object.defineProperty(exports, "AvatarBaseSize", { enumerable: true, get: function () { return AvatarBase_2.AvatarBaseSize; } });
+const AvatarFavicon_1 = __importDefault(require("./components/AvatarFavicon"));
+exports.AvatarFavicon = (0, design_system_twrnc_preset_1.withThemeProvider)(AvatarFavicon_1.default);
+var AvatarFavicon_2 = require("./components/AvatarFavicon");
+Object.defineProperty(exports, "AvatarFaviconSize", { enumerable: true, get: function () { return AvatarFavicon_2.AvatarFaviconSize; } });
+const AvatarGroup_1 = __importDefault(require("./components/AvatarGroup"));
+exports.AvatarGroup = (0, design_system_twrnc_preset_1.withThemeProvider)(AvatarGroup_1.default);
+var AvatarGroup_2 = require("./components/AvatarGroup");
+Object.defineProperty(exports, "AvatarGroupSize", { enumerable: true, get: function () { return AvatarGroup_2.AvatarGroupSize; } });
+Object.defineProperty(exports, "AvatarGroupVariant", { enumerable: true, get: function () { return AvatarGroup_2.AvatarGroupVariant; } });
+const AvatarIcon_1 = __importDefault(require("./components/AvatarIcon"));
+exports.AvatarIcon = (0, design_system_twrnc_preset_1.withThemeProvider)(AvatarIcon_1.default);
+var AvatarIcon_2 = require("./components/AvatarIcon");
+Object.defineProperty(exports, "AvatarIconSeverity", { enumerable: true, get: function () { return AvatarIcon_2.AvatarIconSeverity; } });
+Object.defineProperty(exports, "AvatarIconSize", { enumerable: true, get: function () { return AvatarIcon_2.AvatarIconSize; } });
+const AvatarNetwork_1 = __importDefault(require("./components/AvatarNetwork"));
+exports.AvatarNetwork = (0, design_system_twrnc_preset_1.withThemeProvider)(AvatarNetwork_1.default);
+var AvatarNetwork_2 = require("./components/AvatarNetwork");
+Object.defineProperty(exports, "AvatarNetworkSize", { enumerable: true, get: function () { return AvatarNetwork_2.AvatarNetworkSize; } });
+const AvatarToken_1 = __importDefault(require("./components/AvatarToken"));
+exports.AvatarToken = (0, design_system_twrnc_preset_1.withThemeProvider)(AvatarToken_1.default);
+var AvatarToken_2 = require("./components/AvatarToken");
+Object.defineProperty(exports, "AvatarTokenSize", { enumerable: true, get: function () { return AvatarToken_2.AvatarTokenSize; } });
+const BadgeCount_1 = __importDefault(require("./components/BadgeCount"));
+exports.BadgeCount = (0, design_system_twrnc_preset_1.withThemeProvider)(BadgeCount_1.default);
+var BadgeCount_2 = require("./components/BadgeCount");
+Object.defineProperty(exports, "BadgeCountSize", { enumerable: true, get: function () { return BadgeCount_2.BadgeCountSize; } });
+const BadgeIcon_1 = __importDefault(require("./components/BadgeIcon"));
+exports.BadgeIcon = (0, design_system_twrnc_preset_1.withThemeProvider)(BadgeIcon_1.default);
+const BadgeNetwork_1 = __importDefault(require("./components/BadgeNetwork"));
+exports.BadgeNetwork = (0, design_system_twrnc_preset_1.withThemeProvider)(BadgeNetwork_1.default);
+const BadgeStatus_1 = __importDefault(require("./components/BadgeStatus"));
+exports.BadgeStatus = (0, design_system_twrnc_preset_1.withThemeProvider)(BadgeStatus_1.default);
+var BadgeStatus_2 = require("./components/BadgeStatus");
+Object.defineProperty(exports, "BadgeStatusStatus", { enumerable: true, get: function () { return BadgeStatus_2.BadgeStatusStatus; } });
+Object.defineProperty(exports, "BadgeStatusSize", { enumerable: true, get: function () { return BadgeStatus_2.BadgeStatusSize; } });
+const Blockies_1 = __importDefault(require("./primitives/Blockies"));
+exports.Blockies = Blockies_1.default;
+const ButtonAnimated_1 = __importDefault(require("./primitives/ButtonAnimated"));
+exports.ButtonAnimated = (0, design_system_twrnc_preset_1.withThemeProvider)(ButtonAnimated_1.default);
+const ButtonBase_1 = __importDefault(require("./primitives/ButtonBase"));
+exports.ButtonBase = (0, design_system_twrnc_preset_1.withThemeProvider)(ButtonBase_1.default);
+var ButtonBase_2 = require("./primitives/ButtonBase");
+Object.defineProperty(exports, "ButtonBaseSize", { enumerable: true, get: function () { return ButtonBase_2.ButtonBaseSize; } });
+const Button_1 = __importDefault(require("./components/Button"));
+exports.Button = (0, design_system_twrnc_preset_1.withThemeProvider)(Button_1.default);
+var Button_2 = require("./components/Button");
+Object.defineProperty(exports, "ButtonSize", { enumerable: true, get: function () { return Button_2.ButtonSize; } });
+Object.defineProperty(exports, "ButtonVariant", { enumerable: true, get: function () { return Button_2.ButtonVariant; } });
+const ButtonIcon_1 = __importDefault(require("./components/ButtonIcon"));
+exports.ButtonIcon = (0, design_system_twrnc_preset_1.withThemeProvider)(ButtonIcon_1.default);
+var ButtonIcon_2 = require("./components/ButtonIcon");
+Object.defineProperty(exports, "ButtonIconSize", { enumerable: true, get: function () { return ButtonIcon_2.ButtonIconSize; } });
+const Icon_1 = __importDefault(require("./components/Icon"));
+exports.Icon = (0, design_system_twrnc_preset_1.withThemeProvider)(Icon_1.default);
+var Icon_2 = require("./components/Icon");
+Object.defineProperty(exports, "IconColor", { enumerable: true, get: function () { return Icon_2.IconColor; } });
+Object.defineProperty(exports, "IconName", { enumerable: true, get: function () { return Icon_2.IconName; } });
+Object.defineProperty(exports, "IconSize", { enumerable: true, get: function () { return Icon_2.IconSize; } });
+const Jazzicon_1 = __importDefault(require("./primitives/Jazzicon"));
+exports.Jazzicon = Jazzicon_1.default;
+const TextButton_1 = __importDefault(require("./components/TextButton"));
+exports.TextButton = (0, design_system_twrnc_preset_1.withThemeProvider)(TextButton_1.default);
 const Text_1 = __importDefault(require("./components/Text"));
 exports.Text = (0, design_system_twrnc_preset_1.withThemeProvider)(Text_1.default);
 var Text_2 = require("./components/Text");
-Object.defineProperty(exports, "TextVariant", { enumerable: true, get: function () { return Text_2.TextVariant; } });
-Object.defineProperty(exports, "TextColor", { enumerable: true, get: function () { return Text_2.TextColor; } });
 Object.defineProperty(exports, "FontWeight", { enumerable: true, get: function () { return Text_2.FontWeight; } });
 Object.defineProperty(exports, "FontStyle", { enumerable: true, get: function () { return Text_2.FontStyle; } });
+Object.defineProperty(exports, "TextColor", { enumerable: true, get: function () { return Text_2.TextColor; } });
+Object.defineProperty(exports, "TextVariant", { enumerable: true, get: function () { return Text_2.TextVariant; } });
+const TextOrChildren_1 = __importDefault(require("./primitives/TextOrChildren"));
+exports.TextOrChildren = (0, design_system_twrnc_preset_1.withThemeProvider)(TextOrChildren_1.default);
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;AAAA,8FAAkF;AAElF,6DAA8C;AAEjC,QAAA,IAAI,GAAG,IAAA,8CAAiB,EAAC,cAAa,CAAC,CAAC;AACrD,0CAK2B;AAJzB,mGAAA,WAAW,OAAA;AACX,iGAAA,SAAS,OAAA;AACT,kGAAA,UAAU,OAAA;AACV,iGAAA,SAAS,OAAA","sourcesContent":["import { withThemeProvider } from '@metamask-previews/design-system-twrnc-preset';\n\nimport TextComponent from './components/Text';\n\nexport const Text = withThemeProvider(TextComponent);\nexport {\n  TextVariant,\n  TextColor,\n  FontWeight,\n  FontStyle,\n} from './components/Text';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;AAAA,8FAAkF;AAElF,+EAAgE;AACnD,QAAA,aAAa,GAAG,IAAA,8CAAiB,EAAC,uBAAsB,CAAC,CAAC;AACvE,4DAIoC;AAFlC,qHAAA,oBAAoB,OAAA;AACpB,kHAAA,iBAAiB,OAAA;AAGnB,yEAA0D;AAC7C,QAAA,UAAU,GAAG,IAAA,8CAAiB,EAAC,oBAAmB,CAAC,CAAC;AACjE,sDAA0E;AAAhD,4GAAA,cAAc,OAAA;AAExC,+EAAgE;AACnD,QAAA,aAAa,GAAG,IAAA,8CAAiB,EAAC,uBAAsB,CAAC,CAAC;AACvE,4DAGoC;AADlC,kHAAA,iBAAiB,OAAA;AAGnB,2EAA4D;AAC/C,QAAA,WAAW,GAAG,IAAA,8CAAiB,EAAC,qBAAoB,CAAC,CAAC;AACnE,wDAIkC;AAFhC,8GAAA,eAAe,OAAA;AACf,iHAAA,kBAAkB,OAAA;AAGpB,yEAA0D;AAC7C,QAAA,UAAU,GAAG,IAAA,8CAAiB,EAAC,oBAAmB,CAAC,CAAC;AACjE,sDAIiC;AAF/B,gHAAA,kBAAkB,OAAA;AAClB,4GAAA,cAAc,OAAA;AAGhB,+EAAgE;AACnD,QAAA,aAAa,GAAG,IAAA,8CAAiB,EAAC,uBAAsB,CAAC,CAAC;AACvE,4DAGoC;AADlC,kHAAA,iBAAiB,OAAA;AAGnB,2EAA4D;AAC/C,QAAA,WAAW,GAAG,IAAA,8CAAiB,EAAC,qBAAoB,CAAC,CAAC;AACnE,wDAA6E;AAAlD,8GAAA,eAAe,OAAA;AAE1C,yEAA0D;AAC7C,QAAA,UAAU,GAAG,IAAA,8CAAiB,EAAC,oBAAmB,CAAC,CAAC;AACjE,sDAA0E;AAAhD,4GAAA,cAAc,OAAA;AAExC,uEAAwD;AAC3C,QAAA,SAAS,GAAG,IAAA,8CAAiB,EAAC,mBAAkB,CAAC,CAAC;AAG/D,6EAA8D;AACjD,QAAA,YAAY,GAAG,IAAA,8CAAiB,EAAC,sBAAqB,CAAC,CAAC;AAGrE,2EAA4D;AAC/C,QAAA,WAAW,GAAG,IAAA,8CAAiB,EAAC,qBAAoB,CAAC,CAAC;AACnE,wDAIkC;AAFhC,gHAAA,iBAAiB,OAAA;AACjB,8GAAA,eAAe,OAAA;AAGjB,qEAAsD;AACzC,QAAA,QAAQ,GAAG,kBAAiB,CAAC;AAG1C,iFAAkE;AACrD,QAAA,cAAc,GAAG,IAAA,8CAAiB,EAAC,wBAAuB,CAAC,CAAC;AAGzE,yEAA0D;AAC7C,QAAA,UAAU,GAAG,IAAA,8CAAiB,EAAC,oBAAmB,CAAC,CAAC;AACjE,sDAA0E;AAAhD,4GAAA,cAAc,OAAA;AAExC,iEAAkD;AACrC,QAAA,MAAM,GAAG,IAAA,8CAAiB,EAAC,gBAAe,CAAC,CAAC;AACzD,8CAA6E;AAAvD,oGAAA,UAAU,OAAA;AAAE,uGAAA,aAAa,OAAA;AAE/C,yEAA0D;AAC7C,QAAA,UAAU,GAAG,IAAA,8CAAiB,EAAC,oBAAmB,CAAC,CAAC;AACjE,sDAA0E;AAAhD,4GAAA,cAAc,OAAA;AAExC,6DAA8C;AACjC,QAAA,IAAI,GAAG,IAAA,8CAAiB,EAAC,cAAa,CAAC,CAAC;AACrD,0CAA6E;AAApE,iGAAA,SAAS,OAAA;AAAE,gGAAA,QAAQ,OAAA;AAAa,gGAAA,QAAQ,OAAA;AAEjD,qEAAsD;AACzC,QAAA,QAAQ,GAAG,kBAAiB,CAAC;AAG1C,yEAA0D;AAC7C,QAAA,UAAU,GAAG,IAAA,8CAAiB,EAAC,oBAAmB,CAAC,CAAC;AAGjE,6DAA8C;AACjC,QAAA,IAAI,GAAG,IAAA,8CAAiB,EAAC,cAAa,CAAC,CAAC;AACrD,0CAM2B;AALzB,kGAAA,UAAU,OAAA;AACV,iGAAA,SAAS,OAAA;AACT,iGAAA,SAAS,OAAA;AAET,mGAAA,WAAW,OAAA;AAGb,iFAAkE;AACrD,QAAA,cAAc,GAAG,IAAA,8CAAiB,EAAC,wBAAuB,CAAC,CAAC","sourcesContent":["import { withThemeProvider } from '@metamask-previews/design-system-twrnc-preset';\n\nimport AvatarAccountComponent from './components/AvatarAccount';\nexport const AvatarAccount = withThemeProvider(AvatarAccountComponent);\nexport {\n  AvatarAccountProps,\n  AvatarAccountVariant,\n  AvatarAccountSize,\n} from './components/AvatarAccount';\n\nimport AvatarBaseComponent from './primitives/AvatarBase';\nexport const AvatarBase = withThemeProvider(AvatarBaseComponent);\nexport { AvatarBaseProps, AvatarBaseSize } from './primitives/AvatarBase';\n\nimport AvatarFaviconComponent from './components/AvatarFavicon';\nexport const AvatarFavicon = withThemeProvider(AvatarFaviconComponent);\nexport {\n  AvatarFaviconProps,\n  AvatarFaviconSize,\n} from './components/AvatarFavicon';\n\nimport AvatarGroupComponent from './components/AvatarGroup';\nexport const AvatarGroup = withThemeProvider(AvatarGroupComponent);\nexport {\n  AvatarGroupProps,\n  AvatarGroupSize,\n  AvatarGroupVariant,\n} from './components/AvatarGroup';\n\nimport AvatarIconComponent from './components/AvatarIcon';\nexport const AvatarIcon = withThemeProvider(AvatarIconComponent);\nexport {\n  AvatarIconProps,\n  AvatarIconSeverity,\n  AvatarIconSize,\n} from './components/AvatarIcon';\n\nimport AvatarNetworkComponent from './components/AvatarNetwork';\nexport const AvatarNetwork = withThemeProvider(AvatarNetworkComponent);\nexport {\n  AvatarNetworkProps,\n  AvatarNetworkSize,\n} from './components/AvatarNetwork';\n\nimport AvatarTokenComponent from './components/AvatarToken';\nexport const AvatarToken = withThemeProvider(AvatarTokenComponent);\nexport { AvatarTokenProps, AvatarTokenSize } from './components/AvatarToken';\n\nimport BadgeCountComponent from './components/BadgeCount';\nexport const BadgeCount = withThemeProvider(BadgeCountComponent);\nexport { BadgeCountProps, BadgeCountSize } from './components/BadgeCount';\n\nimport BadgeIconComponent from './components/BadgeIcon';\nexport const BadgeIcon = withThemeProvider(BadgeIconComponent);\nexport { BadgeIconProps } from './components/BadgeIcon';\n\nimport BadgeNetworkComponent from './components/BadgeNetwork';\nexport const BadgeNetwork = withThemeProvider(BadgeNetworkComponent);\nexport { BadgeNetworkProps } from './components/BadgeNetwork';\n\nimport BadgeStatusComponent from './components/BadgeStatus';\nexport const BadgeStatus = withThemeProvider(BadgeStatusComponent);\nexport {\n  BadgeStatusProps,\n  BadgeStatusStatus,\n  BadgeStatusSize,\n} from './components/BadgeStatus';\n\nimport BlockiesComponent from './primitives/Blockies';\nexport const Blockies = BlockiesComponent;\nexport { BlockiesProps } from './primitives/Blockies';\n\nimport ButtonAnimatedComponent from './primitives/ButtonAnimated';\nexport const ButtonAnimated = withThemeProvider(ButtonAnimatedComponent);\nexport { ButtonAnimatedProps } from './primitives/ButtonAnimated';\n\nimport ButtonBaseComponent from './primitives/ButtonBase';\nexport const ButtonBase = withThemeProvider(ButtonBaseComponent);\nexport { ButtonBaseProps, ButtonBaseSize } from './primitives/ButtonBase';\n\nimport ButtonComponent from './components/Button';\nexport const Button = withThemeProvider(ButtonComponent);\nexport { ButtonProps, ButtonSize, ButtonVariant } from './components/Button';\n\nimport ButtonIconComponent from './components/ButtonIcon';\nexport const ButtonIcon = withThemeProvider(ButtonIconComponent);\nexport { ButtonIconProps, ButtonIconSize } from './components/ButtonIcon';\n\nimport IconComponent from './components/Icon';\nexport const Icon = withThemeProvider(IconComponent);\nexport { IconColor, IconName, IconProps, IconSize } from './components/Icon';\n\nimport JazziconComponent from './primitives/Jazzicon';\nexport const Jazzicon = JazziconComponent;\nexport { JazziconProps } from './primitives/Jazzicon';\n\nimport TextButtonComponent from './components/TextButton';\nexport const TextButton = withThemeProvider(TextButtonComponent);\nexport { TextButtonProps } from './components/TextButton';\n\nimport TextComponent from './components/Text';\nexport const Text = withThemeProvider(TextComponent);\nexport {\n  FontWeight,\n  FontStyle,\n  TextColor,\n  TextProps,\n  TextVariant,\n} from './components/Text';\n\nimport TextOrChildrenComponent from './primitives/TextOrChildren';\nexport const TextOrChildren = withThemeProvider(TextOrChildrenComponent);\nexport { TextOrChildrenProps } from './primitives/TextOrChildren/';\n"]}

package/dist/primitives/AvatarBase/AvatarBase.constants.d.ts

@@ -0,0 +1,6 @@
+import type { AvatarBaseProps } from './AvatarBase.types';
+import { AvatarBaseSize } from '../../shared/enums';
+export declare const TWCLASSMAP_AVATARBASE_SIZE_SHAPE: Record<AvatarBaseSize, string>;
+export declare const MAP_AVATARBASE_SIZE_BORDERWIDTH: Record<AvatarBaseSize, number>;
+export declare const DEFAULT_AVATARBASE_PROPS: Required<Pick<AvatarBaseProps, 'size' | 'shape' | 'fallbackTextProps' | 'hasBorder' | 'hasSolidBackgroundColor'>>;
+//# sourceMappingURL=AvatarBase.constants.d.ts.map

package/dist/primitives/AvatarBase/AvatarBase.constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarBase.constants.d.ts","sourceRoot":"","sources":["../../../src/primitives/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,EAAE,cAAc,EAAmB,MAAM,oBAAoB,CAAC;AAGrE,eAAO,MAAM,gCAAgC,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAOzE,CAAC;AACJ,eAAO,MAAM,+BAA+B,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAM1E,CAAC;AAGF,eAAO,MAAM,wBAAwB,EAAE,QAAQ,CAC7C,IAAI,CACF,eAAe,EACb,MAAM,GACN,OAAO,GACP,mBAAmB,GACnB,WAAW,GACX,yBAAyB,CAC5B,CAYF,CAAC"}

package/dist/primitives/AvatarBase/AvatarBase.constants.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_AVATARBASE_PROPS = exports.MAP_AVATARBASE_SIZE_BORDERWIDTH = exports.TWCLASSMAP_AVATARBASE_SIZE_SHAPE = void 0;
+const Text_1 = require("../../components/Text");
+const enums_1 = require("../../shared/enums");
+// Mappings
+exports.TWCLASSMAP_AVATARBASE_SIZE_SHAPE = {
+    [enums_1.AvatarBaseSize.Xs]: 'rounded-sm',
+    [enums_1.AvatarBaseSize.Sm]: 'rounded-md',
+    [enums_1.AvatarBaseSize.Md]: 'rounded-lg',
+    [enums_1.AvatarBaseSize.Lg]: 'rounded-[10px]',
+    [enums_1.AvatarBaseSize.Xl]: 'rounded-xl',
+};
+exports.MAP_AVATARBASE_SIZE_BORDERWIDTH = {
+    [enums_1.AvatarBaseSize.Xs]: 1,
+    [enums_1.AvatarBaseSize.Sm]: 1,
+    [enums_1.AvatarBaseSize.Md]: 1,
+    [enums_1.AvatarBaseSize.Lg]: 2,
+    [enums_1.AvatarBaseSize.Xl]: 2,
+};
+// Defaults
+exports.DEFAULT_AVATARBASE_PROPS = {
+    size: enums_1.AvatarBaseSize.Md,
+    shape: enums_1.AvatarBaseShape.Circle,
+    fallbackTextProps: {
+        color: Text_1.TextColor.TextMuted,
+        variant: Text_1.TextVariant.BodySm,
+        fontWeight: Text_1.FontWeight.Medium,
+        twClassName: 'uppercase',
+    },
+    hasBorder: false,
+    hasSolidBackgroundColor: false,
+};
+//# sourceMappingURL=AvatarBase.constants.js.map

package/dist/primitives/AvatarBase/AvatarBase.constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarBase.constants.js","sourceRoot":"","sources":["../../../src/primitives/AvatarBase/AvatarBase.constants.ts"],"names":[],"mappings":";;;AACA,gDAA2E;AAC3E,8CAAqE;AAErE,WAAW;AACE,QAAA,gCAAgC,GAC3C;IACE,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,YAAY;IACjC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,gBAAgB;IACrC,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,YAAY;CAClC,CAAC;AACS,QAAA,+BAA+B,GAAmC;IAC7E,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,CAAC;IACtB,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,CAAC;IACtB,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,CAAC;IACtB,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,CAAC;IACtB,CAAC,sBAAc,CAAC,EAAE,CAAC,EAAE,CAAC;CACvB,CAAC;AAEF,WAAW;AACE,QAAA,wBAAwB,GASjC;IACF,IAAI,EAAE,sBAAc,CAAC,EAAE;IACvB,KAAK,EAAE,uBAAe,CAAC,MAAM;IAC7B,iBAAiB,EAAE;QACjB,KAAK,EAAE,gBAAS,CAAC,SAAS;QAC1B,OAAO,EAAE,kBAAW,CAAC,MAAM;QAC3B,UAAU,EAAE,iBAAU,CAAC,MAAM;QAC7B,WAAW,EAAE,WAAW;KACzB;IACD,SAAS,EAAE,KAAK;IAChB,uBAAuB,EAAE,KAAK;CAC/B,CAAC","sourcesContent":["import type { AvatarBaseProps } from './AvatarBase.types';\nimport { TextColor, TextVariant, FontWeight } from '../../components/Text';\nimport { AvatarBaseSize, AvatarBaseShape } from '../../shared/enums';\n\n// Mappings\nexport const TWCLASSMAP_AVATARBASE_SIZE_SHAPE: Record<AvatarBaseSize, string> =\n  {\n    [AvatarBaseSize.Xs]: 'rounded-sm',\n    [AvatarBaseSize.Sm]: 'rounded-md',\n    [AvatarBaseSize.Md]: 'rounded-lg',\n    [AvatarBaseSize.Lg]: 'rounded-[10px]',\n    [AvatarBaseSize.Xl]: 'rounded-xl',\n  };\nexport const MAP_AVATARBASE_SIZE_BORDERWIDTH: Record<AvatarBaseSize, number> = {\n  [AvatarBaseSize.Xs]: 1,\n  [AvatarBaseSize.Sm]: 1,\n  [AvatarBaseSize.Md]: 1,\n  [AvatarBaseSize.Lg]: 2,\n  [AvatarBaseSize.Xl]: 2,\n};\n\n// Defaults\nexport const DEFAULT_AVATARBASE_PROPS: Required<\n  Pick<\n    AvatarBaseProps,\n    | 'size'\n    | 'shape'\n    | 'fallbackTextProps'\n    | 'hasBorder'\n    | 'hasSolidBackgroundColor'\n  >\n> = {\n  size: AvatarBaseSize.Md,\n  shape: AvatarBaseShape.Circle,\n  fallbackTextProps: {\n    color: TextColor.TextMuted,\n    variant: TextVariant.BodySm,\n    fontWeight: FontWeight.Medium,\n    twClassName: 'uppercase',\n  },\n  hasBorder: false,\n  hasSolidBackgroundColor: false,\n};\n"]}

package/dist/primitives/AvatarBase/AvatarBase.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { AvatarBaseProps } from './AvatarBase.types';
+declare const AvatarBase: ({ children, size, shape, fallbackText, fallbackTextProps, hasBorder, hasSolidBackgroundColor, twClassName, style, ...props }: AvatarBaseProps) => React.JSX.Element;
+export default AvatarBase;
+//# sourceMappingURL=AvatarBase.d.ts.map

package/dist/primitives/AvatarBase/AvatarBase.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarBase.d.ts","sourceRoot":"","sources":["../../../src/primitives/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,QAAA,MAAM,UAAU,iIAWb,eAAe,sBA6BjB,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/primitives/AvatarBase/AvatarBase.js

@@ -0,0 +1,55 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+/* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
+const design_system_twrnc_preset_1 = require("@metamask-previews/design-system-twrnc-preset");
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const Text_1 = __importDefault(require("../../components/Text"));
+const AvatarBase_constants_1 = require("./AvatarBase.constants");
+const AvatarBase_utilities_1 = require("./AvatarBase.utilities");
+const AvatarBase = ({ children, size = AvatarBase_constants_1.DEFAULT_AVATARBASE_PROPS.size, shape = AvatarBase_constants_1.DEFAULT_AVATARBASE_PROPS.shape, fallbackText, fallbackTextProps, hasBorder = AvatarBase_constants_1.DEFAULT_AVATARBASE_PROPS.hasBorder, hasSolidBackgroundColor = AvatarBase_constants_1.DEFAULT_AVATARBASE_PROPS.hasSolidBackgroundColor, twClassName = '', style, ...props }) => {
+    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
+    const twContainerClassNames = (0, react_1.useMemo)(() => {
+        return (0, AvatarBase_utilities_1.generateAvatarBaseContainerClassNames)({
+            size,
+            shape,
+            hasBorder,
+            hasSolidBackgroundColor,
+            twClassName,
+        });
+    }, [size, shape, hasBorder, twClassName]);
+    return (<react_native_1.View style={[tw `${twContainerClassNames}`, style]} {...props}>
+      <react_native_1.View style={tw `bg-background-muted absolute top-0 left-0 bottom-0 right-0`}/>
+      {fallbackText ? (<Text_1.default {...AvatarBase_constants_1.DEFAULT_AVATARBASE_PROPS.fallbackTextProps} {...fallbackTextProps}>
+          {fallbackText}
+        </Text_1.default>) : (children)}
+    </react_native_1.View>);
+};
+exports.default = AvatarBase;
+//# sourceMappingURL=AvatarBase.js.map

package/dist/primitives/AvatarBase/AvatarBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarBase.js","sourceRoot":"","sources":["../../../src/primitives/AvatarBase/AvatarBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iEAAiE;AACjE,8FAA4E;AAC5E,+CAAuC;AACvC,+CAAoC;AAEpC,iEAAyC;AACzC,iEAAkE;AAElE,iEAA+E;AAE/E,MAAM,UAAU,GAAG,CAAC,EAClB,QAAQ,EACR,IAAI,GAAG,+CAAwB,CAAC,IAAI,EACpC,KAAK,GAAG,+CAAwB,CAAC,KAAK,EACtC,YAAY,EACZ,iBAAiB,EACjB,SAAS,GAAG,+CAAwB,CAAC,SAAS,EAC9C,uBAAuB,GAAG,+CAAwB,CAAC,uBAAuB,EAC1E,WAAW,GAAG,EAAE,EAChB,KAAK,EACL,GAAG,KAAK,EACQ,EAAE,EAAE;IACpB,MAAM,EAAE,GAAG,IAAA,wCAAW,GAAE,CAAC;IACzB,MAAM,qBAAqB,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACzC,OAAO,IAAA,4DAAqC,EAAC;YAC3C,IAAI;YACJ,KAAK;YACL,SAAS;YACT,uBAAuB;YACvB,WAAW;SACZ,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,CAAC;IAE1C,OAAO,CACL,CAAC,mBAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAA,GAAG,qBAAqB,EAAE,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAC5D;MAAA,CAAC,mBAAI,CACH,KAAK,CAAC,CAAC,EAAE,CAAA,4DAA4D,CAAC,EAExE;MAAA,CAAC,YAAY,CAAC,CAAC,CAAC,CACd,CAAC,cAAI,CACH,IAAI,+CAAwB,CAAC,iBAAiB,CAAC,CAC/C,IAAI,iBAAiB,CAAC,CAEtB;UAAA,CAAC,YAAY,CACf;QAAA,EAAE,cAAI,CAAC,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACH;IAAA,EAAE,mBAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,UAAU,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/prefer-nullish-coalescing */\nimport { useTailwind } from '@metamask-previews/design-system-twrnc-preset';\nimport React, { useMemo } from 'react';\nimport { View } from 'react-native';\n\nimport Text from '../../components/Text';\nimport { DEFAULT_AVATARBASE_PROPS } from './AvatarBase.constants';\nimport type { AvatarBaseProps } from './AvatarBase.types';\nimport { generateAvatarBaseContainerClassNames } from './AvatarBase.utilities';\n\nconst AvatarBase = ({\n  children,\n  size = DEFAULT_AVATARBASE_PROPS.size,\n  shape = DEFAULT_AVATARBASE_PROPS.shape,\n  fallbackText,\n  fallbackTextProps,\n  hasBorder = DEFAULT_AVATARBASE_PROPS.hasBorder,\n  hasSolidBackgroundColor = DEFAULT_AVATARBASE_PROPS.hasSolidBackgroundColor,\n  twClassName = '',\n  style,\n  ...props\n}: AvatarBaseProps) => {\n  const tw = useTailwind();\n  const twContainerClassNames = useMemo(() => {\n    return generateAvatarBaseContainerClassNames({\n      size,\n      shape,\n      hasBorder,\n      hasSolidBackgroundColor,\n      twClassName,\n    });\n  }, [size, shape, hasBorder, twClassName]);\n\n  return (\n    <View style={[tw`${twContainerClassNames}`, style]} {...props}>\n      <View\n        style={tw`bg-background-muted absolute top-0 left-0 bottom-0 right-0`}\n      />\n      {fallbackText ? (\n        <Text\n          {...DEFAULT_AVATARBASE_PROPS.fallbackTextProps}\n          {...fallbackTextProps}\n        >\n          {fallbackText}\n        </Text>\n      ) : (\n        children\n      )}\n    </View>\n  );\n};\n\nexport default AvatarBase;\n"]}

package/dist/primitives/AvatarBase/AvatarBase.types.d.ts

@@ -0,0 +1,61 @@
+import type { ViewProps, StyleProp, ViewStyle } from 'react-native';
+import type { TextProps } from '../../components/Text/Text.types';
+import { AvatarBaseSize, AvatarBaseShape } from '../../shared/enums';
+/**
+ * AvatarBase component props.
+ */
+export type AvatarBaseProps = {
+    /**
+     * Required prop for the content to be rendered within the AvatarBase
+     */
+    children?: React.ReactNode;
+    /**
+     * Optional prop to control the size of the AvatarBase
+     * Possible values:
+     *   AvatarBaseSize.Xs (16px),
+     * - AvatarBaseSize.Sm (24px),
+     * - AvatarBaseSize.Md (32px).
+     * - AvatarBaseSize.Lg (40px),
+     * - AvatarBaseSize.Xl (48px),
+     * @default AvatarBaseSize.Md
+     */
+    size?: AvatarBaseSize;
+    /**
+     * Optional prop to control the shape of the AvatarBase
+     * Possible values:
+     * - AvatarBaseShape.Circle
+     * - AvatarBaseShape.Square
+     * @default AvatarBaseShape.Circle
+     */
+    shape?: AvatarBaseShape;
+    /**
+     * Optional text to be rendered when the content fails to render
+     */
+    fallbackText?: string;
+    /**
+     * Optional props to be passed to the fallbackText when the content
+     * fails to render
+     */
+    fallbackTextProps?: Omit<TextProps, 'children'>;
+    /**
+     * Optional prop to include the border with the Avatar.
+     * For internal use only
+     * @default false
+     */
+    hasBorder?: boolean;
+    /**
+     * Optional prop to make sure there's no transparency in the background color
+     * For internal use only
+     * @default false
+     */
+    hasSolidBackgroundColor?: boolean;
+    /**
+     * Optional prop to add twrnc overriding classNames.
+     */
+    twClassName?: string;
+    /**
+     * Optional prop to control the style.
+     */
+    style?: StyleProp<ViewStyle>;
+} & ViewProps;
+//# sourceMappingURL=AvatarBase.types.d.ts.map

package/dist/primitives/AvatarBase/AvatarBase.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarBase.types.d.ts","sourceRoot":"","sources":["../../../src/primitives/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErE;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;IAChD;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,GAAG,SAAS,CAAC"}

package/dist/primitives/AvatarBase/AvatarBase.types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=AvatarBase.types.js.map

package/dist/primitives/AvatarBase/AvatarBase.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarBase.types.js","sourceRoot":"","sources":["../../../src/primitives/AvatarBase/AvatarBase.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ViewProps, StyleProp, ViewStyle } from 'react-native';\nimport type { TextProps } from '../../components/Text/Text.types';\nimport { AvatarBaseSize, AvatarBaseShape } from '../../shared/enums';\n\n/**\n * AvatarBase component props.\n */\nexport type AvatarBaseProps = {\n  /**\n   * Required prop for the content to be rendered within the AvatarBase\n   */\n  children?: React.ReactNode;\n  /**\n   * Optional prop to control the size of the AvatarBase\n   * Possible values:\n   *   AvatarBaseSize.Xs (16px),\n   * - AvatarBaseSize.Sm (24px),\n   * - AvatarBaseSize.Md (32px).\n   * - AvatarBaseSize.Lg (40px),\n   * - AvatarBaseSize.Xl (48px),\n   * @default AvatarBaseSize.Md\n   */\n  size?: AvatarBaseSize;\n  /**\n   * Optional prop to control the shape of the AvatarBase\n   * Possible values:\n   * - AvatarBaseShape.Circle\n   * - AvatarBaseShape.Square\n   * @default AvatarBaseShape.Circle\n   */\n  shape?: AvatarBaseShape;\n  /**\n   * Optional text to be rendered when the content fails to render\n   */\n  fallbackText?: string;\n  /**\n   * Optional props to be passed to the fallbackText when the content\n   * fails to render\n   */\n  fallbackTextProps?: Omit<TextProps, 'children'>;\n  /**\n   * Optional prop to include the border with the Avatar.\n   * For internal use only\n   * @default false\n   */\n  hasBorder?: boolean;\n  /**\n   * Optional prop to make sure there's no transparency in the background color\n   * For internal use only\n   * @default false\n   */\n  hasSolidBackgroundColor?: boolean;\n  /**\n   * Optional prop to add twrnc overriding classNames.\n   */\n  twClassName?: string;\n  /**\n   * Optional prop to control the style.\n   */\n  style?: StyleProp<ViewStyle>;\n} & ViewProps;\n"]}