@wealthx/shadcn 1.1.0 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wealthx/shadcn",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./src/index.ts",
@@ -36,8 +36,8 @@
     "@repo/eslint-config": "*",
     "@repo/typescript-config": "*",
     "@tailwindcss/cli": "^4.2.2",
-    "@types/react": "^18.3.1",
-    "@types/react-dom": "^18.3.1",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
     "eslint": "^8.57.0",
     "tailwindcss": "^4.2.2",
     "tsup": "^8.0.2",
@@ -45,8 +45,8 @@
     "typescript": "5.5.4"
   },
   "peerDependencies": {
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react": ">=18.3.1",
+    "react-dom": ">=18.3.1"
   },
   "publishConfig": {
     "access": "public"
@@ -278,6 +278,36 @@
       "import": "./dist/components/ui/slider.mjs",
       "require": "./dist/components/ui/slider.js"
     },
+    "./borrowing-capacity-line-chart": {
+      "types": "./src/components/ui/borrowing-capacity-line-chart.tsx",
+      "import": "./dist/components/ui/borrowing-capacity-line-chart.mjs",
+      "require": "./dist/components/ui/borrowing-capacity-line-chart.js"
+    },
+    "./cash-balance-line-chart": {
+      "types": "./src/components/ui/cash-balance-line-chart.tsx",
+      "import": "./dist/components/ui/cash-balance-line-chart.mjs",
+      "require": "./dist/components/ui/cash-balance-line-chart.js"
+    },
+    "./financial-primitives": {
+      "types": "./src/components/ui/financial-primitives.tsx",
+      "import": "./dist/components/ui/financial-primitives.mjs",
+      "require": "./dist/components/ui/financial-primitives.js"
+    },
+    "./financial-cards": {
+      "types": "./src/components/ui/financial-cards.tsx",
+      "import": "./dist/components/ui/financial-cards.mjs",
+      "require": "./dist/components/ui/financial-cards.js"
+    },
+    "./financial-sections": {
+      "types": "./src/components/ui/financial-sections.tsx",
+      "import": "./dist/components/ui/financial-sections.mjs",
+      "require": "./dist/components/ui/financial-sections.js"
+    },
+    "./financial-drawers": {
+      "types": "./src/components/ui/financial-drawers.tsx",
+      "import": "./dist/components/ui/financial-drawers.mjs",
+      "require": "./dist/components/ui/financial-drawers.js"
+    },
     "./transactions-income-expense-bar-chart": {
       "types": "./src/components/ui/transactions-income-expense-bar-chart.tsx",
       "import": "./dist/components/ui/transactions-income-expense-bar-chart.mjs",
@@ -297,6 +327,111 @@
       "types": "./src/components/ui/income-bar-chart.tsx",
       "import": "./dist/components/ui/income-bar-chart.mjs",
       "require": "./dist/components/ui/income-bar-chart.js"
+    },
+    "./property-mobile-estimate-line-chart": {
+      "types": "./src/components/ui/property-mobile-estimate-line-chart.tsx",
+      "import": "./dist/components/ui/property-mobile-estimate-line-chart.mjs",
+      "require": "./dist/components/ui/property-mobile-estimate-line-chart.js"
+    },
+    "./transactions-liabilities-breakdown-doughnut-chart": {
+      "types": "./src/components/ui/transactions-liabilities-breakdown-doughnut-chart.tsx",
+      "import": "./dist/components/ui/transactions-liabilities-breakdown-doughnut-chart.mjs",
+      "require": "./dist/components/ui/transactions-liabilities-breakdown-doughnut-chart.js"
+    },
+    "./transactions-expense-categories-doughnut-chart": {
+      "types": "./src/components/ui/transactions-expense-categories-doughnut-chart.tsx",
+      "import": "./dist/components/ui/transactions-expense-categories-doughnut-chart.mjs",
+      "require": "./dist/components/ui/transactions-expense-categories-doughnut-chart.js"
+    },
+    "./property-debt-equity-doughnut-chart": {
+      "types": "./src/components/ui/property-debt-equity-doughnut-chart.tsx",
+      "import": "./dist/components/ui/property-debt-equity-doughnut-chart.mjs",
+      "require": "./dist/components/ui/property-debt-equity-doughnut-chart.js"
+    },
+    "./property-cashflow-doughnut-chart": {
+      "types": "./src/components/ui/property-cashflow-doughnut-chart.tsx",
+      "import": "./dist/components/ui/property-cashflow-doughnut-chart.mjs",
+      "require": "./dist/components/ui/property-cashflow-doughnut-chart.js"
+    },
+    "./backoffice-contact-history-chart": {
+      "types": "./src/components/ui/backoffice-contact-history-chart.tsx",
+      "import": "./dist/components/ui/backoffice-contact-history-chart.mjs",
+      "require": "./dist/components/ui/backoffice-contact-history-chart.js"
+    },
+    "./backoffice-alert-history-chart": {
+      "types": "./src/components/ui/backoffice-alert-history-chart.tsx",
+      "import": "./dist/components/ui/backoffice-alert-history-chart.mjs",
+      "require": "./dist/components/ui/backoffice-alert-history-chart.js"
+    },
+    "./pipeline-primitives": {
+      "types": "./src/components/ui/pipeline-primitives.tsx",
+      "import": "./dist/components/ui/pipeline-primitives.mjs",
+      "require": "./dist/components/ui/pipeline-primitives.js"
+    },
+    "./opportunity-card": {
+      "types": "./src/components/ui/opportunity-card.tsx",
+      "import": "./dist/components/ui/opportunity-card.mjs",
+      "require": "./dist/components/ui/opportunity-card.js"
+    },
+    "./kanban-column": {
+      "types": "./src/components/ui/kanban-column.tsx",
+      "import": "./dist/components/ui/kanban-column.mjs",
+      "require": "./dist/components/ui/kanban-column.js"
+    },
+    "./pipeline-board": {
+      "types": "./src/components/ui/pipeline-board.tsx",
+      "import": "./dist/components/ui/pipeline-board.mjs",
+      "require": "./dist/components/ui/pipeline-board.js"
+    },
+    "./pipeline-dialogs": {
+      "types": "./src/components/ui/pipeline-dialogs.tsx",
+      "import": "./dist/components/ui/pipeline-dialogs.mjs",
+      "require": "./dist/components/ui/pipeline-dialogs.js"
+    },
+    "./add-column-modal": {
+      "types": "./src/components/ui/add-column-modal.tsx",
+      "import": "./dist/components/ui/add-column-modal.mjs",
+      "require": "./dist/components/ui/add-column-modal.js"
+    },
+    "./add-lead-modal": {
+      "types": "./src/components/ui/add-lead-modal.tsx",
+      "import": "./dist/components/ui/add-lead-modal.mjs",
+      "require": "./dist/components/ui/add-lead-modal.js"
+    },
+    "./pipeline-alerts": {
+      "types": "./src/components/ui/pipeline-alerts.tsx",
+      "import": "./dist/components/ui/pipeline-alerts.mjs",
+      "require": "./dist/components/ui/pipeline-alerts.js"
+    },
+    "./pipeline-chart": {
+      "types": "./src/components/ui/pipeline-chart.tsx",
+      "import": "./dist/components/ui/pipeline-chart.mjs",
+      "require": "./dist/components/ui/pipeline-chart.js"
+    },
+    "./stage-timeline": {
+      "types": "./src/components/ui/stage-timeline.tsx",
+      "import": "./dist/components/ui/stage-timeline.mjs",
+      "require": "./dist/components/ui/stage-timeline.js"
+    },
+    "./ai-assistant-drawer": {
+      "types": "./src/components/ui/ai-assistant-drawer.tsx",
+      "import": "./dist/components/ui/ai-assistant-drawer.mjs",
+      "require": "./dist/components/ui/ai-assistant-drawer.js"
+    },
+    "./opportunity-edit-modals": {
+      "types": "./src/components/ui/opportunity-edit-modals.tsx",
+      "import": "./dist/components/ui/opportunity-edit-modals.mjs",
+      "require": "./dist/components/ui/opportunity-edit-modals.js"
+    },
+    "./form-primitives": {
+      "types": "./src/components/ui/form-primitives.tsx",
+      "import": "./dist/components/ui/form-primitives.mjs",
+      "require": "./dist/components/ui/form-primitives.js"
+    },
+    "./opportunity-summary-tab": {
+      "types": "./src/components/ui/opportunity-summary-tab.tsx",
+      "import": "./dist/components/ui/opportunity-summary-tab.mjs",
+      "require": "./dist/components/ui/opportunity-summary-tab.js"
     }
   }
 }

package/src/components/index.tsx

@@ -1,32 +1,3 @@
-export { TransactionsIncomeExpenseBarChart } from "./ui/transactions-income-expense-bar-chart";
-export type { TransactionsIncomeExpenseBarChartProps } from "./ui/transactions-income-expense-bar-chart";
-
-export { CashflowBarChart } from "./ui/cashflow-bar-chart";
-export type {
-  CashflowBarChartProps,
-  CashflowChartData,
-  CashflowDataPoint,
-  CashflowPeriod,
-} from "./ui/cashflow-bar-chart";
-
-export { ExpenseBarChart } from "./ui/expense-bar-chart";
-export type {
-  ExpenseBarChartProps,
-  ExpenseBarChartData,
-  ExpenseDataset,
-  ExpensePeriod,
-  ExpenseGranularity,
-} from "./ui/expense-bar-chart";
-
-export { IncomeBarChart } from "./ui/income-bar-chart";
-export type {
-  IncomeBarChartProps,
-  IncomeBarChartData,
-  IncomeDataset,
-  IncomePeriod,
-  IncomeGranularity,
-} from "./ui/income-bar-chart";
-
 export {
   Accordion,
   AccordionItem,
@@ -40,6 +11,31 @@ export type {
   AccordionContentProps,
 } from "./ui/accordion";
 
+export { AddColumnModal } from "./ui/add-column-modal";
+export type {
+  AddColumnModalProps,
+  AddColumnEditData,
+  ColumnTask,
+  AiAgent,
+} from "./ui/add-column-modal";
+
+export { AddLeadModal } from "./ui/add-lead-modal";
+export type { AddLeadModalProps, LeadContact } from "./ui/add-lead-modal";
+
+export { AiAssistantDrawer } from "./ui/ai-assistant-drawer";
+export type {
+  AiAssistantDrawerProps,
+  AiChatMessage,
+  AiTaskSuggestion,
+} from "./ui/ai-assistant-drawer";
+
+export { Alert, AlertTitle, AlertDescription } from "./ui/alert";
+export type {
+  AlertProps,
+  AlertTitleProps,
+  AlertDescriptionProps,
+} from "./ui/alert";
+
 export {
   AlertDialog,
   AlertDialogAction,
@@ -69,13 +65,6 @@ export type {
   AlertDialogTriggerProps,
 } from "./ui/alert-dialog";
 
-export { Alert, AlertTitle, AlertDescription } from "./ui/alert";
-export type {
-  AlertProps,
-  AlertTitleProps,
-  AlertDescriptionProps,
-} from "./ui/alert";
-
 export {
   Avatar,
   AvatarImage,
@@ -93,9 +82,32 @@ export type {
   AvatarGroupCountProps,
 } from "./ui/avatar";
 
+export { BackofficeAlertHistoryChart } from "./ui/backoffice-alert-history-chart";
+export type {
+  BackofficeAlertHistoryChartProps,
+  AlertHistoryDataPoint,
+  AlertHistoryPeriod,
+} from "./ui/backoffice-alert-history-chart";
+
+export { BackofficeContactHistoryChart } from "./ui/backoffice-contact-history-chart";
+export type {
+  BackofficeContactHistoryChartProps,
+  ContactHistoryDataPoint,
+  ContactHistoryPeriod,
+} from "./ui/backoffice-contact-history-chart";
+
 export { Badge, badgeVariants } from "./ui/badge";
 export type { BadgeProps } from "./ui/badge";
 
+export { BorrowingCapacityLineChart } from "./ui/borrowing-capacity-line-chart";
+export type {
+  BorrowingCapacityLineChartProps,
+  BorrowingCapacityDataPoint,
+  BorrowingCapacitySeries,
+  BorrowingSeriesType,
+  BorrowingScenario,
+} from "./ui/borrowing-capacity-line-chart";
+
 export { Button, buttonVariants } from "./ui/button";
 export type { ButtonProps } from "./ui/button";
 
@@ -121,6 +133,20 @@ export type {
   CardContentProps,
 } from "./ui/card";
 
+export { CashBalanceLineChart } from "./ui/cash-balance-line-chart";
+export type {
+  CashBalanceLineChartProps,
+  CashBalanceDataPoint,
+} from "./ui/cash-balance-line-chart";
+
+export { CashflowBarChart } from "./ui/cashflow-bar-chart";
+export type {
+  CashflowBarChartProps,
+  CashflowChartData,
+  CashflowDataPoint,
+  CashflowPeriod,
+} from "./ui/cashflow-bar-chart";
+
 export { Checkbox, CheckboxCard } from "./ui/checkbox";
 export type { CheckboxProps, CheckboxCardProps } from "./ui/checkbox";
 
@@ -276,6 +302,15 @@ export type {
   EmptyMediaProps,
 } from "./ui/empty";
 
+export { ExpenseBarChart } from "./ui/expense-bar-chart";
+export type {
+  ExpenseBarChartProps,
+  ExpenseBarChartData,
+  ExpenseDataset,
+  ExpensePeriod,
+  ExpenseGranularity,
+} from "./ui/expense-bar-chart";
+
 export {
   Field,
   FieldLabel,
@@ -301,6 +336,116 @@ export type {
   FieldTitleProps,
 } from "./ui/field";
 
+export {
+  PropertyCard,
+  DebtCard,
+  OtherLiabilityCard,
+  AlertCard,
+  AboutCard,
+  IncomeCard,
+  ExpensesCard,
+} from "./ui/financial-cards";
+export type {
+  PropertyCardProps,
+  DebtCardProps,
+  OtherLiabilityCardProps,
+  OtherLiabilityType,
+  AlertCardProps,
+  AlertSeverity,
+  AlertActionType,
+  AboutCardProps,
+  IncomeCardProps,
+  IncomeCardItem,
+  ExpensesCardProps,
+  ExpensesCardItem,
+} from "./ui/financial-cards";
+
+export {
+  SummaryReportDrawer,
+  OpportunityDetailsDrawer,
+} from "./ui/financial-drawers";
+export type {
+  SummaryViewMode,
+  SummaryJointSubTab,
+  SummaryReportDrawerProps,
+  OpportunityTab,
+  OpportunityDetailsDrawerProps,
+} from "./ui/financial-drawers";
+
+export {
+  FinancialSectionLabel,
+  FinancialCardHeader,
+  FinancialSubsectionTitle,
+  FinancialDetailField,
+  FinancialLineItem,
+  FinancialLvrBar,
+  FinancialSubtotalFrame,
+  FinancialSubtotalBlock,
+} from "./ui/financial-primitives";
+export type {
+  FinancialDetailFieldVariant,
+  FinancialDetailFieldProps,
+  FinancialLineItemProps,
+  FinancialLvrBarProps,
+  FinancialSectionLabelProps,
+  FinancialCardHeaderProps,
+  FinancialSubsectionTitleProps,
+  FinancialSubtotalFrameProps,
+  FinancialSubtotalBlockProps,
+} from "./ui/financial-primitives";
+
+export {
+  PropertyHoldingsSection,
+  DebtSection,
+  OtherLiabilitiesSection,
+  IncomeExpenseSection,
+  AlertAccordion,
+  LoanScenarioSection,
+  FinancialBottomSummary,
+  FinancialViewSection,
+} from "./ui/financial-sections";
+export type {
+  PropertyHoldingsSectionProps,
+  DebtSectionProps,
+  OtherLiabilitiesSectionProps,
+  SummaryLineItem,
+  SummaryColumn,
+  IncomeExpenseSectionProps,
+  AlertAccordionSavePayload,
+  AlertAccordionProps,
+  LoanScenarioSectionProps,
+  BottomSummaryLineItem,
+  FinancialBottomSummaryProps,
+  FinancialViewSectionProps,
+} from "./ui/financial-sections";
+
+export {
+  CurrencyInputWithSlider,
+  ConcernScale,
+  AddressAutocomplete,
+  OwnershipSplit,
+} from "./ui/form-primitives";
+export type {
+  CurrencyInputWithSliderProps,
+  ConcernScaleProps,
+  AddressOption,
+  AddressAutocompleteProps,
+  OwnershipOwner,
+  OwnershipSplitProps,
+} from "./ui/form-primitives";
+
+export { IncomeBarChart } from "./ui/income-bar-chart";
+export type {
+  IncomeBarChartProps,
+  IncomeBarChartData,
+  IncomeDataset,
+  IncomePeriod,
+  IncomeGranularity,
+} from "./ui/income-bar-chart";
+
+export { Input } from "./ui/input";
+export type { InputProps } from "./ui/input";
+
 export {
   InputGroup,
   InputGroupAddon,
@@ -331,12 +476,46 @@ export type {
   InputOTPSeparatorProps,
 } from "./ui/input-otp";
 
-export { Input } from "./ui/input";
-export type { InputProps } from "./ui/input";
+export { KanbanColumn } from "./ui/kanban-column";
+export type { KanbanColumnProps, KanbanColumnStage } from "./ui/kanban-column";
 
 export { Label } from "./ui/label";
 export type { LabelProps } from "./ui/label";
 
+export { OpportunityCard, LeadCard } from "./ui/opportunity-card";
+export type {
+  OpportunityCardProps,
+  LeadCardProps,
+  OpportunityTask,
+  Priority,
+} from "./ui/opportunity-card";
+
+export {
+  EditLoanScenarioModal,
+  EditAssetsModal,
+  EditDebtsModal,
+  EditAboutApplicantModal,
+  EditIncomeModal,
+  EditExpensesModal,
+} from "./ui/opportunity-edit-modals";
+export type {
+  LoanScenarioFormData,
+  EditLoanScenarioModalProps,
+  AssetLineItem,
+  EditAssetsModalProps,
+  DebtLineItem,
+  EditDebtsModalProps,
+  AboutApplicantFormData,
+  EditAboutApplicantModalProps,
+  IncomeFormData,
+  EditIncomeModalProps,
+  ExpensesFormData,
+  EditExpensesModalProps,
+} from "./ui/opportunity-edit-modals";
+
+export { OpportunitySummaryTab } from "./ui/opportunity-summary-tab";
+export type { OpportunitySummaryTabProps } from "./ui/opportunity-summary-tab";
+
 export {
   Pagination,
   PaginationContent,
@@ -356,6 +535,40 @@ export type {
   PaginationEllipsisProps,
 } from "./ui/pagination";
 
+export { PipelineAlerts } from "./ui/pipeline-alerts";
+export type {
+  PipelineAlertsProps,
+  PipelineAlertCounts,
+} from "./ui/pipeline-alerts";
+
+export { PipelineBoard } from "./ui/pipeline-board";
+export type {
+  PipelineBoardProps,
+  PipelineBoardColumn,
+} from "./ui/pipeline-board";
+
+export { PipelineChart } from "./ui/pipeline-chart";
+export type {
+  PipelineChartProps,
+  PipelineChartStage,
+} from "./ui/pipeline-chart";
+
+export {
+  DeleteOpportunityDialog,
+  ChangePriorityDialog,
+  PutOnHoldDialog,
+} from "./ui/pipeline-dialogs";
+export type {
+  DeleteOpportunityDialogProps,
+  ChangePriorityDialogProps,
+  PrioritySelection,
+  PutOnHoldDialogProps,
+  HoldDuration,
+} from "./ui/pipeline-dialogs";
+
+export { TaskCheckItem } from "./ui/pipeline-primitives";
+export type { TaskCheckItemProps } from "./ui/pipeline-primitives";
+
 export {
   Popover,
   PopoverTrigger,
@@ -378,6 +591,19 @@ export type {
 export { Progress } from "./ui/progress";
 export type { ProgressProps } from "./ui/progress";
 
+export { PropertyCashflowDoughnutChart } from "./ui/property-cashflow-doughnut-chart";
+export type { PropertyCashflowDoughnutChartProps } from "./ui/property-cashflow-doughnut-chart";
+
+export { PropertyDebtEquityDoughnutChart } from "./ui/property-debt-equity-doughnut-chart";
+export type { PropertyDebtEquityDoughnutChartProps } from "./ui/property-debt-equity-doughnut-chart";
+
+export { PropertyMobileEstimateLineChart } from "./ui/property-mobile-estimate-line-chart";
+export type {
+  PropertyMobileEstimateLineChartProps,
+  PropertyEstimateDataPoint,
+  PropertyPeriod,
+} from "./ui/property-mobile-estimate-line-chart";
+
 export { RadioGroup, RadioGroupItem, RadioGroupCard } from "./ui/radio-group";
 export type {
   RadioGroupProps,
@@ -447,6 +673,13 @@ export { Toaster } from "./ui/sonner";
 export { Spinner, spinnerVariants } from "./ui/spinner";
 export type { SpinnerProps } from "./ui/spinner";
 
+export { StageTimeline } from "./ui/stage-timeline";
+export type {
+  StageTimelineProps,
+  StageTimelineStage,
+  StageTimelineTask,
+} from "./ui/stage-timeline";
+
 export { Switch, SwitchCard } from "./ui/switch";
 export type { SwitchProps, SwitchCardProps } from "./ui/switch";
 
@@ -471,7 +704,13 @@ export type {
   TableCaptionProps,
 } from "./ui/table";
 
-export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants } from "./ui/tabs";
+export {
+  Tabs,
+  TabsList,
+  TabsTrigger,
+  TabsContent,
+  tabsListVariants,
+} from "./ui/tabs";
 export type {
   TabsProps,
   TabsListProps,
@@ -482,12 +721,12 @@ export type {
 export { Textarea } from "./ui/textarea";
 export type { TextareaProps } from "./ui/textarea";
 
-export { ToggleGroup, ToggleGroupItem } from "./ui/toggle-group";
-export type { ToggleGroupProps, ToggleGroupItemProps } from "./ui/toggle-group";
-
 export { Toggle, toggleVariants } from "./ui/toggle";
 export type { ToggleProps } from "./ui/toggle";
 
+export { ToggleGroup, ToggleGroupItem } from "./ui/toggle-group";
+export type { ToggleGroupProps, ToggleGroupItemProps } from "./ui/toggle-group";
+
 export {
   Tooltip,
   TooltipTrigger,
@@ -500,3 +739,18 @@ export type {
   TooltipContentProps,
   TooltipProviderProps,
 } from "./ui/tooltip";
+
+export { TransactionsExpenseCategoriesDoughnutChart } from "./ui/transactions-expense-categories-doughnut-chart";
+export type {
+  TransactionsExpenseCategoriesDoughnutChartProps,
+  ExpenseCategorySegment,
+} from "./ui/transactions-expense-categories-doughnut-chart";
+
+export { TransactionsIncomeExpenseBarChart } from "./ui/transactions-income-expense-bar-chart";
+export type { TransactionsIncomeExpenseBarChartProps } from "./ui/transactions-income-expense-bar-chart";
+
+export { TransactionsLiabilitiesBreakdownChart } from "./ui/transactions-liabilities-breakdown-doughnut-chart";
+export type {
+  TransactionsLiabilitiesBreakdownChartProps,
+  LiabilitySegment,
+} from "./ui/transactions-liabilities-breakdown-doughnut-chart";

package/src/components/ui/accordion.tsx

@@ -27,7 +27,10 @@ export type AccordionItemProps = React.ComponentProps<
   typeof AccordionPrimitive.Item
 >;
 
-function AccordionItem({ className, ...props }: AccordionItemProps): ReactElement {
+function AccordionItem({
+  className,
+  ...props
+}: AccordionItemProps): ReactElement {
   return (
     <AccordionPrimitive.Item
       className={cn("border-b", className)}
@@ -53,7 +56,7 @@ function AccordionTrigger({
           // layout
           "flex flex-1 items-center justify-between gap-4 py-4 text-left",
           // typography
-          "text-sm font-medium",
+          "text-label-medium",
           // base
           "rounded-none outline-none transition-[color,opacity]",
           // interactive states
@@ -85,7 +88,7 @@ function AccordionContent({
 }: AccordionContentProps): ReactElement {
   return (
     <AccordionPrimitive.Panel
-      className="overflow-hidden text-sm h-(--accordion-panel-height) transition-[height] duration-200 ease-out data-starting-style:h-0 data-ending-style:h-0"
+      className="overflow-hidden text-body-small h-(--accordion-panel-height) transition-[height] duration-200 ease-out data-starting-style:h-0 data-ending-style:h-0"
       data-slot="accordion-content"
       {...props}
     >