A next-generation tool to create blazing-fast documentation sites
API
created:3/5/2021
updated:3/5/2021
source lines:38
comments %:5

NotesBlock

@component-controls/addon-notes
3.6.1

import { NotesBlock } from '@component-controls/addon-notes';

Overview

Component design notes

  1. Be user-friendly
  2. Be a11y accessible
  3. Go to 1

Name
Description
Default
NotesBlockOwnProps (1 properties)
items
(string | { [key: string]: any; text: string; })[]
-
BlockContainerOwnProps (6 properties)
HTMLAttributes (42 properties)
Attributes (2 properties)
AriaAttributes (48 properties)
DOMAttributes (161 properties)
- (1 properties)
BoxOwnProps (3 properties)
SpaceProps (28 properties)
BackgroundColorProps (2 properties)
OpacityProps (1 properties)
StoryInputProps (1 properties)

Commits

Date
Author
Commit Message
1/6/2021

atanasster

feat: addon-images
1/6/2021

atanasster

feat: new addon-notes
2 commits

package
imports
peer
useCustomPropsStoryBlockContainerPropsStoryBlockContainer
Markdown
useStoryStoryInputProps
react
^17.0.1
FC
*
theme-ui
^0.6.0-alpha.7
jsx
*

Stories

Custom Items

Introduction

some markdown

Custom Config Props

Custom title here

Component design notes

  1. Be user-friendly
  2. Be a11y accessible
  3. Go to 1

Markdown File

Button

Guidelines

  • The component should use color palette
  • The component will have 3 variants
    1. primary
      • for main, most important actions on secreen
    2. secondary
      • for less-significant actions
    3. disabled
      • can not be clicked, visually subdued

Styles

  • primary color #d45a33f
  • disabled color color #3e3e3e