@servicetitan/design-system 10.7.1 → 11.1.0

package/dist/components/Drawer/Drawer.js

@@ -1,34 +1,3 @@
-"use strict";
-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 __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 __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 __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)
@@ -40,54 +9,56 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Drawer = void 0;
-var react_1 = __importStar(require("react"));
-var classnames_1 = __importDefault(require("classnames"));
-var framer_motion_1 = require("framer-motion");
-var tokens_1 = __importDefault(require("@servicetitan/tokens"));
-var DrawerHeader_1 = require("./DrawerHeader");
-var DrawerFooter_1 = require("./DrawerFooter");
-var DrawerWindow_1 = require("./DrawerWindow");
-var OverlayContext_1 = require("../../utilities/OverlayContext");
-var Portal_1 = require("../../internal/Portal");
-var useFocusScope_1 = require("../../hooks/useFocusScope");
-var focus_utils_1 = require("../../utilities/focus-utils");
-var Drawer = function (_a) {
-    var _b;
-    var children = _a.children, className = _a.className, footer = _a.footer, footerAlign = _a.footerAlign, header = _a.header, onClose = _a.onClose, open = _a.open, _c = _a.portal, portal = _c === void 0 ? true : _c, backdrop = _a.backdrop, _d = _a.width, width = _d === void 0 ? 's' : _d, focusScopeOptions = _a.focusScopeOptions, rest = __rest(_a, ["children", "className", "footer", "footerAlign", "header", "onClose", "open", "portal", "backdrop", "width", "focusScopeOptions"]);
-    var overlayContext = (0, react_1.useContext)(OverlayContext_1.OverlayContext);
-    var drawerRef = (0, react_1.useRef)(null);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    var lastActiveElement = (0, react_1.useMemo)(function () { return (0, focus_utils_1.getActiveElement)(); }, [open]);
-    var handleTab = (0, useFocusScope_1.useFocusScope)(drawerRef, __assign({ disableAutofocus: !open, disableTrapping: !open, restoreFocusRef: { current: lastActiveElement } }, focusScopeOptions)).handleTab;
-    var DrawerClasses = (0, classnames_1.default)('Drawer', className, (_b = {
-            'Drawer--open': open,
-            'Drawer--portal': portal || backdrop,
-            'Drawer--close': !open
-        },
-        _b["Drawer--w-" + width] = width,
-        _b));
-    var durationSlow = parseInt(tokens_1.default.durationSlow, 10) / 1000; // '300ms' -> 0.3
-    var drawerAnimation = {
+import React, { useRef } from 'react';
+import { AnimatePresence, motion } from 'framer-motion';
+import classnames from 'classnames';
+import tokens from '@servicetitan/tokens';
+import { Button, Headline } from '../';
+import { Overlay } from '../../internal/Overlay';
+import { FocusTrap } from '../../utilities/FocusTrap';
+export const Drawer = (_a) => {
+    var { animate = true, children, className, footer, footerAlign = 'right', header, onClose, open, portal = true, backdrop, width = 's', focusTrapOptions } = _a, rest = __rest(_a, ["animate", "children", "className", "footer", "footerAlign", "header", "onClose", "open", "portal", "backdrop", "width", "focusTrapOptions"]);
+    const drawerRef = useRef(null);
+    const [focusWrapper, setFocusWrapper] = React.useState(1);
+    const DrawerClasses = classnames('Drawer', className, {
+        'Drawer--open': open,
+        'Drawer--portal': portal || backdrop,
+        'Drawer--close': !open,
+        [`Drawer--w-${width}`]: width,
+    });
+    const DrawerFooterClassNames = classnames('Drawer__footer', className, {
+        'justify-content-start': footerAlign === 'left',
+        'justify-content-center': footerAlign === 'center',
+        'justify-content-end': footerAlign === 'right',
+        'justify-content-between': footerAlign === 'space-between',
+    });
+    const durationSlow = parseInt(tokens.durationSlow, 10) / 1000; // '300ms' -> 0.3
+    const framerAnimation = {
         initial: { opacity: 0, x: '100%' },
         animate: { opacity: 1, x: 0 },
         exit: { opacity: 0, x: '100%' },
         transition: { type: 'easeInOut', duration: durationSlow },
     };
-    var drawerContent = (react_1.default.createElement(framer_motion_1.motion.div, __assign({ className: DrawerClasses, ref: drawerRef, onKeyDown: handleTab }, drawerAnimation, rest),
-        react_1.default.createElement(OverlayContext_1.OverlayContext.Provider, { value: overlayContext.concat('drawer') },
-            header && (react_1.default.createElement(DrawerHeader_1.DrawerHeader, { onClose: onClose }, header)),
-            react_1.default.createElement("div", { className: "Drawer__content" }, children),
-            footer && (react_1.default.createElement(DrawerFooter_1.DrawerFooter, { align: footerAlign }, footer)))));
-    var drawer = backdrop ? (react_1.default.createElement(DrawerWindow_1.DrawerWindow, { animate: true, onClose: onClose }, drawerContent)) : (react_1.default.createElement(framer_motion_1.AnimatePresence, null, drawerContent));
-    return open && react_1.default.createElement(Portal_1.Portal, { conditional: portal && !backdrop }, drawer);
+    const DrawerEl = animate ? motion.div : 'div';
+    const DrawerProps = Object.assign(Object.assign({ className: DrawerClasses, ref: drawerRef, tabIndex: focusWrapper }, (animate && framerAnimation)), rest);
+    React.useEffect(() => {
+        // Removes wrapper to be focusable element after initial tab
+        function eventHandler(event) {
+            event.key === 'Tab' && setFocusWrapper(-1);
+            document.removeEventListener('keydown', eventHandler);
+        }
+        document.addEventListener('keydown', eventHandler);
+    }, []);
+    React.useEffect(() => {
+        setFocusWrapper(1);
+    }, [open]);
+    return (React.createElement(Overlay, { animate: animate, portal: portal, backdrop: backdrop, onClose: onClose, open: open },
+        React.createElement(AnimatePresence, null, open && (React.createElement(FocusTrap, Object.assign({}, focusTrapOptions),
+            React.createElement(DrawerEl, Object.assign({}, DrawerProps),
+                header && (React.createElement("div", { className: "Drawer__header" },
+                    React.createElement(Headline, { className: "Drawer__header-title" }, header),
+                    onClose && (React.createElement(Button, { fill: "subtle", className: "Drawer__header-close", iconName: "clear", size: "xsmall", onClick: onClose })))),
+                React.createElement("div", { className: "Drawer__content" }, children),
+                footer && (React.createElement("div", { className: DrawerFooterClassNames }, footer))))))));
 };
-exports.Drawer = Drawer;
-exports.Drawer.Header = DrawerHeader_1.DrawerHeader;
-exports.Drawer.Footer = DrawerFooter_1.DrawerFooter;
-exports.Drawer.Window = DrawerWindow_1.DrawerWindow;
 //# sourceMappingURL=Drawer.js.map

package/dist/components/Drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+D;AAC/D,0DAAoC;AACpC,+CAAwD;AACxD,gEAA0C;AAE1C,+CAA8C;AAC9C,+CAAiE;AACjE,+CAA8C;AAC9C,iEAAgE;AAChE,gDAA+C;AAC/C,2DAA6E;AAC7E,2DAA+D;AA0CxD,IAAM,MAAM,GAAW,UAAC,EAa9B;;IAZA,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,MAAM,YAAA,EACN,OAAO,aAAA,EACP,IAAI,UAAA,EACJ,cAAa,EAAb,MAAM,mBAAG,IAAI,KAAA,EACb,QAAQ,cAAA,EACR,aAAW,EAAX,KAAK,mBAAG,GAAG,KAAA,EACX,iBAAiB,uBAAA,EACd,IAAI,cAZuB,mIAa9B,CADO;IAEP,IAAM,cAAc,GAAG,IAAA,kBAAU,EAAC,+BAAc,CAAC,CAAC;IAClD,IAAM,SAAS,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAC/C,uDAAuD;IACvD,IAAM,iBAAiB,GAAG,IAAA,eAAO,EAAC,cAAM,OAAA,IAAA,8BAAgB,GAAE,EAAlB,CAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAC5D,IAAA,SAAS,GAAK,IAAA,6BAAa,EAAC,SAAS,aAC5C,gBAAgB,EAAE,CAAC,IAAI,EACvB,eAAe,EAAE,CAAC,IAAI,EACtB,eAAe,EAAE,EAAE,OAAO,EAAE,iBAAiB,EAAE,IAC5C,iBAAiB,EACnB,UALe,CAKd;IAEH,IAAM,aAAa,GAAG,IAAA,oBAAU,EAAC,QAAQ,EAAE,SAAS;YACnD,cAAc,EAAE,IAAI;YACpB,gBAAgB,EAAE,MAAM,IAAI,QAAQ;YACpC,eAAe,EAAE,CAAC,IAAI;;QACtB,GAAC,eAAa,KAAO,IAAG,KAAK;YAC5B,CAAC;IAEH,IAAM,YAAY,GAAW,QAAQ,CAAC,gBAAM,CAAC,YAAY,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,iBAAiB;IACxF,IAAM,eAAe,GAAG;QACvB,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE;QAClC,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;QAC7B,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE;QAC/B,UAAU,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE;KACzD,CAAC;IAEF,IAAM,aAAa,GAAG,CACrB,8BAAC,sBAAM,CAAC,GAAG,aACV,SAAS,EAAE,aAAa,EACxB,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,SAAS,IAChB,eAAe,EACf,IAAI;QAER,8BAAC,+BAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,QAAQ,CAAC;YAC7D,MAAM,IAAI,CACV,8BAAC,2BAAY,IAAC,OAAO,EAAE,OAAO,IAAG,MAAM,CAAgB,CACvD;YACD,uCAAK,SAAS,EAAC,iBAAiB,IAAE,QAAQ,CAAO;YAChD,MAAM,IAAI,CACV,8BAAC,2BAAY,IAAC,KAAK,EAAE,WAAW,IAAG,MAAM,CAAgB,CACzD,CACwB,CACd,CACb,CAAC;IACF,IAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,CACzB,8BAAC,2BAAY,IAAC,OAAO,QAAC,OAAO,EAAE,OAAO,IACpC,aAAa,CACA,CACf,CAAC,CAAC,CAAC,CACH,8BAAC,+BAAe,QAAE,aAAa,CAAmB,CAClD,CAAC;IAEF,OAAO,IAAI,IAAI,8BAAC,eAAM,IAAC,WAAW,EAAE,MAAM,IAAI,CAAC,QAAQ,IAAG,MAAM,CAAU,CAAC;AAC5E,CAAC,CAAC;AApEW,QAAA,MAAM,UAoEjB;AAEF,cAAM,CAAC,MAAM,GAAG,2BAAY,CAAC;AAC7B,cAAM,CAAC,MAAM,GAAG,2BAAY,CAAC;AAC7B,cAAM,CAAC,MAAM,GAAG,2BAAY,CAAC"}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"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"}

package/dist/components/Drawer/DrawerFooter.js

@@ -1,15 +1,3 @@
-"use strict";
-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)
@@ -21,22 +9,16 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DrawerFooter = void 0;
-var react_1 = __importDefault(require("react"));
-var classnames_1 = __importDefault(require("classnames"));
-var DrawerFooter = function (_a) {
-    var _b = _a.align, align = _b === void 0 ? 'right' : _b, children = _a.children, className = _a.className, props = __rest(_a, ["align", "children", "className"]);
-    var DrawerFooterClassNames = (0, classnames_1.default)('Drawer__footer', className, {
+import React from 'react';
+import classnames from 'classnames';
+export const DrawerFooter = (_a) => {
+    var { align = 'right', children, className } = _a, props = __rest(_a, ["align", "children", "className"]);
+    const DrawerFooterClassNames = classnames('Drawer__footer', className, {
         'justify-content-start': align === 'left',
         'justify-content-center': align === 'center',
         'justify-content-end': align === 'right',
         'justify-content-between': align === 'space-between',
     });
-    return (react_1.default.createElement("div", __assign({ className: DrawerFooterClassNames }, props), children));
+    return (React.createElement("div", Object.assign({ className: DrawerFooterClassNames }, props), children));
 };
-exports.DrawerFooter = DrawerFooter;
 //# sourceMappingURL=DrawerFooter.js.map

package/dist/components/Drawer/DrawerFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerFooter.js","sourceRoot":"","sources":["../../../src/components/Drawer/DrawerFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAkC;AAClC,0DAAoC;AAU7B,IAAM,YAAY,GAA0B,UAAC,EAKnD;IAJA,IAAA,aAAe,EAAf,KAAK,mBAAG,OAAO,KAAA,EACf,QAAQ,cAAA,EACR,SAAS,eAAA,EACN,KAAK,cAJ2C,kCAKnD,CADQ;IAER,IAAM,sBAAsB,GAAG,IAAA,oBAAU,EAAC,gBAAgB,EAAE,SAAS,EAAE;QACtE,uBAAuB,EAAE,KAAK,KAAK,MAAM;QACzC,wBAAwB,EAAE,KAAK,KAAK,QAAQ;QAC5C,qBAAqB,EAAE,KAAK,KAAK,OAAO;QACxC,yBAAyB,EAAE,KAAK,KAAK,eAAe;KACpD,CAAC,CAAC;IACH,OAAO,CACN,gDAAK,SAAS,EAAE,sBAAsB,IAAM,KAAK,GAC/C,QAAQ,CACJ,CACN,CAAC;AACH,CAAC,CAAC;AAjBW,QAAA,YAAY,gBAiBvB"}
+{"version":3,"file":"DrawerFooter.js","sourceRoot":"","sources":["../../../src/components/Drawer/DrawerFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AAUpC,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAKnD,EAAE,EAAE;QAL+C,EACnD,KAAK,GAAG,OAAO,EACf,QAAQ,EACR,SAAS,OAET,EADG,KAAK,cAJ2C,kCAKnD,CADQ;IAER,MAAM,sBAAsB,GAAG,UAAU,CAAC,gBAAgB,EAAE,SAAS,EAAE;QACtE,uBAAuB,EAAE,KAAK,KAAK,MAAM;QACzC,wBAAwB,EAAE,KAAK,KAAK,QAAQ;QAC5C,qBAAqB,EAAE,KAAK,KAAK,OAAO;QACxC,yBAAyB,EAAE,KAAK,KAAK,eAAe;KACpD,CAAC,CAAC;IACH,OAAO,CACN,2CAAK,SAAS,EAAE,sBAAsB,IAAM,KAAK,GAC/C,QAAQ,CACJ,CACN,CAAC;AACH,CAAC,CAAC"}

package/dist/components/Drawer/DrawerHeader.js

@@ -1,15 +1,3 @@
-"use strict";
-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)
@@ -21,22 +9,16 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DrawerHeader = void 0;
-var react_1 = __importDefault(require("react"));
-var classnames_1 = __importDefault(require("classnames"));
-var Headline_1 = require("../Headline");
-var Button_1 = require("../Button");
-var DrawerHeader = function (_a) {
-    var children = _a.children, className = _a.className, onClose = _a.onClose, props = __rest(_a, ["children", "className", "onClose"]);
-    var Close = function () { return (react_1.default.createElement(Button_1.Button, { fill: "subtle", className: "Drawer__header-close", iconName: "clear", size: "xsmall", onClick: onClose })); };
-    var DrawerHeaderClassNames = (0, classnames_1.default)('Drawer__header', className);
-    return (react_1.default.createElement("div", __assign({ className: DrawerHeaderClassNames }, props),
-        react_1.default.createElement(Headline_1.Headline, { className: "Drawer__header-title" }, children),
-        onClose && react_1.default.createElement(Close, null)));
+import React from 'react';
+import classnames from 'classnames';
+import { Headline } from '../Headline';
+import { Button } from '../Button';
+export const DrawerHeader = (_a) => {
+    var { children, className, onClose } = _a, props = __rest(_a, ["children", "className", "onClose"]);
+    const Close = () => (React.createElement(Button, { fill: "subtle", className: "Drawer__header-close", iconName: "clear", size: "xsmall", onClick: onClose }));
+    const DrawerHeaderClassNames = classnames('Drawer__header', className);
+    return (React.createElement("div", Object.assign({ className: DrawerHeaderClassNames }, props),
+        React.createElement(Headline, { className: "Drawer__header-title" }, children),
+        onClose && React.createElement(Close, null)));
 };
-exports.DrawerHeader = DrawerHeader;
 //# sourceMappingURL=DrawerHeader.js.map

package/dist/components/Drawer/DrawerHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerHeader.js","sourceRoot":"","sources":["../../../src/components/Drawer/DrawerHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAkC;AAClC,0DAAoC;AAEpC,wCAAuC;AACvC,oCAAmC;AAW5B,IAAM,YAAY,GAA0B,UAAC,EAKnD;IAJA,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,OAAO,aAAA,EACJ,KAAK,cAJ2C,oCAKnD,CADQ;IAER,IAAM,KAAK,GAAG,cAAM,OAAA,CACnB,8BAAC,eAAM,IACN,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,sBAAsB,EAChC,QAAQ,EAAC,OAAO,EAChB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,GACf,CACF,EARmB,CAQnB,CAAC;IAEF,IAAM,sBAAsB,GAAG,IAAA,oBAAU,EAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAEvE,OAAO,CACN,gDAAK,SAAS,EAAE,sBAAsB,IAAM,KAAK;QAChD,8BAAC,mBAAQ,IAAC,SAAS,EAAC,sBAAsB,IAAE,QAAQ,CAAY;QAC/D,OAAO,IAAI,8BAAC,KAAK,OAAG,CAChB,CACN,CAAC;AACH,CAAC,CAAC;AAxBW,QAAA,YAAY,gBAwBvB"}
+{"version":3,"file":"DrawerHeader.js","sourceRoot":"","sources":["../../../src/components/Drawer/DrawerHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAWnC,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAKnD,EAAE,EAAE;QAL+C,EACnD,QAAQ,EACR,SAAS,EACT,OAAO,OAEP,EADG,KAAK,cAJ2C,oCAKnD,CADQ;IAER,MAAM,KAAK,GAAG,GAAG,EAAE,CAAC,CACnB,oBAAC,MAAM,IACN,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,sBAAsB,EAChC,QAAQ,EAAC,OAAO,EAChB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,GACf,CACF,CAAC;IAEF,MAAM,sBAAsB,GAAG,UAAU,CAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC;IAEvE,OAAO,CACN,2CAAK,SAAS,EAAE,sBAAsB,IAAM,KAAK;QAChD,oBAAC,QAAQ,IAAC,SAAS,EAAC,sBAAsB,IAAE,QAAQ,CAAY;QAC/D,OAAO,IAAI,oBAAC,KAAK,OAAG,CAChB,CACN,CAAC;AACH,CAAC,CAAC"}

package/dist/components/Drawer/DrawerWindow.js

@@ -1,15 +1,3 @@
-"use strict";
-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)
@@ -21,16 +9,10 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DrawerWindow = void 0;
-var react_1 = __importDefault(require("react"));
-var Backdrop_1 = require("../Backdrop");
-var DrawerWindow = function (_a) {
-    var children = _a.children, onClose = _a.onClose, props = __rest(_a, ["children", "onClose"]);
-    return (react_1.default.createElement(Backdrop_1.Backdrop, __assign({ closeOnClick: !!onClose, onClick: onClose }, props), children));
+import React from 'react';
+import { Backdrop } from '../Backdrop';
+export const DrawerWindow = (_a) => {
+    var { children, onClose } = _a, props = __rest(_a, ["children", "onClose"]);
+    return (React.createElement(Backdrop, Object.assign({ closeOnClick: !!onClose, onClick: onClose }, props), children));
 };
-exports.DrawerWindow = DrawerWindow;
 //# sourceMappingURL=DrawerWindow.js.map

package/dist/components/Drawer/DrawerWindow.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerWindow.js","sourceRoot":"","sources":["../../../src/components/Drawer/DrawerWindow.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAAkC;AAClC,wCAAsD;AAM/C,IAAM,YAAY,GAA0B,UAAC,EAInD;IAHA,IAAA,QAAQ,cAAA,EACR,OAAO,aAAA,EACJ,KAAK,cAH2C,uBAInD,CADQ;IACH,OAAA,CACL,8BAAC,mBAAQ,aAAC,YAAY,EAAE,CAAC,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,IAAM,KAAK,GAC5D,QAAQ,CACC,CACX,CAAA;CAAA,CAAC;AARW,QAAA,YAAY,gBAQvB"}
+{"version":3,"file":"DrawerWindow.js","sourceRoot":"","sources":["../../../src/components/Drawer/DrawerWindow.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAiB,MAAM,aAAa,CAAC;AAMtD,MAAM,CAAC,MAAM,YAAY,GAA0B,CAAC,EAInD,EAAE,EAAE;QAJ+C,EACnD,QAAQ,EACR,OAAO,OAEP,EADG,KAAK,cAH2C,uBAInD,CADQ;IACH,OAAA,CACL,oBAAC,QAAQ,kBAAC,YAAY,EAAE,CAAC,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,IAAM,KAAK,GAC5D,QAAQ,CACC,CACX,CAAA;CAAA,CAAC"}

package/dist/components/Drawer/index.css

@@ -14,7 +14,12 @@
   right: 0;
   top: 0;
   width: 90%;
-  z-index: 1100;
+}
+.Drawer:focus {
+  outline: none;
+}
+.Drawer:focus-visible {
+  outline: none;
 }
 .Drawer .Drawer__header {
   align-items: center;

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

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Drawer/Drawer.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss"],"names":[],"mappings":"AAAA;ACSA;ACRC;EACA,OCiBa;ADfb;EACA;EDOA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OAlBc;EAmBd,SE0HiB;;AFxHjB;EACC;EACA;EACA,YEWiB;EFVjB;EACA;EACA;EACA;EACA;EACA;;AAGD;EAAc;;;AAGf;EAAkB;;;AAElB;EAAgB,WArCM;;;AAsCtB;EAAe,WArCM;;;AAsCrB;EAAe,WArCM;;;AAsCrB;EAAe,WArCM;;;AAuCrB;EACC;EACA;EACA;EACA,WEoFa;EFnFb;EACA;EACA,OEPmB;;;AFUpB;EACC,aEkEW;EFjEX;EACA;EACA;;AAEA;EACC;;;AAIF;EACC;EACA;EACA;;;AAGD;EACC,SEiDW;EFhDX;EACA","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/Drawer/Drawer.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/dist/tokens.scss"],"names":[],"mappings":"AAAA;ACSA;ACRC;EACA,OCiBa;ADfb;EACA;EDOA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OAlBc;;AAqBd;EAAU;;AAGV;EAAkB;;AAElB;EACC;EACA;EACA,YEMiB;EFLjB;EACA;EACA;EACA;EACA;EACA;;AAGD;EAAc;;;AAGf;EAAkB;;;AAElB;EAAgB,WA1CM;;;AA2CtB;EAAe,WA1CM;;;AA2CrB;EAAe,WA1CM;;;AA2CrB;EAAe,WA1CM;;;AA4CrB;EACC;EACA;EACA;EACA,WE+Ea;EF9Eb;EACA;EACA,OEZmB;;;AFepB;EACC,aE6DW;EF5DX;EACA;EACA;;AAEA;EACC;;;AAIF;EACC;EACA;EACA;;;AAGD;EACC,SE4CW;EF3CX;EACA","file":"index.css"}

package/dist/components/Drawer/index.js

@@ -1,14 +1,2 @@
-"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("./Drawer"), exports);
+export * from './Drawer';
 //# sourceMappingURL=index.js.map

package/dist/components/Drawer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,2CAAyB"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}