Sha256: 9716336ef5ef2ae6619e054f15bb735c269bf6fd12c1c04ffcdc8d20f2ed6acb

Contents?: true

Size: 1.59 KB

Versions: 1919

Compression:

Stored size: 1.59 KB

Contents

import React, { useState } from 'react'

import Passphrase from '../_passphrase'

const PassphraseTips = (props) => {
  const [input, setInput] = useState('')

  const handleChange = (e) => setInput(e.target.value)

  return (
    <>
      <div>
        <Passphrase
            label="Pass an array of strings to the tips prop"
            onChange={handleChange}
            tips={['And the info icon will appear.', 'Each string will be displayed as its own tip']}
            value={input}
            {...props}
        />
        <Passphrase
            label="Omit the prop to hide the icon"
            onChange={handleChange}
            value={input}
            {...props}
        />
        <Passphrase
            label="Only show tips at small screen size"
            onChange={handleChange}
            showTipsBelow="xs"
            tips={['Make the password longer', 'Type more things', 'Use something else']}
            value={input}
            {...props}
        />
        <Passphrase
            label="Only show tips at medium screen size"
            onChange={handleChange}
            showTipsBelow="md"
            tips={['Make the password longer', 'Type more things', 'Use something else']}
            value={input}
            {...props}
        />
        <Passphrase
            label="Only show tips at large screen size"
            onChange={handleChange}
            showTipsBelow="lg"
            tips={['Make the password longer', 'Type more things', 'Use something else']}
            value={input}
            {...props}
        />
      </div>
    </>
  )
}

export default PassphraseTips

Version data entries

1,919 entries across 1,919 versions & 2 rubygems

Version Path
playbook_ui-10.6.2.pre.alpha.dep app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.6.1.pre.alpha1 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.6.0 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.5.0 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.4.0 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.3.0 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.2.1.alpha.sisensefix app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.2.1 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.2.0 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.1.0 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.3.pre.alpha.walkthrough2 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.3.pre.alpha.walkthrough app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.1.alpha.railscusticon app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.2.pre.alpha.pre.iconfix app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.1.alpha.rtflexfix app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.0.pre.alphafonts app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.1 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-10.0.0 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx
playbook_ui-9.19.0.pre.alpha.pre.fonts2 app/pb_kits/playbook/pb_passphrase/docs/_passphrase_tips.jsx