npm - @itwin/components-react - Versions diffs - 4.0.0-dev.13 → 4.0.0-dev.15 - Mend

@itwin/components-react 4.0.0-dev.13 → 4.0.0-dev.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (459) hide show

package/lib/cjs/components-react/datepicker/DateField.js.map CHANGED Viewed

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

package/lib/cjs/components-react/datepicker/DateField.scss CHANGED Viewed

@@ -1,23 +1,23 @@
-/*---------------------------------------------------------------------------------------------
-* 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";
-.components-date-input {
-  width: auto;
-  &.components-date-has-error {
-    color: var(--iui-color-text-negative);
-  }
-  &.iui-input {
-    padding: $uicore-iui-input-padding;
-  }
-  &.iui-input[disabled] {
-    color: var(--buic-foreground-body);
-    opacity: 0.65;
-  }
+/*---------------------------------------------------------------------------------------------
+* 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";
+.components-date-input {
+  width: auto;
+  &.components-date-has-error {
+    color: var(--iui-color-text-negative);
+  }
+  &.iui-input {
+    padding: $uicore-iui-input-padding;
+  }
+  &.iui-input[disabled] {
+    color: var(--buic-foreground-body);
+    opacity: 0.65;
+  }
 }

package/lib/cjs/components-react/datepicker/DatePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePicker.tsx"],"names":[],"mappings":";AAAA;;;+FAG+F;AAC/F;;GAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEH,6CAA+B;AAC/B,4DAAoC;AACpC,0DAAmD;AACnD,kDAA+C;AAC/C,kDAAyC;AACzC,oEAA6E;AAE7E,6BAA2B;AAE3B,SAAS,SAAS,CAAC,CAAO,EAAE,CAAO;IACjC,OAAO,CACL,CAAC;QACD,CAAC;QACD,CAAC,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE;QACnC,CAAC,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,QAAQ,EAAE;QAC7B,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,OAAO,EAAE,CAC5B,CAAC;AACJ,CAAC;AAeD;;GAEG;AACH,SAAgB,UAAU,CAAC,KAAsB;IAC/C,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CAAC,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,uCAAuC,CAAC,CAAC,CAAC;IAC/H,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,mCAAmC,CAAC,CAAC,CAAC;IACvH,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC;QAC9B,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,iCAAiC,CAAC;QAC/E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC;QAChF,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,+BAA+B,CAAC;QAC7E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,+BAA+B,CAAC;QAC7E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,6BAA6B,CAAC;QAC3E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,8BAA8B,CAAC;QAC5E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,8BAA8B,CAAC;QAC5E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,gCAAgC,CAAC;QAC9E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,mCAAmC,CAAC;QACjF,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,iCAAiC,CAAC;QAC/E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC;QAChF,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC;KACjF,CAAC,CAAC;IAEH,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC;QAC5B,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,+BAA+B,CAAC;QAC7E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,+BAA+B,CAAC;QAC7E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,gCAAgC,CAAC;QAC9E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC;QAChF,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,iCAAiC,CAAC;QAC/E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,+BAA+B,CAAC;QAC7E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,iCAAiC,CAAC;KAChF,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC;QAC7B,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,gCAAgC,CAAC;QAC9E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,gCAAgC,CAAC;QAC9E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,iCAAiC,CAAC;QAC/E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,mCAAmC,CAAC;QACjF,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC;QAChF,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,gCAAgC,CAAC;QAC9E,2BAAY,CAAC,YAAY,CAAC,kBAAkB,CAAC,kCAAkC,CAAC;KACjF,CAAC,CAAC;IAEH,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;IACzF,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC7F,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,CAAC;IACpF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;IAChE,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,cAAc,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAChD,cAAc,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;QACzC,sBAAsB,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;QAClD,gBAAgB,CAAC,cAAc,CAAC,WAAW,EAAE,CAAC,CAAC;QAC/C,aAAa,CAAC,cAAc,CAAC,CAAC;IAChC,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IACrB,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC9B,MAAM,iBAAiB,GAAG,IAAI,IAAI,CAAC,aAAa,EAAE,mBAAmB,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC;QACpF,IAAI,aAAa,GAAG,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC,MAAM,EAAE,CAAC;QACzD,IAAI,CAAC,KAAK,aAAa;YACrB,aAAa,GAAG,CAAC,CAAC;QAEpB,MAAM,WAAW,GAAW,EAAE,CAAC;QAC/B,4BAA4B;QAC5B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,EAAE,EAAE;YAC3B,MAAM,WAAW,GAAG,CAAC,GAAG,CAAC,GAAG,aAAa,CAAC;YAC1C,WAAW,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,aAAa,EAAE,mBAAmB,EAAE,WAAW,CAAC,CAAC,CAAC;SAC7E;QACD,OAAO,WAAW,CAAC;IACrB,CAAC,EAAE,CAAC,mBAAmB,EAAE,aAAa,CAAC,CAAC,CAAC;IAEzC,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC/B,MAAM,YAAY,GAAG,EAAE,CAAC;QACxB,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC7C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,EAAE,CAAC,EAAE,EAAE;YAClC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;SACnD;QACD,OAAO,YAAY,CAAC;IACtB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,QAAgB,EAAE,OAAe,EAAE,EAAE;QAC9E,sBAAsB,CAAC,QAAQ,CAAC,CAAC;QACjC,gBAAgB,CAAC,OAAO,CAAC,CAAC;QAC1B,IAAI,WAAW,CAAC,WAAW,EAAE,KAAK,OAAO,IAAI,WAAW,CAAC,QAAQ,EAAE,KAAK,QAAQ,EAAE;YAChF,aAAa,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;SAChD;aAAM;YACL,MAAM,WAAW,GAAG,IAAI,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC;YACnD,WAAW,CAAC,WAAW,CAAC,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC;YAC9C,aAAa,CAAC,WAAW,CAAC,CAAC;SAC5B;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAE9B,MAAM,yBAAyB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACvD,MAAM,QAAQ,GAAG,mBAAmB,KAAK,CAAC,CAAC,CAAC,CAAC,mBAAmB,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAC1E,MAAM,OAAO,GAAG,mBAAmB,KAAK,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,GAAG,CAAC,CAAC;QAC9E,eAAe,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,mBAAmB,EAAE,aAAa,EAAE,eAAe,CAAC,CAAC,CAAC;IAE1D,MAAM,qBAAqB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACnD,MAAM,QAAQ,GAAG,mBAAmB,KAAK,EAAE,CAAC,CAAC,CAAC,mBAAmB,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC1E,MAAM,OAAO,GAAG,mBAAmB,KAAK,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,GAAG,CAAC,CAAC;QAC/E,eAAe,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,mBAAmB,EAAE,aAAa,EAAE,eAAe,CAAC,CAAC,CAAC;IAE1D,kGAAkG;IAClG,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,GAAS,EAAE,EAAE,CAAC,GAAG,EAAE;QAC9D,cAAc,CAAC,GAAG,CAAC,CAAC;QACpB,aAAa,CAAC,GAAG,CAAC,CAAC;QACnB,KAAK,CAAC,YAAY,IAAI,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC;IAChD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,qBAAqB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,KAA4C,EAAE,EAAE;QAC/F,IAAI,KAAK,CAAC,GAAG,KAAK,2BAAU,CAAC,SAAS,EAAE;YACtC,MAAM,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;YAC5E,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,GAAG,EAAE;gBAC5B,aAAa,CAAC,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC,CAAC;;gBAEzC,aAAa,CAAC,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC,CAAC;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;QACD,IAAI,KAAK,CAAC,GAAG,KAAK,2BAAU,CAAC,OAAO,EAAE;YACpC,MAAM,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;YAC5E,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,GAAG,CAAC;gBAC3B,aAAa,CAAC,IAAI,CAAC,CAAC,eAAe,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;;gBAEhD,aAAa,CAAC,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC,CAAC;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;QACD,IAAI,KAAK,CAAC,GAAG,KAAK,2BAAU,CAAC,SAAS,EAAE;YACtC,MAAM,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;YAC5E,uBAAuB;YACvB,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,IAAI,CAAC;gBAC5B,aAAa,CAAC,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC,CAAC;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;QACD,IAAI,KAAK,CAAC,GAAG,KAAK,2BAAU,CAAC,UAAU,EAAE;YACvC,MAAM,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;YAC5E,uBAAuB;YACvB,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,IAAI,EAAE;gBAC7B,aAAa,CAAC,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,CAAC,CAAC;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;QACD,IAAI,KAAK,CAAC,GAAG,KAAK,2BAAU,CAAC,KAAK,IAAI,KAAK,CAAC,GAAG,KAAK,2BAAU,CAAC,KAAK,EAAE;YACpE,iBAAiB,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,iDAAiD;YAClF,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAE1C,MAAM,mBAAmB,GAAG,IAAA,oBAAU,EAAC,2BAA2B,EAAE,KAAK,CAAC,gBAAgB,IAAI,kBAAkB,CAAC,CAAC;IAClH,MAAM,eAAe,GAAG,IAAA,oBAAU,EAAC,uBAAuB,EAAE,KAAK,CAAC,gBAAgB,IAAI,kBAAkB,CAAC,CAAC;IAC1G,MAAM,aAAa,GAAG,IAAA,oBAAU,EAAC,uCAAuC,EAAE,KAAK,CAAC,gBAAgB,IAAI,kBAAkB,CAAC,CAAC;IAExH,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,6BAAK,SAAS,EAAC,+CAA+C;YAC5D,gCAAQ,SAAS,EAAE,mBAAmB,EAAE,KAAK,EAAE,kBAAkB,CAAC,OAAO,EAAE,OAAO,EAAE,yBAAyB;gBAC3G,oBAAC,iBAAI,IAAC,QAAQ,EAAE,oBAAC,oCAAc,OAAG,GAAI,CAC/B;YACT,8BAAM,SAAS,EAAC,uBAAuB;gBAAE,UAAU,CAAC,OAAO,CAAC,mBAAmB,CAAC;;gBAAG,aAAa,CAAQ;YACxG,gCAAQ,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,cAAc,CAAC,OAAO,EAAE,OAAO,EAAE,qBAAqB;gBAC/F,oBAAC,iBAAI,IAAC,QAAQ,EAAE,oBAAC,qCAAe,OAAG,GAAI,CAChC,CACL;QACN,6BAAK,SAAS,EAAC,iDAAiD,IAC7D,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CACvC,6BAAK,GAAG,EAAE,OAAO,SAAS,EAAE,EAAE,SAAS,EAAC,kDAAkD,EACxF,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC;YAAE,kCAAO,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,CAAQ,CAAM,CAAC,CACtF;QACN,4BAAI,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,qBAAqB,iBAAc,sCAAsC,EAAC,SAAS,EAAE,aAAa,EAAE,IAAI,EAAC,SAAS,IAC3I,KAAK,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,CAAC,CAClC,oBAAC,KAAK,CAAC,QAAQ,IAAC,GAAG,EAAE,QAAQ,SAAS,EAAE,IACrC,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAS,EAAE,QAAgB,EAAE,EAAE;YAC5C,MAAM,QAAQ,GAAG,WAAW,IAAI,GAAG,IAAI,SAAS,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;YACnE,MAAM,SAAS,GAAG,UAAU,IAAI,GAAG,IAAI,SAAS,CAAC,UAAU,EAAE,GAAG,CAAC,IAAI,KAAK,CAAC,gBAAgB,CAAC;YAC5F,MAAM,cAAc,GAAG,GAAG,CAAC,QAAQ,EAAE,KAAK,mBAAmB,CAAC;YAC9D,MAAM,UAAU,GAAG,IAAA,oBAAU,EAAC,qCAAqC,EAAE,QAAQ,IAAI,UAAU,EAAE,CAAC,cAAc,IAAI,iBAAiB,EAAE,SAAS,IAAI,SAAS,CAAC,CAAC;YAC3J,MAAM,SAAS,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;YAChC,OAAO;YACL,oEAAoE;YACpE,4BAAI,SAAS,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,aAAa,IAAI,mBAAmB,QAAQ,QAAQ,EAAE,EACvF,OAAO,EAAE,iBAAiB,CAAC,GAAG,CAAC,EAAE,IAAI,EAAC,QAAQ,mBAAgB,QAAQ,gBAAc,GAAG,CAAC,OAAO,EAAE;gBACjG,kCAAO,SAAS,CAAQ,CACrB,CACN,CAAC;QACJ,CAAC,CAAC,CACa,CAAC,CACnB,CACE,CACD,CACP,CAAC;AACJ,CAAC;AAvLD,gCAuLC","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"]}
1	+ {"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["/---------------------------------------------------------------------------------------------\r\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n--------------------------------------------------------------------------------------------/\r\n/** @packageDocumentation\r\n * @module Date\r\n /\r\n\r\nimport as React from \"react\";\r\nimport classnames from \"classnames\";\r\nimport { SpecialKey } from \"@itwin/appui-abstract\";\r\nimport { UiComponents } from \"../UiComponents\";\r\nimport { Icon } from \"@itwin/core-react\";\r\nimport { SvgChevronLeft, SvgChevronRight } from \"@itwin/itwinui-icons-react\";\r\n\r\nimport \"./DatePicker.scss\";\r\n\r\nfunction isSameDay(a: Date, b: Date) {\r\n return (\r\n a &&\r\n b &&\r\n a.getFullYear() === b.getFullYear() &&\r\n a.getMonth() === b.getMonth() &&\r\n a.getDate() === b.getDate()\r\n );\r\n}\r\n\r\n/*\r\n Props for [[DatePicker]] component.\r\n * @alpha\r\n /\r\nexport interface DatePickerProps {\r\n /* defines both date and time /\r\n selected: Date;\r\n /* function to call when date or time has changed /\r\n onDateChange?: (day: Date) => void;\r\n /* show focus outlines, useful for keyboard navigation /\r\n showFocusOutline?: boolean;\r\n}\r\n\r\n/* DatePicker component. Show a month selector and a day calendar to select a specific date.\r\n * @alpha\r\n /\r\nexport function DatePicker(props: DatePickerProps) {\r\n const previousMonthLabel = React.useRef(UiComponents.localization.getLocalizedString(\"UiComponents:datepicker.previousMonth\"));\r\n const nextMonthLabel = React.useRef(UiComponents.localization.getLocalizedString(\"UiComponents:datepicker.nextMonth\"));\r\n const monthsLong = React.useRef([\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.january\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.february\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.march\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.april\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.may\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.june\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.july\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.august\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.september\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.october\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.november\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:month.long.december\"),\r\n ]);\r\n\r\n const daysLong = React.useRef([\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.long.sunday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.long.monday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.long.tuesday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.long.wednesday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.long.thursday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.long.friday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.long.saturday\"),\r\n ]);\r\n\r\n const daysShort = React.useRef([\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.short.sunday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.short.monday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.short.tuesday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.short.wednesday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.short.thursday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.short.friday\"),\r\n UiComponents.localization.getLocalizedString(\"UiComponents:days.short.saturday\"),\r\n ]);\r\n\r\n const [selectedDay, setSelectedDay] = React.useState(new Date(props.selected.getTime()));\r\n const [displayedMonthIndex, setDisplayedMonthIndex] = React.useState(selectedDay.getMonth());\r\n const [displayedYear, setDisplayedYear] = React.useState(selectedDay.getFullYear());\r\n const [focusedDay, setFocusedDay] = React.useState(selectedDay);\r\n React.useEffect(() => {\r\n const newSelectedDay = new Date(props.selected);\r\n setSelectedDay(new Date(props.selected));\r\n setDisplayedMonthIndex(newSelectedDay.getMonth());\r\n setDisplayedYear(newSelectedDay.getFullYear());\r\n setFocusedDay(newSelectedDay);\r\n }, [props.selected]);\r\n const days = React.useMemo(() => {\r\n const msFirstDayOfMonth = new Date(displayedYear, displayedMonthIndex, 1).getTime();\r\n let offsetToFirst = new Date(msFirstDayOfMonth).getDay();\r\n if (0 === offsetToFirst)\r\n offsetToFirst = 7;\r\n\r\n const daysInMonth: Date[] = [];\r\n // generate 6 weeks of dates\r\n for (let i = 0; i < 42; i++) {\r\n const adjustedDay = 1 + i - offsetToFirst;\r\n daysInMonth.push(new Date(displayedYear, displayedMonthIndex, adjustedDay));\r\n }\r\n return daysInMonth;\r\n }, [displayedMonthIndex, displayedYear]);\r\n\r\n const weeks = React.useMemo(() => {\r\n const weeksInMonth = [];\r\n const weekCount = Math.ceil(days.length / 7);\r\n for (let i = 0; i < weekCount; i++) {\r\n weeksInMonth.push(days.slice(i 7, (i + 1) * 7));\r\n }\r\n return weeksInMonth;\r\n }, [days]);\r\n\r\n const setMonthAndYear = React.useCallback((newMonth: number, newYear: number) => {\r\n setDisplayedMonthIndex(newMonth);\r\n setDisplayedYear(newYear);\r\n if (selectedDay.getFullYear() === newYear && selectedDay.getMonth() === newMonth) {\r\n setFocusedDay(new Date(selectedDay.getTime()));\r\n } else {\r\n const newFocusDay = new Date(focusedDay.getTime());\r\n newFocusDay.setFullYear(newYear, newMonth, 1);\r\n setFocusedDay(newFocusDay);\r\n }\r\n }, [focusedDay, selectedDay]);\r\n\r\n const handleMoveToPreviousMonth = React.useCallback(() => {\r\n const newMonth = displayedMonthIndex !== 0 ? displayedMonthIndex - 1 : 11;\r\n const newYear = displayedMonthIndex !== 0 ? displayedYear : displayedYear - 1;\r\n setMonthAndYear(newMonth, newYear);\r\n }, [displayedMonthIndex, displayedYear, setMonthAndYear]);\r\n\r\n const handleMoveToNextMonth = React.useCallback(() => {\r\n const newMonth = displayedMonthIndex !== 11 ? displayedMonthIndex + 1 : 0;\r\n const newYear = displayedMonthIndex !== 11 ? displayedYear : displayedYear + 1;\r\n setMonthAndYear(newMonth, newYear);\r\n }, [displayedMonthIndex, displayedYear, setMonthAndYear]);\r\n\r\n // when invoked, it will return another function which can be used for the onClick React listener.\r\n const handleOnDayChange = React.useCallback((day: Date) => () => {\r\n setSelectedDay(day);\r\n setFocusedDay(day);\r\n props.onDateChange && props.onDateChange(day);\r\n }, [props]);\r\n\r\n const handleCalendarKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLUListElement>) => {\r\n if (event.key === SpecialKey.ArrowDown) {\r\n const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\r\n if ((focusedDayIndex + 7) > 41)\r\n setFocusedDay(days[focusedDayIndex % 7]);\r\n else\r\n setFocusedDay(days[focusedDayIndex + 7]);\r\n event.preventDefault();\r\n }\r\n if (event.key === SpecialKey.ArrowUp) {\r\n const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\r\n if ((focusedDayIndex - 7) < 0)\r\n setFocusedDay(days[(focusedDayIndex % 7) + 35]);\r\n else\r\n setFocusedDay(days[focusedDayIndex - 7]);\r\n event.preventDefault();\r\n }\r\n if (event.key === SpecialKey.ArrowLeft) {\r\n const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\r\n // istanbul ignore else\r\n if ((focusedDayIndex - 1) >= 0)\r\n setFocusedDay(days[focusedDayIndex - 1]);\r\n event.preventDefault();\r\n }\r\n if (event.key === SpecialKey.ArrowRight) {\r\n const focusedDayIndex = days.findIndex((day) => isSameDay(day, focusedDay));\r\n // istanbul ignore else\r\n if ((focusedDayIndex + 1) <= 41)\r\n setFocusedDay(days[focusedDayIndex + 1]);\r\n event.preventDefault();\r\n }\r\n if (event.key === SpecialKey.Enter \|\| event.key === SpecialKey.Space) {\r\n handleOnDayChange(focusedDay)(); // NB: immediately call returned handler function\r\n event.preventDefault();\r\n }\r\n }, [days, focusedDay, handleOnDayChange]);\r\n\r\n const previousButtonClass = classnames(\"components-previous-month\", props.showFocusOutline && \"showFocusOutline\");\r\n const nextButtonClass = classnames(\"components-next-month\", props.showFocusOutline && \"showFocusOutline\");\r\n const calendarClass = classnames(\"components-date-picker-calendar-month\", props.showFocusOutline && \"showFocusOutline\");\r\n\r\n return (\r\n <div className=\"components-date-picker-calendar\">\r\n <div className=\"components-date-picker-calendar-header-months\">\r\n <button className={previousButtonClass} title={previousMonthLabel.current} onClick={handleMoveToPreviousMonth}>\r\n <Icon iconSpec={<SvgChevronLeft />} />\r\n </button>\r\n <span className=\"components-month-year\">{monthsLong.current[displayedMonthIndex]} {displayedYear}</span>\r\n <button className={nextButtonClass} title={nextMonthLabel.current} onClick={handleMoveToNextMonth}>\r\n <Icon iconSpec={<SvgChevronRight />} />\r\n </button>\r\n </div>\r\n <div className=\"components-date-picker-calendar-header-weekdays\">\r\n {[0, 1, 2, 3, 4, 5, 6].map((dayOfWeek) =>\r\n <div key={`day-${dayOfWeek}`} className=\"components-date-picker-calendar-header-day-short\"\r\n title={daysLong.current[dayOfWeek]}><span>{daysShort.current[dayOfWeek]}</span></div>)}\r\n </div>\r\n <ul tabIndex={0} onKeyDown={handleCalendarKeyDown} data-testid=\"components-date-picker-calendar-list\" className={calendarClass} role=\"listbox\">\r\n {weeks.map((weekdays, weekIndex) => (\r\n <React.Fragment key={`week-${weekIndex}`}>\r\n {weekdays.map((day: Date, dayIndex: number) => {\r\n const isActive = selectedDay && day && isSameDay(selectedDay, day);\r\n const isFocused = focusedDay && day && isSameDay(focusedDay, day) && props.showFocusOutline;\r\n const isCurrentMonth = day.getMonth() === displayedMonthIndex;\r\n const classNames = classnames(\"components-date-picker-calendar-day\", isActive && \"selected\", !isCurrentMonth && \"notCurrentMonth\", isFocused && \"focused\");\r\n const dateValue = day.getDate();\r\n return (\r\n /* eslint-disable-next-line jsx-a11y/click-events-have-key-events */\r\n <li className={classNames} key={`${displayedYear}.${displayedMonthIndex}.day.${dayIndex}`}\r\n onClick={handleOnDayChange(day)} role=\"option\" aria-selected={isActive} data-value={day.getTime()}>\r\n <span>{dateValue}</span>\r\n </li>\r\n );\r\n })}\r\n </React.Fragment>)\r\n )}\r\n </ul>\r\n </div>\r\n );\r\n}\r\n"]}

package/lib/cjs/components-react/datepicker/DatePicker.scss CHANGED Viewed

@@ -1,176 +1,176 @@
-/*---------------------------------------------------------------------------------------------
-* 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/style/opacity";
-@import "~@itwin/core-react/lib/cjs/core-react/icons/variables";
-$date-picker-m: 16px;
-$date-picker-icons-color-actionable: rgba(
-  $buic-foreground-body,
-  $uicore-opacity-2
-);
-$date-picker-icons-color-actionable-hover: rgba(
-  $buic-foreground-body,
-  $uicore-opacity-1
-);
-$date-picker-outside-month-color: var(--iui-color-text-disabled);
-$outline-size: 2px;
-.components-date-picker-calendar {
-  border-radius: var(--iui-border-radius-1) var(--iui-border-radius-1) 0 0;
-  background-color: $buic-background-control;
-  color: var(--iui-color-text);
-  font-size: 14px;
-  * {
-    box-sizing: border-box;
-  }
-  .components-date-picker-calendar-header-months {
-    display: inline-flex;
-    width: calc(100% - 12px);
-    align-items: center;
-    justify-content: space-between;
-    padding: 6px;
-    button.components-previous-month,
-    button.components-next-month {
-      background-color: $buic-background-control;
-      border: none;
-      cursor: pointer;
-      padding: 5px;
-      font-size: var(--iui-font-size-2);
-      user-select: none;
-      color: $date-picker-icons-color-actionable;
-      &:focus {
-        outline: 0px;
-        &.showFocusOutline {
-          outline: 0px;
-          border: 0px solid var(--iui-color-border-foreground);
-          border-radius: var(--iui-border-radius-1);
-          border-color: var(--buic-foreground-focus-border);
-          box-shadow: var(--buic-focus-boxshadow-gradient1) 0px 1px 1px,
-            var(--buic-focus-boxshadow-gradient2) 0px 0px 0px 2px;
-        }
-      }
-      &:hover {
-        color: var(--iui-color-text-accent);
-      }
-    }
-    .components-next-month {
-      text-align: right;
-    }
-    .components-month-year {
-      flex: 2;
-      font-weight: var(--iui-font-weight-bold);
-      text-align: center;
-    }
-  }
-  .components-date-picker-calendar-header-weekdays {
-    display: grid;
-    background-color: $buic-background-2;
-    padding-inline-start: 8px;
-    padding-inline-end: 8px;
-    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
-    align-items: center;
-    .components-date-picker-calendar-header-day-short {
-      text-align: center;
-      text-decoration: none;
-      font-weight: var(--iui-font-weight-bold);
-      height: 32px;
-      width: 32px;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-    }
-  }
-  ul.components-date-picker-calendar-month {
-    margin: 1px;
-    padding: 4px 5px;
-    list-style: none;
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
-    text-align: center;
-    align-items: center;
-    align-self: center;
-    &:focus {
-      outline: 0px;
-      &.showFocusOutline {
-        border: 0px solid var(--iui-color-border-foreground);
-        border-radius: var(--iui-border-radius-1);
-        border-color: var(--buic-foreground-focus-border);
-        box-shadow: var(--buic-focus-boxshadow-gradient1) 0px 1px 1px,
-          var(--buic-focus-boxshadow-gradient2) 0px 0px 0px 2px;
-        .components-date-picker-calendar-day.focused {
-          outline: 0px;
-          border: 1px solid var(--iui-color-border-foreground);
-          border-radius: var(--iui-border-radius-1);
-          border-color: var(--buic-foreground-focus-border);
-          box-shadow: var(--buic-focus-boxshadow-gradient1) 0px 1px 1px,
-            var(--buic-focus-boxshadow-gradient2) 0px 0px 0px 2px;
-          z-index: 1;
-        }
-      }
-    }
-    .components-date-picker-calendar-day {
-      box-sizing: border-box;
-      text-align: center;
-      white-space: nowrap;
-      cursor: pointer;
-      height: 32px;
-      width: 32px;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      &:focus {
-        outline: 0px;
-      }
-      &:hover:not(.selected) {
-        background-color: $buic-row-hover;
-        border-radius: var(--iui-border-radius-1);
-        font-weight: var(--iui-font-weight-semibold);
-      }
-      &.selected {
-        background-color: $buic-background-primary;
-        color: var(--iui-color-white);
-        font-weight: var(--iui-font-weight-semibold);
-        border-radius: var(--iui-border-radius-1);
-        &:hover {
-          background-color: $buic-row-hover;
-          color: var(--iui-color-text);
-        }
-      }
-      &.today {
-        background-color: rgba($buic-foreground-body, $uicore-opacity-6);
-        font-weight: var(--iui-font-weight-semibold);
-        border-radius: 50%;
-      }
-      &.notCurrentMonth {
-        &:not(.selected) {
-          color: $date-picker-outside-month-color;
-          font-weight: var(--iui-font-weight-light);
-        }
-      }
-    }
-  }
-}
+/*---------------------------------------------------------------------------------------------
+* 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/style/opacity";
+@import "~@itwin/core-react/lib/cjs/core-react/icons/variables";
+$date-picker-m: 16px;
+$date-picker-icons-color-actionable: rgba(
+  $buic-foreground-body,
+  $uicore-opacity-2
+);
+$date-picker-icons-color-actionable-hover: rgba(
+  $buic-foreground-body,
+  $uicore-opacity-1
+);
+$date-picker-outside-month-color: var(--iui-color-text-disabled);
+$outline-size: 2px;
+.components-date-picker-calendar {
+  border-radius: var(--iui-border-radius-1) var(--iui-border-radius-1) 0 0;
+  background-color: $buic-background-control;
+  color: var(--iui-color-text);
+  font-size: 14px;
+  * {
+    box-sizing: border-box;
+  }
+  .components-date-picker-calendar-header-months {
+    display: inline-flex;
+    width: calc(100% - 12px);
+    align-items: center;
+    justify-content: space-between;
+    padding: 6px;
+    button.components-previous-month,
+    button.components-next-month {
+      background-color: $buic-background-control;
+      border: none;
+      cursor: pointer;
+      padding: 5px;
+      font-size: var(--iui-font-size-2);
+      user-select: none;
+      color: $date-picker-icons-color-actionable;
+      &:focus {
+        outline: 0px;
+        &.showFocusOutline {
+          outline: 0px;
+          border: 0px solid var(--iui-color-border-foreground);
+          border-radius: var(--iui-border-radius-1);
+          border-color: var(--buic-foreground-focus-border);
+          box-shadow: var(--buic-focus-boxshadow-gradient1) 0px 1px 1px,
+            var(--buic-focus-boxshadow-gradient2) 0px 0px 0px 2px;
+        }
+      }
+      &:hover {
+        color: var(--iui-color-text-accent);
+      }
+    }
+    .components-next-month {
+      text-align: right;
+    }
+    .components-month-year {
+      flex: 2;
+      font-weight: var(--iui-font-weight-bold);
+      text-align: center;
+    }
+  }
+  .components-date-picker-calendar-header-weekdays {
+    display: grid;
+    background-color: $buic-background-2;
+    padding-inline-start: 8px;
+    padding-inline-end: 8px;
+    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
+    align-items: center;
+    .components-date-picker-calendar-header-day-short {
+      text-align: center;
+      text-decoration: none;
+      font-weight: var(--iui-font-weight-bold);
+      height: 32px;
+      width: 32px;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+  ul.components-date-picker-calendar-month {
+    margin: 1px;
+    padding: 4px 5px;
+    list-style: none;
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
+    text-align: center;
+    align-items: center;
+    align-self: center;
+    &:focus {
+      outline: 0px;
+      &.showFocusOutline {
+        border: 0px solid var(--iui-color-border-foreground);
+        border-radius: var(--iui-border-radius-1);
+        border-color: var(--buic-foreground-focus-border);
+        box-shadow: var(--buic-focus-boxshadow-gradient1) 0px 1px 1px,
+          var(--buic-focus-boxshadow-gradient2) 0px 0px 0px 2px;
+        .components-date-picker-calendar-day.focused {
+          outline: 0px;
+          border: 1px solid var(--iui-color-border-foreground);
+          border-radius: var(--iui-border-radius-1);
+          border-color: var(--buic-foreground-focus-border);
+          box-shadow: var(--buic-focus-boxshadow-gradient1) 0px 1px 1px,
+            var(--buic-focus-boxshadow-gradient2) 0px 0px 0px 2px;
+          z-index: 1;
+        }
+      }
+    }
+    .components-date-picker-calendar-day {
+      box-sizing: border-box;
+      text-align: center;
+      white-space: nowrap;
+      cursor: pointer;
+      height: 32px;
+      width: 32px;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      &:focus {
+        outline: 0px;
+      }
+      &:hover:not(.selected) {
+        background-color: $buic-row-hover;
+        border-radius: var(--iui-border-radius-1);
+        font-weight: var(--iui-font-weight-semibold);
+      }
+      &.selected {
+        background-color: $buic-background-primary;
+        color: var(--iui-color-white);
+        font-weight: var(--iui-font-weight-semibold);
+        border-radius: var(--iui-border-radius-1);
+        &:hover {
+          background-color: $buic-row-hover;
+          color: var(--iui-color-text);
+        }
+      }
+      &.today {
+        background-color: rgba($buic-foreground-body, $uicore-opacity-6);
+        font-weight: var(--iui-font-weight-semibold);
+        border-radius: 50%;
+      }
+      &.notCurrentMonth {
+        &:not(.selected) {
+          color: $date-picker-outside-month-color;
+          font-weight: var(--iui-font-weight-light);
+        }
+      }
+    }
+  }
+}

package/lib/cjs/components-react/datepicker/DatePickerPopupButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"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 { DateFormatter, RelativePosition, SpecialKey, TimeDisplay } from \"@itwin/appui-abstract\";\nimport { CommonProps, Popup } from \"@itwin/core-react\";\nimport { Text } from \"@itwin/itwinui-react\";\nimport { UiComponents } from \"../UiComponents\";\nimport { DatePicker } from \"./DatePicker\";\nimport { DateField } from \"./DateField\";\nimport { TimeField, TimeSpec } 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"]}
1	+ {"version":3,"file":"DatePickerPopupButton.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/DatePickerPopupButton.tsx"],"names":[],"mappings":"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","sourcesContent":["/---------------------------------------------------------------------------------------------\r\n Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n--------------------------------------------------------------------------------------------/\r\n/** @packageDocumentation\r\n * @module Date\r\n /\r\n\r\nimport as React from \"react\";\r\nimport { DateFormatter, RelativePosition, SpecialKey, TimeDisplay } from \"@itwin/appui-abstract\";\r\nimport { CommonProps, Popup } from \"@itwin/core-react\";\r\nimport { Text } from \"@itwin/itwinui-react\";\r\nimport { UiComponents } from \"../UiComponents\";\r\nimport { DatePicker } from \"./DatePicker\";\r\nimport { DateField } from \"./DateField\";\r\nimport { TimeField, TimeSpec } from \"./TimeField\";\r\nimport \"./DatePickerPopupButton.scss\";\r\n\r\n/** Props used by [[DatePickerPopupButton]] component.\r\n * @alpha /\r\nexport interface DatePickerPopupButtonProps extends CommonProps {\r\n /* Date to be shown as the selected date. /\r\n selected: Date;\r\n /* If true show the date (and optionally time) edit field next to button /\r\n displayEditField?: boolean;\r\n // If defined show time in popup and also display time if input field is shown\r\n timeDisplay?: TimeDisplay;\r\n /* Function called when Date changes. /\r\n onDateChange?: (day: Date) => void;\r\n /* Optional tooltip /\r\n buttonToolTip?: string;\r\n / Custom date formatter. WARNING: if used values will only be shown in specified format and will not be based on locale.\r\n * If used the existence of a parseDate function will determine if the edit field allows editing. /\r\n dateFormatter?: DateFormatter;\r\n /* User defined class name for edit field. /\r\n fieldClassName?: string;\r\n /* User defined style for edit field. /\r\n fieldStyle?: React.CSSProperties;\r\n}\r\n\r\n/* Component that displays a button used to pick a date and optionally a time.\r\n * @alpha\r\n * */\r\nexport function DatePickerPopupButton({ displayEditField, timeDisplay, selected, onDateChange, dateFormatter,\r\n buttonToolTip, fieldStyle, fieldClassName, style }: DatePickerPopupButtonProps) {\r\n const [workingDate, setWorkingDate] = React.useState(new Date(selected.getTime()));\r\n const [isSettingsOpen, setIsSettingsOpen] = React.useState(false);\r\n const timeLabelRef = React.useRef(UiComponents.translate(\"datepicker.time\"));\r\n const toolTipLabelRef = React.useRef(UiComponents.translate(\"datepicker.selectDate\"));\r\n const toolTipLabel = React.useMemo(() => buttonToolTip ? buttonToolTip : toolTipLabelRef.current, [buttonToolTip]);\r\n\r\n // See if props have changed since component mounted\r\n React.useEffect(() => {\r\n const newWorkingDate = new Date(selected.getTime());\r\n setWorkingDate(newWorkingDate);\r\n }, [selected]);\r\n\r\n const buttonRef = React.useRef<HTMLButtonElement>(null);\r\n const togglePopupDisplay = React.useCallback((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\r\n event.preventDefault();\r\n setShowFocusOutline(false);\r\n setIsSettingsOpen((prev) => !prev);\r\n }, [setIsSettingsOpen]);\r\n\r\n const handleCloseSetting = React.useCallback(() => {\r\n setIsSettingsOpen(false);\r\n }, [setIsSettingsOpen]);\r\n\r\n const handleOnDateChanged = (day: Date) => {\r\n // combine current time into selected Date\r\n const newWorkingDate = new Date(day.getTime());\r\n newWorkingDate.setHours(workingDate.getHours(), workingDate.getMinutes(), workingDate.getSeconds());\r\n onDateChange && onDateChange(newWorkingDate);\r\n !timeDisplay && setIsSettingsOpen(false);\r\n };\r\n\r\n const handleOnTimeChanged = (time: TimeSpec) => {\r\n // Combine new time into selected Date\r\n const newWorkingDate = new Date(workingDate.getTime());\r\n newWorkingDate.setHours(time.hours, time.minutes, time.seconds);\r\n setWorkingDate(newWorkingDate);\r\n onDateChange && onDateChange(newWorkingDate);\r\n };\r\n\r\n const [showFocusOutline, setShowFocusOutline] = React.useState(false);\r\n const handlePopupKeyDown = React.useCallback((event: React.KeyboardEvent<HTMLButtonElement>) => {\r\n // istanbul ignore else\r\n if (event.key === SpecialKey.Space) {\r\n setShowFocusOutline(true);\r\n setIsSettingsOpen(true);\r\n }\r\n }, []);\r\n\r\n const timeSpec: TimeSpec = { hours: workingDate.getHours(), minutes: workingDate.getMinutes(), seconds: workingDate.getSeconds() };\r\n return (\r\n <>\r\n <button title={toolTipLabel} style={style} className=\"components-date-picker-calendar-popup-button\" onKeyDown={handlePopupKeyDown}\r\n data-testid=\"components-date-picker-calendar-popup-button\" onPointerDown={togglePopupDisplay} ref={buttonRef}>\r\n <div className=\"datepicker-button\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\">\r\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\" />\r\n </svg>\r\n </div>\r\n </button>\r\n <Popup\r\n isOpen={isSettingsOpen}\r\n position={RelativePosition.BottomLeft}\r\n onClose={handleCloseSetting}\r\n target={buttonRef.current}\r\n closeOnEnter={false}\r\n moveFocus={showFocusOutline}\r\n closeOnNestedPopupOutsideClick\r\n >\r\n <div className=\"components-date-picker-calendar-popup-panel\" data-testid=\"components-date-picker-calendar-popup-panel\">\r\n <DatePicker selected={workingDate} onDateChange={handleOnDateChanged} showFocusOutline={showFocusOutline} />\r\n {timeDisplay &&\r\n <div className=\"time-container\">\r\n <Text variant=\"body\" className=\"time-label\">{timeLabelRef.current}</Text>\r\n <TimeField time={timeSpec} timeDisplay={timeDisplay} onTimeChange={handleOnTimeChanged} />\r\n </div>\r\n }\r\n </div>\r\n </Popup >\r\n {!!displayEditField && <DateField style={fieldStyle} className={fieldClassName} initialDate={workingDate} timeDisplay={timeDisplay} dateFormatter={dateFormatter} onDateChange={handleOnDateChanged} />}\r\n </>\r\n );\r\n}\r\n"]}