Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow Control Types Config (ArgTypes) #166

Open
lukethacoder opened this issue May 6, 2023 · 1 comment
Open

Allow Control Types Config (ArgTypes) #166

lukethacoder opened this issue May 6, 2023 · 1 comment
Labels
enhancement New feature or request

Comments

@lukethacoder
Copy link

Would be awesome if we could configure the input types, especially for the Colors.

Proposing a similar setup to the standard Storybook ArgTypes

Thinking that config per @presenter type would be ideal, but would be nice to add custom control types on a per-design token basis too.

Presenter Config

const parameters = {
  designToken: {
    controls: {
      // config per `@presenter` type here
      Colors: {
        type: 'color', presetColors: ['#ff0000', '#00ff00', '#0000ff']
      },
      BorderRadius: {
        type: 'radio', options: ['0px', '4px', '8px', '16px'] }
    }
  }
}

Specific Design Hook Override Config

const parameters = {
  designToken: {
    controls: {
      // object of design token specific overrides. Handy for enforcing specific values on specific tokens
      overrides: {
        '--theme-button-background': {
          type: 'select', options: ['#ff0000', '#00ff00', '#0000ff']
        }
      }
    }
  }
}
@Sqrrl
Copy link
Collaborator

Sqrrl commented Jun 16, 2023

Hey. Open for a PR if you would like to give it a try. I won't get to it anytime soon, unfortunately.

@Sqrrl Sqrrl added the enhancement New feature or request label Jun 16, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants