@jobber/components 9.13.0 → 9.13.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/LightBox-cjs.js +2 -21
  2. package/dist/LightBox-es.js +2 -21
  3. package/dist/docs/Icon/Icon.md +2 -0
  4. package/dist/styles.css +13 -11
  5. package/package.json +3 -3
package/dist/LightBox-cjs.js CHANGED
@@ -16,7 +16,7 @@ var Tooltip = require('./Tooltip-cjs.js');
16
16
  var AtlantisThemeContext = require('./AtlantisThemeContext-cjs.js');
17
17
  var Menu = require('./Menu-cjs.js');
18
18
 
19
- var styles = {"backgroundImage":"i9Tw1T65W-k-","next":"Q8amcRaTGf0-","prev":"W9FVb24yJrk-","buttonHidden":"nsN0TPWsBXI-","buttonVisible":"dkLYp7AD2jE-","lightboxWrapper":"_5p2iAj4JfoE-","toolbar":"rMK4cKdOxFw-","closeButton":"_0m6vb11DgiA-","slideNumber":"kCc68gGuTgg-","leftActions":"OunDmtPpa9g-","downloadOptionContent":"TPSJq-8p0vo-","downloadOptionLabel":"vZU6ZSl8QLI-","downloadOptionDetail":"vubHTSF4aYA-","image":"yYFVVScosfQ-","imageArea":"UskuwLHR6fg-","captionWrapper":"OGjhge-r-U4-","title":"tZU2g-NYdIs-","blurOverlay":"GKIdLTmvcvQ-","thumbnailBar":"_3TfQLQEE3GQ-","thumbnailImage":"eBMzUOlcfQ4-","thumbnail":"eapm2zruLn8-","selected":"PeLn2u-QB0k-","spinning":"_8tDoqjgfLcw-"};
19
+ var styles = {"lightboxWrapper":"_5p2iAj4JfoE-","thumbnailBar":"_3TfQLQEE3GQ-","backgroundImage":"i9Tw1T65W-k-","next":"Q8amcRaTGf0-","prev":"W9FVb24yJrk-","buttonHidden":"nsN0TPWsBXI-","buttonVisible":"dkLYp7AD2jE-","toolbar":"rMK4cKdOxFw-","closeButton":"_0m6vb11DgiA-","slideNumber":"kCc68gGuTgg-","leftActions":"OunDmtPpa9g-","downloadOptionContent":"TPSJq-8p0vo-","downloadOptionLabel":"vZU6ZSl8QLI-","downloadOptionDetail":"vubHTSF4aYA-","image":"yYFVVScosfQ-","imageArea":"UskuwLHR6fg-","captionWrapper":"OGjhge-r-U4-","title":"tZU2g-NYdIs-","blurOverlay":"GKIdLTmvcvQ-","thumbnailImage":"eBMzUOlcfQ4-","thumbnail":"eapm2zruLn8-","selected":"PeLn2u-QB0k-","spinning":"_8tDoqjgfLcw-"};
20
20
 
21
21
  // A little bit more than the transition's duration
22
22
  // We're doing this to prevent a bug from framer-motion
@@ -69,7 +69,6 @@ function LightBoxProvider({ open = true, images, imageIndex = 0, onRequestClose
69
69
  const debouncedHandleNext = jobberHooks.useDebounce(handleMoveNext, BUTTON_DEBOUNCE_DELAY);
70
70
  const debouncedHandlePrevious = jobberHooks.useDebounce(handleMovePrevious, BUTTON_DEBOUNCE_DELAY);
71
71
  const mounted = jobberHooks.useIsMounted();
72
- const prevOpen = React.useRef(open);
73
72
  jobberHooks.useRefocusOnActivator(open);
74
73
  const handleMouseMovement = jobberHooks.useDebounce(() => {
75
74
  setMouseIsStationary(true);
@@ -85,10 +84,6 @@ function LightBoxProvider({ open = true, images, imageIndex = 0, onRequestClose
85
84
  setCurrentImageIndex(imageIndex);
86
85
  onImageChange(imageIndex);
87
86
  }, [imageIndex, open]);
88
- if (prevOpen.current !== open) {
89
- prevOpen.current = open;
90
- togglePrintStyles(open);
91
- }
92
87
  React.useEffect(() => {
93
88
  var _a;
94
89
  (_a = selectedThumbnailRef === null || selectedThumbnailRef === void 0 ? void 0 : selectedThumbnailRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
@@ -158,19 +153,6 @@ function LightBoxProvider({ open = true, images, imageIndex = 0, onRequestClose
158
153
  function useLightBoxContext() {
159
154
  return React.useContext(LightBoxContext);
160
155
  }
161
- function togglePrintStyles(open) {
162
- try {
163
- if (open) {
164
- document.documentElement.classList.add("atlantisLightBoxActive");
165
- }
166
- else {
167
- document.documentElement.classList.remove("atlantisLightBoxActive");
168
- }
169
- }
170
- catch (error) {
171
- console.error(error);
172
- }
173
- }
174
156
 
175
157
  const lightBoxMessages = useAtlantisI18n.defineMessages({
176
158
  close: {
@@ -202,7 +184,6 @@ const lightBoxMessages = useAtlantisI18n.defineMessages({
202
184
  function LightBoxContent() {
203
185
  const { open, lightboxRef, handleMouseMove } = useLightBoxContext();
204
186
  const { t } = useAtlantisI18n.useAtlantisI18n(lightBoxMessages);
205
- const mounted = jobberHooks.useIsMounted();
206
187
  const template = (React.createElement(React.Fragment, null, open && (React.createElement("div", { className: styles.lightboxWrapper, tabIndex: 0, "aria-label": t("lightbox"), key: "Lightbox", ref: lightboxRef, onMouseMove: handleMouseMove },
207
188
  React.createElement(LightBoxBackground, null),
208
189
  React.createElement(LightBoxOverlay, null),
@@ -211,7 +192,7 @@ function LightBoxContent() {
211
192
  React.createElement(LightBoxNavigation, null),
212
193
  React.createElement(LightBoxCaption, null),
213
194
  React.createElement(LightBoxThumbnails, null)))));
214
- return mounted.current
195
+ return (globalThis === null || globalThis === void 0 ? void 0 : globalThis.document)
215
196
  ? ReactDOM.createPortal(template, document.body)
216
197
  : template;
217
198
  }
package/dist/LightBox-es.js CHANGED
@@ -14,7 +14,7 @@ import { T as Tooltip } from './Tooltip-es.js';
14
14
  import { A as AtlantisThemeContextProvider } from './AtlantisThemeContext-es.js';
15
15
  import { M as Menu } from './Menu-es.js';
16
16
 
17
- var styles = {"backgroundImage":"i9Tw1T65W-k-","next":"Q8amcRaTGf0-","prev":"W9FVb24yJrk-","buttonHidden":"nsN0TPWsBXI-","buttonVisible":"dkLYp7AD2jE-","lightboxWrapper":"_5p2iAj4JfoE-","toolbar":"rMK4cKdOxFw-","closeButton":"_0m6vb11DgiA-","slideNumber":"kCc68gGuTgg-","leftActions":"OunDmtPpa9g-","downloadOptionContent":"TPSJq-8p0vo-","downloadOptionLabel":"vZU6ZSl8QLI-","downloadOptionDetail":"vubHTSF4aYA-","image":"yYFVVScosfQ-","imageArea":"UskuwLHR6fg-","captionWrapper":"OGjhge-r-U4-","title":"tZU2g-NYdIs-","blurOverlay":"GKIdLTmvcvQ-","thumbnailBar":"_3TfQLQEE3GQ-","thumbnailImage":"eBMzUOlcfQ4-","thumbnail":"eapm2zruLn8-","selected":"PeLn2u-QB0k-","spinning":"_8tDoqjgfLcw-"};
17
+ var styles = {"lightboxWrapper":"_5p2iAj4JfoE-","thumbnailBar":"_3TfQLQEE3GQ-","backgroundImage":"i9Tw1T65W-k-","next":"Q8amcRaTGf0-","prev":"W9FVb24yJrk-","buttonHidden":"nsN0TPWsBXI-","buttonVisible":"dkLYp7AD2jE-","toolbar":"rMK4cKdOxFw-","closeButton":"_0m6vb11DgiA-","slideNumber":"kCc68gGuTgg-","leftActions":"OunDmtPpa9g-","downloadOptionContent":"TPSJq-8p0vo-","downloadOptionLabel":"vZU6ZSl8QLI-","downloadOptionDetail":"vubHTSF4aYA-","image":"yYFVVScosfQ-","imageArea":"UskuwLHR6fg-","captionWrapper":"OGjhge-r-U4-","title":"tZU2g-NYdIs-","blurOverlay":"GKIdLTmvcvQ-","thumbnailImage":"eBMzUOlcfQ4-","thumbnail":"eapm2zruLn8-","selected":"PeLn2u-QB0k-","spinning":"_8tDoqjgfLcw-"};
18
18
 
19
19
  // A little bit more than the transition's duration
20
20
  // We're doing this to prevent a bug from framer-motion
@@ -67,7 +67,6 @@ function LightBoxProvider({ open = true, images, imageIndex = 0, onRequestClose
67
67
  const debouncedHandleNext = useDebounce(handleMoveNext, BUTTON_DEBOUNCE_DELAY);
68
68
  const debouncedHandlePrevious = useDebounce(handleMovePrevious, BUTTON_DEBOUNCE_DELAY);
69
69
  const mounted = useIsMounted();
70
- const prevOpen = useRef(open);
71
70
  useRefocusOnActivator(open);
72
71
  const handleMouseMovement = useDebounce(() => {
73
72
  setMouseIsStationary(true);
@@ -83,10 +82,6 @@ function LightBoxProvider({ open = true, images, imageIndex = 0, onRequestClose
83
82
  setCurrentImageIndex(imageIndex);
84
83
  onImageChange(imageIndex);
85
84
  }, [imageIndex, open]);
86
- if (prevOpen.current !== open) {
87
- prevOpen.current = open;
88
- togglePrintStyles(open);
89
- }
90
85
  useEffect(() => {
91
86
  var _a;
92
87
  (_a = selectedThumbnailRef === null || selectedThumbnailRef === void 0 ? void 0 : selectedThumbnailRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
@@ -156,19 +151,6 @@ function LightBoxProvider({ open = true, images, imageIndex = 0, onRequestClose
156
151
  function useLightBoxContext() {
157
152
  return useContext(LightBoxContext);
158
153
  }
159
- function togglePrintStyles(open) {
160
- try {
161
- if (open) {
162
- document.documentElement.classList.add("atlantisLightBoxActive");
163
- }
164
- else {
165
- document.documentElement.classList.remove("atlantisLightBoxActive");
166
- }
167
- }
168
- catch (error) {
169
- console.error(error);
170
- }
171
- }
172
154
 
173
155
  const lightBoxMessages = defineMessages({
174
156
  close: {
@@ -200,7 +182,6 @@ const lightBoxMessages = defineMessages({
200
182
  function LightBoxContent() {
201
183
  const { open, lightboxRef, handleMouseMove } = useLightBoxContext();
202
184
  const { t } = useAtlantisI18n(lightBoxMessages);
203
- const mounted = useIsMounted();
204
185
  const template = (React__default.createElement(React__default.Fragment, null, open && (React__default.createElement("div", { className: styles.lightboxWrapper, tabIndex: 0, "aria-label": t("lightbox"), key: "Lightbox", ref: lightboxRef, onMouseMove: handleMouseMove },
205
186
  React__default.createElement(LightBoxBackground, null),
206
187
  React__default.createElement(LightBoxOverlay, null),
@@ -209,7 +190,7 @@ function LightBoxContent() {
209
190
  React__default.createElement(LightBoxNavigation, null),
210
191
  React__default.createElement(LightBoxCaption, null),
211
192
  React__default.createElement(LightBoxThumbnails, null)))));
212
- return mounted.current
193
+ return (globalThis === null || globalThis === void 0 ? void 0 : globalThis.document)
213
194
  ? ReactDOM__default.createPortal(template, document.body)
214
195
  : template;
215
196
  }
package/dist/docs/Icon/Icon.md CHANGED
@@ -425,7 +425,9 @@ export function IconSizesExample() {
425
425
  | | `future` |
426
426
  | | `history` |
427
427
  | | `import` |
428
+ | | `maximize` |
428
429
  | | `merge` |
430
+ | | `minimize` |
429
431
  | | `redo` |
430
432
  | | `search` |
431
433
  | | `sort` |
package/dist/styles.css CHANGED
@@ -13075,21 +13075,23 @@ progress.w8NAw4ZMB6g-[value]::-webkit-progress-value {
13075
13075
  }
13076
13076
 
13077
13077
  /**
13078
- * This class is added to the root html element when opening a LightBox.
13079
- * When the user tries to print the page, this prevents the LightBox content
13080
- * from being duplicated multiple times.
13078
+ * The open LightBox is a `position: fixed` portal on `document.body`, and a
13079
+ * fixed element is repainted on every page of a printed document. Hiding the
13080
+ * rest of the body leaves nothing to paginate, so the image prints exactly
13081
+ * once no matter how tall the page behind it is.
13082
+ *
13083
+ * Keyed off the overlay being in the DOM rather than a class the component
13084
+ * toggles, so it cannot fall out of sync with what is on screen. See OPS-26781.
13081
13085
  */
13082
13086
  @media print {
13083
- html.atlantisLightBoxActive {
13084
- overflow: hidden;
13085
- }
13087
+ body:has(> ._5p2iAj4JfoE-) > *:not(._5p2iAj4JfoE-) {
13088
+ display: none;
13089
+ }
13086
13090
 
13087
- html.atlantisLightBoxActive body {
13088
- position: absolute;
13089
- height: 100%;
13090
- overflow: hidden;
13091
- }
13091
+ ._5p2iAj4JfoE- ._3TfQLQEE3GQ- {
13092
+ display: none;
13092
13093
  }
13094
+ }
13093
13095
 
13094
13096
  .i9Tw1T65W-k- {
13095
13097
  position: absolute;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jobber/components",
3
- "version": "9.13.0",
3
+ "version": "9.13.2",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -495,7 +495,7 @@
495
495
  "devDependencies": {
496
496
  "@apollo/client": "^3.7.10",
497
497
  "@csstools/postcss-global-data": "^1.0.3",
498
- "@jobber/design": "0.111.0",
498
+ "@jobber/design": "0.112.0",
499
499
  "@jobber/hooks": "2.21.1",
500
500
  "@rollup/plugin-alias": "^5.1.0",
501
501
  "@rollup/plugin-commonjs": "^25.0.7",
@@ -547,5 +547,5 @@
547
547
  "> 1%",
548
548
  "IE 10"
549
549
  ],
550
- "gitHead": "dd36de6ab42a53be688a1f99ec3342a178c580b6"
550
+ "gitHead": "e730613f3ba3851d31e78cbae08a8b832a1605d5"
551
551
  }