@recursica/mantine-adapter 0.26.1 → 0.28.0

package/src/components/Group/Group.tsx

@@ -3,7 +3,10 @@ import {
   Group as MantineGroup,
   type GroupProps as MantineGroupProps,
 } from "@mantine/core";
-import { mapLayoutProps } from "../../utils/filterStylingProps";
+import {
+  mapLayoutProps,
+  type WithRecursicaSpacing,
+} from "../../utils/filterStylingProps";
 import styles from "./Group.module.css";
 
 import { type RecursicaGroupProps } from "@recursica/adapter-common";
@@ -15,7 +18,9 @@ import { type RecursicaGroupProps } from "@recursica/adapter-common";
  * DO NOT use the `RecursicaOverStyled` gatekeeper. Developers must be able to freely pass
  * width, height, padding, margins, and flexbox alignment props to construct structural layouts.
  */
-export type GroupProps = MantineGroupProps & RecursicaGroupProps;
+export type GroupProps = WithRecursicaSpacing<
+  MantineGroupProps & RecursicaGroupProps
+>;
 
 export const Group = forwardRef<HTMLDivElement, GroupProps>(function Group(
   { children, gap = "rec-default", ...rest },

package/src/components/Link/Link.tsx

@@ -1,4 +1,4 @@
-import React, { forwardRef } from "react";
+import { forwardRef } from "react";
 import {
   Anchor as MantineAnchor,
   type AnchorProps as MantineAnchorProps,
@@ -13,7 +13,7 @@ import styles from "./Link.module.css";
 import { type RecursicaLinkProps } from "@recursica/adapter-common";
 
 export type LinkProps = RecursicaOverStyled<
-  Omit<MantineAnchorProps, "underline"> & RecursicaLinkProps
+  Omit<MantineAnchorProps, "underline"> & Omit<RecursicaLinkProps, "component">
 >;
 
 const _Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(
@@ -49,7 +49,7 @@ const _Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(
       classNames={mergedClassNames}
       underline="never"
       {...(icon ? { "data-has-icon": "" } : {})}
-      {...sanitizedProps}
+      {...(sanitizedProps as Record<string, unknown>)}
     >
       {icon && (
         <span className={styles.iconWrapper} aria-hidden>

package/src/components/Panel/PANEL_IMPLEMENTATION_NOTES.md

@@ -55,11 +55,11 @@ Other stylesNames (`overlay`, `root`, `inner`, `close`) are left to Mantine defa
 
 ---
 
-## 4. Default Position Override
+## 4. Default Placement Override
 
-**Decision:** Recursica defaults `position` to `"right"`. Mantine defaults to `"left"`.
+**Decision:** Use `placement` instead of `position` for configuring slide-out direction, and default it to `"right"`.
 
-**Implementation:** The `position="right"` default is set before the prop spread, so developer-provided `position` values still take precedence. Right-side panels are the most common pattern for supplementary content, settings, and detail views.
+**Implementation:** The prop was renamed from `position` to `placement` to prevent collision with the CSS `position` keyword, which is strictly blocked by the styling gatekeeper (`BLOCKED_STYLING_KEYS`). This allows configuring the drawer direction natively while maintaining strict design-system boundaries. The `placement="right"` default is mapped internally to Mantine Drawer's `position` prop before any other sanitized props are applied. Right-side panels are the most common pattern for supplementary content, settings, and detail views.
 
 ---
 

package/src/components/Panel/Panel.stories.tsx

@@ -12,7 +12,7 @@ const meta: Meta = {
   component: Panel,
   tags: ["autodocs"],
   argTypes: {
-    position: {
+    placement: {
       control: "select",
       options: ["left", "right", "top", "bottom"],
       description: "Side of the screen the panel slides in from.",
@@ -58,7 +58,7 @@ The \`Panel\` component slides in or expands from the edge of the screen to reve
 const [opened, { open, close }] = useDisclosure(false);
 
 <Button onClick={open}>Open Panel</Button>
-<Panel opened={opened} onClose={close} title="Settings" position="right">
+<Panel opened={opened} onClose={close} title="Settings" placement="right">
   Content goes here
   <Panel.Footer>
     <Button variant="outline">Cancel</Button>
@@ -78,7 +78,7 @@ type Story = StoryObj<PanelStoryArgs>;
 
 export const Default: Story = {
   args: {
-    position: "right",
+    placement: "right",
     title: "Panel Title",
     withOverlay: true,
     withCloseButton: true,
@@ -98,7 +98,7 @@ export const Default: Story = {
           opened={opened}
           onClose={() => setOpened(false)}
           title="Panel Title"
-          position="right"
+          placement="right"
           wrapHeaderText={wrapHeaderText}
         >
           <Text>
@@ -118,9 +118,9 @@ export const Default: Story = {
   },
 };
 
-export const LeftPosition: Story = {
+export const LeftPlacement: Story = {
   args: {
-    position: "left",
+    placement: "left",
     title: "Navigation",
     withOverlay: true,
     withCloseButton: true,
@@ -153,7 +153,7 @@ export const LeftPosition: Story = {
 
 export const ScrollableContent: Story = {
   args: {
-    position: "right",
+    placement: "right",
     title: "Scrollable Panel",
     withOverlay: true,
     withCloseButton: true,
@@ -195,7 +195,7 @@ export const ScrollableContent: Story = {
 
 export const LongTitle: Story = {
   args: {
-    position: "right",
+    placement: "right",
     title:
       "This is a ridiculously long panel title designed to test how the header CSS handles text overflow and whether it truncates correctly or breaks the layout",
     withOverlay: true,

package/src/components/Panel/Panel.tsx

@@ -13,11 +13,18 @@ import styles from "./Panel.module.css";
 // PANEL (Drawer)
 // ============================================================
 
-import { type RecursicaPanelProps } from "@recursica/adapter-common";
+import { type RecursicaPanelProps as BaseRecursicaPanelProps } from "@recursica/adapter-common";
 
 /**
  * Recursica Panel root props. Extends Mantine Drawer.
  */
+export interface RecursicaPanelProps
+  extends Omit<
+      MantineDrawerProps,
+      "size" | "styles" | "classNames" | "style" | "position"
+    >,
+    BaseRecursicaPanelProps {}
+
 export type PanelProps = RecursicaOverStyled<RecursicaPanelProps>;
 
 /**
@@ -29,7 +36,7 @@ export type PanelProps = RecursicaOverStyled<RecursicaPanelProps>;
  * cluttering the main interface.
  *
  * ```tsx
- * <Panel opened={opened} onClose={close} title="Panel Title" position="right">
+ * <Panel opened={opened} onClose={close} title="Panel Title" placement="right">
  *   <Panel.Body>
  *     Content goes here
  *   </Panel.Body>
@@ -48,7 +55,7 @@ export type PanelProps = RecursicaOverStyled<RecursicaPanelProps>;
  */
 const PanelBase = function Panel({
   overStyled = false,
-  position = "right",
+  placement = "right",
   keepMounted = true,
   wrapHeaderText = false,
   ...rest
@@ -82,7 +89,7 @@ const PanelBase = function Panel({
 
   return (
     <MantineDrawer
-      position={position} /* Recursica default: right; Mantine default: left */
+      position={placement} /* Recursica default: right; Mantine default: left */
       keepMounted={keepMounted}
       closeOnClickOutside={rest.closeOnClickOutside ?? Boolean(rest.opened)}
       {...(sanitizedProps as unknown as MantineDrawerProps)}

package/src/components/Radio/RadioGroup.tsx

@@ -16,7 +16,10 @@ import styles from "./Radio.module.css";
 import { type RecursicaRadioGroupProps as BaseRecursicaRadioGroupProps } from "@recursica/adapter-common";
 
 export interface RecursicaRadioGroupProps
-  extends Omit<MantineRadioGroupProps, "size" | "labelProps">,
+  extends Omit<
+      MantineRadioGroupProps,
+      "size" | "labelProps" | "defaultValue" | "value" | "onChange"
+    >,
     Omit<
       RecursicaFormControlWrapperProps,
       "controlMaxWidth" | "controlMinWidth"
@@ -98,8 +101,8 @@ export const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(
             /* Natively bind local disabled lock dynamically */
             {...(sanitizedProps as unknown as MantineRadioGroupProps)}
             disabled={readOnly || (restRecord as any).disabled}
-            value={value}
-            defaultValue={defaultValue}
+            value={value as any}
+            defaultValue={defaultValue as any}
           >
             <div className={styles.groupRoot} data-layout={formLayout}>
               {children}

package/src/components/ReadOnlyField/ReadOnlyField.tsx

@@ -55,7 +55,11 @@ export const ReadOnlyField = forwardRef<HTMLDivElement, ReadOnlyFieldProps>(
       ? (Renderer as any).check(value)
       : EmptyValueRenderer.check(value);
 
-    const displayValue = isValueEmpty ? <Renderer value={value} /> : value;
+    const displayValue = isValueEmpty ? (
+      <Renderer value={value as any} />
+    ) : (
+      value
+    );
 
     switch (type) {
       case "boolean":

package/src/components/Stack/Stack.tsx

@@ -4,7 +4,10 @@ import {
   type StackProps as MantineStackProps,
   createPolymorphicComponent,
 } from "@mantine/core";
-import { mapLayoutProps } from "../../utils/filterStylingProps";
+import {
+  mapLayoutProps,
+  type WithRecursicaSpacing,
+} from "../../utils/filterStylingProps";
 import styles from "./Stack.module.css";
 
 import { type RecursicaStackProps } from "@recursica/adapter-common";
@@ -16,7 +19,9 @@ import { type RecursicaStackProps } from "@recursica/adapter-common";
  * DO NOT use the `RecursicaOverStyled` gatekeeper. Developers must be able to freely pass
  * width, height, padding, margins, and flexbox alignment props to construct structural layouts.
  */
-export type StackProps = MantineStackProps & RecursicaStackProps;
+export type StackProps = WithRecursicaSpacing<
+  MantineStackProps & RecursicaStackProps
+>;
 
 const _Stack = forwardRef<HTMLDivElement, StackProps>(function Stack(
   { children, gap = "rec-default", ...rest },

package/src/components/Stepper/Stepper.tsx

@@ -11,7 +11,11 @@ import styles from "./Stepper.module.css";
 
 import { type RecursicaStepperProps } from "@recursica/adapter-common";
 
-export type StepperProps = RecursicaOverStyled<RecursicaStepperProps>;
+export interface RecursicaStepperPropsExtended
+  extends Omit<MantineStepperProps, "size">,
+    RecursicaStepperProps {}
+
+export type StepperProps = RecursicaOverStyled<RecursicaStepperPropsExtended>;
 
 const _Stepper = forwardRef<HTMLDivElement, StepperProps>(
   function Stepper(props, ref) {

package/src/components/Switch/SwitchGroup.tsx

@@ -16,7 +16,10 @@ import styles from "./Switch.module.css";
 import { type RecursicaSwitchGroupProps as BaseRecursicaSwitchGroupProps } from "@recursica/adapter-common";
 
 export interface RecursicaSwitchGroupProps
-  extends Omit<MantineSwitchGroupProps, "size" | "labelProps">,
+  extends Omit<
+      MantineSwitchGroupProps,
+      "size" | "labelProps" | "defaultValue" | "value" | "onChange"
+    >,
     Omit<
       RecursicaFormControlWrapperProps,
       "controlMaxWidth" | "controlMinWidth"
@@ -98,8 +101,8 @@ export const SwitchGroup = forwardRef<HTMLDivElement, SwitchGroupProps>(
             /* Natively bind local disabled lock dynamically */
             {...(sanitizedProps as unknown as MantineSwitchGroupProps)}
             disabled={readOnly || (restRecord as any).disabled}
-            value={value}
-            defaultValue={defaultValue}
+            value={value as any}
+            defaultValue={defaultValue as any}
           >
             <div className={styles.groupRoot} data-layout={formLayout}>
               {children}

package/src/components/Table/Table.module.css

@@ -0,0 +1,7 @@
+/* HARDCODED VALUES:
+ * None. This is a generic layout wrapper.
+ */
+
+.root {
+  /* Mantine Table handles table layout natively. */
+}

package/src/components/Table/Table.stories.tsx

@@ -1,9 +1,8 @@
 import type { Meta, StoryObj } from "@storybook/react";
 import { Table } from "./Table";
-import { ComingSoon } from "@recursica/storybook-template";
 
 const meta: Meta<typeof Table> = {
-  title: "UI-Kit/🚧 Table",
+  title: "UI-Kit/Table",
   component: Table,
   tags: ["autodocs"],
 };
@@ -12,6 +11,37 @@ export default meta;
 
 type Story = StoryObj<typeof Table>;
 
+const elements = [
+  { position: 6, mass: 12.011, symbol: "C", name: "Carbon" },
+  { position: 7, mass: 14.007, symbol: "N", name: "Nitrogen" },
+  { position: 8, mass: 15.999, symbol: "O", name: "Oxygen" },
+  { position: 9, mass: 18.998, symbol: "F", name: "Fluorine" },
+  { position: 10, mass: 20.18, symbol: "Ne", name: "Neon" },
+];
+
 export const Default: Story = {
-  render: () => <ComingSoon componentName="Table" />,
+  render: () => {
+    const rows = elements.map((element) => (
+      <Table.Tr key={element.name}>
+        <Table.Td>{element.position}</Table.Td>
+        <Table.Td>{element.name}</Table.Td>
+        <Table.Td>{element.symbol}</Table.Td>
+        <Table.Td>{element.mass}</Table.Td>
+      </Table.Tr>
+    ));
+
+    return (
+      <Table>
+        <Table.Thead>
+          <Table.Tr>
+            <Table.Th>Element position</Table.Th>
+            <Table.Th>Element name</Table.Th>
+            <Table.Th>Symbol</Table.Th>
+            <Table.Th>Atomic mass</Table.Th>
+          </Table.Tr>
+        </Table.Thead>
+        <Table.Tbody>{rows}</Table.Tbody>
+      </Table>
+    );
+  },
 };

package/src/components/Table/Table.tsx

@@ -1,9 +1,60 @@
-import React from "react";
+import { forwardRef } from "react";
+import {
+  Table as MantineTable,
+  type TableProps as MantineTableProps,
+} from "@mantine/core";
+import {
+  filterStylingProps,
+  type RecursicaOverStyled,
+} from "../../utils/filterStylingProps";
 import { type RecursicaTableProps } from "@recursica/adapter-common";
+import styles from "./Table.module.css";
 
-export type TableProps = React.HTMLAttributes<HTMLDivElement> &
-  RecursicaTableProps;
+export type TableProps = RecursicaOverStyled<
+  MantineTableProps & RecursicaTableProps
+>;
 
-export const Table: React.FC<TableProps> = (props) => {
-  return <div {...props}>Table</div>;
+const TableBase = forwardRef<HTMLTableElement, TableProps>(function Table(
+  { overStyled = false, ...rest },
+  ref,
+) {
+  const sanitizedProps = filterStylingProps(rest, overStyled);
+  const classNameProp = (sanitizedProps as Record<string, unknown>)
+    .className as string | undefined;
+
+  const rootClass = styles.root;
+  const finalClass = classNameProp
+    ? `${rootClass} ${classNameProp}`
+    : rootClass;
+
+  return (
+    <MantineTable
+      ref={ref}
+      className={finalClass}
+      {...(sanitizedProps as unknown as MantineTableProps)}
+    />
+  );
+});
+
+TableBase.displayName = "Table";
+
+type TableComponent = typeof TableBase & {
+  Thead: typeof MantineTable.Thead;
+  Tbody: typeof MantineTable.Tbody;
+  Tr: typeof MantineTable.Tr;
+  Th: typeof MantineTable.Th;
+  Td: typeof MantineTable.Td;
+  Tfoot: typeof MantineTable.Tfoot;
+  Caption: typeof MantineTable.Caption;
+  ScrollContainer: typeof MantineTable.ScrollContainer;
 };
+
+export const Table = TableBase as TableComponent;
+Table.Thead = MantineTable.Thead;
+Table.Tbody = MantineTable.Tbody;
+Table.Tr = MantineTable.Tr;
+Table.Th = MantineTable.Th;
+Table.Td = MantineTable.Td;
+Table.Tfoot = MantineTable.Tfoot;
+Table.Caption = MantineTable.Caption;
+Table.ScrollContainer = MantineTable.ScrollContainer;

package/src/components/Tabs/Tabs.tsx

@@ -14,7 +14,11 @@ import styles from "./Tabs.module.css";
 
 import { type RecursicaTabsProps } from "@recursica/adapter-common";
 
-export type TabsProps = RecursicaOverStyled<RecursicaTabsProps>;
+export interface RecursicaTabsPropsExtended
+  extends Omit<MantineTabsProps, "variant">,
+    RecursicaTabsProps {}
+
+export type TabsProps = RecursicaOverStyled<RecursicaTabsPropsExtended>;
 
 const _Tabs = forwardRef<HTMLDivElement, TabsProps>(function Tabs(props, ref) {
   const {

package/src/components/Text/Text.tsx

@@ -11,7 +11,9 @@ import {
 
 import { type RecursicaTextProps } from "@recursica/adapter-common";
 
-export type TextProps = RecursicaOverStyled<RecursicaTextProps>;
+export type TextProps = RecursicaOverStyled<
+  Omit<MantineTextProps, "variant"> & RecursicaTextProps
+>;
 
 const _Text = forwardRef<HTMLDivElement, TextProps>(function Text(
   { overStyled = false, variant = "body", ...rest },

package/src/components/TextArea/TextArea.tsx

@@ -19,16 +19,9 @@ export interface RecursicaTextAreaProps
       MantineTextareaProps,
       "size" | "variant" | "radius" | "wrapperProps"
     >,
-    Pick<
+    Omit<
       RecursicaFormControlWrapperProps,
-      | "assistiveText"
-      | "assistiveWithIcon"
-      | "formLayout"
-      | "labelSize"
-      | "labelAlignment"
-      | "labelOptionalText"
-      | "labelWithEditIcon"
-      | "onLabelEditClick"
+      "controlMaxWidth" | "controlMinWidth"
     >,
     ReadOnlyControlProps,
     BaseRecursicaTextAreaProps {}

package/src/components/Title/Title.tsx

@@ -10,7 +10,9 @@ import {
 
 import { type RecursicaTitleProps } from "@recursica/adapter-common";
 
-export type TitleProps = RecursicaOverStyled<RecursicaTitleProps>;
+export type TitleProps = RecursicaOverStyled<
+  Omit<MantineTitleProps, "size"> & RecursicaTitleProps
+>;
 
 /**
  * Enforces highly accessible structural markup utilizing semantic `<h1>` through `<h6>` tags securely bound directly to Recursica typographic scales.

package/src/components/index.ts

@@ -42,6 +42,7 @@ export * from "./TextArea/TextArea";
 export * from "./TextField/TextField";
 export * from "./TimePicker/TimePicker";
 export * from "./Timeline/Timeline";
+export * from "./Timeline/TimelineItem";
 export * from "./Title/Title";
 export * from "./Toast";
 export * from "./Tooltip/Tooltip";

package/src/index.ts

@@ -1,3 +1,170 @@
 import "@recursica/adapter-common/style.css";
-export * from "./components";
+import * as rawComponents from "./components";
+import { wrapComponent } from "@recursica/adapter-common";
+
 export * from "@recursica/adapter-common";
+
+// Expose unwrapped structural layout primitives to preserve their polymorphic types
+export const Flex = rawComponents.Flex;
+export const Group = rawComponents.Group;
+export const Stack = rawComponents.Stack;
+export const Container = rawComponents.Container;
+export const Link = rawComponents.Link;
+export const Text = rawComponents.Text;
+
+// Statically wrap and export components to inject overStyled visual highlight in dev mode
+export const Accordion = wrapComponent(
+  rawComponents.Accordion,
+) as typeof rawComponents.Accordion;
+export const AccordionItem = wrapComponent(
+  rawComponents.AccordionItem,
+) as typeof rawComponents.AccordionItem;
+export const AccordionControl = wrapComponent(
+  rawComponents.AccordionControl,
+) as typeof rawComponents.AccordionControl;
+export const AccordionPanel = wrapComponent(
+  rawComponents.AccordionPanel,
+) as typeof rawComponents.AccordionPanel;
+export const AutoComplete = wrapComponent(
+  rawComponents.AutoComplete,
+) as typeof rawComponents.AutoComplete;
+export const Avatar = wrapComponent(
+  rawComponents.Avatar,
+) as typeof rawComponents.Avatar;
+export const Badge = wrapComponent(
+  rawComponents.Badge,
+) as typeof rawComponents.Badge;
+export const Breadcrumb = wrapComponent(
+  rawComponents.Breadcrumb,
+) as typeof rawComponents.Breadcrumb;
+export const Button = wrapComponent(
+  rawComponents.Button,
+) as typeof rawComponents.Button;
+export const Card = wrapComponent(
+  rawComponents.Card,
+) as typeof rawComponents.Card;
+export const Checkbox = wrapComponent(
+  rawComponents.Checkbox,
+) as typeof rawComponents.Checkbox;
+export const CheckboxGroup = wrapComponent(
+  rawComponents.CheckboxGroup,
+) as typeof rawComponents.CheckboxGroup;
+export const Chip = wrapComponent(
+  rawComponents.Chip,
+) as typeof rawComponents.Chip;
+export const DatePicker = wrapComponent(
+  rawComponents.DatePicker,
+) as typeof rawComponents.DatePicker;
+export const Dropdown = wrapComponent(
+  rawComponents.Dropdown,
+) as typeof rawComponents.Dropdown;
+export const FileInput = wrapComponent(
+  rawComponents.FileInput,
+) as typeof rawComponents.FileInput;
+export const FileUpload = wrapComponent(
+  rawComponents.FileUpload,
+) as typeof rawComponents.FileUpload;
+export const FormControlLayout = wrapComponent(
+  rawComponents.FormControlLayout,
+) as typeof rawComponents.FormControlLayout;
+export const HoverCard = wrapComponent(
+  rawComponents.HoverCard,
+) as typeof rawComponents.HoverCard;
+export const Loader = wrapComponent(
+  rawComponents.Loader,
+) as typeof rawComponents.Loader;
+export const Label = wrapComponent(
+  rawComponents.Label,
+) as typeof rawComponents.Label;
+export const Menu = wrapComponent(
+  rawComponents.Menu,
+) as typeof rawComponents.Menu;
+export const Modal = wrapComponent(
+  rawComponents.Modal,
+) as typeof rawComponents.Modal;
+export const NumberInput = wrapComponent(
+  rawComponents.NumberInput,
+) as typeof rawComponents.NumberInput;
+export const Pagination = wrapComponent(
+  rawComponents.Pagination,
+) as typeof rawComponents.Pagination;
+export const Panel = wrapComponent(
+  rawComponents.Panel,
+) as typeof rawComponents.Panel;
+export const PanelFooter = wrapComponent(
+  rawComponents.PanelFooter,
+) as typeof rawComponents.PanelFooter;
+export const Popover = wrapComponent(
+  rawComponents.Popover,
+) as typeof rawComponents.Popover;
+export const Radio = wrapComponent(
+  rawComponents.Radio,
+) as typeof rawComponents.Radio;
+export const RadioGroup = wrapComponent(
+  rawComponents.RadioGroup,
+) as typeof rawComponents.RadioGroup;
+export const ReadOnlyField = wrapComponent(
+  rawComponents.ReadOnlyField,
+) as typeof rawComponents.ReadOnlyField;
+export const SegmentedControl = wrapComponent(
+  rawComponents.SegmentedControl,
+) as typeof rawComponents.SegmentedControl;
+export const Slider = wrapComponent(
+  rawComponents.Slider,
+) as typeof rawComponents.Slider;
+export const Stepper = wrapComponent(
+  rawComponents.Stepper,
+) as typeof rawComponents.Stepper;
+export const Switch = wrapComponent(
+  rawComponents.Switch,
+) as typeof rawComponents.Switch;
+export const SwitchGroup = wrapComponent(
+  rawComponents.SwitchGroup,
+) as typeof rawComponents.SwitchGroup;
+export const Table = wrapComponent(
+  rawComponents.Table,
+) as typeof rawComponents.Table;
+export const Tabs = wrapComponent(
+  rawComponents.Tabs,
+) as typeof rawComponents.Tabs;
+export const TextArea = wrapComponent(
+  rawComponents.TextArea,
+) as typeof rawComponents.TextArea;
+export const TextField = wrapComponent(
+  rawComponents.TextField,
+) as typeof rawComponents.TextField;
+export const TimePicker = wrapComponent(
+  rawComponents.TimePicker,
+) as typeof rawComponents.TimePicker;
+export const Timeline = wrapComponent(
+  rawComponents.Timeline,
+) as typeof rawComponents.Timeline;
+export const TimelineItem = wrapComponent(
+  rawComponents.TimelineItem,
+) as typeof rawComponents.TimelineItem;
+export const Title = wrapComponent(
+  rawComponents.Title,
+) as typeof rawComponents.Title;
+export const Toast = wrapComponent(
+  rawComponents.Toast,
+) as typeof rawComponents.Toast;
+export const Tooltip = wrapComponent(
+  rawComponents.Tooltip,
+) as typeof rawComponents.Tooltip;
+export const TransferList = wrapComponent(
+  rawComponents.TransferList,
+) as typeof rawComponents.TransferList;
+
+export type {
+  RecursicaCheckboxGroupProps,
+  RecursicaDatePickerProps,
+  RecursicaDropdownProps,
+  RecursicaNumberInputProps,
+  RecursicaRadioGroupProps,
+  RecursicaReadOnlyFieldProps,
+  RecursicaReadOnlyTextFieldProps,
+  RecursicaSliderProps,
+  RecursicaSwitchGroupProps,
+  RecursicaTextAreaProps,
+  RecursicaTextFieldProps,
+} from "./components";

package/src/utils/filterStylingProps.ts

@@ -66,6 +66,7 @@ export {
   type RecursicaOverStyled,
   type BlockedStylingKeys,
   type ForbiddenStyles,
+  type WithRecursicaSpacing,
 } from "@recursica/adapter-common";
 
 const LAYOUT_PROPS = new Set([