@pnp/spfx-controls-react 3.9.0-beta.2292972 → 3.9.0-beta.2437259

package/release/webpack-stats/sp-dev-fx-controls-react.stats.json

@@ -2,9 +2,9 @@
   "errors": [],
   "warnings": [],
   "version": "4.44.2",
-  "hash": "c62e05a9e06858e23a98",
-  "time": 22327,
-  "builtAt": 1652085422197,
+  "hash": "6823330957182642d68c",
+  "time": 19776,
+  "builtAt": 1654292864353,
   "publicPath": "",
   "outputPath": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/dist",
   "assetsByChunkName": {
@@ -292,7 +292,7 @@
     },
     {
       "name": "controls-test-web-part.js",
-      "size": 17761455,
+      "size": 17762368,
       "chunks": [
         "controls-test-web-part"
       ],
@@ -305,7 +305,7 @@
     },
     {
       "name": "controls-test-web-part.js.map",
-      "size": 16009071,
+      "size": 16009919,
       "chunks": [
         "controls-test-web-part"
       ],
@@ -404,7 +404,7 @@
       "rendered": true,
       "initial": true,
       "entry": true,
-      "size": 12822815,
+      "size": 12823467,
       "names": [
         "controls-test-web-part"
       ],
@@ -412,7 +412,7 @@
         "controls-test-web-part.js",
         "controls-test-web-part.js.map"
       ],
-      "hash": "46d3c8db5d6164754b13",
+      "hash": "2d6f0b87860564dd7851",
       "siblings": [],
       "parents": [],
       "children": [],
@@ -8670,6 +8670,16 @@
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
             },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
+            },
             {
               "id": "5YQ7",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.js",
@@ -9865,7 +9875,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "./TimeHelper",
-              "loc": "27:0-42"
+              "loc": "28:0-42"
             },
             {
               "moduleId": "zgIZ",
@@ -9874,7 +9884,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeHelper",
-              "loc": "44:17-27"
+              "loc": "45:17-27"
             },
             {
               "moduleId": "zgIZ",
@@ -9883,7 +9893,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeHelper",
-              "loc": "49:22-32"
+              "loc": "50:22-32"
             },
             {
               "moduleId": "zgIZ",
@@ -9892,7 +9902,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeHelper",
-              "loc": "86:27-37"
+              "loc": "87:27-37"
             },
             {
               "moduleId": "zgIZ",
@@ -9901,7 +9911,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeHelper",
-              "loc": "103:27-37"
+              "loc": "104:27-37"
             },
             {
               "moduleId": "zgIZ",
@@ -9910,7 +9920,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeHelper",
-              "loc": "120:27-37"
+              "loc": "121:27-37"
             },
             {
               "moduleId": "zgIZ",
@@ -9919,7 +9929,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeHelper",
-              "loc": "132:17-27"
+              "loc": "133:17-27"
             },
             {
               "moduleId": "zgIZ",
@@ -9928,7 +9938,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeHelper",
-              "loc": "227:18-28"
+              "loc": "228:18-28"
             }
           ],
           "providedExports": [
@@ -11034,9 +11044,9 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "OcOZ",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-              "name": "./node_modules/@popperjs/core/lib/popper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
               "id": "CSm3",
@@ -39527,7 +39537,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "./TimeDisplayControlType",
-              "loc": "28:0-66"
+              "loc": "29:0-66"
             },
             {
               "moduleId": "zgIZ",
@@ -39536,7 +39546,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeDisplayControlType",
-              "loc": "259:215-237"
+              "loc": "268:215-237"
             },
             {
               "moduleId": "zgIZ",
@@ -39545,7 +39555,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeDisplayControlType",
-              "loc": "263:233-255"
+              "loc": "272:233-255"
             },
             {
               "moduleId": "zgIZ",
@@ -39554,7 +39564,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./TimeDisplayControlType",
-              "loc": "267:189-211"
+              "loc": "276:189-211"
             }
           ],
           "providedExports": [
@@ -44727,7 +44737,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Label",
-              "loc": "256:40-45"
+              "loc": "265:40-45"
             },
             {
               "moduleId": "zgIZ",
@@ -44736,7 +44746,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Label",
-              "loc": "261:44-49"
+              "loc": "270:44-49"
             },
             {
               "moduleId": "zgIZ",
@@ -44745,7 +44755,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Label",
-              "loc": "265:44-49"
+              "loc": "274:44-49"
             },
             {
               "moduleId": "zgIZ",
@@ -44754,7 +44764,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Label",
-              "loc": "271:41-46"
+              "loc": "280:41-46"
             },
             {
               "moduleId": "zgIZ",
@@ -44763,7 +44773,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Label",
-              "loc": "275:44-49"
+              "loc": "284:44-49"
             }
           ],
           "providedExports": [
@@ -49664,9 +49674,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "issuerId": "lDWV",
-          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+          "issuerId": "CSm3",
+          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/arrow.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -49724,9 +49734,9 @@
               "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
-              "id": "lDWV",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-              "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+              "id": "CSm3",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
             }
           ],
           "failed": false,
@@ -51904,9 +51914,9 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "OcOZ",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-              "name": "./node_modules/@popperjs/core/lib/popper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
               "id": "CSm3",
@@ -53599,9 +53609,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-          "issuerId": "K0tY",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "issuerId": "uAzL",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -53632,6 +53642,16 @@
               "id": "K0tY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+            },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
             }
           ],
           "failed": false,
@@ -60695,9 +60715,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
-          "issuerId": "XrpE",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js",
+          "issuerId": "ZHSi",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -60728,6 +60748,11 @@
               "id": "XrpE",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js"
+            },
+            {
+              "id": "ZHSi",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js"
             }
           ],
           "failed": false,
@@ -60957,9 +60982,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
+            },
+            {
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
             },
             {
               "id": "thf+",
@@ -62867,9 +62897,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js",
-          "issuerId": "0RYX",
-          "issuerName": "./node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/utils/detectOverflow.js",
+          "issuerId": "thf+",
+          "issuerName": "./node_modules/@popperjs/core/lib/utils/detectOverflow.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -62922,14 +62952,19 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
             },
             {
-              "id": "0RYX",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js",
-              "name": "./node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js"
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
+            },
+            {
+              "id": "thf+",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/utils/detectOverflow.js",
+              "name": "./node_modules/@popperjs/core/lib/utils/detectOverflow.js"
             }
           ],
           "failed": false,
@@ -92594,9 +92629,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-          "issuerId": "fCK1",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+          "issuerId": "16Wd",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -92614,14 +92649,14 @@
               "name": "./node_modules/office-ui-fabric-react/lib/components/Button/index.js"
             },
             {
-              "id": "2WvF",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js"
+              "id": "Cv5W",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js"
             },
             {
-              "id": "fCK1",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js"
+              "id": "16Wd",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js"
             }
           ],
           "failed": false,
@@ -94899,7 +94934,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/DatePicker",
-              "loc": "277:44-54"
+              "loc": "286:44-54"
             }
           ],
           "providedExports": [
@@ -96248,7 +96283,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "./SecondsComponent",
-              "loc": "23:0-50"
+              "loc": "24:0-50"
             },
             {
               "moduleId": "zgIZ",
@@ -96257,7 +96292,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./SecondsComponent",
-              "loc": "267:44-60"
+              "loc": "276:44-60"
             }
           ],
           "providedExports": [
@@ -101258,9 +101293,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-          "issuerId": "OcOZ",
-          "issuerName": "./node_modules/@popperjs/core/lib/popper.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "issuerId": "HnbP",
+          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/index.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -101313,9 +101348,9 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "OcOZ",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-              "name": "./node_modules/@popperjs/core/lib/popper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             }
           ],
           "failed": false,
@@ -124871,9 +124906,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
-          "issuerId": "OQ9B",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
+          "issuerId": "uz3O",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -124906,9 +124941,9 @@
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
             },
             {
-              "id": "OQ9B",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js"
+              "id": "uz3O",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js"
             }
           ],
           "failed": false,
@@ -130682,14 +130717,29 @@
               "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
             },
             {
-              "id": "E19z",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/index.js",
-              "name": "./node_modules/@fluentui/styles/dist/es/index.js"
+              "id": "bF8i",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js"
             },
             {
-              "id": "/3ou",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/mergeThemes.js",
-              "name": "./node_modules/@fluentui/styles/dist/es/mergeThemes.js"
+              "id": "A/h+",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js"
+            },
+            {
+              "id": "eVVe",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js"
+            },
+            {
+              "id": "7X27",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/index.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/index.js"
+            },
+            {
+              "id": "cN41",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js"
             },
             {
               "id": "bNQv",
@@ -137520,6 +137570,24 @@
               "userRequest": "office-ui-fabric-react/lib/Button",
               "loc": "140:36-52"
             },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony side effect evaluation",
+              "userRequest": "office-ui-fabric-react/lib/Button",
+              "loc": "19:0-63"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "office-ui-fabric-react/lib/Button",
+              "loc": "289:92-102"
+            },
             {
               "moduleId": "zjyg",
               "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubbleContent.base.js",
@@ -138305,9 +138373,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/index.js",
-          "issuerId": "hrTv",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Pivot/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js",
+          "issuerId": "sLz2",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -138338,6 +138406,16 @@
               "id": "hrTv",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/Pivot/index.js"
+            },
+            {
+              "id": "8X3N",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.js"
+            },
+            {
+              "id": "sLz2",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js"
             }
           ],
           "failed": false,
@@ -140023,9 +140101,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
-          "issuerId": "oave",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
+          "issuerId": "J64e",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -140056,11 +140134,6 @@
               "id": "J64e",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js"
-            },
-            {
-              "id": "oave",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js"
             }
           ],
           "failed": false,
@@ -140558,9 +140631,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-          "issuerId": "K0tY",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "issuerId": "uAzL",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -140591,6 +140664,16 @@
               "id": "K0tY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+            },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
             }
           ],
           "failed": false,
@@ -143168,9 +143251,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/instanceOf.js",
-          "issuerId": "J2fa",
-          "issuerName": "./node_modules/@popperjs/core/lib/dom-utils/instanceOf.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/eventListeners.js",
+          "issuerId": "rW7i",
+          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/eventListeners.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -143223,14 +143306,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
-              "id": "J2fa",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/instanceOf.js",
-              "name": "./node_modules/@popperjs/core/lib/dom-utils/instanceOf.js"
+              "id": "rW7i",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/eventListeners.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/eventListeners.js"
             }
           ],
           "failed": false,
@@ -165911,9 +165994,9 @@
               "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
-              "id": "lDWV",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-              "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+              "id": "CSm3",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
             },
             {
               "id": "titc",
@@ -191314,7 +191397,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "office-ui-fabric-react/lib/Utilities",
-              "loc": "25:0-66"
+              "loc": "26:0-66"
             },
             {
               "moduleId": "zgIZ",
@@ -191323,7 +191406,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Utilities",
-              "loc": "202:26-31"
+              "loc": "203:26-31"
             },
             {
               "moduleId": "zgIZ",
@@ -191332,7 +191415,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Utilities",
-              "loc": "254:63-66"
+              "loc": "263:63-66"
             },
             {
               "moduleId": "zjyg",
@@ -224905,9 +224988,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "issuerId": "lDWV",
-          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/flip.js",
+          "issuerId": "7LKL",
+          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/flip.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -224965,9 +225048,9 @@
               "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
-              "id": "lDWV",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-              "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+              "id": "7LKL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/flip.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/flip.js"
             }
           ],
           "failed": false,
@@ -226877,7 +226960,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "@microsoft/sp-lodash-subset",
-              "loc": "216:13-20"
+              "loc": "217:13-20"
             },
             {
               "moduleId": "zpkR",
@@ -227221,9 +227304,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
+            },
+            {
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
             },
             {
               "id": "thf+",
@@ -266690,7 +266778,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "../errorMessage/ErrorMessage",
-              "loc": "19:0-56"
+              "loc": "20:0-56"
             },
             {
               "moduleId": "zgIZ",
@@ -266699,7 +266787,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "../errorMessage/ErrorMessage",
-              "loc": "281:32-44"
+              "loc": "291:32-44"
             }
           ],
           "providedExports": [
@@ -277520,6 +277608,16 @@
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
             },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
+            },
             {
               "id": "aXXY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.js",
@@ -281289,9 +281387,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/withThemeFactory.js",
-          "issuerId": "g7Om",
-          "issuerName": "./node_modules/fela-bindings/es/withThemeFactory.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/connectFactory.js",
+          "issuerId": "GWlu",
+          "issuerName": "./node_modules/fela-bindings/es/connectFactory.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -281344,9 +281442,9 @@
               "name": "./node_modules/fela-bindings/es/index.js"
             },
             {
-              "id": "g7Om",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/withThemeFactory.js",
-              "name": "./node_modules/fela-bindings/es/withThemeFactory.js"
+              "id": "GWlu",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/connectFactory.js",
+              "name": "./node_modules/fela-bindings/es/connectFactory.js"
             }
           ],
           "failed": false,
@@ -282013,16 +282111,6 @@
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js"
             },
-            {
-              "id": "nrwl",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js"
-            },
-            {
-              "id": "MdIn",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js"
-            },
             {
               "id": "x2if",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.js",
@@ -309537,9 +309625,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-          "issuerId": "K0tY",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "issuerId": "uAzL",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -309570,6 +309658,16 @@
               "id": "K0tY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+            },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
             }
           ],
           "failed": false,
@@ -313875,9 +313973,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/mergeThemes.js",
-          "issuerId": "/3ou",
-          "issuerName": "./node_modules/@fluentui/styles/dist/es/mergeThemes.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
+          "issuerId": "cN41",
+          "issuerName": "./node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -313895,14 +313993,29 @@
               "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
             },
             {
-              "id": "E19z",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/index.js",
-              "name": "./node_modules/@fluentui/styles/dist/es/index.js"
+              "id": "bF8i",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js"
             },
             {
-              "id": "/3ou",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/mergeThemes.js",
-              "name": "./node_modules/@fluentui/styles/dist/es/mergeThemes.js"
+              "id": "A/h+",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js"
+            },
+            {
+              "id": "eVVe",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js"
+            },
+            {
+              "id": "7X27",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/index.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/index.js"
+            },
+            {
+              "id": "cN41",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js"
             }
           ],
           "failed": false,
@@ -372253,7 +372366,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "252:22-41"
+              "loc": "261:22-41"
             },
             {
               "moduleId": "zgIZ",
@@ -372262,7 +372375,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "254:23-42"
+              "loc": "263:23-42"
             },
             {
               "moduleId": "zgIZ",
@@ -372271,7 +372384,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "255:40-59"
+              "loc": "264:40-59"
             },
             {
               "moduleId": "zgIZ",
@@ -372280,7 +372393,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "256:20-39"
+              "loc": "265:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -372289,7 +372402,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "257:16-35"
+              "loc": "266:16-35"
             },
             {
               "moduleId": "zgIZ",
@@ -372298,7 +372411,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "258:20-39"
+              "loc": "267:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -372307,7 +372420,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "259:24-43"
+              "loc": "268:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -372316,7 +372429,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "260:20-39"
+              "loc": "269:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -372325,7 +372438,16 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "261:24-43"
+              "loc": "270:24-43"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "react",
+              "loc": "271:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -372334,7 +372456,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "262:20-39"
+              "loc": "272:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -372343,7 +372465,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "263:24-43"
+              "loc": "273:36-55"
             },
             {
               "moduleId": "zgIZ",
@@ -372352,7 +372474,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "264:36-55"
+              "loc": "274:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -372361,7 +372483,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "265:24-43"
+              "loc": "275:36-55"
             },
             {
               "moduleId": "zgIZ",
@@ -372370,7 +372492,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "266:36-55"
+              "loc": "276:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -372379,7 +372501,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "267:24-43"
+              "loc": "279:16-35"
             },
             {
               "moduleId": "zgIZ",
@@ -372388,7 +372510,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "270:16-35"
+              "loc": "280:21-40"
             },
             {
               "moduleId": "zgIZ",
@@ -372397,7 +372519,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "271:21-40"
+              "loc": "281:12-31"
             },
             {
               "moduleId": "zgIZ",
@@ -372406,7 +372528,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "272:12-31"
+              "loc": "282:16-35"
             },
             {
               "moduleId": "zgIZ",
@@ -372415,7 +372537,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "273:16-35"
+              "loc": "283:45-64"
             },
             {
               "moduleId": "zgIZ",
@@ -372424,7 +372546,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "274:45-64"
+              "loc": "284:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -372433,7 +372555,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "275:24-43"
+              "loc": "285:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -372442,7 +372564,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "276:20-39"
+              "loc": "286:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -372451,7 +372573,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "277:24-43"
+              "loc": "289:72-91"
             },
             {
               "moduleId": "zgIZ",
@@ -372460,7 +372582,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "281:12-31"
+              "loc": "289:206-225"
             },
             {
               "moduleId": "zgIZ",
@@ -372469,7 +372591,25 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "284:2-17"
+              "loc": "289:226-240"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "react",
+              "loc": "291:12-31"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "react",
+              "loc": "294:2-17"
             },
             {
               "moduleId": "zjyg",
@@ -372955,7 +373095,7 @@
           ],
           "optimizationBailout": [],
           "depth": 4,
-          "source": "export var version = \"3.9.0-beta.2292972\";\n"
+          "source": "export var version = \"3.9.0-beta.2437259\";\n"
         },
         {
           "id": "cLrF",
@@ -392953,9 +393093,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
+            },
+            {
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
             },
             {
               "id": "thf+",
@@ -394290,9 +394435,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/index.js",
-          "issuerId": "zY6E",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Rating/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js",
+          "issuerId": "xuuw",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -394323,6 +394468,16 @@
               "id": "zY6E",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/Rating/index.js"
+            },
+            {
+              "id": "ulwq",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/Rating.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Rating/Rating.js"
+            },
+            {
+              "id": "xuuw",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js"
             }
           ],
           "failed": false,
@@ -402576,9 +402731,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
+            },
+            {
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
             },
             {
               "id": "thf+",
@@ -405852,9 +406012,9 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "OcOZ",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-              "name": "./node_modules/@popperjs/core/lib/popper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
               "id": "CSm3",
@@ -411022,9 +411182,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/cssifyKeyframe.js",
-          "issuerId": "NSkR",
-          "issuerName": "./node_modules/fela/es/cssifyKeyframe.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-utils/es/cssifySupportRules.js",
+          "issuerId": "2sYF",
+          "issuerName": "./node_modules/fela-utils/es/cssifySupportRules.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -411062,19 +411222,19 @@
               "name": "./node_modules/@fluentui/react-northstar-fela-renderer/dist/es/createFelaRenderer.js"
             },
             {
-              "id": "2hpN",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/index.js",
-              "name": "./node_modules/fela/es/index.js"
+              "id": "BsSX",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar-fela-renderer/dist/es/felaStylisEnhancer.js",
+              "name": "./node_modules/@fluentui/react-northstar-fela-renderer/dist/es/felaStylisEnhancer.js"
             },
             {
-              "id": "BULa",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/createRenderer.js",
-              "name": "./node_modules/fela/es/createRenderer.js"
+              "id": "UdC7",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-utils/es/index.js",
+              "name": "./node_modules/fela-utils/es/index.js"
             },
             {
-              "id": "NSkR",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/cssifyKeyframe.js",
-              "name": "./node_modules/fela/es/cssifyKeyframe.js"
+              "id": "2sYF",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-utils/es/cssifySupportRules.js",
+              "name": "./node_modules/fela-utils/es/cssifySupportRules.js"
             }
           ],
           "failed": false,
@@ -428880,9 +429040,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-          "issuerId": "fCK1",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+          "issuerId": "16Wd",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -428900,14 +429060,14 @@
               "name": "./node_modules/office-ui-fabric-react/lib/components/Button/index.js"
             },
             {
-              "id": "2WvF",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js"
+              "id": "Cv5W",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js"
             },
             {
-              "id": "fCK1",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js"
+              "id": "16Wd",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js"
             }
           ],
           "failed": false,
@@ -429598,7 +429758,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": ".",
-              "loc": "26:0-42"
+              "loc": "27:0-42"
             },
             {
               "moduleId": "zgIZ",
@@ -429607,7 +429767,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": ".",
-              "loc": "245:774-795"
+              "loc": "254:774-795"
             }
           ],
           "providedExports": null,
@@ -442905,9 +443065,9 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "OcOZ",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-              "name": "./node_modules/@popperjs/core/lib/popper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
               "id": "CSm3",
@@ -449751,9 +449911,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
+            },
+            {
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
             },
             {
               "id": "thf+",
@@ -450335,9 +450500,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
+            },
+            {
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
             },
             {
               "id": "thf+",
@@ -452040,7 +452210,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "./MinutesComponent",
-              "loc": "22:0-50"
+              "loc": "23:0-50"
             },
             {
               "moduleId": "zgIZ",
@@ -452049,7 +452219,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./MinutesComponent",
-              "loc": "263:44-60"
+              "loc": "272:44-60"
             }
           ],
           "providedExports": [
@@ -471421,11 +471591,6 @@
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js"
             },
-            {
-              "id": "oave",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js"
-            },
             {
               "id": "GR0N",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.base.js",
@@ -474566,9 +474731,9 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "OcOZ",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-              "name": "./node_modules/@popperjs/core/lib/popper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
               "id": "CSm3",
@@ -485615,9 +485780,9 @@
               "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
-              "id": "lDWV",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-              "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+              "id": "CSm3",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
             },
             {
               "id": "titc",
@@ -490654,9 +490819,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/index.js",
-          "issuerId": "XyXI",
-          "issuerName": "./node_modules/@fluentui/react-northstar/dist/es/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
+          "issuerId": "ntjI",
+          "issuerName": "./node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -490672,6 +490837,11 @@
               "id": "XyXI",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/index.js",
               "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
+            },
+            {
+              "id": "ntjI",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js"
             }
           ],
           "failed": false,
@@ -491534,9 +491704,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "issuerId": "bO7i",
-          "issuerName": "./node_modules/@popperjs/core/lib/createPopper.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/offset.js",
+          "issuerId": "mDVL",
+          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/offset.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -491589,9 +491759,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "HnbP",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
+            },
+            {
+              "id": "mDVL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/offset.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/offset.js"
             }
           ],
           "failed": false,
@@ -493003,9 +493178,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "issuerId": "bO7i",
-          "issuerName": "./node_modules/@popperjs/core/lib/createPopper.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "issuerId": "HWy5",
+          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/hide.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -493058,9 +493233,14 @@
               "name": "./node_modules/@popperjs/core/lib/index.js"
             },
             {
-              "id": "bO7i",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-              "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+              "id": "OcOZ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+              "name": "./node_modules/@popperjs/core/lib/popper.js"
+            },
+            {
+              "id": "HWy5",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
             }
           ],
           "failed": false,
@@ -493264,9 +493444,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "issuerId": "lDWV",
-          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+          "issuerId": "CSm3",
+          "issuerName": "./node_modules/@popperjs/core/lib/modifiers/arrow.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -493324,9 +493504,9 @@
               "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
             },
             {
-              "id": "lDWV",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-              "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+              "id": "CSm3",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+              "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
             }
           ],
           "failed": false,
@@ -511156,7 +511336,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "68:51-65"
+              "loc": "69:51-65"
             },
             {
               "moduleId": "zgIZ",
@@ -511165,7 +511345,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "186:51-65"
+              "loc": "187:51-65"
             },
             {
               "moduleId": "zgIZ",
@@ -511174,7 +511354,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "188:51-65"
+              "loc": "189:51-65"
             },
             {
               "moduleId": "zgIZ",
@@ -511183,7 +511363,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "228:39-53"
+              "loc": "229:39-53"
             },
             {
               "moduleId": "zgIZ",
@@ -511192,7 +511372,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "229:41-55"
+              "loc": "230:41-55"
             },
             {
               "moduleId": "zgIZ",
@@ -511201,7 +511381,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "230:41-55"
+              "loc": "231:41-55"
             },
             {
               "moduleId": "zgIZ",
@@ -511210,7 +511390,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "245:164-178"
+              "loc": "254:164-178"
             },
             {
               "moduleId": "zgIZ",
@@ -511219,7 +511399,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimeConventions",
-              "loc": "253:31-45"
+              "loc": "262:31-45"
             }
           ],
           "providedExports": [
@@ -518380,9 +518560,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
-          "issuerId": "MdIn",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
+          "issuerId": "XrpE",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -518413,16 +518593,6 @@
               "id": "XrpE",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js"
-            },
-            {
-              "id": "nrwl",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js"
-            },
-            {
-              "id": "MdIn",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js"
             }
           ],
           "failed": false,
@@ -518595,6 +518765,11 @@
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/index.js",
               "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
             },
+            {
+              "id": "ntjI",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
+              "name": "./node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js"
+            },
             {
               "id": "tJ6w",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/MenuButton/MenuButton.js",
@@ -520162,7 +520337,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "../../common/telemetry",
-              "loc": "24:0-52"
+              "loc": "25:0-52"
             },
             {
               "moduleId": "zgIZ",
@@ -520171,7 +520346,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "../../common/telemetry",
-              "loc": "185:8-23"
+              "loc": "186:8-23"
             }
           ],
           "providedExports": [
@@ -533276,9 +533451,9 @@
           "chunks": [
             "controls-test-web-part"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js",
-          "issuerId": "7rHc",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js",
+          "issuerId": "xbjQ",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -533309,6 +533484,16 @@
               "id": "7rHc",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js"
+            },
+            {
+              "id": "7XQV",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.js"
+            },
+            {
+              "id": "xbjQ",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js"
             }
           ],
           "failed": false,
@@ -538010,7 +538195,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "./HoursComponent",
-              "loc": "21:0-46"
+              "loc": "22:0-46"
             },
             {
               "moduleId": "zgIZ",
@@ -538019,7 +538204,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./HoursComponent",
-              "loc": "259:44-58"
+              "loc": "268:44-58"
             }
           ],
           "providedExports": [
@@ -538105,7 +538290,7 @@
           "name": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "index": 2525,
           "index2": 2543,
-          "size": 15326,
+          "size": 15978,
           "cacheable": true,
           "built": true,
           "optional": false,
@@ -538167,7 +538352,7 @@
           ],
           "optimizationBailout": [],
           "depth": 4,
-          "source": "var __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nimport * as React from \"react\";\nimport { isEqual } from '@microsoft/sp-lodash-subset';\nimport { TimeConvention, DateConvention } from \"./DateTimeConventions\";\nimport { DatePicker } from \"office-ui-fabric-react/lib/DatePicker\";\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\nimport ErrorMessage from \"../errorMessage/ErrorMessage\";\nimport styles from \"./DateTimePicker.module.scss\";\nimport HoursComponent from \"./HoursComponent\";\nimport MinutesComponent from \"./MinutesComponent\";\nimport SecondsComponent from \"./SecondsComponent\";\nimport * as telemetry from \"../../common/telemetry\";\nimport { Async, css } from 'office-ui-fabric-react/lib/Utilities';\nimport { DateTimePickerStrings } from \".\";\nimport { TimeHelper } from \"./TimeHelper\";\nimport { TimeDisplayControlType } from \"./TimeDisplayControlType\";\n/**\n * Renders the controls for DateTimePicker component\n */\nvar DateTimePicker = /** @class */ (function (_super) {\n    __extends(DateTimePicker, _super);\n    /**\n     * Constructor\n     */\n    function DateTimePicker(props) {\n        var _this = _super.call(this, props) || this;\n        _this._latestValidateValue = NaN;\n        /**\n         * Function called when the DatePicker Office UI Fabric component selected date changed\n         */\n        _this.onSelectDate = function (date) {\n            if (!TimeHelper.isValidDate(date)) {\n                return;\n            }\n            // Get hours, minutes and seconds from state or default to zero\n            var _a = _this.state, _b = _a.hours, hours = _b === void 0 ? 0 : _b, _c = _a.minutes, minutes = _c === void 0 ? 0 : _c, _d = _a.seconds, seconds = _d === void 0 ? 0 : _d;\n            var day = TimeHelper.cloneDate(date);\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n            _this.setState({ day: day }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when hours value have been changed\n         * @param element Hours dropdown value\n         */\n        _this.dropdownHoursChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var hoursSplit = value.split(\" \");\n                var hoursValue = hoursSplit[0].length > 2 ? hoursSplit[0].substring(0, 2) : hoursSplit[0];\n                var hours = parseInt(hoursValue);\n                if (isNaN(hours)) {\n                    return;\n                }\n                if (_this.props.timeConvention !== TimeConvention.Hours24) {\n                    if (hoursSplit[1] && hoursSplit[1].toLowerCase().indexOf(\"pm\") !== -1) {\n                        hours += 12;\n                        if (hours === 24) {\n                            //this is noon - set to 12 not 0\n                            //hours = 0;\n                            hours = 12;\n                        }\n                    }\n                    else if (hours === 12) {\n                        //am - if hours == 12, set hours to 0 here\n                        hours = 0;\n                    }\n                }\n                if (hours > 23) {\n                    return;\n                }\n                var state = { hours: hours };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setHours(hours);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when minutes value have been changed\n         * @param element Minutes dropdown value\n         */\n        _this.dropdownMinutesChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var minutes = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { minutes: minutes };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setMinutes(minutes);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when seconds value have been changed\n         * @param element Seconds dropdown value\n         */\n        _this.dropdownSecondsChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var seconds = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { seconds: seconds };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setSeconds(seconds);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Validates string input on date time field\n         */\n        _this.handleTextChange = function (e, newValue, locString) {\n            if (!TimeHelper.isValidDate(newValue)) {\n                _this.setState({\n                    errorMessage: locString,\n                });\n                return;\n            }\n        };\n        /**\n         * Validates the new custom field value\n         */\n        _this.validate = function (dateVal) {\n            if (typeof _this.props.onGetErrorMessage === 'undefined' || _this.props.onGetErrorMessage === null) {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n                return;\n            }\n            var timestamp = dateVal.getTime();\n            if (_this._latestValidateValue === timestamp) {\n                return;\n            }\n            _this._latestValidateValue = timestamp;\n            var result = _this.props.onGetErrorMessage(dateVal);\n            if (typeof result !== 'undefined') {\n                if (typeof result === 'string') {\n                    if (result === '') {\n                        _this.notifyAfterValidate(_this.props.value, dateVal);\n                    }\n                    _this.setState({\n                        errorMessage: result\n                    });\n                }\n                else {\n                    result.then(function (errorMessage) {\n                        if (typeof errorMessage === 'undefined' || errorMessage === '') {\n                            _this.notifyAfterValidate(_this.props.value, dateVal);\n                        }\n                        _this.setState({\n                            errorMessage: errorMessage\n                        });\n                    });\n                }\n            }\n            else {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n            }\n        };\n        /**\n         * Notifies the parent Web Part of a property value change\n         */\n        _this.notifyAfterValidate = function (oldValue, newValue) {\n            if (typeof _this.props.onChange !== 'undefined' && _this.props.onChange !== null && newValue !== null) {\n                _this.props.onChange(newValue);\n            }\n        };\n        telemetry.track('ReactDateTimePicker', {\n            dateConvention: props.dateConvention ? DateConvention[props.dateConvention] : '',\n            formatDate: !!props.formatDate,\n            timeConvention: props.timeConvention ? TimeConvention[props.timeConvention] : '',\n            disabled: props.disabled\n        });\n        // Get the current date/time values\n        var _a = _this.props.value, value = _a === void 0 ? null : _a;\n        var _b = DateTimePicker.getDateComponents(value, props.dateConvention), day = _b.day, hours = _b.hours, minutes = _b.minutes, seconds = _b.seconds;\n        // Set the current state\n        _this.state = {\n            day: day,\n            hours: hours,\n            minutes: minutes,\n            seconds: seconds,\n            errorMessage: ''\n        };\n        _this.async = new Async(_this);\n        _this.delayedValidate = _this.async.debounce(_this.validate, props.deferredValidationTime);\n        return _this;\n    }\n    /**\n     * Called when the component will unmount\n     */\n    DateTimePicker.prototype.componentWillUnmount = function () {\n        this.async.dispose();\n    };\n    /**\n     * Called before the component receives new props, used for matching state with new props.\n     */\n    DateTimePicker.prototype.componentWillReceiveProps = function (nextProps) {\n        if (!isEqual(nextProps.value, this.props.value)) {\n            var _a = DateTimePicker.getDateComponents(nextProps.value, this.props.dateConvention), day = _a.day, hours = _a.hours, minutes = _a.minutes, seconds = _a.seconds;\n            this.setState({ day: day, hours: hours, minutes: minutes, seconds: seconds });\n        }\n    };\n    /**\n     * Get the components of a Date object matching the DateConvention settings\n     * @param date Date to extract components from\n     * @param dateConvention DateConvention to follow when extracting date components\n     */\n    DateTimePicker.getDateComponents = function (date, dateConvention) {\n        var day = TimeHelper.cloneDate(date);\n        var hours = dateConvention !== DateConvention.Date && day !== null ? day.getHours() : 0;\n        var minutes = dateConvention !== DateConvention.Date && day !== null ? day.getMinutes() : 0;\n        var seconds = dateConvention !== DateConvention.Date && day !== null ? day.getSeconds() : 0;\n        if (day !== null) {\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n        }\n        return { day: day, hours: hours, minutes: minutes, seconds: seconds };\n    };\n    /**\n     * Renders the control\n     */\n    DateTimePicker.prototype.render = function () {\n        var _this = this;\n        // use date value from props if it exists, otherwise use internal state\n        // if no dateConvention is set, default is DateConvention.DateTime\n        var _a = this.props, label = _a.label, disabled = _a.disabled, timeConvention = _a.timeConvention, _b = _a.dateConvention, dateConvention = _b === void 0 ? DateConvention.DateTime : _b, firstDayOfWeek = _a.firstDayOfWeek, _c = _a.isMonthPickerVisible, isMonthPickerVisible = _c === void 0 ? true : _c, showGoToToday = _a.showGoToToday, _d = _a.allowTextInput, allowTextInput = _d === void 0 ? true : _d, _e = _a.showMonthPickerAsOverlay, showMonthPickerAsOverlay = _e === void 0 ? false : _e, _f = _a.showWeekNumbers, showWeekNumbers = _f === void 0 ? false : _f, _g = _a.showSeconds, showSeconds = _g === void 0 ? false : _g, formatDate = _a.formatDate, _h = _a.value, value = _h === void 0 ? this.state.day : _h, _j = _a.strings, dateStrings = _j === void 0 ? new DateTimePickerStrings() : _j, // Defines the DatePicker control labels\n        timeDisplayControlType = _a.timeDisplayControlType, placeholder = _a.placeholder, showLabels = _a.showLabels, minDate = _a.minDate, maxDate = _a.maxDate, minutesIncrementStep = _a.minutesIncrementStep;\n        var textErrorMessage = dateStrings.textErrorMessage;\n        var hours = value != null ? value.getHours() : this.state.hours;\n        var minutes = value != null ? value.getMinutes() : this.state.minutes;\n        var seconds = value != null ? value.getSeconds() : this.state.seconds;\n        // Check if the time element needs to be rendered\n        var timeElm = React.createElement(\"div\", { className: \"hidden\" });\n        if (dateConvention === DateConvention.DateTime) {\n            timeElm = (React.createElement(\"div\", { className: css(styles.row, styles.timeRow) },\n                showLabels !== false && React.createElement(\"div\", { className: styles.labelCell },\n                    React.createElement(Label, { className: styles.fieldLabel }, dateStrings.timeLabel)),\n                React.createElement(\"div\", { className: styles.time },\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(HoursComponent, { disabled: disabled, timeConvention: timeConvention, value: hours, onChange: this.dropdownHoursChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator)),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(MinutesComponent, { disabled: disabled, value: minutes, minutesIncrementStep: minutesIncrementStep, onChange: this.dropdownMinutesChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    showSeconds && (React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator))),\n                    showSeconds && (React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(SecondsComponent, { disabled: disabled, value: seconds, onChange: this.dropdownSecondsChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text }))))));\n        }\n        // Renders content\n        return (React.createElement(\"div\", { className: styles.dateTimePicker },\n            label && React.createElement(Label, null, label),\n            React.createElement(\"div\", { className: styles.container },\n                React.createElement(\"div\", { className: styles.row },\n                    showLabels !== false && (React.createElement(\"div\", { className: styles.labelCell },\n                        React.createElement(Label, { className: styles.fieldLabel }, dateStrings.dateLabel))),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(DatePicker, { formatDate: formatDate, disabled: disabled, value: value, strings: dateStrings, isMonthPickerVisible: isMonthPickerVisible, onSelectDate: this.onSelectDate, allowTextInput: allowTextInput, firstDayOfWeek: firstDayOfWeek, showGoToToday: showGoToToday, showMonthPickerAsOverlay: showMonthPickerAsOverlay, showWeekNumbers: showWeekNumbers, placeholder: placeholder, minDate: minDate, maxDate: maxDate, textField: {\n                                onChange: function (e, newValue) { return _this.handleTextChange(e, newValue, textErrorMessage); }\n                            } }))),\n                timeElm),\n            React.createElement(ErrorMessage, { errorMessage: this.state.errorMessage })));\n    };\n    return DateTimePicker;\n}(React.Component));\nexport { DateTimePicker };\n"
+          "source": "var __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nimport * as React from \"react\";\nimport { isEqual } from '@microsoft/sp-lodash-subset';\nimport { TimeConvention, DateConvention } from \"./DateTimeConventions\";\nimport { DatePicker } from \"office-ui-fabric-react/lib/DatePicker\";\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\nimport { IconButton } from \"office-ui-fabric-react/lib/Button\";\nimport ErrorMessage from \"../errorMessage/ErrorMessage\";\nimport styles from \"./DateTimePicker.module.scss\";\nimport HoursComponent from \"./HoursComponent\";\nimport MinutesComponent from \"./MinutesComponent\";\nimport SecondsComponent from \"./SecondsComponent\";\nimport * as telemetry from \"../../common/telemetry\";\nimport { Async, css } from 'office-ui-fabric-react/lib/Utilities';\nimport { DateTimePickerStrings } from \".\";\nimport { TimeHelper } from \"./TimeHelper\";\nimport { TimeDisplayControlType } from \"./TimeDisplayControlType\";\n/**\n * Renders the controls for DateTimePicker component\n */\nvar DateTimePicker = /** @class */ (function (_super) {\n    __extends(DateTimePicker, _super);\n    /**\n     * Constructor\n     */\n    function DateTimePicker(props) {\n        var _this = _super.call(this, props) || this;\n        _this._latestValidateValue = NaN;\n        /**\n         * Function called when the DatePicker Office UI Fabric component selected date changed\n         */\n        _this.onSelectDate = function (date) {\n            if (!TimeHelper.isValidDate(date)) {\n                return;\n            }\n            // Get hours, minutes and seconds from state or default to zero\n            var _a = _this.state, _b = _a.hours, hours = _b === void 0 ? 0 : _b, _c = _a.minutes, minutes = _c === void 0 ? 0 : _c, _d = _a.seconds, seconds = _d === void 0 ? 0 : _d;\n            var day = TimeHelper.cloneDate(date);\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n            _this.setState({ day: day }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when hours value have been changed\n         * @param element Hours dropdown value\n         */\n        _this.dropdownHoursChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var hoursSplit = value.split(\" \");\n                var hoursValue = hoursSplit[0].length > 2 ? hoursSplit[0].substring(0, 2) : hoursSplit[0];\n                var hours = parseInt(hoursValue);\n                if (isNaN(hours)) {\n                    return;\n                }\n                if (_this.props.timeConvention !== TimeConvention.Hours24) {\n                    if (hoursSplit[1] && hoursSplit[1].toLowerCase().indexOf(\"pm\") !== -1) {\n                        hours += 12;\n                        if (hours === 24) {\n                            //this is noon - set to 12 not 0\n                            //hours = 0;\n                            hours = 12;\n                        }\n                    }\n                    else if (hours === 12) {\n                        //am - if hours == 12, set hours to 0 here\n                        hours = 0;\n                    }\n                }\n                if (hours > 23) {\n                    return;\n                }\n                var state = { hours: hours };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setHours(hours);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when minutes value have been changed\n         * @param element Minutes dropdown value\n         */\n        _this.dropdownMinutesChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var minutes = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { minutes: minutes };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setMinutes(minutes);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when seconds value have been changed\n         * @param element Seconds dropdown value\n         */\n        _this.dropdownSecondsChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var seconds = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { seconds: seconds };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setSeconds(seconds);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Validates string input on date time field\n         */\n        _this.handleTextChange = function (e, newValue, locString) {\n            if (!TimeHelper.isValidDate(newValue)) {\n                _this.setState({\n                    errorMessage: locString,\n                });\n                return;\n            }\n        };\n        /**\n         * Validates the new custom field value\n         */\n        _this.validate = function (dateVal) {\n            if (typeof _this.props.onGetErrorMessage === 'undefined' || _this.props.onGetErrorMessage === null) {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n                return;\n            }\n            var timestamp = dateVal.getTime();\n            if (_this._latestValidateValue === timestamp) {\n                return;\n            }\n            _this._latestValidateValue = timestamp;\n            var result = _this.props.onGetErrorMessage(dateVal);\n            if (typeof result !== 'undefined') {\n                if (typeof result === 'string') {\n                    if (result === '') {\n                        _this.notifyAfterValidate(_this.props.value, dateVal);\n                    }\n                    _this.setState({\n                        errorMessage: result\n                    });\n                }\n                else {\n                    result.then(function (errorMessage) {\n                        if (typeof errorMessage === 'undefined' || errorMessage === '') {\n                            _this.notifyAfterValidate(_this.props.value, dateVal);\n                        }\n                        _this.setState({\n                            errorMessage: errorMessage\n                        });\n                    });\n                }\n            }\n            else {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n            }\n        };\n        /**\n         * Notifies the parent Web Part of a property value change\n         */\n        _this.notifyAfterValidate = function (oldValue, newValue) {\n            if (typeof _this.props.onChange !== 'undefined' && _this.props.onChange !== null && newValue !== null) {\n                _this.props.onChange(newValue);\n            }\n        };\n        telemetry.track('ReactDateTimePicker', {\n            dateConvention: props.dateConvention ? DateConvention[props.dateConvention] : '',\n            formatDate: !!props.formatDate,\n            timeConvention: props.timeConvention ? TimeConvention[props.timeConvention] : '',\n            disabled: props.disabled\n        });\n        // Get the current date/time values\n        var _a = _this.props.value, value = _a === void 0 ? null : _a;\n        var _b = DateTimePicker.getDateComponents(value, props.dateConvention), day = _b.day, hours = _b.hours, minutes = _b.minutes, seconds = _b.seconds;\n        // Set the current state\n        _this.state = {\n            day: day,\n            hours: hours,\n            minutes: minutes,\n            seconds: seconds,\n            errorMessage: ''\n        };\n        _this.async = new Async(_this);\n        _this.delayedValidate = _this.async.debounce(_this.validate, props.deferredValidationTime);\n        return _this;\n    }\n    /**\n     * Called when the component will unmount\n     */\n    DateTimePicker.prototype.componentWillUnmount = function () {\n        this.async.dispose();\n    };\n    /**\n     * Called before the component receives new props, used for matching state with new props.\n     */\n    DateTimePicker.prototype.componentWillReceiveProps = function (nextProps) {\n        if (!isEqual(nextProps.value, this.props.value)) {\n            var _a = DateTimePicker.getDateComponents(nextProps.value, this.props.dateConvention), day = _a.day, hours = _a.hours, minutes = _a.minutes, seconds = _a.seconds;\n            this.setState({ day: day, hours: hours, minutes: minutes, seconds: seconds });\n        }\n    };\n    /**\n     * Get the components of a Date object matching the DateConvention settings\n     * @param date Date to extract components from\n     * @param dateConvention DateConvention to follow when extracting date components\n     */\n    DateTimePicker.getDateComponents = function (date, dateConvention) {\n        var day = TimeHelper.cloneDate(date);\n        var hours = dateConvention !== DateConvention.Date && day !== null ? day.getHours() : 0;\n        var minutes = dateConvention !== DateConvention.Date && day !== null ? day.getMinutes() : 0;\n        var seconds = dateConvention !== DateConvention.Date && day !== null ? day.getSeconds() : 0;\n        if (day !== null) {\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n        }\n        return { day: day, hours: hours, minutes: minutes, seconds: seconds };\n    };\n    /**\n     * Function called from the clearDate iconbutton\n     */\n    DateTimePicker.prototype.clearDate = function () {\n        this.setState({\n            day: null\n        });\n    };\n    /**\n     * Renders the control\n     */\n    DateTimePicker.prototype.render = function () {\n        var _this = this;\n        // use date value from props if it exists, otherwise use internal state\n        // if no dateConvention is set, default is DateConvention.DateTime\n        var _a = this.props, label = _a.label, disabled = _a.disabled, timeConvention = _a.timeConvention, _b = _a.dateConvention, dateConvention = _b === void 0 ? DateConvention.DateTime : _b, firstDayOfWeek = _a.firstDayOfWeek, _c = _a.isMonthPickerVisible, isMonthPickerVisible = _c === void 0 ? true : _c, showGoToToday = _a.showGoToToday, _d = _a.allowTextInput, allowTextInput = _d === void 0 ? true : _d, _e = _a.showMonthPickerAsOverlay, showMonthPickerAsOverlay = _e === void 0 ? false : _e, _f = _a.showWeekNumbers, showWeekNumbers = _f === void 0 ? false : _f, _g = _a.showSeconds, showSeconds = _g === void 0 ? false : _g, formatDate = _a.formatDate, _h = _a.value, value = _h === void 0 ? this.state.day : _h, _j = _a.strings, dateStrings = _j === void 0 ? new DateTimePickerStrings() : _j, // Defines the DatePicker control labels\n        timeDisplayControlType = _a.timeDisplayControlType, placeholder = _a.placeholder, showLabels = _a.showLabels, minDate = _a.minDate, maxDate = _a.maxDate, minutesIncrementStep = _a.minutesIncrementStep, _k = _a.showClearDate, showClearDate = _k === void 0 ? false : _k, _l = _a.showClearDateIcon, showClearDateIcon = _l === void 0 ? 'RemoveEvent' : _l;\n        var textErrorMessage = dateStrings.textErrorMessage;\n        var hours = value != null ? value.getHours() : this.state.hours;\n        var minutes = value != null ? value.getMinutes() : this.state.minutes;\n        var seconds = value != null ? value.getSeconds() : this.state.seconds;\n        // Check if the time element needs to be rendered\n        var timeElm = React.createElement(\"div\", { className: \"hidden\" });\n        if (dateConvention === DateConvention.DateTime) {\n            timeElm = (React.createElement(\"div\", { className: css(styles.row, styles.timeRow) },\n                showLabels !== false && React.createElement(\"div\", { className: styles.labelCell },\n                    React.createElement(Label, { className: styles.fieldLabel }, dateStrings.timeLabel)),\n                React.createElement(\"div\", { className: styles.time },\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(HoursComponent, { disabled: disabled, timeConvention: timeConvention, value: hours, onChange: this.dropdownHoursChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator)),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(MinutesComponent, { disabled: disabled, value: minutes, minutesIncrementStep: minutesIncrementStep, onChange: this.dropdownMinutesChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    showSeconds && (React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator))),\n                    showSeconds && (React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(SecondsComponent, { disabled: disabled, value: seconds, onChange: this.dropdownSecondsChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text }))))));\n        }\n        // Renders content\n        return (React.createElement(\"div\", { className: styles.dateTimePicker },\n            label && React.createElement(Label, null, label),\n            React.createElement(\"div\", { className: styles.container },\n                React.createElement(\"div\", { className: styles.row },\n                    showLabels !== false && (React.createElement(\"div\", { className: styles.labelCell },\n                        React.createElement(Label, { className: styles.fieldLabel }, dateStrings.dateLabel))),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(DatePicker, { formatDate: formatDate, disabled: disabled, value: value, strings: dateStrings, isMonthPickerVisible: isMonthPickerVisible, onSelectDate: this.onSelectDate, allowTextInput: allowTextInput, firstDayOfWeek: firstDayOfWeek, showGoToToday: showGoToToday, showMonthPickerAsOverlay: showMonthPickerAsOverlay, showWeekNumbers: showWeekNumbers, placeholder: placeholder, minDate: minDate, maxDate: maxDate, textField: {\n                                onChange: function (e, newValue) { return _this.handleTextChange(e, newValue, textErrorMessage); }\n                            } })),\n                    showClearDate === true && this.state.day !== null ? React.createElement(IconButton, { iconProps: { iconName: showClearDateIcon }, onClick: function () { return _this.clearDate(); } }) : React.createElement(React.Fragment, null)),\n                timeElm),\n            React.createElement(ErrorMessage, { errorMessage: this.state.errorMessage })));\n    };\n    return DateTimePicker;\n}(React.Component));\nexport { DateTimePicker };\n"
         },
         {
           "id": "zgw+",
@@ -538375,7 +538560,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "20:0-50"
+              "loc": "21:0-50"
             },
             {
               "moduleId": "zgIZ",
@@ -538384,7 +538569,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "254:67-73"
+              "loc": "263:67-73"
             },
             {
               "moduleId": "zgIZ",
@@ -538393,7 +538578,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "254:79-85"
+              "loc": "263:79-85"
             },
             {
               "moduleId": "zgIZ",
@@ -538402,7 +538587,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "255:80-86"
+              "loc": "264:80-86"
             },
             {
               "moduleId": "zgIZ",
@@ -538411,7 +538596,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "256:60-66"
+              "loc": "265:60-66"
             },
             {
               "moduleId": "zgIZ",
@@ -538420,7 +538605,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "257:56-62"
+              "loc": "266:56-62"
             },
             {
               "moduleId": "zgIZ",
@@ -538429,7 +538614,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "258:60-66"
+              "loc": "267:60-66"
             },
             {
               "moduleId": "zgIZ",
@@ -538438,7 +538623,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "260:60-66"
+              "loc": "269:60-66"
             },
             {
               "moduleId": "zgIZ",
@@ -538447,7 +538632,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "262:60-66"
+              "loc": "271:60-66"
             },
             {
               "moduleId": "zgIZ",
@@ -538456,7 +538641,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "264:76-82"
+              "loc": "273:76-82"
             },
             {
               "moduleId": "zgIZ",
@@ -538465,7 +538650,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "266:76-82"
+              "loc": "275:76-82"
             },
             {
               "moduleId": "zgIZ",
@@ -538474,7 +538659,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "270:56-62"
+              "loc": "279:56-62"
             },
             {
               "moduleId": "zgIZ",
@@ -538483,7 +538668,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "272:52-58"
+              "loc": "281:52-58"
             },
             {
               "moduleId": "zgIZ",
@@ -538492,7 +538677,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "273:56-62"
+              "loc": "282:56-62"
             },
             {
               "moduleId": "zgIZ",
@@ -538501,7 +538686,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "274:85-91"
+              "loc": "283:85-91"
             },
             {
               "moduleId": "zgIZ",
@@ -538510,7 +538695,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "275:64-70"
+              "loc": "284:64-70"
             },
             {
               "moduleId": "zgIZ",
@@ -538519,7 +538704,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "./DateTimePicker.module.scss",
-              "loc": "276:60-66"
+              "loc": "285:60-66"
             }
           ],
           "providedExports": [
@@ -544162,7 +544347,7 @@
         "ootb-fields-field-customizer.js",
         "ootb-fields-field-customizer.js.map"
       ],
-      "hash": "a934d1754d884a51ea5e",
+      "hash": "61600e9ed85d3a98460a",
       "siblings": [],
       "parents": [],
       "children": [],
@@ -546184,6 +546369,16 @@
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
             },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
+            },
             {
               "id": "5YQ7",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.js",
@@ -551860,9 +552055,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-          "issuerId": "K0tY",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "issuerId": "uAzL",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -551893,6 +552088,16 @@
               "id": "K0tY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+            },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
             }
           ],
           "failed": false,
@@ -558251,9 +558456,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-          "issuerId": "fCK1",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+          "issuerId": "16Wd",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -558271,14 +558476,14 @@
               "name": "./node_modules/office-ui-fabric-react/lib/components/Button/index.js"
             },
             {
-              "id": "2WvF",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js"
+              "id": "Cv5W",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js"
             },
             {
-              "id": "fCK1",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js"
+              "id": "16Wd",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js"
             }
           ],
           "failed": false,
@@ -574410,9 +574615,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
-          "issuerId": "OQ9B",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
+          "issuerId": "uz3O",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -574445,9 +574650,9 @@
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
             },
             {
-              "id": "OQ9B",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js"
+              "id": "uz3O",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js"
             }
           ],
           "failed": false,
@@ -578848,6 +579053,24 @@
               "userRequest": "office-ui-fabric-react/lib/Button",
               "loc": "140:36-52"
             },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony side effect evaluation",
+              "userRequest": "office-ui-fabric-react/lib/Button",
+              "loc": "19:0-63"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "office-ui-fabric-react/lib/Button",
+              "loc": "289:92-102"
+            },
             {
               "moduleId": "zjyg",
               "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubbleContent.base.js",
@@ -579507,9 +579730,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-          "issuerId": "K0tY",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "issuerId": "uAzL",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -579540,6 +579763,16 @@
               "id": "K0tY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+            },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
             }
           ],
           "failed": false,
@@ -605373,7 +605606,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "office-ui-fabric-react/lib/Utilities",
-              "loc": "25:0-66"
+              "loc": "26:0-66"
             },
             {
               "moduleId": "zgIZ",
@@ -605382,7 +605615,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Utilities",
-              "loc": "202:26-31"
+              "loc": "203:26-31"
             },
             {
               "moduleId": "zgIZ",
@@ -605391,7 +605624,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "office-ui-fabric-react/lib/Utilities",
-              "loc": "254:63-66"
+              "loc": "263:63-66"
             },
             {
               "moduleId": "zjyg",
@@ -618186,7 +618419,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "@microsoft/sp-lodash-subset",
-              "loc": "216:13-20"
+              "loc": "217:13-20"
             },
             {
               "moduleId": "zpkR",
@@ -632756,6 +632989,16 @@
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
             },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
+            },
             {
               "id": "aXXY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.js",
@@ -639165,9 +639408,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-          "issuerId": "K0tY",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "issuerId": "uAzL",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -639198,6 +639441,16 @@
               "id": "K0tY",
               "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
               "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+            },
+            {
+              "id": "II1S",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+            },
+            {
+              "id": "uAzL",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
             }
           ],
           "failed": false,
@@ -695766,7 +696019,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "252:22-41"
+              "loc": "261:22-41"
             },
             {
               "moduleId": "zgIZ",
@@ -695775,7 +696028,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "254:23-42"
+              "loc": "263:23-42"
             },
             {
               "moduleId": "zgIZ",
@@ -695784,7 +696037,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "255:40-59"
+              "loc": "264:40-59"
             },
             {
               "moduleId": "zgIZ",
@@ -695793,7 +696046,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "256:20-39"
+              "loc": "265:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -695802,7 +696055,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "257:16-35"
+              "loc": "266:16-35"
             },
             {
               "moduleId": "zgIZ",
@@ -695811,7 +696064,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "258:20-39"
+              "loc": "267:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -695820,7 +696073,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "259:24-43"
+              "loc": "268:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -695829,7 +696082,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "260:20-39"
+              "loc": "269:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -695838,7 +696091,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "261:24-43"
+              "loc": "270:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -695847,7 +696100,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "262:20-39"
+              "loc": "271:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -695856,7 +696109,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "263:24-43"
+              "loc": "272:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -695865,7 +696118,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "264:36-55"
+              "loc": "273:36-55"
             },
             {
               "moduleId": "zgIZ",
@@ -695874,7 +696127,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "265:24-43"
+              "loc": "274:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -695883,7 +696136,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "266:36-55"
+              "loc": "275:36-55"
             },
             {
               "moduleId": "zgIZ",
@@ -695892,7 +696145,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "267:24-43"
+              "loc": "276:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -695901,7 +696154,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "270:16-35"
+              "loc": "279:16-35"
             },
             {
               "moduleId": "zgIZ",
@@ -695910,7 +696163,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "271:21-40"
+              "loc": "280:21-40"
             },
             {
               "moduleId": "zgIZ",
@@ -695919,7 +696172,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "272:12-31"
+              "loc": "281:12-31"
             },
             {
               "moduleId": "zgIZ",
@@ -695928,7 +696181,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "273:16-35"
+              "loc": "282:16-35"
             },
             {
               "moduleId": "zgIZ",
@@ -695937,7 +696190,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "274:45-64"
+              "loc": "283:45-64"
             },
             {
               "moduleId": "zgIZ",
@@ -695946,7 +696199,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "275:24-43"
+              "loc": "284:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -695955,7 +696208,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "276:20-39"
+              "loc": "285:20-39"
             },
             {
               "moduleId": "zgIZ",
@@ -695964,7 +696217,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "277:24-43"
+              "loc": "286:24-43"
             },
             {
               "moduleId": "zgIZ",
@@ -695973,7 +696226,34 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "281:12-31"
+              "loc": "289:72-91"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "react",
+              "loc": "289:206-225"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "react",
+              "loc": "289:226-240"
+            },
+            {
+              "moduleId": "zgIZ",
+              "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+              "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+              "type": "harmony import specifier",
+              "userRequest": "react",
+              "loc": "291:12-31"
             },
             {
               "moduleId": "zgIZ",
@@ -695982,7 +696262,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "react",
-              "loc": "284:2-17"
+              "loc": "294:2-17"
             },
             {
               "moduleId": "zjyg",
@@ -696315,7 +696595,7 @@
           ],
           "optimizationBailout": [],
           "depth": 4,
-          "source": "export var version = \"3.9.0-beta.2292972\";\n"
+          "source": "export var version = \"3.9.0-beta.2437259\";\n"
         },
         {
           "id": "cPD0",
@@ -707656,9 +707936,9 @@
             "controls-test-web-part",
             "ootb-fields-field-customizer"
           ],
-          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-          "issuerId": "fCK1",
-          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
+          "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+          "issuerId": "16Wd",
+          "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
           "issuerPath": [
             {
               "id": "G6oG",
@@ -707676,14 +707956,14 @@
               "name": "./node_modules/office-ui-fabric-react/lib/components/Button/index.js"
             },
             {
-              "id": "2WvF",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js"
+              "id": "Cv5W",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js"
             },
             {
-              "id": "fCK1",
-              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js"
+              "id": "16Wd",
+              "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+              "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js"
             }
           ],
           "failed": false,
@@ -725514,7 +725794,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony side effect evaluation",
               "userRequest": "../../common/telemetry",
-              "loc": "24:0-52"
+              "loc": "25:0-52"
             },
             {
               "moduleId": "zgIZ",
@@ -725523,7 +725803,7 @@
               "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
               "type": "harmony import specifier",
               "userRequest": "../../common/telemetry",
-              "loc": "185:8-23"
+              "loc": "186:8-23"
             }
           ],
           "providedExports": [
@@ -743270,6 +743550,16 @@
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
         },
+        {
+          "id": "II1S",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+        },
+        {
+          "id": "uAzL",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
+        },
         {
           "id": "5YQ7",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.js",
@@ -744465,7 +744755,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "./TimeHelper",
-          "loc": "27:0-42"
+          "loc": "28:0-42"
         },
         {
           "moduleId": "zgIZ",
@@ -744474,7 +744764,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeHelper",
-          "loc": "44:17-27"
+          "loc": "45:17-27"
         },
         {
           "moduleId": "zgIZ",
@@ -744483,7 +744773,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeHelper",
-          "loc": "49:22-32"
+          "loc": "50:22-32"
         },
         {
           "moduleId": "zgIZ",
@@ -744492,7 +744782,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeHelper",
-          "loc": "86:27-37"
+          "loc": "87:27-37"
         },
         {
           "moduleId": "zgIZ",
@@ -744501,7 +744791,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeHelper",
-          "loc": "103:27-37"
+          "loc": "104:27-37"
         },
         {
           "moduleId": "zgIZ",
@@ -744510,7 +744800,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeHelper",
-          "loc": "120:27-37"
+          "loc": "121:27-37"
         },
         {
           "moduleId": "zgIZ",
@@ -744519,7 +744809,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeHelper",
-          "loc": "132:17-27"
+          "loc": "133:17-27"
         },
         {
           "moduleId": "zgIZ",
@@ -744528,7 +744818,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeHelper",
-          "loc": "227:18-28"
+          "loc": "228:18-28"
         }
       ],
       "providedExports": [
@@ -745634,9 +745924,9 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "OcOZ",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-          "name": "./node_modules/@popperjs/core/lib/popper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
           "id": "CSm3",
@@ -774127,7 +774417,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "./TimeDisplayControlType",
-          "loc": "28:0-66"
+          "loc": "29:0-66"
         },
         {
           "moduleId": "zgIZ",
@@ -774136,7 +774426,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeDisplayControlType",
-          "loc": "259:215-237"
+          "loc": "268:215-237"
         },
         {
           "moduleId": "zgIZ",
@@ -774145,7 +774435,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeDisplayControlType",
-          "loc": "263:233-255"
+          "loc": "272:233-255"
         },
         {
           "moduleId": "zgIZ",
@@ -774154,7 +774444,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./TimeDisplayControlType",
-          "loc": "267:189-211"
+          "loc": "276:189-211"
         }
       ],
       "providedExports": [
@@ -779327,7 +779617,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/Label",
-          "loc": "256:40-45"
+          "loc": "265:40-45"
         },
         {
           "moduleId": "zgIZ",
@@ -779336,7 +779626,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/Label",
-          "loc": "261:44-49"
+          "loc": "270:44-49"
         },
         {
           "moduleId": "zgIZ",
@@ -779345,7 +779635,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/Label",
-          "loc": "265:44-49"
+          "loc": "274:44-49"
         },
         {
           "moduleId": "zgIZ",
@@ -779354,7 +779644,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/Label",
-          "loc": "271:41-46"
+          "loc": "280:41-46"
         },
         {
           "moduleId": "zgIZ",
@@ -779363,7 +779653,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/Label",
-          "loc": "275:44-49"
+          "loc": "284:44-49"
         }
       ],
       "providedExports": [
@@ -784264,9 +784554,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-      "issuerId": "lDWV",
-      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+      "issuerId": "CSm3",
+      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/arrow.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -784324,9 +784614,9 @@
           "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
-          "id": "lDWV",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+          "id": "CSm3",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
         }
       ],
       "failed": false,
@@ -786504,9 +786794,9 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "OcOZ",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-          "name": "./node_modules/@popperjs/core/lib/popper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
           "id": "CSm3",
@@ -788199,9 +788489,9 @@
         "controls-test-web-part",
         "ootb-fields-field-customizer"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-      "issuerId": "K0tY",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+      "issuerId": "uAzL",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -788232,6 +788522,16 @@
           "id": "K0tY",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+        },
+        {
+          "id": "II1S",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+        },
+        {
+          "id": "uAzL",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
         }
       ],
       "failed": false,
@@ -795295,9 +795595,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
-      "issuerId": "XrpE",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js",
+      "issuerId": "ZHSi",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -795328,6 +795628,11 @@
           "id": "XrpE",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js"
+        },
+        {
+          "id": "ZHSi",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.base.js"
         }
       ],
       "failed": false,
@@ -795557,9 +795862,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
+        },
+        {
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
         },
         {
           "id": "thf+",
@@ -797467,9 +797777,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js",
-      "issuerId": "0RYX",
-      "issuerName": "./node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/utils/detectOverflow.js",
+      "issuerId": "thf+",
+      "issuerName": "./node_modules/@popperjs/core/lib/utils/detectOverflow.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -797522,14 +797832,19 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
         },
         {
-          "id": "0RYX",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js",
-          "name": "./node_modules/@popperjs/core/lib/dom-utils/getCompositeRect.js"
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
+        },
+        {
+          "id": "thf+",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/utils/detectOverflow.js",
+          "name": "./node_modules/@popperjs/core/lib/utils/detectOverflow.js"
         }
       ],
       "failed": false,
@@ -827285,9 +827600,9 @@
         "controls-test-web-part",
         "ootb-fields-field-customizer"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-      "issuerId": "fCK1",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+      "issuerId": "16Wd",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -827305,14 +827620,14 @@
           "name": "./node_modules/office-ui-fabric-react/lib/components/Button/index.js"
         },
         {
-          "id": "2WvF",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js"
+          "id": "Cv5W",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js"
         },
         {
-          "id": "fCK1",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js"
+          "id": "16Wd",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js"
         }
       ],
       "failed": false,
@@ -829590,7 +829905,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/DatePicker",
-          "loc": "277:44-54"
+          "loc": "286:44-54"
         }
       ],
       "providedExports": [
@@ -830939,7 +831254,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "./SecondsComponent",
-          "loc": "23:0-50"
+          "loc": "24:0-50"
         },
         {
           "moduleId": "zgIZ",
@@ -830948,7 +831263,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./SecondsComponent",
-          "loc": "267:44-60"
+          "loc": "276:44-60"
         }
       ],
       "providedExports": [
@@ -835949,9 +836264,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-      "issuerId": "OcOZ",
-      "issuerName": "./node_modules/@popperjs/core/lib/popper.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+      "issuerId": "HnbP",
+      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/index.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -836004,9 +836319,9 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "OcOZ",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-          "name": "./node_modules/@popperjs/core/lib/popper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         }
       ],
       "failed": false,
@@ -859562,9 +859877,9 @@
         "controls-test-web-part",
         "ootb-fields-field-customizer"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
-      "issuerId": "OQ9B",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
+      "issuerId": "uz3O",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -859597,9 +859912,9 @@
           "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
         },
         {
-          "id": "OQ9B",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.base.js"
+          "id": "uz3O",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/PlainCard/PlainCard.base.js"
         }
       ],
       "failed": false,
@@ -865373,14 +865688,29 @@
           "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
         },
         {
-          "id": "E19z",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/index.js",
-          "name": "./node_modules/@fluentui/styles/dist/es/index.js"
+          "id": "bF8i",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js"
         },
         {
-          "id": "/3ou",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/mergeThemes.js",
-          "name": "./node_modules/@fluentui/styles/dist/es/mergeThemes.js"
+          "id": "A/h+",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js"
+        },
+        {
+          "id": "eVVe",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js"
+        },
+        {
+          "id": "7X27",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/index.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/index.js"
+        },
+        {
+          "id": "cN41",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js"
         },
         {
           "id": "bNQv",
@@ -872211,6 +872541,24 @@
           "userRequest": "office-ui-fabric-react/lib/Button",
           "loc": "140:36-52"
         },
+        {
+          "moduleId": "zgIZ",
+          "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+          "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "type": "harmony side effect evaluation",
+          "userRequest": "office-ui-fabric-react/lib/Button",
+          "loc": "19:0-63"
+        },
+        {
+          "moduleId": "zgIZ",
+          "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+          "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "type": "harmony import specifier",
+          "userRequest": "office-ui-fabric-react/lib/Button",
+          "loc": "289:92-102"
+        },
         {
           "moduleId": "zjyg",
           "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubbleContent.base.js",
@@ -872996,9 +873344,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/index.js",
-      "issuerId": "hrTv",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Pivot/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js",
+      "issuerId": "sLz2",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -873029,6 +873377,16 @@
           "id": "hrTv",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/Pivot/index.js"
+        },
+        {
+          "id": "8X3N",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.js"
+        },
+        {
+          "id": "sLz2",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Pivot/Pivot.base.js"
         }
       ],
       "failed": false,
@@ -874714,9 +875072,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
-      "issuerId": "oave",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
+      "issuerId": "J64e",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -874747,11 +875105,6 @@
           "id": "J64e",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js"
-        },
-        {
-          "id": "oave",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js"
         }
       ],
       "failed": false,
@@ -875249,9 +875602,9 @@
         "controls-test-web-part",
         "ootb-fields-field-customizer"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-      "issuerId": "K0tY",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+      "issuerId": "uAzL",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -875282,6 +875635,16 @@
           "id": "K0tY",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+        },
+        {
+          "id": "II1S",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+        },
+        {
+          "id": "uAzL",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
         }
       ],
       "failed": false,
@@ -877859,9 +878222,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/instanceOf.js",
-      "issuerId": "J2fa",
-      "issuerName": "./node_modules/@popperjs/core/lib/dom-utils/instanceOf.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/eventListeners.js",
+      "issuerId": "rW7i",
+      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/eventListeners.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -877914,14 +878277,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
-          "id": "J2fa",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/dom-utils/instanceOf.js",
-          "name": "./node_modules/@popperjs/core/lib/dom-utils/instanceOf.js"
+          "id": "rW7i",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/eventListeners.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/eventListeners.js"
         }
       ],
       "failed": false,
@@ -900626,9 +900989,9 @@
           "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
-          "id": "lDWV",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+          "id": "CSm3",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
         },
         {
           "id": "titc",
@@ -926029,7 +926392,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "office-ui-fabric-react/lib/Utilities",
-          "loc": "25:0-66"
+          "loc": "26:0-66"
         },
         {
           "moduleId": "zgIZ",
@@ -926038,7 +926401,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/Utilities",
-          "loc": "202:26-31"
+          "loc": "203:26-31"
         },
         {
           "moduleId": "zgIZ",
@@ -926047,7 +926410,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "office-ui-fabric-react/lib/Utilities",
-          "loc": "254:63-66"
+          "loc": "263:63-66"
         },
         {
           "moduleId": "zjyg",
@@ -959620,9 +959983,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-      "issuerId": "lDWV",
-      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/flip.js",
+      "issuerId": "7LKL",
+      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/flip.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -959680,9 +960043,9 @@
           "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
-          "id": "lDWV",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+          "id": "7LKL",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/flip.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/flip.js"
         }
       ],
       "failed": false,
@@ -961646,7 +962009,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "@microsoft/sp-lodash-subset",
-          "loc": "216:13-20"
+          "loc": "217:13-20"
         },
         {
           "moduleId": "zpkR",
@@ -961990,9 +962353,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
+        },
+        {
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
         },
         {
           "id": "thf+",
@@ -1001459,7 +1001827,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "../errorMessage/ErrorMessage",
-          "loc": "19:0-56"
+          "loc": "20:0-56"
         },
         {
           "moduleId": "zgIZ",
@@ -1001468,7 +1001836,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "../errorMessage/ErrorMessage",
-          "loc": "281:32-44"
+          "loc": "291:32-44"
         }
       ],
       "providedExports": [
@@ -1012289,6 +1012657,16 @@
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
         },
+        {
+          "id": "II1S",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+        },
+        {
+          "id": "uAzL",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
+        },
         {
           "id": "aXXY",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/ExpandingCard.js",
@@ -1016058,9 +1016436,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/withThemeFactory.js",
-      "issuerId": "g7Om",
-      "issuerName": "./node_modules/fela-bindings/es/withThemeFactory.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/connectFactory.js",
+      "issuerId": "GWlu",
+      "issuerName": "./node_modules/fela-bindings/es/connectFactory.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1016113,9 +1016491,9 @@
           "name": "./node_modules/fela-bindings/es/index.js"
         },
         {
-          "id": "g7Om",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/withThemeFactory.js",
-          "name": "./node_modules/fela-bindings/es/withThemeFactory.js"
+          "id": "GWlu",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-bindings/es/connectFactory.js",
+          "name": "./node_modules/fela-bindings/es/connectFactory.js"
         }
       ],
       "failed": false,
@@ -1016782,16 +1017160,6 @@
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js"
         },
-        {
-          "id": "nrwl",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js"
-        },
-        {
-          "id": "MdIn",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js"
-        },
         {
           "id": "x2if",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/ShimmerElementsGroup/ShimmerElementsGroup.js",
@@ -1044306,9 +1044674,9 @@
         "controls-test-web-part",
         "ootb-fields-field-customizer"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
-      "issuerId": "K0tY",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+      "issuerId": "uAzL",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1044339,6 +1044707,16 @@
           "id": "K0tY",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/index.js"
+        },
+        {
+          "id": "II1S",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.js"
+        },
+        {
+          "id": "uAzL",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/HoverCard/HoverCard.base.js"
         }
       ],
       "failed": false,
@@ -1048644,9 +1049022,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/mergeThemes.js",
-      "issuerId": "/3ou",
-      "issuerName": "./node_modules/@fluentui/styles/dist/es/mergeThemes.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
+      "issuerId": "cN41",
+      "issuerName": "./node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1048664,14 +1049042,29 @@
           "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
         },
         {
-          "id": "E19z",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/index.js",
-          "name": "./node_modules/@fluentui/styles/dist/es/index.js"
+          "id": "bF8i",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/index.js"
         },
         {
-          "id": "/3ou",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/styles/dist/es/mergeThemes.js",
-          "name": "./node_modules/@fluentui/styles/dist/es/mergeThemes.js"
+          "id": "A/h+",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams-high-contrast/siteVariables.js"
+        },
+        {
+          "id": "eVVe",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/themes/teams/siteVariables.js"
+        },
+        {
+          "id": "7X27",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/index.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/index.js"
+        },
+        {
+          "id": "cN41",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/utils/htmlPropsUtils.js"
         }
       ],
       "failed": false,
@@ -1107022,7 +1107415,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "252:22-41"
+          "loc": "261:22-41"
         },
         {
           "moduleId": "zgIZ",
@@ -1107031,7 +1107424,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "254:23-42"
+          "loc": "263:23-42"
         },
         {
           "moduleId": "zgIZ",
@@ -1107040,7 +1107433,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "255:40-59"
+          "loc": "264:40-59"
         },
         {
           "moduleId": "zgIZ",
@@ -1107049,7 +1107442,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "256:20-39"
+          "loc": "265:20-39"
         },
         {
           "moduleId": "zgIZ",
@@ -1107058,7 +1107451,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "257:16-35"
+          "loc": "266:16-35"
         },
         {
           "moduleId": "zgIZ",
@@ -1107067,7 +1107460,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "258:20-39"
+          "loc": "267:20-39"
         },
         {
           "moduleId": "zgIZ",
@@ -1107076,7 +1107469,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "259:24-43"
+          "loc": "268:24-43"
         },
         {
           "moduleId": "zgIZ",
@@ -1107085,7 +1107478,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "260:20-39"
+          "loc": "269:20-39"
         },
         {
           "moduleId": "zgIZ",
@@ -1107094,7 +1107487,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "261:24-43"
+          "loc": "270:24-43"
         },
         {
           "moduleId": "zgIZ",
@@ -1107103,7 +1107496,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "262:20-39"
+          "loc": "271:20-39"
         },
         {
           "moduleId": "zgIZ",
@@ -1107112,7 +1107505,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "263:24-43"
+          "loc": "272:24-43"
         },
         {
           "moduleId": "zgIZ",
@@ -1107121,7 +1107514,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "264:36-55"
+          "loc": "273:36-55"
         },
         {
           "moduleId": "zgIZ",
@@ -1107130,7 +1107523,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "265:24-43"
+          "loc": "274:24-43"
         },
         {
           "moduleId": "zgIZ",
@@ -1107139,7 +1107532,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "266:36-55"
+          "loc": "275:36-55"
         },
         {
           "moduleId": "zgIZ",
@@ -1107148,7 +1107541,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "267:24-43"
+          "loc": "276:24-43"
         },
         {
           "moduleId": "zgIZ",
@@ -1107157,7 +1107550,16 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "270:16-35"
+          "loc": "279:16-35"
+        },
+        {
+          "moduleId": "zgIZ",
+          "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+          "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "type": "harmony import specifier",
+          "userRequest": "react",
+          "loc": "280:21-40"
         },
         {
           "moduleId": "zgIZ",
@@ -1107166,7 +1107568,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "271:21-40"
+          "loc": "281:12-31"
         },
         {
           "moduleId": "zgIZ",
@@ -1107175,7 +1107577,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "272:12-31"
+          "loc": "282:16-35"
         },
         {
           "moduleId": "zgIZ",
@@ -1107184,7 +1107586,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "273:16-35"
+          "loc": "283:45-64"
         },
         {
           "moduleId": "zgIZ",
@@ -1107193,7 +1107595,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "274:45-64"
+          "loc": "284:24-43"
         },
         {
           "moduleId": "zgIZ",
@@ -1107202,7 +1107604,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "275:24-43"
+          "loc": "285:20-39"
         },
         {
           "moduleId": "zgIZ",
@@ -1107211,7 +1107613,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "276:20-39"
+          "loc": "286:24-43"
         },
         {
           "moduleId": "zgIZ",
@@ -1107220,7 +1107622,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "277:24-43"
+          "loc": "289:72-91"
         },
         {
           "moduleId": "zgIZ",
@@ -1107229,7 +1107631,25 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "281:12-31"
+          "loc": "289:206-225"
+        },
+        {
+          "moduleId": "zgIZ",
+          "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+          "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "type": "harmony import specifier",
+          "userRequest": "react",
+          "loc": "289:226-240"
+        },
+        {
+          "moduleId": "zgIZ",
+          "moduleIdentifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/source-map-loader/index.js!/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/lib/controls/dateTimePicker/DateTimePicker.js",
+          "module": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
+          "type": "harmony import specifier",
+          "userRequest": "react",
+          "loc": "291:12-31"
         },
         {
           "moduleId": "zgIZ",
@@ -1107238,7 +1107658,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "react",
-          "loc": "284:2-17"
+          "loc": "294:2-17"
         },
         {
           "moduleId": "zjyg",
@@ -1107724,7 +1108144,7 @@
       ],
       "optimizationBailout": [],
       "depth": 4,
-      "source": "export var version = \"3.9.0-beta.2292972\";\n"
+      "source": "export var version = \"3.9.0-beta.2437259\";\n"
     },
     {
       "id": "cLrF",
@@ -1127722,9 +1128142,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
+        },
+        {
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
         },
         {
           "id": "thf+",
@@ -1129059,9 +1129484,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/index.js",
-      "issuerId": "zY6E",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Rating/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js",
+      "issuerId": "xuuw",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1129092,6 +1129517,16 @@
           "id": "zY6E",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/Rating/index.js"
+        },
+        {
+          "id": "ulwq",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/Rating.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Rating/Rating.js"
+        },
+        {
+          "id": "xuuw",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Rating/Rating.base.js"
         }
       ],
       "failed": false,
@@ -1137345,9 +1137780,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
+        },
+        {
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
         },
         {
           "id": "thf+",
@@ -1140621,9 +1141061,9 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "OcOZ",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-          "name": "./node_modules/@popperjs/core/lib/popper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
           "id": "CSm3",
@@ -1145791,9 +1146231,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/cssifyKeyframe.js",
-      "issuerId": "NSkR",
-      "issuerName": "./node_modules/fela/es/cssifyKeyframe.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-utils/es/cssifySupportRules.js",
+      "issuerId": "2sYF",
+      "issuerName": "./node_modules/fela-utils/es/cssifySupportRules.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1145831,19 +1146271,19 @@
           "name": "./node_modules/@fluentui/react-northstar-fela-renderer/dist/es/createFelaRenderer.js"
         },
         {
-          "id": "2hpN",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/index.js",
-          "name": "./node_modules/fela/es/index.js"
+          "id": "BsSX",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar-fela-renderer/dist/es/felaStylisEnhancer.js",
+          "name": "./node_modules/@fluentui/react-northstar-fela-renderer/dist/es/felaStylisEnhancer.js"
         },
         {
-          "id": "BULa",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/createRenderer.js",
-          "name": "./node_modules/fela/es/createRenderer.js"
+          "id": "UdC7",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-utils/es/index.js",
+          "name": "./node_modules/fela-utils/es/index.js"
         },
         {
-          "id": "NSkR",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela/es/cssifyKeyframe.js",
-          "name": "./node_modules/fela/es/cssifyKeyframe.js"
+          "id": "2sYF",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/fela-utils/es/cssifySupportRules.js",
+          "name": "./node_modules/fela-utils/es/cssifySupportRules.js"
         }
       ],
       "failed": false,
@@ -1163649,9 +1164089,9 @@
         "controls-test-web-part",
         "ootb-fields-field-customizer"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-      "issuerId": "fCK1",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+      "issuerId": "16Wd",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1163669,14 +1164109,14 @@
           "name": "./node_modules/office-ui-fabric-react/lib/components/Button/index.js"
         },
         {
-          "id": "2WvF",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.js"
+          "id": "Cv5W",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.js"
         },
         {
-          "id": "fCK1",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/IconButton/IconButton.styles.js"
+          "id": "16Wd",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/Button/CompoundButton/CompoundButton.styles.js"
         }
       ],
       "failed": false,
@@ -1164367,7 +1164807,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": ".",
-          "loc": "26:0-42"
+          "loc": "27:0-42"
         },
         {
           "moduleId": "zgIZ",
@@ -1164376,7 +1164816,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": ".",
-          "loc": "245:774-795"
+          "loc": "254:774-795"
         }
       ],
       "providedExports": null,
@@ -1177674,9 +1178114,9 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "OcOZ",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-          "name": "./node_modules/@popperjs/core/lib/popper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
           "id": "CSm3",
@@ -1184520,9 +1184960,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
+        },
+        {
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
         },
         {
           "id": "thf+",
@@ -1185104,9 +1185549,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
+        },
+        {
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
         },
         {
           "id": "thf+",
@@ -1186809,7 +1187259,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "./MinutesComponent",
-          "loc": "22:0-50"
+          "loc": "23:0-50"
         },
         {
           "moduleId": "zgIZ",
@@ -1186818,7 +1187268,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./MinutesComponent",
-          "loc": "263:44-60"
+          "loc": "272:44-60"
         }
       ],
       "providedExports": [
@@ -1206250,11 +1206700,6 @@
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/index.js"
         },
-        {
-          "id": "oave",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.js"
-        },
         {
           "id": "GR0N",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/KeytipLayer/KeytipLayer.base.js",
@@ -1209395,9 +1209840,9 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "OcOZ",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
-          "name": "./node_modules/@popperjs/core/lib/popper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
           "id": "CSm3",
@@ -1220444,9 +1220889,9 @@
           "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
-          "id": "lDWV",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+          "id": "CSm3",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
         },
         {
           "id": "titc",
@@ -1225483,9 +1225928,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/index.js",
-      "issuerId": "XyXI",
-      "issuerName": "./node_modules/@fluentui/react-northstar/dist/es/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
+      "issuerId": "ntjI",
+      "issuerName": "./node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1225501,6 +1225946,11 @@
           "id": "XyXI",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/index.js",
           "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
+        },
+        {
+          "id": "ntjI",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js"
         }
       ],
       "failed": false,
@@ -1226363,9 +1226813,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-      "issuerId": "bO7i",
-      "issuerName": "./node_modules/@popperjs/core/lib/createPopper.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/offset.js",
+      "issuerId": "mDVL",
+      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/offset.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1226418,9 +1226868,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "HnbP",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/index.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
+        },
+        {
+          "id": "mDVL",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/offset.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/offset.js"
         }
       ],
       "failed": false,
@@ -1227832,9 +1228287,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-      "issuerId": "bO7i",
-      "issuerName": "./node_modules/@popperjs/core/lib/createPopper.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+      "issuerId": "HWy5",
+      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/hide.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1227887,9 +1228342,14 @@
           "name": "./node_modules/@popperjs/core/lib/index.js"
         },
         {
-          "id": "bO7i",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/createPopper.js",
-          "name": "./node_modules/@popperjs/core/lib/createPopper.js"
+          "id": "OcOZ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/popper.js",
+          "name": "./node_modules/@popperjs/core/lib/popper.js"
+        },
+        {
+          "id": "HWy5",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/hide.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/hide.js"
         }
       ],
       "failed": false,
@@ -1228093,9 +1228553,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-      "issuerId": "lDWV",
-      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+      "issuerId": "CSm3",
+      "issuerName": "./node_modules/@popperjs/core/lib/modifiers/arrow.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1228153,9 +1228613,9 @@
           "name": "./node_modules/@popperjs/core/lib/modifiers/index.js"
         },
         {
-          "id": "lDWV",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/preventOverflow.js",
-          "name": "./node_modules/@popperjs/core/lib/modifiers/preventOverflow.js"
+          "id": "CSm3",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@popperjs/core/lib/modifiers/arrow.js",
+          "name": "./node_modules/@popperjs/core/lib/modifiers/arrow.js"
         }
       ],
       "failed": false,
@@ -1245985,7 +1246445,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "68:51-65"
+          "loc": "69:51-65"
         },
         {
           "moduleId": "zgIZ",
@@ -1245994,7 +1246454,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "186:51-65"
+          "loc": "187:51-65"
         },
         {
           "moduleId": "zgIZ",
@@ -1246003,7 +1246463,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "188:51-65"
+          "loc": "189:51-65"
         },
         {
           "moduleId": "zgIZ",
@@ -1246012,7 +1246472,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "228:39-53"
+          "loc": "229:39-53"
         },
         {
           "moduleId": "zgIZ",
@@ -1246021,7 +1246481,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "229:41-55"
+          "loc": "230:41-55"
         },
         {
           "moduleId": "zgIZ",
@@ -1246030,7 +1246490,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "230:41-55"
+          "loc": "231:41-55"
         },
         {
           "moduleId": "zgIZ",
@@ -1246039,7 +1246499,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "245:164-178"
+          "loc": "254:164-178"
         },
         {
           "moduleId": "zgIZ",
@@ -1246048,7 +1246508,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimeConventions",
-          "loc": "253:31-45"
+          "loc": "262:31-45"
         }
       ],
       "providedExports": [
@@ -1253264,9 +1253724,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
-      "issuerId": "MdIn",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
+      "issuerId": "XrpE",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1253297,16 +1253757,6 @@
           "id": "XrpE",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/index.js"
-        },
-        {
-          "id": "nrwl",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.js"
-        },
-        {
-          "id": "MdIn",
-          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js",
-          "name": "./node_modules/office-ui-fabric-react/lib/components/Shimmer/Shimmer.base.js"
         }
       ],
       "failed": false,
@@ -1253479,6 +1253929,11 @@
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/index.js",
           "name": "./node_modules/@fluentui/react-northstar/dist/es/index.js"
         },
+        {
+          "id": "ntjI",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js",
+          "name": "./node_modules/@fluentui/react-northstar/dist/es/components/SplitButton/SplitButton.js"
+        },
         {
           "id": "tJ6w",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/@fluentui/react-northstar/dist/es/components/MenuButton/MenuButton.js",
@@ -1255046,7 +1255501,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "../../common/telemetry",
-          "loc": "24:0-52"
+          "loc": "25:0-52"
         },
         {
           "moduleId": "zgIZ",
@@ -1255055,7 +1255510,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "../../common/telemetry",
-          "loc": "185:8-23"
+          "loc": "186:8-23"
         }
       ],
       "providedExports": [
@@ -1268160,9 +1268615,9 @@
       "chunks": [
         "controls-test-web-part"
       ],
-      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js",
-      "issuerId": "7rHc",
-      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js",
+      "issuer": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js",
+      "issuerId": "xbjQ",
+      "issuerName": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js",
       "issuerPath": [
         {
           "id": "G6oG",
@@ -1268193,6 +1268648,16 @@
           "id": "7rHc",
           "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js",
           "name": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/index.js"
+        },
+        {
+          "id": "7XQV",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.js"
+        },
+        {
+          "id": "xbjQ",
+          "identifier": "/home/runner/work/sp-dev-fx-controls-react/sp-dev-fx-controls-react/node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js",
+          "name": "./node_modules/office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubble.base.js"
         }
       ],
       "failed": false,
@@ -1272953,7 +1273418,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "./HoursComponent",
-          "loc": "21:0-46"
+          "loc": "22:0-46"
         },
         {
           "moduleId": "zgIZ",
@@ -1272962,7 +1273427,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./HoursComponent",
-          "loc": "259:44-58"
+          "loc": "268:44-58"
         }
       ],
       "providedExports": [
@@ -1273048,7 +1273513,7 @@
       "name": "./lib/controls/dateTimePicker/DateTimePicker.js",
       "index": 2525,
       "index2": 2543,
-      "size": 15326,
+      "size": 15978,
       "cacheable": true,
       "built": true,
       "optional": false,
@@ -1273110,7 +1273575,7 @@
       ],
       "optimizationBailout": [],
       "depth": 4,
-      "source": "var __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nimport * as React from \"react\";\nimport { isEqual } from '@microsoft/sp-lodash-subset';\nimport { TimeConvention, DateConvention } from \"./DateTimeConventions\";\nimport { DatePicker } from \"office-ui-fabric-react/lib/DatePicker\";\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\nimport ErrorMessage from \"../errorMessage/ErrorMessage\";\nimport styles from \"./DateTimePicker.module.scss\";\nimport HoursComponent from \"./HoursComponent\";\nimport MinutesComponent from \"./MinutesComponent\";\nimport SecondsComponent from \"./SecondsComponent\";\nimport * as telemetry from \"../../common/telemetry\";\nimport { Async, css } from 'office-ui-fabric-react/lib/Utilities';\nimport { DateTimePickerStrings } from \".\";\nimport { TimeHelper } from \"./TimeHelper\";\nimport { TimeDisplayControlType } from \"./TimeDisplayControlType\";\n/**\n * Renders the controls for DateTimePicker component\n */\nvar DateTimePicker = /** @class */ (function (_super) {\n    __extends(DateTimePicker, _super);\n    /**\n     * Constructor\n     */\n    function DateTimePicker(props) {\n        var _this = _super.call(this, props) || this;\n        _this._latestValidateValue = NaN;\n        /**\n         * Function called when the DatePicker Office UI Fabric component selected date changed\n         */\n        _this.onSelectDate = function (date) {\n            if (!TimeHelper.isValidDate(date)) {\n                return;\n            }\n            // Get hours, minutes and seconds from state or default to zero\n            var _a = _this.state, _b = _a.hours, hours = _b === void 0 ? 0 : _b, _c = _a.minutes, minutes = _c === void 0 ? 0 : _c, _d = _a.seconds, seconds = _d === void 0 ? 0 : _d;\n            var day = TimeHelper.cloneDate(date);\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n            _this.setState({ day: day }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when hours value have been changed\n         * @param element Hours dropdown value\n         */\n        _this.dropdownHoursChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var hoursSplit = value.split(\" \");\n                var hoursValue = hoursSplit[0].length > 2 ? hoursSplit[0].substring(0, 2) : hoursSplit[0];\n                var hours = parseInt(hoursValue);\n                if (isNaN(hours)) {\n                    return;\n                }\n                if (_this.props.timeConvention !== TimeConvention.Hours24) {\n                    if (hoursSplit[1] && hoursSplit[1].toLowerCase().indexOf(\"pm\") !== -1) {\n                        hours += 12;\n                        if (hours === 24) {\n                            //this is noon - set to 12 not 0\n                            //hours = 0;\n                            hours = 12;\n                        }\n                    }\n                    else if (hours === 12) {\n                        //am - if hours == 12, set hours to 0 here\n                        hours = 0;\n                    }\n                }\n                if (hours > 23) {\n                    return;\n                }\n                var state = { hours: hours };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setHours(hours);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when minutes value have been changed\n         * @param element Minutes dropdown value\n         */\n        _this.dropdownMinutesChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var minutes = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { minutes: minutes };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setMinutes(minutes);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when seconds value have been changed\n         * @param element Seconds dropdown value\n         */\n        _this.dropdownSecondsChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var seconds = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { seconds: seconds };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setSeconds(seconds);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Validates string input on date time field\n         */\n        _this.handleTextChange = function (e, newValue, locString) {\n            if (!TimeHelper.isValidDate(newValue)) {\n                _this.setState({\n                    errorMessage: locString,\n                });\n                return;\n            }\n        };\n        /**\n         * Validates the new custom field value\n         */\n        _this.validate = function (dateVal) {\n            if (typeof _this.props.onGetErrorMessage === 'undefined' || _this.props.onGetErrorMessage === null) {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n                return;\n            }\n            var timestamp = dateVal.getTime();\n            if (_this._latestValidateValue === timestamp) {\n                return;\n            }\n            _this._latestValidateValue = timestamp;\n            var result = _this.props.onGetErrorMessage(dateVal);\n            if (typeof result !== 'undefined') {\n                if (typeof result === 'string') {\n                    if (result === '') {\n                        _this.notifyAfterValidate(_this.props.value, dateVal);\n                    }\n                    _this.setState({\n                        errorMessage: result\n                    });\n                }\n                else {\n                    result.then(function (errorMessage) {\n                        if (typeof errorMessage === 'undefined' || errorMessage === '') {\n                            _this.notifyAfterValidate(_this.props.value, dateVal);\n                        }\n                        _this.setState({\n                            errorMessage: errorMessage\n                        });\n                    });\n                }\n            }\n            else {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n            }\n        };\n        /**\n         * Notifies the parent Web Part of a property value change\n         */\n        _this.notifyAfterValidate = function (oldValue, newValue) {\n            if (typeof _this.props.onChange !== 'undefined' && _this.props.onChange !== null && newValue !== null) {\n                _this.props.onChange(newValue);\n            }\n        };\n        telemetry.track('ReactDateTimePicker', {\n            dateConvention: props.dateConvention ? DateConvention[props.dateConvention] : '',\n            formatDate: !!props.formatDate,\n            timeConvention: props.timeConvention ? TimeConvention[props.timeConvention] : '',\n            disabled: props.disabled\n        });\n        // Get the current date/time values\n        var _a = _this.props.value, value = _a === void 0 ? null : _a;\n        var _b = DateTimePicker.getDateComponents(value, props.dateConvention), day = _b.day, hours = _b.hours, minutes = _b.minutes, seconds = _b.seconds;\n        // Set the current state\n        _this.state = {\n            day: day,\n            hours: hours,\n            minutes: minutes,\n            seconds: seconds,\n            errorMessage: ''\n        };\n        _this.async = new Async(_this);\n        _this.delayedValidate = _this.async.debounce(_this.validate, props.deferredValidationTime);\n        return _this;\n    }\n    /**\n     * Called when the component will unmount\n     */\n    DateTimePicker.prototype.componentWillUnmount = function () {\n        this.async.dispose();\n    };\n    /**\n     * Called before the component receives new props, used for matching state with new props.\n     */\n    DateTimePicker.prototype.componentWillReceiveProps = function (nextProps) {\n        if (!isEqual(nextProps.value, this.props.value)) {\n            var _a = DateTimePicker.getDateComponents(nextProps.value, this.props.dateConvention), day = _a.day, hours = _a.hours, minutes = _a.minutes, seconds = _a.seconds;\n            this.setState({ day: day, hours: hours, minutes: minutes, seconds: seconds });\n        }\n    };\n    /**\n     * Get the components of a Date object matching the DateConvention settings\n     * @param date Date to extract components from\n     * @param dateConvention DateConvention to follow when extracting date components\n     */\n    DateTimePicker.getDateComponents = function (date, dateConvention) {\n        var day = TimeHelper.cloneDate(date);\n        var hours = dateConvention !== DateConvention.Date && day !== null ? day.getHours() : 0;\n        var minutes = dateConvention !== DateConvention.Date && day !== null ? day.getMinutes() : 0;\n        var seconds = dateConvention !== DateConvention.Date && day !== null ? day.getSeconds() : 0;\n        if (day !== null) {\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n        }\n        return { day: day, hours: hours, minutes: minutes, seconds: seconds };\n    };\n    /**\n     * Renders the control\n     */\n    DateTimePicker.prototype.render = function () {\n        var _this = this;\n        // use date value from props if it exists, otherwise use internal state\n        // if no dateConvention is set, default is DateConvention.DateTime\n        var _a = this.props, label = _a.label, disabled = _a.disabled, timeConvention = _a.timeConvention, _b = _a.dateConvention, dateConvention = _b === void 0 ? DateConvention.DateTime : _b, firstDayOfWeek = _a.firstDayOfWeek, _c = _a.isMonthPickerVisible, isMonthPickerVisible = _c === void 0 ? true : _c, showGoToToday = _a.showGoToToday, _d = _a.allowTextInput, allowTextInput = _d === void 0 ? true : _d, _e = _a.showMonthPickerAsOverlay, showMonthPickerAsOverlay = _e === void 0 ? false : _e, _f = _a.showWeekNumbers, showWeekNumbers = _f === void 0 ? false : _f, _g = _a.showSeconds, showSeconds = _g === void 0 ? false : _g, formatDate = _a.formatDate, _h = _a.value, value = _h === void 0 ? this.state.day : _h, _j = _a.strings, dateStrings = _j === void 0 ? new DateTimePickerStrings() : _j, // Defines the DatePicker control labels\n        timeDisplayControlType = _a.timeDisplayControlType, placeholder = _a.placeholder, showLabels = _a.showLabels, minDate = _a.minDate, maxDate = _a.maxDate, minutesIncrementStep = _a.minutesIncrementStep;\n        var textErrorMessage = dateStrings.textErrorMessage;\n        var hours = value != null ? value.getHours() : this.state.hours;\n        var minutes = value != null ? value.getMinutes() : this.state.minutes;\n        var seconds = value != null ? value.getSeconds() : this.state.seconds;\n        // Check if the time element needs to be rendered\n        var timeElm = React.createElement(\"div\", { className: \"hidden\" });\n        if (dateConvention === DateConvention.DateTime) {\n            timeElm = (React.createElement(\"div\", { className: css(styles.row, styles.timeRow) },\n                showLabels !== false && React.createElement(\"div\", { className: styles.labelCell },\n                    React.createElement(Label, { className: styles.fieldLabel }, dateStrings.timeLabel)),\n                React.createElement(\"div\", { className: styles.time },\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(HoursComponent, { disabled: disabled, timeConvention: timeConvention, value: hours, onChange: this.dropdownHoursChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator)),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(MinutesComponent, { disabled: disabled, value: minutes, minutesIncrementStep: minutesIncrementStep, onChange: this.dropdownMinutesChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    showSeconds && (React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator))),\n                    showSeconds && (React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(SecondsComponent, { disabled: disabled, value: seconds, onChange: this.dropdownSecondsChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text }))))));\n        }\n        // Renders content\n        return (React.createElement(\"div\", { className: styles.dateTimePicker },\n            label && React.createElement(Label, null, label),\n            React.createElement(\"div\", { className: styles.container },\n                React.createElement(\"div\", { className: styles.row },\n                    showLabels !== false && (React.createElement(\"div\", { className: styles.labelCell },\n                        React.createElement(Label, { className: styles.fieldLabel }, dateStrings.dateLabel))),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(DatePicker, { formatDate: formatDate, disabled: disabled, value: value, strings: dateStrings, isMonthPickerVisible: isMonthPickerVisible, onSelectDate: this.onSelectDate, allowTextInput: allowTextInput, firstDayOfWeek: firstDayOfWeek, showGoToToday: showGoToToday, showMonthPickerAsOverlay: showMonthPickerAsOverlay, showWeekNumbers: showWeekNumbers, placeholder: placeholder, minDate: minDate, maxDate: maxDate, textField: {\n                                onChange: function (e, newValue) { return _this.handleTextChange(e, newValue, textErrorMessage); }\n                            } }))),\n                timeElm),\n            React.createElement(ErrorMessage, { errorMessage: this.state.errorMessage })));\n    };\n    return DateTimePicker;\n}(React.Component));\nexport { DateTimePicker };\n"
+      "source": "var __extends = (this && this.__extends) || (function () {\n    var extendStatics = function (d, b) {\n        extendStatics = Object.setPrototypeOf ||\n            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n        return extendStatics(d, b);\n    };\n    return function (d, b) {\n        extendStatics(d, b);\n        function __() { this.constructor = d; }\n        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n    };\n})();\nimport * as React from \"react\";\nimport { isEqual } from '@microsoft/sp-lodash-subset';\nimport { TimeConvention, DateConvention } from \"./DateTimeConventions\";\nimport { DatePicker } from \"office-ui-fabric-react/lib/DatePicker\";\nimport { Label } from \"office-ui-fabric-react/lib/Label\";\nimport { IconButton } from \"office-ui-fabric-react/lib/Button\";\nimport ErrorMessage from \"../errorMessage/ErrorMessage\";\nimport styles from \"./DateTimePicker.module.scss\";\nimport HoursComponent from \"./HoursComponent\";\nimport MinutesComponent from \"./MinutesComponent\";\nimport SecondsComponent from \"./SecondsComponent\";\nimport * as telemetry from \"../../common/telemetry\";\nimport { Async, css } from 'office-ui-fabric-react/lib/Utilities';\nimport { DateTimePickerStrings } from \".\";\nimport { TimeHelper } from \"./TimeHelper\";\nimport { TimeDisplayControlType } from \"./TimeDisplayControlType\";\n/**\n * Renders the controls for DateTimePicker component\n */\nvar DateTimePicker = /** @class */ (function (_super) {\n    __extends(DateTimePicker, _super);\n    /**\n     * Constructor\n     */\n    function DateTimePicker(props) {\n        var _this = _super.call(this, props) || this;\n        _this._latestValidateValue = NaN;\n        /**\n         * Function called when the DatePicker Office UI Fabric component selected date changed\n         */\n        _this.onSelectDate = function (date) {\n            if (!TimeHelper.isValidDate(date)) {\n                return;\n            }\n            // Get hours, minutes and seconds from state or default to zero\n            var _a = _this.state, _b = _a.hours, hours = _b === void 0 ? 0 : _b, _c = _a.minutes, minutes = _c === void 0 ? 0 : _c, _d = _a.seconds, seconds = _d === void 0 ? 0 : _d;\n            var day = TimeHelper.cloneDate(date);\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n            _this.setState({ day: day }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when hours value have been changed\n         * @param element Hours dropdown value\n         */\n        _this.dropdownHoursChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var hoursSplit = value.split(\" \");\n                var hoursValue = hoursSplit[0].length > 2 ? hoursSplit[0].substring(0, 2) : hoursSplit[0];\n                var hours = parseInt(hoursValue);\n                if (isNaN(hours)) {\n                    return;\n                }\n                if (_this.props.timeConvention !== TimeConvention.Hours24) {\n                    if (hoursSplit[1] && hoursSplit[1].toLowerCase().indexOf(\"pm\") !== -1) {\n                        hours += 12;\n                        if (hours === 24) {\n                            //this is noon - set to 12 not 0\n                            //hours = 0;\n                            hours = 12;\n                        }\n                    }\n                    else if (hours === 12) {\n                        //am - if hours == 12, set hours to 0 here\n                        hours = 0;\n                    }\n                }\n                if (hours > 23) {\n                    return;\n                }\n                var state = { hours: hours };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setHours(hours);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when minutes value have been changed\n         * @param element Minutes dropdown value\n         */\n        _this.dropdownMinutesChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var minutes = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { minutes: minutes };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setMinutes(minutes);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Function called when seconds value have been changed\n         * @param element Seconds dropdown value\n         */\n        _this.dropdownSecondsChanged = function (value) {\n            _this.setState(function (_a) {\n                var day = _a.day;\n                var seconds = parseInt(value.length > 2 ? value.substring(0, 2) : value);\n                var state = { seconds: seconds };\n                var date = TimeHelper.cloneDate(day);\n                if (date) {\n                    date.setSeconds(seconds);\n                    state.day = date;\n                }\n                return state;\n            }, function () { return _this.delayedValidate(_this.state.day); });\n        };\n        /**\n         * Validates string input on date time field\n         */\n        _this.handleTextChange = function (e, newValue, locString) {\n            if (!TimeHelper.isValidDate(newValue)) {\n                _this.setState({\n                    errorMessage: locString,\n                });\n                return;\n            }\n        };\n        /**\n         * Validates the new custom field value\n         */\n        _this.validate = function (dateVal) {\n            if (typeof _this.props.onGetErrorMessage === 'undefined' || _this.props.onGetErrorMessage === null) {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n                return;\n            }\n            var timestamp = dateVal.getTime();\n            if (_this._latestValidateValue === timestamp) {\n                return;\n            }\n            _this._latestValidateValue = timestamp;\n            var result = _this.props.onGetErrorMessage(dateVal);\n            if (typeof result !== 'undefined') {\n                if (typeof result === 'string') {\n                    if (result === '') {\n                        _this.notifyAfterValidate(_this.props.value, dateVal);\n                    }\n                    _this.setState({\n                        errorMessage: result\n                    });\n                }\n                else {\n                    result.then(function (errorMessage) {\n                        if (typeof errorMessage === 'undefined' || errorMessage === '') {\n                            _this.notifyAfterValidate(_this.props.value, dateVal);\n                        }\n                        _this.setState({\n                            errorMessage: errorMessage\n                        });\n                    });\n                }\n            }\n            else {\n                _this.notifyAfterValidate(_this.props.value, dateVal);\n            }\n        };\n        /**\n         * Notifies the parent Web Part of a property value change\n         */\n        _this.notifyAfterValidate = function (oldValue, newValue) {\n            if (typeof _this.props.onChange !== 'undefined' && _this.props.onChange !== null && newValue !== null) {\n                _this.props.onChange(newValue);\n            }\n        };\n        telemetry.track('ReactDateTimePicker', {\n            dateConvention: props.dateConvention ? DateConvention[props.dateConvention] : '',\n            formatDate: !!props.formatDate,\n            timeConvention: props.timeConvention ? TimeConvention[props.timeConvention] : '',\n            disabled: props.disabled\n        });\n        // Get the current date/time values\n        var _a = _this.props.value, value = _a === void 0 ? null : _a;\n        var _b = DateTimePicker.getDateComponents(value, props.dateConvention), day = _b.day, hours = _b.hours, minutes = _b.minutes, seconds = _b.seconds;\n        // Set the current state\n        _this.state = {\n            day: day,\n            hours: hours,\n            minutes: minutes,\n            seconds: seconds,\n            errorMessage: ''\n        };\n        _this.async = new Async(_this);\n        _this.delayedValidate = _this.async.debounce(_this.validate, props.deferredValidationTime);\n        return _this;\n    }\n    /**\n     * Called when the component will unmount\n     */\n    DateTimePicker.prototype.componentWillUnmount = function () {\n        this.async.dispose();\n    };\n    /**\n     * Called before the component receives new props, used for matching state with new props.\n     */\n    DateTimePicker.prototype.componentWillReceiveProps = function (nextProps) {\n        if (!isEqual(nextProps.value, this.props.value)) {\n            var _a = DateTimePicker.getDateComponents(nextProps.value, this.props.dateConvention), day = _a.day, hours = _a.hours, minutes = _a.minutes, seconds = _a.seconds;\n            this.setState({ day: day, hours: hours, minutes: minutes, seconds: seconds });\n        }\n    };\n    /**\n     * Get the components of a Date object matching the DateConvention settings\n     * @param date Date to extract components from\n     * @param dateConvention DateConvention to follow when extracting date components\n     */\n    DateTimePicker.getDateComponents = function (date, dateConvention) {\n        var day = TimeHelper.cloneDate(date);\n        var hours = dateConvention !== DateConvention.Date && day !== null ? day.getHours() : 0;\n        var minutes = dateConvention !== DateConvention.Date && day !== null ? day.getMinutes() : 0;\n        var seconds = dateConvention !== DateConvention.Date && day !== null ? day.getSeconds() : 0;\n        if (day !== null) {\n            day.setHours(hours);\n            day.setMinutes(minutes);\n            day.setSeconds(seconds);\n        }\n        return { day: day, hours: hours, minutes: minutes, seconds: seconds };\n    };\n    /**\n     * Function called from the clearDate iconbutton\n     */\n    DateTimePicker.prototype.clearDate = function () {\n        this.setState({\n            day: null\n        });\n    };\n    /**\n     * Renders the control\n     */\n    DateTimePicker.prototype.render = function () {\n        var _this = this;\n        // use date value from props if it exists, otherwise use internal state\n        // if no dateConvention is set, default is DateConvention.DateTime\n        var _a = this.props, label = _a.label, disabled = _a.disabled, timeConvention = _a.timeConvention, _b = _a.dateConvention, dateConvention = _b === void 0 ? DateConvention.DateTime : _b, firstDayOfWeek = _a.firstDayOfWeek, _c = _a.isMonthPickerVisible, isMonthPickerVisible = _c === void 0 ? true : _c, showGoToToday = _a.showGoToToday, _d = _a.allowTextInput, allowTextInput = _d === void 0 ? true : _d, _e = _a.showMonthPickerAsOverlay, showMonthPickerAsOverlay = _e === void 0 ? false : _e, _f = _a.showWeekNumbers, showWeekNumbers = _f === void 0 ? false : _f, _g = _a.showSeconds, showSeconds = _g === void 0 ? false : _g, formatDate = _a.formatDate, _h = _a.value, value = _h === void 0 ? this.state.day : _h, _j = _a.strings, dateStrings = _j === void 0 ? new DateTimePickerStrings() : _j, // Defines the DatePicker control labels\n        timeDisplayControlType = _a.timeDisplayControlType, placeholder = _a.placeholder, showLabels = _a.showLabels, minDate = _a.minDate, maxDate = _a.maxDate, minutesIncrementStep = _a.minutesIncrementStep, _k = _a.showClearDate, showClearDate = _k === void 0 ? false : _k, _l = _a.showClearDateIcon, showClearDateIcon = _l === void 0 ? 'RemoveEvent' : _l;\n        var textErrorMessage = dateStrings.textErrorMessage;\n        var hours = value != null ? value.getHours() : this.state.hours;\n        var minutes = value != null ? value.getMinutes() : this.state.minutes;\n        var seconds = value != null ? value.getSeconds() : this.state.seconds;\n        // Check if the time element needs to be rendered\n        var timeElm = React.createElement(\"div\", { className: \"hidden\" });\n        if (dateConvention === DateConvention.DateTime) {\n            timeElm = (React.createElement(\"div\", { className: css(styles.row, styles.timeRow) },\n                showLabels !== false && React.createElement(\"div\", { className: styles.labelCell },\n                    React.createElement(Label, { className: styles.fieldLabel }, dateStrings.timeLabel)),\n                React.createElement(\"div\", { className: styles.time },\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(HoursComponent, { disabled: disabled, timeConvention: timeConvention, value: hours, onChange: this.dropdownHoursChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator)),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(MinutesComponent, { disabled: disabled, value: minutes, minutesIncrementStep: minutesIncrementStep, onChange: this.dropdownMinutesChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text })),\n                    showSeconds && (React.createElement(\"div\", { className: styles.separator },\n                        React.createElement(Label, null, dateStrings.timeSeparator))),\n                    showSeconds && (React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(SecondsComponent, { disabled: disabled, value: seconds, onChange: this.dropdownSecondsChanged, timeDisplayControlType: timeDisplayControlType || TimeDisplayControlType.Text }))))));\n        }\n        // Renders content\n        return (React.createElement(\"div\", { className: styles.dateTimePicker },\n            label && React.createElement(Label, null, label),\n            React.createElement(\"div\", { className: styles.container },\n                React.createElement(\"div\", { className: styles.row },\n                    showLabels !== false && (React.createElement(\"div\", { className: styles.labelCell },\n                        React.createElement(Label, { className: styles.fieldLabel }, dateStrings.dateLabel))),\n                    React.createElement(\"div\", { className: styles.picker },\n                        React.createElement(DatePicker, { formatDate: formatDate, disabled: disabled, value: value, strings: dateStrings, isMonthPickerVisible: isMonthPickerVisible, onSelectDate: this.onSelectDate, allowTextInput: allowTextInput, firstDayOfWeek: firstDayOfWeek, showGoToToday: showGoToToday, showMonthPickerAsOverlay: showMonthPickerAsOverlay, showWeekNumbers: showWeekNumbers, placeholder: placeholder, minDate: minDate, maxDate: maxDate, textField: {\n                                onChange: function (e, newValue) { return _this.handleTextChange(e, newValue, textErrorMessage); }\n                            } })),\n                    showClearDate === true && this.state.day !== null ? React.createElement(IconButton, { iconProps: { iconName: showClearDateIcon }, onClick: function () { return _this.clearDate(); } }) : React.createElement(React.Fragment, null)),\n                timeElm),\n            React.createElement(ErrorMessage, { errorMessage: this.state.errorMessage })));\n    };\n    return DateTimePicker;\n}(React.Component));\nexport { DateTimePicker };\n"
     },
     {
       "id": "zgw+",
@@ -1273318,7 +1273783,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony side effect evaluation",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "20:0-50"
+          "loc": "21:0-50"
         },
         {
           "moduleId": "zgIZ",
@@ -1273327,7 +1273792,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "254:67-73"
+          "loc": "263:67-73"
         },
         {
           "moduleId": "zgIZ",
@@ -1273336,7 +1273801,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "254:79-85"
+          "loc": "263:79-85"
         },
         {
           "moduleId": "zgIZ",
@@ -1273345,7 +1273810,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "255:80-86"
+          "loc": "264:80-86"
         },
         {
           "moduleId": "zgIZ",
@@ -1273354,7 +1273819,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "256:60-66"
+          "loc": "265:60-66"
         },
         {
           "moduleId": "zgIZ",
@@ -1273363,7 +1273828,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "257:56-62"
+          "loc": "266:56-62"
         },
         {
           "moduleId": "zgIZ",
@@ -1273372,7 +1273837,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "258:60-66"
+          "loc": "267:60-66"
         },
         {
           "moduleId": "zgIZ",
@@ -1273381,7 +1273846,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "260:60-66"
+          "loc": "269:60-66"
         },
         {
           "moduleId": "zgIZ",
@@ -1273390,7 +1273855,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "262:60-66"
+          "loc": "271:60-66"
         },
         {
           "moduleId": "zgIZ",
@@ -1273399,7 +1273864,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "264:76-82"
+          "loc": "273:76-82"
         },
         {
           "moduleId": "zgIZ",
@@ -1273408,7 +1273873,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "266:76-82"
+          "loc": "275:76-82"
         },
         {
           "moduleId": "zgIZ",
@@ -1273417,7 +1273882,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "270:56-62"
+          "loc": "279:56-62"
         },
         {
           "moduleId": "zgIZ",
@@ -1273426,7 +1273891,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "272:52-58"
+          "loc": "281:52-58"
         },
         {
           "moduleId": "zgIZ",
@@ -1273435,7 +1273900,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "273:56-62"
+          "loc": "282:56-62"
         },
         {
           "moduleId": "zgIZ",
@@ -1273444,7 +1273909,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "274:85-91"
+          "loc": "283:85-91"
         },
         {
           "moduleId": "zgIZ",
@@ -1273453,7 +1273918,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "275:64-70"
+          "loc": "284:64-70"
         },
         {
           "moduleId": "zgIZ",
@@ -1273462,7 +1273927,7 @@
           "moduleName": "./lib/controls/dateTimePicker/DateTimePicker.js",
           "type": "harmony import specifier",
           "userRequest": "./DateTimePicker.module.scss",
-          "loc": "276:60-66"
+          "loc": "285:60-66"
         }
       ],
       "providedExports": [