@jobber/components 9.16.0 → 9.16.1

package/dist/Chip/index.cjs

@@ -18,7 +18,6 @@ require('../Tooltip-cjs.js');
 require('../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 
 
 

package/dist/Chip/index.mjs

@@ -16,4 +16,3 @@ import '../Tooltip-es.js';
 import '../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';

package/dist/Chips/InternalChipDismissible/index.cjs

@@ -38,7 +38,6 @@ require('../../Avatar-cjs.js');
 require('color');
 require('../../useChildComponent-cjs.js');
 require('../../Tooltip-cjs.js');
-require('framer-motion');
 
 
 

package/dist/Chips/InternalChipDismissible/index.mjs

@@ -36,4 +36,3 @@ import '../../Avatar-es.js';
 import 'color';
 import '../../useChildComponent-es.js';
 import '../../Tooltip-es.js';
-import 'framer-motion';

package/dist/Chips/index.cjs

@@ -39,7 +39,6 @@ require('../Avatar-cjs.js');
 require('color');
 require('../useChildComponent-cjs.js');
 require('../Tooltip-cjs.js');
-require('framer-motion');
 
 /**
  * @deprecated Use Autocomplete with the "multiple" prop instead of ChipDismissible.

package/dist/Chips/index.mjs

@@ -37,7 +37,6 @@ import '../Avatar-es.js';
 import 'color';
 import '../useChildComponent-es.js';
 import '../Tooltip-es.js';
-import 'framer-motion';
 
 /**
  * @deprecated Use Autocomplete with the "multiple" prop instead of ChipDismissible.

package/dist/DataList/components/DataListActions/index.cjs

@@ -7,7 +7,6 @@ require('classnames');
 require('../../../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 require('@jobber/hooks');
 require('../../../Button-cjs.js');
 require('../../../tslib.es6-cjs.js');
@@ -32,6 +31,7 @@ require('../../../Heading-cjs.js');
 require('../../../DataListLayoutContext-cjs2.js');
 require('../../../DataListItemActionsOverflow-cjs.js');
 require('../../../DataListActionsMenu-cjs.js');
+require('framer-motion');
 
 
 

package/dist/DataList/components/DataListActions/index.mjs

@@ -5,7 +5,6 @@ import 'classnames';
 import '../../../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';
 import '@jobber/hooks';
 import '../../../Button-es.js';
 import '../../../tslib.es6-es.js';
@@ -30,3 +29,4 @@ import '../../../Heading-es.js';
 import '../../../DataListLayoutContext-es2.js';
 import '../../../DataListItemActionsOverflow-es.js';
 import '../../../DataListActionsMenu-es.js';
+import 'framer-motion';

package/dist/DataList/components/DataListBulkActions/index.cjs

@@ -11,7 +11,6 @@ require('classnames');
 require('../../../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 require('@jobber/hooks');
 require('../../../Button-cjs.js');
 require('../../../tslib.es6-cjs.js');
@@ -33,6 +32,7 @@ require('../../../Heading-cjs.js');
 require('../../../DataListLayoutContext-cjs2.js');
 require('../../../DataListItemActionsOverflow-cjs.js');
 require('../../../DataListActionsMenu-cjs.js');
+require('framer-motion');
 require('../../../useResponsiveSizing-cjs.js');
 
 

package/dist/DataList/components/DataListBulkActions/index.mjs

@@ -9,7 +9,6 @@ import 'classnames';
 import '../../../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';
 import '@jobber/hooks';
 import '../../../Button-es.js';
 import '../../../tslib.es6-es.js';
@@ -31,4 +30,5 @@ import '../../../Heading-es.js';
 import '../../../DataListLayoutContext-es2.js';
 import '../../../DataListItemActionsOverflow-es.js';
 import '../../../DataListActionsMenu-es.js';
+import 'framer-motion';
 import '../../../useResponsiveSizing-es.js';

package/dist/DataList/components/DataListItemActionsOverflow/index.cjs

@@ -13,9 +13,9 @@ require('../../../Tooltip-cjs.js');
 require('../../../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 require('@jobber/hooks');
 require('../../../DataListActionsMenu-cjs.js');
+require('framer-motion');
 require('../../../DataList.const-cjs.js');
 
 

package/dist/DataList/components/DataListItemActionsOverflow/index.mjs

@@ -11,7 +11,7 @@ import '../../../Tooltip-es.js';
 import '../../../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';
 import '@jobber/hooks';
 import '../../../DataListActionsMenu-es.js';
+import 'framer-motion';
 import '../../../DataList.const-es.js';

package/dist/DataList/components/DataListLayoutActions/index.cjs

@@ -18,9 +18,9 @@ require('../../../Tooltip-cjs.js');
 require('../../../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 require('@jobber/hooks');
 require('../../../DataListActionsMenu-cjs.js');
+require('framer-motion');
 require('../../../DataList.const-cjs.js');
 require('../../../Glimmer-cjs.js');
 require('../../../Content-cjs.js');

package/dist/DataList/components/DataListLayoutActions/index.mjs

@@ -16,9 +16,9 @@ import '../../../Tooltip-es.js';
 import '../../../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';
 import '@jobber/hooks';
 import '../../../DataListActionsMenu-es.js';
+import 'framer-motion';
 import '../../../DataList.const-es.js';
 import '../../../Glimmer-es.js';
 import '../../../Content-es.js';

package/dist/FilterPicker/components/FilterPickerActivator/index.cjs

@@ -20,7 +20,6 @@ require('../../../Tooltip-cjs.js');
 require('../../../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 require('../../../FilterPickerProvider-cjs.js');
 require('../../../constants-cjs.js');
 

package/dist/FilterPicker/components/FilterPickerActivator/index.mjs

@@ -18,6 +18,5 @@ import '../../../Tooltip-es.js';
 import '../../../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';
 import '../../../FilterPickerProvider-es.js';
 import '../../../constants-es.js';

package/dist/FilterPicker/components/FilterPickerTrigger/index.cjs

@@ -18,7 +18,6 @@ require('../../../Tooltip-cjs.js');
 require('../../../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 require('../../../FilterPickerProvider-cjs.js');
 require('../../../FilterPicker.messages-cjs.js');
 

package/dist/FilterPicker/components/FilterPickerTrigger/index.mjs

@@ -16,6 +16,5 @@ import '../../../Tooltip-es.js';
 import '../../../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';
 import '../../../FilterPickerProvider-es.js';
 import '../../../FilterPicker.messages-es.js';

package/dist/Tooltip/index.cjs

@@ -6,7 +6,6 @@ require('classnames');
 require('../floating-ui.react-cjs.js');
 require('react/jsx-runtime');
 require('react-dom');
-require('framer-motion');
 require('@jobber/hooks');
 
 

package/dist/Tooltip/index.mjs

@@ -4,5 +4,4 @@ import 'classnames';
 import '../floating-ui.react-es.js';
 import 'react/jsx-runtime';
 import 'react-dom';
-import 'framer-motion';
 import '@jobber/hooks';

package/dist/Tooltip-cjs.js

@@ -3,10 +3,9 @@
 var React = require('react');
 var classnames = require('classnames');
 var floatingUi_react = require('./floating-ui.react-cjs.js');
-var framerMotion = require('framer-motion');
 var jobberHooks = require('@jobber/hooks');
 
-var styles = {"shadowActivator":"sZQ1M6tj8-c-","tooltipWrapper":"_0o-yEgfXmSQ-","tooltip":"Q1YfFqI71cw-","arrow":"ZP3ev-wT-OI-","top":"jlEmO6f6uHg-","bottom":"z9JQ-DR-QYc-","left":"zWATWgq3bS4-","right":"-tDm6lNCCic-","tooltipMessage":"djrmr4mADlA-","hidden":"p92TIli5Sgw-","spinning":"bobYmlUMnuY-"};
+var styles = {"shadowActivator":"sZQ1M6tj8-c-","tooltipWrapper":"_0o-yEgfXmSQ-","tooltip":"Q1YfFqI71cw-","tooltipFadeIn":"lVdPVB1BJ3s-","arrow":"ZP3ev-wT-OI-","top":"jlEmO6f6uHg-","bottom":"z9JQ-DR-QYc-","left":"zWATWgq3bS4-","right":"-tDm6lNCCic-","tooltipMessage":"djrmr4mADlA-","hidden":"p92TIli5Sgw-","spinning":"bobYmlUMnuY-"};
 
 const TOOLTIP_SHIFT_PADDING = 8;
 const TOOLTIP_ARROW_PADDING = 6;
@@ -51,10 +50,6 @@ function useTooltipPositioning({ preferredPlacement, }) {
     };
 }
 
-const variation = {
-    startOrStop: { opacity: 0 },
-    done: { opacity: 1 },
-};
 function Tooltip({ message, children, preferredPlacement = "top", setTabIndex = true, }) {
     var _a, _b, _c, _d;
     const [show, setShow] = React.useState(false);
@@ -76,11 +71,7 @@ function Tooltip({ message, children, preferredPlacement = "top", setTabIndex =
         React.createElement("span", { className: styles.shadowActivator, ref: shadowRef }),
         children,
         React.createElement(TooltipPortal, null, show && Boolean(message) && (React.createElement("div", { className: toolTipClassNames, style: floatingStyles.float, ref: setTooltipRef, role: "tooltip", hidden: isHidden, "data-placement": placement },
-            React.createElement(framerMotion.motion.div, { className: styles.tooltip, variants: variation, initial: "startOrStop", animate: "done", exit: "startOrStop", transition: {
-                    ease: "easeOut",
-                    duration: 0.15,
-                    delay: 0.3,
-                } },
+            React.createElement("div", { className: styles.tooltip },
                 React.createElement("p", { className: styles.tooltipMessage }, message),
                 React.createElement("div", { ref: setArrowRef, style: arrowStyles, className: styles.arrow })))))));
     function initializeListeners() {

package/dist/Tooltip-es.js

@@ -1,10 +1,9 @@
 import React__default, { useRef, useState } from 'react';
 import classnames from 'classnames';
 import { u as useFloating, s as shift, f as flip, a as arrow, h as hide, b as autoUpdate, l as limitShift, F as FloatingPortal } from './floating-ui.react-es.js';
-import { motion } from 'framer-motion';
 import { useSafeLayoutEffect, useIsMounted } from '@jobber/hooks';
 
-var styles = {"shadowActivator":"sZQ1M6tj8-c-","tooltipWrapper":"_0o-yEgfXmSQ-","tooltip":"Q1YfFqI71cw-","arrow":"ZP3ev-wT-OI-","top":"jlEmO6f6uHg-","bottom":"z9JQ-DR-QYc-","left":"zWATWgq3bS4-","right":"-tDm6lNCCic-","tooltipMessage":"djrmr4mADlA-","hidden":"p92TIli5Sgw-","spinning":"bobYmlUMnuY-"};
+var styles = {"shadowActivator":"sZQ1M6tj8-c-","tooltipWrapper":"_0o-yEgfXmSQ-","tooltip":"Q1YfFqI71cw-","tooltipFadeIn":"lVdPVB1BJ3s-","arrow":"ZP3ev-wT-OI-","top":"jlEmO6f6uHg-","bottom":"z9JQ-DR-QYc-","left":"zWATWgq3bS4-","right":"-tDm6lNCCic-","tooltipMessage":"djrmr4mADlA-","hidden":"p92TIli5Sgw-","spinning":"bobYmlUMnuY-"};
 
 const TOOLTIP_SHIFT_PADDING = 8;
 const TOOLTIP_ARROW_PADDING = 6;
@@ -49,10 +48,6 @@ function useTooltipPositioning({ preferredPlacement, }) {
     };
 }
 
-const variation = {
-    startOrStop: { opacity: 0 },
-    done: { opacity: 1 },
-};
 function Tooltip({ message, children, preferredPlacement = "top", setTabIndex = true, }) {
     var _a, _b, _c, _d;
     const [show, setShow] = useState(false);
@@ -74,11 +69,7 @@ function Tooltip({ message, children, preferredPlacement = "top", setTabIndex =
         React__default.createElement("span", { className: styles.shadowActivator, ref: shadowRef }),
         children,
         React__default.createElement(TooltipPortal, null, show && Boolean(message) && (React__default.createElement("div", { className: toolTipClassNames, style: floatingStyles.float, ref: setTooltipRef, role: "tooltip", hidden: isHidden, "data-placement": placement },
-            React__default.createElement(motion.div, { className: styles.tooltip, variants: variation, initial: "startOrStop", animate: "done", exit: "startOrStop", transition: {
-                    ease: "easeOut",
-                    duration: 0.15,
-                    delay: 0.3,
-                } },
+            React__default.createElement("div", { className: styles.tooltip },
                 React__default.createElement("p", { className: styles.tooltipMessage }, message),
                 React__default.createElement("div", { ref: setArrowRef, style: arrowStyles, className: styles.arrow })))))));
     function initializeListeners() {

package/dist/docs/InputFile/InputFile.md

@@ -221,6 +221,17 @@ For complete control over the layout, you can provide custom children:
 </InputFile>
 ```
 
+InputFile renders its built-in validation messages directly below the field, and
+that placement is not configurable. If InputFile is part of a larger composed
+input layout, consumers who need the validation message to align with that
+layout should manage that rule themselves and render
+[InputValidation](../InputValidation/InputValidation.md) from the surrounding UI.
+
+In practice, that usually means validating in `getUploadParams` or at the form
+level, and avoiding `maxFilesValidation`, `allowedTypes`, or `validator` for the
+same rule, since those use InputFile's built-in validation flow and will still
+render the default message below the field.
+
 ### Available subcomponents
 
 1. `InputFile.Button`: Upload button

package/dist/styles.css

@@ -7267,6 +7267,8 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
   border-radius: 8px;
   border-radius: var(--radius-base);
   background-color: var(--tooltip--surface);
+  -webkit-animation: lVdPVB1BJ3s- 0.15s ease-out 0.3s both;
+          animation: lVdPVB1BJ3s- 0.15s ease-out 0.3s both;
 }
 
 .Q1YfFqI71cw- .ZP3ev-wT-OI-,
@@ -7356,6 +7358,26 @@ a._7BLGtYNuJOU-.zgRx3ehZ2z8-:hover {
   display: none;
 }
 
+@-webkit-keyframes lVdPVB1BJ3s- {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes lVdPVB1BJ3s- {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
 @-webkit-keyframes bobYmlUMnuY- {
   from {
     -webkit-transform: rotate(0deg);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "9.16.0",
+  "version": "9.16.1",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -548,5 +548,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "a4505ca7fe0a7ffe781409655a63fe9b8ea852ec"
+  "gitHead": "a307f2e7c79aa2126e687918ef072701b4152357"
 }