@utilitywarehouse/hearth-react-native 0.1.0 → 0.3.0

package/src/utils/coloursAsArray.ts

@@ -1,7 +1,28 @@
 import { color } from '../tokens';
 
+const { light, dark, ...restOfColors } = color;
+
+/**
+ * Recursively flatten nested color objects into camelCase keys
+ */
+function flattenColorObject(obj: Record<string, any>, prefix = ''): Record<string, string> {
+  const result: Record<string, string> = {};
+
+  Object.entries(obj).forEach(([key, value]) => {
+    const camelKey = prefix ? `${prefix}${key.charAt(0).toUpperCase()}${key.slice(1)}` : key;
+
+    if (typeof value === 'string') {
+      result[camelKey] = value;
+    } else if (value && typeof value === 'object') {
+      Object.assign(result, flattenColorObject(value, camelKey));
+    }
+  });
+
+  return result;
+}
+
 export function extractLightColorValues(): Record<string, string> {
-  return Object.entries(color).reduce(
+  return Object.entries(restOfColors).reduce(
     (acc, [colorName, variants]) => {
       Object.entries(variants).forEach(([variantName, hexValue]) => {
         acc[`${colorName}${variantName}`] = hexValue;
@@ -12,6 +33,27 @@ export function extractLightColorValues(): Record<string, string> {
   );
 }
 
+/**
+ * Extract flattened semantic color values from light theme
+ */
+export function extractSemanticColorValues(): Record<string, string> {
+  return flattenColorObject(light);
+}
+
+/**
+ * Extract all flattened color values (primitive + semantic)
+ */
+export function extractAllColorValues(): Record<string, string> {
+  return {
+    ...extractLightColorValues(),
+    ...extractSemanticColorValues(),
+  };
+}
+
 export default function coloursAsArray(): Array<string> {
-  return [...Object.keys(color), ...Object.keys(extractLightColorValues())];
+  const primitiveColors = Object.keys(restOfColors);
+  const primitiveColorValues = Object.keys(extractLightColorValues());
+  const semanticColorValues = Object.keys(extractSemanticColorValues());
+
+  return [...primitiveColors, ...primitiveColorValues, ...semanticColorValues];
 }

package/src/utils/formatThousands.ts

@@ -0,0 +1,14 @@
+const formatThousands = (value: string) => {
+  if (!value) return value;
+  // Remove existing commas first
+  const cleaned = value.replace(/,/g, '');
+  // Allow leading minus, digits, optional decimal part
+  const match = cleaned.match(/^(-)?(\d*)(\.\d*)?$/);
+  if (!match) return value; // If it doesn't match a numeric pattern, return original (lets user continue typing)
+  const [, sign = '', intPart = '', decimalPart = ''] = match;
+  if (!intPart) return sign + intPart + decimalPart; // nothing to format yet
+  const withCommas = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+  return sign + withCommas + (decimalPart || '');
+};
+
+export default formatThousands;

package/src/utils/getFlattenedColorValue.ts

@@ -1,6 +1,6 @@
 import { ColorValue } from '../types';
 
-type ThemeColor = string | Record<string, string>;
+type ThemeColor = string | { [key: string]: string | ThemeColor };
 
 export default function getFlattenedColorValue(
   value?: string,

package/src/utils/hexWithOpacity.ts

@@ -0,0 +1,19 @@
+const hexWithOpacity = (hex: string, opacity: number): string => {
+  'worklet';
+  // Remove # if present
+  const cleanHex = hex.replace('#', '');
+
+  // Validate hex string format
+  if (cleanHex.length !== 6 || !/^[0-9A-Fa-f]{6}$/.test(cleanHex)) {
+    throw new Error(`Invalid hex color format: ${hex}. Expected format: #RRGGBB or RRGGBB`);
+  }
+
+  // Convert hex to RGB
+  const r = parseInt(cleanHex.substring(0, 2), 16);
+  const g = parseInt(cleanHex.substring(2, 4), 16);
+  const b = parseInt(cleanHex.substring(4, 6), 16);
+
+  return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+};
+
+export default hexWithOpacity;

package/src/utils/index.ts

@@ -1,4 +1,6 @@
+export { default as coloursAsArray, extractLightColorValues } from './coloursAsArray';
+export { default as formatThousands } from './formatThousands';
 export { default as getFlattenedColorValue } from './getFlattenedColorValue';
 export { default as getStyleValue } from './getStyleValue';
-export { default as coloursAsArray, extractLightColorValues } from './coloursAsArray';
+export { default as hexWithOpacity } from './hexWithOpacity';
 export * from './styleUtils';

package/src/utils/styleUtils.ts

@@ -232,6 +232,25 @@ export const viewStyleProps = new Set<string>([
   'zIndex',
 ]);
 
+/**
+ * Helper function to convert camelCase back to nested object path
+ * e.g., feedbackDangerSurfaceDefault -> ['feedback', 'danger', 'surface', 'default']
+ */
+const camelCaseToPath = (camelCased: string): string[] => {
+  // Split on uppercase letters but keep them
+  const parts = camelCased.split(/(?=[A-Z])/).map(part => part.toLowerCase());
+  return parts;
+};
+
+/**
+ * Helper function to get nested value from object using path array
+ */
+const getNestedValue = (obj: any, path: string[]): any => {
+  return path.reduce((current, key) => {
+    return current && typeof current === 'object' ? current[key] : undefined;
+  }, obj);
+};
+
 /**
  * Helper function to resolve a theme value
  */
@@ -239,6 +258,23 @@ export const resolveThemeValue = (value: any, themeMapping: any): any => {
   if (typeof value !== 'string' || !themeMapping || typeof themeMapping !== 'object') {
     return value;
   }
+
+  // First, try direct lookup for simple values
+  if (themeMapping[value] !== undefined) {
+    return themeMapping[value];
+  }
+
+  // Try camelCase to nested path conversion (e.g., feedbackDangerSurfaceDefault)
+  if (/^[a-z][a-zA-Z]*$/.test(value)) {
+    // Only camelCase strings without numbers
+    const path = camelCaseToPath(value);
+    const nestedValue = getNestedValue(themeMapping, path);
+    if (nestedValue !== undefined) {
+      return nestedValue;
+    }
+  }
+
+  // Then, try the existing numeric suffix pattern (e.g., broadbandBlue100)
   const shadeMatch = value.match(/\d+$/);
   if (shadeMatch) {
     const shade = shadeMatch[0];
@@ -248,5 +284,7 @@ export const resolveThemeValue = (value: any, themeMapping: any): any => {
       return nested[shade] ?? value;
     }
   }
-  return themeMapping[value] ?? value;
+
+  // If none of the approaches work, return the original value
+  return value;
 };

package/src/vite-env.d.ts

@@ -1 +1,6 @@
 /// <reference types="vite/client" />
+
+declare module '*.png' {
+  const value: any;
+  export default value;
+}

package/build/components/Accordion/AccordionHeading/AccordionHeading.d.ts

@@ -1,6 +0,0 @@
-import AccordionHeadingProps from './AccordionHeading.props';
-declare const AccordionHeading: {
-    ({ text, helperText, children, style, ...props }: AccordionHeadingProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default AccordionHeading;

package/build/components/Accordion/AccordionHeading/AccordionHeading.js

@@ -1,16 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { View } from 'react-native';
-import { StyleSheet } from 'react-native-unistyles';
-import AccordionHeadingTitle from './AccordionHeadingTitle';
-import AccordionHeadingHelperText from './AccordionHeadingHelperText';
-import AccordionHeadingTextContent from './AccordionHeadingTextContent';
-const AccordionHeading = ({ text, helperText, children, style, ...props }) => (_jsx(View, { ...props, style: [styles.container, style], children: children ? (children) : (_jsxs(AccordionHeadingTextContent, { children: [_jsx(AccordionHeadingTitle, { children: text }), !!helperText && _jsx(AccordionHeadingHelperText, { children: helperText })] })) }));
-const styles = StyleSheet.create(theme => ({
-    container: {
-        flexDirection: 'row',
-        gap: theme.components.accordion.heading.gap,
-        paddingBottom: theme.components.accordion.gap,
-    },
-}));
-AccordionHeading.displayName = 'AccordionHeading';
-export default AccordionHeading;

package/build/components/Accordion/AccordionHeading/AccordionHeading.props.d.ts

@@ -1,14 +0,0 @@
-import type { ViewProps } from 'react-native';
-type AccordionHeadingBaseProps = Omit<ViewProps, 'children'>;
-export interface AccordionHeadingWithChildren extends AccordionHeadingBaseProps {
-    children: ViewProps['children'];
-    text?: never;
-    helperText?: never;
-}
-export interface AccordionHeadingWithoutChildren extends AccordionHeadingBaseProps {
-    children?: never;
-    text: string;
-    helperText?: string;
-}
-type AccordionHeadingProps = AccordionHeadingWithChildren | AccordionHeadingWithoutChildren;
-export default AccordionHeadingProps;

package/build/components/Accordion/AccordionHeading/AccordionHeadingHelperText.d.ts

@@ -1,6 +0,0 @@
-import TextProps from '../../BodyText/BodyText.props';
-declare const AccordionHeadingHelperText: {
-    ({ children, ...props }: TextProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default AccordionHeadingHelperText;

package/build/components/Accordion/AccordionHeading/AccordionHeadingHelperText.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { StyleSheet } from 'react-native-unistyles';
-import { BodyText } from '../../BodyText';
-const AccordionHeadingHelperText = ({ children, ...props }) => {
-    return (_jsx(BodyText, { size: "md", ...props, style: [styles.helperText, props.style], children: children }));
-};
-const styles = StyleSheet.create(theme => ({
-    helperText: {
-        color: theme.components.text.colorSecondary,
-    },
-}));
-AccordionHeadingHelperText.displayName = 'AccordionHeadingHelperText';
-export default AccordionHeadingHelperText;

package/build/components/Accordion/AccordionHeading/AccordionHeadingTextContent.d.ts

@@ -1,6 +0,0 @@
-import { type ViewProps } from 'react-native';
-declare const AccordionHeadingTextContent: {
-    ({ children, ...props }: ViewProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default AccordionHeadingTextContent;

package/build/components/Accordion/AccordionHeading/AccordionHeadingTextContent.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { View } from 'react-native';
-import { StyleSheet } from 'react-native-unistyles';
-const AccordionHeadingTextContent = ({ children, ...props }) => {
-    return (_jsx(View, { ...props, style: [styles.container, props.style], children: children }));
-};
-const styles = StyleSheet.create(theme => ({
-    container: {
-        gap: theme.components.list.heading.textContentGap,
-        flex: 1,
-    },
-}));
-AccordionHeadingTextContent.displayName = 'AccordionHeadingTextContent';
-export default AccordionHeadingTextContent;

package/build/components/Accordion/AccordionHeading/AccordionHeadingTitle.d.ts

@@ -1,6 +0,0 @@
-import TextProps from '../../DetailText/DetailText.props';
-declare const AccordionHeadingTitle: {
-    ({ children, ...props }: TextProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default AccordionHeadingTitle;

package/build/components/Accordion/AccordionHeading/AccordionHeadingTitle.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { DetailText } from '../../DetailText';
-const AccordionHeadingTitle = ({ children, ...props }) => {
-    return (_jsx(DetailText, { size: "lg", ...props, children: children }));
-};
-AccordionHeadingTitle.displayName = 'AccordionHeadingTitle';
-export default AccordionHeadingTitle;

package/build/components/Accordion/AccordionHeading/index.d.ts

@@ -1,4 +0,0 @@
-export { default as AccordionHeading } from './AccordionHeading';
-export { default as AccordionHeadingTitle } from './AccordionHeadingTitle';
-export { default as AccordionHeadingHelperText } from './AccordionHeadingHelperText';
-export { default as AccordionHeadingTextContent } from './AccordionHeadingTextContent';

package/build/components/Accordion/AccordionHeading/index.js

@@ -1,4 +0,0 @@
-export { default as AccordionHeading } from './AccordionHeading';
-export { default as AccordionHeadingTitle } from './AccordionHeadingTitle';
-export { default as AccordionHeadingHelperText } from './AccordionHeadingHelperText';
-export { default as AccordionHeadingTextContent } from './AccordionHeadingTextContent';

package/build/components/List/ListHeading/ListHeading.d.ts

@@ -1,6 +0,0 @@
-import ListHeadingProps from './ListHeading.props';
-declare const ListHeading: {
-    ({ text, helperText, children, style, linkDisabled, linkHref, linkIcon, linkIconPosition, linkOnPress, linkShowIcon, linkTarget, linkText, ...props }: ListHeadingProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default ListHeading;

package/build/components/List/ListHeading/ListHeading.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { View } from 'react-native';
-import { StyleSheet } from 'react-native-unistyles';
-import ListHeadingTitle from './ListHeadingTitle';
-import ListHeadingHelperText from './ListHeadingHelperText';
-import ListHeadingTextContent from './ListHeadingTextContent';
-import { Link } from '../../Link';
-import { useListContext } from '../List.context';
-const ListHeading = ({ text, helperText, children, style, linkDisabled, linkHref, linkIcon, linkIconPosition, linkOnPress, linkShowIcon, linkTarget, linkText, ...props }) => {
-    const { disabled } = useListContext();
-    return (_jsx(View, { ...props, style: [styles.container, style], children: children ? (children) : (_jsxs(_Fragment, { children: [_jsxs(ListHeadingTextContent, { children: [_jsx(ListHeadingTitle, { children: text }), !!helperText && _jsx(ListHeadingHelperText, { children: helperText })] }), !!linkText && (_jsx(Link, { href: linkHref, disabled: disabled ?? linkDisabled, onPress: linkOnPress, icon: linkIcon, showIcon: linkShowIcon, iconPosition: linkIconPosition, target: linkTarget, children: linkText }))] })) }));
-};
-ListHeading.displayName = 'ListHeading';
-const styles = StyleSheet.create(theme => ({
-    container: {
-        flexDirection: 'row',
-        gap: theme.components.list.heading.gap,
-    },
-}));
-export default ListHeading;

package/build/components/List/ListHeading/ListHeadingHelperText.d.ts

@@ -1,6 +0,0 @@
-import TextProps from '../../BodyText/BodyText.props';
-declare const ListHeadingHelperText: {
-    ({ children, ...props }: TextProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default ListHeadingHelperText;

package/build/components/List/ListHeading/ListHeadingTitle.d.ts

@@ -1,6 +0,0 @@
-import TextProps from '../../DetailText/DetailText.props';
-declare const ListHeadingTitle: {
-    ({ children, ...props }: TextProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export default ListHeadingTitle;

package/build/components/List/ListHeading/ListHeadingTitle.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { DetailText } from '../../DetailText';
-const ListHeadingTitle = ({ children, ...props }) => {
-    return (_jsx(DetailText, { size: "lg", ...props, children: children }));
-};
-ListHeadingTitle.displayName = 'ListHeadingTitle';
-export default ListHeadingTitle;

package/build/components/List/ListHeading/index.d.ts

@@ -1,4 +0,0 @@
-export { default as ListHeading } from './ListHeading';
-export { default as ListHeadingTitle } from './ListHeadingTitle';
-export { default as ListHeadingHelperText } from './ListHeadingHelperText';
-export { default as ListHeadingTextContent } from './ListHeadingTextContent';

package/build/components/List/ListHeading/index.js

@@ -1,4 +0,0 @@
-export { default as ListHeading } from './ListHeading';
-export { default as ListHeadingTitle } from './ListHeadingTitle';
-export { default as ListHeadingHelperText } from './ListHeadingHelperText';
-export { default as ListHeadingTextContent } from './ListHeadingTextContent';

package/build/tokens/components/dark/footer.d.ts

@@ -1,12 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-declare const _default: {
-    readonly calendar: {
-        readonly footer: {
-            readonly gap: 8;
-        };
-    };
-    readonly backgroundColor: "#fcfbf2";
-};
-export default _default;

package/build/tokens/components/dark/footer.js

@@ -1,11 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-export default {
-    calendar: {
-        footer: {
-            gap: 8,
-        },
-    },
-    backgroundColor: '#fcfbf2',
-};

package/build/tokens/components/dark/icon.d.ts

@@ -1,15 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-declare const _default: {
-    readonly item: {
-        readonly icon: {
-            readonly colorActive: "#7a42c8";
-            readonly colorDefault: "#e7e6e6";
-        };
-    };
-    readonly color: "#e7e6e6";
-    readonly colorInvalid: "#ff7964";
-    readonly colorValid: "#58ca93";
-};
-export default _default;

package/build/tokens/components/dark/icon.js

@@ -1,14 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-export default {
-    item: {
-        icon: {
-            colorActive: '#7a42c8',
-            colorDefault: '#e7e6e6',
-        },
-    },
-    color: '#e7e6e6',
-    colorInvalid: '#ff7964',
-    colorValid: '#58ca93',
-};

package/build/tokens/components/dark/text.d.ts

@@ -1,11 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-declare const _default: {
-    readonly color: "#e7e6e6";
-    readonly colorInvalid: "#ff7964";
-    readonly colorInverted: "#f6f5f5";
-    readonly colorSecondary: "#b2afae";
-    readonly colorValid: "#58ca93";
-};
-export default _default;

package/build/tokens/components/dark/text.js

@@ -1,10 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-export default {
-    color: '#e7e6e6',
-    colorInvalid: '#ff7964',
-    colorInverted: '#f6f5f5',
-    colorSecondary: '#b2afae',
-    colorValid: '#58ca93',
-};

package/build/tokens/components/light/footer.d.ts

@@ -1,12 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-declare const _default: {
-    readonly calendar: {
-        readonly footer: {
-            readonly gap: 8;
-        };
-    };
-    readonly backgroundColor: "#fcfbf2";
-};
-export default _default;

package/build/tokens/components/light/footer.js

@@ -1,11 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-export default {
-    calendar: {
-        footer: {
-            gap: 8,
-        },
-    },
-    backgroundColor: '#fcfbf2',
-};

package/build/tokens/components/light/icon.d.ts

@@ -1,15 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-declare const _default: {
-    readonly item: {
-        readonly icon: {
-            readonly colorActive: "#7a42c8";
-            readonly colorDefault: "#101010";
-        };
-    };
-    readonly color: "#101010";
-    readonly colorInvalid: "#de2612";
-    readonly colorValid: "#0f834a";
-};
-export default _default;

package/build/tokens/components/light/icon.js

@@ -1,14 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-export default {
-    item: {
-        icon: {
-            colorActive: '#7a42c8',
-            colorDefault: '#101010',
-        },
-    },
-    color: '#101010',
-    colorInvalid: '#de2612',
-    colorValid: '#0f834a',
-};

package/build/tokens/components/light/text.d.ts

@@ -1,11 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-declare const _default: {
-    readonly color: "#101010";
-    readonly colorInvalid: "#de2612";
-    readonly colorInverted: "#f6f5f5";
-    readonly colorSecondary: "#6f6c6b";
-    readonly colorValid: "#0f834a";
-};
-export default _default;

package/build/tokens/components/light/text.js

@@ -1,10 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-export default {
-    color: '#101010',
-    colorInvalid: '#de2612',
-    colorInverted: '#f6f5f5',
-    colorSecondary: '#6f6c6b',
-    colorValid: '#0f834a',
-};

package/src/components/Accordion/AccordionHeading/AccordionHeading.props.ts

@@ -1,19 +0,0 @@
-import type { ViewProps } from 'react-native';
-
-type AccordionHeadingBaseProps = Omit<ViewProps, 'children'>;
-
-export interface AccordionHeadingWithChildren extends AccordionHeadingBaseProps {
-  children: ViewProps['children'];
-  text?: never;
-  helperText?: never;
-}
-
-export interface AccordionHeadingWithoutChildren extends AccordionHeadingBaseProps {
-  children?: never;
-  text: string;
-  helperText?: string;
-}
-
-type AccordionHeadingProps = AccordionHeadingWithChildren | AccordionHeadingWithoutChildren;
-
-export default AccordionHeadingProps;

package/src/components/Accordion/AccordionHeading/AccordionHeading.tsx

@@ -1,38 +0,0 @@
-import { View } from 'react-native';
-import { StyleSheet } from 'react-native-unistyles';
-import AccordionHeadingTitle from './AccordionHeadingTitle';
-import AccordionHeadingHelperText from './AccordionHeadingHelperText';
-import AccordionHeadingProps from './AccordionHeading.props';
-import AccordionHeadingTextContent from './AccordionHeadingTextContent';
-
-const AccordionHeading = ({
-  text,
-  helperText,
-  children,
-  style,
-
-  ...props
-}: AccordionHeadingProps) => (
-  <View {...props} style={[styles.container, style]}>
-    {children ? (
-      children
-    ) : (
-      <AccordionHeadingTextContent>
-        <AccordionHeadingTitle>{text}</AccordionHeadingTitle>
-        {!!helperText && <AccordionHeadingHelperText>{helperText}</AccordionHeadingHelperText>}
-      </AccordionHeadingTextContent>
-    )}
-  </View>
-);
-
-const styles = StyleSheet.create(theme => ({
-  container: {
-    flexDirection: 'row',
-    gap: theme.components.accordion.heading.gap,
-    paddingBottom: theme.components.accordion.gap,
-  },
-}));
-
-AccordionHeading.displayName = 'AccordionHeading';
-
-export default AccordionHeading;

package/src/components/Accordion/AccordionHeading/AccordionHeadingHelperText.tsx

@@ -1,22 +0,0 @@
-import { StyleSheet } from 'react-native-unistyles';
-
-import TextProps from '../../BodyText/BodyText.props';
-import { BodyText } from '../../BodyText';
-
-const AccordionHeadingHelperText = ({ children, ...props }: TextProps) => {
-  return (
-    <BodyText size="md" {...props} style={[styles.helperText, props.style]}>
-      {children}
-    </BodyText>
-  );
-};
-
-const styles = StyleSheet.create(theme => ({
-  helperText: {
-    color: theme.components.text.colorSecondary,
-  },
-}));
-
-AccordionHeadingHelperText.displayName = 'AccordionHeadingHelperText';
-
-export default AccordionHeadingHelperText;

package/src/components/Accordion/AccordionHeading/AccordionHeadingTextContent.tsx

@@ -1,21 +0,0 @@
-import { View, type ViewProps } from 'react-native';
-import { StyleSheet } from 'react-native-unistyles';
-
-const AccordionHeadingTextContent = ({ children, ...props }: ViewProps) => {
-  return (
-    <View {...props} style={[styles.container, props.style]}>
-      {children}
-    </View>
-  );
-};
-
-const styles = StyleSheet.create(theme => ({
-  container: {
-    gap: theme.components.list.heading.textContentGap,
-    flex: 1,
-  },
-}));
-
-AccordionHeadingTextContent.displayName = 'AccordionHeadingTextContent';
-
-export default AccordionHeadingTextContent;

package/src/components/Accordion/AccordionHeading/AccordionHeadingTitle.tsx

@@ -1,14 +0,0 @@
-import TextProps from '../../DetailText/DetailText.props';
-import { DetailText } from '../../DetailText';
-
-const AccordionHeadingTitle = ({ children, ...props }: TextProps) => {
-  return (
-    <DetailText size="lg" {...props}>
-      {children}
-    </DetailText>
-  );
-};
-
-AccordionHeadingTitle.displayName = 'AccordionHeadingTitle';
-
-export default AccordionHeadingTitle;