@spscommerce/ds-react 5.20.2 → 5.20.3-ie

package/dist/out-tsc/option-list/useOptionListOptions.js

@@ -0,0 +1,171 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import * as React from "react";
+import { SpsOptionListOption } from "@spscommerce/ds-shared";
+import { debounce } from "@spscommerce/utils";
+function updateOptions(props, searchState, searchStatePatch, setOptionList, setAnyOptionHasIcon, promiseRef) {
+    return __awaiter(this, void 0, void 0, function () {
+        var options, areOptionsPromise, result, _a, newOpts, newOpts_1, newOpts_1_1, opt;
+        var e_1, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    options = typeof props.options === "function"
+                        ? props.options(searchState.value)
+                        : props.options || [];
+                    areOptionsPromise = options instanceof Promise;
+                    searchStatePatch({ pending: areOptionsPromise });
+                    // eslint-disable-next-line no-param-reassign
+                    promiseRef.current = areOptionsPromise ? options : null;
+                    if (!areOptionsPromise) return [3 /*break*/, 2];
+                    return [4 /*yield*/, options];
+                case 1:
+                    _a = (_c.sent()) || [];
+                    return [3 /*break*/, 3];
+                case 2:
+                    _a = options || [];
+                    _c.label = 3;
+                case 3:
+                    result = _a;
+                    if (areOptionsPromise && promiseRef.current !== options) {
+                        return [2 /*return*/];
+                    }
+                    newOpts = Array.from(result)
+                        .filter(Boolean)
+                        .map(function (thing) { return new SpsOptionListOption(thing, typeof thing === "function"
+                        ? {
+                            textKey: "label",
+                            captionKey: "caption",
+                        }
+                        : {
+                            textKey: props.textKey,
+                            captionKey: props.captionKey,
+                        }); });
+                    if (props.nullOption) {
+                        newOpts.unshift(new SpsOptionListOption(null, { text: props.nullOption }));
+                    }
+                    if (searchState.value) {
+                        searchStatePatch({ replacementPattern: new RegExp(searchState.value, "ig") });
+                        newOpts = newOpts.filter(function (o) {
+                            var regEx = new RegExp(searchState.value, "i");
+                            if (props.filterByTextAndCaptionKey) {
+                                return regEx.test(o.text) || regEx.test(o.caption);
+                            }
+                            return regEx.test(o.text);
+                        });
+                    }
+                    else {
+                        searchStatePatch({ replacementPattern: null });
+                    }
+                    if (props.disabledOptions) {
+                        try {
+                            for (newOpts_1 = __values(newOpts), newOpts_1_1 = newOpts_1.next(); !newOpts_1_1.done; newOpts_1_1 = newOpts_1.next()) {
+                                opt = newOpts_1_1.value;
+                                if (props.disabledOptions.includes(opt.value)) {
+                                    opt.disabled = true;
+                                }
+                            }
+                        }
+                        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                        finally {
+                            try {
+                                if (newOpts_1_1 && !newOpts_1_1.done && (_b = newOpts_1.return)) _b.call(newOpts_1);
+                            }
+                            finally { if (e_1) throw e_1.error; }
+                        }
+                    }
+                    setOptionList(Object.freeze(newOpts));
+                    if (props.onOptionListChanged) {
+                        props.onOptionListChanged(newOpts.length);
+                    }
+                    setAnyOptionHasIcon(newOpts.some(function (o) { return o.value && !!o.value.icon; }));
+                    searchStatePatch({ pending: false });
+                    return [2 /*return*/];
+            }
+        });
+    });
+}
+export function useOptionListOptions(props, searchState, searchStatePatch) {
+    var _a = __read(React.useState(Object.freeze([])), 2), optionList = _a[0], setOptionList = _a[1];
+    var _b = __read(React.useState(false), 2), anyOptionHasIcon = _b[0], setAnyOptionHasIcon = _b[1];
+    var promiseRef = React.useRef(null);
+    /**
+     * Memoizes the options if they're a function, because people forget that
+     * and the change handling stops working
+     */
+    var optionsRef = React.useRef(props.options);
+    if (typeof props.options !== "function") {
+        optionsRef.current = props.options;
+    }
+    var update = React.useMemo(function () { return (typeof optionsRef.current === "function"
+        ? debounce(updateOptions, typeof props.searchDebounce !== "undefined" ? props.searchDebounce : 500)
+        : updateOptions); }, [optionsRef.current, props.disabledOptions]);
+    React.useEffect(function () {
+        void update(props, searchState, searchStatePatch, setOptionList, setAnyOptionHasIcon, promiseRef);
+    }, [optionsRef.current,
+        searchState.value,
+        props.disabledOptions]);
+    return [optionList, anyOptionHasIcon];
+}
+//# sourceMappingURL=useOptionListOptions.js.map

package/dist/out-tsc/option-list/useOptionListOptions.js.map

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

package/dist/out-tsc/option-list/useOptionListSearch.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import type { SpsOptionListProps } from "./SpsOptionListProps";
+export interface OptionListSearchState {
+    isAsync: boolean;
+    pending: boolean;
+    value: string;
+    replacementPattern: RegExp;
+}
+export declare function useOptionListSearch({ hideInlineSearch, options, onSearchChange, search, searchPlaceholder, searchInputRef, }: SpsOptionListProps): [
+    JSX.Element,
+    OptionListSearchState,
+    React.Dispatch<Partial<OptionListSearchState>>
+];

package/dist/out-tsc/option-list/useOptionListSearch.js

@@ -0,0 +1,74 @@
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import * as React from "react";
+import { FauxChangeEvent } from "../utils/FauxChangeEvent";
+import { usePatchReducer } from "../utils/usePatchReducer";
+export function useOptionListSearch(_a) {
+    var hideInlineSearch = _a.hideInlineSearch, options = _a.options, onSearchChange = _a.onSearchChange, _b = _a.search, search = _b === void 0 ? "" : _b, _c = _a.searchPlaceholder, searchPlaceholder = _c === void 0 ? "Search…" : _c, searchInputRef = _a.searchInputRef;
+    var _d = __read(usePatchReducer({
+        isAsync: typeof options === "function",
+        pending: false,
+        value: search,
+        replacementPattern: null,
+    }), 2), searchState = _d[0], searchStatePatch = _d[1];
+    var handleInputChange = React.useCallback(function (event) {
+        searchStatePatch({ value: event.target.value });
+        if (onSearchChange) {
+            onSearchChange(event);
+        }
+    }, [onSearchChange]);
+    var handleInputClick = React.useCallback(function (event) {
+        event.nativeEvent.stopImmediatePropagation();
+        event.stopPropagation();
+    }, []);
+    var handleClearClick = React.useCallback(function (event) {
+        event.nativeEvent.stopImmediatePropagation();
+        searchStatePatch({ value: "" });
+        if (onSearchChange) {
+            onSearchChange(new FauxChangeEvent(searchInputRef.current));
+        }
+        if (searchInputRef.current) {
+            searchInputRef.current.focus();
+        }
+    }, [onSearchChange]);
+    var handleKeyDown = function (event) {
+        if (!event) {
+            return;
+        }
+        if (!["Tab",
+            "Escape",
+            "Enter",
+            "Up",
+            "ArrowUp",
+            "Down",
+            "ArrowDown"].includes(event.key)) {
+            event.stopPropagation();
+        }
+    };
+    React.useEffect(function () {
+        searchStatePatch({ value: search });
+    }, [search]);
+    var searchElement = searchState.isAsync && !hideInlineSearch && (React.createElement("div", { className: "sps-option-list__search sps-form-group sps-text-input" },
+        React.createElement("div", { className: "sps-form-control" },
+            !searchState.value && React.createElement("i", { className: "sps-icon sps-icon-filter sps-text-input__icon" }),
+            React.createElement("input", { type: "text", className: "sps-text-input__input", placeholder: searchPlaceholder, ref: searchInputRef, value: searchState.value, onChange: handleInputChange, onClick: handleInputClick, onKeyDown: handleKeyDown }),
+            searchState.value && React.createElement("i", { className: "sps-icon sps-icon-x-circle sps-form-control__clear-btn", onClick: handleClearClick }))));
+    return [searchElement,
+        searchState,
+        searchStatePatch];
+}
+//# sourceMappingURL=useOptionListSearch.js.map

package/dist/out-tsc/option-list/useOptionListSearch.js.map

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

package/dist/out-tsc/option-list/useSpsAction.d.ts

@@ -0,0 +1,2 @@
+import type { SpsActionDescriptor, SpsActionMethod } from "@spscommerce/ds-shared";
+export declare function useSpsAction(descriptor: SpsActionDescriptor, fn: () => void): [SpsActionMethod, (newMetadata: any) => void];

package/dist/out-tsc/option-list/useSpsAction.js

@@ -0,0 +1,40 @@
+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 __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import { SPS_ACTION_DEFAULTS } from "@spscommerce/ds-shared";
+import { usePatchReducer } from "../utils/usePatchReducer";
+export function useSpsAction(descriptor, fn) {
+    var metadata = __assign(__assign({}, SPS_ACTION_DEFAULTS), descriptor);
+    var _a = __read(usePatchReducer(metadata), 2), state = _a[0], patchState = _a[1];
+    Object.assign(fn, state);
+    return [fn,
+        function (newMetadata) {
+            patchState(newMetadata);
+            Object.assign(fn, state);
+        }];
+}
+//# sourceMappingURL=useSpsAction.js.map

package/dist/out-tsc/option-list/useSpsAction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSpsAction.js","sourceRoot":"","sources":["../../../src/option-list/useSpsAction.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAE3D,MAAM,UAAU,YAAY,CAC1B,UAA+B,EAC/B,EAAc;IAEd,IAAM,QAAQ,yBACT,mBAAmB,GACnB,UAAU,CACd,CAAC;IACI,IAAA,KAAA,OAAsB,eAAe,CAAC,QAAQ,CAAC,IAAA,EAA9C,KAAK,QAAA,EAAE,UAAU,QAA6B,CAAC;IACtD,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;IAEzB,OAAO,CAAC,EAAE;QACR,UAAC,WAAW;YACV,UAAU,CAAC,WAAW,CAAC,CAAC;YACxB,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;QAC3B,CAAC,CAAC,CAAC;AACP,CAAC"}

package/dist/out-tsc/page-title/SpsPageSubtitle.d.ts

@@ -0,0 +1,10 @@
+import * as PropTypes from "../prop-types";
+declare const propTypes: {
+    children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    className: PropTypes.Requireable<string>;
+    "data-testid": PropTypes.Requireable<string>;
+    unsafelyReplaceClassName: PropTypes.Requireable<string>;
+};
+export declare type SpsPageSubtitleProps = PropTypes.InferTS<typeof propTypes, HTMLDivElement>;
+export declare function SpsPageSubtitle(props: SpsPageSubtitleProps): JSX.Element;
+export {};

package/dist/out-tsc/page-title/SpsPageSubtitle.js

@@ -0,0 +1,38 @@
+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 clsx from "clsx";
+import * as React from "react";
+import * as PropTypes from "../prop-types";
+var propsDoc = {};
+var propTypes = __assign({}, PropTypes.spsGlobalPropTypes);
+export function SpsPageSubtitle(props) {
+    var children = props.children, className = props.className, testId = props["data-testid"], unsafelyReplaceClassName = props.unsafelyReplaceClassName, rest = __rest(props, ["children", "className", "data-testid", "unsafelyReplaceClassName"]);
+    var classes = clsx(unsafelyReplaceClassName || "sps-page-title__subtitle", className);
+    return (React.createElement("div", __assign({ className: classes, "data-testid": testId }, rest), children));
+}
+Object.assign(SpsPageSubtitle, {
+    props: propsDoc,
+    propTypes: propTypes,
+    displayName: "SpsPageSubtitle",
+});
+//# sourceMappingURL=SpsPageSubtitle.js.map

package/dist/out-tsc/page-title/SpsPageSubtitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpsPageSubtitle.js","sourceRoot":"","sources":["../../../src/page-title/SpsPageSubtitle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,SAAS,MAAM,eAAe,CAAC;AAE3C,IAAM,QAAQ,GAAG,EAAE,CAAC;AAEpB,IAAM,SAAS,gBACV,SAAS,CAAC,kBAAkB,CAChC,CAAC;AAIF,MAAM,UAAU,eAAe,CAAC,KAA2B;IAEvD,IAAA,QAAQ,GAKN,KAAK,SALC,EACR,SAAS,GAIP,KAAK,UAJE,EACM,MAAM,GAGnB,KAAK,eAHc,EACrB,wBAAwB,GAEtB,KAAK,yBAFiB,EACrB,IAAI,UACL,KAAK,EANH,oEAML,CADQ,CACC;IAEV,IAAM,OAAO,GAAG,IAAI,CAClB,wBAAwB,IAAI,0BAA0B,EACtD,SAAS,CACV,CAAC;IAEF,OAAO,CACL,sCAAK,SAAS,EAAE,OAAO,iBAAe,MAAM,IAAM,IAAI,GACnD,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE;IAC7B,KAAK,EAAE,QAAQ;IACf,SAAS,WAAA;IACT,WAAW,EAAE,iBAAiB;CAC/B,CAAC,CAAC"}

package/dist/out-tsc/page-title/SpsPageTitle.d.ts

@@ -0,0 +1,10 @@
+import * as PropTypes from "../prop-types";
+declare const propTypes: {
+    children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    className: PropTypes.Requireable<string>;
+    "data-testid": PropTypes.Requireable<string>;
+    unsafelyReplaceClassName: PropTypes.Requireable<string>;
+};
+export declare type SpsPageTitleProps = PropTypes.InferTS<typeof propTypes, HTMLDivElement>;
+export declare function SpsPageTitle(props: SpsPageTitleProps): JSX.Element;
+export {};

package/dist/out-tsc/page-title/SpsPageTitle.examples.d.ts

@@ -0,0 +1,2 @@
+import type { DSReactExamples } from "@spscommerce/ds-shared";
+export declare const SpsPageTitleExamples: DSReactExamples;

package/dist/out-tsc/page-title/SpsPageTitle.examples.js

@@ -0,0 +1,41 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { code } from "@spscommerce/utils";
+export var SpsPageTitleExamples = {
+    basic: {
+        label: "Basic",
+        examples: {
+            basic: {
+                jsx: code(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n                    <SpsPageTitle>\n                        Cabela's Purchase Order #123456789012\n                    </SpsPageTitle>\n                "], ["\n                    <SpsPageTitle>\n                        Cabela's Purchase Order #123456789012\n                    </SpsPageTitle>\n                "]))),
+            },
+        },
+    },
+    withIcon: {
+        label: "With Icon",
+        examples: {
+            withIcon: {
+                jsx: code(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n                    <SpsPageTitle>\n                        <i className=\"sps-icon sps-icon-exclamation-circle red200\" aria-hidden=\"true\"></i>\n                        Cabela's Purchase Order #123456789012\n                    </SpsPageTitle>\n                "], ["\n                    <SpsPageTitle>\n                        <i className=\"sps-icon sps-icon-exclamation-circle red200\" aria-hidden=\"true\"></i>\n                        Cabela's Purchase Order #123456789012\n                    </SpsPageTitle>\n                "]))),
+            },
+        },
+    },
+    withSubtitle: {
+        label: "With Subtitle",
+        examples: {
+            withSubtitle: {
+                jsx: code(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n                    <SpsPageTitle>\n                        Cabela's Purchase Order #123456789012\n                        <SpsPageSubtitle>Cabela's\n                            <i className=\"sps-icon sps-icon-outgoing\"></i>\n                            MacNeil Automotive Parts\n                        </SpsPageSubtitle>\n                    </SpsPageTitle>\n                "], ["\n                    <SpsPageTitle>\n                        Cabela's Purchase Order #123456789012\n                        <SpsPageSubtitle>Cabela's\n                            <i className=\"sps-icon sps-icon-outgoing\"></i>\n                            MacNeil Automotive Parts\n                        </SpsPageSubtitle>\n                    </SpsPageTitle>\n                "]))),
+            },
+        },
+    },
+    withSubtitleAndIcon: {
+        label: "With Subtitle and Icon",
+        examples: {
+            withSubtitleAndIcon: {
+                jsx: code(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n                    <SpsPageTitle>\n                        <i aria-hidden=\"true\" className=\"sps-icon sps-icon-exclamation-circle red200\"></i>\n                        Cabela's Purchase Order #123456789012\n                        <SpsPageSubtitle>\n                            Cabela's <i aria-hidden=\"true\" className=\"sps-icon sps-icon-outgoing\"></i>\n                            MacNeil Automotive Parts\n                        </SpsPageSubtitle>\n                    </SpsPageTitle>\n                "], ["\n                    <SpsPageTitle>\n                        <i aria-hidden=\"true\" className=\"sps-icon sps-icon-exclamation-circle red200\"></i>\n                        Cabela's Purchase Order #123456789012\n                        <SpsPageSubtitle>\n                            Cabela's <i aria-hidden=\"true\" className=\"sps-icon sps-icon-outgoing\"></i>\n                            MacNeil Automotive Parts\n                        </SpsPageSubtitle>\n                    </SpsPageTitle>\n                "]))),
+            },
+        },
+    },
+};
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+//# sourceMappingURL=SpsPageTitle.examples.js.map

package/dist/out-tsc/page-title/SpsPageTitle.examples.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpsPageTitle.examples.js","sourceRoot":"","sources":["../../../src/page-title/SpsPageTitle.examples.ts"],"names":[],"mappings":";;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAG1C,MAAM,CAAC,IAAM,oBAAoB,GAAoB;IACnD,KAAK,EAAE;QACL,KAAK,EAAE,OAAO;QACd,QAAQ,EAAE;YACR,KAAK,EAAE;gBACL,GAAG,EAAE,IAAI,+NAAA,4JAIA,IAAA;aACV;SACF;KACF;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,WAAW;QAClB,QAAQ,EAAE;YACR,QAAQ,EAAE;gBACR,GAAG,EAAE,IAAI,+UAAA,4QAKA,IAAA;aACV;SACF;KACF;IACD,YAAY,EAAE;QACZ,KAAK,EAAE,eAAe;QACtB,QAAQ,EAAE;YACR,YAAY,EAAE;gBACZ,GAAG,EAAE,IAAI,kcAAA,+XAQA,IAAA;aACV;SACF;KACF;IACD,mBAAmB,EAAE;QACnB,KAAK,EAAE,wBAAwB;QAC/B,QAAQ,EAAE;YACR,mBAAmB,EAAE;gBACnB,GAAG,EAAE,IAAI,wkBAAA,qgBASA,IAAA;aACV;SACF;KACF;CACF,CAAC"}

package/dist/out-tsc/page-title/SpsPageTitle.js

@@ -0,0 +1,50 @@
+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 clsx from "clsx";
+import * as React from "react";
+import * as PropTypes from "../prop-types";
+var propsDoc = {};
+var propTypes = __assign({}, PropTypes.spsGlobalPropTypes);
+export function SpsPageTitle(props) {
+    var children = props.children, className = props.className, testId = props["data-testid"], unsafelyReplaceClassName = props.unsafelyReplaceClassName, rest = __rest(props, ["children", "className", "data-testid", "unsafelyReplaceClassName"]);
+    var icon;
+    var otherChildren = [];
+    React.Children.forEach(children, function (child) {
+        if (React.isValidElement(child) && child.type === "i") {
+            icon = child;
+        }
+        else {
+            otherChildren.push(child);
+        }
+    });
+    var classes = clsx(unsafelyReplaceClassName || "sps-page-title", className);
+    return (React.createElement("div", __assign({ className: classes, "data-testid": "" + testId }, rest),
+        icon,
+        React.createElement("div", { className: "sps-page-title__text", "data-testid": testId + "__text" }, otherChildren)));
+}
+Object.assign(SpsPageTitle, {
+    props: propsDoc,
+    propTypes: propTypes,
+    displayName: "SpsPageTitle",
+});
+//# sourceMappingURL=SpsPageTitle.js.map

package/dist/out-tsc/page-title/SpsPageTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpsPageTitle.js","sourceRoot":"","sources":["../../../src/page-title/SpsPageTitle.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,SAAS,MAAM,eAAe,CAAC;AAE3C,IAAM,QAAQ,GAAG,EAAE,CAAC;AAEpB,IAAM,SAAS,gBACV,SAAS,CAAC,kBAAkB,CAChC,CAAC;AAIF,MAAM,UAAU,YAAY,CAAC,KAAwB;IAEjD,IAAA,QAAQ,GAKN,KAAK,SALC,EACR,SAAS,GAIP,KAAK,UAJE,EACM,MAAM,GAGnB,KAAK,eAHc,EACrB,wBAAwB,GAEtB,KAAK,yBAFiB,EACrB,IAAI,UACL,KAAK,EANH,oEAML,CADQ,CACC;IAEV,IAAI,IAAI,CAAC;IACT,IAAM,aAAa,GAAG,EAAE,CAAC;IAEzB,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,UAAC,KAAK;QACrC,IAAI,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,KAAK,GAAG,EAAE;YACrD,IAAI,GAAG,KAAK,CAAC;SACd;aAAM;YACL,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SAC3B;IACH,CAAC,CAAC,CAAC;IAEH,IAAM,OAAO,GAAG,IAAI,CAClB,wBAAwB,IAAI,gBAAgB,EAC5C,SAAS,CACV,CAAC;IAEF,OAAO,CACL,sCAAK,SAAS,EAAE,OAAO,iBAAe,KAAG,MAAQ,IAAM,IAAI;QACxD,IAAI;QACL,6BAAK,SAAS,EAAC,sBAAsB,iBAAiB,MAAM,WAAQ,IAAG,aAAa,CAAO,CACvF,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;IAC1B,KAAK,EAAE,QAAQ;IACf,SAAS,WAAA;IACT,WAAW,EAAE,cAAc;CAC5B,CAAC,CAAC"}

package/dist/out-tsc/page-title/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./SpsPageTitle";
+export * from "./SpsPageSubtitle";
+export * from "./SpsPageTitle.examples";

package/dist/out-tsc/page-title/index.js

@@ -0,0 +1,4 @@
+export * from "./SpsPageTitle";
+export * from "./SpsPageSubtitle";
+export * from "./SpsPageTitle.examples";
+//# sourceMappingURL=index.js.map

package/dist/out-tsc/page-title/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/page-title/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,yBAAyB,CAAC"}

package/dist/out-tsc/pagination/SpsPageSelector.d.ts

@@ -0,0 +1,14 @@
+import * as PropTypes from "../prop-types";
+declare const propTypes: {
+    children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    className: PropTypes.Requireable<string>;
+    "data-testid": PropTypes.Requireable<string>;
+    unsafelyReplaceClassName: PropTypes.Requireable<string>;
+    numPages: PropTypes.Requireable<number>;
+    onPageChange: PropTypes.Requireable<(number: any) => void>;
+    page: PropTypes.Requireable<number>;
+    disabled: PropTypes.Requireable<boolean>;
+};
+export declare type SpsPageSelectorProps = PropTypes.InferTS<typeof propTypes, HTMLDivElement>;
+export declare function SpsPageSelector(props: SpsPageSelectorProps): JSX.Element;
+export {};

package/dist/out-tsc/pagination/SpsPageSelector.js

@@ -0,0 +1,99 @@
+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;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import { constrain, debounce } from "@spscommerce/utils";
+import clsx from "clsx";
+import * as React from "react";
+import * as PropTypes from "../prop-types";
+import { I18nContext } from "../i18n";
+import { useElementId } from "../utils/index";
+var propsDoc = {
+    page: "number",
+    numPages: "number",
+    onPageChange: "(number) => void",
+    disabled: "boolean",
+};
+var propTypes = __assign({ numPages: PropTypes.number, onPageChange: PropTypes.fun(), page: PropTypes.number, disabled: PropTypes.bool }, PropTypes.spsGlobalPropTypes);
+export function SpsPageSelector(props) {
+    var _a = props.numPages, numPages = _a === void 0 ? 0 : _a, onPageChange = props.onPageChange, _b = props.page, pageProp = _b === void 0 ? 1 : _b, unsafelyReplaceClassName = props.unsafelyReplaceClassName, className = props.className, testId = props["data-testid"], _c = props.disabled, disabled = _c === void 0 ? false : _c, rest = __rest(props, ["numPages", "onPageChange", "page", "unsafelyReplaceClassName", "className", "data-testid", "disabled"]);
+    var t = React.useContext(I18nContext).t;
+    var _d = __read(React.useState(pageProp), 2), inputPage = _d[0], setInputPage = _d[1];
+    var _e = __read(React.useState(pageProp), 2), page = _e[0], setPage = _e[1];
+    React.useEffect(function () {
+        setPage(pageProp);
+        setInputPage(pageProp);
+    }, [pageProp]);
+    function updatePage(newPage) {
+        var constrainedPage = constrain(newPage, [1, numPages]);
+        if (constrainedPage !== inputPage) {
+            setPage(constrainedPage);
+            setInputPage(constrainedPage);
+            if (onPageChange && typeof onPageChange === "function") {
+                onPageChange(constrainedPage);
+            }
+        }
+    }
+    var debouncedPageUpdate = debounce(updatePage, 500);
+    function onTextInputInput(event) {
+        setInputPage(event.target.value);
+        void debouncedPageUpdate(parseInt(event.target.value, 10));
+    }
+    var classes = clsx(unsafelyReplaceClassName || "sps-page-selector", className);
+    var id = useElementId(null);
+    return (React.createElement("div", __assign({ className: classes, "data-testid": testId }, rest),
+        React.createElement("div", { className: "sps-pagination__input-wrapper", "data-testid": testId + "__input" },
+            React.createElement("div", { className: "sps-form-control sps-pagination__input-sizer" }, inputPage),
+            React.createElement("label", { htmlFor: id.current, className: "sr-only" }, t("design-system:pagination.page")),
+            React.createElement("input", { id: id.current, type: "text", value: inputPage, onInput: onTextInputInput, onChange: function () { }, className: "sps-form-control sps-pagination__input", disabled: disabled })),
+        React.createElement("span", { className: "sps-page-selector__total-pages", "data-testid": testId + "_page-count" }, Number.isNaN(numPages)
+            ? t("design-system:pagination.ofMany")
+            : t("design-system:pagination.ofPageCount", { pageCount: numPages })),
+        React.createElement("div", { className: "sps-icon-button-panel", "data-testid": testId + "__buttons" },
+            React.createElement("div", { className: clsx("sps-button", "sps-button--icon", (page === 1 || disabled) && "sps-button--disabled") },
+                React.createElement("button", { type: "button", onClick: function () { return updatePage(page - 1); }, disabled: page === 1 || disabled, title: t("design-system:pagination.prevPage") },
+                    React.createElement("i", { className: "sps-icon sps-icon-chevron-left", "aria-hidden": "true" }))),
+            React.createElement("div", { className: clsx("sps-button", "sps-button--icon", (page === numPages || disabled) && "sps-button--disabled") },
+                React.createElement("button", { type: "button", onClick: function () { return updatePage(page + 1); }, disabled: page === numPages || disabled, title: t("design-system:pagination.nextPage") },
+                    React.createElement("i", { className: "sps-icon sps-icon-chevron-right", "aria-hidden": "true" }))))));
+}
+Object.assign(SpsPageSelector, {
+    props: propsDoc,
+    propTypes: propTypes,
+    displayName: "SpsPageSelector",
+});
+//# sourceMappingURL=SpsPageSelector.js.map