@utilitywarehouse/hearth-react-native 0.1.0

package/.storybook/main.ts

@@ -0,0 +1,55 @@
+import remarkGfm from 'remark-gfm';
+
+const unistylesPluginOptions = {
+  autoProcessImports: ['@utilitywarehouse/hearth-react-native'],
+  autoProcessPaths: ['@utilitywarehouse/hearth-react-native'],
+  root: './src',
+  debug: false,
+};
+
+/** @type { import('@storybook/react-native-web-vite').StorybookConfig } */
+const config = {
+  stories: ['../**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: [
+    '@chromatic-com/storybook',
+    {
+      name: '@storybook/addon-docs',
+      options: {
+        mdxPluginOptions: {
+          mdxCompileOptions: {
+            remarkPlugins: [remarkGfm],
+          },
+        },
+      },
+    },
+    '@storybook/addon-a11y',
+    '@storybook/addon-vitest',
+  ],
+  framework: {
+    name: '@storybook/react-native-web-vite',
+    options: {
+      pluginReactOptions: {
+        babel: {
+          plugins: [
+            ['react-native-unistyles/plugin', unistylesPluginOptions],
+            '@babel/plugin-proposal-export-namespace-from',
+            'react-native-reanimated/plugin',
+          ],
+        },
+      },
+    },
+  },
+  viteFinal: config => {
+    return {
+      ...config,
+      resolve: {
+        ...config.resolve,
+        alias: {
+          ...config.resolve?.alias,
+          '@utilitywarehouse/hearth-react-native-icons': '@utilitywarehouse/hearth-react-icons',
+        },
+      },
+    };
+  },
+};
+export default config;

package/.storybook/manager.ts

@@ -0,0 +1,8 @@
+import '@utilitywarehouse/hearth-fonts';
+import { addons } from 'storybook/manager-api';
+import '../../../shared/storybook/styles/manager.css';
+import theme from '../../../shared/storybook/theme';
+
+addons.setConfig({
+  theme,
+});

package/.storybook/preview.tsx

@@ -0,0 +1,159 @@
+import { BottomSheetModalProvider } from '@gorhom/bottom-sheet';
+import '@utilitywarehouse/hearth-fonts';
+import { color } from '@utilitywarehouse/hearth-tokens';
+import { useEffect } from 'react';
+import '../../../shared/storybook/styles/preview.css';
+import theme from '../../../shared/storybook/theme';
+import { breakpoints, StyleSheet, themes, UnistylesRuntime } from '../src/core';
+
+StyleSheet.configure({
+  themes,
+  breakpoints,
+  settings: {
+    initialTheme: 'light',
+    adaptiveThemes: false,
+  },
+});
+
+/** @type { import('@storybook/react-native-web-vite').Preview } */
+const preview = {
+  globalTypes: {
+    darkMode: {
+      description: 'Toggle between light and dark mode',
+      defaultValue: false,
+      toolbar: {
+        title: 'Dark Mode',
+        icon: 'moon',
+        items: [
+          { value: false, icon: 'sun', title: 'Light mode' },
+          { value: true, icon: 'moon', title: 'Dark mode' },
+        ],
+        dynamicTitle: true,
+      },
+    },
+  },
+  beforeAll: () => {
+    if (!__DEV__) {
+      let canAccessParent = false;
+      try {
+        canAccessParent = window.parent.location.hostname === window.location.hostname;
+      } catch {
+        // CORS error, can't access parent domain
+        canAccessParent = false;
+      }
+
+      if (canAccessParent) {
+        const storiesMenuItem = window.parent.document.getElementById('stories');
+        const storiesMenuItemButton = storiesMenuItem?.querySelector('button');
+        if (storiesMenuItemButton?.getAttribute('aria-expanded') === 'true') {
+          storiesMenuItemButton.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+        }
+      }
+    }
+  },
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+    options: {
+      storySort: {
+        order: [
+          'Introduction',
+          'Getting Started',
+          'Styling',
+          'Theme Tokens',
+          'Hooks',
+          'Layout Components',
+          'All Components',
+        ],
+      },
+    },
+    docs: {
+      theme,
+    },
+    a11y: {
+      // 'todo' - show a11y violations in the test UI only
+      // 'error' - fail CI on a11y violations
+      // 'off' - skip a11y checks entirely
+      test: 'todo',
+    },
+  },
+  decorators: [
+    (Story, { args, globals }) => {
+      const isDarkMode = globals.darkMode;
+
+      useEffect(() => {
+        const storybookContainer = document.getElementsByTagName('body')[0];
+        if (storybookContainer) {
+          if (args.inverted) {
+            storybookContainer.style.backgroundColor = color.purple['700'];
+          } else {
+            storybookContainer.style.backgroundColor = isDarkMode
+              ? color.dark.background.primary
+              : color.light.background.primary;
+          }
+        }
+
+        let canAccessParent = false;
+        try {
+          canAccessParent = window.parent.location.hostname === window.location.hostname;
+        } catch {
+          // CORS error, can't access parent domain
+          canAccessParent = false;
+        }
+
+        if (canAccessParent) {
+          // Update the Storybook theme class for manager UI
+          const managerRoot = window.parent?.document?.documentElement;
+          if (managerRoot) {
+            if (isDarkMode) {
+              managerRoot.classList.add('dark');
+              managerRoot.setAttribute('data-theme', 'dark');
+            } else {
+              managerRoot.classList.remove('dark');
+              managerRoot.setAttribute('data-theme', 'light');
+            }
+            if (args.inverted) {
+              managerRoot.classList.add('inverted');
+              managerRoot.setAttribute('data-inverted', 'true');
+            } else {
+              managerRoot.classList.remove('inverted');
+              managerRoot.removeAttribute('data-inverted');
+            }
+          }
+        }
+        // Update the preview iframe theme
+        const previewRoot = document.documentElement;
+        if (previewRoot) {
+          if (isDarkMode) {
+            previewRoot.classList.add('dark');
+            previewRoot.setAttribute('data-theme', 'dark');
+          } else {
+            previewRoot.classList.remove('dark');
+            previewRoot.setAttribute('data-theme', 'light');
+          }
+          if (args.inverted) {
+            previewRoot.classList.add('inverted');
+            previewRoot.setAttribute('data-inverted', 'true');
+          } else {
+            previewRoot.classList.remove('inverted');
+            previewRoot.removeAttribute('data-inverted');
+          }
+        }
+
+        UnistylesRuntime.setTheme(isDarkMode ? 'dark' : 'light');
+      }, [isDarkMode, args.darkMode, args.surface, args.inverted]);
+
+      return (
+        <BottomSheetModalProvider>
+          <Story args={{ ...args, darkMode: isDarkMode }} />
+        </BottomSheetModalProvider>
+      );
+    },
+  ],
+};
+
+export default preview;

package/.storybook/vitest.setup.ts

@@ -0,0 +1,7 @@
+import * as a11yAddonAnnotations from "@storybook/addon-a11y/preview";
+import { setProjectAnnotations } from '@storybook/react-native-web-vite';
+import * as projectAnnotations from './preview';
+
+// This is an important step to apply the right configuration when testing your stories.
+// More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
+setProjectAnnotations([a11yAddonAnnotations, projectAnnotations]);

package/.turbo/turbo-build.log

@@ -0,0 +1,4 @@
+
+> @utilitywarehouse/hearth-react-native@0.1.0 build /home/runner/work/hearth/hearth/packages/react-native
+> tsc
+

package/.turbo/turbo-lint.log

@@ -0,0 +1,6 @@
+
+> @utilitywarehouse/hearth-react-native@0.1.0 lint /home/runner/work/hearth/hearth/packages/react-native
+> TIMING=1 eslint --max-warnings 0
+
+Rule | Time (ms) | Relative
+:----|----------:|--------:

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @utilitywarehouse/hearth-react-native
+
+## 0.1.0
+
+### Minor Changes
+
+- [`f6366c4`](https://github.com/utilitywarehouse/hearth/commit/f6366c4da2676c535dca90be570d6e6bae5a0349) Thanks [@jordmccord](https://github.com/jordmccord)! - Initial Release 🎉

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

@@ -0,0 +1,13 @@
+declare const AccordionContext: import("react").Context<{
+    noPadding?: boolean;
+    disabled?: boolean;
+    divider?: boolean;
+    contentNoPadding?: boolean;
+}>;
+export declare const useAccordionContext: () => {
+    noPadding?: boolean;
+    disabled?: boolean;
+    divider?: boolean;
+    contentNoPadding?: boolean;
+};
+export default AccordionContext;

package/build/components/Accordion/Accordion.context.js

@@ -0,0 +1,5 @@
+/* eslint-disable react-refresh/only-export-components */
+import { createContext, useContext } from 'react';
+const AccordionContext = createContext({});
+export const useAccordionContext = () => useContext(AccordionContext);
+export default AccordionContext;

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

@@ -0,0 +1,25 @@
+import { AccordionProps } from './Accordion.props';
+import { AccordionItemProps } from './AccordionItem.props';
+export declare const AccordionHeader: import("react").ForwardRefExoticComponent<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").ViewProps>>;
+export declare const AccordionTrigger: import("react").ForwardRefExoticComponent<Omit<import("react-native").PressableProps & {
+    states?: {
+        active?: boolean;
+    };
+}, "children"> & import("@gluestack-ui/accordion/lib/typescript/types").IAccordionTriggerProps & import("react").RefAttributes<import("react-native").PressableProps & {
+    states?: {
+        active?: boolean;
+    };
+}>>;
+export declare const AccordionContent: import("react").ForwardRefExoticComponent<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").ViewProps>>;
+export declare const AccordionContentText: import("react").ForwardRefExoticComponent<import("react-native").TextProps & import("react").RefAttributes<import("react-native").TextProps>>;
+export declare const AccordionIcon: import("react").ForwardRefExoticComponent<import("..").IconProps & import("react").RefAttributes<import("..").IconProps>>;
+export declare const AccordionTitleText: import("react").ForwardRefExoticComponent<import("react-native").TextProps & import("react").RefAttributes<import("react-native").TextProps>>;
+declare const Accordion: {
+    ({ children, collapsible, type, headingText, headingHelperText, ...props }: AccordionProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const AccordionItem: {
+    ({ children, value, title, expanded, triggerContent, testID, ...props }: AccordionItemProps): import("react/jsx-runtime").JSX.Element | null;
+    displayName: string;
+};
+export default Accordion;

package/build/components/Accordion/Accordion.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Children, isValidElement, useMemo } from 'react';
+import { createAccordion } from '@gluestack-ui/accordion';
+import AccordionRoot from './AccordionRoot';
+import AccordionContentTextComponent from './AccordionContentText';
+import AccordionIconComponent from './AccordionIcon';
+import AccordionContentComponent from './AccordionContent';
+import AccordionHeaderComponent from './AccordionHeader';
+import AccordionItemRoot from './AccordionItemRoot';
+import AccordionTitleTextComponent from './AccordionTitleText';
+import AccordionTriggerComponent from './AccordionTrigger';
+import { ChevronDownSmallIcon, ChevronUpSmallIcon, } from '@utilitywarehouse/hearth-react-native-icons';
+import { AccordionHeading } from './AccordionHeading';
+const AccordionComponent = createAccordion({
+    Root: AccordionRoot,
+    ContentText: AccordionContentTextComponent,
+    Icon: AccordionIconComponent,
+    Content: AccordionContentComponent,
+    Header: AccordionHeaderComponent,
+    Item: AccordionItemRoot,
+    TitleText: AccordionTitleTextComponent,
+    Trigger: AccordionTriggerComponent,
+});
+const AccordionItemComponent = AccordionComponent.Item;
+export const AccordionHeader = AccordionComponent.Header;
+export const AccordionTrigger = AccordionComponent.Trigger;
+export const AccordionContent = AccordionComponent.Content;
+export const AccordionContentText = AccordionComponent.ContentText;
+export const AccordionIcon = AccordionComponent.Icon;
+export const AccordionTitleText = AccordionComponent.TitleText;
+const Accordion = ({ children, collapsible, type = 'multiple', headingText, headingHelperText, ...props }) => (_jsxs(AccordionComponent, { isDisabled: props.disabled, isCollapsible: collapsible, type: type, contentNoPadding: props.contentNoPadding, ...props, children: [headingText ? _jsx(AccordionHeading, { text: headingText, helperText: headingHelperText }) : null, children] }));
+let accordionItemCounter = 0;
+export const AccordionItem = ({ children, value, title, expanded, triggerContent, testID, ...props }) => {
+    const itemValue = useMemo(() => {
+        if (value !== undefined) {
+            return value;
+        }
+        const newId = `accordion-item-${accordionItemCounter}`;
+        accordionItemCounter += 1;
+        return newId;
+    }, [value]);
+    if (!children) {
+        return null;
+    }
+    const processedChildren = Children.toArray(children);
+    const hasContentComponent = processedChildren.some(
+    // @ts-expect-error - type
+    child => isValidElement(child) && child.type.displayName === 'AccordionContent');
+    return (_jsx(AccordionItemComponent, { value: itemValue, title: title, isDisabled: props.disabled, ...props, children: hasContentComponent ? (children) : (_jsxs(_Fragment, { children: [_jsx(AccordionHeader, { children: _jsx(AccordionTrigger, { isExpanded: expanded, testID: testID, children: ({ isExpanded }) => {
+                            return (_jsxs(_Fragment, { children: [_jsx(AccordionTitleText, { children: title }), triggerContent, isExpanded ? (_jsx(AccordionIcon, { as: ChevronUpSmallIcon })) : (_jsx(AccordionIcon, { as: ChevronDownSmallIcon }))] }));
+                        } }) }), _jsx(AccordionContent, { children: children })] })) }));
+};
+AccordionItem.displayName = 'AccordionItem';
+Accordion.displayName = 'Accordion';
+AccordionHeader.displayName = 'AccordionHeader';
+AccordionTrigger.displayName = 'AccordionTrigger';
+AccordionContent.displayName = 'AccordionContent';
+AccordionContentText.displayName = 'AccordionContentText';
+AccordionIcon.displayName = 'AccordionIcon';
+AccordionTitleText.displayName = 'AccordionTitleText';
+export default Accordion;

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

@@ -0,0 +1,42 @@
+import { ViewProps } from 'react-native';
+export interface AccordionProps extends ViewProps {
+    /**
+     * When type is "single" or "multiple", allows closing content when clicking trigger for an open item.
+     * @default true
+     */
+    collapsible?: boolean;
+    /**
+     * When true, prevents the user from interacting with the accordion and all its items.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Determines whether one or multiple items can be opened at the same time.
+     * @default 'multiple'
+     */
+    type?: 'single' | 'multiple';
+    /**
+     * The value of the item to expand when initially rendered when type is "single" or "multiple".
+     */
+    defaultValue?: Array<string>;
+    /**
+     * The controlled value of the item to expand when type is "single" or "multiple".
+     */
+    value?: Array<string>;
+    /**
+     * Event handler called when the expanded state of an item changes and type is "single" or "multiple".
+     */
+    onValueChange?: (value: Array<string>) => void;
+    /**
+     * Sets the padding of the accordion item header.
+     * @default false
+     */
+    noPadding?: boolean;
+    /**
+     * Sets the padding of the accordion item content.
+     * @default false
+     */
+    contentNoPadding?: boolean;
+    headingText?: string;
+    headingHelperText?: string;
+}

package/build/components/Accordion/Accordion.props.js

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

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

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

package/build/components/Accordion/AccordionContent.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { useAccordionContext } from './Accordion.context';
+import { useAccordionItemContext } from './AccordionItem.context';
+const AccordionContent = ({ children, style, ...props }) => {
+    const { noPadding: contextMoPadding, contentNoPadding } = useAccordionContext();
+    const { noPadding } = useAccordionItemContext();
+    const noPaddingValue = noPadding ?? contextMoPadding;
+    styles.useVariants({ noPadding: noPaddingValue, contentNoPadding });
+    return (_jsx(View, { style: [styles.content, style], ...props, children: children }));
+};
+AccordionContent.displayName = 'AccordionContent';
+const styles = StyleSheet.create(theme => ({
+    content: {
+        paddingTop: theme.components.accordion.item.content.paddingTop,
+        paddingHorizontal: theme.components.accordion.item.content.paddingHorizontal,
+        paddingBottom: theme.components.accordion.item.content.paddingBottom,
+        gap: theme.components.accordion.item.content.gap,
+        variants: {
+            noPadding: {
+                true: {
+                    paddingHorizontal: 0,
+                },
+            },
+            contentNoPadding: {
+                true: {
+                    paddingTop: 0,
+                    paddingHorizontal: 0,
+                    paddingBottom: 0,
+                },
+            },
+        },
+    },
+}));
+export default AccordionContent;

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

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

package/build/components/Accordion/AccordionContentText.js

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

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

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

package/build/components/Accordion/AccordionHeader.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+const AccordionHeader = ({ children, style, ...props }) => (_jsx(View, { style: [styles.header, style], ...props, children: children }));
+AccordionHeader.displayName = 'AccordionHeader';
+const styles = StyleSheet.create({
+    header: {
+        width: '100%',
+    },
+});
+export default AccordionHeader;

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

@@ -0,0 +1,6 @@
+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

@@ -0,0 +1,16 @@
+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

@@ -0,0 +1,14 @@
+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/AccordionHeading.props.js

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

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

@@ -0,0 +1,6 @@
+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

@@ -0,0 +1,13 @@
+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

@@ -0,0 +1,6 @@
+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

@@ -0,0 +1,14 @@
+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

@@ -0,0 +1,6 @@
+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

@@ -0,0 +1,7 @@
+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

@@ -0,0 +1,4 @@
+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

@@ -0,0 +1,4 @@
+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/AccordionIcon.d.ts

@@ -0,0 +1,6 @@
+import { IconProps } from '../../components/Icon';
+declare const AccordionIcon: {
+    ({ as, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default AccordionIcon;

package/build/components/Accordion/AccordionIcon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from '../../components/Icon';
+import { useTheme } from '../../hooks';
+const AccordionIcon = ({ as, ...props }) => {
+    const { components } = useTheme();
+    return _jsx(Icon, { as: as, color: components.icon.color, ...props });
+};
+AccordionIcon.displayName = 'AccordionIcon';
+export default AccordionIcon;

package/build/components/Accordion/AccordionItem.context.d.ts

@@ -0,0 +1,9 @@
+declare const AccordionItemContext: import("react").Context<{
+    noPadding?: boolean;
+    disabled?: boolean;
+}>;
+export declare const useAccordionItemContext: () => {
+    noPadding?: boolean;
+    disabled?: boolean;
+};
+export default AccordionItemContext;

package/build/components/Accordion/AccordionItem.context.js

@@ -0,0 +1,5 @@
+/* eslint-disable react-refresh/only-export-components */
+import { createContext, useContext } from 'react';
+const AccordionItemContext = createContext({});
+export const useAccordionItemContext = () => useContext(AccordionItemContext);
+export default AccordionItemContext;