@servicetitan/design-system 11.5.0 → 11.6.0

package/dist/components/TextArea/index.css

@@ -1,81 +1,19 @@
 /* Hide element visually, keeping it focusable (with keyboard) and available for screen-readers */
 /* Variables */
-/* Form Sizes */
-.Form--mini {
-  font-size: 0.8125rem;
-}
-
-.Form--tiny {
-  font-size: 0.875rem;
-}
-
-.Form--small {
-  font-size: 0.9375rem;
-}
-
-.Form--medium {
-  font-size: 1rem;
-}
-
-.Form--large {
-  font-size: 1.125rem;
-}
-
-.Form--big {
-  font-size: 1.3125rem;
-}
-
-.Form--huge {
-  font-size: 1.4375rem;
-}
-
-.Form--massive {
-  font-size: 1.6875rem;
-}
-
-/* Stretching of Input when placed in a Field */
-.Form .FormField .Input,
-.Form .FormGroup .FormField .Input {
-  width: 100%;
-}
-
-/* Global variables for Input, TextArea, Select */
-/* FormField error */
-/* Backward compatibility with Semantic.React Fields */
-.Fields.Fields--error .Field .Input > input,
-.Fields.Fields--error .Field .TextArea,
-.Field.Field--error .Input > input,
-.Field.Field--error .TextArea {
-  background-color: #ffece9;
-  border-color: #e63717;
-  color: #e63717;
-  box-shadow: none;
-}
-.Fields.Fields--error .Field .Input > input:focus,
-.Fields.Fields--error .Field .TextArea:focus,
-.Field.Field--error .Input > input:focus,
-.Field.Field--error .TextArea:focus {
-  background-color: #ffece9;
-  border-color: #e63717;
-  color: #e63717;
-  box-shadow: none;
-  -webkit-appearance: none;
-}
-
+/* Styling for :autofill pseudo-class */
 .TextArea {
-  /* Variables */
   /* Set color on root of component. It can be overridden after the @include */
   color: var(--colorsTextDefault, #141414);
   /* Make sure font-family goes across entire component */
   font-family: "Nunito Sans", sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
-  background-color: #ffffff;
-  border: 1px solid #dfe0e1;
+  background-color: var(--colorsSurfaceDefault, #ffffff);
+  border: 1px solid var(--colorsBorderGrey, #dfe0e1);
   border-radius: 3px;
   box-shadow: none;
   box-sizing: border-box;
-  color: #040404;
+  color: var(--colorsTextDefault, #141414);
   font-size: 16px;
   outline: none;
   line-height: 1.2857;
@@ -90,55 +28,59 @@
   /* States */
 }
 .TextArea::placeholder {
-  color: rgba(4, 4, 4, 0.4);
+  color: var(--colorsTextDefault, #141414);
+  opacity: 0.4;
 }
 @supports (-moz-appearance: none) {
   .TextArea {
     overflow-x: hidden;
   }
 }
-.TextArea:focus {
-  color: #040404;
-  border-color: #2270ee;
-  background-color: #ffffff;
+.TextArea:focus-within, .TextArea:focus {
+  color: var(--colorsTextDefault, #141414);
+  border-color: var(--colorsBorderPrimary, #2270ee);
+  background-color: var(--colorsSurfaceDefault, #ffffff);
   box-shadow: 0 0 0 3px var(--colorsFocusRingPrimary, #a9d1ff);
   -webkit-appearance: none;
 }
 .TextArea.TextArea--disabled, .TextArea:not(.TextArea--disabled)[disabled] {
-  background-color: #f7f7f7;
+  background-color: var(--colorsSurfaceGreySubdued, #f7f7f7);
   opacity: 0.6;
   pointer-events: none;
 }
 .TextArea[disabled], .TextArea[readonly] {
-  background-color: #f7f7f7;
+  background-color: var(--colorsSurfaceGreySubdued, #f7f7f7);
 }
 .TextArea[readonly]::placeholder {
-  color: rgba(4, 4, 4, 0.4);
+  color: var(--colorsTextDefault, #141414);
+  opacity: 0.4;
+}
+.TextArea:autofill {
+  box-shadow: 0 0 0 100px rgba(255, 190, 0, 0.08) inset !important;
+}
+.TextArea:-webkit-autofill {
+  box-shadow: 0 0 0 100px rgba(255, 190, 0, 0.08) inset !important;
 }
 
 .TextArea.TextArea--error {
-  background-color: #ffece9;
-  border-color: #e63717;
-  color: #e63717;
+  background-color: var(--colorsSurfaceCriticalSubdued, #ffece9);
+  border-color: var(--colorsBorderCritical, #e63717);
+  color: var(--colorsTextCritical, #e63717);
   /* Error Placeholder */
-  /* Error */
-}
-.TextArea.TextArea--error:focus {
-  box-shadow: 0 0 0 3px #ffb2a0;
-  color: #e63717;
 }
-.TextArea.TextArea--error::-webkit-input-placeholder {
-  color: rgba(230, 55, 23, 0.6);
+.TextArea.TextArea--error:focus-within, .TextArea.TextArea--error:focus {
+  box-shadow: 0 0 0 3px var(--colorsFocusRingCritical, #ffb2a0);
+  color: var(--colorsTextCritical, #e63717);
 }
-.TextArea.TextArea--error::-moz-placeholder {
-  color: rgba(230, 55, 23, 0.6);
+.TextArea.TextArea--error::placeholder {
+  color: var(--colorsTextCritical, #e63717);
+  opacity: 0.4;
 }
-.TextArea.TextArea--error:-ms-input-placeholder {
-  color: rgba(230, 55, 23, 0.6);
+.TextArea.TextArea--error:autofill {
+  box-shadow: none !important;
 }
-.TextArea.TextArea--error::-webkit-autofill {
-  box-shadow: 0 0 0 100px #ffece9 inset !important;
-  border-color: #e63717 !important;
+.TextArea.TextArea--error:-webkit-autofill {
+  box-shadow: none !important;
 }
 
 /*# sourceMappingURL=index.css.map */

package/dist/components/TextArea/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Form/Form.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss","../../../src/components/TextArea/TextArea.scss","../../../src/utilities/_component-reset.scss","../../../src/utilities/_font-smoothing.scss"],"names":[],"mappings":"AAAA;ACGA;AAQA;AACA;EAAc;;;AACd;EAAc;;;AACd;EAAe;;;AACf;EAAgB;;;AAChB;EAAe;;;AACf;EAAa;;;AACb;EAAc;;;AACd;EAAiB;;;AAEjB;AAGC;AAAA;EAAS;;;AAGV;AA+BA;AAOA;AAGC;AAAA;AAAA;AAAA;EAEC,kBCgBc;EDfd,cCmBc;EDlBd,OCkBc;EDjBd;;AAGD;AAAA;AAAA;AAAA;EAEC,kBCQc;EDPd,cCWc;EDVd,OCUc;EDTd;EACA;;;AE9EF;AACC;ACJA;EACA;AAEA;EACA;ECHC;EACA;EFQD,kBDOa;ECNb,QF6Bc;EE5Bd,eDTuB;ECUvB;EACA;EACA,ODGa;ECFb,WDsHa;ECrHb;EACA,aAbuB;EAcvB;EACA;EACA;EACA,YF+BA;EE9BA;EACA;EACA;EACA;AAQA;;AANA;EAAiB,OFGQ;;AEDzB;EACC;IAAI;;;AAIL;EACC,ODlBY;ECmBZ,cDlBW;ECmBX,kBDrBY;ECsBZ,YDgFa;EC/Eb;;AAGD;EAEC,kBDRiB;ECSjB,SDiEiB;EChEjB;;AAGD;EAEC,kBDfiB;;ACkBlB;EAA2B,OFxBF;;;AE2B1B;EACC,kBD0Be;ECzBf,cD6Be;EC5Bf,OD4Be;ACrBf;AAKA;;AAVA;EACC;EACA,ODwBc;;ACpBf;EAA+B,OFRA;;AES/B;EAAsB,OFTS;;AEU/B;EAA0B,OFVK;;AEa/B;EACC;EACA","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/TextArea/TextArea.scss","../../../src/utilities/_component-reset.scss","../../../src/utilities/_font-smoothing.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss"],"names":[],"mappings":"AAAA;ACGA;AAwBA;AASA;ACnCC;EACA;AAEA;EACA;ECHC;EACA;EFqCD,kBAvBoB;EAwBpB;EACA,eGlCiB;EHmCjB;EACA;EACA,OA9Bc;EA+Bd,WG0Fa;EHzFb;EACA,aA3Ca;EA4Cb;EACA;EACA;EACA,YAzCA;EA0CA;EACA;EACA;EACA;AAWA;;AATA;EACC,OA5Ca;EA6Cb,SGqDoB;;AHlDrB;EACC;IAAI;;;AAIL;EAEC,OAvDa;EAwDb,cA/Ca;EAgDb,kBAvDmB;EAwDnB,YGgDa;EH/Cb;;AAGD;EAEC,kBA5DoB;EA6DpB,SGgCiB;EH/BjB;;AAGD;EAEC,kBAnEoB;;AAsErB;EACC,OA3Ea;EA4Eb,SGsBoB;;AHnBrB;EAjEA;;AAkEA;EAlEA;;;AAqED;EACC,kBAjFkB;EAkFlB,cA/Ec;EAgFd,OArFY;AA6FZ;;AANA;EAEC;EACA,OA1FW;;AA8FZ;EACC,OA/FW;EAgGX,SGCoB;;AHErB;EAlFA;;AAmFA;EAnFA","file":"index.css"}

package/dist/components/Thumbnail/Thumbnail.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Thumbnail/Thumbnail.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss"],"names":[],"mappings":"AAAA;ACQA;ACPC;EACA;AAEA;EACA;EDMA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC,OEuGU;EFtGV,QEsGU;EFrGV,eEjBgB;;AFoBjB;EACC,OEkGU;EFjGV,QEiGU;EFhGV,eEvBgB;;AF0BjB;EACC,OE6FU;EF5FV,QE4FU;EF3FV,eE5BgB;;AF+BjB;EACC,OEwFU;EFvFV,QEuFU;EFtFV,eElCgB;;AFqCjB;EACC,OEmFU;EFlFV,QEkFU;EFjFV,eExCgB;;AF2CjB;EAAoB,SE+EN;;AF7Ed;EAAwB;;AACxB;EAAwB;;AACxB;EAA2B;;AAC3B;EAAyB;;AAEzB;EACC;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBArEc;EAsEd,OApEa","file":"Thumbnail.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Thumbnail/Thumbnail.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss"],"names":[],"mappings":"AAAA;ACQA;ACPC;EACA;AAEA;EACA;EDMA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC,OEwGU;EFvGV,QEuGU;EFtGV,eEjBgB;;AFoBjB;EACC,OEmGU;EFlGV,QEkGU;EFjGV,eEvBgB;;AF0BjB;EACC,OE8FU;EF7FV,QE6FU;EF5FV,eE5BgB;;AF+BjB;EACC,OEyFU;EFxFV,QEwFU;EFvFV,eElCgB;;AFqCjB;EACC,OEoFU;EFnFV,QEmFU;EFlFV,eExCgB;;AF2CjB;EAAoB,SEgFN;;AF9Ed;EAAwB;;AACxB;EAAwB;;AACxB;EAA2B;;AAC3B;EAAyB;;AAEzB;EACC;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBArEc;EAsEd,OApEa","file":"Thumbnail.css"}

package/dist/components/Thumbnail/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Thumbnail/Thumbnail.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss"],"names":[],"mappings":"AAAA;ACQA;ACPC;EACA;AAEA;EACA;EDMA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC,OEuGU;EFtGV,QEsGU;EFrGV,eEjBgB;;AFoBjB;EACC,OEkGU;EFjGV,QEiGU;EFhGV,eEvBgB;;AF0BjB;EACC,OE6FU;EF5FV,QE4FU;EF3FV,eE5BgB;;AF+BjB;EACC,OEwFU;EFvFV,QEuFU;EFtFV,eElCgB;;AFqCjB;EACC,OEmFU;EFlFV,QEkFU;EFjFV,eExCgB;;AF2CjB;EAAoB,SE+EN;;AF7Ed;EAAwB;;AACxB;EAAwB;;AACxB;EAA2B;;AAC3B;EAAyB;;AAEzB;EACC;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBArEc;EAsEd,OApEa","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Thumbnail/Thumbnail.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss"],"names":[],"mappings":"AAAA;ACQA;ACPC;EACA;AAEA;EACA;EDMA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC,OEwGU;EFvGV,QEuGU;EFtGV,eEjBgB;;AFoBjB;EACC,OEmGU;EFlGV,QEkGU;EFjGV,eEvBgB;;AF0BjB;EACC,OE8FU;EF7FV,QE6FU;EF5FV,eE5BgB;;AF+BjB;EACC,OEyFU;EFxFV,QEwFU;EFvFV,eElCgB;;AFqCjB;EACC,OEoFU;EFnFV,QEmFU;EFlFV,eExCgB;;AF2CjB;EAAoB,SEgFN;;AF9Ed;EAAwB;;AACxB;EAAwB;;AACxB;EAA2B;;AAC3B;EAAyB;;AAEzB;EACC;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,kBArEc;EAsEd,OApEa","file":"index.css"}

package/dist/components/TimePicker/TimePicker.css

@@ -183,11 +183,7 @@
   flex-grow: 1;
 }
 
-.TimePicker__icon {
-  cursor: pointer;
-}
-
-.Popper > .TimePicker__hint.Popover__body {
+.Popper > .TimePicker__dropdown.Popover__body {
   width: 100%;
 }
 

package/dist/components/TimePicker/TimePicker.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACQC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;AClBC;EACA;AAEA;EACA;;;ADkBD;AAEC;EACC;;;AAIF;AACA;EACC,eExBiB;EFyBjB;EACA;AAgBA;;AATA;EACC,WE4FY;EF3FZ,aE+DoB;EF9DpB;EACA;;AAGD;EAAc;;AAGd;EAAwB;;AACxB;EAAiB;;;AAGlB;EACC,gBEmEW;EFlEX,cEmEW;;;AF/DX;EAKC,kBA/DyB;;AA2DzB;EACC,OA1DkB;;AAiElB;EAAY,kBAnEY;;;AAwE3B;AACA;EAAsC,cEgD1B;;;AF5CV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEwCc;;;AFrCf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA,cEoBc;EFnBd;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cEMW;EFLX;EACA,YACC;AAWD;;AAJA;EACC;;AAKA;EACC,YACC;;;AAUJ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AGtKzB;AFHC;EACA;AAEA;EACA;EEEA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAoB;;;AACpB;EAA4C;;;AAE5C;EACC;EACA;;AAEA;EAAoB","file":"TimePicker.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACQC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;AClBC;EACA;AAEA;EACA;;;ADkBD;AAEC;EACC;;;AAIF;AACA;EACC,eExBiB;EFyBjB;EACA;AAgBA;;AATA;EACC,WE6FY;EF5FZ,aE+DoB;EF9DpB;EACA;;AAGD;EAAc;;AAGd;EAAwB;;AACxB;EAAiB;;;AAGlB;EACC,gBEoEW;EFnEX,cEoEW;;;AFhEX;EAKC,kBA/DyB;;AA2DzB;EACC,OA1DkB;;AAiElB;EAAY,kBAnEY;;;AAwE3B;AACA;EAAsC,cEiD1B;;;AF7CV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEyCc;;;AFtCf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA,cEqBc;EFpBd;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cEOW;EFNX;EACA,YACC;AAWD;;AAJA;EACC;;AAKA;EACC,YACC;;;AAUJ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AGtKzB;AFHC;EACA;AAEA;EACA;EEEA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAgD;;;AAEhD;EACC;EACA;;AAEA;EAAoB","file":"TimePicker.css"}

package/dist/components/TimePicker/TimePicker.d.ts

@@ -2,40 +2,44 @@ import { FC } from 'react';
 import { InputProps, PopoverProps } from '..';
 import { TimePickerOptionProps } from './components';
 export interface TimePickerPropsStrict extends Omit<InputProps, 'value' | 'placeholder'> {
+    /**
+     * If false, ignores `step` prop, so that user may fill in intermidiate values.
+     * If true, user only allowed to choose options generated with `step` prop,
+     * and user's input to be automatically rounded to the closest option.
+     * Closest value to be highlighted in a dropdown.
+     */
+    autoRounding?: boolean;
     /** Preferable signifier of a value to select on autocomplete when user left the control */
     defaultTimeSignifier?: 'AM' | 'PM';
+    /** Direction of the dropdown */
+    direction?: PopoverProps['direction'];
+    /** Turns off TimePicker's ability to display a dropdown with options */
+    disableDropdown?: boolean;
     /**
      * Specified in minutes, default is 30. Should not exceed 1440 (24 hours).
-     * Increment used to:
-     * 1. hide intermediate values in hint's dropdown if `autoRounding` is false, or
-     * 2. generate values for hint's options if `autoRounding` is true.
+     * Step used to:
+     * 1. hide intermediate values (these values are still possible to pick with typing)
+     * from TimePicker's dropdown if `autoRounding` is false, or
+     * 2. generate strict values for dropdown options if `autoRounding` is true.
      */
-    hintIncrement?: number;
-    /** Define the width property of TimePicker's hint (popover) */
-    hintWidth?: PopoverProps['width'];
+    step?: number;
     /**
-     * If field is focused, show in a dropdown a list of availiable options, filtered by `hintIncrement` prop.
+     * Time format, "hh:mm xm" is a default value,
+     * "hh:mm" stands for 24-hour format with leading zero
      */
-    showHint?: boolean;
-    /**
-     * If false, ignores hintIncrement values, making possible to type in intermidiate values.
-     * If true, user only allowed to choose options that fit into hintIncrement's values row,
-     * and automatically rounds the user's input to the closest options.
-     * Closest value to be highlighted in a dropdown.
-     */
-    autoRounding?: boolean;
+    format?: 'hh:mm xm' | 'hh:mm';
     /** Maximum time allowed */
-    maxTime?: Date | string;
+    max?: Date | string;
     /** Minimum time allowed */
-    minTime?: Date | string;
+    min?: Date | string;
     /** Called when the user changes the value */
     onChange?: (value: TimePickerOptionProps['value']) => void;
-    /** Allows to open dropdown if showHint === true */
+    /** Show a dropdown on render, if `disableDropdown` is unset */
     open?: boolean;
-    /** Direction of the dropdown */
-    direction?: PopoverProps['direction'];
-    /** A Date object unrestricted by minTime and maxTime */
+    /** A Date object, unrestricted by min and max props */
     value?: TimePickerOptionProps['value'];
+    /** Passed as width prop into TimePicker's dropdown */
+    width?: PopoverProps['width'];
 }
 export interface TimePickerProps extends TimePickerPropsStrict {
     /** Unstrict Props */

package/dist/components/TimePicker/TimePicker.js

@@ -9,117 +9,126 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { useCallback, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo } from 'react';
 import classnames from 'classnames';
-import { Input, Icon, Popover } from '..';
+import { Input, Popover } from '..';
 import { keys } from '../../utilities';
 import { toTimeFormat, generateOptions, filterOptionsWithRounding, filterOptions, getClosestOption, getOptionByValue, highlightClosestOption, withClosestOption, } from './utils';
 import { TimePickerOptionList } from './components';
 export const TimePicker = React.forwardRef((props, ref) => {
-    const { className, fluid, defaultTimeSignifier = 'AM', hintIncrement = 30, hintWidth = '100', showHint = false, autoRounding = false, disabled, error, minTime = '12:00 AM', maxTime = '23:59 PM', onChange, placeholder = 'HH:MM ' + defaultTimeSignifier, size, value, direction = 'br', open } = props, rest = __rest(props, ["className", "fluid", "defaultTimeSignifier", "hintIncrement", "hintWidth", "showHint", "autoRounding", "disabled", "error", "minTime", "maxTime", "onChange", "placeholder", "size", "value", "direction", "open"]);
+    const { autoRounding = false, className, defaultTimeSignifier = 'AM', direction = 'br', disabled, error, fluid, format = 'hh:mm xm', step = 30, max = '23:59 PM', min = '12:00 AM', onChange, open, placeholder, disableDropdown, size, value, width = '100' } = props, rest = __rest(props, ["autoRounding", "className", "defaultTimeSignifier", "direction", "disabled", "error", "fluid", "format", "step", "max", "min", "onChange", "open", "placeholder", "disableDropdown", "size", "value", "width"]);
     const inputRef = React.useRef(null);
-    const [hintOpened, setHintOpened] = React.useState(showHint && open);
-    const [hintFocused, setHintFocused] = React.useState(false);
-    const [userInput, setUserInput] = React.useState('');
-    const [filterStr, setFilterStr] = React.useState('');
-    React.useEffect(() => {
+    const [opened, setOpened] = React.useState(open && !disableDropdown); // Dropdown is visible
+    const [focused, setFocused] = React.useState(false); // Input field or dropdown is in focus
+    const [input, setInput] = React.useState(''); // User's input string
+    const [filter, setFilter] = React.useState(''); // Dropdown's options filter string (differs from user's input)
+    const valueToText = useCallback((value) => {
+        if (typeof value === 'undefined')
+            return '';
+        return toTimeFormat(value, format) || '';
+    }, [format]);
+    useEffect(() => {
         // Set input's text on each non-null value change
-        if (value)
-            setUserInput(toTimeFormat.hhmmxm(value) || '');
-    }, [value]);
+        setInput(valueToText(value));
+    }, [value, valueToText]);
+    useEffect(() => {
+        // Perform autocomplete on first render to convert "value: string" into "value: Date"
+        autoComplete();
+        /* eslint-disable-next-line react-hooks/exhaustive-deps */
+    }, []);
     const handleInputFocus = () => {
-        if (hintFocused)
-            setHintFocused(false);
-        if (hintOpened !== showHint)
-            setHintOpened(showHint);
-        if (userInput !== '')
-            setFilterStr('');
+        if (focused)
+            setFocused(false);
+        if (!opened)
+            setOpened(!disableDropdown || true);
+        if (input !== '')
+            setFilter(''); // Don't apply filter on focus until typing
     };
     const handleInputBlur = () => {
-        // Disable handleInputBlur in case of hint, as focus may go to hint
-        if (showHint)
+        // Suppress autoComplete, as focus may go to dropdown
+        if (!disableDropdown)
             return;
-        // Fake blur, active element is not really changed (alt+tab, etc)
+        // Fake blur detection, case if active element not changed (alt+tab, etc)
         if (document.activeElement === inputRef.current.inputRef.current)
             return;
         autoComplete();
     };
-    // Initial list of options
-    const optionsArgs = [minTime, maxTime, hintIncrement];
+    // Initial list of options to be generated based on min, max & step
+    const optionsArgs = [min, max, step, format];
     const options = useCallback(generateOptions, optionsArgs)(...optionsArgs);
-    // Closest to user's input option
+    // Getting most expected option based on user's input
     const closestOptionArgs = [
         options,
-        userInput,
+        input,
         defaultTimeSignifier,
         autoRounding,
-        minTime,
-        maxTime,
+        min,
+        max,
+        format,
     ];
     const closestOption = useCallback(getClosestOption, closestOptionArgs)(...closestOptionArgs);
-    // Filtered list of options with extra one to highligh (in case rounding disabled)
-    const hintOptions = useMemo(() => {
-        if (userInput === '' || filterStr === '') {
+    // Filtered list of options with an extra one to highligh (in case autoRounding is disabled)
+    const dropdownOptions = useMemo(() => {
+        if (input === '' || filter === '')
             return options;
-        }
         let filtered;
         if (autoRounding) {
-            filtered = filterOptionsWithRounding(options, filterStr);
+            filtered = filterOptionsWithRounding(options, filter);
         }
         else {
-            filtered = filterOptions(options, filterStr);
+            filtered = filterOptions(options, filter);
         }
         // Insert closest option in case it was filtered out
         filtered = withClosestOption(filtered, closestOption);
         filtered = highlightClosestOption(filtered, closestOption);
         return filtered;
-    }, [userInput, filterStr, options, autoRounding, closestOption]);
+    }, [input, filter, options, autoRounding, closestOption]);
     // Runs on each input blur event
     const autoComplete = () => {
         var _a, _b, _c;
-        // User is choosing from hint's options
-        if (hintFocused)
+        // User is choosing from dropdown'ed options
+        if (focused)
             return;
         if (closestOption) {
             // Accept user input
             if (((_b = (_a = closestOption.value) === null || _a === void 0 ? void 0 : _a.getTime) === null || _b === void 0 ? void 0 : _b.call(_a)) !== ((_c = value === null || value === void 0 ? void 0 : value.getTime) === null || _c === void 0 ? void 0 : _c.call(value)))
                 onChange(closestOption.value);
-            if (userInput !== closestOption.text)
-                setUserInput(closestOption.text);
-            if (hintOpened)
-                setHintOpened(false);
+            if (input !== closestOption.text)
+                setInput(closestOption.text);
+            if (opened)
+                setOpened(false);
         }
-        else if (userInput !== '') {
+        else if (input !== '') {
             // Reject user input
             onChange(null);
-            setUserInput('');
-            setFilterStr('');
-            if (hintOpened)
-                setHintOpened(false);
+            setInput('');
+            setFilter('');
+            if (opened)
+                setOpened(false);
         }
     };
-    // Listening for user's typing
+    // Handling with user's typing
     const handleInputChange = (e, data) => {
-        setUserInput(data.value.toUpperCase());
-        setFilterStr(data.value.toUpperCase());
-        if (!hintOpened)
-            setHintOpened(showHint);
+        setInput(data.value.toUpperCase());
+        setFilter(data.value.toUpperCase());
+        if (!opened)
+            setOpened(!disableDropdown);
     };
     const handleClickOutside = () => {
-        if (hintOpened)
-            setHintOpened(false);
+        if (opened)
+            setOpened(false);
         autoComplete();
     };
     const handleIconClick = () => {
-        setHintOpened(!disabled && showHint && !hintOpened);
+        setOpened(!disabled && !disableDropdown && !opened);
         inputRef.current.focus();
     };
     const handleKeyDown = (e) => {
         const { key } = e;
-        // Return focus back to the input field from hint
+        // Set focus back from dropdown to the input field
         if (key === keys.esc) {
             e.preventDefault();
-            setHintOpened(false);
+            setOpened(false);
             inputRef.current.focus();
         }
         // Autocomplete on focus lost (on tab or shift+tab)
@@ -128,64 +137,66 @@ export const TimePicker = React.forwardRef((props, ref) => {
         // Explicit autocomplete (on enter)
         if (key === keys.enter)
             autoComplete();
-        // Move focus to the hint
+        // Move focus to the dropdown
         if (key === keys.down || key === keys.up) {
-            if (hintOpened && !hintFocused) {
+            if (opened && !focused) {
                 e.preventDefault();
-                setHintFocused(true);
+                setFocused(true);
             }
         }
     };
-    const hintFocusValue = () => {
+    const dropdownFocusValue = () => {
         const focusValue = closestOption
-            ? getOptionByValue(hintOptions, closestOption.value)
-            : hintOptions[0];
-        return hintFocused ? focusValue : null;
+            ? getOptionByValue(dropdownOptions, closestOption.value)
+            : dropdownOptions[0];
+        return focused ? focusValue : null;
     };
     const handleHintOnChange = (value) => {
         inputRef.current.focus(); // Move focus back to the field
         onChange(value);
-        setUserInput(toTimeFormat.hhmmxm(value));
-        setFilterStr('');
-        if (hintOpened)
-            setHintOpened(false);
+        setInput(valueToText(value));
+        setFilter('');
+        if (opened)
+            setOpened(false);
     };
     const TimePickerClasses = classnames(className, 'TimePicker', {
         'TimePicker--disabled': disabled,
         [`TimePicker--${size}`]: size,
     });
-    const InputProps = {
+    const inputProps = {
         fluid,
         disabled,
         error,
-        placeholder,
+        placeholder: format === 'hh:mm xm'
+            ? 'HH:MM ' + defaultTimeSignifier
+            : 'HH:MM',
         size,
         onChange: handleInputChange,
         onFocus: handleInputFocus,
         onBlur: handleInputBlur,
-        value: userInput,
+        value: input,
     };
-    const HintProps = {
+    const dropdownProps = {
         className: classnames('TimePicker__options', {
-            'TimePicker__options-focused': hintFocused,
+            'TimePicker__options-focused': focused,
         }),
-        focusValue: hintFocusValue(),
-        options: hintOptions,
+        focusValue: dropdownFocusValue(),
+        options: dropdownOptions,
         onChange: handleHintOnChange,
         tabIndex: -1,
         type: 'time',
     };
-    const Field = (React.createElement(Input, Object.assign({}, InputProps, { className: "TimePicker__input", ref: inputRef, shortLabel: React.createElement(Icon, { name: "access_time", className: "TimePicker__icon", onClick: handleIconClick }), "data-anvil-component": "TimePicker" })));
-    // Autocomplete on first render to handle case of value:string, converting it to value:datetime
-    React.useEffect(() => {
-        autoComplete();
-        /* eslint-disable-next-line react-hooks/exhaustive-deps */
-    }, []);
-    return (React.createElement(Popover, Object.assign({ autoFlipVertically: true, className: classnames('TimePicker__hint', 'a-Select'), direction: direction, onClickOutside: handleClickOutside, onKeyDown: handleKeyDown, open: !disabled &&
-            showHint &&
-            hintOpened &&
-            hintOptions.length !== 0, padding: null, portal: props.portal || true, ref: ref, scrollHeight: props.scrollHeight || '192px', trigger: Field, width: hintWidth, wrapperClassName: TimePickerClasses }, rest),
-        React.createElement(TimePickerOptionList, Object.assign({}, HintProps))));
+    const Field = (React.createElement(Input, Object.assign({}, inputProps, { className: "TimePicker__input", ref: inputRef, icon: {
+            className: 'TimePicker__icon',
+            el: 'span',
+            name: 'access_time',
+            onClick: handleIconClick,
+        }, iconPosition: "left", "data-anvil-component": "TimePicker" })));
+    return (React.createElement(Popover, Object.assign({ autoFlipVertically: true, className: classnames('TimePicker__dropdown', 'a-Select'), direction: direction, onClickOutside: handleClickOutside, onKeyDown: handleKeyDown, open: !disabled &&
+            !disableDropdown &&
+            opened &&
+            dropdownOptions.length !== 0, padding: null, portal: true, ref: ref, scrollHeight: props.scrollHeight || '192px', trigger: Field, width: width, wrapperClassName: TimePickerClasses }, rest),
+        React.createElement(TimePickerOptionList, Object.assign({}, dropdownProps))));
 });
 TimePicker.displayName = 'TimePicker';
 //# sourceMappingURL=TimePicker.js.map

package/dist/components/TimePicker/TimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../../../src/components/TimePicker/TimePicker.tsx"],"names":[],"mappings":"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"}

package/dist/components/TimePicker/index.css

@@ -183,11 +183,7 @@
   flex-grow: 1;
 }
 
-.TimePicker__icon {
-  cursor: pointer;
-}
-
-.Popper > .TimePicker__hint.Popover__body {
+.Popper > .TimePicker__dropdown.Popover__body {
   width: 100%;
 }
 

package/dist/components/TimePicker/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACQC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;AClBC;EACA;AAEA;EACA;;;ADkBD;AAEC;EACC;;;AAIF;AACA;EACC,eExBiB;EFyBjB;EACA;AAgBA;;AATA;EACC,WE4FY;EF3FZ,aE+DoB;EF9DpB;EACA;;AAGD;EAAc;;AAGd;EAAwB;;AACxB;EAAiB;;;AAGlB;EACC,gBEmEW;EFlEX,cEmEW;;;AF/DX;EAKC,kBA/DyB;;AA2DzB;EACC,OA1DkB;;AAiElB;EAAY,kBAnEY;;;AAwE3B;AACA;EAAsC,cEgD1B;;;AF5CV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEwCc;;;AFrCf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA,cEoBc;EFnBd;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cEMW;EFLX;EACA,YACC;AAWD;;AAJA;EACC;;AAKA;EACC,YACC;;;AAUJ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AGtKzB;AFHC;EACA;AAEA;EACA;EEEA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAoB;;;AACpB;EAA4C;;;AAE5C;EACC;EACA;;AAEA;EAAoB","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACQC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;AClBC;EACA;AAEA;EACA;;;ADkBD;AAEC;EACC;;;AAIF;AACA;EACC,eExBiB;EFyBjB;EACA;AAgBA;;AATA;EACC,WE6FY;EF5FZ,aE+DoB;EF9DpB;EACA;;AAGD;EAAc;;AAGd;EAAwB;;AACxB;EAAiB;;;AAGlB;EACC,gBEoEW;EFnEX,cEoEW;;;AFhEX;EAKC,kBA/DyB;;AA2DzB;EACC,OA1DkB;;AAiElB;EAAY,kBAnEY;;;AAwE3B;AACA;EAAsC,cEiD1B;;;AF7CV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEyCc;;;AFtCf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA,cEqBc;EFpBd;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cEOW;EFNX;EACA,YACC;AAWD;;AAJA;EACC;;AAKA;EACC,YACC;;;AAUJ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AGtKzB;AFHC;EACA;AAEA;EACA;EEEA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAgD;;;AAEhD;EACC;EACA;;AAEA;EAAoB","file":"index.css"}