@procore/core-react 10.26.0 → 10.26.1-rc.2

package/dist/esm/components/Select/Select.types.d.ts

@@ -0,0 +1,265 @@
+import { ButtonProps } from '../Button/Button.types';
+import { DropdownPlacement } from '../Dropdown/Dropdown.types';
+import { MenuProps, MenuRef } from '../MenuImperative/MenuImperative.types';
+import { OverlayTriggerProps } from '../OverlayTrigger';
+export declare type SelectPlacement = DropdownPlacement;
+declare type DivProps = React.ComponentPropsWithoutRef<'div'>;
+export interface SelectMenuProps extends Omit<DivProps, 'onSelect' | 'onDragEnd'> {
+    /**
+     * @since 10.19.0
+     */
+    emptyMessage?: string;
+    /**
+     * @since 10.19.0
+     */
+    footer?: React.ReactNode;
+    /**
+     * @since 10.19.0
+     */
+    i18nScope?: string;
+    /**
+     * @since 10.19.0
+     */
+    onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    /**
+     * @since 10.19.0
+     */
+    onScrollBottom?: MenuProps['onScrollBottom'];
+    /**
+     * @since 10.19.0
+     */
+    onSearch?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * @since 10.19.0
+     */
+    onSelect?: MenuProps['onSelect'];
+    /**
+     * @since 10.19.0
+     */
+    optionsRef?: React.RefObject<HTMLDivElement>;
+    /**
+     * @since 10.19.0
+     */
+    menuRef: React.RefObject<MenuRef>;
+}
+export interface OptionProps extends DivProps {
+    /**
+     * @since 10.19.0
+     */
+    index?: number;
+    /**
+     * @since 10.19.0
+     */
+    value: any;
+    /**
+     * @since 10.19.0
+     */
+    disabled?: boolean;
+    /**
+     * Represents the currently selected value. This option will be styled
+     * differently as well as receive UX to scroll into view and start list
+     * navigation from this element.
+     * @since 10.19.0
+     */
+    selected?: boolean;
+    /**
+     * If nothing is selected, suggest this option. Suggested options mimic the
+     * UX of a selected option, scroll into view and start list navigation from
+     * this element.
+     * @since 10.19.0
+     */
+    suggested?: boolean;
+}
+interface QaTags {
+    /**
+     * @since 10.19.0
+     */
+    label: string;
+    /**
+     * @since 10.19.0
+     */
+    clear: string;
+}
+export interface SelectProps extends Omit<DivProps, 'onSelect'> {
+    /**
+     * @since 10.19.0
+     */
+    afterHide?: OverlayTriggerProps['afterHide'];
+    /**
+     * @since 10.19.0
+     */
+    afterShow?: OverlayTriggerProps['afterShow'];
+    /**
+     * @since 10.19.0
+     */
+    beforeHide?: OverlayTriggerProps['beforeHide'];
+    /**
+     * @since 10.19.0
+     */
+    beforeShow?: OverlayTriggerProps['beforeShow'];
+    /**
+     * Make the Select button 100% width
+     * @since 10.19.0
+     */
+    block?: boolean;
+    /**
+     * @default false
+     * @since 10.19.0
+     */
+    disabled?: boolean;
+    /**
+     * When there are no children this will render
+     * @since 10.19.0
+     */
+    emptyMessage?: string;
+    /**
+     * @default false
+     * @since 10.19.0
+     */
+    error?: boolean;
+    /**
+     * @since 10.19.0
+     */
+    footer?: React.ReactNode;
+    /**
+     * @since 10.19.0
+     */
+    hideDelay?: number;
+    /**
+     * The i18n key to use for the select's configurable strings.
+     * Defaults to using the core library's default strings.
+     * @since 10.19.0
+     */
+    i18nScope?: string;
+    /**
+     * @since 10.19.0
+     */
+    label?: React.ReactNode;
+    /**
+     * If the select is loading
+     * @default false
+     * @since 10.19.0
+     */
+    loading?: boolean;
+    /**
+     * It is possible for this component to have an empty value
+     * (render placeholder). Enables the x icon.
+     * @since 10.19.0
+     */
+    onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    /**
+     * Optional <Code>function</Code> that automatically executes when
+     * scrolling reaches the last item.
+     * @since 10.19.0
+     */
+    onScrollBottom?: MenuProps['onScrollBottom'];
+    /**
+     * Adds a search bar to the select.
+     * @since 10.19.0
+     */
+    onSearch?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * @since 10.19.0
+     */
+    onSelect?: MenuProps['onSelect'];
+    /**
+     * @since 10.19.0
+     */
+    optionsRef?: React.RefObject<HTMLDivElement>;
+    /**
+     * Renders when the label is blank
+     * @since 10.19.0
+     */
+    placeholder?: string;
+    /**
+     * The placement of the overlay
+     * @default 'bottom-left'
+     * @since 10.19.0
+     */
+    placement?: SelectPlacement;
+    /**
+     * @since 10.19.0
+     */
+    qa?: Partial<QaTags>;
+    /**
+     * @since 10.19.0
+     */
+    showDelay?: number;
+    /**
+     * Configurable tabIndex for the select button
+     * @default 0
+     * @since 10.19.0
+     */
+    tabIndex?: number;
+}
+export interface SelectButtonProps extends DivProps {
+    /**
+     * @since 10.19.0
+     */
+    block?: ButtonProps['block'];
+    /**
+     * @since 10.19.0
+     */
+    clearRef?: React.RefObject<HTMLButtonElement>;
+    /**
+     * @since 10.19.0
+     */
+    disabled?: ButtonProps['disabled'];
+    /**
+     * @since 10.19.0
+     */
+    dropdown?: boolean;
+    /**
+     * @since 10.19.0
+     */
+    error?: boolean;
+    /**
+     * @since 10.19.0
+     */
+    icon?: ButtonProps['icon'];
+    /**
+     * @since 10.19.0
+     */
+    label?: React.ReactNode;
+    /**
+     * @since 10.19.0
+     */
+    loading?: ButtonProps['loading'];
+    /**
+     * @since 10.19.0
+     */
+    onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    /**
+     * @since 10.19.0
+     */
+    open?: boolean;
+    /**
+     * @since 10.19.0
+     */
+    placeholder?: string;
+    /**
+     * @since 10.19.0
+     */
+    qa?: Partial<QaTags>;
+    /**
+     * @since 10.19.0
+     */
+    size?: ButtonProps['size'];
+    /**
+     * @since 10.19.0
+     */
+    tabIndex?: number;
+    /**
+     * @since 10.19.0
+     */
+    type?: ButtonProps['type'];
+    /**
+     * @since 10.19.0
+     */
+    variant?: ButtonProps['variant'];
+    /**
+     * @since 10.19.0
+     */
+    isMenuOpened?: boolean;
+}
+export {};

package/dist/esm/components/Select/Select.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Select.types.js.map

package/dist/esm/components/Select/Select.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.types.js","sourceRoot":"","sources":["../../../../src/components/Select/Select.types.ts"],"names":[],"mappings":""}

package/dist/esm/components/Select/index.d.ts

@@ -0,0 +1,2 @@
+export { default, Select, Button, Option, OptGroup } from './Select';
+export { SelectProps, SelectButtonProps, OptionProps } from './Select.types';

package/dist/esm/components/Select/index.js

@@ -0,0 +1,2 @@
+export { default, Select, Button, Option, OptGroup } from './Select';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Select/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA"}

package/dist/esm/components/Semantic/Semantic.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { HeadingAttributes } from '../../utils/types';
+export declare const H1: React.ForwardRefExoticComponent<HeadingAttributes & React.RefAttributes<HTMLHeadingElement>>;
+export declare const H2: React.ForwardRefExoticComponent<HeadingAttributes & React.RefAttributes<HTMLHeadingElement>>;
+export declare const H3: React.ForwardRefExoticComponent<HeadingAttributes & React.RefAttributes<HTMLHeadingElement>>;
+export declare const P: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+export declare const UL: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLUListElement> & React.RefAttributes<HTMLUListElement>>;

package/dist/esm/components/Semantic/Semantic.js

@@ -0,0 +1,34 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import React from 'react';
+import { StyledH1, StyledH2, StyledH3, StyledP, StyledUL, } from './Semantic.styles';
+export var H1 = React.forwardRef(function H1(props, ref) {
+    return React.createElement(StyledH1, __assign({}, props, { ref: ref }));
+});
+export var H2 = React.forwardRef(function H2(props, ref) {
+    return React.createElement(StyledH2, __assign({}, props, { ref: ref }));
+});
+export var H3 = React.forwardRef(function H3(props, ref) {
+    return React.createElement(StyledH3, __assign({}, props, { ref: ref }));
+});
+export var P = React.forwardRef(function P(props, ref) {
+    return React.createElement(StyledP, __assign({}, props, { ref: ref }));
+});
+export var UL = React.forwardRef(function UL(props, ref) {
+    return React.createElement(StyledUL, __assign({}, props, { ref: ref }));
+});
+H1.displayName = 'H1';
+H2.displayName = 'H2';
+H3.displayName = 'H3';
+P.displayName = 'P';
+UL.displayName = 'UL';
+//# sourceMappingURL=Semantic.js.map

package/dist/esm/components/Semantic/Semantic.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Semantic.js","sourceRoot":"","sources":["../../../../src/components/Semantic/Semantic.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EACL,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,QAAQ,GACT,MAAM,mBAAmB,CAAA;AAE1B,MAAM,CAAC,IAAM,EAAE,GAAG,KAAK,CAAC,UAAU,CAChC,SAAS,EAAE,CAAC,KAAK,EAAE,GAAG;IACpB,OAAO,oBAAC,QAAQ,eAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAA;AAC1C,CAAC,CACF,CAAA;AAED,MAAM,CAAC,IAAM,EAAE,GAAG,KAAK,CAAC,UAAU,CAChC,SAAS,EAAE,CAAC,KAAK,EAAE,GAAG;IACpB,OAAO,oBAAC,QAAQ,eAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAA;AAC1C,CAAC,CACF,CAAA;AAED,MAAM,CAAC,IAAM,EAAE,GAAG,KAAK,CAAC,UAAU,CAChC,SAAS,EAAE,CAAC,KAAK,EAAE,GAAG;IACpB,OAAO,oBAAC,QAAQ,eAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAA;AAC1C,CAAC,CACF,CAAA;AAED,MAAM,CAAC,IAAM,CAAC,GAAG,KAAK,CAAC,UAAU,CAG/B,SAAS,CAAC,CAAC,KAAK,EAAE,GAAG;IACrB,OAAO,oBAAC,OAAO,eAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAA;AACzC,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,IAAM,EAAE,GAAG,KAAK,CAAC,UAAU,CAGhC,SAAS,EAAE,CAAC,KAAK,EAAE,GAAG;IACtB,OAAO,oBAAC,QAAQ,eAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAA;AAC1C,CAAC,CAAC,CAAA;AAEF,EAAE,CAAC,WAAW,GAAG,IAAI,CAAA;AAErB,EAAE,CAAC,WAAW,GAAG,IAAI,CAAA;AAErB,EAAE,CAAC,WAAW,GAAG,IAAI,CAAA;AAErB,CAAC,CAAC,WAAW,GAAG,GAAG,CAAA;AAEnB,EAAE,CAAC,WAAW,GAAG,IAAI,CAAA"}

package/dist/esm/components/Semantic/Semantic.styles.d.ts

@@ -0,0 +1,5 @@
+export declare const StyledH1: import("styled-components").StyledComponent<"h1", any, {}, never>;
+export declare const StyledH2: import("styled-components").StyledComponent<"h2", any, {}, never>;
+export declare const StyledH3: import("styled-components").StyledComponent<"h3", any, {}, never>;
+export declare const StyledP: import("styled-components").StyledComponent<"p", any, {}, never>;
+export declare const StyledUL: import("styled-components").StyledComponent<"ul", any, {}, never>;

package/dist/esm/components/Semantic/Semantic.styles.js

@@ -0,0 +1,23 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import styled, { css } from 'styled-components';
+import { colors } from '../../styles/colors';
+import { getTypographyIntent } from '../Typography/Typography.styles';
+export var StyledH1 = styled.h1(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: ", ";\n  ", "\n  margin: 0;\n"], ["\n  color: ", ";\n  ", "\n  margin: 0;\n"])), colors.gray15, getTypographyIntent('h1'));
+export var StyledH2 = styled.h2(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  color: ", ";\n  ", "\n  margin: 0;\n"], ["\n  color: ", ";\n  ", "\n  margin: 0;\n"])), colors.gray15, getTypographyIntent('h2'));
+export var StyledH3 = styled.h3(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  color: ", ";\n  ", "\n  margin: 0;\n"], ["\n  color: ", ";\n  ", "\n  margin: 0;\n"
+    // TODO: do we want to pull the font size/margin
+    // out to a const from Typography instead?
+])), colors.gray15, getTypographyIntent('h3'));
+// TODO: do we want to pull the font size/margin
+// out to a const from Typography instead?
+var bodyFontSize = 14;
+var topMarginRules = function () {
+    return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    & + &,\n    p + &,\n    ul + & {\n      margin-top: ", "px;\n    }\n  "], ["\n    & + &,\n    p + &,\n    ul + & {\n      margin-top: ", "px;\n    }\n  "])), bodyFontSize);
+};
+export var StyledP = styled.p(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  color: ", ";\n  ", "\n  ", "\n"], ["\n  color: ", ";\n  ", "\n  ", "\n"])), colors.gray15, getTypographyIntent('body'), topMarginRules);
+export var StyledUL = styled.ul(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  color: ", ";\n  margin: 0;\n  padding: 0;\n  ", "\n  ", "\n\n  padding-left: ", "px;\n\n  & > li {\n    list-style-type: disc;\n  }\n"], ["\n  color: ", ";\n  margin: 0;\n  padding: 0;\n  ", "\n  ", "\n\n  padding-left: ", "px;\n\n  & > li {\n    list-style-type: disc;\n  }\n"])), colors.gray15, getTypographyIntent('body'), topMarginRules, bodyFontSize);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+//# sourceMappingURL=Semantic.styles.js.map

package/dist/esm/components/Semantic/Semantic.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Semantic.styles.js","sourceRoot":"","sources":["../../../../src/components/Semantic/Semantic.styles.ts"],"names":[],"mappings":";;;;AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAA;AAErE,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,6GAAA,aACtB,EAAa,OACpB,EAAyB,kBAE5B,KAHU,MAAM,CAAC,MAAM,EACpB,mBAAmB,CAAC,IAAI,CAAC,CAE5B,CAAA;AACD,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,6GAAA,aACtB,EAAa,OACpB,EAAyB,kBAE5B,KAHU,MAAM,CAAC,MAAM,EACpB,mBAAmB,CAAC,IAAI,CAAC,CAE5B,CAAA;AACD,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,6GAAA,aACtB,EAAa,OACpB,EAAyB,kBAE5B;IAED,gDAAgD;IAChD,0CAA0C;KAN/B,MAAM,CAAC,MAAM,EACpB,mBAAmB,CAAC,IAAI,CAAC,CAE5B,CAAA;AAED,gDAAgD;AAChD,0CAA0C;AAC1C,IAAM,YAAY,GAAG,EAAE,CAAA;AAEvB,IAAM,cAAc,GAAG;IACrB,OAAO,GAAG,iJAAA,4DAIQ,EAAY,gBAE7B,KAFiB,YAAY,EAE7B;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,OAAO,GAAG,MAAM,CAAC,CAAC,uGAAA,aACpB,EAAa,OACpB,EAA2B,MAC3B,EAAc,IACjB,KAHU,MAAM,CAAC,MAAM,EACpB,mBAAmB,CAAC,MAAM,CAAC,EAC3B,cAAc,CACjB,CAAA;AACD,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,8MAAA,aACtB,EAAa,oCAGpB,EAA2B,MAC3B,EAAc,sBAEA,EAAY,sDAK7B,KAXU,MAAM,CAAC,MAAM,EAGpB,mBAAmB,CAAC,MAAM,CAAC,EAC3B,cAAc,EAEA,YAAY,CAK7B,CAAA"}

package/dist/esm/components/Semantic/index.d.ts

@@ -0,0 +1 @@
+export { H1, H2, H3, P, UL } from './Semantic';

package/dist/esm/components/Semantic/index.js

@@ -0,0 +1,2 @@
+export { H1, H2, H3, P, UL } from './Semantic';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Semantic/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Semantic/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,MAAM,YAAY,CAAA"}

package/dist/esm/components/Slider/Slider.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import { SliderProps } from './Slider.types';
+export declare const getIncrements: ({ min, max, step, }: {
+    min: number;
+    max: number;
+    step?: number | undefined;
+}) => number;
+export declare const getPercentage: ({ max, min, value, }: {
+    max: number;
+    min: number;
+    value: number;
+}) => number;
+export declare const getLabel: ({ max, min, step, index, }: {
+    max: number;
+    min: number;
+    step: number;
+    index: number;
+}) => number;
+export declare const getDefaultValue: ({ min, max, step, }: {
+    min: number;
+    max: number;
+    step?: number | undefined;
+}) => number;
+/**
+
+ A slider is a bar with selectable/grabbable handle. It allows users to click
+ and drag horizontally to a desired value. It is used when users need to select
+ a value from a predefined range of values. Sliders should always have a
+ corresponding value or increment displayed within proximity of the component.
+
+ @since 10.19.0
+
+ @see [Storybook](https://procore.github.io/core/latest/?path=/story/demos-slider--demo)
+
+ @see [Design Guidelines](https://design.procore.com/slider)
+
+ */
+export declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLInputElement>>;

package/dist/esm/components/Slider/Slider.js

@@ -0,0 +1,94 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { StyledContainer, StyledSlider, StyledIncrementOverlay, StyledIncrementContainer, StyledLabel, } from './Slider.styles';
+export var getIncrements = function (_a) {
+    var min = _a.min, max = _a.max, step = _a.step;
+    if (!step) {
+        return 0;
+    }
+    return (max - min) / step;
+};
+export var getPercentage = function (_a) {
+    var max = _a.max, min = _a.min, value = _a.value;
+    return ((value - min) / (max - min)) * 100;
+};
+export var getLabel = function (_a) {
+    var max = _a.max, min = _a.min, step = _a.step, index = _a.index;
+    if (min === 0) {
+        return index * step;
+    }
+    else if (min >= 0) {
+        return index * step + min;
+    }
+    else if (min <= 0) {
+        return (index - getIncrements({ max: max, min: min, step: step })) * step + max;
+    }
+    else {
+        return 0;
+    }
+};
+export var getDefaultValue = function (_a) {
+    var min = _a.min, max = _a.max, step = _a.step;
+    // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#value
+    var defaultVal = max < min ? min : min + (max - min) / 2;
+    return step ? Math.round(defaultVal / step) * step : defaultVal;
+};
+/**
+
+ A slider is a bar with selectable/grabbable handle. It allows users to click
+ and drag horizontally to a desired value. It is used when users need to select
+ a value from a predefined range of values. Sliders should always have a
+ corresponding value or increment displayed within proximity of the component.
+
+ @since 10.19.0
+
+ @see [Storybook](https://procore.github.io/core/latest/?path=/story/demos-slider--demo)
+
+ @see [Design Guidelines](https://design.procore.com/slider)
+
+ */
+export var Slider = React.forwardRef(function Slider(_a, ref) {
+    var className = _a.className, disabled = _a.disabled, onChange = _a.onChange, _b = _a.max, max = _b === void 0 ? 100 : _b, _c = _a.min, min = _c === void 0 ? 0 : _c, showLabel = _a.showLabel, step = _a.step, style = _a.style, value_ = _a.value, props = __rest(_a, ["className", "disabled", "onChange", "max", "min", "showLabel", "step", "style", "value"]);
+    var _d = React.useState(false), isDragging = _d[0], setIsDragging = _d[1];
+    var value = value_ !== null && value_ !== void 0 ? value_ : getDefaultValue({ max: max, min: min, step: step });
+    var increments = getIncrements({ max: max, min: min, step: step });
+    // check if the "step" value does not cleanly
+    //  divide into max - min
+    if (increments % 1 !== 0) {
+        console.warn('@procore/core-react: SLIDER COMPONENT WARNING: Your step value does not cleanly divide into max - min. This will cause your Slider to display incorrectly.');
+    }
+    return (React.createElement(StyledContainer, { className: className, style: style, showLabel: showLabel },
+        React.createElement(StyledSlider, __assign({}, props, { disabled: disabled, onChange: onChange, max: max, min: min, "$percent": getPercentage({ max: max, min: min, value: value }), ref: ref, step: step, type: "range", value: value, onMouseDown: function () { return setIsDragging(true); }, onMouseUp: function () { return setIsDragging(false); }, isDragging: isDragging })),
+        step && (React.createElement(StyledIncrementContainer, null, Array(Math.floor(increments) + 1)
+            .fill(null)
+            .map(function (_, index) {
+            return (React.createElement(StyledIncrementOverlay, { key: "core-slider-increment-overlay-".concat(index, "-").concat(min, "-").concat(max, "-").concat(step) }, showLabel && (React.createElement(StyledLabel, { intent: "small" }, getLabel({
+                min: min,
+                max: max,
+                step: step,
+                index: index,
+            })))));
+        })))));
+});
+//# sourceMappingURL=Slider.js.map

package/dist/esm/components/Slider/Slider.js.map

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

package/dist/esm/components/Slider/Slider.styles.d.ts

@@ -0,0 +1,11 @@
+export declare const StyledContainer: import("styled-components").StyledComponent<"div", any, {
+    showLabel?: boolean | undefined;
+}, never>;
+export declare const StyledSlider: import("styled-components").StyledComponent<"input", any, {
+    $percent: number;
+    ref: any;
+    isDragging: boolean;
+}, never>;
+export declare const StyledIncrementOverlay: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledIncrementContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledLabel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../../utils/types").SpanAttributes & import("../Typography/Typography.types").TypographyProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;

package/dist/esm/components/Slider/Slider.styles.js

@@ -0,0 +1,32 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import styled, { css } from 'styled-components';
+import { colors } from '../../styles/colors';
+import { Typography } from '../../components/Typography';
+var TRACK_HEIGHT = 4;
+var THUMB_HEIGHT = 14;
+function applyStylesOnlyToFF(styles) {
+    return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    @supports (-moz-appearance: none) {\n      ", "\n    }\n  "], ["\n    @supports (-moz-appearance: none) {\n      ", "\n    }\n  "])), styles);
+}
+var getThumbStyles = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  box-shadow: 0px 1px 4px rgba(40, 40, 40, 0.2), 0px 0px 3px rgba(0, 0, 0, 0.14),\n    0px 2px 3px rgba(0, 0, 0, 0.12);\n  height: ", "px;\n  width: ", "px;\n  border-radius: 15px;\n  background: ", ";\n  border: 2px solid ", ";\n  z-index: 3;\n  ", ";\n"], ["\n  box-shadow: 0px 1px 4px rgba(40, 40, 40, 0.2), 0px 0px 3px rgba(0, 0, 0, 0.14),\n    0px 2px 3px rgba(0, 0, 0, 0.12);\n  height: ", "px;\n  width: ", "px;\n  border-radius: 15px;\n  background: ", ";\n  border: 2px solid ", ";\n  z-index: 3;\n  ", ";\n"])), THUMB_HEIGHT, THUMB_HEIGHT, colors.white, colors.blue50, function (props) { return (props.isDragging ? "cursor: grabbing" : "cursor: pointer"); });
+var getTrackStyles = css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  height: ", "px;\n  animate: 0.2s;\n  border-radius: 1px;\n  border: 0px solid ", ";\n  z-index: 1;\n  ", ";\n"], ["\n  width: 100%;\n  height: ", "px;\n  animate: 0.2s;\n  border-radius: 1px;\n  border: 0px solid ", ";\n  z-index: 1;\n  ", ";\n"])), TRACK_HEIGHT, colors.black, function (props) { return (props.isDragging ? "cursor: grabbing" : "cursor: pointer"); });
+var getTrackBackground = function (percent) {
+    return "background: linear-gradient(to right, ".concat(colors.blue50, " 0%, ").concat(colors.blue50, " ").concat(percent, "%, ").concat(colors.gray70, " ").concat(percent, "%, ").concat(colors.gray70, " 100%);");
+};
+var getTrackBackgroundDisabled = function (percent) {
+    return "background: linear-gradient(to right, ".concat(colors.blue90, " 0%, ").concat(colors.blue90, " ").concat(percent, "%, ").concat(colors.gray90, " ").concat(percent, "%, ").concat(colors.gray90, " 100%);");
+};
+var getThumbDisabledStyles = css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  cursor: not-allowed;\n  border: 2px solid ", ";\n"], ["\n  cursor: not-allowed;\n  border: 2px solid ", ";\n"])), colors.blue90);
+export var StyledContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: relative;\n  ", ";\n"], ["\n  position: relative;\n  ", ";\n"])), function (props) { return props.showLabel && 'padding-bottom: 10px'; });
+export var StyledSlider = styled.input(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  -webkit-appearance: none;\n  margin: 0;\n  padding-top: 5px;\n  padding-bottom: 5px;\n  width: 100%;\n  border: 1px solid transparent;\n  background-color: transparent;\n  font-size: 12px;\n\n  &:focus {\n    outline: none;\n    ", ";\n    padding-top: 5px;\n    padding-bottom: 5px;\n    border-radius: 2px;\n  }\n\n  &::-webkit-slider-runnable-track {\n    ", "\n    ", "\n  }\n  &:disabled::-webkit-slider-runnable-track {\n    cursor: not-allowed;\n    ", "\n  }\n\n  &::-webkit-slider-thumb {\n    ", "\n    -webkit-appearance: none;\n    margin-top: -5px;\n  }\n  &:disabled::-webkit-slider-thumb {\n    ", "\n  }\n\n  &::-moz-range-track {\n    ", "\n    ", "\n  }\n  &:disabled::-moz-range-track {\n    cursor: not-allowed;\n    ", "\n  }\n\n  &::-moz-range-thumb {\n    ", "\n    height: 12px;\n    width: 12px;\n  }\n  &:disabled::-moz-range-thumb {\n    ", "\n  }\n\n  &::-ms-track {\n    ", "\n    height: ", "px;\n    color: transparent;\n    ", "\n  }\n  &:disabled::-ms-track {\n    cursor: not-allowed;\n    ", "\n  }\n\n  &::-ms-fill-lower {\n    background: ", ";\n    border: 0px solid ", ";\n    border-radius: 2px;\n    box-shadow: 1px 1px 1px ", ";\n  }\n\n  &::-ms-fill-upper {\n    background: ", ";\n    border: 0px solid ", ";\n    border-radius: 2px;\n    box-shadow: 1px 1px 1px ", ";\n  }\n\n  &::-ms-thumb {\n    ", "\n  }\n  &:disabled::-ms-thumb {\n    ", "\n  }\n\n  &:focus::-ms-fill-lower {\n    background: ", ";\n  }\n\n  &:focus::-ms-fill-upper {\n    background: ", ";\n  }\n"], ["\n  -webkit-appearance: none;\n  margin: 0;\n  padding-top: 5px;\n  padding-bottom: 5px;\n  width: 100%;\n  border: 1px solid transparent;\n  background-color: transparent;\n  font-size: 12px;\n\n  &:focus {\n    outline: none;\n    ", ";\n    padding-top: 5px;\n    padding-bottom: 5px;\n    border-radius: 2px;\n  }\n\n  &::-webkit-slider-runnable-track {\n    ", "\n    ", "\n  }\n  &:disabled::-webkit-slider-runnable-track {\n    cursor: not-allowed;\n    ", "\n  }\n\n  &::-webkit-slider-thumb {\n    ", "\n    -webkit-appearance: none;\n    margin-top: -5px;\n  }\n  &:disabled::-webkit-slider-thumb {\n    ", "\n  }\n\n  &::-moz-range-track {\n    ", "\n    ", "\n  }\n  &:disabled::-moz-range-track {\n    cursor: not-allowed;\n    ", "\n  }\n\n  &::-moz-range-thumb {\n    ", "\n    height: 12px;\n    width: 12px;\n  }\n  &:disabled::-moz-range-thumb {\n    ", "\n  }\n\n  &::-ms-track {\n    ", "\n    height: ", "px;\n    color: transparent;\n    ", "\n  }\n  &:disabled::-ms-track {\n    cursor: not-allowed;\n    ", "\n  }\n\n  &::-ms-fill-lower {\n    background: ", ";\n    border: 0px solid ", ";\n    border-radius: 2px;\n    box-shadow: 1px 1px 1px ", ";\n  }\n\n  &::-ms-fill-upper {\n    background: ", ";\n    border: 0px solid ", ";\n    border-radius: 2px;\n    box-shadow: 1px 1px 1px ", ";\n  }\n\n  &::-ms-thumb {\n    ", "\n  }\n  &:disabled::-ms-thumb {\n    ", "\n  }\n\n  &:focus::-ms-fill-lower {\n    background: ", ";\n  }\n\n  &:focus::-ms-fill-upper {\n    background: ", ";\n  }\n"])), function (props) {
+    return props.isDragging
+        ? "border: 1px solid transparent"
+        : "border: 1px solid ".concat(colors.blue50);
+}, getTrackStyles, function (props) { return getTrackBackground(props.$percent); }, function (props) { return getTrackBackgroundDisabled(props.$percent); }, getThumbStyles, getThumbDisabledStyles, getTrackStyles, function (props) { return getTrackBackground(props.$percent); }, function (props) { return getTrackBackgroundDisabled(props.$percent); }, getThumbStyles, getThumbDisabledStyles, getTrackStyles, THUMB_HEIGHT + 2, function (props) { return getTrackBackground(props.$percent); }, function (props) { return getTrackBackgroundDisabled(props.$percent); }, colors.blue50, colors.black, colors.black, colors.gray70, colors.black, colors.black, getThumbStyles, getThumbDisabledStyles, colors.blue50, colors.gray70);
+export var StyledIncrementOverlay = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  position: relative;\n  width: 0;\n  &::before {\n    content: '';\n    height: ", "px;\n    width: 2px;\n    background-color: white;\n    display: block;\n  }\n  z-index: 2;\n"], ["\n  position: relative;\n  width: 0;\n  &::before {\n    content: '';\n    height: ", "px;\n    width: 2px;\n    background-color: white;\n    display: block;\n  }\n  z-index: 2;\n"])), TRACK_HEIGHT);
+export var StyledIncrementContainer = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  position: absolute;\n  display: flex;\n  justify-content: space-between;\n  top: 6px;\n  ", "\n  left: 5px;\n  right: 5px;\n\n  > :first-child {\n    visibility: hidden;\n  }\n\n  > :last-child {\n    visibility: hidden;\n  }\n"], ["\n  position: absolute;\n  display: flex;\n  justify-content: space-between;\n  top: 6px;\n  ", "\n  left: 5px;\n  right: 5px;\n\n  > :first-child {\n    visibility: hidden;\n  }\n\n  > :last-child {\n    visibility: hidden;\n  }\n"])), applyStylesOnlyToFF("\n    top: 12px;\n  "));
+export var StyledLabel = styled(Typography)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  visibility: visible;\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  margin-top: 8px;\n"], ["\n  visibility: visible;\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  margin-top: 8px;\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
+//# sourceMappingURL=Slider.styles.js.map

package/dist/esm/components/Slider/Slider.styles.js.map

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

package/dist/esm/components/Slider/Slider.types.d.ts

@@ -0,0 +1,38 @@
+import { InputAttributes } from '../../utils/types';
+export interface SliderProps extends InputAttributes {
+    /**
+     * Whether or not to put the slider into a disabled state.
+     * @since 10.19.0
+     */
+    disabled?: boolean;
+    /**
+     * The maximum value of the slider (right side)
+     * @defaultValue 100
+     * @since 10.19.0
+     */
+    max?: number;
+    /**
+     * The minimum value of the slider (left side)
+     * @defaultValue 0
+     * @since 10.19.0
+     */
+    min?: number;
+    /**
+     * Whether or not to show value labels below the slider increments.
+     * @since 10.19.0
+     */
+    showLabel?: boolean;
+    /**
+     * The distance between each stopping point on the Slider.
+     * @defaultValue 1
+     * @since 10.19.0
+     */
+    step?: number;
+    /**
+     * The currently set value of the Slider.
+     * Defaults to the middle between min and max.
+     * @defaultValue (max < min) ? min : min + (max - min)/2;
+     * @since 10.19.0
+     */
+    value?: number;
+}

package/dist/esm/components/Slider/Slider.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Slider.types.js.map

package/dist/esm/components/Slider/Slider.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.types.js","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.types.ts"],"names":[],"mappings":""}

package/dist/esm/components/Slider/index.d.ts

@@ -0,0 +1 @@
+export { Slider, Slider as default } from './Slider';

package/dist/esm/components/Slider/index.js

@@ -0,0 +1,2 @@
+export { Slider, Slider as default } from './Slider';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Slider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Slider/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,UAAU,CAAA"}