A next-generation tool to create blazing-fast documentation sites
API
created:4/20/2021
updated:4/20/2021
loc
38
comments
5%
passed
8
coverage
92%

NotesBlock

avatar of atanasster
@component-controls/addon-notes
3.14.5
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(1 properties)
AriaAttributes(48 properties)
DOMAttributes(161 properties)
-(1 properties)
BoxOwnProps(4 properties)
SpaceProps(28 properties)
BackgroundColorProps(2 properties)
OpacityProps(1 properties)
StoryInputProps(1 properties)

Commits

Date
Author
Commit Message
1/6/2021

atanasster

avatar of atanasster
feat: addon-images
1/6/2021

atanasster

avatar of atanasster
feat: new addon-notes
2 commits
package
imports
peer
useCustomPropsStoryBlockContainerPropsStoryBlockContainer
Markdown
useStoryStoryInputProps
react
^17.0.1
FC
*
theme-ui
^0.8.4
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