@@ -16,13 +22,7 @@ function SkeletonRoot({ children, className = "", ariaLabel = "Loading content"
);
}
-type ItemProps = {
- height?: string;
- width?: string;
- className?: string;
-};
-
-function SkeletonItem({ height = "auto", width = "auto", className = "" }: ItemProps) {
+function SkeletonItem({ height = "auto", width = "auto", className = "" }: SkeletonItemProps) {
return (
& React.RefAttributes>
-> & {
- List: React.ForwardRefExoticComponent<
- React.ComponentProps & React.RefAttributes>
- >;
- Trigger: React.ForwardRefExoticComponent<
- React.ComponentProps & { size?: "sm" | "md" | "lg" } & React.RefAttributes<
- React.ElementRef
- >
- >;
- Content: React.ForwardRefExoticComponent<
- React.ComponentProps & React.RefAttributes>
- >;
- Indicator: React.ForwardRefExoticComponent & React.RefAttributes>;
-};
-
const TabsRoot = React.forwardRef(function TabsRoot(
{ className, ...props }: React.ComponentProps,
ref: React.ForwardedRef>
@@ -104,11 +87,21 @@ const TabsIndicator = React.forwardRef(function TabsIndicator(
);
});
-export const Tabs = Object.assign(TabsRoot, {
- List: TabsList,
- Trigger: TabsTrigger,
- Content: TabsContent,
- Indicator: TabsIndicator,
-}) satisfies TabsCompound;
+TabsRoot.displayName = "TabsRoot";
+TabsList.displayName = "TabsList";
+TabsTrigger.displayName = "TabsTrigger";
+TabsContent.displayName = "TabsContent";
+TabsIndicator.displayName = "TabsIndicator";
-export { TabsList, TabsTrigger, TabsContent, TabsIndicator };
+const Tabs = TabsRoot as typeof TabsRoot & {
+ List: typeof TabsList;
+ Trigger: typeof TabsTrigger;
+ Content: typeof TabsContent;
+ Indicator: typeof TabsIndicator;
+};
+Tabs.List = TabsList;
+Tabs.Trigger = TabsTrigger;
+Tabs.Content = TabsContent;
+Tabs.Indicator = TabsIndicator;
+
+export { Tabs };
diff --git a/packages/propel/src/toolbar/toolbar.tsx b/packages/propel/src/toolbar/toolbar.tsx
index b939ad1caf..06c8e05942 100644
--- a/packages/propel/src/toolbar/toolbar.tsx
+++ b/packages/propel/src/toolbar/toolbar.tsx
@@ -165,11 +165,15 @@ ToolbarSeparator.displayName = "ToolbarSeparator";
ToolbarSubmitButton.displayName = "ToolbarSubmitButton";
// compound components
-const Toolbar = Object.assign(ToolbarRoot, {
- Group: ToolbarGroup,
- Item: ToolbarItem,
- Separator: ToolbarSeparator,
- SubmitButton: ToolbarSubmitButton,
-});
+const Toolbar = ToolbarRoot as typeof ToolbarRoot & {
+ Group: typeof ToolbarGroup;
+ Item: typeof ToolbarItem;
+ Separator: typeof ToolbarSeparator;
+ SubmitButton: typeof ToolbarSubmitButton;
+};
+Toolbar.Group = ToolbarGroup;
+Toolbar.Item = ToolbarItem;
+Toolbar.Separator = ToolbarSeparator;
+Toolbar.SubmitButton = ToolbarSubmitButton;
export { Toolbar };