Sha256: 83e3be01ad956dc66838e2e68f30df50cfb0844d2e09a41d3b916400fda3e8d3

Contents?: true

Size: 1.65 KB

Versions: 948

Compression:

Stored size: 1.65 KB

Contents

import React from 'react'
import { Date as FormattedDate, Caption, Title } from 'playbook-ui'

const DateDefault = (props) => {
  return (
    <>
      <FormattedDate
          size="sm"
          value={new Date()}
          {...props}
      />

      <br />

      <div style={{display: "flex", columnGap: 4}}>
        <FormattedDate
            size="sm"
            value={"2012-08-03"}
            {...props}
        />
        <Caption>{"(Hyphenated Date)"}</Caption>
      </div>

      <br />

      <FormattedDate
          size="sm"
          value={new Date('03 Aug 2012')}
          {...props}
      />

      <br />

      <FormattedDate
          showDayOfWeek
          size="sm"
          value={new Date('03 Dec 2017')}
          {...props}
      />

      <br />
      <br />

      <FormattedDate
          value={new Date()}
          {...props}
      />

      <br />

      <div style={{display: "flex", columnGap: 4}}>
        <FormattedDate
            value={"2012-08-03"}
            {...props}
        />
        <Title
            size={4}
            text={"(Hyphenated Date)"}
        />
      </div>

      <br />

      <FormattedDate
          value={new Date('03 Aug 2012')}
          {...props}
      />

      <br />

      <FormattedDate
          showDayOfWeek
          value={new Date('03 Dec 2017')}
          {...props}
      />
    </>
  )
}

export default DateDefault

// *Development Note* -  We are reviewing this kit for a potential name change due to naming collisions when `new Date()` is used.
// To avoid this bug, please use name spacing as shown in the code examples. ie `import { Date as AliasedComponentName } from 'playbook-ui'

Version data entries

948 entries across 948 versions & 2 rubygems

Version Path
playbook_ui-14.11.0.pre.rc.17 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.11.0 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.11.0.pre.rc.16 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.11.0.pre.rc.16 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.10.0.pre.alpha.play16825301 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.10.0.pre.alpha.play16825301 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.11.0.pre.rc.15 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.11.0.pre.rc.15 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.11.0.pre.rc.14 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.11.0.pre.rc.14 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.11.0.pre.rc.13 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.11.0.pre.rc.13 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.11.0.pre.rc.12 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.11.0.pre.rc.12 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.10.0.pre.alpha.PLAY1774timelinelabelstepspacing5274 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.10.0.pre.alpha.PLAY1774timelinelabelstepspacing5274 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.10.0.pre.alpha.play1465attempt25272 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.10.0.pre.alpha.play1465attempt25272 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui_docs-14.10.0.pre.alpha.play16825244 app/pb_kits/playbook/pb_date/docs/_date_default.jsx
playbook_ui-14.10.0.pre.alpha.play16825244 app/pb_kits/playbook/pb_date/docs/_date_default.jsx