Code – Nextra

Composable

▸ Composable(props): Element

Defines a composable child inside of a Compose component

Parameters

Name	Type
`props`	`ComposableProps`

Returns

Element

Example

function Button({ asChild, children, ...props }) {
  const Composition = asChild ? Compose : "button";
  return (
    <Composition {...props}>
      Prefix <Composable>{children}</Composable>
    </Composition>
  );
}

import React from 'react'
import { Composition } from '@vtex/shoreline-components'
import { Composable } from '@vtex/shoreline-components'
export default function App() { return (<>function Button({ asChild, children, ...props }){ const Composition = asChild ? Compose : 'button' return (   <Composition {...props}>     Prefix <Composable>{children}</Composable>   </Composition> )}</>)}

Open Sandbox

Defined in

packages/components/src/compose/composable.tsx:17 (opens in a new tab)

Props Props