@servicetitan/form 14.3.0 → 16.0.2

package/dist/date-range-picker/date-range-picker.d.ts

@@ -0,0 +1,47 @@
+import { ComponentType, Component, SyntheticEvent } from 'react';
+import { DateRangePickerChangeEvent, CalendarHeaderTitleProps, MultiViewCalendarProps, CalendarCellProps, ActiveView } from '@progress/kendo-react-dateinputs';
+import { FieldState } from 'formstate';
+import { DateRange } from '../date-range';
+export interface DateRangePickerProps {
+    field: FieldState<DateRange | undefined>;
+    ['qa-testing']: string;
+    placeHolder?: string;
+    minDate?: Date;
+    maxDate?: Date;
+    calendarMinDate?: Date;
+    calendarMaxDate?: Date;
+    topView?: ActiveView;
+    bottomView?: ActiveView;
+    className?: string;
+    calendarComponent?: ComponentType<MultiViewCalendarProps>;
+    headerTitleComponent?: ComponentType<CalendarHeaderTitleProps>;
+    cellComponent?: ComponentType<CalendarCellProps>;
+    inputFormat?: string;
+    horizontalAlign?: 'left' | 'center' | 'right';
+    disabled?: boolean;
+    small?: boolean;
+    disableRangeValidation?: boolean;
+    maskChar?: string;
+}
+export declare class DateRangePicker extends Component<DateRangePickerProps> {
+    wrapElem?: any;
+    isFocused: boolean;
+    showDatePicker: boolean;
+    isIconClicked: boolean;
+    constructor(props: DateRangePickerProps);
+    handleRef: (wrapElem: HTMLDivElement) => void;
+    toggleShow(show?: boolean): void;
+    handleFocus: (evt: Event) => void;
+    handleClickIcon: () => void;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    handleChange: (event: DateRangePickerChangeEvent) => void;
+    handleFromChange: (from?: Date | undefined) => void;
+    handleToChange: (to?: Date | undefined) => void;
+    render(): JSX.Element;
+    formatDate(date?: Date, inputFormat?: string): string;
+    handleHiddenInputChange: (ev: SyntheticEvent<HTMLInputElement>) => void;
+    get maxFromDate(): Date | undefined;
+    get minToDate(): Date | undefined;
+}
+//# sourceMappingURL=date-range-picker.d.ts.map

package/dist/date-range-picker/date-range-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.d.ts","sourceRoot":"","sources":["../../src/date-range-picker/date-range-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAEH,0BAA0B,EAC1B,wBAAwB,EACxB,sBAAsB,EACtB,iBAAiB,EACjB,UAAU,EACb,MAAM,kCAAkC,CAAC;AAO1C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,MAAM,WAAW,oBAAoB;IACjC,KAAK,EAAE,UAAU,CAAC,SAAS,GAAG,SAAS,CAAC,CAAC;IACzC,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,eAAe,CAAC,EAAE,IAAI,CAAC;IACvB,eAAe,CAAC,EAAE,IAAI,CAAC;IACvB,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,aAAa,CAAC,sBAAsB,CAAC,CAAC;IAC1D,oBAAoB,CAAC,EAAE,aAAa,CAAC,wBAAwB,CAAC,CAAC;IAC/D,aAAa,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,qBACa,eAAgB,SAAQ,SAAS,CAAC,oBAAoB,CAAC;IAEpD,QAAQ,CAAC,EAAE,GAAG,CAAsB;IAChD,SAAS,UAAS;IACN,cAAc,UAAS;IACnC,aAAa,UAAS;gBAEV,KAAK,EAAE,oBAAoB;IAMvC,SAAS,aAAc,cAAc,UAEnC;IAGF,UAAU,CAAC,IAAI,CAAC,EAAE,OAAO;IAIzB,WAAW,QAAS,KAAK,UAoBvB;IAEF,eAAe,aAUb;IAEF,iBAAiB;IAKjB,oBAAoB;IAKpB,YAAY,UAAW,0BAA0B,UAQ/C;IAEF,gBAAgB,oCAQd;IAEF,cAAc,kCAQZ;IAEF,MAAM;IA0HN,UAAU,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,SAAM;IAIzC,uBAAuB,OAAQ,eAAe,gBAAgB,CAAC,UAG7D;IAEF,IAAI,WAAW,qBAad;IAED,IAAI,SAAS,qBAYZ;CACJ"}

package/dist/date-range-picker/date-range-picker.js

@@ -0,0 +1,256 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateRangePicker = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const kendo_react_dateinputs_1 = require("@progress/kendo-react-dateinputs");
+const design_system_1 = require("@servicetitan/design-system");
+const mobx_1 = require("mobx");
+const mobx_react_1 = require("mobx-react");
+const classnames_1 = __importDefault(require("classnames"));
+const moment_1 = __importDefault(require("moment"));
+const Styles = __importStar(require("./date-range-picker.module.css"));
+let DateRangePicker = class DateRangePicker extends react_1.Component {
+    constructor(props) {
+        super(props);
+        // `HTMLDivElement` leads to issues with Node/SSR
+        Object.defineProperty(this, "wrapElem", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "isFocused", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        Object.defineProperty(this, "showDatePicker", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        Object.defineProperty(this, "isIconClicked", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        Object.defineProperty(this, "handleRef", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (wrapElem) => {
+                this.wrapElem = wrapElem;
+            }
+        });
+        Object.defineProperty(this, "handleFocus", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (evt) => {
+                if (!(evt.target instanceof Node)) {
+                    return;
+                }
+                const isPrevFocused = this.isFocused;
+                this.isFocused = this.wrapElem.contains(evt.target);
+                if (!this.isFocused && isPrevFocused) {
+                    // click outside
+                    this.props.field.enableAutoValidationAndValidate();
+                    this.toggleShow(false);
+                }
+                else if (this.isFocused && !isPrevFocused && !this.isIconClicked) {
+                    // click inside but outside icons
+                    this.props.field.disableAutoValidation();
+                }
+                this.isIconClicked = false;
+            }
+        });
+        Object.defineProperty(this, "handleClickIcon", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: () => {
+                this.isIconClicked = true;
+                if (this.showDatePicker) {
+                    this.props.field.enableAutoValidationAndValidate();
+                }
+                else {
+                    this.props.field.disableAutoValidation();
+                }
+                this.toggleShow();
+            }
+        });
+        Object.defineProperty(this, "handleChange", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (event) => {
+                var _a, _b;
+                const value = event.target.value;
+                if (value.start && value.end && value.start > value.end) {
+                    [value.start, value.end] = [value.end, value.start];
+                }
+                this.props.field.onChange({ from: (_a = value.start) !== null && _a !== void 0 ? _a : undefined, to: (_b = value.end) !== null && _b !== void 0 ? _b : undefined });
+            }
+        });
+        Object.defineProperty(this, "handleFromChange", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (from) => {
+                const to = this.props.field.value ? this.props.field.value.to : undefined;
+                if (from || to) {
+                    this.props.field.onChange({ from, to });
+                }
+                else {
+                    this.props.field.onChange(undefined);
+                }
+            }
+        });
+        Object.defineProperty(this, "handleToChange", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (to) => {
+                const from = this.props.field.value ? this.props.field.value.from : undefined;
+                if (from || to) {
+                    this.props.field.onChange({ from, to });
+                }
+                else {
+                    this.props.field.onChange(undefined);
+                }
+            }
+        });
+        Object.defineProperty(this, "handleHiddenInputChange", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (ev) => {
+                const values = ev.currentTarget.value.split('-').map(v => new Date(v));
+                this.props.field.onChange({ from: values[0] || undefined, to: values[1] || undefined });
+            }
+        });
+        mobx_1.makeObservable(this);
+    }
+    toggleShow(show) {
+        this.showDatePicker = show !== undefined ? show : !this.showDatePicker;
+    }
+    componentDidMount() {
+        window.addEventListener('focus', this.handleFocus, true);
+        window.addEventListener('click', this.handleFocus);
+    }
+    componentWillUnmount() {
+        window.removeEventListener('focus', this.handleFocus, true);
+        window.removeEventListener('click', this.handleFocus);
+    }
+    render() {
+        var _a, _b;
+        const { hasError } = this.props.field;
+        const { 'qa-testing': qaTestingLocator, placeHolder, inputFormat, className, calendarComponent, headerTitleComponent, cellComponent, minDate, maxDate, calendarMinDate, calendarMaxDate, topView, bottomView, horizontalAlign, disabled = false, small, maskChar, } = this.props;
+        const value = this.props.field.value ? this.props.field.value : {};
+        const horizontalAlignClass = classnames_1.default({
+            [Styles.popupCenter]: horizontalAlign === 'center',
+            [Styles.popupRight]: horizontalAlign === 'right',
+        });
+        return (jsx_runtime_1.jsxs("div", Object.assign({ className: classnames_1.default(Styles.dateRangePicker, className), ref: this.handleRef }, { children: [jsx_runtime_1.jsx(kendo_react_dateinputs_1.DateRangePicker, { className: Styles.dateRangePickerKendo, calendarSettings: {
+                        min: minDate !== null && minDate !== void 0 ? minDate : calendarMinDate,
+                        max: maxDate !== null && maxDate !== void 0 ? maxDate : calendarMaxDate,
+                        topView,
+                        bottomView,
+                        disabled,
+                        mode: 'range',
+                        headerTitle: headerTitleComponent,
+                        cell: cellComponent,
+                    }, popupSettings: {
+                        appendTo: this.wrapElem,
+                        className: horizontalAlignClass,
+                    }, startDateInputSettings: {
+                        tabIndex: -1,
+                    }, endDateInputSettings: {
+                        tabIndex: -1,
+                    }, show: this.showDatePicker, value: { start: (_a = value.from) !== null && _a !== void 0 ? _a : null, end: (_b = value.to) !== null && _b !== void 0 ? _b : null }, onChange: this.handleChange, min: minDate, max: maxDate, calendar: calendarComponent }, void 0), jsx_runtime_1.jsxs(design_system_1.Stack, Object.assign({ alignItems: "center", className: "flex-grow-1" }, { children: [jsx_runtime_1.jsx(design_system_1.Stack.Item, Object.assign({ fill: true }, { children: jsx_runtime_1.jsx(design_system_1.InputDateMask, { shortLabel: jsx_runtime_1.jsx(design_system_1.Icon, { name: "today", className: classnames_1.default('cursor-pointer', `${qaTestingLocator}-icon-from`), onClick: this.handleClickIcon }, void 0), placeholder: placeHolder, value: value.from, onChange: this.handleFromChange, error: hasError, disabled: disabled, "qa-testing": `${qaTestingLocator}-from`, dateFormat: inputFormat, minDate: minDate, maxDate: this.maxFromDate, small: small, maskChar: maskChar }, void 0) }), void 0), jsx_runtime_1.jsx(design_system_1.Icon, { name: "arrow_forward", className: Styles.endLabel }, void 0), jsx_runtime_1.jsx(design_system_1.Stack.Item, Object.assign({ fill: true }, { children: jsx_runtime_1.jsx(design_system_1.InputDateMask, { shortLabel: jsx_runtime_1.jsx(design_system_1.Icon, { name: "today", className: classnames_1.default('cursor-pointer', `${qaTestingLocator}-icon-to`), onClick: this.handleClickIcon }, void 0), placeholder: placeHolder, value: value.to, onChange: this.handleToChange, error: hasError, disabled: disabled, "qa-testing": `${qaTestingLocator}-to`, dateFormat: inputFormat, minDate: this.minToDate, maxDate: maxDate, small: small, maskChar: maskChar }, void 0) }), void 0)] }), void 0), jsx_runtime_1.jsx("input", { hidden: true, "qa-testing": qaTestingLocator, onChange: this.handleHiddenInputChange }, void 0)] }), void 0));
+    }
+    formatDate(date, inputFormat = 'L') {
+        return date ? moment_1.default(date).format(inputFormat) : '';
+    }
+    get maxFromDate() {
+        const { disableRangeValidation, maxDate, field } = this.props;
+        if (disableRangeValidation) {
+            return maxDate;
+        }
+        const to = field.value ? field.value.to : undefined;
+        if (maxDate && to) {
+            return maxDate > to ? to : maxDate;
+        }
+        return maxDate !== null && maxDate !== void 0 ? maxDate : to;
+    }
+    get minToDate() {
+        const { disableRangeValidation, minDate, field } = this.props;
+        if (disableRangeValidation) {
+            return minDate;
+        }
+        const from = field.value ? field.value.from : undefined;
+        if (minDate && from) {
+            return minDate < from ? from : minDate;
+        }
+        return minDate !== null && minDate !== void 0 ? minDate : from;
+    }
+};
+__decorate([
+    mobx_1.observable,
+    __metadata("design:type", Object)
+], DateRangePicker.prototype, "wrapElem", void 0);
+__decorate([
+    mobx_1.observable,
+    __metadata("design:type", Object)
+], DateRangePicker.prototype, "showDatePicker", void 0);
+__decorate([
+    mobx_1.action,
+    __metadata("design:type", Object)
+], DateRangePicker.prototype, "handleRef", void 0);
+__decorate([
+    mobx_1.action,
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Boolean]),
+    __metadata("design:returntype", void 0)
+], DateRangePicker.prototype, "toggleShow", null);
+DateRangePicker = __decorate([
+    mobx_react_1.observer,
+    __metadata("design:paramtypes", [Object])
+], DateRangePicker);
+exports.DateRangePicker = DateRangePicker;
+//# sourceMappingURL=date-range-picker.js.map

package/dist/date-range-picker/date-range-picker.js.map

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

package/dist/date-range-picker/date-range-picker.module.css

@@ -0,0 +1,37 @@
+.date-range-picker {
+    position: relative;
+    display: flex;
+    min-width: 14em;
+}
+
+.date-range-picker .date-range-picker-kendo {
+    width: 0;
+    white-space: nowrap;
+    overflow: hidden;
+}
+.date-range-picker .date-range-picker-kendo :global(.k-textbox-container) {
+    padding-top: 0;
+    height: var(--spacing-4);
+}
+
+.date-range-picker .popup-center {
+    left: 50% !important;
+    transform: translateX(-50%);
+}
+
+.date-range-picker .popup-right {
+    left: auto !important;
+    right: 0;
+}
+
+.date-range-picker :global(.Input.InputDateMask.Input--small .InputAddon) {
+    padding-left: var(--spacing-1);
+    padding-right: var(--spacing-1);
+}
+
+.end-label {
+    margin: 0 var(--spacing-half);
+    color: var(--color-neutral-80);
+    font-size: var(--typescale-4);
+    width: var(--spacing-3);
+}

package/dist/date-range-picker/index.d.ts

@@ -0,0 +1,2 @@
+export * from './date-range-picker';
+//# sourceMappingURL=index.d.ts.map

package/dist/date-range-picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/date-range-picker/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC"}

package/dist/date-range-picker/index.js

@@ -0,0 +1,14 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./date-range-picker"), exports);
+//# sourceMappingURL=index.js.map

package/dist/date-range-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/date-range-picker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,sDAAoC"}

package/dist/demo/date-range-picker.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+export declare const DateRangePickerExample: FC;
+//# sourceMappingURL=date-range-picker.d.ts.map

package/dist/demo/date-range-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.d.ts","sourceRoot":"","sources":["../../src/demo/date-range-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,EAAE,EAAE,MAAM,OAAO,CAAC;AAe7C,eAAO,MAAM,sBAAsB,EAAE,EAiBnC,CAAC"}

package/dist/demo/date-range-picker.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateRangePickerExample = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const mobx_react_1 = require("mobx-react");
+const design_system_1 = require("@servicetitan/design-system");
+const __1 = require("..");
+const formstate_1 = require("formstate");
+function useDateRangeField(initial) {
+    return react_1.useRef(new formstate_1.FieldState(initial)).current;
+}
+exports.DateRangePickerExample = mobx_react_1.observer(() => {
+    const defaultField = useDateRangeField(undefined);
+    return (jsx_runtime_1.jsxs(react_1.Fragment, { children: [jsx_runtime_1.jsx(design_system_1.Text, Object.assign({ size: 4, className: "m-b-half" }, { children: "Default" }), void 0), jsx_runtime_1.jsx(__1.DateRangePicker, { maskChar: "X", field: defaultField, "qa-testing": "qa-date-range-picker", horizontalAlign: "right", small: true }, void 0)] }, void 0));
+});
+//# sourceMappingURL=date-range-picker.js.map

package/dist/demo/date-range-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.js","sourceRoot":"","sources":["../../src/demo/date-range-picker.tsx"],"names":[],"mappings":";;;;AAAA,iCAA6C;AAE7C,2CAAsC;AAEtC,+DAAmD;AAEnD,0BAAqC;AAErC,yCAAuC;AAGvC,SAAS,iBAAiB,CAAkC,OAAU;IAClE,OAAO,cAAM,CAAC,IAAI,sBAAU,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;AACnD,CAAC;AAEY,QAAA,sBAAsB,GAAO,qBAAQ,CAAC,GAAG,EAAE;IACpD,MAAM,YAAY,GAAG,iBAAiB,CAAwB,SAAS,CAAC,CAAC;IAEzE,OAAO,CACH,mBAAC,gBAAQ,eACL,kBAAC,oBAAI,kBAAC,IAAI,EAAE,CAAC,EAAE,SAAS,EAAC,UAAU,qCAE5B,EACP,kBAAC,mBAAe,IACZ,QAAQ,EAAC,GAAG,EACZ,KAAK,EAAE,YAAY,gBACR,sBAAsB,EACjC,eAAe,EAAC,OAAO,EACvB,KAAK,iBACP,YACK,CACd,CAAC;AACN,CAAC,CAAC,CAAC"}

package/dist/demo/index.d.ts

@@ -1,5 +1,9 @@
 export * from './color-picker';
+export * from './date-range-picker';
 export * from './dropdown-state';
 export * from './file-uploader';
 export * from './number-input';
+export * from './phone-number-input';
+export * from './original-number-input';
+export * from './input-date-mask';
 //# sourceMappingURL=index.d.ts.map

package/dist/demo/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/demo/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/demo/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,yBAAyB,CAAC;AACxC,cAAc,mBAAmB,CAAC"}

package/dist/demo/index.js

@@ -11,7 +11,11 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./color-picker"), exports);
+__exportStar(require("./date-range-picker"), exports);
 __exportStar(require("./dropdown-state"), exports);
 __exportStar(require("./file-uploader"), exports);
 __exportStar(require("./number-input"), exports);
+__exportStar(require("./phone-number-input"), exports);
+__exportStar(require("./original-number-input"), exports);
+__exportStar(require("./input-date-mask"), exports);
 //# sourceMappingURL=index.js.map

package/dist/demo/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/demo/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,iDAA+B;AAC/B,mDAAiC;AACjC,kDAAgC;AAChC,iDAA+B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/demo/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,iDAA+B;AAC/B,sDAAoC;AACpC,mDAAiC;AACjC,kDAAgC;AAChC,iDAA+B;AAC/B,uDAAqC;AACrC,0DAAwC;AACxC,oDAAkC"}

package/dist/demo/input-date-mask.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+export declare const InputDateMaskExample: FC;
+//# sourceMappingURL=input-date-mask.d.ts.map

package/dist/demo/input-date-mask.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-date-mask.d.ts","sourceRoot":"","sources":["../../src/demo/input-date-mask.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAoB,MAAM,OAAO,CAAC;AAc7C,eAAO,MAAM,oBAAoB,EAAE,EAejC,CAAC"}

package/dist/demo/input-date-mask.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InputDateMaskExample = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const mobx_react_1 = require("mobx-react");
+const design_system_1 = require("@servicetitan/design-system");
+const formstate_1 = require("formstate");
+const __1 = require("..");
+function useInputDateMaskField(initial) {
+    return react_1.useRef(new formstate_1.FieldState(initial)).current;
+}
+exports.InputDateMaskExample = mobx_react_1.observer(() => {
+    const defaultField = useInputDateMaskField(undefined);
+    return (jsx_runtime_1.jsxs(react_1.Fragment, { children: [jsx_runtime_1.jsx(design_system_1.Text, Object.assign({ size: 4, className: "m-b-half" }, { children: "Default" }), void 0), jsx_runtime_1.jsx(__1.InputDateMask, { value: defaultField.value, onChange: defaultField.onChange, shortLabel: jsx_runtime_1.jsx(design_system_1.Icon, { name: "event" }, void 0) }, void 0)] }, void 0));
+});
+//# sourceMappingURL=input-date-mask.js.map

package/dist/demo/input-date-mask.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-date-mask.js","sourceRoot":"","sources":["../../src/demo/input-date-mask.tsx"],"names":[],"mappings":";;;;AAAA,iCAA6C;AAE7C,2CAAsC;AAEtC,+DAAyD;AAEzD,yCAAuC;AAEvC,0BAAmC;AAEnC,SAAS,qBAAqB,CAA6B,OAAU;IACjE,OAAO,cAAM,CAAC,IAAI,sBAAU,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;AACnD,CAAC;AAEY,QAAA,oBAAoB,GAAO,qBAAQ,CAAC,GAAG,EAAE;IAClD,MAAM,YAAY,GAAG,qBAAqB,CAAC,SAAS,CAAC,CAAC;IAEtD,OAAO,CACH,mBAAC,gBAAQ,eACL,kBAAC,oBAAI,kBAAC,IAAI,EAAE,CAAC,EAAE,SAAS,EAAC,UAAU,qCAE5B,EACP,kBAAC,iBAAa,IACV,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,QAAQ,EAAE,YAAY,CAAC,QAAQ,EAC/B,UAAU,EAAE,kBAAC,oBAAI,IAAC,IAAI,EAAC,OAAO,WAAG,WACnC,YACK,CACd,CAAC;AACN,CAAC,CAAC,CAAC"}

package/dist/demo/original-number-input.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+export declare const OrdinalNumberInputExample: FC;
+//# sourceMappingURL=original-number-input.d.ts.map

package/dist/demo/original-number-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"original-number-input.d.ts","sourceRoot":"","sources":["../../src/demo/original-number-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAoB,MAAM,OAAO,CAAC;AAc7C,eAAO,MAAM,yBAAyB,EAAE,EAiBtC,CAAC"}

package/dist/demo/original-number-input.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OrdinalNumberInputExample = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const mobx_react_1 = require("mobx-react");
+const design_system_1 = require("@servicetitan/design-system");
+const formstate_1 = require("formstate");
+const __1 = require("..");
+function useOrdinalNumberInputField(initial) {
+    return react_1.useRef(new formstate_1.FieldState(initial)).current;
+}
+exports.OrdinalNumberInputExample = mobx_react_1.observer(() => {
+    const defaultField = useOrdinalNumberInputField(undefined);
+    return (jsx_runtime_1.jsxs(react_1.Fragment, { children: [jsx_runtime_1.jsx(design_system_1.Text, Object.assign({ size: 4, className: "m-b-half" }, { children: "Default" }), void 0), jsx_runtime_1.jsx(__1.OrdinalNumberInput, { value: defaultField.value, onChange: defaultField.onChange, min: 1, max: 31, placeholder: "1 - 31" }, void 0)] }, void 0));
+});
+//# sourceMappingURL=original-number-input.js.map

package/dist/demo/original-number-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"original-number-input.js","sourceRoot":"","sources":["../../src/demo/original-number-input.tsx"],"names":[],"mappings":";;;;AAAA,iCAA6C;AAE7C,2CAAsC;AAEtC,+DAAmD;AAEnD,yCAAuC;AAEvC,0BAAwC;AAExC,SAAS,0BAA0B,CAA+B,OAAU;IACxE,OAAO,cAAM,CAAC,IAAI,sBAAU,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;AACnD,CAAC;AAEY,QAAA,yBAAyB,GAAO,qBAAQ,CAAC,GAAG,EAAE;IACvD,MAAM,YAAY,GAAG,0BAA0B,CAAC,SAAS,CAAC,CAAC;IAE3D,OAAO,CACH,mBAAC,gBAAQ,eACL,kBAAC,oBAAI,kBAAC,IAAI,EAAE,CAAC,EAAE,SAAS,EAAC,UAAU,qCAE5B,EACP,kBAAC,sBAAkB,IACf,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,QAAQ,EAAE,YAAY,CAAC,QAAQ,EAC/B,GAAG,EAAE,CAAC,EACN,GAAG,EAAE,EAAE,EACP,WAAW,EAAC,QAAQ,WACtB,YACK,CACd,CAAC;AACN,CAAC,CAAC,CAAC"}

package/dist/demo/phone-number-input.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+export declare const PhoneNumberInputExample: FC;
+//# sourceMappingURL=phone-number-input.d.ts.map

package/dist/demo/phone-number-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"phone-number-input.d.ts","sourceRoot":"","sources":["../../src/demo/phone-number-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAM3B,eAAO,MAAM,uBAAuB,EAAE,EAEpC,CAAC"}

package/dist/demo/phone-number-input.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PhoneNumberInputExample = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const mobx_react_1 = require("mobx-react");
+const __1 = require("..");
+exports.PhoneNumberInputExample = mobx_react_1.observer(() => (jsx_runtime_1.jsx(__1.PhoneNumberInput, { placeholder: "(123) 456-7890", label: "Phone" }, void 0)));
+//# sourceMappingURL=phone-number-input.js.map

package/dist/demo/phone-number-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"phone-number-input.js","sourceRoot":"","sources":["../../src/demo/phone-number-input.tsx"],"names":[],"mappings":";;;;AAEA,2CAAsC;AAEtC,0BAAsC;AAEzB,QAAA,uBAAuB,GAAO,qBAAQ,CAAC,GAAG,EAAE,CAAC,CACtD,kBAAC,oBAAgB,IAAC,WAAW,EAAC,gBAAgB,EAAC,KAAK,EAAC,OAAO,WAAG,CAClE,CAAC,CAAC"}

package/dist/index.d.ts

@@ -8,4 +8,8 @@ export * from './dropdown-state';
 export * from './form-helpers';
 export * from './form-validators';
 export * from './masked-input';
+export * from './date-range-picker';
+export * from './phone-number-input';
+export * from './original-number-input';
+export * from './input-date-mask';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,yBAAyB,CAAC;AACxC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,yBAAyB,CAAC;AACxC,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,yBAAyB,CAAC;AACxC,cAAc,mBAAmB,CAAC"}

package/dist/index.js

@@ -20,4 +20,8 @@ __exportStar(require("./dropdown-state"), exports);
 __exportStar(require("./form-helpers"), exports);
 __exportStar(require("./form-validators"), exports);
 __exportStar(require("./masked-input"), exports);
+__exportStar(require("./date-range-picker"), exports);
+__exportStar(require("./phone-number-input"), exports);
+__exportStar(require("./original-number-input"), exports);
+__exportStar(require("./input-date-mask"), exports);
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,iDAA+B;AAC/B,kDAAgC;AAChC,4DAA0C;AAC1C,0CAAwB;AACxB,iDAA+B;AAC/B,0DAAwC;AACxC,mDAAiC;AACjC,iDAA+B;AAC/B,oDAAkC;AAClC,iDAA+B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,iDAA+B;AAC/B,kDAAgC;AAChC,4DAA0C;AAC1C,0CAAwB;AACxB,iDAA+B;AAC/B,0DAAwC;AACxC,mDAAiC;AACjC,iDAA+B;AAC/B,oDAAkC;AAClC,iDAA+B;AAC/B,sDAAoC;AACpC,uDAAqC;AACrC,0DAAwC;AACxC,oDAAkC"}

package/dist/input-date-mask/index.d.ts

@@ -0,0 +1,2 @@
+export * from './input-date-mask';
+//# sourceMappingURL=index.d.ts.map

package/dist/input-date-mask/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/input-date-mask/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/dist/input-date-mask/index.js

@@ -0,0 +1,14 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./input-date-mask"), exports);
+//# sourceMappingURL=index.js.map

package/dist/input-date-mask/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/input-date-mask/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,oDAAkC"}

package/dist/input-date-mask/input-date-mask.d.ts

@@ -0,0 +1,14 @@
+import { FC } from 'react';
+import { InputProps } from '@servicetitan/design-system';
+export interface InputDateMaskProps extends Omit<InputProps, 'onChange' | 'value'> {
+    value?: Date;
+    ['qa-testing']?: string;
+    maskChar?: string;
+    alwaysShowMask?: boolean;
+    dateFormat?: string;
+    minDate?: Date;
+    maxDate?: Date;
+    onChange(value: Date | undefined): void;
+}
+export declare const InputDateMask: FC<InputDateMaskProps>;
+//# sourceMappingURL=input-date-mask.d.ts.map

package/dist/input-date-mask/input-date-mask.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-date-mask.d.ts","sourceRoot":"","sources":["../../src/input-date-mask/input-date-mask.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA+C,MAAM,OAAO,CAAC;AACxE,OAAO,EAAS,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAehE,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,CAAC;IAC9E,KAAK,CAAC,EAAE,IAAI,CAAC;IACb,CAAC,YAAY,CAAC,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,QAAQ,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC;CAC3C;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAiIhD,CAAC"}