@capaj/react-select-timezone
    TypeScript icon, indicating that this package has built-in type declarations

    3.0.0 • Public • Published

    React-Select-Timezone

    A simple component wrapping React-Select and Moment.Timezone to make a timezone picker.

    Forked from vinhnglx/react-timezone-select

    Installation

    $ npm install @capaj/react-select-timezone
    

    Usage

    import React from 'react'
    import ReactDOM from 'react-dom'
    import PropTypes from 'prop-types'
    import SelectTimezone, { getTimezoneProps } from 'react-select-timezone'
    
    const App = () => {
      return (
        <div>
          <SelectTimezone
            value={momentTimezone.tz.guess()} // the default, so you can omit if you don't need other value
            isClearable // allows user to have null value in this select
            guess // this will fill the input with user's timezone guessed by moment. A "value" prop has always bigger priority than guessed TZ
            onChange={(val) => {
              console.log(val) // like "Europe/London"
              // if you need to get offset you can use
              const timezoneProps = getTimezoneProps(val)
              console.log(timezoneProps.time) // like "-2.00"
              console.log(timezoneProps.label) // like "(GMT+02:00) Europe/Prague"
              console.log(timezoneProps.offset) // like -120
            }}
          />
        </div>
      )
    }
    
    App.propTypes = {
      name: PropTypes.string
    }
    
    export default App

    if you just need to display a timezone in the same format, do import {formatTimezone} from @capaj/react-select-timezone and use that. It will format the Europe/London into (GMT+01:00) Europe/London

    Virtual menu list

    If you prefer virtualized list, import makeVirtualMenuListComponent and use it like show in the showcase.

    Install

    npm i @capaj/react-select-timezone

    DownloadsWeekly Downloads

    281

    Version

    3.0.0

    License

    MIT

    Unpacked Size

    18.2 kB

    Total Files

    13

    Last publish

    Collaborators

    • capaj