feat: add config-provider component

Author: Ohh-889

docs/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": ["./*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}

packages/ui/src/components/config-provider/ConfigProvider.tsx

@@ -0,0 +1,23 @@
+'use client';
+
+import { ConfigContext } from './context';
+import type { ComponentConfig, ConfigProviderProps } from './types';
+
+const COMPONENT_KEYS = ['accordion'] satisfies (keyof ComponentConfig)[];
+
+export const ConfigProvider = (props: ConfigProviderProps) => {
+  const { children, direction = 'ltr', size = 'md', theme = { color: 'default' }, ...rest } = props;
+
+  const componentConfig = Object.fromEntries(
+    COMPONENT_KEYS.map(key => [
+      key,
+      {
+        ...rest[key],
+        dir: direction,
+        size
+      }
+    ])
+  );
+
+  return <ConfigContext.Provider value={componentConfig}>{children}</ConfigContext.Provider>;
+};

packages/ui/src/components/config-provider/context.ts

@@ -0,0 +1,19 @@
+'use client';
+
+import { createContext, useContext } from 'react';
+
+import type { ComponentConfig } from './types';
+
+export const ConfigContext = createContext<ComponentConfig>({});
+
+export const useComponentConfig = <T extends keyof ComponentConfig>(component: T) => {
+  const config = useContext(ConfigContext);
+
+  if (!config) {
+    throw new Error('useComponentConfig must be used within a ConfigProvider');
+  }
+
+  if (!config?.[component]) return {};
+
+  return config[component];
+};

packages/ui/src/components/config-provider/index.ts

@@ -0,0 +1,3 @@
+export * from './ConfigProvider';
+
+export * from './types';

packages/ui/src/components/config-provider/types.ts

@@ -0,0 +1,21 @@
+import type { ThemeOptions } from '@soybean-react-ui/tailwind-plugin';
+
+import type { ThemeSize } from '@/types/other';
+
+import type { AccordionProps } from '../accordion/types';
+
+export interface ConfigProviderProps extends ConfigProps {
+  children: React.ReactNode;
+}
+
+export interface ConfigProps extends ComponentConfig {
+  direction?: 'ltr' | 'rtl';
+  size?: ThemeSize;
+  theme?: ThemeOptions;
+}
+
+export type ComponentConfig = {
+  accordion?: AccordionConfig;
+};
+
+export type AccordionConfig = Pick<AccordionProps, 'className' | 'classNames' | 'dir' | 'size' | 'triggerIcon'>;