@dreamlake/dockit 0.2.12 → 0.2.13
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.
|
@@ -160,7 +160,7 @@ function Topbar({ searchOpen, onOpenSearch, onCloseSearch, query, setQuery }) {
|
|
|
160
160
|
const [tabsFit, setTabsFit] = useState(false);
|
|
161
161
|
const [tabsW, setTabsW] = useState(0);
|
|
162
162
|
const [pinLeft, setPinLeft] = useState(0);
|
|
163
|
-
const [
|
|
163
|
+
const [searchPinLeft, setSearchPinLeft] = useState(null);
|
|
164
164
|
useLayoutEffect(() => {
|
|
165
165
|
const tabsEl = tabsRef.current;
|
|
166
166
|
if (!tabsEl) return;
|
|
@@ -178,13 +178,13 @@ function Topbar({ searchOpen, onOpenSearch, onCloseSearch, query, setQuery }) {
|
|
|
178
178
|
const brandClear = brandMaxRight.current + 16 <= pin;
|
|
179
179
|
const actions = actionsRef.current?.getBoundingClientRect();
|
|
180
180
|
const actionsLeft = actions ? actions.left : window.innerWidth;
|
|
181
|
-
const pinnedSearchLeft = textRight
|
|
181
|
+
const pinnedSearchLeft = textRight;
|
|
182
182
|
const packedSearchLeft = actionsLeft - 8 - closedWidth;
|
|
183
183
|
const fits = (searchLeft) => w > 0 && brandClear && pin + w + 16 <= searchLeft;
|
|
184
|
-
const fullPin = textRight + 16 <= actionsLeft && fits(pinnedSearchLeft);
|
|
184
|
+
const fullPin = textRight + closedWidth + 16 <= actionsLeft && fits(pinnedSearchLeft);
|
|
185
185
|
setTabsW(w);
|
|
186
186
|
setPinLeft(pin);
|
|
187
|
-
|
|
187
|
+
setSearchPinLeft(fullPin ? pinnedSearchLeft : null);
|
|
188
188
|
setTabsFit(fullPin || fits(packedSearchLeft));
|
|
189
189
|
};
|
|
190
190
|
measure();
|
|
@@ -244,14 +244,17 @@ function Topbar({ searchOpen, onOpenSearch, onCloseSearch, query, setQuery }) {
|
|
|
244
244
|
placeSelf: "stretch",
|
|
245
245
|
boxShadow: "0 4px 14px rgb(0 0 0 / 0.06)",
|
|
246
246
|
transition: `left ${EXPAND_MS}ms ${EXPAND_EASE}, right ${EXPAND_MS}ms ${EXPAND_EASE}, background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease`
|
|
247
|
-
} :
|
|
248
|
-
// Closed,
|
|
249
|
-
// edge
|
|
247
|
+
} : searchPinLeft != null ? {
|
|
248
|
+
// Closed, sitting just outside the content column with
|
|
249
|
+
// its left edge on the column's right border (mirrors
|
|
250
|
+
// the tab strip pinned to the left edge). Left-anchored,
|
|
251
|
+
// so breakpoint width changes grow it away from the
|
|
252
|
+
// column and the shared border never moves.
|
|
250
253
|
// (gridArea/placeSelf: see the note above about
|
|
251
254
|
// fixed-positioned grid items.)
|
|
252
255
|
position: "fixed",
|
|
253
256
|
top: 6,
|
|
254
|
-
|
|
257
|
+
left: searchPinLeft,
|
|
255
258
|
width: closedWidth,
|
|
256
259
|
maxWidth: closedWidth,
|
|
257
260
|
height: 28,
|
package/package.json
CHANGED