@dxos/plugin-status-bar 0.8.1-staging.5be625a → 0.8.1-staging.9eaf14f
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/lib/browser/index.mjs +86 -205
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node/index.cjs +85 -205
- package/dist/lib/node/index.cjs.map +4 -4
- package/dist/lib/node/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +86 -205
- package/dist/lib/node-esm/index.mjs.map +4 -4
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/components/StatusBarPanel.d.ts.map +1 -1
- package/dist/types/src/components/index.d.ts +0 -1
- package/dist/types/src/components/index.d.ts.map +1 -1
- package/dist/types/src/translations.d.ts +1 -1
- package/dist/types/src/translations.d.ts.map +1 -1
- package/package.json +13 -13
- package/src/components/StatusBarPanel.tsx +8 -25
- package/src/components/index.ts +0 -1
- package/src/translations.ts +4 -14
- package/dist/types/src/components/FeedbackForm.d.ts +0 -6
- package/dist/types/src/components/FeedbackForm.d.ts.map +0 -1
- package/src/components/FeedbackForm.tsx +0 -117
|
@@ -1,181 +1,38 @@
|
|
|
1
1
|
import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
|
|
2
2
|
|
|
3
|
-
// packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx
|
|
4
|
-
import { PaperPlaneTilt, X } from "@phosphor-icons/react";
|
|
5
|
-
import React, { useRef } from "react";
|
|
6
|
-
import { getSnapshot } from "@dxos/echo-schema";
|
|
7
|
-
import { UserFeedback } from "@dxos/plugin-observability/types";
|
|
8
|
-
import { Button, Input, Popover, useTranslation } from "@dxos/react-ui";
|
|
9
|
-
import { FormProvider, useFormContext, useInputProps } from "@dxos/react-ui-form";
|
|
10
|
-
import { getSize } from "@dxos/react-ui-theme";
|
|
11
|
-
|
|
12
|
-
// packages/plugins/plugin-status-bar/src/meta.ts
|
|
13
|
-
var STATUS_BAR_PLUGIN = "dxos.org/plugin/status-bar";
|
|
14
|
-
var meta = {
|
|
15
|
-
id: STATUS_BAR_PLUGIN,
|
|
16
|
-
name: "Status Bar",
|
|
17
|
-
description: "Display a bar with status and actions.",
|
|
18
|
-
icon: "ph--info--regular"
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
// packages/plugins/plugin-status-bar/src/translations.ts
|
|
22
|
-
var entry = (translation) => ({
|
|
23
|
-
[STATUS_BAR_PLUGIN]: translation
|
|
24
|
-
});
|
|
25
|
-
var mkTranslation = (t) => (key) => t(key);
|
|
26
|
-
var translations = {
|
|
27
|
-
"en-US": entry({
|
|
28
|
-
"plugin name": "Status Bar",
|
|
29
|
-
"name label": "Name",
|
|
30
|
-
"name placeholder": "Preferred name",
|
|
31
|
-
"email input label": "Email",
|
|
32
|
-
"email input placeholder": "hello@example.com",
|
|
33
|
-
"feedback text area label": "Feedback",
|
|
34
|
-
"feedback text area placeholder": "Please describe your issue or suggestion.",
|
|
35
|
-
"send feedback label": "Send Feedback",
|
|
36
|
-
"warning title": "WARNING",
|
|
37
|
-
"technology preview message": "Composer is currently in beta.",
|
|
38
|
-
"learn more label": "Learn more",
|
|
39
|
-
"released message": "This version released {{released}}.",
|
|
40
|
-
"see release label": "See release on GitHub",
|
|
41
|
-
"powered by dxos message": "Powered by <dxos>DXOS</dxos>",
|
|
42
|
-
"discord label": "Discord",
|
|
43
|
-
"feedback label": "Feedback"
|
|
44
|
-
})
|
|
45
|
-
};
|
|
46
|
-
var translations_default = [
|
|
47
|
-
translations
|
|
48
|
-
];
|
|
49
|
-
|
|
50
|
-
// packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx
|
|
51
|
-
var defaultValues = {
|
|
52
|
-
name: "",
|
|
53
|
-
email: "",
|
|
54
|
-
message: ""
|
|
55
|
-
};
|
|
56
|
-
var FormContent = () => {
|
|
57
|
-
const { t } = useTranslation(STATUS_BAR_PLUGIN);
|
|
58
|
-
const translation = mkTranslation(t);
|
|
59
|
-
const { handleSave, canSave } = useFormContext();
|
|
60
|
-
const nameProps = useInputProps([
|
|
61
|
-
"name"
|
|
62
|
-
]);
|
|
63
|
-
const emailProps = useInputProps([
|
|
64
|
-
"email"
|
|
65
|
-
]);
|
|
66
|
-
const messageProps = useInputProps([
|
|
67
|
-
"message"
|
|
68
|
-
]);
|
|
69
|
-
return /* @__PURE__ */ React.createElement("div", {
|
|
70
|
-
role: "form",
|
|
71
|
-
className: "p-3 flex flex-col gap-2"
|
|
72
|
-
}, /* @__PURE__ */ React.createElement("div", {
|
|
73
|
-
role: "none",
|
|
74
|
-
className: "space-b-1"
|
|
75
|
-
}, /* @__PURE__ */ React.createElement(Input.Root, {
|
|
76
|
-
validationValence: nameProps.getStatus().status
|
|
77
|
-
}, /* @__PURE__ */ React.createElement(Input.Label, null, translation("name label")), /* @__PURE__ */ React.createElement(Input.TextInput, {
|
|
78
|
-
classNames: "text-sm",
|
|
79
|
-
placeholder: translation("name placeholder"),
|
|
80
|
-
autoFocus: true,
|
|
81
|
-
value: nameProps.getValue() ?? "",
|
|
82
|
-
onChange: (e) => nameProps.onValueChange("string", e.target.value),
|
|
83
|
-
onBlur: nameProps.onBlur
|
|
84
|
-
}), /* @__PURE__ */ React.createElement(Input.DescriptionAndValidation, null, /* @__PURE__ */ React.createElement(Input.Validation, null, nameProps.getStatus().error)))), /* @__PURE__ */ React.createElement("div", {
|
|
85
|
-
role: "none",
|
|
86
|
-
className: "space-b-1"
|
|
87
|
-
}, /* @__PURE__ */ React.createElement(Input.Root, {
|
|
88
|
-
validationValence: emailProps.getStatus().status
|
|
89
|
-
}, /* @__PURE__ */ React.createElement(Input.Label, null, translation("email input label")), /* @__PURE__ */ React.createElement(Input.TextInput, {
|
|
90
|
-
classNames: "text-sm",
|
|
91
|
-
placeholder: translation("email input placeholder"),
|
|
92
|
-
value: emailProps.getValue() ?? "",
|
|
93
|
-
onChange: (e) => emailProps.onValueChange("string", e.target.value),
|
|
94
|
-
onBlur: emailProps.onBlur
|
|
95
|
-
}), /* @__PURE__ */ React.createElement(Input.DescriptionAndValidation, null, /* @__PURE__ */ React.createElement(Input.Validation, null, emailProps.getStatus().error)))), /* @__PURE__ */ React.createElement("div", {
|
|
96
|
-
role: "none",
|
|
97
|
-
className: "space-b-1"
|
|
98
|
-
}, /* @__PURE__ */ React.createElement(Input.Root, {
|
|
99
|
-
validationValence: messageProps.getStatus().status
|
|
100
|
-
}, /* @__PURE__ */ React.createElement(Input.Label, null, translation("feedback text area label")), /* @__PURE__ */ React.createElement(Input.TextArea, {
|
|
101
|
-
classNames: "text-sm",
|
|
102
|
-
rows: 5,
|
|
103
|
-
cols: 30,
|
|
104
|
-
placeholder: translation("feedback text area placeholder"),
|
|
105
|
-
value: messageProps.getValue() ?? "",
|
|
106
|
-
onChange: (e) => messageProps.onValueChange("string", e.target.value),
|
|
107
|
-
onBlur: messageProps.onBlur
|
|
108
|
-
}), /* @__PURE__ */ React.createElement(Input.DescriptionAndValidation, null, /* @__PURE__ */ React.createElement(Input.Validation, null, messageProps.getStatus().error)))), /* @__PURE__ */ React.createElement("div", {
|
|
109
|
-
role: "none",
|
|
110
|
-
className: "space-b-2"
|
|
111
|
-
}, /* @__PURE__ */ React.createElement(Button, {
|
|
112
|
-
type: "submit",
|
|
113
|
-
variant: "primary",
|
|
114
|
-
classNames: "is-full flex gap-2",
|
|
115
|
-
disabled: !canSave,
|
|
116
|
-
onClick: handleSave
|
|
117
|
-
}, /* @__PURE__ */ React.createElement("span", null, translation("send feedback label")), /* @__PURE__ */ React.createElement("div", {
|
|
118
|
-
className: "grow"
|
|
119
|
-
}), /* @__PURE__ */ React.createElement(PaperPlaneTilt, {
|
|
120
|
-
className: getSize(5)
|
|
121
|
-
})), /* @__PURE__ */ React.createElement(Popover.Close, {
|
|
122
|
-
asChild: true
|
|
123
|
-
}, /* @__PURE__ */ React.createElement(Button, {
|
|
124
|
-
classNames: "is-full flex gap-2"
|
|
125
|
-
}, /* @__PURE__ */ React.createElement("span", null, t("cancel label", {
|
|
126
|
-
ns: "os"
|
|
127
|
-
})), /* @__PURE__ */ React.createElement("div", {
|
|
128
|
-
className: "grow"
|
|
129
|
-
}), /* @__PURE__ */ React.createElement(X, {
|
|
130
|
-
className: getSize(5)
|
|
131
|
-
})))));
|
|
132
|
-
};
|
|
133
|
-
var FeedbackForm = ({ onSave }) => {
|
|
134
|
-
const formRef = useRef(null);
|
|
135
|
-
const initialValues = getSnapshot(defaultValues);
|
|
136
|
-
return /* @__PURE__ */ React.createElement(FormProvider, {
|
|
137
|
-
formRef,
|
|
138
|
-
schema: UserFeedback,
|
|
139
|
-
initialValues,
|
|
140
|
-
onSave
|
|
141
|
-
}, /* @__PURE__ */ React.createElement("div", {
|
|
142
|
-
ref: formRef
|
|
143
|
-
}, /* @__PURE__ */ React.createElement(FormContent, null)));
|
|
144
|
-
};
|
|
145
|
-
|
|
146
3
|
// packages/plugins/plugin-status-bar/src/components/StatusBar.tsx
|
|
147
4
|
import { Slot } from "@radix-ui/react-slot";
|
|
148
|
-
import
|
|
5
|
+
import React, { forwardRef } from "react";
|
|
149
6
|
import { mx } from "@dxos/react-ui-theme";
|
|
150
|
-
var StatusBarText = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => /* @__PURE__ */
|
|
7
|
+
var StatusBarText = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => /* @__PURE__ */ React.createElement("span", {
|
|
151
8
|
className: mx(classNames),
|
|
152
9
|
ref: forwardedRef
|
|
153
10
|
}, children));
|
|
154
11
|
var StatusBarButton = /* @__PURE__ */ forwardRef(({ classNames, children, asChild, ...props }, forwardedRef) => {
|
|
155
12
|
const classes = mx("flex items-center justify-center gap-2 p-1 px-2 rounded-sm", "select-none cursor-pointer dx-focus-ring text-description text-xs", "hover:bg-neutral-75 active:bg-neutral-150 dark:hover:bg-neutral-750 dark:active:bg-neutral-700", classNames);
|
|
156
|
-
return asChild ? /* @__PURE__ */
|
|
13
|
+
return asChild ? /* @__PURE__ */ React.createElement(Slot, {
|
|
157
14
|
role: "button",
|
|
158
15
|
ref: forwardedRef,
|
|
159
16
|
className: classes,
|
|
160
17
|
...props
|
|
161
|
-
}, children) : /* @__PURE__ */
|
|
18
|
+
}, children) : /* @__PURE__ */ React.createElement("button", {
|
|
162
19
|
className: classes,
|
|
163
20
|
ref: forwardedRef,
|
|
164
21
|
...props
|
|
165
22
|
}, children);
|
|
166
23
|
});
|
|
167
|
-
var StatusBarItem = /* @__PURE__ */ forwardRef(({ classNames, children, ...props }, forwardedRef) => /* @__PURE__ */
|
|
24
|
+
var StatusBarItem = /* @__PURE__ */ forwardRef(({ classNames, children, ...props }, forwardedRef) => /* @__PURE__ */ React.createElement("div", {
|
|
168
25
|
role: "menuitem",
|
|
169
26
|
className: mx("flex items-center justify-center gap-2 p-1 px-2 rounded-sm select-none", classNames),
|
|
170
27
|
ref: forwardedRef,
|
|
171
28
|
...props
|
|
172
29
|
}, children));
|
|
173
|
-
var StartContent = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => /* @__PURE__ */
|
|
30
|
+
var StartContent = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => /* @__PURE__ */ React.createElement("div", {
|
|
174
31
|
role: "none",
|
|
175
32
|
className: mx("flex-grow flex items-center space-x-2", classNames),
|
|
176
33
|
ref: forwardedRef
|
|
177
34
|
}, children));
|
|
178
|
-
var EndContent = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => /* @__PURE__ */
|
|
35
|
+
var EndContent = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => /* @__PURE__ */ React.createElement("div", {
|
|
179
36
|
role: "none",
|
|
180
37
|
className: mx("flex-grow flex items-center justify-end", classNames),
|
|
181
38
|
ref: forwardedRef
|
|
@@ -189,130 +46,155 @@ var StatusBar = {
|
|
|
189
46
|
};
|
|
190
47
|
|
|
191
48
|
// packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx
|
|
192
|
-
import
|
|
193
|
-
import {
|
|
194
|
-
import {
|
|
195
|
-
import { Icon as Icon2, Popover as Popover3, useTranslation as useTranslation3 } from "@dxos/react-ui";
|
|
49
|
+
import React3, { useState } from "react";
|
|
50
|
+
import { Surface } from "@dxos/app-framework";
|
|
51
|
+
import { Icon as Icon2, Popover as Popover2, useTranslation as useTranslation2 } from "@dxos/react-ui";
|
|
196
52
|
|
|
197
53
|
// packages/plugins/plugin-status-bar/src/components/VersionNumber.tsx
|
|
198
54
|
import { formatDistance } from "date-fns/formatDistance";
|
|
199
|
-
import
|
|
55
|
+
import React2 from "react";
|
|
200
56
|
import { useConfig } from "@dxos/react-client";
|
|
201
|
-
import { Link, Message, Popover
|
|
57
|
+
import { Link, Message, Popover, Trans, useTranslation, Icon } from "@dxos/react-ui";
|
|
58
|
+
|
|
59
|
+
// packages/plugins/plugin-status-bar/src/meta.ts
|
|
60
|
+
var STATUS_BAR_PLUGIN = "dxos.org/plugin/status-bar";
|
|
61
|
+
var meta = {
|
|
62
|
+
id: STATUS_BAR_PLUGIN,
|
|
63
|
+
name: "Status Bar",
|
|
64
|
+
description: "Display a bar with status and actions.",
|
|
65
|
+
icon: "ph--info--regular"
|
|
66
|
+
};
|
|
67
|
+
|
|
68
|
+
// packages/plugins/plugin-status-bar/src/components/VersionNumber.tsx
|
|
202
69
|
var repo = "https://github.com/dxos/dxos";
|
|
203
70
|
var VERSION_REGEX = /([\d.]+)/;
|
|
204
71
|
var VersionNumber = () => {
|
|
205
72
|
const config = useConfig();
|
|
206
|
-
const { t } =
|
|
73
|
+
const { t } = useTranslation(STATUS_BAR_PLUGIN);
|
|
207
74
|
const { version, timestamp, commitHash } = config.values.runtime?.app?.build ?? {};
|
|
208
75
|
const [_, v] = version?.match(VERSION_REGEX) ?? [];
|
|
209
76
|
const isLabs = config.values.runtime?.app?.env?.DX_LABS;
|
|
210
77
|
const releaseUrl = config.values.runtime?.app?.env?.DX_ENVIRONMENT === "production" ? `${repo}/releases/tag/v${version}` : `${repo}/commit/${commitHash}`;
|
|
211
78
|
const previewUrl = "https://docs.dxos.org/composer#technology-preview";
|
|
212
|
-
return /* @__PURE__ */
|
|
79
|
+
return /* @__PURE__ */ React2.createElement(Popover.Root, null, /* @__PURE__ */ React2.createElement(Popover.Trigger, {
|
|
213
80
|
asChild: true
|
|
214
|
-
}, /* @__PURE__ */
|
|
81
|
+
}, /* @__PURE__ */ React2.createElement(StatusBar.Button, {
|
|
215
82
|
classNames: "text-xs"
|
|
216
|
-
}, isLabs ? version : v)), /* @__PURE__ */
|
|
83
|
+
}, isLabs ? version : v)), /* @__PURE__ */ React2.createElement(Popover.Portal, null, /* @__PURE__ */ React2.createElement(Popover.Content, {
|
|
217
84
|
side: "top",
|
|
218
85
|
role: "message",
|
|
219
86
|
classNames: "z-[12] bg-warning-500 max-is-[min(calc(100vw-16px),40ch)]"
|
|
220
|
-
}, /* @__PURE__ */
|
|
87
|
+
}, /* @__PURE__ */ React2.createElement(Message.Root, {
|
|
221
88
|
valence: "warning",
|
|
222
89
|
className: "rounded-be-none p-5"
|
|
223
|
-
}, /* @__PURE__ */
|
|
90
|
+
}, /* @__PURE__ */ React2.createElement(Message.Title, null, /* @__PURE__ */ React2.createElement(Icon, {
|
|
224
91
|
icon: "ph--warning--duotone",
|
|
225
92
|
size: 6,
|
|
226
93
|
classNames: "inline mie-2"
|
|
227
|
-
}), /* @__PURE__ */
|
|
94
|
+
}), /* @__PURE__ */ React2.createElement("span", null, t("warning title"))), /* @__PURE__ */ React2.createElement(Message.Body, null, t("technology preview message"), /* @__PURE__ */ React2.createElement("br", null), /* @__PURE__ */ React2.createElement(Link, {
|
|
228
95
|
href: previewUrl,
|
|
229
96
|
target: "_blank",
|
|
230
97
|
rel: "noreferrer",
|
|
231
98
|
variant: "neutral"
|
|
232
|
-
}, t("learn more label"), /* @__PURE__ */
|
|
99
|
+
}, t("learn more label"), /* @__PURE__ */ React2.createElement(Icon, {
|
|
233
100
|
icon: "ph--arrow-square-out--bold",
|
|
234
101
|
classNames: "inline mis-1"
|
|
235
|
-
})))), /* @__PURE__ */
|
|
102
|
+
})))), /* @__PURE__ */ React2.createElement("div", {
|
|
236
103
|
role: "none",
|
|
237
104
|
className: "plb-4 pli-5 space-b-2 text-baseText"
|
|
238
|
-
}, timestamp && /* @__PURE__ */
|
|
105
|
+
}, timestamp && /* @__PURE__ */ React2.createElement("p", null, t("released message", {
|
|
239
106
|
released: formatDistance(new Date(timestamp), /* @__PURE__ */ new Date(), {
|
|
240
107
|
addSuffix: true
|
|
241
108
|
})
|
|
242
|
-
}), /* @__PURE__ */
|
|
109
|
+
}), /* @__PURE__ */ React2.createElement("br", null), /* @__PURE__ */ React2.createElement(Link, {
|
|
243
110
|
href: releaseUrl,
|
|
244
111
|
target: "_blank",
|
|
245
112
|
rel: "noreferrer",
|
|
246
113
|
variant: "neutral"
|
|
247
|
-
}, t("see release label"), /* @__PURE__ */
|
|
114
|
+
}, t("see release label"), /* @__PURE__ */ React2.createElement(Icon, {
|
|
248
115
|
icon: "ph--arrow-square-out--bold",
|
|
249
116
|
classNames: "inline mis-1"
|
|
250
|
-
}))), /* @__PURE__ */
|
|
117
|
+
}))), /* @__PURE__ */ React2.createElement("p", null, /* @__PURE__ */ React2.createElement(Trans, {
|
|
251
118
|
t,
|
|
252
119
|
i18nKey: "powered by dxos message",
|
|
253
120
|
components: {
|
|
254
|
-
dxos: /* @__PURE__ */
|
|
121
|
+
dxos: /* @__PURE__ */ React2.createElement(Link, {
|
|
255
122
|
href: "https://dxos.org",
|
|
256
123
|
target: "_blank",
|
|
257
124
|
rel: "noreferrer",
|
|
258
125
|
variant: "neutral"
|
|
259
126
|
})
|
|
260
127
|
}
|
|
261
|
-
}))), /* @__PURE__ */
|
|
128
|
+
}))), /* @__PURE__ */ React2.createElement(Popover.Arrow, null))));
|
|
262
129
|
};
|
|
263
130
|
|
|
264
131
|
// packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx
|
|
265
132
|
var StatusBarActions = () => {
|
|
266
|
-
const { t } =
|
|
133
|
+
const { t } = useTranslation2(STATUS_BAR_PLUGIN);
|
|
267
134
|
const [open, setOpen] = useState(false);
|
|
268
|
-
|
|
269
|
-
const handleSave = useCallback((values) => {
|
|
270
|
-
void dispatch(createIntent(ObservabilityAction.CaptureUserFeedback, values));
|
|
271
|
-
setOpen(false);
|
|
272
|
-
}, [
|
|
273
|
-
dispatch
|
|
274
|
-
]);
|
|
275
|
-
return /* @__PURE__ */ React4.createElement(Popover3.Root, {
|
|
135
|
+
return /* @__PURE__ */ React3.createElement(Popover2.Root, {
|
|
276
136
|
open,
|
|
277
137
|
onOpenChange: setOpen
|
|
278
|
-
}, /* @__PURE__ */
|
|
138
|
+
}, /* @__PURE__ */ React3.createElement(StatusBar.Button, {
|
|
279
139
|
asChild: true
|
|
280
|
-
}, /* @__PURE__ */
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
140
|
+
}, /* @__PURE__ */ React3.createElement("a", {
|
|
141
|
+
href: "https://dxos.org/discord",
|
|
142
|
+
target: "_blank",
|
|
143
|
+
rel: "noopener noreferrer"
|
|
144
|
+
}, /* @__PURE__ */ React3.createElement(Icon2, {
|
|
145
|
+
icon: "ph--discord-logo--regular",
|
|
284
146
|
size: 4
|
|
285
|
-
}), /* @__PURE__ */
|
|
147
|
+
}), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
|
|
286
148
|
classNames: "hidden sm:block"
|
|
287
|
-
}, t("
|
|
149
|
+
}, t("discord label")))), /* @__PURE__ */ React3.createElement(StatusBar.Button, {
|
|
288
150
|
asChild: true
|
|
289
|
-
}, /* @__PURE__ */
|
|
290
|
-
href: "https://
|
|
151
|
+
}, /* @__PURE__ */ React3.createElement("a", {
|
|
152
|
+
href: "https://github.com/dxos/dxos",
|
|
291
153
|
target: "_blank",
|
|
292
154
|
rel: "noopener noreferrer"
|
|
293
|
-
}, /* @__PURE__ */
|
|
294
|
-
icon: "ph--
|
|
155
|
+
}, /* @__PURE__ */ React3.createElement(Icon2, {
|
|
156
|
+
icon: "ph--github-logo--regular",
|
|
295
157
|
size: 4
|
|
296
|
-
}), /* @__PURE__ */
|
|
158
|
+
}), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
|
|
297
159
|
classNames: "hidden sm:block"
|
|
298
|
-
}, t("
|
|
299
|
-
classNames: "shadow-lg"
|
|
300
|
-
}, /* @__PURE__ */ React4.createElement(FeedbackForm, {
|
|
301
|
-
onSave: handleSave
|
|
302
|
-
}), /* @__PURE__ */ React4.createElement(Popover3.Arrow, null))));
|
|
160
|
+
}, t("github label")))), /* @__PURE__ */ React3.createElement(VersionNumber, null));
|
|
303
161
|
};
|
|
304
162
|
var StatusBarPanel = () => {
|
|
305
|
-
return /* @__PURE__ */
|
|
163
|
+
return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(StatusBarActions, null), /* @__PURE__ */ React3.createElement("span", {
|
|
306
164
|
role: "separator",
|
|
307
165
|
className: "grow"
|
|
308
|
-
}), /* @__PURE__ */
|
|
166
|
+
}), /* @__PURE__ */ React3.createElement(Surface, {
|
|
309
167
|
role: "status"
|
|
310
168
|
}));
|
|
311
169
|
};
|
|
312
170
|
|
|
313
171
|
// packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx
|
|
314
|
-
import
|
|
172
|
+
import React4 from "react";
|
|
315
173
|
import { Capabilities, contributes, createSurface, defineModule, definePlugin, Events, Surface as Surface2 } from "@dxos/app-framework";
|
|
174
|
+
|
|
175
|
+
// packages/plugins/plugin-status-bar/src/translations.ts
|
|
176
|
+
var entry = (translation) => ({
|
|
177
|
+
[STATUS_BAR_PLUGIN]: translation
|
|
178
|
+
});
|
|
179
|
+
var translations = {
|
|
180
|
+
"en-US": entry({
|
|
181
|
+
"plugin name": "Status Bar",
|
|
182
|
+
"warning title": "WARNING",
|
|
183
|
+
"technology preview message": "Composer is currently in beta.",
|
|
184
|
+
"learn more label": "Learn more",
|
|
185
|
+
"released message": "This version released {{released}}.",
|
|
186
|
+
"see release label": "See release on GitHub",
|
|
187
|
+
"powered by dxos message": "Powered by <dxos>DXOS</dxos>",
|
|
188
|
+
"discord label": "Discord",
|
|
189
|
+
"github label": "GitHub",
|
|
190
|
+
"feedback label": "Feedback"
|
|
191
|
+
})
|
|
192
|
+
};
|
|
193
|
+
var translations_default = [
|
|
194
|
+
translations
|
|
195
|
+
];
|
|
196
|
+
|
|
197
|
+
// packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx
|
|
316
198
|
var StatusBarPlugin = () => definePlugin(meta, [
|
|
317
199
|
defineModule({
|
|
318
200
|
id: `${meta.id}/module/translations`,
|
|
@@ -326,30 +208,29 @@ var StatusBarPlugin = () => definePlugin(meta, [
|
|
|
326
208
|
createSurface({
|
|
327
209
|
id: meta.id,
|
|
328
210
|
role: "status-bar",
|
|
329
|
-
component: () => /* @__PURE__ */
|
|
211
|
+
component: () => /* @__PURE__ */ React4.createElement(StatusBarPanel, null)
|
|
330
212
|
}),
|
|
331
213
|
createSurface({
|
|
332
214
|
id: meta.id,
|
|
333
215
|
role: "status-bar--r0-footer",
|
|
334
|
-
component: () => /* @__PURE__ */
|
|
216
|
+
component: () => /* @__PURE__ */ React4.createElement(Surface2, {
|
|
335
217
|
role: "status"
|
|
336
218
|
})
|
|
337
219
|
}),
|
|
338
220
|
createSurface({
|
|
339
221
|
id: meta.id,
|
|
340
222
|
role: "status-bar--r1-footer",
|
|
341
|
-
component: () => /* @__PURE__ */
|
|
223
|
+
component: () => /* @__PURE__ */ React4.createElement(StatusBarActions, null)
|
|
342
224
|
}),
|
|
343
225
|
createSurface({
|
|
344
226
|
id: `${STATUS_BAR_PLUGIN}/header-end`,
|
|
345
227
|
role: "header-end",
|
|
346
|
-
component: () => /* @__PURE__ */
|
|
228
|
+
component: () => /* @__PURE__ */ React4.createElement(VersionNumber, null)
|
|
347
229
|
})
|
|
348
230
|
])
|
|
349
231
|
})
|
|
350
232
|
]);
|
|
351
233
|
export {
|
|
352
|
-
FeedbackForm,
|
|
353
234
|
STATUS_BAR_PLUGIN,
|
|
354
235
|
StatusBar,
|
|
355
236
|
StatusBarActions,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/
|
|
4
|
-
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { PaperPlaneTilt, X } from '@phosphor-icons/react';\nimport React, { useRef } from 'react';\n\nimport { getSnapshot } from '@dxos/echo-schema';\nimport { UserFeedback } from '@dxos/plugin-observability/types';\nimport { Button, Input, Popover, useTranslation } from '@dxos/react-ui';\nimport { FormProvider, useFormContext, useInputProps } from '@dxos/react-ui-form';\nimport { getSize } from '@dxos/react-ui-theme';\n\nimport { STATUS_BAR_PLUGIN } from '../meta';\nimport { mkTranslation } from '../translations';\n\nconst defaultValues: UserFeedback = { name: '', email: '', message: '' };\n\nconst FormContent = () => {\n const { t } = useTranslation(STATUS_BAR_PLUGIN);\n const translation = mkTranslation(t);\n const { handleSave, canSave } = useFormContext<UserFeedback>();\n\n const nameProps = useInputProps(['name']);\n const emailProps = useInputProps(['email']);\n const messageProps = useInputProps(['message']);\n\n return (\n <div role='form' className='p-3 flex flex-col gap-2'>\n <div role='none' className='space-b-1'>\n <Input.Root validationValence={nameProps.getStatus().status}>\n <Input.Label>{translation('name label')}</Input.Label>\n <Input.TextInput\n classNames={'text-sm'}\n placeholder={translation('name placeholder')}\n autoFocus\n value={nameProps.getValue() ?? ''}\n onChange={(e) => nameProps.onValueChange('string', e.target.value)}\n onBlur={nameProps.onBlur}\n />\n <Input.DescriptionAndValidation>\n <Input.Validation>{nameProps.getStatus().error}</Input.Validation>\n </Input.DescriptionAndValidation>\n </Input.Root>\n </div>\n\n <div role='none' className='space-b-1'>\n <Input.Root validationValence={emailProps.getStatus().status}>\n <Input.Label>{translation('email input label')}</Input.Label>\n <Input.TextInput\n classNames={'text-sm'}\n placeholder={translation('email input placeholder')}\n value={emailProps.getValue() ?? ''}\n onChange={(e) => emailProps.onValueChange('string', e.target.value)}\n onBlur={emailProps.onBlur}\n />\n <Input.DescriptionAndValidation>\n <Input.Validation>{emailProps.getStatus().error}</Input.Validation>\n </Input.DescriptionAndValidation>\n </Input.Root>\n </div>\n\n <div role='none' className='space-b-1'>\n <Input.Root validationValence={messageProps.getStatus().status}>\n <Input.Label>{translation('feedback text area label')}</Input.Label>\n <Input.TextArea\n classNames={'text-sm'}\n rows={5}\n cols={30}\n placeholder={translation('feedback text area placeholder')}\n value={messageProps.getValue() ?? ''}\n onChange={(e) => messageProps.onValueChange('string', e.target.value)}\n onBlur={messageProps.onBlur}\n />\n <Input.DescriptionAndValidation>\n <Input.Validation>{messageProps.getStatus().error}</Input.Validation>\n </Input.DescriptionAndValidation>\n </Input.Root>\n </div>\n\n <div role='none' className='space-b-2'>\n <Button\n type='submit'\n variant='primary'\n classNames='is-full flex gap-2'\n disabled={!canSave}\n onClick={handleSave}\n >\n <span>{translation('send feedback label')}</span>\n <div className='grow' />\n <PaperPlaneTilt className={getSize(5)} />\n </Button>\n <Popover.Close asChild>\n <Button classNames='is-full flex gap-2'>\n <span>{t('cancel label', { ns: 'os' })}</span>\n <div className='grow' />\n <X className={getSize(5)} />\n </Button>\n </Popover.Close>\n </div>\n </div>\n );\n};\n\nexport const FeedbackForm = ({ onSave }: { onSave: (values: UserFeedback) => void }) => {\n const formRef = useRef<HTMLDivElement>(null);\n\n const initialValues = getSnapshot(defaultValues);\n\n return (\n <FormProvider formRef={formRef} schema={UserFeedback} initialValues={initialValues} onSave={onSave}>\n <div ref={formRef}>\n <FormContent />\n </div>\n </FormProvider>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const STATUS_BAR_PLUGIN = 'dxos.org/plugin/status-bar';\n\nexport const meta: PluginMeta = {\n id: STATUS_BAR_PLUGIN,\n name: 'Status Bar',\n description: 'Display a bar with status and actions.',\n icon: 'ph--info--regular',\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type useTranslation } from '@dxos/react-ui';\n\nimport { STATUS_BAR_PLUGIN } from './meta';\n\ntype StatusBarTranslationKeys =\n | 'plugin name'\n | 'email input label'\n | 'email input placeholder'\n | 'feedback text area label'\n | 'feedback text area placeholder'\n | 'send feedback label'\n | 'name label'\n | 'name placeholder'\n | 'warning title'\n | 'technology preview message'\n | 'learn more label'\n | 'released message'\n | 'see release label'\n | 'powered by dxos message'\n | 'discord label'\n | 'feedback label';\n\ntype RequiredTranslation = { [key in StatusBarTranslationKeys]: string };\ntype TranslationEntry = { [STATUS_BAR_PLUGIN]: RequiredTranslation };\ntype Language = string;\n\n// -- helpers.\nconst entry = (translation: RequiredTranslation): TranslationEntry => ({ [STATUS_BAR_PLUGIN]: translation });\nexport const mkTranslation = (t: ReturnType<typeof useTranslation>['t']) => (key: StatusBarTranslationKeys) => t(key);\n\nconst translations: Record<Language, TranslationEntry> = {\n 'en-US': entry({\n 'plugin name': 'Status Bar',\n 'name label': 'Name',\n 'name placeholder': 'Preferred name',\n 'email input label': 'Email',\n 'email input placeholder': 'hello@example.com',\n 'feedback text area label': 'Feedback',\n 'feedback text area placeholder': 'Please describe your issue or suggestion.',\n 'send feedback label': 'Send Feedback',\n 'warning title': 'WARNING',\n 'technology preview message': 'Composer is currently in beta.',\n 'learn more label': 'Learn more',\n 'released message': 'This version released {{released}}.',\n 'see release label': 'See release on GitHub',\n 'powered by dxos message': 'Powered by <dxos>DXOS</dxos>',\n 'discord label': 'Discord',\n 'feedback label': 'Feedback',\n }),\n};\n\nexport default [translations];\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { type ComponentPropsWithRef, forwardRef, type PropsWithChildren, type ReactNode } from 'react';\n\nimport { type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\ntype StatusBarTextProps = ThemedClassName<{ children: ReactNode }>;\n\nconst StatusBarText = forwardRef<HTMLSpanElement, StatusBarTextProps>(({ classNames, children }, forwardedRef) => (\n <span className={mx(classNames)} ref={forwardedRef}>\n {children}\n </span>\n));\n\ntype StatusBarButtonProps = ThemedClassName<ComponentPropsWithRef<'button'> & { asChild?: boolean }>;\n\nconst StatusBarButton = forwardRef<HTMLButtonElement, StatusBarButtonProps>(\n ({ classNames, children, asChild, ...props }, forwardedRef) => {\n const classes = mx(\n 'flex items-center justify-center gap-2 p-1 px-2 rounded-sm',\n 'select-none cursor-pointer dx-focus-ring text-description text-xs',\n 'hover:bg-neutral-75 active:bg-neutral-150 dark:hover:bg-neutral-750 dark:active:bg-neutral-700',\n classNames,\n );\n\n return asChild ? (\n <Slot role='button' ref={forwardedRef} className={classes} {...props}>\n {children}\n </Slot>\n ) : (\n <button className={classes} ref={forwardedRef} {...props}>\n {children}\n </button>\n );\n },\n);\n\nexport default StatusBarButton;\n\ntype StatusBarItemProps = ThemedClassName<ComponentPropsWithRef<'div'>>;\n\nconst StatusBarItem = forwardRef<HTMLDivElement, StatusBarItemProps>(\n ({ classNames, children, ...props }, forwardedRef) => (\n <div\n role='menuitem'\n className={mx('flex items-center justify-center gap-2 p-1 px-2 rounded-sm select-none', classNames)}\n ref={forwardedRef}\n {...props}\n >\n {children}\n </div>\n ),\n);\n\ntype StartContentProps = ThemedClassName<PropsWithChildren<{}>>;\n\nconst StartContent = forwardRef<HTMLDivElement, StartContentProps>(({ classNames, children }, forwardedRef) => (\n <div role='none' className={mx('flex-grow flex items-center space-x-2', classNames)} ref={forwardedRef}>\n {children}\n </div>\n));\n\ntype EndContentProps = ThemedClassName<PropsWithChildren<{}>>;\n\nconst EndContent = forwardRef<HTMLDivElement, EndContentProps>(({ classNames, children }, forwardedRef) => (\n <div role='none' className={mx('flex-grow flex items-center justify-end', classNames)} ref={forwardedRef}>\n {children}\n </div>\n));\n\nexport const StatusBar = {\n Text: StatusBarText,\n Item: StatusBarItem,\n Button: StatusBarButton,\n StartContent,\n EndContent,\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useCallback, useState } from 'react';\n\nimport { createIntent, Surface, useIntentDispatcher } from '@dxos/app-framework';\nimport { ObservabilityAction, type UserFeedback } from '@dxos/plugin-observability/types';\nimport { Icon, Popover, useTranslation } from '@dxos/react-ui';\n\nimport { FeedbackForm } from './FeedbackForm';\nimport { StatusBar } from './StatusBar';\nimport { VersionNumber } from './VersionNumber';\nimport { STATUS_BAR_PLUGIN } from '../meta';\n\nexport const StatusBarActions = () => {\n const { t } = useTranslation(STATUS_BAR_PLUGIN);\n const [open, setOpen] = useState(false);\n const { dispatchPromise: dispatch } = useIntentDispatcher();\n\n const handleSave = useCallback(\n (values: UserFeedback) => {\n void dispatch(createIntent(ObservabilityAction.CaptureUserFeedback, values));\n setOpen(false);\n },\n [dispatch],\n );\n\n return (\n <Popover.Root open={open} onOpenChange={setOpen}>\n <Popover.Trigger asChild>\n <StatusBar.Button data-joyride='welcome/feedback'>\n <Icon icon='ph--paper-plane-tilt--regular' size={4} />\n <StatusBar.Text classNames='hidden sm:block'>{t('feedback label')}</StatusBar.Text>\n </StatusBar.Button>\n </Popover.Trigger>\n {/* TODO(zan): Configure this label? */}\n <StatusBar.Button asChild>\n <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>\n <Icon icon='ph--discord-logo--regular' size={4} />\n <StatusBar.Text classNames='hidden sm:block'>{t('discord label')}</StatusBar.Text>\n </a>\n </StatusBar.Button>\n <VersionNumber />\n <Popover.Portal>\n <Popover.Content classNames='shadow-lg'>\n <FeedbackForm onSave={handleSave} />\n <Popover.Arrow />\n </Popover.Content>\n </Popover.Portal>\n </Popover.Root>\n );\n};\n\nexport const StatusBarPanel = () => {\n return (\n <>\n <StatusBarActions />\n <span role='separator' className='grow' />\n <Surface role='status' />\n </>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { formatDistance } from 'date-fns/formatDistance';\nimport React from 'react';\n\nimport { useConfig } from '@dxos/react-client';\nimport { Link, Message, Popover, Trans, useTranslation, Icon } from '@dxos/react-ui';\n\nimport { StatusBar } from './StatusBar';\nimport { STATUS_BAR_PLUGIN } from '../meta';\n\nconst repo = 'https://github.com/dxos/dxos';\n\nconst VERSION_REGEX = /([\\d.]+)/;\n\nexport const VersionNumber = () => {\n const config = useConfig();\n const { t } = useTranslation(STATUS_BAR_PLUGIN);\n const { version, timestamp, commitHash } = config.values.runtime?.app?.build ?? {};\n const [_, v] = version?.match(VERSION_REGEX) ?? [];\n const isLabs = config.values.runtime?.app?.env?.DX_LABS;\n\n const releaseUrl =\n config.values.runtime?.app?.env?.DX_ENVIRONMENT === 'production'\n ? `${repo}/releases/tag/v${version}`\n : `${repo}/commit/${commitHash}`;\n\n const previewUrl = 'https://docs.dxos.org/composer#technology-preview';\n\n return (\n <Popover.Root>\n <Popover.Trigger asChild>\n <StatusBar.Button classNames='text-xs'>{isLabs ? version : v}</StatusBar.Button>\n </Popover.Trigger>\n <Popover.Portal>\n <Popover.Content\n side='top'\n role='message'\n classNames='z-[12] bg-warning-500 max-is-[min(calc(100vw-16px),40ch)]'\n >\n <Message.Root valence='warning' className='rounded-be-none p-5'>\n <Message.Title>\n <Icon icon='ph--warning--duotone' size={6} classNames='inline mie-2' />\n <span>{t('warning title')}</span>\n </Message.Title>\n <Message.Body>\n {t('technology preview message')}\n <br />\n <Link href={previewUrl} target='_blank' rel='noreferrer' variant='neutral'>\n {t('learn more label')}\n <Icon icon='ph--arrow-square-out--bold' classNames='inline mis-1' />\n </Link>\n </Message.Body>\n </Message.Root>\n <div role='none' className='plb-4 pli-5 space-b-2 text-baseText'>\n {timestamp && (\n <p>\n {t('released message', {\n released: formatDistance(new Date(timestamp), new Date(), { addSuffix: true }),\n })}\n <br />\n <Link href={releaseUrl} target='_blank' rel='noreferrer' variant='neutral'>\n {t('see release label')}\n <Icon icon='ph--arrow-square-out--bold' classNames='inline mis-1' />\n </Link>\n </p>\n )}\n <p>\n <Trans\n {...{\n t,\n i18nKey: 'powered by dxos message',\n components: {\n dxos: <Link href='https://dxos.org' target='_blank' rel='noreferrer' variant='neutral' />,\n },\n }}\n />\n </p>\n </div>\n <Popover.Arrow />\n </Popover.Content>\n </Popover.Portal>\n </Popover.Root>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\n\nimport {\n Capabilities,\n contributes,\n createSurface,\n defineModule,\n definePlugin,\n Events,\n Surface,\n} from '@dxos/app-framework';\n\nimport { StatusBarActions, StatusBarPanel } from './components';\nimport { VersionNumber } from './components/VersionNumber';\nimport { meta, STATUS_BAR_PLUGIN } from './meta';\nimport translations from './translations';\n\nexport const StatusBarPlugin = () =>\n definePlugin(meta, [\n defineModule({\n id: `${meta.id}/module/translations`,\n activatesOn: Events.SetupTranslations,\n activate: () => contributes(Capabilities.Translations, translations),\n }),\n defineModule({\n id: `${meta.id}/module/react-surface`,\n activatesOn: Events.SetupReactSurface,\n activate: () =>\n contributes(Capabilities.ReactSurface, [\n createSurface({\n id: meta.id,\n role: 'status-bar',\n component: () => <StatusBarPanel />,\n }),\n createSurface({\n id: meta.id,\n role: 'status-bar--r0-footer',\n component: () => <Surface role='status' />,\n }),\n createSurface({\n id: meta.id,\n role: 'status-bar--r1-footer',\n component: () => <StatusBarActions />,\n }),\n createSurface({\n id: `${STATUS_BAR_PLUGIN}/header-end`,\n role: 'header-end',\n component: () => <VersionNumber />,\n }),\n ]),\n }),\n ]);\n"],
|
|
5
|
-
"mappings": ";;;AAIA,SAASA,
|
|
6
|
-
"names": ["
|
|
3
|
+
"sources": ["../../../src/components/StatusBar.tsx", "../../../src/components/StatusBarPanel.tsx", "../../../src/components/VersionNumber.tsx", "../../../src/meta.ts", "../../../src/StatusBarPlugin.tsx", "../../../src/translations.ts"],
|
|
4
|
+
"sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { type ComponentPropsWithRef, forwardRef, type PropsWithChildren, type ReactNode } from 'react';\n\nimport { type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\ntype StatusBarTextProps = ThemedClassName<{ children: ReactNode }>;\n\nconst StatusBarText = forwardRef<HTMLSpanElement, StatusBarTextProps>(({ classNames, children }, forwardedRef) => (\n <span className={mx(classNames)} ref={forwardedRef}>\n {children}\n </span>\n));\n\ntype StatusBarButtonProps = ThemedClassName<ComponentPropsWithRef<'button'> & { asChild?: boolean }>;\n\nconst StatusBarButton = forwardRef<HTMLButtonElement, StatusBarButtonProps>(\n ({ classNames, children, asChild, ...props }, forwardedRef) => {\n const classes = mx(\n 'flex items-center justify-center gap-2 p-1 px-2 rounded-sm',\n 'select-none cursor-pointer dx-focus-ring text-description text-xs',\n 'hover:bg-neutral-75 active:bg-neutral-150 dark:hover:bg-neutral-750 dark:active:bg-neutral-700',\n classNames,\n );\n\n return asChild ? (\n <Slot role='button' ref={forwardedRef} className={classes} {...props}>\n {children}\n </Slot>\n ) : (\n <button className={classes} ref={forwardedRef} {...props}>\n {children}\n </button>\n );\n },\n);\n\nexport default StatusBarButton;\n\ntype StatusBarItemProps = ThemedClassName<ComponentPropsWithRef<'div'>>;\n\nconst StatusBarItem = forwardRef<HTMLDivElement, StatusBarItemProps>(\n ({ classNames, children, ...props }, forwardedRef) => (\n <div\n role='menuitem'\n className={mx('flex items-center justify-center gap-2 p-1 px-2 rounded-sm select-none', classNames)}\n ref={forwardedRef}\n {...props}\n >\n {children}\n </div>\n ),\n);\n\ntype StartContentProps = ThemedClassName<PropsWithChildren<{}>>;\n\nconst StartContent = forwardRef<HTMLDivElement, StartContentProps>(({ classNames, children }, forwardedRef) => (\n <div role='none' className={mx('flex-grow flex items-center space-x-2', classNames)} ref={forwardedRef}>\n {children}\n </div>\n));\n\ntype EndContentProps = ThemedClassName<PropsWithChildren<{}>>;\n\nconst EndContent = forwardRef<HTMLDivElement, EndContentProps>(({ classNames, children }, forwardedRef) => (\n <div role='none' className={mx('flex-grow flex items-center justify-end', classNames)} ref={forwardedRef}>\n {children}\n </div>\n));\n\nexport const StatusBar = {\n Text: StatusBarText,\n Item: StatusBarItem,\n Button: StatusBarButton,\n StartContent,\n EndContent,\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { useState } from 'react';\n\nimport { Surface } from '@dxos/app-framework';\nimport { Icon, Popover, useTranslation } from '@dxos/react-ui';\n\nimport { StatusBar } from './StatusBar';\nimport { VersionNumber } from './VersionNumber';\nimport { STATUS_BAR_PLUGIN } from '../meta';\n\nexport const StatusBarActions = () => {\n const { t } = useTranslation(STATUS_BAR_PLUGIN);\n const [open, setOpen] = useState(false);\n\n return (\n <Popover.Root open={open} onOpenChange={setOpen}>\n {/* TODO(zan): Configure this label? */}\n <StatusBar.Button asChild>\n <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>\n <Icon icon='ph--discord-logo--regular' size={4} />\n <StatusBar.Text classNames='hidden sm:block'>{t('discord label')}</StatusBar.Text>\n </a>\n </StatusBar.Button>\n <StatusBar.Button asChild>\n <a href='https://github.com/dxos/dxos' target='_blank' rel='noopener noreferrer'>\n <Icon icon='ph--github-logo--regular' size={4} />\n <StatusBar.Text classNames='hidden sm:block'>{t('github label')}</StatusBar.Text>\n </a>\n </StatusBar.Button>\n <VersionNumber />\n </Popover.Root>\n );\n};\n\nexport const StatusBarPanel = () => {\n return (\n <>\n <StatusBarActions />\n <span role='separator' className='grow' />\n <Surface role='status' />\n </>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { formatDistance } from 'date-fns/formatDistance';\nimport React from 'react';\n\nimport { useConfig } from '@dxos/react-client';\nimport { Link, Message, Popover, Trans, useTranslation, Icon } from '@dxos/react-ui';\n\nimport { StatusBar } from './StatusBar';\nimport { STATUS_BAR_PLUGIN } from '../meta';\n\nconst repo = 'https://github.com/dxos/dxos';\n\nconst VERSION_REGEX = /([\\d.]+)/;\n\nexport const VersionNumber = () => {\n const config = useConfig();\n const { t } = useTranslation(STATUS_BAR_PLUGIN);\n const { version, timestamp, commitHash } = config.values.runtime?.app?.build ?? {};\n const [_, v] = version?.match(VERSION_REGEX) ?? [];\n const isLabs = config.values.runtime?.app?.env?.DX_LABS;\n\n const releaseUrl =\n config.values.runtime?.app?.env?.DX_ENVIRONMENT === 'production'\n ? `${repo}/releases/tag/v${version}`\n : `${repo}/commit/${commitHash}`;\n\n const previewUrl = 'https://docs.dxos.org/composer#technology-preview';\n\n return (\n <Popover.Root>\n <Popover.Trigger asChild>\n <StatusBar.Button classNames='text-xs'>{isLabs ? version : v}</StatusBar.Button>\n </Popover.Trigger>\n <Popover.Portal>\n <Popover.Content\n side='top'\n role='message'\n classNames='z-[12] bg-warning-500 max-is-[min(calc(100vw-16px),40ch)]'\n >\n <Message.Root valence='warning' className='rounded-be-none p-5'>\n <Message.Title>\n <Icon icon='ph--warning--duotone' size={6} classNames='inline mie-2' />\n <span>{t('warning title')}</span>\n </Message.Title>\n <Message.Body>\n {t('technology preview message')}\n <br />\n <Link href={previewUrl} target='_blank' rel='noreferrer' variant='neutral'>\n {t('learn more label')}\n <Icon icon='ph--arrow-square-out--bold' classNames='inline mis-1' />\n </Link>\n </Message.Body>\n </Message.Root>\n <div role='none' className='plb-4 pli-5 space-b-2 text-baseText'>\n {timestamp && (\n <p>\n {t('released message', {\n released: formatDistance(new Date(timestamp), new Date(), { addSuffix: true }),\n })}\n <br />\n <Link href={releaseUrl} target='_blank' rel='noreferrer' variant='neutral'>\n {t('see release label')}\n <Icon icon='ph--arrow-square-out--bold' classNames='inline mis-1' />\n </Link>\n </p>\n )}\n <p>\n <Trans\n {...{\n t,\n i18nKey: 'powered by dxos message',\n components: {\n dxos: <Link href='https://dxos.org' target='_blank' rel='noreferrer' variant='neutral' />,\n },\n }}\n />\n </p>\n </div>\n <Popover.Arrow />\n </Popover.Content>\n </Popover.Portal>\n </Popover.Root>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const STATUS_BAR_PLUGIN = 'dxos.org/plugin/status-bar';\n\nexport const meta: PluginMeta = {\n id: STATUS_BAR_PLUGIN,\n name: 'Status Bar',\n description: 'Display a bar with status and actions.',\n icon: 'ph--info--regular',\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\n\nimport {\n Capabilities,\n contributes,\n createSurface,\n defineModule,\n definePlugin,\n Events,\n Surface,\n} from '@dxos/app-framework';\n\nimport { StatusBarActions, StatusBarPanel } from './components';\nimport { VersionNumber } from './components/VersionNumber';\nimport { meta, STATUS_BAR_PLUGIN } from './meta';\nimport translations from './translations';\n\nexport const StatusBarPlugin = () =>\n definePlugin(meta, [\n defineModule({\n id: `${meta.id}/module/translations`,\n activatesOn: Events.SetupTranslations,\n activate: () => contributes(Capabilities.Translations, translations),\n }),\n defineModule({\n id: `${meta.id}/module/react-surface`,\n activatesOn: Events.SetupReactSurface,\n activate: () =>\n contributes(Capabilities.ReactSurface, [\n createSurface({\n id: meta.id,\n role: 'status-bar',\n component: () => <StatusBarPanel />,\n }),\n createSurface({\n id: meta.id,\n role: 'status-bar--r0-footer',\n component: () => <Surface role='status' />,\n }),\n createSurface({\n id: meta.id,\n role: 'status-bar--r1-footer',\n component: () => <StatusBarActions />,\n }),\n createSurface({\n id: `${STATUS_BAR_PLUGIN}/header-end`,\n role: 'header-end',\n component: () => <VersionNumber />,\n }),\n ]),\n }),\n ]);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type useTranslation } from '@dxos/react-ui';\n\nimport { STATUS_BAR_PLUGIN } from './meta';\n\n// TODO(wittjosiah): There's got to be a better way to do typesafe translations, this is too much boilerplate.\n\ntype StatusBarTranslationKeys =\n | 'plugin name'\n | 'warning title'\n | 'technology preview message'\n | 'learn more label'\n | 'released message'\n | 'see release label'\n | 'powered by dxos message'\n | 'discord label'\n | 'github label'\n | 'feedback label';\n\ntype RequiredTranslation = { [key in StatusBarTranslationKeys]: string };\ntype TranslationEntry = { [STATUS_BAR_PLUGIN]: RequiredTranslation };\ntype Language = string;\n\n// -- helpers.\nconst entry = (translation: RequiredTranslation): TranslationEntry => ({ [STATUS_BAR_PLUGIN]: translation });\nexport const mkTranslation = (t: ReturnType<typeof useTranslation>['t']) => (key: StatusBarTranslationKeys) => t(key);\n\nconst translations: Record<Language, TranslationEntry> = {\n 'en-US': entry({\n 'plugin name': 'Status Bar',\n 'warning title': 'WARNING',\n 'technology preview message': 'Composer is currently in beta.',\n 'learn more label': 'Learn more',\n 'released message': 'This version released {{released}}.',\n 'see release label': 'See release on GitHub',\n 'powered by dxos message': 'Powered by <dxos>DXOS</dxos>',\n 'discord label': 'Discord',\n 'github label': 'GitHub',\n 'feedback label': 'Feedback',\n }),\n};\n\nexport default [translations];\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Slot", "React", "forwardRef", "mx", "StatusBarText", "forwardRef", "classNames", "children", "forwardedRef", "span", "className", "mx", "ref", "StatusBarButton", "asChild", "props", "classes", "Slot", "role", "button", "StatusBarItem", "forwardRef", "classNames", "children", "props", "forwardedRef", "div", "role", "className", "mx", "ref", "StartContent", "EndContent", "StatusBar", "Text", "StatusBarText", "Item", "Button", "StatusBarButton", "React", "useState", "Surface", "Icon", "Popover", "useTranslation", "formatDistance", "React", "useConfig", "Link", "Message", "Popover", "Trans", "useTranslation", "Icon", "STATUS_BAR_PLUGIN", "meta", "id", "name", "description", "icon", "repo", "VERSION_REGEX", "VersionNumber", "config", "useConfig", "t", "useTranslation", "STATUS_BAR_PLUGIN", "version", "timestamp", "commitHash", "values", "runtime", "app", "build", "_", "v", "match", "isLabs", "env", "DX_LABS", "releaseUrl", "DX_ENVIRONMENT", "previewUrl", "React", "Popover", "Root", "Trigger", "asChild", "StatusBar", "Button", "classNames", "Portal", "Content", "side", "role", "Message", "valence", "className", "Title", "Icon", "icon", "size", "span", "Body", "br", "Link", "href", "target", "rel", "variant", "div", "p", "released", "formatDistance", "Date", "addSuffix", "Trans", "i18nKey", "components", "dxos", "Arrow", "StatusBarActions", "t", "useTranslation", "STATUS_BAR_PLUGIN", "open", "setOpen", "useState", "React", "Popover", "Root", "onOpenChange", "StatusBar", "Button", "asChild", "a", "href", "target", "rel", "Icon", "icon", "size", "Text", "classNames", "VersionNumber", "StatusBarPanel", "span", "role", "className", "Surface", "React", "Capabilities", "contributes", "createSurface", "defineModule", "definePlugin", "Events", "Surface", "entry", "translation", "STATUS_BAR_PLUGIN", "translations", "entry", "StatusBarPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "SetupTranslations", "activate", "contributes", "Capabilities", "Translations", "translations", "SetupReactSurface", "ReactSurface", "createSurface", "role", "component", "React", "StatusBarPanel", "Surface", "StatusBarActions", "STATUS_BAR_PLUGIN", "VersionNumber"]
|
|
7
7
|
}
|