How to use the @storybook/addon-knobs/vue.text function in @storybook/addon-knobs

To help you get started, we’ve selected a few @storybook/addon-knobs examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
searchForm: () => ({
    title: text('Title', 'Search results'),
    subtitle: text('Subtitle', ''),
    searchPlaceholder: text('Search Placeholder', 'Enter keywords'),
    prefillSearchTerm: text('Prefilled Search Term', 'Bananas'),
    searchInputLabel: text('Search Input Label', 'Search for'),
    buttonLabel: text('Button Label', 'Search'),
    buttonHiddenLabel: boolean('Button Hidden Label', true),
    autoFocus: boolean('Auto Focus', false),
    textSearch: boolean('Text Search', true),
    expandFilters: boolean('Expand Filters', false),
    filterForm: object('Filter Form', {
      tideId: 'tide_search_form',
      model: {
        topic: []
      },
      schema: {
        fields: [{
github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
documentLink: () => ({
    name: text('Name', 'This is the name of the document'),
    caption: text('caption', 'This is a longer description of the document above.'),
    url: text('Download url', 'https://www.google.com'),
    extension: text('Extension', 'pdf'),
    filesize: text('Filesize', '1.4 mb')
  }),
github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
figure: () => ({
    image: object('Image', {
      src: 'https://placehold.it/800x400',
      alt: 'A generic square placeholder image.'
    }),
    caption: text('Caption', '1.2 Caption to go here. This should be restricted in characters.')
  }),
github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
button: () => ({
    content: text('Content', 'Ripple Button'),
    href: text('href', '#'),
    theme: selectV2('Theme', {primary: 'primary', secondary: 'secondary'}, 'primary'),
    disabled: boolean('Disabled', false)
  }),
github dpc-sdp / ripple / src / components / Organisms / UpdatedDate / stories.js View on Github external
data () {
      return {
        date: text('Date', '2018-07-10T09:00:00.000+10:00'),
        prefix: text('Prefix', 'Reviewed'),
        locale: text('Locale', 'en-au')
      }
    }
  })))
github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
documentLink: () => ({
    name: text('Name', 'This is the name of the document'),
    caption: text('caption', 'This is a longer description of the document above.'),
    url: text('Download url', 'https://www.google.com'),
    extension: text('Extension', 'pdf'),
    filesize: text('Filesize', '1.4 mb')
  }),
github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
heroBanner: () => ({
    title: text('Title', 'This is display copy that wraps 2 lines'),
    introText: text('Intro Text', 'This is supplementary intro text that can also wrap over a couple of lines.'),
    linkHeading: text('Link Heading', 'Want to know more about...'),
    links: object('Links', [
      { text: 'First journey based link', url: '#' },
      { text: 'Secondary journey based link', url: '#' },
      { text: 'Third link goes here', url: '#' },
      { text: 'Fourth journey based link', url: '#' }
    ]),
    moreLink: object('More Link', { text: 'See more', url: '#' }),
    theme: selectV2('Theme', {dark: 'dark', light: 'light'}, 'light'),
    showLinks: boolean('Show Links', true),
    logo: text('Logo', '/herologo.png'),
    backgroundGraphic: text('Background Graphic', '/bggraphiclower.png')
  }),
github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
documentLink: () => ({
    name: text('Name', 'This is the name of the document'),
    caption: text('caption', 'This is a longer description of the document above.'),
    url: text('Download url', 'https://www.google.com'),
    extension: text('Extension', 'pdf'),
    filesize: text('Filesize', '1.4 mb')
  }),
github dpc-sdp / ripple / packages / components / Organisms / Profile / stories.js View on Github external
.add('Profile Highlight Honour Roll', () => ({
    components: { RplProfileHighlightHonourRoll },
    template: ``,
    props: {
      image: {
        default: text('Image', 'http://placehold.it/156x156')
      },
      inductedYear: {
        default: text('Inducted Year', '2018')
      },
      category: {
        default: text('Category', 'Local Champion')
      }
    }
  }))
github dpc-sdp / ripple / packages / ripple-ui-components / src / storybook-components / _data / demoData.js View on Github external
metaTag: () => ({
    linkText: text('Text', 'Meta Tag'),
    linkUrl: text('Link', '#'),
    theme: selectV2('Theme', {light: 'light', dark: 'dark'}, 'light')
  }),