import React from 'react'
import { type Meta } from '@storybook/react-vite'

import { DocsTemplate } from '../../../.storybook'
import { DEBOUNCE_STANDARD_TIME } from '../../services/HelperServiceTyped'

export const Example = (): React.JSX.Element => {
  return <>Standard Debounce Time: {DEBOUNCE_STANDARD_TIME}</>
}
Example.storyName = 'DEBOUNCE_STANDARD_TIME'

export default {
  title: 'Helper Variables/DEBOUNCE_STANDARD_TIME',
  component: Example,
  parameters: {
    viewMode: 'docs',
    previewTabs: {
      canvas: { hidden: true },
    },
    docs: {
      page: () => (
        <>
          <DocsTemplate
            code={`
              import { DEBOUNCE_STANDARD_TIME } from '@patterninc/react-ui'

              <TextInput debounce={ DEBOUNCE_STANDARD_TIME } ... />

              // DEBOUNCE_STANDARD_TIME = 250ms
            `}
            infoBullets={[
              <span key='first-line'>
                A value defined for our common debounce time. This is set to{' '}
                <code>250ms</code>.
              </span>,
            ]}
          />
        </>
      ),
    },
  },
} as Meta<typeof Example>