From b9fcdef1bedcb1fa34b537d9b42fcaf0c6f4674d Mon Sep 17 00:00:00 2001
From: siriwatknp <siriwatkunaporn@gmail.com>
Date: Mon, 5 Aug 2024 19:58:31 +0700
Subject: [PATCH] extend HTMLAttributes type

---
 packages/pigment-css-react/src/Box.d.ts       | 4 ++--
 packages/pigment-css-react/src/Container.d.ts | 4 +++-
 packages/pigment-css-react/src/Grid.d.ts      | 4 +++-
 packages/pigment-css-react/src/Hidden.d.ts    | 4 +++-
 packages/pigment-css-react/src/Stack.d.ts     | 4 +++-
 5 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/pigment-css-react/src/Box.d.ts b/packages/pigment-css-react/src/Box.d.ts
index 2e0e8efc..1ad12b0b 100644
--- a/packages/pigment-css-react/src/Box.d.ts
+++ b/packages/pigment-css-react/src/Box.d.ts
@@ -7,7 +7,7 @@ export type PolymorphicComponentProps<
   AsTarget extends React.ElementType | undefined,
   AsTargetProps extends object = AsTarget extends React.ElementType
     ? React.ComponentPropsWithRef<AsTarget>
-    : BaseDefaultProps,
+    : React.HTMLAttributes<HTMLElement>,
 > = NoInfer<Omit<Substitute<BaseProps, AsTargetProps>, 'as' | 'component'>> & {
   /**
    * The component used for the root node.
@@ -37,6 +37,6 @@ export interface PolymorphicComponent<BaseProps extends BaseDefaultProps>
   ): React.JSX.Element;
 }
 
-declare const Box: PolymorphicComponent<{}>;
+declare const Box: PolymorphicComponent<React.DetailsHTMLAttributes<HTMLDivElement>>;
 
 export default Box;
diff --git a/packages/pigment-css-react/src/Container.d.ts b/packages/pigment-css-react/src/Container.d.ts
index a8478ef6..d6a8d3bd 100644
--- a/packages/pigment-css-react/src/Container.d.ts
+++ b/packages/pigment-css-react/src/Container.d.ts
@@ -24,6 +24,8 @@ type ContainerBaseProps = {
   maxWidth?: Breakpoint | false;
 };
 
-declare const Container: PolymorphicComponent<ContainerBaseProps>;
+declare const Container: PolymorphicComponent<
+  ContainerBaseProps & React.DetailsHTMLAttributes<HTMLDivElement>
+>;
 
 export default Container;
diff --git a/packages/pigment-css-react/src/Grid.d.ts b/packages/pigment-css-react/src/Grid.d.ts
index a00626b4..fe223a15 100644
--- a/packages/pigment-css-react/src/Grid.d.ts
+++ b/packages/pigment-css-react/src/Grid.d.ts
@@ -18,6 +18,8 @@ type GridBaseProps = {
   wrap?: 'nowrap' | 'wrap' | 'wrap-reverse';
 };
 
-declare const Grid: PolymorphicComponent<GridBaseProps>;
+declare const Grid: PolymorphicComponent<
+  GridBaseProps & React.DetailsHTMLAttributes<HTMLDivElement>
+>;
 
 export default Grid;
diff --git a/packages/pigment-css-react/src/Hidden.d.ts b/packages/pigment-css-react/src/Hidden.d.ts
index 7305ce44..7946382a 100644
--- a/packages/pigment-css-react/src/Hidden.d.ts
+++ b/packages/pigment-css-react/src/Hidden.d.ts
@@ -13,6 +13,8 @@ interface HiddenBaseProps extends HiddenUp, HiddenDown {
   only?: Breakpoint | Breakpoint[];
 }
 
-declare const Hidden: PolymorphicComponent<HiddenBaseProps>;
+declare const Hidden: PolymorphicComponent<
+  HiddenBaseProps & React.DetailsHTMLAttributes<HTMLDivElement>
+>;
 
 export default Hidden;
diff --git a/packages/pigment-css-react/src/Stack.d.ts b/packages/pigment-css-react/src/Stack.d.ts
index 15fe2c77..a4480514 100644
--- a/packages/pigment-css-react/src/Stack.d.ts
+++ b/packages/pigment-css-react/src/Stack.d.ts
@@ -12,6 +12,8 @@ type StackBaseProps = {
   className?: string;
 };
 
-declare const Stack: PolymorphicComponent<StackBaseProps>;
+declare const Stack: PolymorphicComponent<
+  StackBaseProps & React.DetailsHTMLAttributes<HTMLDivElement>
+>;
 
 export default Stack;