@dxos/plugin-status-bar 0.8.3 → 0.8.4-main.1068cf700f

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (60) hide show
  1. package/dist/lib/browser/chunk-VP63XX2T.mjs +195 -0
  2. package/dist/lib/browser/chunk-VP63XX2T.mjs.map +7 -0
  3. package/dist/lib/browser/index.mjs +31 -41
  4. package/dist/lib/browser/index.mjs.map +4 -4
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/browser/{react-surface-XYQMVXMA.mjs → react-surface-B2T3FRSM.mjs} +13 -11
  7. package/dist/lib/browser/react-surface-B2T3FRSM.mjs.map +7 -0
  8. package/dist/lib/node-esm/chunk-UONVHDU2.mjs +197 -0
  9. package/dist/lib/node-esm/chunk-UONVHDU2.mjs.map +7 -0
  10. package/dist/lib/node-esm/index.mjs +31 -41
  11. package/dist/lib/node-esm/index.mjs.map +4 -4
  12. package/dist/lib/node-esm/meta.json +1 -1
  13. package/dist/lib/node-esm/{react-surface-HZE7P2TS.mjs → react-surface-2KYAWCDQ.mjs} +13 -11
  14. package/dist/lib/node-esm/react-surface-2KYAWCDQ.mjs.map +7 -0
  15. package/dist/types/src/StatusBarPlugin.d.ts +2 -1
  16. package/dist/types/src/StatusBarPlugin.d.ts.map +1 -1
  17. package/dist/types/src/capabilities/index.d.ts +1 -1
  18. package/dist/types/src/capabilities/index.d.ts.map +1 -1
  19. package/dist/types/src/capabilities/react-surface/index.d.ts +3 -0
  20. package/dist/types/src/capabilities/react-surface/index.d.ts.map +1 -0
  21. package/dist/types/src/capabilities/react-surface/react-surface.d.ts +5 -0
  22. package/dist/types/src/capabilities/react-surface/react-surface.d.ts.map +1 -0
  23. package/dist/types/src/components/StatusBar.d.ts +3 -3
  24. package/dist/types/src/components/StatusBar.d.ts.map +1 -1
  25. package/dist/types/src/components/StatusBar.stories.d.ts +9 -5
  26. package/dist/types/src/components/StatusBar.stories.d.ts.map +1 -1
  27. package/dist/types/src/components/StatusBarPanel.d.ts.map +1 -1
  28. package/dist/types/src/components/VersionNumber.d.ts.map +1 -1
  29. package/dist/types/src/meta.d.ts +2 -3
  30. package/dist/types/src/meta.d.ts.map +1 -1
  31. package/dist/types/src/translations.d.ts +17 -12
  32. package/dist/types/src/translations.d.ts.map +1 -1
  33. package/dist/types/tsconfig.tsbuildinfo +1 -1
  34. package/package.json +31 -28
  35. package/src/StatusBarPlugin.ts +8 -15
  36. package/src/capabilities/index.ts +1 -3
  37. package/src/capabilities/react-surface/index.ts +7 -0
  38. package/src/capabilities/react-surface/react-surface.tsx +39 -0
  39. package/src/components/StatusBar.stories.tsx +9 -12
  40. package/src/components/StatusBar.tsx +4 -4
  41. package/src/components/StatusBarPanel.tsx +6 -5
  42. package/src/components/VersionNumber.tsx +4 -3
  43. package/src/meta.ts +8 -6
  44. package/src/translations.ts +22 -42
  45. package/dist/lib/browser/chunk-NV543FLZ.mjs +0 -249
  46. package/dist/lib/browser/chunk-NV543FLZ.mjs.map +0 -7
  47. package/dist/lib/browser/react-surface-XYQMVXMA.mjs.map +0 -7
  48. package/dist/lib/node/chunk-IQ5QWIXI.cjs +0 -280
  49. package/dist/lib/node/chunk-IQ5QWIXI.cjs.map +0 -7
  50. package/dist/lib/node/index.cjs +0 -86
  51. package/dist/lib/node/index.cjs.map +0 -7
  52. package/dist/lib/node/meta.json +0 -1
  53. package/dist/lib/node/react-surface-BD2WWDVZ.cjs +0 -61
  54. package/dist/lib/node/react-surface-BD2WWDVZ.cjs.map +0 -7
  55. package/dist/lib/node-esm/chunk-4ENEPGOY.mjs +0 -251
  56. package/dist/lib/node-esm/chunk-4ENEPGOY.mjs.map +0 -7
  57. package/dist/lib/node-esm/react-surface-HZE7P2TS.mjs.map +0 -7
  58. package/dist/types/src/capabilities/react-surface.d.ts +0 -4
  59. package/dist/types/src/capabilities/react-surface.d.ts.map +0 -1
  60. package/src/capabilities/react-surface.tsx +0 -34
package/package.json CHANGED
@@ -1,15 +1,20 @@
1
1
  {
2
2
  "name": "@dxos/plugin-status-bar",
3
- "version": "0.8.3",
3
+ "version": "0.8.4-main.1068cf700f",
4
4
  "description": "Status bar plugin",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "https://github.com/dxos/dxos"
10
+ },
7
11
  "license": "MIT",
8
12
  "author": "DXOS.org",
9
13
  "sideEffects": true,
10
14
  "type": "module",
11
15
  "exports": {
12
16
  ".": {
17
+ "source": "./src/index.ts",
13
18
  "types": "./dist/types/src/index.d.ts",
14
19
  "browser": "./dist/lib/browser/index.mjs",
15
20
  "node": "./dist/lib/node-esm/index.mjs"
@@ -24,40 +29,38 @@
24
29
  "src"
25
30
  ],
26
31
  "dependencies": {
27
- "@fluentui/react-tabster": "^9.24.2",
28
- "@preact-signals/safe-react": "^0.9.0",
29
- "@preact/signals-core": "^1.9.0",
32
+ "@fluentui/react-tabster": "9.26.11",
30
33
  "@radix-ui/react-slot": "1.1.2",
31
34
  "date-fns": "^3.3.1",
32
- "effect": "3.14.21",
35
+ "effect": "3.19.16",
33
36
  "react-resize-detector": "^11.0.1",
34
- "@dxos/app-framework": "0.8.3",
35
- "@dxos/async": "0.8.3",
36
- "@dxos/echo": "0.8.3",
37
- "@dxos/echo-schema": "0.8.3",
38
- "@dxos/plugin-observability": "0.8.3",
39
- "@dxos/react-client": "0.8.3",
40
- "@dxos/react-ui-form": "0.8.3",
41
- "@dxos/schema": "0.8.3"
37
+ "@dxos/app-framework": "0.8.4-main.1068cf700f",
38
+ "@dxos/app-toolkit": "0.8.4-main.1068cf700f",
39
+ "@dxos/echo": "0.8.4-main.1068cf700f",
40
+ "@dxos/operation": "0.8.4-main.1068cf700f",
41
+ "@dxos/async": "0.8.4-main.1068cf700f",
42
+ "@dxos/plugin-observability": "0.8.4-main.1068cf700f",
43
+ "@dxos/react-client": "0.8.4-main.1068cf700f",
44
+ "@dxos/util": "0.8.4-main.1068cf700f",
45
+ "@dxos/react-ui-form": "0.8.4-main.1068cf700f",
46
+ "@dxos/schema": "0.8.4-main.1068cf700f"
42
47
  },
43
48
  "devDependencies": {
44
- "@phosphor-icons/react": "^2.1.5",
45
- "@types/react": "~18.2.0",
46
- "@types/react-dom": "~18.2.0",
47
- "react": "~18.2.0",
48
- "react-dom": "~18.2.0",
49
- "vite": "5.4.7",
50
- "@dxos/react-ui": "0.8.3",
51
- "@dxos/react-ui-theme": "0.8.3",
52
- "@dxos/storybook-utils": "0.8.3"
49
+ "@types/react": "~19.2.7",
50
+ "@types/react-dom": "~19.2.3",
51
+ "react": "~19.2.3",
52
+ "react-dom": "~19.2.3",
53
+ "vite": "7.1.9",
54
+ "@dxos/react-ui": "0.8.4-main.1068cf700f",
55
+ "@dxos/storybook-utils": "0.8.4-main.1068cf700f",
56
+ "@dxos/ui-theme": "0.8.4-main.1068cf700f"
53
57
  },
54
58
  "peerDependencies": {
55
- "@phosphor-icons/react": "^2.0.5",
56
- "effect": "^3.13.3",
57
- "react": "~18.2.0",
58
- "react-dom": "~18.2.0",
59
- "@dxos/react-ui": "0.8.3",
60
- "@dxos/react-ui-theme": "0.8.3"
59
+ "effect": "3.19.16",
60
+ "react": "~19.2.3",
61
+ "react-dom": "~19.2.3",
62
+ "@dxos/react-ui": "0.8.4-main.1068cf700f",
63
+ "@dxos/ui-theme": "0.8.4-main.1068cf700f"
61
64
  },
62
65
  "publishConfig": {
63
66
  "access": "public"
@@ -2,22 +2,15 @@
2
2
  // Copyright 2024 DXOS.org
3
3
  //
4
4
 
5
- import { Capabilities, contributes, defineModule, definePlugin, Events } from '@dxos/app-framework';
5
+ import { Plugin } from '@dxos/app-framework';
6
+ import { AppPlugin } from '@dxos/app-toolkit';
6
7
 
7
8
  import { ReactSurface } from './capabilities';
8
9
  import { meta } from './meta';
9
- import translations from './translations';
10
+ import { translations } from './translations';
10
11
 
11
- export const StatusBarPlugin = () =>
12
- definePlugin(meta, [
13
- defineModule({
14
- id: `${meta.id}/module/translations`,
15
- activatesOn: Events.SetupTranslations,
16
- activate: () => contributes(Capabilities.Translations, translations),
17
- }),
18
- defineModule({
19
- id: `${meta.id}/module/react-surface`,
20
- activatesOn: Events.SetupReactSurface,
21
- activate: ReactSurface,
22
- }),
23
- ]);
12
+ export const StatusBarPlugin = Plugin.define(meta).pipe(
13
+ AppPlugin.addSurfaceModule({ activate: ReactSurface }),
14
+ AppPlugin.addTranslationsModule({ translations }),
15
+ Plugin.make,
16
+ );
@@ -2,6 +2,4 @@
2
2
  // Copyright 2025 DXOS.org
3
3
  //
4
4
 
5
- import { lazy } from '@dxos/app-framework';
6
-
7
- export const ReactSurface = lazy(() => import('./react-surface'));
5
+ export * from './react-surface';
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Capability } from '@dxos/app-framework';
6
+
7
+ export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));
@@ -0,0 +1,39 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import * as Effect from 'effect/Effect';
6
+ import React from 'react';
7
+
8
+ import { Capabilities, Capability } from '@dxos/app-framework';
9
+ import { Surface } from '@dxos/app-framework/ui';
10
+
11
+ import { StatusBarActions, StatusBarPanel, VersionNumber } from '../../components';
12
+ import { meta } from '../../meta';
13
+
14
+ export default Capability.makeModule(() =>
15
+ Effect.succeed(
16
+ Capability.contributes(Capabilities.ReactSurface, [
17
+ Surface.create({
18
+ id: `${meta.id}/status-bar`,
19
+ role: 'status-bar',
20
+ component: () => <StatusBarPanel />,
21
+ }),
22
+ Surface.create({
23
+ id: `${meta.id}/status-bar--r0-footer`,
24
+ role: 'status-bar--r0-footer',
25
+ component: () => <Surface.Surface role='status' />,
26
+ }),
27
+ Surface.create({
28
+ id: `${meta.id}/status-bar--r1-footer`,
29
+ role: 'status-bar--r1-footer',
30
+ component: () => <StatusBarActions />,
31
+ }),
32
+ Surface.create({
33
+ id: `${meta.id}/header-end`,
34
+ role: 'header-end',
35
+ component: () => <VersionNumber />,
36
+ }),
37
+ ]),
38
+ ),
39
+ );
@@ -2,13 +2,11 @@
2
2
  // Copyright 2024 DXOS.org
3
3
  //
4
4
 
5
- import '@dxos-theme';
6
-
7
- import { type Meta } from '@storybook/react';
5
+ import { type Meta, type StoryObj } from '@storybook/react-vite';
8
6
  import React from 'react';
9
7
 
10
8
  import { Icon } from '@dxos/react-ui';
11
- import { withTheme } from '@dxos/storybook-utils';
9
+ import { withTheme } from '@dxos/react-ui/testing';
12
10
 
13
11
  import { StatusBar } from './StatusBar';
14
12
 
@@ -33,16 +31,15 @@ export const DefaultStory = () => (
33
31
  </div>
34
32
  );
35
33
 
36
- export const Default = {};
37
-
38
- const meta: Meta<typeof StatusBar> = {
34
+ const meta = {
39
35
  title: 'plugins/plugin-status/StatusBar',
40
36
  component: StatusBar as any,
41
37
  render: DefaultStory,
42
- decorators: [withTheme],
43
- parameters: {
44
- chromatic: { disableSnapshot: false },
45
- },
46
- };
38
+ decorators: [withTheme()],
39
+ } satisfies Meta<typeof StatusBar>;
47
40
 
48
41
  export default meta;
42
+
43
+ type Story = StoryObj<typeof meta>;
44
+
45
+ export const Default: Story = {};
@@ -3,10 +3,10 @@
3
3
  //
4
4
 
5
5
  import { Slot } from '@radix-ui/react-slot';
6
- import React, { type ComponentPropsWithRef, forwardRef, type PropsWithChildren, type ReactNode } from 'react';
6
+ import React, { type ComponentPropsWithRef, type PropsWithChildren, type ReactNode, forwardRef } from 'react';
7
7
 
8
8
  import { type ThemedClassName } from '@dxos/react-ui';
9
- import { mx } from '@dxos/react-ui-theme';
9
+ import { mx } from '@dxos/ui-theme';
10
10
 
11
11
  type StatusBarTextProps = ThemedClassName<{ children: ReactNode }>;
12
12
 
@@ -21,7 +21,7 @@ type StatusBarButtonProps = ThemedClassName<ComponentPropsWithRef<'button'> & {
21
21
  const StatusBarButton = forwardRef<HTMLButtonElement, StatusBarButtonProps>(
22
22
  ({ classNames, children, asChild, ...props }, forwardedRef) => {
23
23
  const classes = mx(
24
- 'flex items-center justify-center gap-2 p-1 px-2 rounded-sm',
24
+ 'flex items-center justify-center gap-2 p-1 pli-2 rounded-sm',
25
25
  'select-none cursor-pointer dx-focus-ring text-description text-xs',
26
26
  'hover:bg-neutral-75 active:bg-neutral-150 dark:hover:bg-neutral-750 dark:active:bg-neutral-700',
27
27
  classNames,
@@ -47,7 +47,7 @@ const StatusBarItem = forwardRef<HTMLDivElement, StatusBarItemProps>(
47
47
  ({ classNames, children, ...props }, forwardedRef) => (
48
48
  <div
49
49
  role='menuitem'
50
- className={mx('flex items-center justify-center gap-2 p-1 px-2 rounded-sm select-none', classNames)}
50
+ className={mx('flex items-center justify-center gap-2 p-1 pli-2 rounded-sm select-none', classNames)}
51
51
  ref={forwardedRef}
52
52
  {...props}
53
53
  >
@@ -4,16 +4,17 @@
4
4
 
5
5
  import React, { useState } from 'react';
6
6
 
7
- import { Surface } from '@dxos/app-framework';
7
+ import { Surface } from '@dxos/app-framework/ui';
8
8
  import { useConfig } from '@dxos/react-client';
9
9
  import { Icon, Popover, useTranslation } from '@dxos/react-ui';
10
10
 
11
+ import { meta } from '../meta';
12
+
11
13
  import { StatusBar } from './StatusBar';
12
14
  import { VersionNumber } from './VersionNumber';
13
- import { STATUS_BAR_PLUGIN } from '../meta';
14
15
 
15
16
  export const StatusBarActions = () => {
16
- const { t } = useTranslation(STATUS_BAR_PLUGIN);
17
+ const { t } = useTranslation(meta.id);
17
18
  const [open, setOpen] = useState(false);
18
19
 
19
20
  return (
@@ -41,7 +42,7 @@ export const StatusBarPanel = () => {
41
42
  <>
42
43
  <StatusBarActions />
43
44
  <span role='separator' className='grow' />
44
- <Surface role='status' />
45
+ <Surface.Surface role='status' />
45
46
  </>
46
47
  );
47
48
  };
@@ -67,7 +68,7 @@ const EnvironmentLabel = () => {
67
68
 
68
69
  return (
69
70
  <StatusBar.Item>
70
- <StatusBar.Text classNames='text-xs text-subdued border border-separator rounded-full px-1'>
71
+ <StatusBar.Text classNames='text-xs text-subdued border border-separator rounded-full pli-1'>
71
72
  <span title={edgeEnv}>{edgeEnv[0]}</span>
72
73
  </StatusBar.Text>
73
74
  </StatusBar.Item>
@@ -6,17 +6,18 @@ import { formatDistance } from 'date-fns/formatDistance';
6
6
  import React from 'react';
7
7
 
8
8
  import { useConfig } from '@dxos/react-client';
9
- import { Link, Message, Popover, Trans, useTranslation, Icon } from '@dxos/react-ui';
9
+ import { Icon, Link, Message, Popover, Trans, useTranslation } from '@dxos/react-ui';
10
+
11
+ import { meta } from '../meta';
10
12
 
11
13
  import { StatusBar } from './StatusBar';
12
- import { STATUS_BAR_PLUGIN } from '../meta';
13
14
 
14
15
  const repo = 'https://github.com/dxos/dxos';
15
16
 
16
17
  const VERSION_REGEX = /([\d.]+)/;
17
18
 
18
19
  export const VersionNumber = () => {
19
- const { t } = useTranslation(STATUS_BAR_PLUGIN);
20
+ const { t } = useTranslation(meta.id);
20
21
  const config = useConfig();
21
22
  const { version, timestamp, commitHash } = config.values.runtime?.app?.build ?? {};
22
23
  const [_, v] = version?.match(VERSION_REGEX) ?? [];
package/src/meta.ts CHANGED
@@ -2,13 +2,15 @@
2
2
  // Copyright 2024 DXOS.org
3
3
  //
4
4
 
5
- import { type PluginMeta } from '@dxos/app-framework';
5
+ import { type Plugin } from '@dxos/app-framework';
6
+ import { trim } from '@dxos/util';
6
7
 
7
- export const STATUS_BAR_PLUGIN = 'dxos.org/plugin/status-bar';
8
-
9
- export const meta: PluginMeta = {
10
- id: STATUS_BAR_PLUGIN,
8
+ export const meta: Plugin.Meta = {
9
+ id: 'dxos.org/plugin/status-bar',
11
10
  name: 'Status Bar',
12
- description: 'Display a bar with status and actions.',
11
+ description: trim`
12
+ Persistent bottom bar displaying workspace status information and quick actions.
13
+ Access connection state, notifications, and common commands without leaving your current context.
14
+ `,
13
15
  icon: 'ph--info--regular',
14
16
  };
@@ -2,45 +2,25 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { type useTranslation } from '@dxos/react-ui';
6
-
7
- import { STATUS_BAR_PLUGIN } from './meta';
8
-
9
- // TODO(wittjosiah): There's got to be a better way to do typesafe translations, this is too much boilerplate.
10
-
11
- type StatusBarTranslationKeys =
12
- | 'plugin name'
13
- | 'warning title'
14
- | 'technology preview message'
15
- | 'learn more label'
16
- | 'released message'
17
- | 'see release label'
18
- | 'powered by dxos message'
19
- | 'discord label'
20
- | 'github label'
21
- | 'feedback label';
22
-
23
- type RequiredTranslation = { [key in StatusBarTranslationKeys]: string };
24
- type TranslationEntry = { [STATUS_BAR_PLUGIN]: RequiredTranslation };
25
- type Language = string;
26
-
27
- // -- helpers.
28
- const entry = (translation: RequiredTranslation): TranslationEntry => ({ [STATUS_BAR_PLUGIN]: translation });
29
- export const mkTranslation = (t: ReturnType<typeof useTranslation>['t']) => (key: StatusBarTranslationKeys) => t(key);
30
-
31
- const translations: Record<Language, TranslationEntry> = {
32
- 'en-US': entry({
33
- 'plugin name': 'Status Bar',
34
- 'warning title': 'WARNING',
35
- 'technology preview message': 'Composer is currently in beta.',
36
- 'learn more label': 'Learn more',
37
- 'released message': 'This version released {{released}}.',
38
- 'see release label': 'See release on GitHub',
39
- 'powered by dxos message': 'Powered by <dxos>DXOS</dxos>',
40
- 'discord label': 'Discord',
41
- 'github label': 'GitHub',
42
- 'feedback label': 'Feedback',
43
- }),
44
- };
45
-
46
- export default [translations];
5
+ import { type Resource } from '@dxos/react-ui';
6
+
7
+ import { meta } from './meta';
8
+
9
+ export const translations = [
10
+ {
11
+ 'en-US': {
12
+ [meta.id]: {
13
+ 'plugin name': 'Status Bar',
14
+ 'warning title': 'WARNING',
15
+ 'technology preview message': 'Composer is currently in beta.',
16
+ 'learn more label': 'Learn more',
17
+ 'released message': 'This version released {{released}}.',
18
+ 'see release label': 'See release on GitHub',
19
+ 'powered by dxos message': 'Powered by <dxos>DXOS</dxos>',
20
+ 'discord label': 'Discord',
21
+ 'github label': 'GitHub',
22
+ 'feedback label': 'Feedback',
23
+ },
24
+ },
25
+ },
26
+ ] as const satisfies Resource[];
@@ -1,249 +0,0 @@
1
- // packages/plugins/plugin-status-bar/src/components/StatusBar.tsx
2
- import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
3
- import { Slot } from "@radix-ui/react-slot";
4
- import React, { forwardRef } from "react";
5
- import { mx } from "@dxos/react-ui-theme";
6
- var StatusBarText = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => {
7
- var _effect = _useSignals();
8
- try {
9
- return /* @__PURE__ */ React.createElement("span", {
10
- className: mx(classNames),
11
- ref: forwardedRef
12
- }, children);
13
- } finally {
14
- _effect.f();
15
- }
16
- });
17
- var StatusBarButton = /* @__PURE__ */ forwardRef(({ classNames, children, asChild, ...props }, forwardedRef) => {
18
- var _effect = _useSignals();
19
- try {
20
- 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);
21
- return asChild ? /* @__PURE__ */ React.createElement(Slot, {
22
- role: "button",
23
- ref: forwardedRef,
24
- className: classes,
25
- ...props
26
- }, children) : /* @__PURE__ */ React.createElement("button", {
27
- className: classes,
28
- ref: forwardedRef,
29
- ...props
30
- }, children);
31
- } finally {
32
- _effect.f();
33
- }
34
- });
35
- var StatusBarItem = /* @__PURE__ */ forwardRef(({ classNames, children, ...props }, forwardedRef) => {
36
- var _effect = _useSignals();
37
- try {
38
- return /* @__PURE__ */ React.createElement("div", {
39
- role: "menuitem",
40
- className: mx("flex items-center justify-center gap-2 p-1 px-2 rounded-sm select-none", classNames),
41
- ref: forwardedRef,
42
- ...props
43
- }, children);
44
- } finally {
45
- _effect.f();
46
- }
47
- });
48
- var StartContent = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => {
49
- var _effect = _useSignals();
50
- try {
51
- return /* @__PURE__ */ React.createElement("div", {
52
- role: "none",
53
- className: mx("flex-grow flex items-center space-x-2", classNames),
54
- ref: forwardedRef
55
- }, children);
56
- } finally {
57
- _effect.f();
58
- }
59
- });
60
- var EndContent = /* @__PURE__ */ forwardRef(({ classNames, children }, forwardedRef) => {
61
- var _effect = _useSignals();
62
- try {
63
- return /* @__PURE__ */ React.createElement("div", {
64
- role: "none",
65
- className: mx("flex-grow flex items-center justify-end", classNames),
66
- ref: forwardedRef
67
- }, children);
68
- } finally {
69
- _effect.f();
70
- }
71
- });
72
- var StatusBar = {
73
- Text: StatusBarText,
74
- Item: StatusBarItem,
75
- Button: StatusBarButton,
76
- StartContent,
77
- EndContent
78
- };
79
-
80
- // packages/plugins/plugin-status-bar/src/meta.ts
81
- var STATUS_BAR_PLUGIN = "dxos.org/plugin/status-bar";
82
- var meta = {
83
- id: STATUS_BAR_PLUGIN,
84
- name: "Status Bar",
85
- description: "Display a bar with status and actions.",
86
- icon: "ph--info--regular"
87
- };
88
-
89
- // packages/plugins/plugin-status-bar/src/components/VersionNumber.tsx
90
- import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
91
- import { formatDistance } from "date-fns/formatDistance";
92
- import React2 from "react";
93
- import { useConfig } from "@dxos/react-client";
94
- import { Link, Message, Popover, Trans, useTranslation, Icon } from "@dxos/react-ui";
95
- var repo = "https://github.com/dxos/dxos";
96
- var VERSION_REGEX = /([\d.]+)/;
97
- var VersionNumber = () => {
98
- var _effect = _useSignals2();
99
- try {
100
- const { t } = useTranslation(STATUS_BAR_PLUGIN);
101
- const config = useConfig();
102
- const { version, timestamp, commitHash } = config.values.runtime?.app?.build ?? {};
103
- const [_, v] = version?.match(VERSION_REGEX) ?? [];
104
- const isLabs = config.values.runtime?.app?.env?.DX_LABS;
105
- const releaseUrl = config.values.runtime?.app?.env?.DX_ENVIRONMENT === "production" ? `${repo}/releases/tag/v${version}` : `${repo}/commit/${commitHash}`;
106
- const previewUrl = "https://docs.dxos.org/composer#technology-preview";
107
- return /* @__PURE__ */ React2.createElement(Popover.Root, null, /* @__PURE__ */ React2.createElement(Popover.Trigger, {
108
- asChild: true
109
- }, /* @__PURE__ */ React2.createElement(StatusBar.Button, {
110
- classNames: "text-xs"
111
- }, isLabs ? version : v)), /* @__PURE__ */ React2.createElement(Popover.Portal, null, /* @__PURE__ */ React2.createElement(Popover.Content, {
112
- side: "top",
113
- role: "message",
114
- classNames: "z-[12] bg-warning-500 max-is-[min(calc(100vw-16px),40ch)]"
115
- }, /* @__PURE__ */ React2.createElement(Message.Root, {
116
- valence: "warning",
117
- classNames: "rounded-be-none p-5"
118
- }, /* @__PURE__ */ React2.createElement(Message.Title, null, t("warning title")), /* @__PURE__ */ React2.createElement(Message.Content, null, t("technology preview message"), /* @__PURE__ */ React2.createElement("br", null), /* @__PURE__ */ React2.createElement(Link, {
119
- href: previewUrl,
120
- target: "_blank",
121
- rel: "noreferrer",
122
- variant: "neutral"
123
- }, t("learn more label"), /* @__PURE__ */ React2.createElement(Icon, {
124
- icon: "ph--arrow-square-out--bold",
125
- classNames: "inline mis-1"
126
- })))), /* @__PURE__ */ React2.createElement("div", {
127
- role: "none",
128
- className: "plb-4 pli-5 space-b-2 text-baseText"
129
- }, timestamp && /* @__PURE__ */ React2.createElement("p", null, t("released message", {
130
- released: formatDistance(new Date(timestamp), /* @__PURE__ */ new Date(), {
131
- addSuffix: true
132
- })
133
- }), /* @__PURE__ */ React2.createElement("br", null), /* @__PURE__ */ React2.createElement(Link, {
134
- href: releaseUrl,
135
- target: "_blank",
136
- rel: "noreferrer",
137
- variant: "neutral"
138
- }, t("see release label"), /* @__PURE__ */ React2.createElement(Icon, {
139
- icon: "ph--arrow-square-out--bold",
140
- classNames: "inline mis-1"
141
- }))), /* @__PURE__ */ React2.createElement("p", null, /* @__PURE__ */ React2.createElement(Trans, {
142
- t,
143
- i18nKey: "powered by dxos message",
144
- components: {
145
- dxos: /* @__PURE__ */ React2.createElement(Link, {
146
- href: "https://dxos.org",
147
- target: "_blank",
148
- rel: "noreferrer",
149
- variant: "neutral"
150
- })
151
- }
152
- }))), /* @__PURE__ */ React2.createElement(Popover.Arrow, null))));
153
- } finally {
154
- _effect.f();
155
- }
156
- };
157
-
158
- // packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx
159
- import { useSignals as _useSignals3 } from "@preact-signals/safe-react/tracking";
160
- import React3, { useState } from "react";
161
- import { Surface } from "@dxos/app-framework";
162
- import { useConfig as useConfig2 } from "@dxos/react-client";
163
- import { Icon as Icon2, Popover as Popover2, useTranslation as useTranslation2 } from "@dxos/react-ui";
164
- var StatusBarActions = () => {
165
- var _effect = _useSignals3();
166
- try {
167
- const { t } = useTranslation2(STATUS_BAR_PLUGIN);
168
- const [open, setOpen] = useState(false);
169
- return /* @__PURE__ */ React3.createElement(Popover2.Root, {
170
- open,
171
- onOpenChange: setOpen
172
- }, /* @__PURE__ */ React3.createElement(EnvironmentLabel, null), /* @__PURE__ */ React3.createElement(VersionNumber, null), /* @__PURE__ */ React3.createElement(StatusBar.Button, {
173
- asChild: true
174
- }, /* @__PURE__ */ React3.createElement("a", {
175
- href: "https://dxos.org/discord",
176
- target: "_blank",
177
- rel: "noopener noreferrer"
178
- }, /* @__PURE__ */ React3.createElement(Icon2, {
179
- icon: "ph--discord-logo--regular",
180
- size: 4
181
- }), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
182
- classNames: "hidden sm:block"
183
- }, t("discord label")))), /* @__PURE__ */ React3.createElement(StatusBar.Button, {
184
- asChild: true
185
- }, /* @__PURE__ */ React3.createElement("a", {
186
- href: "https://github.com/dxos/dxos",
187
- target: "_blank",
188
- rel: "noopener noreferrer"
189
- }, /* @__PURE__ */ React3.createElement(Icon2, {
190
- icon: "ph--github-logo--regular",
191
- size: 4
192
- }), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
193
- classNames: "hidden sm:block"
194
- }, t("github label")))));
195
- } finally {
196
- _effect.f();
197
- }
198
- };
199
- var StatusBarPanel = () => {
200
- var _effect = _useSignals3();
201
- try {
202
- return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(StatusBarActions, null), /* @__PURE__ */ React3.createElement("span", {
203
- role: "separator",
204
- className: "grow"
205
- }), /* @__PURE__ */ React3.createElement(Surface, {
206
- role: "status"
207
- }));
208
- } finally {
209
- _effect.f();
210
- }
211
- };
212
- var ENV_LABELS = {
213
- "edge-dev": "Dev",
214
- "edge-main": "Main",
215
- "edge-labs": "Labs",
216
- "edge-production": "Production"
217
- };
218
- var EnvironmentLabel = () => {
219
- var _effect = _useSignals3();
220
- try {
221
- const config = useConfig2();
222
- const edgeUrl = config.values.runtime?.services?.edge?.url;
223
- if (!edgeUrl) {
224
- return null;
225
- }
226
- const part = new URL(edgeUrl).host.split(".")[0];
227
- const edgeEnv = ENV_LABELS[part];
228
- if (!edgeEnv) {
229
- return null;
230
- }
231
- return /* @__PURE__ */ React3.createElement(StatusBar.Item, null, /* @__PURE__ */ React3.createElement(StatusBar.Text, {
232
- classNames: "text-xs text-subdued border border-separator rounded-full px-1"
233
- }, /* @__PURE__ */ React3.createElement("span", {
234
- title: edgeEnv
235
- }, edgeEnv[0])));
236
- } finally {
237
- _effect.f();
238
- }
239
- };
240
-
241
- export {
242
- StatusBar,
243
- STATUS_BAR_PLUGIN,
244
- meta,
245
- VersionNumber,
246
- StatusBarActions,
247
- StatusBarPanel
248
- };
249
- //# sourceMappingURL=chunk-NV543FLZ.mjs.map