@itwin/components-react 4.1.0-dev.1 → 4.2.0-dev.1

package/lib/esm/components-react/converters/TypeConverterManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"TypeConverterManager.js","sourceRoot":"","sources":["../../../../src/components-react/converters/TypeConverterManager.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAIH;;;GAGG;AACH,MAAa,oBAAoB;IAIvB,MAAM,CAAC,oBAAoB,CAAC,QAAgB,EAAE,aAAsB;QAC1E,IAAI,iBAAiB,GAAG,QAAQ,CAAC;QACjC,IAAI,aAAa;YACf,iBAAiB,IAAI,IAAI,aAAa,EAAE,CAAC;QAC3C,OAAO,iBAAiB,CAAC;IAC3B,CAAC;IAEM,MAAM,CAAC,iBAAiB,CAAC,QAAgB,EAAE,SAAkC,EAAE,aAAsB;QAC1G,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,oBAAoB,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;QAE7F,IAAI,oBAAoB,CAAC,WAAW,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE;YACtE,MAAM,eAAe,GAAG,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC;YAC7F,MAAM,KAAK,CAAC,uDAAuD,QAAQ,4BAA4B,eAAe,GAAG,CAAC,CAAC;SAC5H;QAED,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;QACjC,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,GAAG,QAAQ,CAAC;IACjE,CAAC;IAEM,MAAM,CAAC,mBAAmB,CAAC,QAAgB,EAAE,aAAsB;QACxE,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,oBAAoB,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;QAE7F,uBAAuB;QACvB,IAAI,oBAAoB,CAAC,WAAW,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE;YACtE,OAAO,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;SAC5D;IACH,CAAC;IAEM,MAAM,CAAC,YAAY,CAAC,QAAgB,EAAE,aAAsB;QACjE,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,oBAAoB,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;QAE7F,IAAI,oBAAoB,CAAC,WAAW,CAAC,cAAc,CAAC,iBAAiB,CAAC;YACpE,OAAO,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QAE7D,IAAI,CAAC,oBAAoB,CAAC,qBAAqB,EAAE;YAC/C,MAAM,EAAE,mBAAmB,EAAE,GAAG,OAAO,CAAC,mCAAmC,CAAC,CAAC,CAAC,yDAAyD;YACvI,oBAAoB,CAAC,qBAAqB,GAAG,IAAI,mBAAmB,EAAE,CAAC;SACxE;QACD,OAAO,oBAAoB,CAAC,qBAAqB,CAAC;IACpD,CAAC;;AA1Cc,gCAAW,GAAyC,EAAE,CAAC;SAD3D,oBAAoB","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module TypeConverters\n */\n\nimport type { TypeConverter } from \"./TypeConverter\";\n\n/**\n * Manages Type Converters. Type Converters are registered with and obtained from the manager.\n * @public\n */\nexport class TypeConverterManager {\n  private static _converters: { [index: string]: (TypeConverter) } = {};\n  private static _defaultTypeConverter: TypeConverter;\n\n  private static getFullConverterName(typename: string, converterName?: string): string {\n    let fullConverterName = typename;\n    if (converterName)\n      fullConverterName += `:${converterName}`;\n    return fullConverterName;\n  }\n\n  public static registerConverter(typename: string, converter: new () => TypeConverter, converterName?: string): void {\n    const fullConverterName = TypeConverterManager.getFullConverterName(typename, converterName);\n\n    if (TypeConverterManager._converters.hasOwnProperty(fullConverterName)) {\n      const nameOfConverter = TypeConverterManager._converters[fullConverterName].constructor.name;\n      throw Error(`TypeConverterManager.registerConverter error: type '${typename}' already registered to '${nameOfConverter}'`);\n    }\n\n    const instance = new converter();\n    TypeConverterManager._converters[fullConverterName] = instance;\n  }\n\n  public static unregisterConverter(typename: string, converterName?: string): void {\n    const fullConverterName = TypeConverterManager.getFullConverterName(typename, converterName);\n\n    // istanbul ignore else\n    if (TypeConverterManager._converters.hasOwnProperty(fullConverterName)) {\n      delete TypeConverterManager._converters[fullConverterName];\n    }\n  }\n\n  public static getConverter(typename: string, converterName?: string): TypeConverter {\n    const fullConverterName = TypeConverterManager.getFullConverterName(typename, converterName);\n\n    if (TypeConverterManager._converters.hasOwnProperty(fullConverterName))\n      return TypeConverterManager._converters[fullConverterName];\n\n    if (!TypeConverterManager._defaultTypeConverter) {\n      const { StringTypeConverter } = require(\"../converters/StringTypeConverter\"); // eslint-disable-line @typescript-eslint/no-var-requires\n      TypeConverterManager._defaultTypeConverter = new StringTypeConverter();\n    }\n    return TypeConverterManager._defaultTypeConverter;\n  }\n}\n"]}
+{"version":3,"file":"TypeConverterManager.js","sourceRoot":"","sources":["../../../../src/components-react/converters/TypeConverterManager.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAIH;;;GAGG;AACH,MAAa,oBAAoB;IAIvB,MAAM,CAAC,oBAAoB,CACjC,QAAgB,EAChB,aAAsB;QAEtB,IAAI,iBAAiB,GAAG,QAAQ,CAAC;QACjC,IAAI,aAAa;YAAE,iBAAiB,IAAI,IAAI,aAAa,EAAE,CAAC;QAC5D,OAAO,iBAAiB,CAAC;IAC3B,CAAC;IAEM,MAAM,CAAC,iBAAiB,CAC7B,QAAgB,EAChB,SAAkC,EAClC,aAAsB;QAEtB,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,oBAAoB,CACjE,QAAQ,EACR,aAAa,CACd,CAAC;QAEF,IAAI,oBAAoB,CAAC,WAAW,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE;YACtE,MAAM,eAAe,GACnB,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC;YACvE,MAAM,KAAK,CACT,uDAAuD,QAAQ,4BAA4B,eAAe,GAAG,CAC9G,CAAC;SACH;QAED,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;QACjC,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,GAAG,QAAQ,CAAC;IACjE,CAAC;IAEM,MAAM,CAAC,mBAAmB,CAC/B,QAAgB,EAChB,aAAsB;QAEtB,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,oBAAoB,CACjE,QAAQ,EACR,aAAa,CACd,CAAC;QAEF,uBAAuB;QACvB,IAAI,oBAAoB,CAAC,WAAW,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE;YACtE,OAAO,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;SAC5D;IACH,CAAC;IAEM,MAAM,CAAC,YAAY,CACxB,QAAgB,EAChB,aAAsB;QAEtB,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,oBAAoB,CACjE,QAAQ,EACR,aAAa,CACd,CAAC;QAEF,IAAI,oBAAoB,CAAC,WAAW,CAAC,cAAc,CAAC,iBAAiB,CAAC;YACpE,OAAO,oBAAoB,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QAE7D,IAAI,CAAC,oBAAoB,CAAC,qBAAqB,EAAE;YAC/C,MAAM,EACJ,mBAAmB,GACpB,GAAG,OAAO,CAAC,mCAAmC,CAAC,CAAC,CAAC,yDAAyD;YAC3G,oBAAoB,CAAC,qBAAqB,GAAG,IAAI,mBAAmB,EAAE,CAAC;SACxE;QACD,OAAO,oBAAoB,CAAC,qBAAqB,CAAC;IACpD,CAAC;;AApEc,gCAAW,GAAuC,EAAE,CAAC;SADzD,oBAAoB","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module TypeConverters\n */\n\nimport type { TypeConverter } from \"./TypeConverter\";\n\n/**\n * Manages Type Converters. Type Converters are registered with and obtained from the manager.\n * @public\n */\nexport class TypeConverterManager {\n  private static _converters: { [index: string]: TypeConverter } = {};\n  private static _defaultTypeConverter: TypeConverter;\n\n  private static getFullConverterName(\n    typename: string,\n    converterName?: string\n  ): string {\n    let fullConverterName = typename;\n    if (converterName) fullConverterName += `:${converterName}`;\n    return fullConverterName;\n  }\n\n  public static registerConverter(\n    typename: string,\n    converter: new () => TypeConverter,\n    converterName?: string\n  ): void {\n    const fullConverterName = TypeConverterManager.getFullConverterName(\n      typename,\n      converterName\n    );\n\n    if (TypeConverterManager._converters.hasOwnProperty(fullConverterName)) {\n      const nameOfConverter =\n        TypeConverterManager._converters[fullConverterName].constructor.name;\n      throw Error(\n        `TypeConverterManager.registerConverter error: type '${typename}' already registered to '${nameOfConverter}'`\n      );\n    }\n\n    const instance = new converter();\n    TypeConverterManager._converters[fullConverterName] = instance;\n  }\n\n  public static unregisterConverter(\n    typename: string,\n    converterName?: string\n  ): void {\n    const fullConverterName = TypeConverterManager.getFullConverterName(\n      typename,\n      converterName\n    );\n\n    // istanbul ignore else\n    if (TypeConverterManager._converters.hasOwnProperty(fullConverterName)) {\n      delete TypeConverterManager._converters[fullConverterName];\n    }\n  }\n\n  public static getConverter(\n    typename: string,\n    converterName?: string\n  ): TypeConverter {\n    const fullConverterName = TypeConverterManager.getFullConverterName(\n      typename,\n      converterName\n    );\n\n    if (TypeConverterManager._converters.hasOwnProperty(fullConverterName))\n      return TypeConverterManager._converters[fullConverterName];\n\n    if (!TypeConverterManager._defaultTypeConverter) {\n      const {\n        StringTypeConverter,\n      } = require(\"../converters/StringTypeConverter\"); // eslint-disable-line @typescript-eslint/no-var-requires\n      TypeConverterManager._defaultTypeConverter = new StringTypeConverter();\n    }\n    return TypeConverterManager._defaultTypeConverter;\n  }\n}\n"]}

package/lib/esm/components-react/converters/valuetypes/ConvertedTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConvertedTypes.d.ts","sourceRoot":"","sources":["../../../../../src/components-react/converters/valuetypes/ConvertedTypes.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEtD;;GAEG;AACH,yBAAiB,mBAAmB,CAAC;IAEnC;;OAEG;IACH,UAAiB,OAAO;QACtB,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;KACX;IAED;;OAEG;IACH,UAAiB,OAAQ,SAAQ,OAAO;QACtC,CAAC,EAAE,MAAM,CAAC;KACX;IAED;;OAEG;IACH,KAAY,KAAK,GAAG,OAAO,GAAG,OAAO,CAAC;IAEtC;;OAEG;IACH,KAAY,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,GAAG,UAAU,CAAC;CAC3E"}
+{"version":3,"file":"ConvertedTypes.d.ts","sourceRoot":"","sources":["../../../../../src/components-react/converters/valuetypes/ConvertedTypes.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEtD;;GAEG;AACH,yBAAiB,mBAAmB,CAAC;IACnC;;OAEG;IACH,UAAiB,OAAO;QACtB,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;KACX;IAED;;OAEG;IACH,UAAiB,OAAQ,SAAQ,OAAO;QACtC,CAAC,EAAE,MAAM,CAAC;KACX;IAED;;OAEG;IACH,KAAY,KAAK,GAAG,OAAO,GAAG,OAAO,CAAC;IAEtC;;OAEG;IACH,KAAY,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,GAAG,UAAU,CAAC;CAC3E"}

package/lib/esm/components-react/converters/valuetypes/ConvertedTypes.js

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 /** @packageDocumentation
  * @module TypeConverters
  */

package/lib/esm/components-react/converters/valuetypes/ConvertedTypes.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConvertedTypes.js","sourceRoot":"","sources":["../../../../../src/components-react/converters/valuetypes/ConvertedTypes.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module TypeConverters\n */\n\nimport type { Id64String } from \"@itwin/core-bentley\";\n\n/** Converted Primitives namespace\n * @public\n */\nexport namespace ConvertedPrimitives {\n\n  /** Interface for 2d Point\n   * @public\n   */\n  export interface Point2d {\n    x: number;\n    y: number;\n  }\n\n  /** Interface for 3d Point\n   * @public\n   */\n  export interface Point3d extends Point2d {\n    z: number;\n  }\n\n  /** Type definition for 2d or 3d Point\n   * @public\n   */\n  export type Point = Point2d | Point3d;\n\n  /** Type definition for Value\n   * @public\n   */\n  export type Value = boolean | number | string | Date | Point | Id64String;\n}\n"]}
+{"version":3,"file":"ConvertedTypes.js","sourceRoot":"","sources":["../../../../../src/components-react/converters/valuetypes/ConvertedTypes.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module TypeConverters\n */\n\nimport type { Id64String } from \"@itwin/core-bentley\";\n\n/** Converted Primitives namespace\n * @public\n */\nexport namespace ConvertedPrimitives {\n  /** Interface for 2d Point\n   * @public\n   */\n  export interface Point2d {\n    x: number;\n    y: number;\n  }\n\n  /** Interface for 3d Point\n   * @public\n   */\n  export interface Point3d extends Point2d {\n    z: number;\n  }\n\n  /** Type definition for 2d or 3d Point\n   * @public\n   */\n  export type Point = Point2d | Point3d;\n\n  /** Type definition for Value\n   * @public\n   */\n  export type Value = boolean | number | string | Date | Point | Id64String;\n}\n"]}

package/lib/esm/components-react/datepicker/DateField.d.ts

@@ -30,5 +30,5 @@ export declare function formatInputDate(inputDate: Date, timeDisplay?: TimeDispl
 /** Date input component. This component is typically used by the [[DatePickerPopupButton]] to display and edit date and time.
  * @internal
  */
-export declare function DateField({ initialDate, onDateChange, readOnly, dateFormatter, timeDisplay, style, className }: DateFieldProps): JSX.Element;
+export declare function DateField({ initialDate, onDateChange, readOnly, dateFormatter, timeDisplay, style, className, }: DateFieldProps): JSX.Element;
 //# sourceMappingURL=DateField.d.ts.map

package/lib/esm/components-react/datepicker/DateField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateField.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DateField.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,kBAAkB,CAAC;AAG1B,OAAO,KAAK,EAAE,aAAa,EAAC,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,mDAAmD;IACnD,WAAW,EAAE,IAAI,CAAC;IAClB,yDAAyD;IACzD,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC;kHAC8G;IAC9G,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,2JAA2J;IAC3J,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,IAAI,EAAE,WAAW,CAAC,EAAE,WAAW,EAAE,eAAe,CAAC,EAAE,aAAa,EAAE,mBAAmB,CAAC,EAAE,oBAAoB,GAAG,MAAM,GAAG,SAAS,CAgD3K;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,aAAa,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,cAAc,eAiE9H"}
+{"version":3,"file":"DateField.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DateField.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AAEH,OAAO,kBAAkB,CAAC;AAG1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIrD;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,mDAAmD;IACnD,WAAW,EAAE,IAAI,CAAC;IAClB,yDAAyD;IACzD,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC;kHAC8G;IAC9G,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qEAAqE;IACrE,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,2JAA2J;IAC3J,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAC7B,SAAS,EAAE,IAAI,EACf,WAAW,CAAC,EAAE,WAAW,EACzB,eAAe,CAAC,EAAE,aAAa,EAC/B,mBAAmB,CAAC,EAAE,oBAAoB,GACzC,MAAM,GAAG,SAAS,CAoEpB;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EACxB,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,WAAW,EACX,KAAK,EACL,SAAS,GACV,EAAE,cAAc,eAgGhB"}

package/lib/esm/components-react/datepicker/DateField.js

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 /** @packageDocumentation
  * @module Date
  */
@@ -36,24 +36,46 @@ export function formatInputDate(inputDate, timeDisplay, customFormatter, alterna
         }
     }
     else {
-        const dateString = inputDate.toLocaleDateString(undefined, { day: "2-digit", month: "2-digit", year: "numeric" });
+        const dateString = inputDate.toLocaleDateString(undefined, {
+            day: "2-digit",
+            month: "2-digit",
+            year: "numeric",
+        });
         let timeString = "";
         if (timeDisplay) {
             switch (timeDisplay) {
                 case TimeDisplay.H12MC:
-                    timeString = inputDate.toLocaleTimeString(undefined, { hour12: true, hour: "2-digit", minute: "2-digit" });
+                    timeString = inputDate.toLocaleTimeString(undefined, {
+                        hour12: true,
+                        hour: "2-digit",
+                        minute: "2-digit",
+                    });
                     break;
                 case TimeDisplay.H12MSC:
-                    timeString = (inputDate.toLocaleTimeString(undefined, { hour12: true, hour: "2-digit", minute: "2-digit", second: "2-digit" }));
+                    timeString = inputDate.toLocaleTimeString(undefined, {
+                        hour12: true,
+                        hour: "2-digit",
+                        minute: "2-digit",
+                        second: "2-digit",
+                    });
                     break;
                 case TimeDisplay.H24M:
-                    timeString = (inputDate.toLocaleTimeString(undefined, { hour12: false, hour: "2-digit", minute: "2-digit" }));
+                    timeString = inputDate.toLocaleTimeString(undefined, {
+                        hour12: false,
+                        hour: "2-digit",
+                        minute: "2-digit",
+                    });
                     // istanbul ignore next
                     if (timeString === "24:00")
                         timeString = "00:00";
                     break;
                 case TimeDisplay.H24MS:
-                    timeString = (inputDate.toLocaleTimeString(undefined, { hour12: false, hour: "2-digit", minute: "2-digit", second: "2-digit" }));
+                    timeString = inputDate.toLocaleTimeString(undefined, {
+                        hour12: false,
+                        hour: "2-digit",
+                        minute: "2-digit",
+                        second: "2-digit",
+                    });
                     // istanbul ignore next
                     if (timeString === "24:00:00")
                         timeString = "00:00:00";
@@ -66,7 +88,7 @@ export function formatInputDate(inputDate, timeDisplay, customFormatter, alterna
 /** Date input component. This component is typically used by the [[DatePickerPopupButton]] to display and edit date and time.
  * @internal
  */
-export function DateField({ initialDate, onDateChange, readOnly, dateFormatter, timeDisplay, style, className }) {
+export function DateField({ initialDate, onDateChange, readOnly, dateFormatter, timeDisplay, style, className, }) {
     const initialDateRef = React.useRef(initialDate);
     const [hasBadInput, setHasBadInput] = React.useState(false);
     const [inputValue, setInputValue] = React.useState(formatInputDate(initialDate, timeDisplay, dateFormatter));
@@ -125,6 +147,6 @@ export function DateField({ initialDate, onDateChange, readOnly, dateFormatter,
         }
     }
     const classNames = classnames(className, "components-date-input", hasBadInput && "components-date-has-error");
-    return React.createElement(Input, { "data-testid": "components-date-input", style: style, className: classNames, onKeyDown: onInputKeyDown, onBlur: handleOnBlur, onChange: handleInputChange, value: inputValue, disabled: readOnly || (dateFormatter && !(dateFormatter.parseDate)), size: "small" });
+    return (React.createElement(Input, { "data-testid": "components-date-input", style: style, className: classNames, onKeyDown: onInputKeyDown, onBlur: handleOnBlur, onChange: handleInputChange, value: inputValue, disabled: readOnly || (dateFormatter && !dateFormatter.parseDate), size: "small" }));
 }
 //# sourceMappingURL=DateField.js.map

package/lib/esm/components-react/datepicker/DateField.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DateField.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Date\n */\n\nimport \"./DateField.scss\";\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport type { DateFormatter} from \"@itwin/appui-abstract\";\nimport { AlternateDateFormats, TimeDisplay } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Input } from \"@itwin/itwinui-react\";\nimport { Logger } from \"@itwin/core-bentley\";\n\n/** Props for [[DateField]] Component.\n * @internal\n */\nexport interface DateFieldProps extends CommonProps {\n  /** Defines initial date and time for component. */\n  initialDate: Date;\n  /** Function to call when the date or time is changed. */\n  onDateChange?: (day: Date) => void;\n  /** Optional value to define if edit field allows editing. If a DateFormatter is provided\n   * it must provide a parseData function or the field will be read only no matter the setting of this value. */\n  readOnly?: boolean;\n  /** Optional date formatter that produces an explicit date display */\n  dateFormatter?: DateFormatter;\n  /** This property has two purposes, the first is specify that the display of time is desired and the second is to define the format of the time display. */\n  timeDisplay?: TimeDisplay;\n}\n\n/** Function to format a Date object that is used in control, type editor, and type converter\n * to produce a consistent formatted Date string.\n * @internal\n */\nexport function formatInputDate(inputDate: Date, timeDisplay?: TimeDisplay, customFormatter?: DateFormatter, alternateDateFormat?: AlternateDateFormats): string | undefined {\n  if (customFormatter) {\n    return customFormatter.formateDate(inputDate);\n  }\n\n  if (alternateDateFormat) {\n    switch (alternateDateFormat) {\n      case AlternateDateFormats.IsoDateTime:\n        return inputDate.toISOString();\n      case AlternateDateFormats.IsoShort:\n        return inputDate.toISOString().slice(0, 10);\n      case AlternateDateFormats.UtcDateTime:\n        return inputDate.toUTCString().slice(5);\n      case AlternateDateFormats.UtcShort:\n        return inputDate.toUTCString().slice(5, 16);\n      case AlternateDateFormats.UtcDateTimeWithDay:\n        return inputDate.toUTCString();\n      case AlternateDateFormats.UtcShortWithDay:\n        return inputDate.toUTCString().slice(0, 16);\n    }\n  } else {\n    const dateString = inputDate.toLocaleDateString(undefined, { day: \"2-digit\", month: \"2-digit\", year: \"numeric\" });\n    let timeString: string = \"\";\n\n    if (timeDisplay) {\n      switch (timeDisplay) {\n        case TimeDisplay.H12MC:\n          timeString = inputDate.toLocaleTimeString(undefined, { hour12: true, hour: \"2-digit\", minute: \"2-digit\" });\n          break;\n        case TimeDisplay.H12MSC:\n          timeString = (inputDate.toLocaleTimeString(undefined, { hour12: true, hour: \"2-digit\", minute: \"2-digit\", second: \"2-digit\" }));\n          break;\n        case TimeDisplay.H24M:\n          timeString = (inputDate.toLocaleTimeString(undefined, { hour12: false, hour: \"2-digit\", minute: \"2-digit\" }));\n          // istanbul ignore next\n          if (timeString === \"24:00\")\n            timeString = \"00:00\";\n          break;\n        case TimeDisplay.H24MS:\n          timeString = (inputDate.toLocaleTimeString(undefined, { hour12: false, hour: \"2-digit\", minute: \"2-digit\", second: \"2-digit\" }));\n          // istanbul ignore next\n          if (timeString === \"24:00:00\")\n            timeString = \"00:00:00\";\n          break;\n      }\n    }\n    return timeString.length ? `${dateString}, ${timeString}` : dateString;\n  }\n}\n\n/** Date input component. This component is typically used by the [[DatePickerPopupButton]] to display and edit date and time.\n * @internal\n */\nexport function DateField({ initialDate, onDateChange, readOnly, dateFormatter, timeDisplay, style, className }: DateFieldProps) {\n  const initialDateRef = React.useRef(initialDate);\n  const [hasBadInput, setHasBadInput] = React.useState(false);\n  const [inputValue, setInputValue] = React.useState(formatInputDate(initialDate, timeDisplay, dateFormatter));\n\n  // See if new initialDate props have changed since component mounted\n  React.useEffect(() => {\n    // istanbul ignore else\n    if (initialDate.getTime() !== initialDateRef.current.getTime()) {\n      initialDateRef.current = initialDate;\n    }\n    setInputValue(formatInputDate(initialDate, timeDisplay, dateFormatter));\n  }, [initialDate, dateFormatter, timeDisplay]);\n\n  const handleInputChange = React.useCallback((event: React.ChangeEvent<HTMLInputElement>) => {\n    setInputValue(event.currentTarget.value);\n  }, []);\n\n  const parseDate = React.useCallback((dateString: string) => {\n    try {\n      if (dateFormatter && dateFormatter.parseDate)\n        return dateFormatter.parseDate(dateString);\n\n      const newDateValue = Date.parse(dateString);\n      // istanbul ignore else\n      if (newDateValue)\n        return new Date(newDateValue);\n    } catch (_error) /* istanbul ignore next */ {\n      Logger.logInfo(\"DateField\", `Encountered error parsing input value '${dateString}' as a date.`);\n      return undefined;\n    }\n    // istanbul ignore next\n    return undefined;\n  }, [dateFormatter]);\n\n  const updateInputDate = React.useCallback((dateString: string) => {\n    try {\n      const newDateValue = parseDate(dateString);\n      if (newDateValue) {\n        const newDate = new Date(newDateValue);\n        onDateChange && onDateChange(newDate);\n        setHasBadInput(false);\n      } else {\n        setHasBadInput(true);\n      }\n    } catch (_error) {\n      // istanbul ignore next\n      setHasBadInput(true);\n    }\n  }, [onDateChange, parseDate]);\n\n  const handleOnBlur = React.useCallback((event: React.FocusEvent<HTMLInputElement>) => {\n    updateInputDate(event.target.value);\n  }, [updateInputDate]);\n\n  function onInputKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {\n    // istanbul ignore else\n    if (event.key === \"Enter\") {\n      updateInputDate(event.currentTarget.value);\n      event.preventDefault();\n    }\n  }\n  const classNames = classnames(className, \"components-date-input\", hasBadInput && \"components-date-has-error\");\n  return <Input data-testid=\"components-date-input\" style={style} className={classNames} onKeyDown={onInputKeyDown} onBlur={handleOnBlur}\n    onChange={handleInputChange} value={inputValue} disabled={readOnly || (dateFormatter && !(dateFormatter.parseDate))} size=\"small\" />;\n}\n"]}
+{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DateField.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Date\n */\n\nimport \"./DateField.scss\";\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport type { DateFormatter } from \"@itwin/appui-abstract\";\nimport { AlternateDateFormats, TimeDisplay } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Input } from \"@itwin/itwinui-react\";\nimport { Logger } from \"@itwin/core-bentley\";\n\n/** Props for [[DateField]] Component.\n * @internal\n */\nexport interface DateFieldProps extends CommonProps {\n  /** Defines initial date and time for component. */\n  initialDate: Date;\n  /** Function to call when the date or time is changed. */\n  onDateChange?: (day: Date) => void;\n  /** Optional value to define if edit field allows editing. If a DateFormatter is provided\n   * it must provide a parseData function or the field will be read only no matter the setting of this value. */\n  readOnly?: boolean;\n  /** Optional date formatter that produces an explicit date display */\n  dateFormatter?: DateFormatter;\n  /** This property has two purposes, the first is specify that the display of time is desired and the second is to define the format of the time display. */\n  timeDisplay?: TimeDisplay;\n}\n\n/** Function to format a Date object that is used in control, type editor, and type converter\n * to produce a consistent formatted Date string.\n * @internal\n */\nexport function formatInputDate(\n  inputDate: Date,\n  timeDisplay?: TimeDisplay,\n  customFormatter?: DateFormatter,\n  alternateDateFormat?: AlternateDateFormats\n): string | undefined {\n  if (customFormatter) {\n    return customFormatter.formateDate(inputDate);\n  }\n\n  if (alternateDateFormat) {\n    switch (alternateDateFormat) {\n      case AlternateDateFormats.IsoDateTime:\n        return inputDate.toISOString();\n      case AlternateDateFormats.IsoShort:\n        return inputDate.toISOString().slice(0, 10);\n      case AlternateDateFormats.UtcDateTime:\n        return inputDate.toUTCString().slice(5);\n      case AlternateDateFormats.UtcShort:\n        return inputDate.toUTCString().slice(5, 16);\n      case AlternateDateFormats.UtcDateTimeWithDay:\n        return inputDate.toUTCString();\n      case AlternateDateFormats.UtcShortWithDay:\n        return inputDate.toUTCString().slice(0, 16);\n    }\n  } else {\n    const dateString = inputDate.toLocaleDateString(undefined, {\n      day: \"2-digit\",\n      month: \"2-digit\",\n      year: \"numeric\",\n    });\n    let timeString: string = \"\";\n\n    if (timeDisplay) {\n      switch (timeDisplay) {\n        case TimeDisplay.H12MC:\n          timeString = inputDate.toLocaleTimeString(undefined, {\n            hour12: true,\n            hour: \"2-digit\",\n            minute: \"2-digit\",\n          });\n          break;\n        case TimeDisplay.H12MSC:\n          timeString = inputDate.toLocaleTimeString(undefined, {\n            hour12: true,\n            hour: \"2-digit\",\n            minute: \"2-digit\",\n            second: \"2-digit\",\n          });\n          break;\n        case TimeDisplay.H24M:\n          timeString = inputDate.toLocaleTimeString(undefined, {\n            hour12: false,\n            hour: \"2-digit\",\n            minute: \"2-digit\",\n          });\n          // istanbul ignore next\n          if (timeString === \"24:00\") timeString = \"00:00\";\n          break;\n        case TimeDisplay.H24MS:\n          timeString = inputDate.toLocaleTimeString(undefined, {\n            hour12: false,\n            hour: \"2-digit\",\n            minute: \"2-digit\",\n            second: \"2-digit\",\n          });\n          // istanbul ignore next\n          if (timeString === \"24:00:00\") timeString = \"00:00:00\";\n          break;\n      }\n    }\n    return timeString.length ? `${dateString}, ${timeString}` : dateString;\n  }\n}\n\n/** Date input component. This component is typically used by the [[DatePickerPopupButton]] to display and edit date and time.\n * @internal\n */\nexport function DateField({\n  initialDate,\n  onDateChange,\n  readOnly,\n  dateFormatter,\n  timeDisplay,\n  style,\n  className,\n}: DateFieldProps) {\n  const initialDateRef = React.useRef(initialDate);\n  const [hasBadInput, setHasBadInput] = React.useState(false);\n  const [inputValue, setInputValue] = React.useState(\n    formatInputDate(initialDate, timeDisplay, dateFormatter)\n  );\n\n  // See if new initialDate props have changed since component mounted\n  React.useEffect(() => {\n    // istanbul ignore else\n    if (initialDate.getTime() !== initialDateRef.current.getTime()) {\n      initialDateRef.current = initialDate;\n    }\n    setInputValue(formatInputDate(initialDate, timeDisplay, dateFormatter));\n  }, [initialDate, dateFormatter, timeDisplay]);\n\n  const handleInputChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      setInputValue(event.currentTarget.value);\n    },\n    []\n  );\n\n  const parseDate = React.useCallback(\n    (dateString: string) => {\n      try {\n        if (dateFormatter && dateFormatter.parseDate)\n          return dateFormatter.parseDate(dateString);\n\n        const newDateValue = Date.parse(dateString);\n        // istanbul ignore else\n        if (newDateValue) return new Date(newDateValue);\n      } catch (_error) /* istanbul ignore next */ {\n        Logger.logInfo(\n          \"DateField\",\n          `Encountered error parsing input value '${dateString}' as a date.`\n        );\n        return undefined;\n      }\n      // istanbul ignore next\n      return undefined;\n    },\n    [dateFormatter]\n  );\n\n  const updateInputDate = React.useCallback(\n    (dateString: string) => {\n      try {\n        const newDateValue = parseDate(dateString);\n        if (newDateValue) {\n          const newDate = new Date(newDateValue);\n          onDateChange && onDateChange(newDate);\n          setHasBadInput(false);\n        } else {\n          setHasBadInput(true);\n        }\n      } catch (_error) {\n        // istanbul ignore next\n        setHasBadInput(true);\n      }\n    },\n    [onDateChange, parseDate]\n  );\n\n  const handleOnBlur = React.useCallback(\n    (event: React.FocusEvent<HTMLInputElement>) => {\n      updateInputDate(event.target.value);\n    },\n    [updateInputDate]\n  );\n\n  function onInputKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {\n    // istanbul ignore else\n    if (event.key === \"Enter\") {\n      updateInputDate(event.currentTarget.value);\n      event.preventDefault();\n    }\n  }\n  const classNames = classnames(\n    className,\n    \"components-date-input\",\n    hasBadInput && \"components-date-has-error\"\n  );\n  return (\n    <Input\n      data-testid=\"components-date-input\"\n      style={style}\n      className={classNames}\n      onKeyDown={onInputKeyDown}\n      onBlur={handleOnBlur}\n      onChange={handleInputChange}\n      value={inputValue}\n      disabled={readOnly || (dateFormatter && !dateFormatter.parseDate)}\n      size=\"small\"\n    />\n  );\n}\n"]}

package/lib/esm/components-react/datepicker/DateField.scss

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 @import "~@itwin/core-react/lib/cjs/core-react/style/themecolors";
 @import "~@itwin/core-react/lib/cjs/core-react/inputs/variables";
 
@@ -20,4 +20,4 @@
     color: var(--buic-foreground-body);
     opacity: 0.65;
   }
-}
+}

package/lib/esm/components-react/datepicker/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePicker.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AASH,OAAO,mBAAmB,CAAC;AAY3B;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B,iCAAiC;IACjC,QAAQ,EAAE,IAAI,CAAC;IACf,qDAAqD;IACrD,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,eAuLhD"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePicker.tsx"],"names":[],"mappings":"AAIA;;GAEG;;AASH,OAAO,mBAAmB,CAAC;AAY3B;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B,iCAAiC;IACjC,QAAQ,EAAE,IAAI,CAAC;IACf,qDAAqD;IACrD,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,eA4ThD"}

package/lib/esm/components-react/datepicker/DatePicker.js

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 /** @packageDocumentation
  * @module Date
  */
@@ -92,7 +92,8 @@ export function DatePicker(props) {
     const setMonthAndYear = React.useCallback((newMonth, newYear) => {
         setDisplayedMonthIndex(newMonth);
         setDisplayedYear(newYear);
-        if (selectedDay.getFullYear() === newYear && selectedDay.getMonth() === newMonth) {
+        if (selectedDay.getFullYear() === newYear &&
+            selectedDay.getMonth() === newMonth) {
             setFocusedDay(new Date(selectedDay.getTime()));
         }
         else {
@@ -120,7 +121,7 @@ export function DatePicker(props) {
     const handleCalendarKeyDown = React.useCallback((event) => {
         if (event.key === SpecialKey.ArrowDown) {
             const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));
-            if ((focusedDayIndex + 7) > 41)
+            if (focusedDayIndex + 7 > 41)
                 setFocusedDay(days[focusedDayIndex % 7]);
             else
                 setFocusedDay(days[focusedDayIndex + 7]);
@@ -128,7 +129,7 @@ export function DatePicker(props) {
         }
         if (event.key === SpecialKey.ArrowUp) {
             const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));
-            if ((focusedDayIndex - 7) < 0)
+            if (focusedDayIndex - 7 < 0)
                 setFocusedDay(days[(focusedDayIndex % 7) + 35]);
             else
                 setFocusedDay(days[focusedDayIndex - 7]);
@@ -137,14 +138,14 @@ export function DatePicker(props) {
         if (event.key === SpecialKey.ArrowLeft) {
             const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));
             // istanbul ignore else
-            if ((focusedDayIndex - 1) >= 0)
+            if (focusedDayIndex - 1 >= 0)
                 setFocusedDay(days[focusedDayIndex - 1]);
             event.preventDefault();
         }
         if (event.key === SpecialKey.ArrowRight) {
             const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));
             // istanbul ignore else
-            if ((focusedDayIndex + 1) <= 41)
+            if (focusedDayIndex + 1 <= 41)
                 setFocusedDay(days[focusedDayIndex + 1]);
             event.preventDefault();
         }
@@ -166,11 +167,14 @@ export function DatePicker(props) {
                 displayedYear),
             React.createElement("button", { className: nextButtonClass, title: nextMonthLabel.current, onClick: handleMoveToNextMonth },
                 React.createElement(Icon, { iconSpec: React.createElement(SvgChevronRight, null) }))),
-        React.createElement("div", { className: "components-date-picker-calendar-header-weekdays" }, [0, 1, 2, 3, 4, 5, 6].map((dayOfWeek) => React.createElement("div", { key: `day-${dayOfWeek}`, className: "components-date-picker-calendar-header-day-short", title: daysLong.current[dayOfWeek] },
-            React.createElement("span", null, daysShort.current[dayOfWeek])))),
+        React.createElement("div", { className: "components-date-picker-calendar-header-weekdays" }, [0, 1, 2, 3, 4, 5, 6].map((dayOfWeek) => (React.createElement("div", { key: `day-${dayOfWeek}`, className: "components-date-picker-calendar-header-day-short", title: daysLong.current[dayOfWeek] },
+            React.createElement("span", null, daysShort.current[dayOfWeek]))))),
         React.createElement("ul", { tabIndex: 0, onKeyDown: handleCalendarKeyDown, "data-testid": "components-date-picker-calendar-list", className: calendarClass, role: "listbox" }, weeks.map((weekdays, weekIndex) => (React.createElement(React.Fragment, { key: `week-${weekIndex}` }, weekdays.map((day, dayIndex) => {
             const isActive = selectedDay && day && isSameDay(selectedDay, day);
-            const isFocused = focusedDay && day && isSameDay(focusedDay, day) && props.showFocusOutline;
+            const isFocused = focusedDay &&
+                day &&
+                isSameDay(focusedDay, day) &&
+                props.showFocusOutline;
             const isCurrentMonth = day.getMonth() === displayedMonthIndex;
             const classNames = classnames("components-date-picker-calendar-day", isActive && "selected", !isCurrentMonth && "notCurrentMonth", isFocused && "focused");
             const dateValue = day.getDate();

package/lib/esm/components-react/datepicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Date\n */\n\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { SpecialKey } from \"@itwin/appui-abstract\";\nimport { UiComponents } from \"../UiComponents\";\nimport { Icon } from \"@itwin/core-react\";\nimport { SvgChevronLeft, SvgChevronRight } from \"@itwin/itwinui-icons-react\";\n\nimport \"./DatePicker.scss\";\n\nfunction isSameDay(a: Date, b: Date) {\n  return (\n    a &&\n    b &&\n    a.getFullYear() === b.getFullYear() &&\n    a.getMonth() === b.getMonth() &&\n    a.getDate() === b.getDate()\n  );\n}\n\n/**\n * Props for [[DatePicker]] component.\n * @alpha\n */\nexport interface DatePickerProps {\n  /** defines both date and time */\n  selected: Date;\n  /** function to call when date or time has changed */\n  onDateChange?: (day: Date) => void;\n  /** show focus outlines, useful for keyboard navigation */\n  showFocusOutline?: boolean;\n}\n\n/** DatePicker component. Show a month selector and a day calendar to select a specific date.\n * @alpha\n */\nexport function DatePicker(props: DatePickerProps) {\n  const previousMonthLabel = React.useRef(UiComponents.localization.getLocalizedString(\"UiComponents:datepicker.previousMonth\"));\n  const nextMonthLabel = React.useRef(UiComponents.localization.getLocalizedString(\"UiComponents:datepicker.nextMonth\"));\n  const monthsLong = React.useRef([\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.january\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.february\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.march\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.april\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.may\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.june\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.july\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.august\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.september\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.october\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.november\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.december\"),\n  ]);\n\n  const daysLong = React.useRef([\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.long.sunday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.long.monday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.long.tuesday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.long.wednesday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.long.thursday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.long.friday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.long.saturday\"),\n  ]);\n\n  const daysShort = React.useRef([\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.short.sunday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.short.monday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.short.tuesday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.short.wednesday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.short.thursday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.short.friday\"),\n    UiComponents.localization.getLocalizedString(\"UiComponents:days.short.saturday\"),\n  ]);\n\n  const [selectedDay, setSelectedDay] = React.useState(new Date(props.selected.getTime()));\n  const [displayedMonthIndex, setDisplayedMonthIndex] = React.useState(selectedDay.getMonth());\n  const [displayedYear, setDisplayedYear] = React.useState(selectedDay.getFullYear());\n  const [focusedDay, setFocusedDay] = React.useState(selectedDay);\n  React.useEffect(() => {\n    const newSelectedDay = new Date(props.selected);\n    setSelectedDay(new Date(props.selected));\n    setDisplayedMonthIndex(newSelectedDay.getMonth());\n    setDisplayedYear(newSelectedDay.getFullYear());\n    setFocusedDay(newSelectedDay);\n  }, [props.selected]);\n  const days = React.useMemo(() => {\n    const msFirstDayOfMonth = new Date(displayedYear, displayedMonthIndex, 1).getTime();\n    let offsetToFirst = new Date(msFirstDayOfMonth).getDay();\n    if (0 === offsetToFirst)\n      offsetToFirst = 7;\n\n    const daysInMonth: Date[] = [];\n    // generate 6 weeks of dates\n    for (let i = 0; i < 42; i++) {\n      const adjustedDay = 1 + i - offsetToFirst;\n      daysInMonth.push(new Date(displayedYear, displayedMonthIndex, adjustedDay));\n    }\n    return daysInMonth;\n  }, [displayedMonthIndex, displayedYear]);\n\n  const weeks = React.useMemo(() => {\n    const weeksInMonth = [];\n    const weekCount = Math.ceil(days.length / 7);\n    for (let i = 0; i < weekCount; i++) {\n      weeksInMonth.push(days.slice(i * 7, (i + 1) * 7));\n    }\n    return weeksInMonth;\n  }, [days]);\n\n  const setMonthAndYear = React.useCallback((newMonth: number, newYear: number) => {\n    setDisplayedMonthIndex(newMonth);\n    setDisplayedYear(newYear);\n    if (selectedDay.getFullYear() === newYear && selectedDay.getMonth() === newMonth) {\n      setFocusedDay(new Date(selectedDay.getTime()));\n    } else {\n      const newFocusDay = new Date(focusedDay.getTime());\n      newFocusDay.setFullYear(newYear, newMonth, 1);\n      setFocusedDay(newFocusDay);\n    }\n  }, [focusedDay, selectedDay]);\n\n  const handleMoveToPreviousMonth = React.useCallback(() => {\n    const newMonth = displayedMonthIndex !== 0 ? displayedMonthIndex - 1 : 11;\n    const newYear = displayedMonthIndex !== 0 ? displayedYear : displayedYear - 1;\n    setMonthAndYear(newMonth, newYear);\n  }, [displayedMonthIndex, displayedYear, setMonthAndYear]);\n\n  const handleMoveToNextMonth = React.useCallback(() => {\n    const newMonth = displayedMonthIndex !== 11 ? displayedMonthIndex + 1 : 0;\n    const newYear = displayedMonthIndex !== 11 ? displayedYear : displayedYear + 1;\n    setMonthAndYear(newMonth, newYear);\n  }, [displayedMonthIndex, displayedYear, setMonthAndYear]);\n\n  // when invoked, it will return another function which can be used for the onClick React listener.\n  const handleOnDayChange = React.useCallback((day: Date) => () => {\n    setSelectedDay(day);\n    setFocusedDay(day);\n    props.onDateChange && props.onDateChange(day);\n  }, [props]);\n\n  const handleCalendarKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLUListElement>) => {\n    if (event.key === SpecialKey.ArrowDown) {\n      const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\n      if ((focusedDayIndex + 7) > 41)\n        setFocusedDay(days[focusedDayIndex % 7]);\n      else\n        setFocusedDay(days[focusedDayIndex + 7]);\n      event.preventDefault();\n    }\n    if (event.key === SpecialKey.ArrowUp) {\n      const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\n      if ((focusedDayIndex - 7) < 0)\n        setFocusedDay(days[(focusedDayIndex % 7) + 35]);\n      else\n        setFocusedDay(days[focusedDayIndex - 7]);\n      event.preventDefault();\n    }\n    if (event.key === SpecialKey.ArrowLeft) {\n      const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\n      // istanbul ignore else\n      if ((focusedDayIndex - 1) >= 0)\n        setFocusedDay(days[focusedDayIndex - 1]);\n      event.preventDefault();\n    }\n    if (event.key === SpecialKey.ArrowRight) {\n      const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\n      // istanbul ignore else\n      if ((focusedDayIndex + 1) <= 41)\n        setFocusedDay(days[focusedDayIndex + 1]);\n      event.preventDefault();\n    }\n    if (event.key === SpecialKey.Enter || event.key === SpecialKey.Space) {\n      handleOnDayChange(focusedDay)(); // NB: immediately call returned handler function\n      event.preventDefault();\n    }\n  }, [days, focusedDay, handleOnDayChange]);\n\n  const previousButtonClass = classnames(\"components-previous-month\", props.showFocusOutline && \"showFocusOutline\");\n  const nextButtonClass = classnames(\"components-next-month\", props.showFocusOutline && \"showFocusOutline\");\n  const calendarClass = classnames(\"components-date-picker-calendar-month\", props.showFocusOutline && \"showFocusOutline\");\n\n  return (\n    <div className=\"components-date-picker-calendar\">\n      <div className=\"components-date-picker-calendar-header-months\">\n        <button className={previousButtonClass} title={previousMonthLabel.current} onClick={handleMoveToPreviousMonth}>\n          <Icon iconSpec={<SvgChevronLeft />} />\n        </button>\n        <span className=\"components-month-year\">{monthsLong.current[displayedMonthIndex]} {displayedYear}</span>\n        <button className={nextButtonClass} title={nextMonthLabel.current} onClick={handleMoveToNextMonth}>\n          <Icon iconSpec={<SvgChevronRight />} />\n        </button>\n      </div>\n      <div className=\"components-date-picker-calendar-header-weekdays\">\n        {[0, 1, 2, 3, 4, 5, 6].map((dayOfWeek) =>\n          <div key={`day-${dayOfWeek}`} className=\"components-date-picker-calendar-header-day-short\"\n            title={daysLong.current[dayOfWeek]}><span>{daysShort.current[dayOfWeek]}</span></div>)}\n      </div>\n      <ul tabIndex={0} onKeyDown={handleCalendarKeyDown} data-testid=\"components-date-picker-calendar-list\" className={calendarClass} role=\"listbox\">\n        {weeks.map((weekdays, weekIndex) => (\n          <React.Fragment key={`week-${weekIndex}`}>\n            {weekdays.map((day: Date, dayIndex: number) => {\n              const isActive = selectedDay && day && isSameDay(selectedDay, day);\n              const isFocused = focusedDay && day && isSameDay(focusedDay, day) && props.showFocusOutline;\n              const isCurrentMonth = day.getMonth() === displayedMonthIndex;\n              const classNames = classnames(\"components-date-picker-calendar-day\", isActive && \"selected\", !isCurrentMonth && \"notCurrentMonth\", isFocused && \"focused\");\n              const dateValue = day.getDate();\n              return (\n                /* eslint-disable-next-line jsx-a11y/click-events-have-key-events */\n                <li className={classNames} key={`${displayedYear}.${displayedMonthIndex}.day.${dayIndex}`}\n                  onClick={handleOnDayChange(day)} role=\"option\" aria-selected={isActive} data-value={day.getTime()}>\n                  <span>{dateValue}</span>\n                </li>\n              );\n            })}\n          </React.Fragment>)\n        )}\n      </ul>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Date\n */\n\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { SpecialKey } from \"@itwin/appui-abstract\";\nimport { UiComponents } from \"../UiComponents\";\nimport { Icon } from \"@itwin/core-react\";\nimport { SvgChevronLeft, SvgChevronRight } from \"@itwin/itwinui-icons-react\";\n\nimport \"./DatePicker.scss\";\n\nfunction isSameDay(a: Date, b: Date) {\n  return (\n    a &&\n    b &&\n    a.getFullYear() === b.getFullYear() &&\n    a.getMonth() === b.getMonth() &&\n    a.getDate() === b.getDate()\n  );\n}\n\n/**\n * Props for [[DatePicker]] component.\n * @alpha\n */\nexport interface DatePickerProps {\n  /** defines both date and time */\n  selected: Date;\n  /** function to call when date or time has changed */\n  onDateChange?: (day: Date) => void;\n  /** show focus outlines, useful for keyboard navigation */\n  showFocusOutline?: boolean;\n}\n\n/** DatePicker component. Show a month selector and a day calendar to select a specific date.\n * @alpha\n */\nexport function DatePicker(props: DatePickerProps) {\n  const previousMonthLabel = React.useRef(\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:datepicker.previousMonth\"\n    )\n  );\n  const nextMonthLabel = React.useRef(\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:datepicker.nextMonth\"\n    )\n  );\n  const monthsLong = React.useRef([\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.january\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.february\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.march\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.april\"\n    ),\n    UiComponents.localization.getLocalizedString(\"UiComponents:month.long.may\"),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.june\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.july\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.august\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.september\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.october\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.november\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:month.long.december\"\n    ),\n  ]);\n\n  const daysLong = React.useRef([\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.long.sunday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.long.monday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.long.tuesday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.long.wednesday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.long.thursday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.long.friday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.long.saturday\"\n    ),\n  ]);\n\n  const daysShort = React.useRef([\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.short.sunday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.short.monday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.short.tuesday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.short.wednesday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.short.thursday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.short.friday\"\n    ),\n    UiComponents.localization.getLocalizedString(\n      \"UiComponents:days.short.saturday\"\n    ),\n  ]);\n\n  const [selectedDay, setSelectedDay] = React.useState(\n    new Date(props.selected.getTime())\n  );\n  const [displayedMonthIndex, setDisplayedMonthIndex] = React.useState(\n    selectedDay.getMonth()\n  );\n  const [displayedYear, setDisplayedYear] = React.useState(\n    selectedDay.getFullYear()\n  );\n  const [focusedDay, setFocusedDay] = React.useState(selectedDay);\n  React.useEffect(() => {\n    const newSelectedDay = new Date(props.selected);\n    setSelectedDay(new Date(props.selected));\n    setDisplayedMonthIndex(newSelectedDay.getMonth());\n    setDisplayedYear(newSelectedDay.getFullYear());\n    setFocusedDay(newSelectedDay);\n  }, [props.selected]);\n  const days = React.useMemo(() => {\n    const msFirstDayOfMonth = new Date(\n      displayedYear,\n      displayedMonthIndex,\n      1\n    ).getTime();\n    let offsetToFirst = new Date(msFirstDayOfMonth).getDay();\n    if (0 === offsetToFirst) offsetToFirst = 7;\n\n    const daysInMonth: Date[] = [];\n    // generate 6 weeks of dates\n    for (let i = 0; i < 42; i++) {\n      const adjustedDay = 1 + i - offsetToFirst;\n      daysInMonth.push(\n        new Date(displayedYear, displayedMonthIndex, adjustedDay)\n      );\n    }\n    return daysInMonth;\n  }, [displayedMonthIndex, displayedYear]);\n\n  const weeks = React.useMemo(() => {\n    const weeksInMonth = [];\n    const weekCount = Math.ceil(days.length / 7);\n    for (let i = 0; i < weekCount; i++) {\n      weeksInMonth.push(days.slice(i * 7, (i + 1) * 7));\n    }\n    return weeksInMonth;\n  }, [days]);\n\n  const setMonthAndYear = React.useCallback(\n    (newMonth: number, newYear: number) => {\n      setDisplayedMonthIndex(newMonth);\n      setDisplayedYear(newYear);\n      if (\n        selectedDay.getFullYear() === newYear &&\n        selectedDay.getMonth() === newMonth\n      ) {\n        setFocusedDay(new Date(selectedDay.getTime()));\n      } else {\n        const newFocusDay = new Date(focusedDay.getTime());\n        newFocusDay.setFullYear(newYear, newMonth, 1);\n        setFocusedDay(newFocusDay);\n      }\n    },\n    [focusedDay, selectedDay]\n  );\n\n  const handleMoveToPreviousMonth = React.useCallback(() => {\n    const newMonth = displayedMonthIndex !== 0 ? displayedMonthIndex - 1 : 11;\n    const newYear =\n      displayedMonthIndex !== 0 ? displayedYear : displayedYear - 1;\n    setMonthAndYear(newMonth, newYear);\n  }, [displayedMonthIndex, displayedYear, setMonthAndYear]);\n\n  const handleMoveToNextMonth = React.useCallback(() => {\n    const newMonth = displayedMonthIndex !== 11 ? displayedMonthIndex + 1 : 0;\n    const newYear =\n      displayedMonthIndex !== 11 ? displayedYear : displayedYear + 1;\n    setMonthAndYear(newMonth, newYear);\n  }, [displayedMonthIndex, displayedYear, setMonthAndYear]);\n\n  // when invoked, it will return another function which can be used for the onClick React listener.\n  const handleOnDayChange = React.useCallback(\n    (day: Date) => () => {\n      setSelectedDay(day);\n      setFocusedDay(day);\n      props.onDateChange && props.onDateChange(day);\n    },\n    [props]\n  );\n\n  const handleCalendarKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLUListElement>) => {\n      if (event.key === SpecialKey.ArrowDown) {\n        const focusedDayIndex = days.findIndex((day) =>\n          isSameDay(day, focusedDay)\n        );\n        if (focusedDayIndex + 7 > 41) setFocusedDay(days[focusedDayIndex % 7]);\n        else setFocusedDay(days[focusedDayIndex + 7]);\n        event.preventDefault();\n      }\n      if (event.key === SpecialKey.ArrowUp) {\n        const focusedDayIndex = days.findIndex((day) =>\n          isSameDay(day, focusedDay)\n        );\n        if (focusedDayIndex - 7 < 0)\n          setFocusedDay(days[(focusedDayIndex % 7) + 35]);\n        else setFocusedDay(days[focusedDayIndex - 7]);\n        event.preventDefault();\n      }\n      if (event.key === SpecialKey.ArrowLeft) {\n        const focusedDayIndex = days.findIndex((day) =>\n          isSameDay(day, focusedDay)\n        );\n        // istanbul ignore else\n        if (focusedDayIndex - 1 >= 0) setFocusedDay(days[focusedDayIndex - 1]);\n        event.preventDefault();\n      }\n      if (event.key === SpecialKey.ArrowRight) {\n        const focusedDayIndex = days.findIndex((day) =>\n          isSameDay(day, focusedDay)\n        );\n        // istanbul ignore else\n        if (focusedDayIndex + 1 <= 41) setFocusedDay(days[focusedDayIndex + 1]);\n        event.preventDefault();\n      }\n      if (event.key === SpecialKey.Enter || event.key === SpecialKey.Space) {\n        handleOnDayChange(focusedDay)(); // NB: immediately call returned handler function\n        event.preventDefault();\n      }\n    },\n    [days, focusedDay, handleOnDayChange]\n  );\n\n  const previousButtonClass = classnames(\n    \"components-previous-month\",\n    props.showFocusOutline && \"showFocusOutline\"\n  );\n  const nextButtonClass = classnames(\n    \"components-next-month\",\n    props.showFocusOutline && \"showFocusOutline\"\n  );\n  const calendarClass = classnames(\n    \"components-date-picker-calendar-month\",\n    props.showFocusOutline && \"showFocusOutline\"\n  );\n\n  return (\n    <div className=\"components-date-picker-calendar\">\n      <div className=\"components-date-picker-calendar-header-months\">\n        <button\n          className={previousButtonClass}\n          title={previousMonthLabel.current}\n          onClick={handleMoveToPreviousMonth}\n        >\n          <Icon iconSpec={<SvgChevronLeft />} />\n        </button>\n        <span className=\"components-month-year\">\n          {monthsLong.current[displayedMonthIndex]} {displayedYear}\n        </span>\n        <button\n          className={nextButtonClass}\n          title={nextMonthLabel.current}\n          onClick={handleMoveToNextMonth}\n        >\n          <Icon iconSpec={<SvgChevronRight />} />\n        </button>\n      </div>\n      <div className=\"components-date-picker-calendar-header-weekdays\">\n        {[0, 1, 2, 3, 4, 5, 6].map((dayOfWeek) => (\n          <div\n            key={`day-${dayOfWeek}`}\n            className=\"components-date-picker-calendar-header-day-short\"\n            title={daysLong.current[dayOfWeek]}\n          >\n            <span>{daysShort.current[dayOfWeek]}</span>\n          </div>\n        ))}\n      </div>\n      <ul\n        tabIndex={0}\n        onKeyDown={handleCalendarKeyDown}\n        data-testid=\"components-date-picker-calendar-list\"\n        className={calendarClass}\n        role=\"listbox\"\n      >\n        {weeks.map((weekdays, weekIndex) => (\n          <React.Fragment key={`week-${weekIndex}`}>\n            {weekdays.map((day: Date, dayIndex: number) => {\n              const isActive =\n                selectedDay && day && isSameDay(selectedDay, day);\n              const isFocused =\n                focusedDay &&\n                day &&\n                isSameDay(focusedDay, day) &&\n                props.showFocusOutline;\n              const isCurrentMonth = day.getMonth() === displayedMonthIndex;\n              const classNames = classnames(\n                \"components-date-picker-calendar-day\",\n                isActive && \"selected\",\n                !isCurrentMonth && \"notCurrentMonth\",\n                isFocused && \"focused\"\n              );\n              const dateValue = day.getDate();\n              return (\n                /* eslint-disable-next-line jsx-a11y/click-events-have-key-events */\n                <li\n                  className={classNames}\n                  key={`${displayedYear}.${displayedMonthIndex}.day.${dayIndex}`}\n                  onClick={handleOnDayChange(day)}\n                  role=\"option\"\n                  aria-selected={isActive}\n                  data-value={day.getTime()}\n                >\n                  <span>{dateValue}</span>\n                </li>\n              );\n            })}\n          </React.Fragment>\n        ))}\n      </ul>\n    </div>\n  );\n}\n"]}

package/lib/esm/components-react/datepicker/DatePickerPopupButton.d.ts

@@ -26,5 +26,5 @@ export interface DatePickerPopupButtonProps extends CommonProps {
 /** Component that displays a button used to pick a date and optionally a time.
  * @alpha
  * */
-export declare function DatePickerPopupButton({ displayEditField, timeDisplay, selected, onDateChange, dateFormatter, buttonToolTip, fieldStyle, fieldClassName, style }: DatePickerPopupButtonProps): JSX.Element;
+export declare function DatePickerPopupButton({ displayEditField, timeDisplay, selected, onDateChange, dateFormatter, buttonToolTip, fieldStyle, fieldClassName, style, }: DatePickerPopupButtonProps): JSX.Element;
 //# sourceMappingURL=DatePickerPopupButton.d.ts.map

package/lib/esm/components-react/datepicker/DatePickerPopupButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePickerPopupButton.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePickerPopupButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAExE,OAAO,KAAK,EAAE,WAAW,EAAC,MAAM,mBAAmB,CAAC;AAQpD,OAAO,8BAA8B,CAAC;AAEtC;YACY;AACZ,MAAM,WAAW,0BAA2B,SAAQ,WAAW;IAC7D,6CAA6C;IAC7C,QAAQ,EAAE,IAAI,CAAC;IACf,4EAA4E;IAC5E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,yCAAyC;IACzC,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,uBAAuB;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IAGvB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,8CAA8C;IAC9C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,yCAAyC;IACzC,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAClC;AAED;;KAEK;AACL,wBAAgB,qBAAqB,CAAC,EAAE,gBAAgB,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAC1G,aAAa,EAAE,UAAU,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,0BAA0B,eAkF/E"}
+{"version":3,"file":"DatePickerPopupButton.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePickerPopupButton.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAExE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAQrD,OAAO,8BAA8B,CAAC;AAEtC;YACY;AACZ,MAAM,WAAW,0BAA2B,SAAQ,WAAW;IAC7D,6CAA6C;IAC7C,QAAQ,EAAE,IAAI,CAAC;IACf,4EAA4E;IAC5E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,yCAAyC;IACzC,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,uBAAuB;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IAGvB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,8CAA8C;IAC9C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,yCAAyC;IACzC,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAClC;AAED;;KAEK;AACL,wBAAgB,qBAAqB,CAAC,EACpC,gBAAgB,EAChB,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,aAAa,EACb,aAAa,EACb,UAAU,EACV,cAAc,EACd,KAAK,GACN,EAAE,0BAA0B,eAoI5B"}

package/lib/esm/components-react/datepicker/DatePickerPopupButton.js

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 /** @packageDocumentation
  * @module Date
  */
@@ -17,12 +17,12 @@ import "./DatePickerPopupButton.scss";
 /** Component that displays a button used to pick a date and optionally a time.
  * @alpha
  * */
-export function DatePickerPopupButton({ displayEditField, timeDisplay, selected, onDateChange, dateFormatter, buttonToolTip, fieldStyle, fieldClassName, style }) {
+export function DatePickerPopupButton({ displayEditField, timeDisplay, selected, onDateChange, dateFormatter, buttonToolTip, fieldStyle, fieldClassName, style, }) {
     const [workingDate, setWorkingDate] = React.useState(new Date(selected.getTime()));
     const [isSettingsOpen, setIsSettingsOpen] = React.useState(false);
     const timeLabelRef = React.useRef(UiComponents.translate("datepicker.time"));
     const toolTipLabelRef = React.useRef(UiComponents.translate("datepicker.selectDate"));
-    const toolTipLabel = React.useMemo(() => buttonToolTip ? buttonToolTip : toolTipLabelRef.current, [buttonToolTip]);
+    const toolTipLabel = React.useMemo(() => (buttonToolTip ? buttonToolTip : toolTipLabelRef.current), [buttonToolTip]);
     // See if props have changed since component mounted
     React.useEffect(() => {
         const newWorkingDate = new Date(selected.getTime());
@@ -59,7 +59,11 @@ export function DatePickerPopupButton({ displayEditField, timeDisplay, selected,
             setIsSettingsOpen(true);
         }
     }, []);
-    const timeSpec = { hours: workingDate.getHours(), minutes: workingDate.getMinutes(), seconds: workingDate.getSeconds() };
+    const timeSpec = {
+        hours: workingDate.getHours(),
+        minutes: workingDate.getMinutes(),
+        seconds: workingDate.getSeconds(),
+    };
     return (React.createElement(React.Fragment, null,
         React.createElement("button", { title: toolTipLabel, style: style, className: "components-date-picker-calendar-popup-button", onKeyDown: handlePopupKeyDown, "data-testid": "components-date-picker-calendar-popup-button", onPointerDown: togglePopupDisplay, ref: buttonRef },
             React.createElement("div", { className: "datepicker-button" },
@@ -68,10 +72,9 @@ export function DatePickerPopupButton({ displayEditField, timeDisplay, selected,
         React.createElement(Popup, { isOpen: isSettingsOpen, position: RelativePosition.BottomLeft, onClose: handleCloseSetting, target: buttonRef.current, closeOnEnter: false, moveFocus: showFocusOutline, closeOnNestedPopupOutsideClick: true },
             React.createElement("div", { className: "components-date-picker-calendar-popup-panel", "data-testid": "components-date-picker-calendar-popup-panel" },
                 React.createElement(DatePicker, { selected: workingDate, onDateChange: handleOnDateChanged, showFocusOutline: showFocusOutline }),
-                timeDisplay &&
-                    React.createElement("div", { className: "time-container" },
-                        React.createElement(Text, { variant: "body", className: "time-label" }, timeLabelRef.current),
-                        React.createElement(TimeField, { time: timeSpec, timeDisplay: timeDisplay, onTimeChange: handleOnTimeChanged })))),
-        !!displayEditField && React.createElement(DateField, { style: fieldStyle, className: fieldClassName, initialDate: workingDate, timeDisplay: timeDisplay, dateFormatter: dateFormatter, onDateChange: handleOnDateChanged })));
+                timeDisplay && (React.createElement("div", { className: "time-container" },
+                    React.createElement(Text, { variant: "body", className: "time-label" }, timeLabelRef.current),
+                    React.createElement(TimeField, { time: timeSpec, timeDisplay: timeDisplay, onTimeChange: handleOnTimeChanged }))))),
+        !!displayEditField && (React.createElement(DateField, { style: fieldStyle, className: fieldClassName, initialDate: workingDate, timeDisplay: timeDisplay, dateFormatter: dateFormatter, onDateChange: handleOnDateChanged }))));
 }
 //# sourceMappingURL=DatePickerPopupButton.js.map

package/lib/esm/components-react/datepicker/DatePickerPopupButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePickerPopupButton.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePickerPopupButton.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAErE,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,8BAA8B,CAAC;AAwBtC;;KAEK;AACL,MAAM,UAAU,qBAAqB,CAAC,EAAE,gBAAgB,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAC1G,aAAa,EAAE,UAAU,EAAE,cAAc,EAAE,KAAK,EAA8B;IAC9E,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;IACnF,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClE,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAC7E,MAAM,eAAe,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,SAAS,CAAC,uBAAuB,CAAC,CAAC,CAAC;IACtF,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEnH,oDAAoD;IACpD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,cAAc,GAAG,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC;QACpD,cAAc,CAAC,cAAc,CAAC,CAAC;IACjC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAC;IACxD,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAAsD,EAAE,EAAE;QACtG,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,mBAAmB,CAAC,KAAK,CAAC,CAAC;QAC3B,iBAAiB,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QAChD,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,MAAM,mBAAmB,GAAG,CAAC,GAAS,EAAE,EAAE;QACxC,0CAA0C;QAC1C,MAAM,cAAc,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC;QAC/C,cAAc,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,EAAE,WAAW,CAAC,UAAU,EAAE,EAAE,WAAW,CAAC,UAAU,EAAE,CAAC,CAAC;QACpG,YAAY,IAAI,YAAY,CAAC,cAAc,CAAC,CAAC;QAC7C,CAAC,WAAW,IAAI,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,CAAC,IAAc,EAAE,EAAE;QAC7C,sCAAsC;QACtC,MAAM,cAAc,GAAG,IAAI,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC,CAAC;QACvD,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QAChE,cAAc,CAAC,cAAc,CAAC,CAAC;QAC/B,YAAY,IAAI,YAAY,CAAC,cAAc,CAAC,CAAC;IAC/C,CAAC,CAAC;IAEF,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtE,MAAM,kBAAkB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAA6C,EAAE,EAAE;QAC7F,uBAAuB;QACvB,IAAI,KAAK,CAAC,GAAG,KAAK,UAAU,CAAC,KAAK,EAAE;YAClC,mBAAmB,CAAC,IAAI,CAAC,CAAC;YAC1B,iBAAiB,CAAC,IAAI,CAAC,CAAC;SACzB;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,QAAQ,GAAa,EAAE,KAAK,EAAE,WAAW,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,WAAW,CAAC,UAAU,EAAE,EAAE,OAAO,EAAE,WAAW,CAAC,UAAU,EAAE,EAAE,CAAC;IACnI,OAAO,CACL;QACE,gCAAQ,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAC,8CAA8C,EAAC,SAAS,EAAE,kBAAkB,iBACnH,8CAA8C,EAAC,aAAa,EAAE,kBAAkB,EAAE,GAAG,EAAE,SAAS;YAC5G,6BAAK,SAAS,EAAC,mBAAmB;gBAChC,6BAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW;oBACzD,8BAAM,CAAC,EAAC,qHAAqH,GAAG,CAC5H,CACF,CACC;QACT,oBAAC,KAAK,IACJ,MAAM,EAAE,cAAc,EACtB,QAAQ,EAAE,gBAAgB,CAAC,UAAU,EACrC,OAAO,EAAE,kBAAkB,EAC3B,MAAM,EAAE,SAAS,CAAC,OAAO,EACzB,YAAY,EAAE,KAAK,EACnB,SAAS,EAAE,gBAAgB,EAC3B,8BAA8B;YAE9B,6BAAK,SAAS,EAAC,6CAA6C,iBAAa,6CAA6C;gBACpH,oBAAC,UAAU,IAAC,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,gBAAgB,GAAI;gBAC3G,WAAW;oBACV,6BAAK,SAAS,EAAC,gBAAgB;wBAC7B,oBAAC,IAAI,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,YAAY,IAAE,YAAY,CAAC,OAAO,CAAQ;wBACzE,oBAAC,SAAS,IAAC,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,mBAAmB,GAAI,CACtF,CAEJ,CACC;QACR,CAAC,CAAC,gBAAgB,IAAI,oBAAC,SAAS,IAAC,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,cAAc,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,aAAa,EAAE,aAAa,EAAE,YAAY,EAAE,mBAAmB,GAAI,CACtM,CACJ,CAAC;AACJ,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Date\n */\n\nimport * as React from \"react\";\nimport type { DateFormatter, TimeDisplay } from \"@itwin/appui-abstract\";\nimport { RelativePosition, SpecialKey } from \"@itwin/appui-abstract\";\nimport type { CommonProps} from \"@itwin/core-react\";\nimport { Popup } from \"@itwin/core-react\";\nimport { Text } from \"@itwin/itwinui-react\";\nimport { UiComponents } from \"../UiComponents\";\nimport { DatePicker } from \"./DatePicker\";\nimport { DateField } from \"./DateField\";\nimport type { TimeSpec } from \"./TimeField\";\nimport { TimeField } from \"./TimeField\";\nimport \"./DatePickerPopupButton.scss\";\n\n/** Props used by [[DatePickerPopupButton]] component.\n * @alpha */\nexport interface DatePickerPopupButtonProps extends CommonProps {\n  /** Date to be shown as the selected date. */\n  selected: Date;\n  /** If true show the date (and optionally time) edit field next to button */\n  displayEditField?: boolean;\n  // If defined show time in popup and also display time if input field is shown\n  timeDisplay?: TimeDisplay;\n  /** Function called when Date changes. */\n  onDateChange?: (day: Date) => void;\n  /** Optional tooltip */\n  buttonToolTip?: string;\n  /* Custom date formatter. WARNING: if used values will only be shown in specified format and will not be based on locale.\n   * If used the existence of a parseDate function will determine if the edit field allows editing. */\n  dateFormatter?: DateFormatter;\n  /** User defined class name for edit field. */\n  fieldClassName?: string;\n  /** User defined style for edit field. */\n  fieldStyle?: React.CSSProperties;\n}\n\n/** Component that displays a button used to pick a date and optionally a time.\n * @alpha\n * */\nexport function DatePickerPopupButton({ displayEditField, timeDisplay, selected, onDateChange, dateFormatter,\n  buttonToolTip, fieldStyle, fieldClassName, style }: DatePickerPopupButtonProps) {\n  const [workingDate, setWorkingDate] = React.useState(new Date(selected.getTime()));\n  const [isSettingsOpen, setIsSettingsOpen] = React.useState(false);\n  const timeLabelRef = React.useRef(UiComponents.translate(\"datepicker.time\"));\n  const toolTipLabelRef = React.useRef(UiComponents.translate(\"datepicker.selectDate\"));\n  const toolTipLabel = React.useMemo(() => buttonToolTip ? buttonToolTip : toolTipLabelRef.current, [buttonToolTip]);\n\n  // See if props have changed since component mounted\n  React.useEffect(() => {\n    const newWorkingDate = new Date(selected.getTime());\n    setWorkingDate(newWorkingDate);\n  }, [selected]);\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n  const togglePopupDisplay = React.useCallback((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n    event.preventDefault();\n    setShowFocusOutline(false);\n    setIsSettingsOpen((prev) => !prev);\n  }, [setIsSettingsOpen]);\n\n  const handleCloseSetting = React.useCallback(() => {\n    setIsSettingsOpen(false);\n  }, [setIsSettingsOpen]);\n\n  const handleOnDateChanged = (day: Date) => {\n    // combine current time into selected Date\n    const newWorkingDate = new Date(day.getTime());\n    newWorkingDate.setHours(workingDate.getHours(), workingDate.getMinutes(), workingDate.getSeconds());\n    onDateChange && onDateChange(newWorkingDate);\n    !timeDisplay && setIsSettingsOpen(false);\n  };\n\n  const handleOnTimeChanged = (time: TimeSpec) => {\n    // Combine new time into selected Date\n    const newWorkingDate = new Date(workingDate.getTime());\n    newWorkingDate.setHours(time.hours, time.minutes, time.seconds);\n    setWorkingDate(newWorkingDate);\n    onDateChange && onDateChange(newWorkingDate);\n  };\n\n  const [showFocusOutline, setShowFocusOutline] = React.useState(false);\n  const handlePopupKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLButtonElement>) => {\n    // istanbul ignore else\n    if (event.key === SpecialKey.Space) {\n      setShowFocusOutline(true);\n      setIsSettingsOpen(true);\n    }\n  }, []);\n\n  const timeSpec: TimeSpec = { hours: workingDate.getHours(), minutes: workingDate.getMinutes(), seconds: workingDate.getSeconds() };\n  return (\n    <>\n      <button title={toolTipLabel} style={style} className=\"components-date-picker-calendar-popup-button\" onKeyDown={handlePopupKeyDown}\n        data-testid=\"components-date-picker-calendar-popup-button\" onPointerDown={togglePopupDisplay} ref={buttonRef}>\n        <div className=\"datepicker-button\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\">\n            <path d=\"M13,13H9V10h4ZM16,3V15a1,1,0,0,1-1,1H1a1,1,0,0,1-1-1V3A1,1,0,0,1,1,2H3V0H4V2h8V0h1V2h2A1,1,0,0,1,16,3ZM15,6H1v9H15Z\" />\n          </svg>\n        </div>\n      </button>\n      <Popup\n        isOpen={isSettingsOpen}\n        position={RelativePosition.BottomLeft}\n        onClose={handleCloseSetting}\n        target={buttonRef.current}\n        closeOnEnter={false}\n        moveFocus={showFocusOutline}\n        closeOnNestedPopupOutsideClick\n      >\n        <div className=\"components-date-picker-calendar-popup-panel\" data-testid=\"components-date-picker-calendar-popup-panel\">\n          <DatePicker selected={workingDate} onDateChange={handleOnDateChanged} showFocusOutline={showFocusOutline} />\n          {timeDisplay &&\n            <div className=\"time-container\">\n              <Text variant=\"body\" className=\"time-label\">{timeLabelRef.current}</Text>\n              <TimeField time={timeSpec} timeDisplay={timeDisplay} onTimeChange={handleOnTimeChanged} />\n            </div>\n          }\n        </div>\n      </Popup >\n      {!!displayEditField && <DateField style={fieldStyle} className={fieldClassName} initialDate={workingDate} timeDisplay={timeDisplay} dateFormatter={dateFormatter} onDateChange={handleOnDateChanged} />}\n    </>\n  );\n}\n"]}
+{"version":3,"file":"DatePickerPopupButton.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePickerPopupButton.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Date\n */\n\nimport * as React from \"react\";\nimport type { DateFormatter, TimeDisplay } from \"@itwin/appui-abstract\";\nimport { RelativePosition, SpecialKey } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"@itwin/core-react\";\nimport { Popup } from \"@itwin/core-react\";\nimport { Text } from \"@itwin/itwinui-react\";\nimport { UiComponents } from \"../UiComponents\";\nimport { DatePicker } from \"./DatePicker\";\nimport { DateField } from \"./DateField\";\nimport type { TimeSpec } from \"./TimeField\";\nimport { TimeField } from \"./TimeField\";\nimport \"./DatePickerPopupButton.scss\";\n\n/** Props used by [[DatePickerPopupButton]] component.\n * @alpha */\nexport interface DatePickerPopupButtonProps extends CommonProps {\n  /** Date to be shown as the selected date. */\n  selected: Date;\n  /** If true show the date (and optionally time) edit field next to button */\n  displayEditField?: boolean;\n  // If defined show time in popup and also display time if input field is shown\n  timeDisplay?: TimeDisplay;\n  /** Function called when Date changes. */\n  onDateChange?: (day: Date) => void;\n  /** Optional tooltip */\n  buttonToolTip?: string;\n  /* Custom date formatter. WARNING: if used values will only be shown in specified format and will not be based on locale.\n   * If used the existence of a parseDate function will determine if the edit field allows editing. */\n  dateFormatter?: DateFormatter;\n  /** User defined class name for edit field. */\n  fieldClassName?: string;\n  /** User defined style for edit field. */\n  fieldStyle?: React.CSSProperties;\n}\n\n/** Component that displays a button used to pick a date and optionally a time.\n * @alpha\n * */\nexport function DatePickerPopupButton({\n  displayEditField,\n  timeDisplay,\n  selected,\n  onDateChange,\n  dateFormatter,\n  buttonToolTip,\n  fieldStyle,\n  fieldClassName,\n  style,\n}: DatePickerPopupButtonProps) {\n  const [workingDate, setWorkingDate] = React.useState(\n    new Date(selected.getTime())\n  );\n  const [isSettingsOpen, setIsSettingsOpen] = React.useState(false);\n  const timeLabelRef = React.useRef(UiComponents.translate(\"datepicker.time\"));\n  const toolTipLabelRef = React.useRef(\n    UiComponents.translate(\"datepicker.selectDate\")\n  );\n  const toolTipLabel = React.useMemo(\n    () => (buttonToolTip ? buttonToolTip : toolTipLabelRef.current),\n    [buttonToolTip]\n  );\n\n  // See if props have changed since component mounted\n  React.useEffect(() => {\n    const newWorkingDate = new Date(selected.getTime());\n    setWorkingDate(newWorkingDate);\n  }, [selected]);\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n  const togglePopupDisplay = React.useCallback(\n    (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n      event.preventDefault();\n      setShowFocusOutline(false);\n      setIsSettingsOpen((prev) => !prev);\n    },\n    [setIsSettingsOpen]\n  );\n\n  const handleCloseSetting = React.useCallback(() => {\n    setIsSettingsOpen(false);\n  }, [setIsSettingsOpen]);\n\n  const handleOnDateChanged = (day: Date) => {\n    // combine current time into selected Date\n    const newWorkingDate = new Date(day.getTime());\n    newWorkingDate.setHours(\n      workingDate.getHours(),\n      workingDate.getMinutes(),\n      workingDate.getSeconds()\n    );\n    onDateChange && onDateChange(newWorkingDate);\n    !timeDisplay && setIsSettingsOpen(false);\n  };\n\n  const handleOnTimeChanged = (time: TimeSpec) => {\n    // Combine new time into selected Date\n    const newWorkingDate = new Date(workingDate.getTime());\n    newWorkingDate.setHours(time.hours, time.minutes, time.seconds);\n    setWorkingDate(newWorkingDate);\n    onDateChange && onDateChange(newWorkingDate);\n  };\n\n  const [showFocusOutline, setShowFocusOutline] = React.useState(false);\n  const handlePopupKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      // istanbul ignore else\n      if (event.key === SpecialKey.Space) {\n        setShowFocusOutline(true);\n        setIsSettingsOpen(true);\n      }\n    },\n    []\n  );\n\n  const timeSpec: TimeSpec = {\n    hours: workingDate.getHours(),\n    minutes: workingDate.getMinutes(),\n    seconds: workingDate.getSeconds(),\n  };\n  return (\n    <>\n      <button\n        title={toolTipLabel}\n        style={style}\n        className=\"components-date-picker-calendar-popup-button\"\n        onKeyDown={handlePopupKeyDown}\n        data-testid=\"components-date-picker-calendar-popup-button\"\n        onPointerDown={togglePopupDisplay}\n        ref={buttonRef}\n      >\n        <div className=\"datepicker-button\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\">\n            <path d=\"M13,13H9V10h4ZM16,3V15a1,1,0,0,1-1,1H1a1,1,0,0,1-1-1V3A1,1,0,0,1,1,2H3V0H4V2h8V0h1V2h2A1,1,0,0,1,16,3ZM15,6H1v9H15Z\" />\n          </svg>\n        </div>\n      </button>\n      <Popup\n        isOpen={isSettingsOpen}\n        position={RelativePosition.BottomLeft}\n        onClose={handleCloseSetting}\n        target={buttonRef.current}\n        closeOnEnter={false}\n        moveFocus={showFocusOutline}\n        closeOnNestedPopupOutsideClick\n      >\n        <div\n          className=\"components-date-picker-calendar-popup-panel\"\n          data-testid=\"components-date-picker-calendar-popup-panel\"\n        >\n          <DatePicker\n            selected={workingDate}\n            onDateChange={handleOnDateChanged}\n            showFocusOutline={showFocusOutline}\n          />\n          {timeDisplay && (\n            <div className=\"time-container\">\n              <Text variant=\"body\" className=\"time-label\">\n                {timeLabelRef.current}\n              </Text>\n              <TimeField\n                time={timeSpec}\n                timeDisplay={timeDisplay}\n                onTimeChange={handleOnTimeChanged}\n              />\n            </div>\n          )}\n        </div>\n      </Popup>\n      {!!displayEditField && (\n        <DateField\n          style={fieldStyle}\n          className={fieldClassName}\n          initialDate={workingDate}\n          timeDisplay={timeDisplay}\n          dateFormatter={dateFormatter}\n          onDateChange={handleOnDateChanged}\n        />\n      )}\n    </>\n  );\n}\n"]}

package/lib/esm/components-react/datepicker/IntlFormatter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IntlFormatter.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/IntlFormatter.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE3D;;;;;;;GAOG;AACH,qBAAa,aAAc,YAAW,aAAa;IACrC,OAAO,CAAC,cAAc,CAAC;gBAAf,cAAc,CAAC,iCAAqB;IAGxD,IAAW,SAAS,IAAI,IAAI,CAAC,cAAc,CAiB1C;IAEM,WAAW,CAAC,GAAG,EAAE,IAAI;CAO7B"}
+{"version":3,"file":"IntlFormatter.d.ts","sourceRoot":"","sources":["../../../../src/components-react/datepicker/IntlFormatter.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE3D;;;;;;;GAOG;AACH,qBAAa,aAAc,YAAW,aAAa;IACrC,OAAO,CAAC,cAAc,CAAC;gBAAf,cAAc,CAAC,iCAAqB;IAExD,IAAW,SAAS,IAAI,IAAI,CAAC,cAAc,CAgB1C;IAEM,WAAW,CAAC,GAAG,EAAE,IAAI;CAO7B"}

package/lib/esm/components-react/datepicker/IntlFormatter.js

@@ -1,7 +1,7 @@
 /*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
 /** @packageDocumentation
  * @module Date
  */
@@ -21,15 +21,15 @@ export class IntlFormatter {
         if (!this._intlFormatter) {
             // https://tc39.es/ecma402/#sec-intl-datetimeformat-constructor
             this._intlFormatter = new Intl.DateTimeFormat(undefined, {
-                weekday: "short",
-                year: "numeric",
-                month: "2-digit",
-                day: "2-digit",
-                hour: "numeric",
+                weekday: "short" /* "narrow", "short", "long" */,
+                year: "numeric" /* "2-digit", "numeric" */,
+                month: "2-digit" /* "2-digit", "numeric", "narrow", "short", "long" */,
+                day: "2-digit" /* "2-digit", "numeric" */,
+                hour: "numeric" /* "2-digit", "numeric" */,
                 hour12: true,
-                minute: "numeric",
-                second: "numeric", /* "2-digit", "numeric" */
-                /* timeZoneName:	"short", */ /* "short", "long" */
+                minute: "numeric" /* "2-digit", "numeric" */,
+                second: "numeric" /* "2-digit", "numeric" */ /* "short", "long" */,
+                /* timeZoneName:	"short", */
             });
         }
         return this._intlFormatter;