TitledImage

@component-controls/components

3.4.5

Image component with a title if available

Component

browse

docs

issues

import { TitledImage } from '@component-controls/components';

Overview

some image title

browse

docs

issues

({ title }) => {
  return (
    <TitledImage
      title={title}
      alt="alt text"
      src="https://github.com/ccontrols/component-controls/raw/master/misc/storybook-custom-docs/images/simple-page.jpg"
    />
  );
}

Controls

Name	Description	Default	Controls
title	string	-

Properties

	Name	Description	Default
SpaceProps (28 properties)

	p	Padding on top, left, bottom and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	m	Margin on top, left, bottom and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	margin	Margin on top, left, bottom and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	mt	Margin on top ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	marginTop	Margin on top ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	mr	Margin on right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	marginRight	Margin on right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	mb	Margin on bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	marginBottom	Margin on bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	ml	Margin on left ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	marginLeft	Margin on left ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	mx	Margin on left and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	marginX	Margin on left and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	my	Margin on top and bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	marginY	Margin on top and bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	padding	Padding on top, left, bottom and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	pt	Padding on top ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	paddingTop	Padding on top ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	pr	Padding on right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	paddingRight	Padding on right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	pb	Padding on bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	paddingBottom	Padding on bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	pl	Padding on left ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	paddingLeft	Padding on left ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	px	Padding on left and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	paddingX	Padding on left and right ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	py	Padding on top and bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
	paddingY	Padding on top and bottom ResponsiveValue<stringnumbersymbol, Required<Theme<stringnumber>>>	-
HTMLAttributes (44 properties)
Attributes (1 properties)
ImgHTMLAttributes (11 properties)
AriaAttributes (48 properties)
DOMAttributes (161 properties)
BoxOwnProps (4 properties)
BackgroundColorProps (2 properties)
OpacityProps (1 properties)