@seed-design/react 0.0.0-alpha-20260324091316

package/src/components/Box/Box.tsx

@@ -0,0 +1,45 @@
+import clsx from "clsx";
+import * as React from "react";
+import type { BreakpointThreshold } from "../../types/responsive";
+import { useStyleProps, type StyleProps } from "../../utils/styled";
+import { Slot } from "@radix-ui/react-slot";
+
+export interface BoxProps extends StyleProps, Omit<React.HTMLAttributes<HTMLDivElement>, "color"> {
+  as?: React.ElementType;
+
+  asChild?: boolean;
+
+  hideFrom?: BreakpointThreshold;
+}
+
+export const Box = React.forwardRef<HTMLDivElement, BoxProps>((props, ref) => {
+  const { hideFrom, ...rest } = props;
+  const { style, restProps } = useStyleProps(rest);
+  const { as: Comp = "div", asChild = false, className, ...nativeProps } = restProps;
+
+  if (asChild) {
+    return (
+      <Slot
+        ref={ref}
+        className={clsx("seed-box", className)}
+        style={{
+          ...style,
+          ...(hideFrom && { [`--seed-box-display-${hideFrom}`]: "none" }),
+        }}
+        {...nativeProps}
+      />
+    );
+  }
+
+  return (
+    <Comp
+      ref={ref}
+      className={clsx("seed-box", className)}
+      style={{
+        ...style,
+        ...(hideFrom && { [`--seed-box-display-${hideFrom}`]: "none" }),
+      }}
+      {...nativeProps}
+    />
+  );
+});

package/src/components/Box/index.ts

@@ -0,0 +1 @@
+export { Box, type BoxProps } from "./Box";

package/src/components/Callout/Callout.namespace.ts

@@ -0,0 +1,14 @@
+export {
+  CalloutCloseButton as CloseButton,
+  CalloutContent as Content,
+  CalloutDescription as Description,
+  CalloutLink as Link,
+  CalloutRoot as Root,
+  CalloutTitle as Title,
+  type CalloutCloseButtonProps as CloseButtonProps,
+  type CalloutContentProps as ContentProps,
+  type CalloutDescriptionProps as DescriptionProps,
+  type CalloutLinkProps as LinkProps,
+  type CalloutRootProps as RootProps,
+  type CalloutTitleProps as TitleProps,
+} from "./Callout";

package/src/components/Callout/Callout.tsx

@@ -0,0 +1,57 @@
+import type * as React from "react";
+
+import { Primitive, type PrimitiveProps } from "@seed-design/react-primitive";
+import { callout, type CalloutVariantProps } from "@seed-design/css/recipes/callout";
+import { createSlotRecipeContext } from "../../utils/createSlotRecipeContext";
+import {
+  DismissibleCloseButton,
+  DismissibleRoot,
+  type DismissibleRootProps,
+} from "../private/useDismissible";
+
+const { withContext, withProvider } = createSlotRecipeContext(callout);
+
+export interface CalloutRootProps extends CalloutVariantProps, DismissibleRootProps {}
+
+export const CalloutRoot = withProvider<HTMLDivElement, CalloutRootProps>(DismissibleRoot, "root");
+
+export interface CalloutContentProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {}
+
+export const CalloutContent = withContext<HTMLDivElement, CalloutContentProps>(
+  Primitive.div,
+  "content",
+);
+
+export interface CalloutTitleProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {}
+
+export const CalloutTitle = withContext<HTMLSpanElement, CalloutTitleProps>(
+  Primitive.span,
+  "title",
+);
+
+export interface CalloutDescriptionProps
+  extends PrimitiveProps,
+    React.HTMLAttributes<HTMLSpanElement> {}
+
+export const CalloutDescription = withContext<HTMLSpanElement, CalloutDescriptionProps>(
+  Primitive.span,
+  "description",
+);
+
+export interface CalloutLinkProps
+  extends PrimitiveProps,
+    React.ButtonHTMLAttributes<HTMLButtonElement> {}
+
+export const CalloutLink = withContext<HTMLButtonElement, CalloutLinkProps>(
+  Primitive.button,
+  "link",
+);
+
+export interface CalloutCloseButtonProps
+  extends PrimitiveProps,
+    React.ButtonHTMLAttributes<HTMLButtonElement> {}
+
+export const CalloutCloseButton = withContext<HTMLButtonElement, CalloutCloseButtonProps>(
+  DismissibleCloseButton,
+  "closeButton",
+);

package/src/components/Callout/index.ts

@@ -0,0 +1,16 @@
+export {
+  CalloutCloseButton,
+  CalloutContent,
+  CalloutDescription,
+  CalloutLink,
+  CalloutRoot,
+  CalloutTitle,
+  type CalloutCloseButtonProps,
+  type CalloutContentProps,
+  type CalloutDescriptionProps,
+  type CalloutLinkProps,
+  type CalloutRootProps,
+  type CalloutTitleProps,
+} from "./Callout";
+
+export * as Callout from "./Callout.namespace";

package/src/components/Celsius/Celsius.tsx

@@ -0,0 +1,9 @@
+import type * as React from "react";
+
+export interface CelsiusProps {
+  value: number;
+}
+
+export const Celsius: React.FC<CelsiusProps> = (props) => {
+  return `${props.value}°C`;
+};

package/src/components/Celsius/index.ts

@@ -0,0 +1,4 @@
+export {
+  Celsius,
+  type CelsiusProps,
+} from "./Celsius";

package/src/components/Checkbox/Checkbox.namespace.ts

@@ -0,0 +1,14 @@
+export {
+  CheckboxControl as Control,
+  CheckboxGroup as Group,
+  CheckboxHiddenInput as HiddenInput,
+  CheckboxIndicator as Indicator,
+  CheckboxLabel as Label,
+  CheckboxRoot as Root,
+  type CheckboxControlProps as ControlProps,
+  type CheckboxGroupProps as GroupProps,
+  type CheckboxHiddenInputProps as HiddenInputProps,
+  type CheckboxIndicatorProps as IndicatorProps,
+  type CheckboxLabelProps as LabelProps,
+  type CheckboxRootProps as RootProps,
+} from "./Checkbox";

package/src/components/Checkbox/Checkbox.tsx

@@ -0,0 +1,176 @@
+import { checkbox, type CheckboxVariantProps } from "@seed-design/css/recipes/checkbox";
+import { checkmark, type CheckmarkVariantProps } from "@seed-design/css/recipes/checkmark";
+import { splitMultipleVariantsProps } from "../../utils/splitMultipleVariantsProps";
+import { mergeProps } from "@seed-design/dom-utils";
+import { Checkbox as CheckboxPrimitive, useCheckboxContext } from "@seed-design/react-checkbox";
+import { Primitive, type PrimitiveProps } from "@seed-design/react-primitive";
+import clsx from "clsx";
+import { forwardRef } from "react";
+import { createSlotRecipeContext } from "../../utils/createSlotRecipeContext";
+import { createWithStateProps } from "../../utils/createWithStateProps";
+import { InternalIcon } from "../private/Icon";
+import { createRecipeContext } from "../../utils/createRecipeContext";
+import {
+  checkboxGroup,
+  type CheckboxGroupVariantProps,
+} from "@seed-design/css/recipes/checkbox-group";
+
+const { withContext: withGroupContext } = createRecipeContext(checkboxGroup);
+const { ClassNamesProvider, withContext } = createSlotRecipeContext(checkbox);
+const {
+  withProvider: withCheckmarkProvider,
+  useClassNames: useCheckmarkClassNames,
+  PropsProvider: CheckmarkPropsProvider,
+} = createSlotRecipeContext(checkmark);
+const withStateProps = createWithStateProps([useCheckboxContext]);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface CheckboxGroupProps
+  extends CheckboxGroupVariantProps,
+    PrimitiveProps,
+    React.HTMLAttributes<HTMLDivElement> {}
+
+export const CheckboxGroup = withGroupContext<HTMLDivElement, CheckboxGroupProps>(Primitive.div);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * @deprecated Use `regular` or `bold` instead of `default` or `stronger`
+ */
+type CheckboxVariantDeprecatedWeightProps = "default" | "stronger";
+
+export interface CheckboxRootProps
+  extends Omit<CheckboxVariantProps, "weight">,
+    CheckmarkVariantProps,
+    CheckboxPrimitive.RootProps {
+  weight?: CheckboxVariantProps["weight"] | CheckboxVariantDeprecatedWeightProps;
+}
+
+export const CheckboxRoot = Object.assign(
+  forwardRef<HTMLLabelElement, CheckboxRootProps>(({ className, ...props }, ref) => {
+    if (
+      process.env.NODE_ENV !== "production" &&
+      (props.weight === "default" || props.weight === "stronger")
+    ) {
+      console.warn(
+        `[SEED Design System] Checkbox weight='${props.weight}' is deprecated and will be removed in @seed-design/react@1.3.0. Use weight='${props.weight === "default" ? "regular" : "bold"}' instead.`,
+      );
+    }
+
+    const [{ checkbox: checkboxVariantProps, checkmark: checkmarkVariantProps }, otherProps] =
+      splitMultipleVariantsProps(
+        {
+          ...props,
+          // TODO: replace this mapping completely
+          weight:
+            props.weight === "stronger"
+              ? "bold"
+              : props.weight === "default"
+                ? "regular"
+                : props.weight,
+        },
+        { checkbox, checkmark },
+      );
+
+    const classNames = checkbox(checkboxVariantProps);
+
+    return (
+      <CheckmarkPropsProvider value={checkmarkVariantProps}>
+        <ClassNamesProvider value={classNames}>
+          <CheckboxPrimitive.Root
+            ref={ref}
+            className={clsx(classNames.root, className)}
+            {...otherProps}
+          />
+        </ClassNamesProvider>
+      </CheckmarkPropsProvider>
+    );
+  }),
+  {
+    Primitive: CheckboxPrimitive.Root,
+  },
+);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * CheckboxControl combines Checkbox.Primitive with checkmark.root styling
+ * This enables standalone usage of Checkbox.Control with variants
+ */
+
+export interface CheckboxControlProps
+  extends CheckmarkVariantProps,
+    CheckboxPrimitive.ControlProps {}
+
+export const CheckboxControl = withCheckmarkProvider<HTMLDivElement, CheckboxControlProps>(
+  CheckboxPrimitive.Control,
+  "root",
+);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface CheckboxIndicatorProps extends React.SVGAttributes<SVGSVGElement> {
+  /**
+   * The icon to display when the checkbox is unchecked.
+   */
+  unchecked?: React.ReactNode;
+
+  /**
+   * The icon to display when the checkbox is checked.
+   */
+  checked: React.ReactNode;
+
+  /**
+   * The icon to display when the checkbox is in an indeterminate state.
+   */
+  indeterminate?: React.ReactNode;
+}
+
+export const CheckboxIndicator = forwardRef<SVGSVGElement, CheckboxIndicatorProps>(
+  (
+    {
+      unchecked: uncheckedSvg,
+      checked: checkedSvg,
+      indeterminate: indeterminateSvg,
+      ...otherProps
+    },
+    ref,
+  ) => {
+    const { stateProps, checked, indeterminate } = useCheckboxContext();
+    const classNames = useCheckmarkClassNames();
+
+    const mergedProps = mergeProps(
+      stateProps,
+      { className: classNames.icon },
+      otherProps as React.HTMLAttributes<HTMLElement>,
+    );
+
+    if (indeterminate && !indeterminateSvg) {
+      console.warn(
+        "CheckboxIndicator: the `indeterminate` prop must be provided when the checkbox is in an indeterminate state.",
+      );
+    }
+
+    if (indeterminate) return <InternalIcon ref={ref} svg={indeterminateSvg} {...mergedProps} />;
+    if (checked) return <InternalIcon ref={ref} svg={checkedSvg} {...mergedProps} />;
+    if (uncheckedSvg) return <InternalIcon ref={ref} svg={uncheckedSvg} {...mergedProps} />;
+    return null;
+  },
+);
+CheckboxIndicator.displayName = "CheckboxIndicator";
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface CheckboxLabelProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {}
+
+export const CheckboxLabel = withContext<HTMLDivElement, CheckboxLabelProps>(
+  withStateProps(Primitive.span),
+  "label",
+);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface CheckboxHiddenInputProps extends CheckboxPrimitive.HiddenInputProps {}
+
+export const CheckboxHiddenInput = CheckboxPrimitive.HiddenInput;

package/src/components/Checkbox/index.ts

@@ -0,0 +1,16 @@
+export {
+  CheckboxControl,
+  CheckboxGroup,
+  CheckboxHiddenInput,
+  CheckboxIndicator,
+  CheckboxLabel,
+  CheckboxRoot,
+  type CheckboxControlProps,
+  type CheckboxGroupProps,
+  type CheckboxHiddenInputProps,
+  type CheckboxIndicatorProps,
+  type CheckboxLabelProps,
+  type CheckboxRootProps,
+} from "./Checkbox";
+
+export * as Checkbox from "./Checkbox.namespace";

package/src/components/Chip/Chip.namespace.ts

@@ -0,0 +1,12 @@
+export {
+  ChipRoot as Root,
+  ChipLabel as Label,
+  ChipPrefixIcon as PrefixIcon,
+  ChipPrefixAvatar as PrefixAvatar,
+  ChipSuffixIcon as SuffixIcon,
+  type ChipRootProps as RootProps,
+  type ChipLabelProps as LabelProps,
+  type ChipPrefixIconProps as PrefixIconProps,
+  type ChipPrefixAvatarProps as PrefixAvatarProps,
+  type ChipSuffixIconProps as SuffixIconProps,
+} from "./Chip";

package/src/components/Chip/Chip.tsx

@@ -0,0 +1,67 @@
+import { chip, type ChipVariantProps } from "@seed-design/css/recipes/chip";
+import { Primitive, type PrimitiveProps } from "@seed-design/react-primitive";
+import type * as React from "react";
+import { createSlotRecipeContext } from "../../utils/createSlotRecipeContext";
+import { withIconRequired } from "../Icon/Icon";
+import { createWithStateProps } from "../../utils/createWithStateProps";
+import { useCheckboxContext } from "@seed-design/react-checkbox";
+import { useRadioGroupItemContext } from "@seed-design/react-radio-group";
+
+const { withProvider, withContext } = createSlotRecipeContext(chip);
+const withStateProps = createWithStateProps([
+  { useContext: useCheckboxContext, strict: false },
+  { useContext: useRadioGroupItemContext, strict: false },
+]);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipRootProps
+  extends PrimitiveProps,
+    ChipVariantProps,
+    React.ButtonHTMLAttributes<HTMLButtonElement> {}
+
+export const ChipRoot = withIconRequired(
+  withProvider<HTMLButtonElement, ChipRootProps>(Primitive.button, "root"),
+  (props: ChipRootProps) => props.layout === "iconOnly",
+);
+ChipRoot.displayName = "Chip.Root";
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipLabelProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {}
+
+export const ChipLabel = withContext<HTMLSpanElement, ChipLabelProps>(
+  withStateProps(Primitive.span),
+  "label",
+);
+ChipLabel.displayName = "Chip.Label";
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipPrefixIconProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {}
+export const ChipPrefixIcon = withContext<HTMLDivElement, ChipPrefixIconProps>(
+  withStateProps(Primitive.div),
+  "prefixIcon",
+);
+ChipPrefixIcon.displayName = "Chip.PrefixIcon";
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipPrefixAvatarProps
+  extends PrimitiveProps,
+    React.HTMLAttributes<HTMLDivElement> {}
+
+export const ChipPrefixAvatar = withContext<HTMLDivElement, ChipPrefixAvatarProps>(
+  withStateProps(Primitive.div),
+  "prefixAvatar",
+);
+ChipPrefixAvatar.displayName = "Chip.PrefixAvatar";
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipSuffixIconProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {}
+export const ChipSuffixIcon = withContext<HTMLDivElement, ChipSuffixIconProps>(
+  withStateProps(Primitive.div),
+  "suffixIcon",
+);
+ChipSuffixIcon.displayName = "Chip.SuffixIcon";

package/src/components/Chip/index.ts

@@ -0,0 +1,14 @@
+export {
+  ChipRoot,
+  ChipLabel,
+  ChipPrefixIcon,
+  ChipPrefixAvatar,
+  ChipSuffixIcon,
+  type ChipRootProps,
+  type ChipLabelProps,
+  type ChipPrefixIconProps,
+  type ChipPrefixAvatarProps,
+  type ChipSuffixIconProps,
+} from "./Chip";
+
+export * as Chip from "./Chip.namespace";

package/src/components/ChipTabs/ChipTabs.namespace.ts

@@ -0,0 +1,14 @@
+export {
+  ChipTabsContent as Content,
+  ChipTabsList as List,
+  ChipTabsRoot as Root,
+  ChipTabsCarouselCamera as CarouselCamera,
+  ChipTabsCarousel as Carousel,
+  ChipTabsTrigger as Trigger,
+  type ChipTabsContentProps as ContentProps,
+  type ChipTabsListProps as ListProps,
+  type ChipTabsRootProps as RootProps,
+  type ChipTabsCarouselCameraProps as CarouselCameraProps,
+  type ChipTabsCarouselProps as CarouselProps,
+  type ChipTabsTriggerProps as TriggerProps,
+} from "./ChipTabs";

package/src/components/ChipTabs/ChipTabs.tsx

@@ -0,0 +1,80 @@
+import { chipTabs, type ChipTabsVariantProps } from "@seed-design/css/recipes/chip-tabs";
+import { Tabs as TabsPrimitive } from "@seed-design/react-tabs";
+import { createSlotRecipeContext } from "../../utils/createSlotRecipeContext";
+import { forwardRef } from "react";
+import clsx from "clsx";
+
+const { ClassNamesProvider, withContext } = createSlotRecipeContext(chipTabs);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipTabsRootProps extends ChipTabsVariantProps, TabsPrimitive.RootProps {}
+
+export const ChipTabsRoot = forwardRef<HTMLDivElement, ChipTabsRootProps>(
+  ({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && props.variant === "brandSolid") {
+      console.warn(
+        "[SEED Design System] ChipTabs variant='brandSolid' is deprecated and will be removed in @seed-design/react@1.3.0. Use variant='neutralSolid' or variant='neutralOutline' instead.",
+      );
+    }
+
+    const [variantProps, otherProps] = chipTabs.splitVariantProps(props);
+    const classNames = chipTabs(variantProps);
+
+    return (
+      <ClassNamesProvider value={classNames}>
+        <TabsPrimitive.Root
+          ref={ref}
+          className={clsx(classNames.root, className)}
+          {...otherProps}
+        />
+      </ClassNamesProvider>
+    );
+  },
+);
+ChipTabsRoot.displayName = "ChipTabsRoot";
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipTabsListProps extends TabsPrimitive.ListProps {}
+
+export const ChipTabsList = withContext<HTMLDivElement, ChipTabsListProps>(
+  TabsPrimitive.List,
+  "list",
+);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipTabsTriggerProps extends TabsPrimitive.TriggerProps {}
+
+export const ChipTabsTrigger = withContext<HTMLButtonElement, ChipTabsTriggerProps>(
+  TabsPrimitive.Trigger,
+  "trigger",
+);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipTabsContentProps extends TabsPrimitive.ContentProps {}
+
+export const ChipTabsContent = withContext<HTMLSpanElement, ChipTabsContentProps>(
+  TabsPrimitive.Content,
+  "content",
+);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipTabsCarouselProps extends TabsPrimitive.CarouselProps {}
+
+export const ChipTabsCarousel = withContext<HTMLDivElement, ChipTabsCarouselProps>(
+  TabsPrimitive.Carousel,
+  "carousel",
+);
+
+////////////////////////////////////////////////////////////////////////////////////
+
+export interface ChipTabsCarouselCameraProps extends TabsPrimitive.CarouselCameraProps {}
+
+export const ChipTabsCarouselCamera = withContext<HTMLDivElement, ChipTabsCarouselCameraProps>(
+  TabsPrimitive.CarouselCamera,
+  "carouselCamera",
+);

package/src/components/ChipTabs/index.ts

@@ -0,0 +1,16 @@
+export {
+  ChipTabsContent,
+  ChipTabsList,
+  ChipTabsRoot,
+  ChipTabsCarouselCamera,
+  ChipTabsCarousel,
+  ChipTabsTrigger,
+  type ChipTabsContentProps,
+  type ChipTabsListProps,
+  type ChipTabsRootProps,
+  type ChipTabsCarouselCameraProps,
+  type ChipTabsCarouselProps,
+  type ChipTabsTriggerProps,
+} from "./ChipTabs";
+
+export * as ChipTabs from "./ChipTabs.namespace";

package/src/components/Columns/Columns.tsx

@@ -0,0 +1,49 @@
+import * as React from "react";
+import { Box, type BoxProps } from "../Box/Box";
+
+/**
+ * @deprecated Use `HStack` instead.
+ */
+export interface ColumnsProps extends Omit<BoxProps, "display" | "direction"> {}
+
+/**
+ * @deprecated Use `HStack` instead.
+ */
+export const Columns = React.forwardRef<HTMLDivElement, ColumnsProps>((props, ref) => {
+  return (
+    <Box
+      ref={ref}
+      display="flex"
+      flexDirection="row"
+      flexWrap="nowrap"
+      justifyContent="flex-start"
+      {...props}
+    />
+  );
+});
+
+/**
+ * @deprecated Use `HStack` instead.
+ */
+export interface ColumnProps extends Omit<BoxProps, "display" | "flexDirection" | "width"> {
+  width?: BoxProps["width"] | "content";
+}
+
+/**
+ * @deprecated Use `HStack` instead.
+ */
+export const Column = React.forwardRef<HTMLDivElement, ColumnProps>((props, ref) => {
+  const { width, ...otherProps } = props;
+
+  return (
+    <Box
+      ref={ref}
+      display="flex"
+      flexDirection="column"
+      width={width !== "content" ? "full" : undefined}
+      flexShrink={width ? 0 : undefined}
+      flexGrow={width ? 0 : 1}
+      {...otherProps}
+    />
+  );
+});

package/src/components/Columns/index.ts

@@ -0,0 +1 @@
+export { Columns, Column, type ColumnsProps, type ColumnProps } from "./Columns";

package/src/components/ConsistentWidth/ConsistentWidth.tsx

@@ -0,0 +1,21 @@
+import { Primitive, type PrimitiveProps } from "@seed-design/react-primitive";
+import clsx from "clsx";
+import { forwardRef } from "react";
+
+export interface ConsistentWidthProps
+  extends PrimitiveProps,
+    Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {
+  children: string;
+}
+
+export const ConsistentWidth = forwardRef<HTMLSpanElement, ConsistentWidthProps>((props, ref) => {
+  const { className, ...otherProps } = props;
+  return (
+    <Primitive.span
+      data-text={props.children}
+      ref={ref}
+      className={clsx("seed-consistent-width", className)}
+      {...otherProps}
+    />
+  );
+});

package/src/components/ConsistentWidth/index.ts

@@ -0,0 +1 @@
+export { ConsistentWidth } from "./ConsistentWidth";

package/src/components/ContentPlaceholder/ContentPlaceholder.namespace.ts

@@ -0,0 +1,6 @@
+export {
+  ContentPlaceholderRoot as Root,
+  ContentPlaceholderAsset as Asset,
+  type ContentPlaceholderRootProps as RootProps,
+  type ContentPlaceholderAssetProps as AssetProps,
+} from "./ContentPlaceholder";