@jobber/components 8.21.1 → 8.23.0

package/Dialog.d.ts

@@ -0,0 +1 @@
+export * from "./dist/Dialog";

package/Dialog.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true,
+});
+
+var Dialog = require("./dist/Dialog");
+
+Object.keys(Dialog).forEach(function(key) {
+  if (key === "default" || key === "__esModule") return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return Dialog[key];
+    },
+  });
+});

package/dist/BottomSheet-cjs.js

@@ -35,6 +35,15 @@ function resolveBottomSheetTriggerRender({ children, render, }) {
         React.createElement(Button.Button.Label, null, children)));
 }
 
+/**
+ * Whether `BottomSheet.Popup` renders its own built-in scroll area (with the
+ * bottom fade). Defaults to `true` — the popup wraps its `children` in a
+ * scrollable viewport. A consumer that manages its own scroll region (e.g.
+ * `Dialog`, which pins a header/footer outside a single scroll area) provides
+ * `false` to opt out. Mirrors how `Dialog.Body` decides whether to wrap itself
+ * via context rather than a prop.
+ */
+const BottomSheetScrollAreaContext = React.createContext(true);
 function BottomSheetTrigger(_a) {
     var { children, render, className } = _a, triggerProps = tslib_es6.__rest(_a, ["children", "render", "className"]);
     return (React.createElement(ScrollAreaViewport.DrawerTrigger, Object.assign({}, triggerProps, { className: className, render: resolveBottomSheetTriggerRender({ children, render }) })));
@@ -50,14 +59,30 @@ function BottomSheetRoot(_a) {
 }
 function BottomSheetPopup(_a) {
     var { children, className, initialFocus, finalFocus, ref } = _a, popupProps = tslib_es6.__rest(_a, ["children", "className", "initialFocus", "finalFocus", "ref"]);
+    // Defaults to wrapping; a consumer managing its own scroll region provides
+    // `BottomSheetScrollAreaContext` = false.
+    const renderScrollArea = React.useContext(BottomSheetScrollAreaContext);
     return (React.createElement(ScrollAreaViewport.DrawerPortal, null,
-        React.createElement(ScrollAreaViewport.DrawerBackdrop, { forceRender: true, className: styles.backdrop }),
-        React.createElement(ScrollAreaViewport.DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }),
-            React.createElement(ScrollAreaViewport.ScrollAreaRoot, { className: styles.scrollRoot },
-                React.createElement(ScrollAreaViewport.ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea", 
-                    // BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
-                    style: { overflow: "auto" } }, children),
-                React.createElement("div", { "aria-hidden": "true", className: styles.bottomFade, "data-testid": "ATL-BottomSheet-Fade" })))));
+        React.createElement(ScrollAreaViewport.DrawerBackdrop, { forceRender: true, className: styles.backdrop, "data-testid": "ATL-BottomSheet-Backdrop" }),
+        React.createElement(ScrollAreaViewport.DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
+        // The consumer manages its own scroll region (e.g. Dialog pins a
+        // header/footer outside a single scroll area) — often by composing
+        // `BottomSheet.ScrollArea` itself.
+        children) : (React.createElement(BottomSheetScrollArea, null, children)))));
+}
+/**
+ * The sheet's scroll region: a styled BaseUI `ScrollArea` (native scrollbar) with
+ * a bottom fade that hints at more content while the viewport can scroll further.
+ * `BottomSheet.Popup` renders this automatically unless a consumer opts out via
+ * `BottomSheetScrollAreaContext` and composes it (or its own scroll region)
+ * directly.
+ */
+function BottomSheetScrollArea({ children, className, style, }) {
+    return (React.createElement(ScrollAreaViewport.ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style },
+        React.createElement(ScrollAreaViewport.ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea", 
+            // BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
+            style: { overflow: "auto" } }, children),
+        React.createElement("div", { "aria-hidden": "true", className: styles.bottomFade, "data-testid": "ATL-BottomSheet-Fade" })));
 }
 function BottomSheetContent(_a) {
     var { children, className, ref } = _a, contentProps = tslib_es6.__rest(_a, ["children", "className", "ref"]);
@@ -74,6 +99,8 @@ const BottomSheet = Object.assign(BottomSheetComponent, {
     Trigger: BottomSheetTrigger,
     Popup: BottomSheetPopup,
     Content: BottomSheetContent,
+    ScrollArea: BottomSheetScrollArea,
 });
 
 exports.BottomSheet = BottomSheet;
+exports.BottomSheetScrollAreaContext = BottomSheetScrollAreaContext;

package/dist/BottomSheet-es.js

@@ -33,6 +33,15 @@ function resolveBottomSheetTriggerRender({ children, render, }) {
         React__default.createElement(Button.Label, null, children)));
 }
 
+/**
+ * Whether `BottomSheet.Popup` renders its own built-in scroll area (with the
+ * bottom fade). Defaults to `true` — the popup wraps its `children` in a
+ * scrollable viewport. A consumer that manages its own scroll region (e.g.
+ * `Dialog`, which pins a header/footer outside a single scroll area) provides
+ * `false` to opt out. Mirrors how `Dialog.Body` decides whether to wrap itself
+ * via context rather than a prop.
+ */
+const BottomSheetScrollAreaContext = React__default.createContext(true);
 function BottomSheetTrigger(_a) {
     var { children, render, className } = _a, triggerProps = __rest(_a, ["children", "render", "className"]);
     return (React__default.createElement(DrawerTrigger, Object.assign({}, triggerProps, { className: className, render: resolveBottomSheetTriggerRender({ children, render }) })));
@@ -48,14 +57,30 @@ function BottomSheetRoot(_a) {
 }
 function BottomSheetPopup(_a) {
     var { children, className, initialFocus, finalFocus, ref } = _a, popupProps = __rest(_a, ["children", "className", "initialFocus", "finalFocus", "ref"]);
+    // Defaults to wrapping; a consumer managing its own scroll region provides
+    // `BottomSheetScrollAreaContext` = false.
+    const renderScrollArea = React__default.useContext(BottomSheetScrollAreaContext);
     return (React__default.createElement(DrawerPortal, null,
-        React__default.createElement(DrawerBackdrop, { forceRender: true, className: styles.backdrop }),
-        React__default.createElement(DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }),
-            React__default.createElement(ScrollAreaRoot, { className: styles.scrollRoot },
-                React__default.createElement(ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea", 
-                    // BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
-                    style: { overflow: "auto" } }, children),
-                React__default.createElement("div", { "aria-hidden": "true", className: styles.bottomFade, "data-testid": "ATL-BottomSheet-Fade" })))));
+        React__default.createElement(DrawerBackdrop, { forceRender: true, className: styles.backdrop, "data-testid": "ATL-BottomSheet-Backdrop" }),
+        React__default.createElement(DrawerPopup, Object.assign({}, popupProps, { ref: ref, className: classnames(styles.popup, className), initialFocus: initialFocus, finalFocus: finalFocus }), !renderScrollArea ? (
+        // The consumer manages its own scroll region (e.g. Dialog pins a
+        // header/footer outside a single scroll area) — often by composing
+        // `BottomSheet.ScrollArea` itself.
+        children) : (React__default.createElement(BottomSheetScrollArea, null, children)))));
+}
+/**
+ * The sheet's scroll region: a styled BaseUI `ScrollArea` (native scrollbar) with
+ * a bottom fade that hints at more content while the viewport can scroll further.
+ * `BottomSheet.Popup` renders this automatically unless a consumer opts out via
+ * `BottomSheetScrollAreaContext` and composes it (or its own scroll region)
+ * directly.
+ */
+function BottomSheetScrollArea({ children, className, style, }) {
+    return (React__default.createElement(ScrollAreaRoot, { className: classnames(styles.scrollRoot, className), style: style },
+        React__default.createElement(ScrollAreaViewport, { className: styles.scrollArea, "data-testid": "ATL-BottomSheet-ScrollArea", 
+            // BaseUI sets overflow: scroll in the style prop by default. This is to override that because adding it to the className doesn't work.
+            style: { overflow: "auto" } }, children),
+        React__default.createElement("div", { "aria-hidden": "true", className: styles.bottomFade, "data-testid": "ATL-BottomSheet-Fade" })));
 }
 function BottomSheetContent(_a) {
     var { children, className, ref } = _a, contentProps = __rest(_a, ["children", "className", "ref"]);
@@ -72,6 +97,7 @@ const BottomSheet = Object.assign(BottomSheetComponent, {
     Trigger: BottomSheetTrigger,
     Popup: BottomSheetPopup,
     Content: BottomSheetContent,
+    ScrollArea: BottomSheetScrollArea,
 });
 
-export { BottomSheet as B };
+export { BottomSheetScrollAreaContext as B, BottomSheet as a };

package/dist/CSPContext-cjs.js

@@ -0,0 +1,69 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+
+function _interopNamespaceDefault(e) {
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const ARROW_UP = 'ArrowUp';
+const ARROW_DOWN = 'ArrowDown';
+const ARROW_LEFT = 'ArrowLeft';
+const ARROW_RIGHT = 'ArrowRight';
+const HOME = 'Home';
+const END = 'End';
+const HORIZONTAL_KEYS = new Set([ARROW_LEFT, ARROW_RIGHT]);
+const VERTICAL_KEYS = new Set([ARROW_UP, ARROW_DOWN]);
+const ARROW_KEYS = new Set([...HORIZONTAL_KEYS, ...VERTICAL_KEYS]);
+new Set([...ARROW_KEYS, HOME, END]);
+const COMPOSITE_KEYS = new Set([ARROW_UP, ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, HOME, END]);
+
+const DISABLE_SCROLLBAR_CLASS_NAME = 'base-ui-disable-scrollbar';
+const styleDisableScrollbar = {
+  className: DISABLE_SCROLLBAR_CLASS_NAME,
+  getElement(nonce) {
+    return /*#__PURE__*/jsxRuntime.jsx("style", {
+      nonce: nonce,
+      href: DISABLE_SCROLLBAR_CLASS_NAME,
+      precedence: "base-ui:low",
+      children: `.${DISABLE_SCROLLBAR_CLASS_NAME}{scrollbar-width:none}.${DISABLE_SCROLLBAR_CLASS_NAME}::-webkit-scrollbar{display:none}`
+    });
+  }
+};
+if (process.env.NODE_ENV !== "production") styleDisableScrollbar.getElement.displayName = "styleDisableScrollbar.getElement";
+
+/**
+ * @internal
+ */
+const CSPContext = /*#__PURE__*/React__namespace.createContext(undefined);
+if (process.env.NODE_ENV !== "production") CSPContext.displayName = "CSPContext";
+const DEFAULT_CSP_CONTEXT_VALUE = {
+  disableStyleElements: false
+};
+
+/**
+ * @internal
+ */
+function useCSPContext() {
+  return React__namespace.useContext(CSPContext) ?? DEFAULT_CSP_CONTEXT_VALUE;
+}
+
+exports.COMPOSITE_KEYS = COMPOSITE_KEYS;
+exports.styleDisableScrollbar = styleDisableScrollbar;
+exports.useCSPContext = useCSPContext;

package/dist/CSPContext-es.js

@@ -0,0 +1,46 @@
+import { jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+
+const ARROW_UP = 'ArrowUp';
+const ARROW_DOWN = 'ArrowDown';
+const ARROW_LEFT = 'ArrowLeft';
+const ARROW_RIGHT = 'ArrowRight';
+const HOME = 'Home';
+const END = 'End';
+const HORIZONTAL_KEYS = new Set([ARROW_LEFT, ARROW_RIGHT]);
+const VERTICAL_KEYS = new Set([ARROW_UP, ARROW_DOWN]);
+const ARROW_KEYS = new Set([...HORIZONTAL_KEYS, ...VERTICAL_KEYS]);
+new Set([...ARROW_KEYS, HOME, END]);
+const COMPOSITE_KEYS = new Set([ARROW_UP, ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, HOME, END]);
+
+const DISABLE_SCROLLBAR_CLASS_NAME = 'base-ui-disable-scrollbar';
+const styleDisableScrollbar = {
+  className: DISABLE_SCROLLBAR_CLASS_NAME,
+  getElement(nonce) {
+    return /*#__PURE__*/jsx("style", {
+      nonce: nonce,
+      href: DISABLE_SCROLLBAR_CLASS_NAME,
+      precedence: "base-ui:low",
+      children: `.${DISABLE_SCROLLBAR_CLASS_NAME}{scrollbar-width:none}.${DISABLE_SCROLLBAR_CLASS_NAME}::-webkit-scrollbar{display:none}`
+    });
+  }
+};
+if (process.env.NODE_ENV !== "production") styleDisableScrollbar.getElement.displayName = "styleDisableScrollbar.getElement";
+
+/**
+ * @internal
+ */
+const CSPContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== "production") CSPContext.displayName = "CSPContext";
+const DEFAULT_CSP_CONTEXT_VALUE = {
+  disableStyleElements: false
+};
+
+/**
+ * @internal
+ */
+function useCSPContext() {
+  return React.useContext(CSPContext) ?? DEFAULT_CSP_CONTEXT_VALUE;
+}
+
+export { COMPOSITE_KEYS as C, styleDisableScrollbar as s, useCSPContext as u };

package/dist/Card/index.cjs

@@ -27,11 +27,14 @@ require('../BottomSheet-cjs.js');
 require('../ScrollAreaViewport-cjs.js');
 require('../InternalBackdrop-cjs.js');
 require('../useButton-cjs.js');
+require('../CSPContext-cjs.js');
 require('../clamp-cjs.js');
 require('../OverlaySeparator-cjs.js');
 require('../Separator-cjs.js');
+require('../DrawerTitle-cjs.js');
 require('../MenuSubmenuTrigger-cjs.js');
 require('../useCompositeListItem-cjs.js');
+require('../ToolbarRootContext-cjs.js');
 
 
 

package/dist/Card/index.mjs

@@ -25,8 +25,11 @@ import '../BottomSheet-es.js';
 import '../ScrollAreaViewport-es.js';
 import '../InternalBackdrop-es.js';
 import '../useButton-es.js';
+import '../CSPContext-es.js';
 import '../clamp-es.js';
 import '../OverlaySeparator-es.js';
 import '../Separator-es.js';
+import '../DrawerTitle-es.js';
 import '../MenuSubmenuTrigger-es.js';
 import '../useCompositeListItem-es.js';
+import '../ToolbarRootContext-es.js';