@devicai/ui 0.40.0 → 0.40.1
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.
- package/dist/cjs/components/IntegrationsModal/IntegrationsHint.js +46 -7
- package/dist/cjs/components/IntegrationsModal/IntegrationsHint.js.map +1 -1
- package/dist/esm/components/IntegrationsModal/IntegrationsHint.js +46 -7
- package/dist/esm/components/IntegrationsModal/IntegrationsHint.js.map +1 -1
- package/package.json +1 -1
|
@@ -48,6 +48,47 @@ function boxesThatFit(width, max) {
|
|
|
48
48
|
const LABEL_AND_CLOSE = 195;
|
|
49
49
|
return Math.max(3, Math.min(max + 1, Math.floor((width - LABEL_AND_CLOSE) / 30)));
|
|
50
50
|
}
|
|
51
|
+
/** Whether an element is on screen right now. */
|
|
52
|
+
function isVisible(el) {
|
|
53
|
+
const r = el.getBoundingClientRect();
|
|
54
|
+
if (!r.width || !r.height)
|
|
55
|
+
return false;
|
|
56
|
+
return (r.bottom > 0 &&
|
|
57
|
+
r.right > 0 &&
|
|
58
|
+
r.top < window.innerHeight &&
|
|
59
|
+
r.left < window.innerWidth);
|
|
60
|
+
}
|
|
61
|
+
/**
|
|
62
|
+
* The header control this bar belongs to.
|
|
63
|
+
*
|
|
64
|
+
* Scoped to its own drawer first — a page can hold several, each with its own
|
|
65
|
+
* header — and only then to the nearest visible one anywhere. The class name is
|
|
66
|
+
* checked against both the drawer's own container and the legacy one, because
|
|
67
|
+
* getting this wrong is silent: `closest` returns null, the search widens to the
|
|
68
|
+
* whole document, and the copy flies to whichever control happens to be first
|
|
69
|
+
* in the DOM.
|
|
70
|
+
*/
|
|
71
|
+
function flyTarget(bar, selector) {
|
|
72
|
+
if (!selector)
|
|
73
|
+
return null;
|
|
74
|
+
const drawer = bar.closest(".devic-chat-drawer, .devic-drawer");
|
|
75
|
+
const own = drawer?.querySelector(selector);
|
|
76
|
+
if (own && isVisible(own))
|
|
77
|
+
return own;
|
|
78
|
+
const barRect = bar.getBoundingClientRect();
|
|
79
|
+
const candidates = [...document.querySelectorAll(selector)].filter(isVisible);
|
|
80
|
+
if (!candidates.length)
|
|
81
|
+
return null;
|
|
82
|
+
// Nearest to the bar, so a page with several drawers still animates towards
|
|
83
|
+
// the one the user is looking at.
|
|
84
|
+
return candidates.reduce((best, el) => {
|
|
85
|
+
const d = (e) => {
|
|
86
|
+
const r = e.getBoundingClientRect();
|
|
87
|
+
return Math.hypot(r.left - barRect.left, r.top - barRect.top);
|
|
88
|
+
};
|
|
89
|
+
return d(el) < d(best) ? el : best;
|
|
90
|
+
});
|
|
91
|
+
}
|
|
51
92
|
/**
|
|
52
93
|
* The strip above the composer that tells the end user their own apps can be
|
|
53
94
|
* connected here.
|
|
@@ -93,12 +134,10 @@ function IntegrationsHint({ state, onOpen, label, maxLogos = 6, storageKey, flyT
|
|
|
93
134
|
return;
|
|
94
135
|
if (window.matchMedia?.("(prefers-reduced-motion: reduce)").matches)
|
|
95
136
|
return;
|
|
96
|
-
|
|
97
|
-
//
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
? root.querySelector(flyToSelector)
|
|
101
|
-
: null;
|
|
137
|
+
const target = flyTarget(bar, flyToSelector);
|
|
138
|
+
// Nothing to fly to, or nothing the user can see: the bar just closes.
|
|
139
|
+
// A copy sailing off towards something 2000px down the page says the
|
|
140
|
+
// opposite of what this animation is for.
|
|
102
141
|
if (!target)
|
|
103
142
|
return;
|
|
104
143
|
const logos = bar.querySelector(".devic-int-hint-logos");
|
|
@@ -145,7 +184,7 @@ function IntegrationsHint({ state, onOpen, label, maxLogos = 6, storageKey, flyT
|
|
|
145
184
|
const capacity = Math.max(1, boxes);
|
|
146
185
|
const shown = sorted.slice(0, sorted.length > capacity ? capacity - 1 : capacity);
|
|
147
186
|
const extra = sorted.length - shown.length;
|
|
148
|
-
return (jsxRuntime.jsxs("div", { ref: ref, className: `devic-int-hint ${className}`.trim(), "data-dark": dark, "data-leaving": leaving, children: [jsxRuntime.jsxs("button", { type: "button", className: "devic-int-hint-main", onClick: onOpen,
|
|
187
|
+
return (jsxRuntime.jsxs("div", { ref: ref, className: `devic-int-hint ${className}`.trim(), "data-dark": dark, "data-leaving": leaving, children: [jsxRuntime.jsxs("button", { type: "button", className: "devic-int-hint-main", onClick: onOpen, children: [jsxRuntime.jsx("span", { className: "devic-int-hint-label", children: text }), jsxRuntime.jsxs("span", { className: "devic-int-hint-logos", "aria-hidden": "true", children: [shown.map((integration) => (jsxRuntime.jsx("span", { className: "devic-int-hint-item", "data-connected": integration.connected, children: jsxRuntime.jsx(IntegrationLogo.IntegrationLogo, { integration: integration, className: "devic-int-hint-logo" }) }, integration.app))), extra > 0 && (jsxRuntime.jsxs("span", { className: "devic-int-hint-item devic-int-hint-more", children: ["+", extra] }))] })] }), jsxRuntime.jsx("button", { type: "button", className: "devic-int-hint-close", onClick: dismiss, "aria-label": "Hide this", title: "Hide this. Your apps stay in the header.", children: "\u00D7" })] }));
|
|
149
188
|
}
|
|
150
189
|
|
|
151
190
|
exports.IntegrationsHint = IntegrationsHint;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntegrationsHint.js","sources":["../../../../../src/components/IntegrationsModal/IntegrationsHint.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type JSX,\n} from \"react\";\nimport type { Integration } from \"../../api/types\";\nimport { IntegrationLogo } from \"./IntegrationLogo\";\nimport type { IntegrationsState } from \"./useIntegrations\";\nimport \"./IntegrationsModal.css\";\n\nexport interface IntegrationsHintProps {\n /** Shared listing (see `useIntegrations`). */\n state: IntegrationsState;\n /** Opens the connected-apps modal. */\n onOpen: () => void;\n /**\n * Text on the left. Defaults to \"Connect your apps\", or \"Explore connected\n * apps\" once at least one is connected — an invitation the user has already\n * accepted stops being an invitation.\n */\n label?: string;\n /** Most logos to show before the `+N` box. @default 6 */\n maxLogos?: number;\n /**\n * Identity the dismissal is remembered against, so closing it for one end\n * user does not close it for the next one on the same browser.\n */\n storageKey?: string;\n /** Where the bar flies to when closed — the header control. */\n flyToSelector?: string;\n /** Light chips for a dark surface. */\n dark?: boolean;\n className?: string;\n}\n\nconst STORAGE_PREFIX = \"devic:apps-hint-dismissed:\";\n\n/** Reading storage throws in Safari's private mode and in sandboxed frames. */\nfunction wasDismissed(key?: string): boolean {\n if (!key) return false;\n try {\n return localStorage.getItem(STORAGE_PREFIX + key) === \"1\";\n } catch {\n return false;\n }\n}\n\nfunction rememberDismissal(key?: string): void {\n if (!key) return;\n try {\n localStorage.setItem(STORAGE_PREFIX + key, \"1\");\n } catch {\n // Then it comes back next session. Not worth a word to the user.\n }\n}\n\n/** Connected first, same order as the header control. */\nfunction order(integrations: Integration[]): Integration[] {\n return [...integrations].sort((a, b) => {\n if (a.connected !== b.connected) return a.connected ? -1 : 1;\n return 0;\n });\n}\n\n/**\n * How many 24px chips fit once the label and the close button are paid for.\n *\n * The label is the whole reason this row exists, so it gets its space first:\n * a strip reading \"Connect your …\" beside seven logos has lost the argument.\n * Never fewer than three chips, below which the row stops reading as a set of\n * apps at all.\n */\nfunction boxesThatFit(width: number, max: number): number {\n if (!width) return max + 1;\n const LABEL_AND_CLOSE = 195;\n return Math.max(3, Math.min(max + 1, Math.floor((width - LABEL_AND_CLOSE) / 30)));\n}\n\n/**\n * The strip above the composer that tells the end user their own apps can be\n * connected here.\n *\n * It exists because the header control is a row of small logos and nothing\n * else: discoverable once you know what it is, invisible until then. This says\n * it in words, once, and then gets out of the way for good — the dismissal is\n * remembered per end user, and closing it animates towards the header so that\n * what was dismissed is understood to still be there.\n */\nexport function IntegrationsHint({\n state,\n onOpen,\n label,\n maxLogos = 6,\n storageKey,\n flyToSelector = \".devic-int-launcher\",\n dark = false,\n className = \"\",\n}: IntegrationsHintProps): JSX.Element | null {\n const sorted = useMemo(() => order(state.integrations), [state.integrations]);\n const ref = useRef<HTMLDivElement>(null);\n const [boxes, setBoxes] = useState(maxLogos + 1);\n const [dismissed, setDismissed] = useState(() => wasDismissed(storageKey));\n const [leaving, setLeaving] = useState(false);\n\n // A different end user has their own answer to whether this was dismissed.\n useEffect(() => {\n setDismissed(wasDismissed(storageKey));\n setLeaving(false);\n }, [storageKey]);\n\n useEffect(() => {\n const el = ref.current;\n if (!el || typeof ResizeObserver === \"undefined\") return;\n const measure = () =>\n setBoxes(boxesThatFit(el.getBoundingClientRect().width, maxLogos));\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(el);\n return () => observer.disconnect();\n }, [maxLogos, state.offered, dismissed]);\n\n /**\n * Sends a copy of the logos from the bar to the header control.\n *\n * A dismissal that simply blanks the row reads as \"that is gone now\". The\n * flight is the sentence \"it moved up there\" said without words — so if it\n * cannot be drawn (reduced motion, no target, no Web Animations API), the bar\n * just closes and nothing is lost.\n */\n const flyToLauncher = useCallback(() => {\n const bar = ref.current;\n if (!bar || typeof document === \"undefined\") return;\n if (window.matchMedia?.(\"(prefers-reduced-motion: reduce)\").matches) return;\n\n // Scoped to the drawer this bar lives in: a page with two drawers has two\n // launchers, and the copy must fly to its own.\n const root = bar.closest(\".devic-drawer\") ?? document;\n const target = flyToSelector\n ? (root.querySelector(flyToSelector) as HTMLElement | null)\n : null;\n if (!target) return;\n\n const logos = bar.querySelector(\".devic-int-hint-logos\");\n const from = (logos ?? bar).getBoundingClientRect();\n const to = target.getBoundingClientRect();\n\n const ghost = (logos ?? bar).cloneNode(true) as HTMLElement;\n ghost.classList.add(\"devic-int-hint-ghost\");\n ghost.style.left = `${from.left}px`;\n ghost.style.top = `${from.top}px`;\n ghost.style.width = `${from.width}px`;\n ghost.style.height = `${from.height}px`;\n document.body.appendChild(ghost);\n\n const dx = to.left + to.width / 2 - (from.left + from.width / 2);\n const dy = to.top + to.height / 2 - (from.top + from.height / 2);\n const scale = from.width ? Math.max(0.4, to.width / from.width) : 0.6;\n\n const animation = ghost.animate?.(\n [\n { transform: \"translate(0, 0) scale(1)\", opacity: 0.95 },\n {\n transform: `translate(${dx}px, ${dy}px) scale(${scale})`,\n opacity: 0,\n },\n ],\n { duration: 420, easing: \"cubic-bezier(0.4, 0, 0.2, 1)\" }\n );\n\n const remove = () => ghost.remove();\n if (animation) animation.onfinish = remove;\n else remove();\n // Belt and braces: a tab backgrounded mid-flight never fires onfinish.\n window.setTimeout(remove, 1200);\n }, [flyToSelector]);\n\n const dismiss = () => {\n flyToLauncher();\n rememberDismissal(storageKey);\n setLeaving(true);\n window.setTimeout(() => setDismissed(true), 220);\n };\n\n if (dismissed || !state.offered || sorted.length === 0) return null;\n\n const text =\n label ??\n (sorted.some((i) => i.connected)\n ? \"Explore connected apps\"\n : \"Connect your apps\");\n\n // When some apps will not fit, the `+N` box takes one of the slots itself.\n const capacity = Math.max(1, boxes);\n const shown = sorted.slice(\n 0,\n sorted.length > capacity ? capacity - 1 : capacity\n );\n const extra = sorted.length - shown.length;\n\n return (\n <div\n ref={ref}\n className={`devic-int-hint ${className}`.trim()}\n data-dark={dark}\n data-leaving={leaving}\n >\n <button\n type=\"button\"\n className=\"devic-int-hint-main\"\n onClick={onOpen}\n title={text}\n >\n <span className=\"devic-int-hint-label\">{text}</span>\n <span className=\"devic-int-hint-logos\" aria-hidden=\"true\">\n {shown.map((integration) => (\n <span\n key={integration.app}\n className=\"devic-int-hint-item\"\n data-connected={integration.connected}\n >\n <IntegrationLogo\n integration={integration}\n className=\"devic-int-hint-logo\"\n />\n </span>\n ))}\n {extra > 0 && (\n <span className=\"devic-int-hint-item devic-int-hint-more\">\n +{extra}\n </span>\n )}\n </span>\n </button>\n <button\n type=\"button\"\n className=\"devic-int-hint-close\"\n onClick={dismiss}\n aria-label=\"Hide this\"\n title=\"Hide this. Your apps stay in the header.\"\n >\n ×\n </button>\n </div>\n );\n}\n\nexport default IntegrationsHint;\n"],"names":["useMemo","useRef","useState","useEffect","useCallback","_jsxs","_jsx","IntegrationLogo"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"IntegrationsHint.js","sources":["../../../../../src/components/IntegrationsModal/IntegrationsHint.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type JSX,\n} from \"react\";\nimport type { Integration } from \"../../api/types\";\nimport { IntegrationLogo } from \"./IntegrationLogo\";\nimport type { IntegrationsState } from \"./useIntegrations\";\nimport \"./IntegrationsModal.css\";\n\nexport interface IntegrationsHintProps {\n /** Shared listing (see `useIntegrations`). */\n state: IntegrationsState;\n /** Opens the connected-apps modal. */\n onOpen: () => void;\n /**\n * Text on the left. Defaults to \"Connect your apps\", or \"Explore connected\n * apps\" once at least one is connected — an invitation the user has already\n * accepted stops being an invitation.\n */\n label?: string;\n /** Most logos to show before the `+N` box. @default 6 */\n maxLogos?: number;\n /**\n * Identity the dismissal is remembered against, so closing it for one end\n * user does not close it for the next one on the same browser.\n */\n storageKey?: string;\n /** Where the bar flies to when closed — the header control. */\n flyToSelector?: string;\n /** Light chips for a dark surface. */\n dark?: boolean;\n className?: string;\n}\n\nconst STORAGE_PREFIX = \"devic:apps-hint-dismissed:\";\n\n/** Reading storage throws in Safari's private mode and in sandboxed frames. */\nfunction wasDismissed(key?: string): boolean {\n if (!key) return false;\n try {\n return localStorage.getItem(STORAGE_PREFIX + key) === \"1\";\n } catch {\n return false;\n }\n}\n\nfunction rememberDismissal(key?: string): void {\n if (!key) return;\n try {\n localStorage.setItem(STORAGE_PREFIX + key, \"1\");\n } catch {\n // Then it comes back next session. Not worth a word to the user.\n }\n}\n\n/** Connected first, same order as the header control. */\nfunction order(integrations: Integration[]): Integration[] {\n return [...integrations].sort((a, b) => {\n if (a.connected !== b.connected) return a.connected ? -1 : 1;\n return 0;\n });\n}\n\n/**\n * How many 24px chips fit once the label and the close button are paid for.\n *\n * The label is the whole reason this row exists, so it gets its space first:\n * a strip reading \"Connect your …\" beside seven logos has lost the argument.\n * Never fewer than three chips, below which the row stops reading as a set of\n * apps at all.\n */\nfunction boxesThatFit(width: number, max: number): number {\n if (!width) return max + 1;\n const LABEL_AND_CLOSE = 195;\n return Math.max(3, Math.min(max + 1, Math.floor((width - LABEL_AND_CLOSE) / 30)));\n}\n\n/** Whether an element is on screen right now. */\nfunction isVisible(el: Element): boolean {\n const r = el.getBoundingClientRect();\n if (!r.width || !r.height) return false;\n return (\n r.bottom > 0 &&\n r.right > 0 &&\n r.top < window.innerHeight &&\n r.left < window.innerWidth\n );\n}\n\n/**\n * The header control this bar belongs to.\n *\n * Scoped to its own drawer first — a page can hold several, each with its own\n * header — and only then to the nearest visible one anywhere. The class name is\n * checked against both the drawer's own container and the legacy one, because\n * getting this wrong is silent: `closest` returns null, the search widens to the\n * whole document, and the copy flies to whichever control happens to be first\n * in the DOM.\n */\nfunction flyTarget(bar: Element, selector: string): HTMLElement | null {\n if (!selector) return null;\n\n const drawer = bar.closest(\".devic-chat-drawer, .devic-drawer\");\n const own = drawer?.querySelector(selector) as HTMLElement | null;\n if (own && isVisible(own)) return own;\n\n const barRect = bar.getBoundingClientRect();\n const candidates = [...document.querySelectorAll(selector)].filter(isVisible);\n if (!candidates.length) return null;\n\n // Nearest to the bar, so a page with several drawers still animates towards\n // the one the user is looking at.\n return candidates.reduce((best, el) => {\n const d = (e: Element) => {\n const r = e.getBoundingClientRect();\n return Math.hypot(r.left - barRect.left, r.top - barRect.top);\n };\n return d(el) < d(best) ? el : best;\n }) as HTMLElement;\n}\n\n/**\n * The strip above the composer that tells the end user their own apps can be\n * connected here.\n *\n * It exists because the header control is a row of small logos and nothing\n * else: discoverable once you know what it is, invisible until then. This says\n * it in words, once, and then gets out of the way for good — the dismissal is\n * remembered per end user, and closing it animates towards the header so that\n * what was dismissed is understood to still be there.\n */\nexport function IntegrationsHint({\n state,\n onOpen,\n label,\n maxLogos = 6,\n storageKey,\n flyToSelector = \".devic-int-launcher\",\n dark = false,\n className = \"\",\n}: IntegrationsHintProps): JSX.Element | null {\n const sorted = useMemo(() => order(state.integrations), [state.integrations]);\n const ref = useRef<HTMLDivElement>(null);\n const [boxes, setBoxes] = useState(maxLogos + 1);\n const [dismissed, setDismissed] = useState(() => wasDismissed(storageKey));\n const [leaving, setLeaving] = useState(false);\n\n // A different end user has their own answer to whether this was dismissed.\n useEffect(() => {\n setDismissed(wasDismissed(storageKey));\n setLeaving(false);\n }, [storageKey]);\n\n useEffect(() => {\n const el = ref.current;\n if (!el || typeof ResizeObserver === \"undefined\") return;\n const measure = () =>\n setBoxes(boxesThatFit(el.getBoundingClientRect().width, maxLogos));\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(el);\n return () => observer.disconnect();\n }, [maxLogos, state.offered, dismissed]);\n\n /**\n * Sends a copy of the logos from the bar to the header control.\n *\n * A dismissal that simply blanks the row reads as \"that is gone now\". The\n * flight is the sentence \"it moved up there\" said without words — so if it\n * cannot be drawn (reduced motion, no target, no Web Animations API), the bar\n * just closes and nothing is lost.\n */\n const flyToLauncher = useCallback(() => {\n const bar = ref.current;\n if (!bar || typeof document === \"undefined\") return;\n if (window.matchMedia?.(\"(prefers-reduced-motion: reduce)\").matches) return;\n\n const target = flyTarget(bar, flyToSelector);\n // Nothing to fly to, or nothing the user can see: the bar just closes.\n // A copy sailing off towards something 2000px down the page says the\n // opposite of what this animation is for.\n if (!target) return;\n\n const logos = bar.querySelector(\".devic-int-hint-logos\");\n const from = (logos ?? bar).getBoundingClientRect();\n const to = target.getBoundingClientRect();\n\n const ghost = (logos ?? bar).cloneNode(true) as HTMLElement;\n ghost.classList.add(\"devic-int-hint-ghost\");\n ghost.style.left = `${from.left}px`;\n ghost.style.top = `${from.top}px`;\n ghost.style.width = `${from.width}px`;\n ghost.style.height = `${from.height}px`;\n document.body.appendChild(ghost);\n\n const dx = to.left + to.width / 2 - (from.left + from.width / 2);\n const dy = to.top + to.height / 2 - (from.top + from.height / 2);\n const scale = from.width ? Math.max(0.4, to.width / from.width) : 0.6;\n\n const animation = ghost.animate?.(\n [\n { transform: \"translate(0, 0) scale(1)\", opacity: 0.95 },\n {\n transform: `translate(${dx}px, ${dy}px) scale(${scale})`,\n opacity: 0,\n },\n ],\n { duration: 420, easing: \"cubic-bezier(0.4, 0, 0.2, 1)\" }\n );\n\n const remove = () => ghost.remove();\n if (animation) animation.onfinish = remove;\n else remove();\n // Belt and braces: a tab backgrounded mid-flight never fires onfinish.\n window.setTimeout(remove, 1200);\n }, [flyToSelector]);\n\n const dismiss = () => {\n flyToLauncher();\n rememberDismissal(storageKey);\n setLeaving(true);\n window.setTimeout(() => setDismissed(true), 220);\n };\n\n if (dismissed || !state.offered || sorted.length === 0) return null;\n\n const text =\n label ??\n (sorted.some((i) => i.connected)\n ? \"Explore connected apps\"\n : \"Connect your apps\");\n\n // When some apps will not fit, the `+N` box takes one of the slots itself.\n const capacity = Math.max(1, boxes);\n const shown = sorted.slice(\n 0,\n sorted.length > capacity ? capacity - 1 : capacity\n );\n const extra = sorted.length - shown.length;\n\n return (\n <div\n ref={ref}\n className={`devic-int-hint ${className}`.trim()}\n data-dark={dark}\n data-leaving={leaving}\n >\n <button\n type=\"button\"\n className=\"devic-int-hint-main\"\n onClick={onOpen}\n >\n <span className=\"devic-int-hint-label\">{text}</span>\n <span className=\"devic-int-hint-logos\" aria-hidden=\"true\">\n {shown.map((integration) => (\n <span\n key={integration.app}\n className=\"devic-int-hint-item\"\n data-connected={integration.connected}\n >\n <IntegrationLogo\n integration={integration}\n className=\"devic-int-hint-logo\"\n />\n </span>\n ))}\n {extra > 0 && (\n <span className=\"devic-int-hint-item devic-int-hint-more\">\n +{extra}\n </span>\n )}\n </span>\n </button>\n <button\n type=\"button\"\n className=\"devic-int-hint-close\"\n onClick={dismiss}\n aria-label=\"Hide this\"\n title=\"Hide this. Your apps stay in the header.\"\n >\n ×\n </button>\n </div>\n );\n}\n\nexport default IntegrationsHint;\n"],"names":["useMemo","useRef","useState","useEffect","useCallback","_jsxs","_jsx","IntegrationLogo"],"mappings":"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"}
|
|
@@ -46,6 +46,47 @@ function boxesThatFit(width, max) {
|
|
|
46
46
|
const LABEL_AND_CLOSE = 195;
|
|
47
47
|
return Math.max(3, Math.min(max + 1, Math.floor((width - LABEL_AND_CLOSE) / 30)));
|
|
48
48
|
}
|
|
49
|
+
/** Whether an element is on screen right now. */
|
|
50
|
+
function isVisible(el) {
|
|
51
|
+
const r = el.getBoundingClientRect();
|
|
52
|
+
if (!r.width || !r.height)
|
|
53
|
+
return false;
|
|
54
|
+
return (r.bottom > 0 &&
|
|
55
|
+
r.right > 0 &&
|
|
56
|
+
r.top < window.innerHeight &&
|
|
57
|
+
r.left < window.innerWidth);
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* The header control this bar belongs to.
|
|
61
|
+
*
|
|
62
|
+
* Scoped to its own drawer first — a page can hold several, each with its own
|
|
63
|
+
* header — and only then to the nearest visible one anywhere. The class name is
|
|
64
|
+
* checked against both the drawer's own container and the legacy one, because
|
|
65
|
+
* getting this wrong is silent: `closest` returns null, the search widens to the
|
|
66
|
+
* whole document, and the copy flies to whichever control happens to be first
|
|
67
|
+
* in the DOM.
|
|
68
|
+
*/
|
|
69
|
+
function flyTarget(bar, selector) {
|
|
70
|
+
if (!selector)
|
|
71
|
+
return null;
|
|
72
|
+
const drawer = bar.closest(".devic-chat-drawer, .devic-drawer");
|
|
73
|
+
const own = drawer?.querySelector(selector);
|
|
74
|
+
if (own && isVisible(own))
|
|
75
|
+
return own;
|
|
76
|
+
const barRect = bar.getBoundingClientRect();
|
|
77
|
+
const candidates = [...document.querySelectorAll(selector)].filter(isVisible);
|
|
78
|
+
if (!candidates.length)
|
|
79
|
+
return null;
|
|
80
|
+
// Nearest to the bar, so a page with several drawers still animates towards
|
|
81
|
+
// the one the user is looking at.
|
|
82
|
+
return candidates.reduce((best, el) => {
|
|
83
|
+
const d = (e) => {
|
|
84
|
+
const r = e.getBoundingClientRect();
|
|
85
|
+
return Math.hypot(r.left - barRect.left, r.top - barRect.top);
|
|
86
|
+
};
|
|
87
|
+
return d(el) < d(best) ? el : best;
|
|
88
|
+
});
|
|
89
|
+
}
|
|
49
90
|
/**
|
|
50
91
|
* The strip above the composer that tells the end user their own apps can be
|
|
51
92
|
* connected here.
|
|
@@ -91,12 +132,10 @@ function IntegrationsHint({ state, onOpen, label, maxLogos = 6, storageKey, flyT
|
|
|
91
132
|
return;
|
|
92
133
|
if (window.matchMedia?.("(prefers-reduced-motion: reduce)").matches)
|
|
93
134
|
return;
|
|
94
|
-
|
|
95
|
-
//
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
? root.querySelector(flyToSelector)
|
|
99
|
-
: null;
|
|
135
|
+
const target = flyTarget(bar, flyToSelector);
|
|
136
|
+
// Nothing to fly to, or nothing the user can see: the bar just closes.
|
|
137
|
+
// A copy sailing off towards something 2000px down the page says the
|
|
138
|
+
// opposite of what this animation is for.
|
|
100
139
|
if (!target)
|
|
101
140
|
return;
|
|
102
141
|
const logos = bar.querySelector(".devic-int-hint-logos");
|
|
@@ -143,7 +182,7 @@ function IntegrationsHint({ state, onOpen, label, maxLogos = 6, storageKey, flyT
|
|
|
143
182
|
const capacity = Math.max(1, boxes);
|
|
144
183
|
const shown = sorted.slice(0, sorted.length > capacity ? capacity - 1 : capacity);
|
|
145
184
|
const extra = sorted.length - shown.length;
|
|
146
|
-
return (jsxs("div", { ref: ref, className: `devic-int-hint ${className}`.trim(), "data-dark": dark, "data-leaving": leaving, children: [jsxs("button", { type: "button", className: "devic-int-hint-main", onClick: onOpen,
|
|
185
|
+
return (jsxs("div", { ref: ref, className: `devic-int-hint ${className}`.trim(), "data-dark": dark, "data-leaving": leaving, children: [jsxs("button", { type: "button", className: "devic-int-hint-main", onClick: onOpen, children: [jsx("span", { className: "devic-int-hint-label", children: text }), jsxs("span", { className: "devic-int-hint-logos", "aria-hidden": "true", children: [shown.map((integration) => (jsx("span", { className: "devic-int-hint-item", "data-connected": integration.connected, children: jsx(IntegrationLogo, { integration: integration, className: "devic-int-hint-logo" }) }, integration.app))), extra > 0 && (jsxs("span", { className: "devic-int-hint-item devic-int-hint-more", children: ["+", extra] }))] })] }), jsx("button", { type: "button", className: "devic-int-hint-close", onClick: dismiss, "aria-label": "Hide this", title: "Hide this. Your apps stay in the header.", children: "\u00D7" })] }));
|
|
147
186
|
}
|
|
148
187
|
|
|
149
188
|
export { IntegrationsHint };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IntegrationsHint.js","sources":["../../../../src/components/IntegrationsModal/IntegrationsHint.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type JSX,\n} from \"react\";\nimport type { Integration } from \"../../api/types\";\nimport { IntegrationLogo } from \"./IntegrationLogo\";\nimport type { IntegrationsState } from \"./useIntegrations\";\nimport \"./IntegrationsModal.css\";\n\nexport interface IntegrationsHintProps {\n /** Shared listing (see `useIntegrations`). */\n state: IntegrationsState;\n /** Opens the connected-apps modal. */\n onOpen: () => void;\n /**\n * Text on the left. Defaults to \"Connect your apps\", or \"Explore connected\n * apps\" once at least one is connected — an invitation the user has already\n * accepted stops being an invitation.\n */\n label?: string;\n /** Most logos to show before the `+N` box. @default 6 */\n maxLogos?: number;\n /**\n * Identity the dismissal is remembered against, so closing it for one end\n * user does not close it for the next one on the same browser.\n */\n storageKey?: string;\n /** Where the bar flies to when closed — the header control. */\n flyToSelector?: string;\n /** Light chips for a dark surface. */\n dark?: boolean;\n className?: string;\n}\n\nconst STORAGE_PREFIX = \"devic:apps-hint-dismissed:\";\n\n/** Reading storage throws in Safari's private mode and in sandboxed frames. */\nfunction wasDismissed(key?: string): boolean {\n if (!key) return false;\n try {\n return localStorage.getItem(STORAGE_PREFIX + key) === \"1\";\n } catch {\n return false;\n }\n}\n\nfunction rememberDismissal(key?: string): void {\n if (!key) return;\n try {\n localStorage.setItem(STORAGE_PREFIX + key, \"1\");\n } catch {\n // Then it comes back next session. Not worth a word to the user.\n }\n}\n\n/** Connected first, same order as the header control. */\nfunction order(integrations: Integration[]): Integration[] {\n return [...integrations].sort((a, b) => {\n if (a.connected !== b.connected) return a.connected ? -1 : 1;\n return 0;\n });\n}\n\n/**\n * How many 24px chips fit once the label and the close button are paid for.\n *\n * The label is the whole reason this row exists, so it gets its space first:\n * a strip reading \"Connect your …\" beside seven logos has lost the argument.\n * Never fewer than three chips, below which the row stops reading as a set of\n * apps at all.\n */\nfunction boxesThatFit(width: number, max: number): number {\n if (!width) return max + 1;\n const LABEL_AND_CLOSE = 195;\n return Math.max(3, Math.min(max + 1, Math.floor((width - LABEL_AND_CLOSE) / 30)));\n}\n\n/**\n * The strip above the composer that tells the end user their own apps can be\n * connected here.\n *\n * It exists because the header control is a row of small logos and nothing\n * else: discoverable once you know what it is, invisible until then. This says\n * it in words, once, and then gets out of the way for good — the dismissal is\n * remembered per end user, and closing it animates towards the header so that\n * what was dismissed is understood to still be there.\n */\nexport function IntegrationsHint({\n state,\n onOpen,\n label,\n maxLogos = 6,\n storageKey,\n flyToSelector = \".devic-int-launcher\",\n dark = false,\n className = \"\",\n}: IntegrationsHintProps): JSX.Element | null {\n const sorted = useMemo(() => order(state.integrations), [state.integrations]);\n const ref = useRef<HTMLDivElement>(null);\n const [boxes, setBoxes] = useState(maxLogos + 1);\n const [dismissed, setDismissed] = useState(() => wasDismissed(storageKey));\n const [leaving, setLeaving] = useState(false);\n\n // A different end user has their own answer to whether this was dismissed.\n useEffect(() => {\n setDismissed(wasDismissed(storageKey));\n setLeaving(false);\n }, [storageKey]);\n\n useEffect(() => {\n const el = ref.current;\n if (!el || typeof ResizeObserver === \"undefined\") return;\n const measure = () =>\n setBoxes(boxesThatFit(el.getBoundingClientRect().width, maxLogos));\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(el);\n return () => observer.disconnect();\n }, [maxLogos, state.offered, dismissed]);\n\n /**\n * Sends a copy of the logos from the bar to the header control.\n *\n * A dismissal that simply blanks the row reads as \"that is gone now\". The\n * flight is the sentence \"it moved up there\" said without words — so if it\n * cannot be drawn (reduced motion, no target, no Web Animations API), the bar\n * just closes and nothing is lost.\n */\n const flyToLauncher = useCallback(() => {\n const bar = ref.current;\n if (!bar || typeof document === \"undefined\") return;\n if (window.matchMedia?.(\"(prefers-reduced-motion: reduce)\").matches) return;\n\n // Scoped to the drawer this bar lives in: a page with two drawers has two\n // launchers, and the copy must fly to its own.\n const root = bar.closest(\".devic-drawer\") ?? document;\n const target = flyToSelector\n ? (root.querySelector(flyToSelector) as HTMLElement | null)\n : null;\n if (!target) return;\n\n const logos = bar.querySelector(\".devic-int-hint-logos\");\n const from = (logos ?? bar).getBoundingClientRect();\n const to = target.getBoundingClientRect();\n\n const ghost = (logos ?? bar).cloneNode(true) as HTMLElement;\n ghost.classList.add(\"devic-int-hint-ghost\");\n ghost.style.left = `${from.left}px`;\n ghost.style.top = `${from.top}px`;\n ghost.style.width = `${from.width}px`;\n ghost.style.height = `${from.height}px`;\n document.body.appendChild(ghost);\n\n const dx = to.left + to.width / 2 - (from.left + from.width / 2);\n const dy = to.top + to.height / 2 - (from.top + from.height / 2);\n const scale = from.width ? Math.max(0.4, to.width / from.width) : 0.6;\n\n const animation = ghost.animate?.(\n [\n { transform: \"translate(0, 0) scale(1)\", opacity: 0.95 },\n {\n transform: `translate(${dx}px, ${dy}px) scale(${scale})`,\n opacity: 0,\n },\n ],\n { duration: 420, easing: \"cubic-bezier(0.4, 0, 0.2, 1)\" }\n );\n\n const remove = () => ghost.remove();\n if (animation) animation.onfinish = remove;\n else remove();\n // Belt and braces: a tab backgrounded mid-flight never fires onfinish.\n window.setTimeout(remove, 1200);\n }, [flyToSelector]);\n\n const dismiss = () => {\n flyToLauncher();\n rememberDismissal(storageKey);\n setLeaving(true);\n window.setTimeout(() => setDismissed(true), 220);\n };\n\n if (dismissed || !state.offered || sorted.length === 0) return null;\n\n const text =\n label ??\n (sorted.some((i) => i.connected)\n ? \"Explore connected apps\"\n : \"Connect your apps\");\n\n // When some apps will not fit, the `+N` box takes one of the slots itself.\n const capacity = Math.max(1, boxes);\n const shown = sorted.slice(\n 0,\n sorted.length > capacity ? capacity - 1 : capacity\n );\n const extra = sorted.length - shown.length;\n\n return (\n <div\n ref={ref}\n className={`devic-int-hint ${className}`.trim()}\n data-dark={dark}\n data-leaving={leaving}\n >\n <button\n type=\"button\"\n className=\"devic-int-hint-main\"\n onClick={onOpen}\n title={text}\n >\n <span className=\"devic-int-hint-label\">{text}</span>\n <span className=\"devic-int-hint-logos\" aria-hidden=\"true\">\n {shown.map((integration) => (\n <span\n key={integration.app}\n className=\"devic-int-hint-item\"\n data-connected={integration.connected}\n >\n <IntegrationLogo\n integration={integration}\n className=\"devic-int-hint-logo\"\n />\n </span>\n ))}\n {extra > 0 && (\n <span className=\"devic-int-hint-item devic-int-hint-more\">\n +{extra}\n </span>\n )}\n </span>\n </button>\n <button\n type=\"button\"\n className=\"devic-int-hint-close\"\n onClick={dismiss}\n aria-label=\"Hide this\"\n title=\"Hide this. Your apps stay in the header.\"\n >\n ×\n </button>\n </div>\n );\n}\n\nexport default IntegrationsHint;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"IntegrationsHint.js","sources":["../../../../src/components/IntegrationsModal/IntegrationsHint.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type JSX,\n} from \"react\";\nimport type { Integration } from \"../../api/types\";\nimport { IntegrationLogo } from \"./IntegrationLogo\";\nimport type { IntegrationsState } from \"./useIntegrations\";\nimport \"./IntegrationsModal.css\";\n\nexport interface IntegrationsHintProps {\n /** Shared listing (see `useIntegrations`). */\n state: IntegrationsState;\n /** Opens the connected-apps modal. */\n onOpen: () => void;\n /**\n * Text on the left. Defaults to \"Connect your apps\", or \"Explore connected\n * apps\" once at least one is connected — an invitation the user has already\n * accepted stops being an invitation.\n */\n label?: string;\n /** Most logos to show before the `+N` box. @default 6 */\n maxLogos?: number;\n /**\n * Identity the dismissal is remembered against, so closing it for one end\n * user does not close it for the next one on the same browser.\n */\n storageKey?: string;\n /** Where the bar flies to when closed — the header control. */\n flyToSelector?: string;\n /** Light chips for a dark surface. */\n dark?: boolean;\n className?: string;\n}\n\nconst STORAGE_PREFIX = \"devic:apps-hint-dismissed:\";\n\n/** Reading storage throws in Safari's private mode and in sandboxed frames. */\nfunction wasDismissed(key?: string): boolean {\n if (!key) return false;\n try {\n return localStorage.getItem(STORAGE_PREFIX + key) === \"1\";\n } catch {\n return false;\n }\n}\n\nfunction rememberDismissal(key?: string): void {\n if (!key) return;\n try {\n localStorage.setItem(STORAGE_PREFIX + key, \"1\");\n } catch {\n // Then it comes back next session. Not worth a word to the user.\n }\n}\n\n/** Connected first, same order as the header control. */\nfunction order(integrations: Integration[]): Integration[] {\n return [...integrations].sort((a, b) => {\n if (a.connected !== b.connected) return a.connected ? -1 : 1;\n return 0;\n });\n}\n\n/**\n * How many 24px chips fit once the label and the close button are paid for.\n *\n * The label is the whole reason this row exists, so it gets its space first:\n * a strip reading \"Connect your …\" beside seven logos has lost the argument.\n * Never fewer than three chips, below which the row stops reading as a set of\n * apps at all.\n */\nfunction boxesThatFit(width: number, max: number): number {\n if (!width) return max + 1;\n const LABEL_AND_CLOSE = 195;\n return Math.max(3, Math.min(max + 1, Math.floor((width - LABEL_AND_CLOSE) / 30)));\n}\n\n/** Whether an element is on screen right now. */\nfunction isVisible(el: Element): boolean {\n const r = el.getBoundingClientRect();\n if (!r.width || !r.height) return false;\n return (\n r.bottom > 0 &&\n r.right > 0 &&\n r.top < window.innerHeight &&\n r.left < window.innerWidth\n );\n}\n\n/**\n * The header control this bar belongs to.\n *\n * Scoped to its own drawer first — a page can hold several, each with its own\n * header — and only then to the nearest visible one anywhere. The class name is\n * checked against both the drawer's own container and the legacy one, because\n * getting this wrong is silent: `closest` returns null, the search widens to the\n * whole document, and the copy flies to whichever control happens to be first\n * in the DOM.\n */\nfunction flyTarget(bar: Element, selector: string): HTMLElement | null {\n if (!selector) return null;\n\n const drawer = bar.closest(\".devic-chat-drawer, .devic-drawer\");\n const own = drawer?.querySelector(selector) as HTMLElement | null;\n if (own && isVisible(own)) return own;\n\n const barRect = bar.getBoundingClientRect();\n const candidates = [...document.querySelectorAll(selector)].filter(isVisible);\n if (!candidates.length) return null;\n\n // Nearest to the bar, so a page with several drawers still animates towards\n // the one the user is looking at.\n return candidates.reduce((best, el) => {\n const d = (e: Element) => {\n const r = e.getBoundingClientRect();\n return Math.hypot(r.left - barRect.left, r.top - barRect.top);\n };\n return d(el) < d(best) ? el : best;\n }) as HTMLElement;\n}\n\n/**\n * The strip above the composer that tells the end user their own apps can be\n * connected here.\n *\n * It exists because the header control is a row of small logos and nothing\n * else: discoverable once you know what it is, invisible until then. This says\n * it in words, once, and then gets out of the way for good — the dismissal is\n * remembered per end user, and closing it animates towards the header so that\n * what was dismissed is understood to still be there.\n */\nexport function IntegrationsHint({\n state,\n onOpen,\n label,\n maxLogos = 6,\n storageKey,\n flyToSelector = \".devic-int-launcher\",\n dark = false,\n className = \"\",\n}: IntegrationsHintProps): JSX.Element | null {\n const sorted = useMemo(() => order(state.integrations), [state.integrations]);\n const ref = useRef<HTMLDivElement>(null);\n const [boxes, setBoxes] = useState(maxLogos + 1);\n const [dismissed, setDismissed] = useState(() => wasDismissed(storageKey));\n const [leaving, setLeaving] = useState(false);\n\n // A different end user has their own answer to whether this was dismissed.\n useEffect(() => {\n setDismissed(wasDismissed(storageKey));\n setLeaving(false);\n }, [storageKey]);\n\n useEffect(() => {\n const el = ref.current;\n if (!el || typeof ResizeObserver === \"undefined\") return;\n const measure = () =>\n setBoxes(boxesThatFit(el.getBoundingClientRect().width, maxLogos));\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(el);\n return () => observer.disconnect();\n }, [maxLogos, state.offered, dismissed]);\n\n /**\n * Sends a copy of the logos from the bar to the header control.\n *\n * A dismissal that simply blanks the row reads as \"that is gone now\". The\n * flight is the sentence \"it moved up there\" said without words — so if it\n * cannot be drawn (reduced motion, no target, no Web Animations API), the bar\n * just closes and nothing is lost.\n */\n const flyToLauncher = useCallback(() => {\n const bar = ref.current;\n if (!bar || typeof document === \"undefined\") return;\n if (window.matchMedia?.(\"(prefers-reduced-motion: reduce)\").matches) return;\n\n const target = flyTarget(bar, flyToSelector);\n // Nothing to fly to, or nothing the user can see: the bar just closes.\n // A copy sailing off towards something 2000px down the page says the\n // opposite of what this animation is for.\n if (!target) return;\n\n const logos = bar.querySelector(\".devic-int-hint-logos\");\n const from = (logos ?? bar).getBoundingClientRect();\n const to = target.getBoundingClientRect();\n\n const ghost = (logos ?? bar).cloneNode(true) as HTMLElement;\n ghost.classList.add(\"devic-int-hint-ghost\");\n ghost.style.left = `${from.left}px`;\n ghost.style.top = `${from.top}px`;\n ghost.style.width = `${from.width}px`;\n ghost.style.height = `${from.height}px`;\n document.body.appendChild(ghost);\n\n const dx = to.left + to.width / 2 - (from.left + from.width / 2);\n const dy = to.top + to.height / 2 - (from.top + from.height / 2);\n const scale = from.width ? Math.max(0.4, to.width / from.width) : 0.6;\n\n const animation = ghost.animate?.(\n [\n { transform: \"translate(0, 0) scale(1)\", opacity: 0.95 },\n {\n transform: `translate(${dx}px, ${dy}px) scale(${scale})`,\n opacity: 0,\n },\n ],\n { duration: 420, easing: \"cubic-bezier(0.4, 0, 0.2, 1)\" }\n );\n\n const remove = () => ghost.remove();\n if (animation) animation.onfinish = remove;\n else remove();\n // Belt and braces: a tab backgrounded mid-flight never fires onfinish.\n window.setTimeout(remove, 1200);\n }, [flyToSelector]);\n\n const dismiss = () => {\n flyToLauncher();\n rememberDismissal(storageKey);\n setLeaving(true);\n window.setTimeout(() => setDismissed(true), 220);\n };\n\n if (dismissed || !state.offered || sorted.length === 0) return null;\n\n const text =\n label ??\n (sorted.some((i) => i.connected)\n ? \"Explore connected apps\"\n : \"Connect your apps\");\n\n // When some apps will not fit, the `+N` box takes one of the slots itself.\n const capacity = Math.max(1, boxes);\n const shown = sorted.slice(\n 0,\n sorted.length > capacity ? capacity - 1 : capacity\n );\n const extra = sorted.length - shown.length;\n\n return (\n <div\n ref={ref}\n className={`devic-int-hint ${className}`.trim()}\n data-dark={dark}\n data-leaving={leaving}\n >\n <button\n type=\"button\"\n className=\"devic-int-hint-main\"\n onClick={onOpen}\n >\n <span className=\"devic-int-hint-label\">{text}</span>\n <span className=\"devic-int-hint-logos\" aria-hidden=\"true\">\n {shown.map((integration) => (\n <span\n key={integration.app}\n className=\"devic-int-hint-item\"\n data-connected={integration.connected}\n >\n <IntegrationLogo\n integration={integration}\n className=\"devic-int-hint-logo\"\n />\n </span>\n ))}\n {extra > 0 && (\n <span className=\"devic-int-hint-item devic-int-hint-more\">\n +{extra}\n </span>\n )}\n </span>\n </button>\n <button\n type=\"button\"\n className=\"devic-int-hint-close\"\n onClick={dismiss}\n aria-label=\"Hide this\"\n title=\"Hide this. Your apps stay in the header.\"\n >\n ×\n </button>\n </div>\n );\n}\n\nexport default IntegrationsHint;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
|