react-timezone-select 2.1.1 → 2.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE CHANGED
File without changes
package/README.md CHANGED
@@ -126,6 +126,7 @@ The above example will generate two additional choices in the select options, on
126
126
  - `onBlur` - `() => void`
127
127
  - `onChange` - `(timezone) => void`
128
128
  - `labelStyle` - `'original' | 'altName' | 'abbrev'`
129
+ - `displayValue` - `'GMT' | 'UTC'`
129
130
  - `timezones` - `Record<string,string>`
130
131
  ```
131
132
  timezones={{
package/dist/index.cjs CHANGED
@@ -105,10 +105,10 @@ var allTimezones = {
105
105
  "Europe/Bucharest": "Bucharest",
106
106
  "Africa/Cairo": "Cairo",
107
107
  "Europe/Helsinki": "Helsinki, Kyiv, Riga, Sofia, Tallinn, Vilnius",
108
- "Europe/Athens": "Athens, Minsk",
108
+ "Europe/Athens": "Athens",
109
109
  "Asia/Jerusalem": "Jerusalem",
110
110
  "Africa/Harare": "Harare, Pretoria",
111
- "Europe/Moscow": "Istanbul, Moscow, St. Petersburg, Volgograd",
111
+ "Europe/Moscow": "Istanbul, Minsk, Moscow, St. Petersburg, Volgograd",
112
112
  "Asia/Kuwait": "Kuwait, Riyadh",
113
113
  "Africa/Nairobi": "Nairobi",
114
114
  "Asia/Baghdad": "Baghdad",
@@ -153,6 +153,7 @@ var timezone_list_default = allTimezones;
153
153
  function useTimezoneSelect({
154
154
  timezones = timezone_list_default,
155
155
  labelStyle = "original",
156
+ displayValue = "GMT",
156
157
  maxAbbrLength = 4
157
158
  }) {
158
159
  const options = React.useMemo(() => {
@@ -171,7 +172,7 @@ function useTimezoneSelect({
171
172
  let altName = now.isDST() ? dstAltName : standardAltName;
172
173
  const min = tz.current.offset * 60;
173
174
  const hr = `${min / 60 ^ 0}:` + (min % 60 === 0 ? "00" : Math.abs(min % 60));
174
- const prefix = `(GMT${hr.includes("-") ? hr : `+${hr}`}) ${zone[1]}`;
175
+ const prefix = `(${displayValue}${hr.includes("-") ? hr : `+${hr}`}) ${zone[1]}`;
175
176
  switch (labelStyle) {
176
177
  case "original":
177
178
  label = prefix;
@@ -246,6 +247,7 @@ var TimezoneSelect = (_a) => {
246
247
  onBlur,
247
248
  onChange,
248
249
  labelStyle,
250
+ displayValue,
249
251
  maxAbbrLength,
250
252
  timezones
251
253
  } = _b, props = __objRest(_b, [
@@ -253,12 +255,14 @@ var TimezoneSelect = (_a) => {
253
255
  "onBlur",
254
256
  "onChange",
255
257
  "labelStyle",
258
+ "displayValue",
256
259
  "maxAbbrLength",
257
260
  "timezones"
258
261
  ]);
259
262
  const { options, parseTimezone } = useTimezoneSelect({
260
263
  timezones,
261
264
  labelStyle,
265
+ displayValue,
262
266
  maxAbbrLength
263
267
  });
264
268
  const handleChange = (tz) => {
package/dist/index.d.ts CHANGED
@@ -1,33 +1,35 @@
1
1
  import { Props as Props$1 } from 'react-select';
2
2
 
3
- type ICustomTimezone = {
3
+ declare type ICustomTimezone = {
4
4
  [key: string]: string;
5
5
  };
6
- type ILabelStyle = 'original' | 'altName' | 'abbrev';
7
- type ITimezoneOption = {
6
+ declare type ILabelStyle = 'original' | 'altName' | 'abbrev';
7
+ declare type IDisplayValue = 'GMT' | 'UTC';
8
+ declare type ITimezoneOption = {
8
9
  value: string;
9
10
  label: string;
10
11
  abbrev?: string;
11
12
  altName?: string;
12
13
  offset?: number;
13
14
  };
14
- type ITimezone = ITimezoneOption | string;
15
- type TimezoneSelectOptions = {
15
+ declare type ITimezone = ITimezoneOption | string;
16
+ declare type TimezoneSelectOptions = {
16
17
  labelStyle?: ILabelStyle;
18
+ displayValue?: IDisplayValue;
17
19
  timezones?: ICustomTimezone;
18
20
  maxAbbrLength?: number;
19
21
  };
20
- type Props = Omit<Props$1<ITimezone, false>, 'onChange'> & TimezoneSelectOptions & {
22
+ declare type Props = Omit<Props$1<ITimezone, false>, 'onChange'> & TimezoneSelectOptions & {
21
23
  value: ITimezone;
22
24
  onChange?: (timezone: ITimezoneOption) => void;
23
25
  };
24
26
 
25
27
  declare const allTimezones: ICustomTimezone;
26
28
 
27
- declare function useTimezoneSelect({ timezones, labelStyle, maxAbbrLength, }: TimezoneSelectOptions): {
29
+ declare function useTimezoneSelect({ timezones, labelStyle, displayValue, maxAbbrLength, }: TimezoneSelectOptions): {
28
30
  parseTimezone: (zone: ITimezone) => ITimezoneOption;
29
31
  options: ITimezoneOption[];
30
32
  };
31
- declare const TimezoneSelect: ({ value, onBlur, onChange, labelStyle, maxAbbrLength, timezones, ...props }: Props) => JSX.Element;
33
+ declare const TimezoneSelect: ({ value, onBlur, onChange, labelStyle, displayValue, maxAbbrLength, timezones, ...props }: Props) => JSX.Element;
32
34
 
33
35
  export { ILabelStyle, ITimezone, ITimezoneOption, Props, TimezoneSelectOptions, allTimezones, TimezoneSelect as default, useTimezoneSelect };
package/dist/index.js CHANGED
@@ -73,10 +73,10 @@ var allTimezones = {
73
73
  "Europe/Bucharest": "Bucharest",
74
74
  "Africa/Cairo": "Cairo",
75
75
  "Europe/Helsinki": "Helsinki, Kyiv, Riga, Sofia, Tallinn, Vilnius",
76
- "Europe/Athens": "Athens, Minsk",
76
+ "Europe/Athens": "Athens",
77
77
  "Asia/Jerusalem": "Jerusalem",
78
78
  "Africa/Harare": "Harare, Pretoria",
79
- "Europe/Moscow": "Istanbul, Moscow, St. Petersburg, Volgograd",
79
+ "Europe/Moscow": "Istanbul, Minsk, Moscow, St. Petersburg, Volgograd",
80
80
  "Asia/Kuwait": "Kuwait, Riyadh",
81
81
  "Africa/Nairobi": "Nairobi",
82
82
  "Asia/Baghdad": "Baghdad",
@@ -121,6 +121,7 @@ var timezone_list_default = allTimezones;
121
121
  function useTimezoneSelect({
122
122
  timezones = timezone_list_default,
123
123
  labelStyle = "original",
124
+ displayValue = "GMT",
124
125
  maxAbbrLength = 4
125
126
  }) {
126
127
  const options = React.useMemo(() => {
@@ -139,7 +140,7 @@ function useTimezoneSelect({
139
140
  let altName = now.isDST() ? dstAltName : standardAltName;
140
141
  const min = tz.current.offset * 60;
141
142
  const hr = `${min / 60 ^ 0}:` + (min % 60 === 0 ? "00" : Math.abs(min % 60));
142
- const prefix = `(GMT${hr.includes("-") ? hr : `+${hr}`}) ${zone[1]}`;
143
+ const prefix = `(${displayValue}${hr.includes("-") ? hr : `+${hr}`}) ${zone[1]}`;
143
144
  switch (labelStyle) {
144
145
  case "original":
145
146
  label = prefix;
@@ -214,6 +215,7 @@ var TimezoneSelect = (_a) => {
214
215
  onBlur,
215
216
  onChange,
216
217
  labelStyle,
218
+ displayValue,
217
219
  maxAbbrLength,
218
220
  timezones
219
221
  } = _b, props = __objRest(_b, [
@@ -221,12 +223,14 @@ var TimezoneSelect = (_a) => {
221
223
  "onBlur",
222
224
  "onChange",
223
225
  "labelStyle",
226
+ "displayValue",
224
227
  "maxAbbrLength",
225
228
  "timezones"
226
229
  ]);
227
230
  const { options, parseTimezone } = useTimezoneSelect({
228
231
  timezones,
229
232
  labelStyle,
233
+ displayValue,
230
234
  maxAbbrLength
231
235
  });
232
236
  const handleChange = (tz) => {
package/package.json CHANGED
@@ -1,20 +1,7 @@
1
1
  {
2
2
  "name": "react-timezone-select",
3
- "version": "2.1.1",
3
+ "version": "2.1.2",
4
4
  "description": "Usable, dynamic React Timezone Select",
5
- "scripts": {
6
- "dev": "concurrently \"tsup src/index.tsx --format esm --watch\" \"cd example && pnpm dev\"",
7
- "prepublishOnly": "pnpm run build",
8
- "postpublish": "pnpm run build:example && npm run deploy",
9
- "build": "tsup src/index.tsx --format cjs,esm --dts",
10
- "build:example": "cd example && pnpm run build",
11
- "deploy": "gh-pages -d example/dist",
12
- "pretest": "pnpm run build",
13
- "test": "jest",
14
- "test:watch": "jest --watch",
15
- "test:ci": "pnpm run build && jest --ci ",
16
- "tsc": "tsc"
17
- },
18
5
  "author": "Nico Domino <yo@ndo.dev>",
19
6
  "homepage": "https://github.com/ndom91/react-timezone-select",
20
7
  "repository": {
@@ -114,5 +101,16 @@
114
101
  "*.{js,jsx}": [
115
102
  "eslint --fix"
116
103
  ]
104
+ },
105
+ "scripts": {
106
+ "dev": "concurrently \"tsup src/index.tsx --format esm --watch\" \"cd example && pnpm dev\"",
107
+ "build": "tsup src/index.tsx --format cjs,esm --dts",
108
+ "build:example": "cd example && pnpm run build",
109
+ "deploy": "gh-pages -d example/dist",
110
+ "pretest": "pnpm run build",
111
+ "test": "jest",
112
+ "test:watch": "jest --watch",
113
+ "test:ci": "pnpm run build && jest --ci ",
114
+ "tsc": "tsc"
117
115
  }
118
- }
116
+ }
package/dist/index.html DELETED
@@ -1,43 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
-
4
- <head>
5
- <meta charset="utf-8">
6
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
7
- <meta name="theme-color" content="#000000">
8
- <!--
9
- manifest.json provides metadata used when your web app is added to the
10
- homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
11
- -->
12
- <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
13
- <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
14
- <!--
15
- Notice the use of %PUBLIC_URL% in the tags above.
16
- It will be replaced with the URL of the `public` folder during the build.
17
- Only files inside the `public` folder can be referenced from the HTML.
18
-
19
- Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
20
- work correctly both with client-side routing and a non-root public URL.
21
- Learn how to configure a non-root public URL by running `npm run build`.
22
- -->
23
- <title>React App</title>
24
- </head>
25
-
26
- <body>
27
- <noscript>
28
- You need to enable JavaScript to run this app.
29
- </noscript>
30
- <div id="root"></div>
31
- <!--
32
- This HTML file is a template.
33
- If you open it directly in the browser, you will see an empty page.
34
-
35
- You can add webfonts, meta tags, or analytics to this file.
36
- The build step will place the bundled scripts into the <body> tag.
37
-
38
- To begin the development, run `npm start` or `yarn start`.
39
- To create a production bundle, use `npm run build` or `yarn build`.
40
- -->
41
- </body>
42
-
43
- </html>
package/dist/styles.css DELETED
@@ -1,26 +0,0 @@
1
- * {
2
- font-family: Helvetica;
3
- }
4
-
5
- .App {
6
- display: flex;
7
- align-items: center;
8
- flex-direction: column;
9
- }
10
-
11
- .select-wrapper {
12
- margin-top: 50px;
13
- width: 500px;
14
- }
15
-
16
- .code,
17
- .code span {
18
- background-color: #efefef;
19
- font-family: monospace;
20
- }
21
-
22
- .code {
23
- padding: 10px;
24
- line-height: 2;
25
- font-size: 1.4rem;
26
- }