cobrowse-agent-ui 1.3.1 → 1.4.0
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/cobrowse-agent-ui.css +1 -1
- package/dist/integrations.d.ts +7 -0
- package/dist/integrations.js +82 -69
- package/dist/integrations.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
.PlatformIcon-module__root__ogAvA{width:.9rem;height:.9rem;vertical-align:middle}.Device-module__root__UZx82{padding:6px;display:flex;align-items:center;position:relative;gap:12px}.Device-module__online__1AxAp .Device-module__deviceStatus__0yCZg{outline:2px solid #c7ea30}.Device-module__lastSeen__6lPw2{font-size:.85rem;color:#777
|
|
1
|
+
.PlatformIcon-module__root__ogAvA{width:.9rem;height:.9rem;vertical-align:middle}.Device-module__root__UZx82{padding:6px;display:flex;align-items:center;position:relative;gap:12px}.Device-module__online__1AxAp .Device-module__deviceStatus__0yCZg{outline:2px solid #c7ea30}.Device-module__lastSeen__6lPw2{font-size:.85rem;color:#777}.Device-module__deviceStatus__0yCZg{height:36px;width:36px;padding:4px;outline:2px solid rgba(4,13,60,.25);border-radius:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;background:transparent}.Device-module__platformIcon__Y-uEy{height:100%;width:auto;pointer-events:none;display:flex;align-items:center;justify-content:center;color:inherit}.Device-module__details__hiywz{display:flex;flex-direction:column;gap:2px;flex:1;color:inherit}.Session-module__root__cORao{appearance:none;border:none;background:none;padding:6px;display:flex;align-items:center;flex-wrap:wrap;gap:12px;text-align:start;font-family:inherit;line-height:inherit;outline:none}.Session-module__clickable__ZEtjv{cursor:pointer;width:100%}.Session-module__root__cORao:focus-visible{outline:2px solid #040d3c;outline-offset:2px}.Session-module__details__oye-t{flex:1;display:flex;flex-direction:column;gap:4px}.Session-module__subdetails__rorhH{display:flex;align-items:baseline;color:#777;gap:12px}.Session-module__recorded__aV5Ih{text-transform:uppercase;font-size:10px;margin-inline-start:3px;letter-spacing:.05rem;color:#0b1220;cursor:pointer}.Session-module__active__1c1v0{color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;background-color:#3cc56e;padding:1px 6px;border-radius:4px;display:inline-block}.Session-module__activated__g-IUA{white-space:nowrap}.Session-module__recorded__aV5Ih:before{content:"";width:8px;height:8px;margin-inline-end:4px;background:red;border-radius:100%;display:inline-block}.Session-module__duration__2WYUC{font-weight:700;font-size:12px;color:inherit}.SmartConnectButton-module__root__11QZi{appearance:none;border:none;display:inline-block;background:#f6f4f8;padding:12px 16px;cursor:not-allowed;border-radius:4px;font-weight:600;font-size:1rem;font-family:inherit;line-height:inherit;opacity:.6;transition:background .15s ease,color .15s ease,transform .12s ease,opacity .12s ease;outline:none}.SmartConnectButton-module__connectable__9zFuL{background:#040d3c;color:#fff;cursor:pointer;opacity:1}.SmartConnectButton-module__root__11QZi:focus-visible{outline:2px solid #040d3c;outline-offset:2px}.SmartConnectButton-module__root__11QZi:active.SmartConnectButton-module__connectable__9zFuL{transform:translateY(1px)}.RefreshButton-module__root__2r6Po{padding:4px;border:none;background:transparent;display:flex;align-items:center;justify-content:center;color:#6f7780;cursor:pointer}.RefreshButton-module__icon__ZMGzA{width:18px;height:18px;transition:transform .2s ease-out}.RefreshButton-module__icon__ZMGzA:hover{transform:rotate(25deg)}@keyframes Loader-module__spin__HaoIa{to{transform:rotate(360deg)}}.Loader-module__root__CuLMw{display:flex;justify-content:center}.Loader-module__icon__vaPyL{width:50px;height:50px;animation:Loader-module__spin__HaoIa 2s linear infinite;color:#040d3c}.CodeEntry-module__root__CEZCb{text-align:center;white-space:nowrap;display:inline-flex;align-items:center;gap:10px;border:none;margin:0;padding:0;min-inline-size:0}.CodeEntry-module__legend__GN0ge{padding:0;font-weight:700;display:contents}.CodeEntry-module__digits__aob60{display:inline-flex;align-items:center}.CodeEntry-module__input__Mp3LR{font-size:1rem;width:1.6rem;height:2rem;margin:.2rem;text-align:center;border-radius:4px;border:1px solid #dfe3f0;background:#fff;color:#0b1220;transition:border-color .12s ease,box-shadow .12s ease,transform .12s ease;appearance:textfield}.CodeEntry-module__input__Mp3LR:nth-of-type(3){margin-inline-end:.6rem}.CodeEntry-module__input__Mp3LR[type=number]::-webkit-outer-spin-button,.CodeEntry-module__input__Mp3LR[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}.CodeEntry-module__input__Mp3LR:focus{border-color:#040d3c;box-shadow:0 0 0 3px #040d3c29;outline:none}@keyframes CodeEntry-module__shake__0xLiW{10%,90%{transform:translate3d(-2px,0,0)}20%,80%{transform:translate3d(3px,0,0)}30%,50%,70%{transform:translate3d(-7px,0,0)}40%,60%{transform:translate3d(7px,0,0)}}.CodeEntry-module__invalid__0fo6R{animation:CodeEntry-module__shake__0xLiW .6s cubic-bezier(.16,.07,.19,.97) both;transform:translateZ(0)}.ExternalLink-module__root__7-WiY{position:absolute;right:10px;display:flex;align-items:center;gap:4px;text-decoration:none;color:var(--text-color-base)}.ExternalLink-module__root__7-WiY:hover{text-decoration:underline}.ExternalLink-module__root__7-WiY:visited{color:#0e0c26;color:var(--text-color-base)}.UserIcon-module__root__-NL30{color:#fff;display:inline-flex;align-items:center;justify-content:center;text-align:center;background-size:cover;background-position:center;padding:16px;border-radius:50%;width:1.5rem;height:1.5rem;border:1px solid #ddd;flex:0 0 auto;white-space:nowrap}.Tabs-module__root__vrPV-{--tab-text-color: #6f7780;--tab-active-color: #040d3c;--tab-border-color: #d7dce2;--tab-focus-outline-color: #040d3c;width:100%;display:flex;flex-direction:column;gap:10px;min-height:0;flex:1 1}.Tabs-module__header__ZVkH2{display:flex;align-items:center;border-bottom:1px solid var(--tab-border-color);gap:12px}.Tabs-module__tabList__thjbJ{display:flex;margin:0}.Tabs-module__tab__HyAQH{position:relative;margin-bottom:-1px;padding:10px;border:none;background:transparent;color:var(--tab-text-color);font-size:14px;font-weight:600;border-bottom:2px solid transparent;cursor:pointer;transition:color .3s,border .3s}.Tabs-module__tabHover__yC8x3{color:var(--tab-active-color)}.Tabs-module__tab__HyAQH:focus-visible{outline:2px solid var(--tab-focus-outline-color);outline-offset:2px}.Tabs-module__tabActive__4FIE-{color:var(--tab-active-color);border-bottom:2px solid var(--tab-active-color)}.Tabs-module__tabPanels__xvxyl{overflow-y:auto;flex:1 1;min-height:0;width:100%}.Tabs-module__refresh__MV7Wh{margin-inline-start:auto}.BlockingError-module__root__p05Os{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:10px;height:100%;text-align:center}.BlockingError-module__heading__XCJtI{font-size:1.5rem;font-weight:700}.BlockingError-module__message__1KWtP{font-size:1.2rem}
|
package/dist/integrations.d.ts
CHANGED
|
@@ -9,6 +9,13 @@ declare interface BasePanelProps {
|
|
|
9
9
|
loader?: ReactNode;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
+
export declare const BlockingError: ({ message, children }: BlockingErrorProps) => JSX.Element;
|
|
13
|
+
|
|
14
|
+
export declare interface BlockingErrorProps {
|
|
15
|
+
message?: string;
|
|
16
|
+
children?: ReactNode;
|
|
17
|
+
}
|
|
18
|
+
|
|
12
19
|
declare type DeviceData = Pick<Device, 'id' | 'online' | 'connectable' | 'last_active'> & {
|
|
13
20
|
device: DeviceInfo;
|
|
14
21
|
};
|
package/dist/integrations.js
CHANGED
|
@@ -1,90 +1,103 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import
|
|
3
|
-
import { TabGroup as
|
|
4
|
-
import { useTranslation as
|
|
5
|
-
import { L
|
|
6
|
-
const
|
|
7
|
-
const { t:
|
|
8
|
-
return
|
|
9
|
-
|
|
1
|
+
import { jsx as e, Fragment as N, jsxs as d } from "react/jsx-runtime";
|
|
2
|
+
import c from "clsx";
|
|
3
|
+
import { TabGroup as S, TabList as A, Tab as f, TabPanels as E, TabPanel as v } from "@headlessui/react";
|
|
4
|
+
import { useTranslation as m } from "react-i18next";
|
|
5
|
+
import { L as P, D, a as j, S as C, R as V } from "./index-CB-5iZZ3.js";
|
|
6
|
+
const w = ({ devices: t, onConnectClick: s, smartConnectButtonClassName: n, loader: l }) => {
|
|
7
|
+
const { t: o } = m();
|
|
8
|
+
return t === null ? /* @__PURE__ */ e(P, { children: l }) : t.length === 0 ? /* @__PURE__ */ e("p", { children: o("No devices") }) : /* @__PURE__ */ e(N, { children: t.map((a) => /* @__PURE__ */ e(D, { device: a, children: /* @__PURE__ */ e(
|
|
9
|
+
j,
|
|
10
10
|
{
|
|
11
|
-
device:
|
|
12
|
-
className:
|
|
13
|
-
onClick:
|
|
14
|
-
children:
|
|
11
|
+
device: a,
|
|
12
|
+
className: n,
|
|
13
|
+
onClick: s,
|
|
14
|
+
children: o("Connect")
|
|
15
15
|
}
|
|
16
|
-
) },
|
|
17
|
-
},
|
|
18
|
-
const { t:
|
|
19
|
-
return
|
|
20
|
-
},
|
|
21
|
-
root:
|
|
22
|
-
header:
|
|
23
|
-
tabList:
|
|
24
|
-
tab:
|
|
25
|
-
tabHover:
|
|
26
|
-
tabActive:
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
16
|
+
) }, a.id)) });
|
|
17
|
+
}, F = ({ sessions: t, onSessionClick: s, loader: n }) => {
|
|
18
|
+
const { t: l } = m();
|
|
19
|
+
return t === null ? /* @__PURE__ */ e(P, { children: n }) : t.length === 0 ? /* @__PURE__ */ e("p", { children: l("No sessions") }) : /* @__PURE__ */ e(N, { children: t.map((o, a) => /* @__PURE__ */ e(C, { session: o, onClick: s }, a)) });
|
|
20
|
+
}, I = "Tabs-module__root__vrPV-", J = "Tabs-module__header__ZVkH2", W = "Tabs-module__tabList__thjbJ", $ = "Tabs-module__tab__HyAQH", G = "Tabs-module__tabHover__yC8x3", K = "Tabs-module__tabActive__4FIE-", M = "Tabs-module__tabPanels__xvxyl", O = "Tabs-module__refresh__MV7Wh", r = {
|
|
21
|
+
root: I,
|
|
22
|
+
header: J,
|
|
23
|
+
tabList: W,
|
|
24
|
+
tab: $,
|
|
25
|
+
tabHover: G,
|
|
26
|
+
tabActive: K,
|
|
27
|
+
tabPanels: M,
|
|
28
|
+
refresh: O
|
|
29
|
+
}, ee = ({
|
|
30
|
+
devices: t,
|
|
31
|
+
sessions: s,
|
|
32
|
+
onConnectClick: n,
|
|
33
|
+
onSessionClick: l,
|
|
34
|
+
onRefreshClick: o,
|
|
35
|
+
smartConnectButtonClassName: a,
|
|
36
|
+
loader: h,
|
|
37
|
+
refresh: k,
|
|
37
38
|
className: x,
|
|
38
|
-
headerClassName:
|
|
39
|
-
tabListClassName:
|
|
40
|
-
tabClassName:
|
|
41
|
-
tabHoverClassName:
|
|
39
|
+
headerClassName: H,
|
|
40
|
+
tabListClassName: L,
|
|
41
|
+
tabClassName: u,
|
|
42
|
+
tabHoverClassName: g,
|
|
42
43
|
tabActiveClassName: T,
|
|
43
|
-
tabPanelsClassName:
|
|
44
|
-
refreshButtonClassName:
|
|
44
|
+
tabPanelsClassName: y,
|
|
45
|
+
refreshButtonClassName: B
|
|
45
46
|
}) => {
|
|
46
|
-
const { t:
|
|
47
|
-
return /* @__PURE__ */
|
|
48
|
-
/* @__PURE__ */
|
|
49
|
-
/* @__PURE__ */
|
|
50
|
-
/* @__PURE__ */
|
|
51
|
-
|
|
47
|
+
const { t: p } = m();
|
|
48
|
+
return /* @__PURE__ */ d(S, { className: c(r.root, x), children: [
|
|
49
|
+
/* @__PURE__ */ d("div", { className: c(r.header, H), children: [
|
|
50
|
+
/* @__PURE__ */ d(A, { className: c(r.tabList, L), children: [
|
|
51
|
+
/* @__PURE__ */ e(
|
|
52
|
+
f,
|
|
52
53
|
{
|
|
53
|
-
className: ({ selected:
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
54
|
+
className: ({ selected: i, hover: _ }) => c(
|
|
55
|
+
r.tab,
|
|
56
|
+
u,
|
|
57
|
+
_ && r.tabHover,
|
|
58
|
+
_ && g,
|
|
59
|
+
i && r.tabActive,
|
|
60
|
+
i && T
|
|
60
61
|
),
|
|
61
|
-
children:
|
|
62
|
+
children: p("Devices")
|
|
62
63
|
}
|
|
63
64
|
),
|
|
64
|
-
/* @__PURE__ */
|
|
65
|
-
|
|
65
|
+
/* @__PURE__ */ e(
|
|
66
|
+
f,
|
|
66
67
|
{
|
|
67
|
-
className: ({ selected:
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
68
|
+
className: ({ selected: i, hover: _ }) => c(
|
|
69
|
+
r.tab,
|
|
70
|
+
u,
|
|
71
|
+
_ && r.tabHover,
|
|
72
|
+
_ && g,
|
|
73
|
+
i && r.tabActive,
|
|
74
|
+
i && T
|
|
74
75
|
),
|
|
75
|
-
children:
|
|
76
|
+
children: p("Sessions")
|
|
76
77
|
}
|
|
77
78
|
)
|
|
78
79
|
] }),
|
|
79
|
-
|
|
80
|
+
o && /* @__PURE__ */ e(V, { className: c(r.refresh, B), onClick: o, children: k })
|
|
80
81
|
] }),
|
|
81
|
-
/* @__PURE__ */
|
|
82
|
-
/* @__PURE__ */
|
|
83
|
-
/* @__PURE__ */
|
|
82
|
+
/* @__PURE__ */ d(E, { className: c(r.tabPanels, y), children: [
|
|
83
|
+
/* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(w, { devices: t, onConnectClick: n, smartConnectButtonClassName: a, loader: h }) }),
|
|
84
|
+
/* @__PURE__ */ e(v, { children: /* @__PURE__ */ e(F, { sessions: s, onSessionClick: l, loader: h }) })
|
|
84
85
|
] })
|
|
85
86
|
] });
|
|
87
|
+
}, Q = "BlockingError-module__root__p05Os", R = "BlockingError-module__heading__XCJtI", X = "BlockingError-module__message__1KWtP", b = {
|
|
88
|
+
root: Q,
|
|
89
|
+
heading: R,
|
|
90
|
+
message: X
|
|
91
|
+
}, te = ({ message: t, children: s }) => {
|
|
92
|
+
const { t: n } = m();
|
|
93
|
+
return /* @__PURE__ */ d("div", { className: b.root, children: [
|
|
94
|
+
/* @__PURE__ */ e("p", { className: b.heading, children: n("Sorry, something went wrong.") }),
|
|
95
|
+
t && /* @__PURE__ */ e("p", { className: b.message, children: t }),
|
|
96
|
+
s
|
|
97
|
+
] });
|
|
86
98
|
};
|
|
87
99
|
export {
|
|
88
|
-
|
|
100
|
+
te as BlockingError,
|
|
101
|
+
ee as Tabs
|
|
89
102
|
};
|
|
90
103
|
//# sourceMappingURL=integrations.js.map
|
package/dist/integrations.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"integrations.js","sources":["../lib/integrations/components/Tabs/DevicesPanel.tsx","../lib/integrations/components/Tabs/SessionsPanel.tsx","../lib/integrations/components/Tabs/index.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport Device, { type DeviceData } from '@/components/Device'\nimport SmartConnectButton from '@/components/SmartConnectButton'\nimport Loader from '@/components/Loader'\nimport type { BasePanelProps } from './BasePanel'\n\nexport interface DevicesPanelProps<T extends DeviceData = DeviceData> extends BasePanelProps {\n devices: T[] | null\n onConnectClick?: (device: T) => void\n smartConnectButtonClassName?: string\n}\n\nconst DevicesPanel = <T extends DeviceData = DeviceData>({ devices, onConnectClick, smartConnectButtonClassName, loader }: DevicesPanelProps<T>) => {\n const { t } = useTranslation()\n\n if (devices === null) {\n return (\n <Loader>{loader}</Loader>\n )\n }\n\n if (devices.length === 0) {\n return <p>{t('No devices')}</p>\n }\n\n return (\n <>\n {devices.map((device) => (\n <Device key={device.id} device={device}>\n <SmartConnectButton\n device={device}\n className={smartConnectButtonClassName}\n onClick={onConnectClick}\n >\n {t('Connect')}\n </SmartConnectButton>\n </Device>\n ))}\n </>\n )\n}\n\nexport default DevicesPanel\n","import { useTranslation } from 'react-i18next'\nimport Session, { type SessionData } from '@/components/Session'\nimport Loader from '@/components/Loader'\nimport type { BasePanelProps } from './BasePanel'\n\nexport interface SessionsPanelProps<T extends SessionData = SessionData> extends BasePanelProps {\n sessions: T[] | null\n onSessionClick?: (session: T) => void\n}\n\nconst SessionsPanel = <T extends SessionData = SessionData>({ sessions, onSessionClick, loader }: SessionsPanelProps<T>) => {\n const { t } = useTranslation()\n\n if (sessions === null) {\n return (\n <Loader>{loader}</Loader>\n )\n }\n\n if (sessions.length === 0) {\n return <p>{t('No sessions')}</p>\n }\n\n return (\n <>\n {sessions.map((session, index) => (\n <Session key={index} session={session} onClick={onSessionClick} />\n ))}\n </>\n )\n}\n\nexport default SessionsPanel\n","import clsx from 'clsx'\nimport type { ReactNode } from 'react'\nimport {\n Tab as HeadlessTab,\n TabGroup as HeadlessTabGroup,\n TabList as HeadlessTabList,\n TabPanels as HeadlessTabPanels,\n TabPanel as HeadlessTabPanel\n} from '@headlessui/react'\nimport { useTranslation } from 'react-i18next'\nimport DevicesPanel, { type DevicesPanelProps } from './DevicesPanel'\nimport SessionsPanel, { type SessionsPanelProps } from './SessionsPanel'\nimport type { DeviceData } from '@/components/Device'\nimport type { SessionData } from '@/components/Session'\nimport RefreshButton, { type RefreshButtonProps } from '@/components/RefreshButton'\nimport styles from './Tabs.module.css'\n\ninterface TabsPanelProps<TDevice extends DeviceData, TSession extends SessionData>\n extends Pick<DevicesPanelProps<TDevice>, 'devices' | 'onConnectClick' | 'smartConnectButtonClassName' | 'loader'>,\n Pick<SessionsPanelProps<TSession>, 'sessions' | 'onSessionClick' | 'loader'> {}\n\nexport interface TabsProps<TDevice extends DeviceData = DeviceData, TSession extends SessionData = SessionData>\n extends TabsPanelProps<TDevice, TSession> {\n onRefreshClick?: RefreshButtonProps['onClick']\n refresh?: ReactNode\n className?: string\n headerClassName?: string\n tabListClassName?: string\n tabClassName?: string\n tabHoverClassName?: string\n tabActiveClassName?: string\n tabPanelsClassName?: string\n refreshButtonClassName?: string\n}\n\nconst Tabs = <TDevice extends DeviceData = DeviceData, TSession extends SessionData = SessionData>({\n devices,\n sessions,\n onConnectClick,\n onSessionClick,\n onRefreshClick,\n smartConnectButtonClassName,\n loader,\n refresh,\n className,\n headerClassName,\n tabListClassName,\n tabClassName,\n tabHoverClassName,\n tabActiveClassName,\n tabPanelsClassName,\n refreshButtonClassName\n}: TabsProps<TDevice, TSession>) => {\n const { t } = useTranslation()\n\n return (\n <HeadlessTabGroup className={clsx(styles.root, className)}>\n <div className={clsx(styles.header, headerClassName)}>\n <HeadlessTabList className={clsx(styles.tabList, tabListClassName)}>\n <HeadlessTab\n className={({ selected, hover }) =>\n clsx(\n styles.tab,\n tabClassName,\n hover && styles.tabHover,\n hover && tabHoverClassName,\n selected && styles.tabActive,\n selected && tabActiveClassName\n )\n }\n >\n {t('Devices')}\n </HeadlessTab>\n <HeadlessTab\n className={({ selected, hover }) =>\n clsx(\n styles.tab,\n tabClassName,\n hover && styles.tabHover,\n hover && tabHoverClassName,\n selected && styles.tabActive,\n selected && tabActiveClassName\n )\n }\n >\n {t('Sessions')}\n </HeadlessTab>\n </HeadlessTabList>\n {onRefreshClick && (\n <RefreshButton className={clsx(styles.refresh, refreshButtonClassName)} onClick={onRefreshClick}>{refresh}</RefreshButton>\n )}\n </div>\n <HeadlessTabPanels className={tabPanelsClassName}>\n <HeadlessTabPanel>\n <DevicesPanel devices={devices} onConnectClick={onConnectClick} smartConnectButtonClassName={smartConnectButtonClassName} loader={loader} />\n </HeadlessTabPanel>\n <HeadlessTabPanel>\n <SessionsPanel sessions={sessions} onSessionClick={onSessionClick} loader={loader} />\n </HeadlessTabPanel>\n </HeadlessTabPanels>\n </HeadlessTabGroup>\n )\n}\n\nexport default Tabs\n"],"names":["DevicesPanel","devices","onConnectClick","smartConnectButtonClassName","loader","t","useTranslation","jsx","Loader","device","Device","SmartConnectButton","SessionsPanel","sessions","onSessionClick","Fragment","session","index","Session","Tabs","onRefreshClick","refresh","className","headerClassName","tabListClassName","tabClassName","tabHoverClassName","tabActiveClassName","tabPanelsClassName","refreshButtonClassName","HeadlessTabGroup","clsx","styles","jsxs","HeadlessTabList","HeadlessTab","selected","hover","RefreshButton","HeadlessTabPanels","HeadlessTabPanel"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"integrations.js","sources":["../lib/integrations/components/Tabs/DevicesPanel.tsx","../lib/integrations/components/Tabs/SessionsPanel.tsx","../lib/integrations/components/Tabs/index.tsx","../lib/integrations/components/BlockingError/index.tsx"],"sourcesContent":["import { useTranslation } from 'react-i18next'\nimport Device, { type DeviceData } from '@/components/Device'\nimport SmartConnectButton from '@/components/SmartConnectButton'\nimport Loader from '@/components/Loader'\nimport type { BasePanelProps } from './BasePanel'\n\nexport interface DevicesPanelProps<T extends DeviceData = DeviceData> extends BasePanelProps {\n devices: T[] | null\n onConnectClick?: (device: T) => void\n smartConnectButtonClassName?: string\n}\n\nconst DevicesPanel = <T extends DeviceData = DeviceData>({ devices, onConnectClick, smartConnectButtonClassName, loader }: DevicesPanelProps<T>) => {\n const { t } = useTranslation()\n\n if (devices === null) {\n return (\n <Loader>{loader}</Loader>\n )\n }\n\n if (devices.length === 0) {\n return <p>{t('No devices')}</p>\n }\n\n return (\n <>\n {devices.map((device) => (\n <Device key={device.id} device={device}>\n <SmartConnectButton\n device={device}\n className={smartConnectButtonClassName}\n onClick={onConnectClick}\n >\n {t('Connect')}\n </SmartConnectButton>\n </Device>\n ))}\n </>\n )\n}\n\nexport default DevicesPanel\n","import { useTranslation } from 'react-i18next'\nimport Session, { type SessionData } from '@/components/Session'\nimport Loader from '@/components/Loader'\nimport type { BasePanelProps } from './BasePanel'\n\nexport interface SessionsPanelProps<T extends SessionData = SessionData> extends BasePanelProps {\n sessions: T[] | null\n onSessionClick?: (session: T) => void\n}\n\nconst SessionsPanel = <T extends SessionData = SessionData>({ sessions, onSessionClick, loader }: SessionsPanelProps<T>) => {\n const { t } = useTranslation()\n\n if (sessions === null) {\n return (\n <Loader>{loader}</Loader>\n )\n }\n\n if (sessions.length === 0) {\n return <p>{t('No sessions')}</p>\n }\n\n return (\n <>\n {sessions.map((session, index) => (\n <Session key={index} session={session} onClick={onSessionClick} />\n ))}\n </>\n )\n}\n\nexport default SessionsPanel\n","import clsx from 'clsx'\nimport type { ReactNode } from 'react'\nimport {\n Tab as HeadlessTab,\n TabGroup as HeadlessTabGroup,\n TabList as HeadlessTabList,\n TabPanels as HeadlessTabPanels,\n TabPanel as HeadlessTabPanel\n} from '@headlessui/react'\nimport { useTranslation } from 'react-i18next'\nimport DevicesPanel, { type DevicesPanelProps } from './DevicesPanel'\nimport SessionsPanel, { type SessionsPanelProps } from './SessionsPanel'\nimport type { DeviceData } from '@/components/Device'\nimport type { SessionData } from '@/components/Session'\nimport RefreshButton, { type RefreshButtonProps } from '@/components/RefreshButton'\nimport styles from './Tabs.module.css'\n\ninterface TabsPanelProps<TDevice extends DeviceData, TSession extends SessionData>\n extends Pick<DevicesPanelProps<TDevice>, 'devices' | 'onConnectClick' | 'smartConnectButtonClassName' | 'loader'>,\n Pick<SessionsPanelProps<TSession>, 'sessions' | 'onSessionClick' | 'loader'> {}\n\nexport interface TabsProps<TDevice extends DeviceData = DeviceData, TSession extends SessionData = SessionData>\n extends TabsPanelProps<TDevice, TSession> {\n onRefreshClick?: RefreshButtonProps['onClick']\n refresh?: ReactNode\n className?: string\n headerClassName?: string\n tabListClassName?: string\n tabClassName?: string\n tabHoverClassName?: string\n tabActiveClassName?: string\n tabPanelsClassName?: string\n refreshButtonClassName?: string\n}\n\nconst Tabs = <TDevice extends DeviceData = DeviceData, TSession extends SessionData = SessionData>({\n devices,\n sessions,\n onConnectClick,\n onSessionClick,\n onRefreshClick,\n smartConnectButtonClassName,\n loader,\n refresh,\n className,\n headerClassName,\n tabListClassName,\n tabClassName,\n tabHoverClassName,\n tabActiveClassName,\n tabPanelsClassName,\n refreshButtonClassName\n}: TabsProps<TDevice, TSession>) => {\n const { t } = useTranslation()\n\n return (\n <HeadlessTabGroup className={clsx(styles.root, className)}>\n <div className={clsx(styles.header, headerClassName)}>\n <HeadlessTabList className={clsx(styles.tabList, tabListClassName)}>\n <HeadlessTab\n className={({ selected, hover }) =>\n clsx(\n styles.tab,\n tabClassName,\n hover && styles.tabHover,\n hover && tabHoverClassName,\n selected && styles.tabActive,\n selected && tabActiveClassName\n )\n }\n >\n {t('Devices')}\n </HeadlessTab>\n <HeadlessTab\n className={({ selected, hover }) =>\n clsx(\n styles.tab,\n tabClassName,\n hover && styles.tabHover,\n hover && tabHoverClassName,\n selected && styles.tabActive,\n selected && tabActiveClassName\n )\n }\n >\n {t('Sessions')}\n </HeadlessTab>\n </HeadlessTabList>\n {onRefreshClick && (\n <RefreshButton className={clsx(styles.refresh, refreshButtonClassName)} onClick={onRefreshClick}>{refresh}</RefreshButton>\n )}\n </div>\n <HeadlessTabPanels className={clsx(styles.tabPanels, tabPanelsClassName)}>\n <HeadlessTabPanel>\n <DevicesPanel devices={devices} onConnectClick={onConnectClick} smartConnectButtonClassName={smartConnectButtonClassName} loader={loader} />\n </HeadlessTabPanel>\n <HeadlessTabPanel>\n <SessionsPanel sessions={sessions} onSessionClick={onSessionClick} loader={loader} />\n </HeadlessTabPanel>\n </HeadlessTabPanels>\n </HeadlessTabGroup>\n )\n}\n\nexport default Tabs\n","import type { ReactNode } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport styles from './BlockingError.module.css'\n\nexport interface BlockingErrorProps {\n message?: string\n children?: ReactNode\n}\n\nconst BlockingError = ({ message, children }: BlockingErrorProps) => {\n const { t } = useTranslation()\n\n return (\n <div className={styles.root}>\n <p className={styles.heading}>{t('Sorry, something went wrong.')}</p>\n {message && <p className={styles.message}>{message}</p>}\n {children}\n </div>\n )\n}\n\nexport default BlockingError\n"],"names":["DevicesPanel","devices","onConnectClick","smartConnectButtonClassName","loader","t","useTranslation","jsx","Loader","device","Device","SmartConnectButton","SessionsPanel","sessions","onSessionClick","Fragment","session","index","Session","Tabs","onRefreshClick","refresh","className","headerClassName","tabListClassName","tabClassName","tabHoverClassName","tabActiveClassName","tabPanelsClassName","refreshButtonClassName","HeadlessTabGroup","clsx","styles","jsxs","HeadlessTabList","HeadlessTab","selected","hover","RefreshButton","HeadlessTabPanels","HeadlessTabPanel","BlockingError","message","children"],"mappings":"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"}
|