@dxos/plugin-status-bar 0.6.13 → 0.6.14-main.69511f5

package/dist/lib/browser/chunk-4KDZC7WS.mjs

@@ -0,0 +1,14 @@
+// packages/plugins/plugin-status-bar/src/meta.ts
+var STATUS_BAR_PLUGIN = "dxos.org/plugin/status-bar";
+var meta_default = {
+  id: STATUS_BAR_PLUGIN,
+  name: "Status Bar",
+  description: "Display a bar with status and actions.",
+  icon: "ph--info--regular"
+};
+
+export {
+  STATUS_BAR_PLUGIN,
+  meta_default
+};
+//# sourceMappingURL=chunk-4KDZC7WS.mjs.map

package/dist/lib/browser/chunk-4KDZC7WS.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/meta.ts"],
+  "sourcesContent": ["//\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 default {\n  id: STATUS_BAR_PLUGIN,\n  name: 'Status Bar',\n  description: 'Display a bar with status and actions.',\n  icon: 'ph--info--regular',\n} satisfies PluginMeta;\n"],
+  "mappings": ";AAMO,IAAMA,oBAAoB;AAEjC,IAAA,eAAe;EACbC,IAAID;EACJE,MAAM;EACNC,aAAa;EACbC,MAAM;AACR;",
+  "names": ["STATUS_BAR_PLUGIN", "id", "name", "description", "icon"]
+}

package/dist/lib/browser/index.mjs

@@ -1,7 +1,7 @@
 import {
   STATUS_BAR_PLUGIN,
   meta_default
-} from "./chunk-PL5XPTPX.mjs";
+} from "./chunk-4KDZC7WS.mjs";
 
 // packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx
 import React4 from "react";
@@ -42,7 +42,7 @@ var StatusBarContainer = /* @__PURE__ */ forwardRef(({ classNames, children }, f
     role: "menubar",
     tabIndex: 0,
     ...groupAttrs,
-    className: mx("bs-[--statusbar-size] flex justify-end items-center gap-2 border-bs border-separator bg-base text-description text-lg pointer-fine:text-xs ch-focus-ring-inset", classNames),
+    className: mx("bs-[--statusbar-size] flex justify-end items-center gap-2 bg-base text-description text-lg pointer-fine:text-xs ch-focus-ring-inset", classNames),
     ref: forwardedRef
   }, children);
 });
@@ -65,112 +65,20 @@ var StatusBar = {
   EndContent
 };
 
-// packages/plugins/plugin-status-bar/src/components/StatusBarImpl.tsx
-import { DiscordLogo, PaperPlaneTilt as PaperPlaneTilt2 } from "@phosphor-icons/react";
-import React3, { useState as useState2 } from "react";
+// packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx
+import React3, { useState } from "react";
 import { Surface } from "@dxos/app-framework";
-import { Popover as Popover2 } from "@dxos/react-ui";
+import { Icon, Popover as Popover2 } from "@dxos/react-ui";
 
 // packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx
-import { X, PaperPlaneTilt } from "@phosphor-icons/react";
-import React2, { useCallback as useCallback2 } from "react";
+import { Schema as S } from "@effect/schema";
+import { PaperPlaneTilt, X } from "@phosphor-icons/react";
+import React2, { useCallback } from "react";
 import { useIntentDispatcher } from "@dxos/app-framework";
-import { S as S2 } from "@dxos/echo-schema";
 import { Button, Input, Popover, useTranslation } from "@dxos/react-ui";
+import { useForm } from "@dxos/react-ui-data";
 import { getSize } from "@dxos/react-ui-theme";
 
-// packages/plugins/plugin-status-bar/src/hooks/useForm.ts
-import { useCallback, useState } from "react";
-var useForm = ({ initialValues: initialValues2, validate: validate2, onSubmit }) => {
-  const [values, setValues] = useState(initialValues2);
-  const [errors, setErrors] = useState({});
-  const [touched, setTouched] = useState(Object.keys(initialValues2).reduce((acc, key) => ({
-    ...acc,
-    [key]: false
-  }), {}));
-  const runValidation = useCallback((values2) => {
-    const validationErrors = validate2(values2);
-    setErrors(collapseErrorArray(validationErrors ?? []));
-    return validationErrors === void 0;
-  }, [
-    validate2
-  ]);
-  const handleChange = useCallback((event) => {
-    const { name, value } = event.target;
-    const newValues = {
-      ...values,
-      [name]: value
-    };
-    setValues(newValues);
-    runValidation(newValues);
-  }, [
-    values,
-    runValidation
-  ]);
-  const touchAll = useCallback(() => setTouched(mkAllTouched(values)), [
-    values,
-    setTouched
-  ]);
-  const handleBlur = useCallback((event) => {
-    const { name } = event.target;
-    setTouched((touched2) => ({
-      ...touched2,
-      [name]: true
-    }));
-    if (event.relatedTarget?.getAttribute("type") === "submit") {
-      touchAll();
-    }
-    runValidation(values);
-  }, [
-    runValidation,
-    values,
-    touchAll
-  ]);
-  const handleSubmit = useCallback(() => {
-    if (runValidation(values)) {
-      onSubmit(values);
-    }
-  }, [
-    values,
-    runValidation,
-    onSubmit
-  ]);
-  const canSubmit = Object.keys(values).every((key) => touched[key] === false || !errors[key]);
-  const getInputProps = useCallback((key) => ({
-    name: key,
-    value: values[key],
-    onChange: handleChange,
-    onBlur: handleBlur,
-    "aria-invalid": errors[key] !== void 0
-  }), [
-    values,
-    handleChange,
-    handleBlur,
-    errors
-  ]);
-  return {
-    values,
-    handleChange,
-    handleSubmit,
-    errors,
-    canSubmit,
-    touched,
-    handleBlur,
-    onValidate: runValidation,
-    getInputProps
-  };
-};
-var mkAllTouched = (values) => {
-  return Object.keys(values).reduce((acc, key) => ({
-    ...acc,
-    [key]: true
-  }), {});
-};
-var collapseErrorArray = (errors) => errors.reduce((acc, { path, message }) => {
-  acc[path] = message;
-  return acc;
-}, {});
-
 // packages/plugins/plugin-status-bar/src/translations.ts
 var entry = (translation) => ({
   [STATUS_BAR_PLUGIN]: translation
@@ -192,41 +100,22 @@ var translations_default = [
   translations
 ];
 
-// packages/plugins/plugin-status-bar/src/util/validation.ts
-import { ArrayFormatter } from "@effect/schema";
-import { Effect } from "effect";
-import { S } from "@dxos/echo-schema";
-var validate = (schema, data) => {
-  const validator = S.decodeUnknownEither(schema, {
-    errors: "all"
-  });
-  const result = validator(data);
-  if (result._tag === "Left") {
-    const errors = Effect.runSync(ArrayFormatter.formatError(result.left));
-    return errors.map(({ message, path }) => ({
-      message,
-      path: path.join(".")
-    }));
-  }
-  return void 0;
-};
-
 // packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx
-var Email = S2.String.pipe(S2.nonEmpty({
+var Email = S.String.pipe(S.nonEmptyString({
   message: () => "Email is required."
-}), S2.pattern(/^(?!\.)(?!.*\.\.)([A-Z0-9_+-.]*)[A-Z0-9_+-]@([A-Z0-9][A-Z0-9-]*\.)+[A-Z]{2,}$/i, {
+}), S.pattern(/^(?!\.)(?!.*\.\.)([A-Z0-9_+-.]*)[A-Z0-9_+-]@([A-Z0-9][A-Z0-9-]*\.)+[A-Z]{2,}$/i, {
   message: () => "Invalid email address."
 }));
-var nonEmpty = (field) => S2.nonEmpty({
+var nonEmpty = (field) => S.nonEmptyString({
   message: () => `${field} is required.`
 });
-var maxLength = (field, length) => S2.maxLength(length, {
+var maxLength = (field, length) => S.maxLength(length, {
   message: () => `${field} is too long.`
 });
-var FeedbackFormSchema = S2.Struct({
-  name: S2.String.pipe(nonEmpty("Name"), maxLength("Name", 256)),
+var FeedbackFormSchema = S.Struct({
+  name: S.String.pipe(nonEmpty("Name"), maxLength("Name", 256)),
   email: Email.pipe(maxLength("Email", 256)),
-  message: S2.String.pipe(nonEmpty("Feedback"), maxLength("Feedback", 32768))
+  message: S.String.pipe(nonEmpty("Feedback"), maxLength("Feedback", 32768))
 });
 var initialValues = {
   name: "",
@@ -237,7 +126,7 @@ var FeedbackForm = ({ onClose }) => {
   const { t } = useTranslation(STATUS_BAR_PLUGIN);
   const translation = mkTranslation(t);
   const dispatch = useIntentDispatcher();
-  const onSubmit = useCallback2((values) => {
+  const onSubmit = useCallback((values) => {
     void dispatch({
       action: "dxos.org/plugin/observability/capture-feedback",
       data: values
@@ -249,8 +138,8 @@ var FeedbackForm = ({ onClose }) => {
   ]);
   const { errors, handleSubmit, canSubmit, touched, getInputProps } = useForm({
     initialValues,
-    validate: (values) => validate(FeedbackFormSchema, values),
-    onSubmit: (values) => onSubmit(values)
+    schema: FeedbackFormSchema,
+    onSubmit
   });
   return /* @__PURE__ */ React2.createElement("div", {
     role: "form",
@@ -311,9 +200,9 @@ var FeedbackForm = ({ onClose }) => {
   })))));
 };
 
-// packages/plugins/plugin-status-bar/src/components/StatusBarImpl.tsx
-var StatusBarImpl = () => {
-  const [open, setOpen] = useState2(false);
+// packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx
+var StatusBarPanel = () => {
+  const [open, setOpen] = useState(false);
   return /* @__PURE__ */ React3.createElement(Popover2.Root, {
     open,
     onOpenChange: setOpen
@@ -322,7 +211,10 @@ var StatusBarImpl = () => {
   }, /* @__PURE__ */ React3.createElement(StatusBar.Button, {
     "aria-label": "Give feedback about composer",
     "data-joyride": "welcome/feedback"
-  }, /* @__PURE__ */ React3.createElement(PaperPlaneTilt2, null), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
+  }, /* @__PURE__ */ React3.createElement(Icon, {
+    icon: "ph--paper-plane-tilt--regular",
+    size: 4
+  }), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
     classNames: "hidden sm:block"
   }, "Feedback"))), /* @__PURE__ */ React3.createElement(StatusBar.Button, {
     "aria-label": "Open DXOS Discord",
@@ -331,7 +223,10 @@ var StatusBarImpl = () => {
     href: "https://dxos.org/discord",
     target: "_blank",
     rel: "noopener noreferrer"
-  }, /* @__PURE__ */ React3.createElement(DiscordLogo, null), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
+  }, /* @__PURE__ */ React3.createElement(Icon, {
+    icon: "ph--discord-logo--regular",
+    size: 4
+  }), /* @__PURE__ */ React3.createElement(StatusBar.Text, {
     classNames: "hidden sm:block"
   }, "Discord")))), /* @__PURE__ */ React3.createElement(Surface, {
     role: "status"
@@ -352,7 +247,7 @@ var StatusBarPlugin = () => {
         component: ({ role }) => {
           switch (role) {
             case "status-bar": {
-              return /* @__PURE__ */ React4.createElement(StatusBarImpl, null);
+              return /* @__PURE__ */ React4.createElement(StatusBarPanel, null);
             }
           }
           return null;
@@ -366,7 +261,7 @@ var StatusBarPlugin = () => {
 var src_default = StatusBarPlugin;
 export {
   StatusBar,
-  StatusBarImpl,
+  StatusBarPanel,
   StatusBarPlugin,
   src_default as default
 };

package/dist/lib/browser/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/StatusBarPlugin.tsx", "../../../src/components/StatusBar.tsx", "../../../src/components/StatusBarImpl.tsx", "../../../src/components/FeedbackForm.tsx", "../../../src/hooks/useForm.ts", "../../../src/translations.ts", "../../../src/util/validation.ts", "../../../src/index.ts"],
-  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type PluginDefinition, type SurfaceProvides, type TranslationsProvides } from '@dxos/app-framework';\n\nimport { StatusBarImpl } from './components';\nimport meta from './meta';\nimport translations from './translations';\n\nexport type StatusBarPluginProvides = SurfaceProvides & TranslationsProvides;\n\nexport const StatusBarPlugin = (): PluginDefinition<StatusBarPluginProvides> => {\n  return {\n    meta,\n    provides: {\n      translations,\n      surface: {\n        component: ({ role }) => {\n          switch (role) {\n            case 'status-bar': {\n              return <StatusBarImpl />;\n            }\n          }\n\n          return null;\n        },\n      },\n    },\n  };\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef, type HTMLAttributes, 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<{ children: ReactNode; asChild?: boolean }> &\n  HTMLAttributes<HTMLButtonElement>;\n\nconst StatusBarButton = forwardRef<HTMLButtonElement, StatusBarButtonProps>(\n  ({ classNames, children, asChild, ...props }, forwardedRef) => {\n    const classes = mx(\n      'flex items-center gap-2 p-1 px-2 rounded-sm',\n      'select-none cursor-pointer ch-focus-ring',\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<{ children: ReactNode }> & HTMLAttributes<HTMLDivElement>;\n\nconst StatusBarItem = forwardRef<HTMLDivElement, StatusBarItemProps>(\n  ({ classNames, children, ...props }, forwardedRef) => (\n    <div\n      role='menuitem'\n      className={mx('flex items-center gap-2 p-1 px-2 rounded-sm select-none', classNames)}\n      ref={forwardedRef}\n      {...props}\n    >\n      {children}\n    </div>\n  ),\n);\ntype StatusBarContainerProps = ThemedClassName<{ children: ReactNode }>;\n\n// TODO(zan): tabable group with tabster\nconst StatusBarContainer = forwardRef<HTMLDivElement, StatusBarContainerProps>(\n  ({ classNames, children }, forwardedRef) => {\n    const groupAttrs = useFocusableGroup({ tabBehavior: 'limited' });\n    return (\n      <div\n        role='menubar'\n        tabIndex={0}\n        {...groupAttrs}\n        className={mx(\n          'bs-[--statusbar-size] flex justify-end items-center gap-2 border-bs border-separator bg-base text-description text-lg pointer-fine:text-xs ch-focus-ring-inset',\n          classNames,\n        )}\n        ref={forwardedRef}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\ntype StartContentProps = ThemedClassName<{ children: ReactNode }>;\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<{ children: ReactNode }>;\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  Container: StatusBarContainer,\n  Text: StatusBarText,\n  Item: StatusBarItem,\n  Button: StatusBarButton,\n  StartContent,\n  EndContent,\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { DiscordLogo, PaperPlaneTilt } from '@phosphor-icons/react';\nimport React, { useState } from 'react';\n\nimport { Surface } from '@dxos/app-framework';\nimport { Popover } from '@dxos/react-ui';\n\nimport { FeedbackForm } from './FeedbackForm';\nimport { StatusBar } from './StatusBar';\n\n// TODO(wittjosiah): Rename.\nexport const StatusBarImpl = () => {\n  const [open, setOpen] = useState(false);\n\n  // TODO(wittjosiah): Factor out feedback and discord buttons.\n  return (\n    <Popover.Root open={open} onOpenChange={setOpen}>\n      <StatusBar.Container>\n        <StatusBar.EndContent>\n          <Popover.Trigger asChild>\n            <StatusBar.Button aria-label='Give feedback about composer' data-joyride='welcome/feedback'>\n              <PaperPlaneTilt />\n              <StatusBar.Text classNames='hidden sm:block'>Feedback</StatusBar.Text>\n            </StatusBar.Button>\n          </Popover.Trigger>\n          {/* TODO(zan): Configure this label? */}\n          <StatusBar.Button aria-label='Open DXOS Discord' asChild>\n            <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>\n              <DiscordLogo />\n              <StatusBar.Text classNames='hidden sm:block'>Discord</StatusBar.Text>\n            </a>\n          </StatusBar.Button>\n        </StatusBar.EndContent>\n        <Surface role='status' />\n      </StatusBar.Container>\n      <Popover.Content classNames='shadow-lg'>\n        <FeedbackForm onClose={() => setOpen(false)} />\n        <Popover.Arrow />\n      </Popover.Content>\n    </Popover.Root>\n  );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { X, PaperPlaneTilt } from '@phosphor-icons/react';\nimport React, { useCallback } from 'react';\n\nimport { useIntentDispatcher } from '@dxos/app-framework';\nimport { S } from '@dxos/echo-schema';\nimport { Button, Input, Popover, useTranslation } from '@dxos/react-ui';\nimport { getSize } from '@dxos/react-ui-theme';\n\nimport { useForm } from '../hooks';\nimport { STATUS_BAR_PLUGIN } from '../meta';\nimport { mkTranslation } from '../translations';\nimport { validate } from '../util';\n\nconst Email = S.String.pipe(\n  S.nonEmpty({ message: () => 'Email is required.' }),\n  S.pattern(/^(?!\\.)(?!.*\\.\\.)([A-Z0-9_+-.]*)[A-Z0-9_+-]@([A-Z0-9][A-Z0-9-]*\\.)+[A-Z]{2,}$/i, {\n    message: () => 'Invalid email address.',\n  }),\n);\n\nconst nonEmpty = (field: string) => S.nonEmpty({ message: () => `${field} is required.` });\nconst maxLength = (field: string, length: number) => S.maxLength(length, { message: () => `${field} is too long.` });\n\n// -- Types and validation.\nconst FeedbackFormSchema = S.Struct({\n  name: S.String.pipe(nonEmpty('Name'), maxLength('Name', 256)),\n  email: Email.pipe(maxLength('Email', 256)),\n  message: S.String.pipe(nonEmpty('Feedback'), maxLength('Feedback', 32_768)),\n});\n\ntype FeedbackFormState = S.Schema.Type<typeof FeedbackFormSchema>;\n\nconst initialValues: FeedbackFormState = { name: '', email: '', message: '' };\n\nexport const FeedbackForm = ({ onClose }: { onClose: () => void }) => {\n  const { t } = useTranslation(STATUS_BAR_PLUGIN);\n  const translation = mkTranslation(t);\n  const dispatch = useIntentDispatcher();\n\n  const onSubmit = useCallback(\n    (values: FeedbackFormState) => {\n      void dispatch({ action: 'dxos.org/plugin/observability/capture-feedback', data: values });\n      onClose();\n    },\n    [dispatch, onClose],\n  );\n\n  const { errors, handleSubmit, canSubmit, touched, getInputProps } = useForm<FeedbackFormState>({\n    initialValues,\n    validate: (values) => validate(FeedbackFormSchema, values),\n    onSubmit: (values) => onSubmit(values),\n  });\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={touched.name && errors.name ? 'error' : undefined}>\n          <Input.Label>{translation('name label')}</Input.Label>\n          <Input.TextInput\n            classNames={'text-sm'}\n            placeholder={translation('name placeholder')}\n            autoFocus\n            {...getInputProps('name')}\n          />\n          <Input.DescriptionAndValidation>\n            <Input.Validation>{touched.name && errors.name}</Input.Validation>\n          </Input.DescriptionAndValidation>\n        </Input.Root>\n      </div>\n\n      <div role='none' className='space-b-1'>\n        <Input.Root validationValence={touched.email && errors.email ? 'error' : undefined}>\n          <Input.Label>{translation('email input label')}</Input.Label>\n          <Input.TextInput\n            classNames={'text-sm'}\n            placeholder={translation('email input placeholder')}\n            {...getInputProps('email')}\n          />\n          <Input.DescriptionAndValidation>\n            <Input.Validation>{touched.email && errors.email}</Input.Validation>\n          </Input.DescriptionAndValidation>\n        </Input.Root>\n      </div>\n\n      <div role='none' className='space-b-1'>\n        <Input.Root validationValence={touched.message && errors.message ? 'error' : undefined}>\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            {...getInputProps('message')}\n          />\n          <Input.DescriptionAndValidation>\n            <Input.Validation>{touched.message && errors.message}</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={!canSubmit}\n          onClick={handleSubmit}\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", "//\n// Copyright 2024 DXOS.org\n//\nimport { type ChangeEvent, useCallback, useState } from 'react';\n\nimport { type ValidationError } from '../util';\n\n// TODO(Zan): This module will be generally useful and we should factor it out after the\n// API crystallizes a bit more.\n\ninterface FormOptions<T> {\n  initialValues: T;\n  validate: (values: any) => ValidationError[] | undefined;\n  onSubmit: (values: T) => void;\n}\n\n/**\n * Creates a hook for managing form state, including values, validation, and submission.\n *\n * @example\n * const { values, handleChange, handleSubmit, errors, canSubmit, getInputProps } = useForm({\n *   initialValues: { name: '', email: '' },\n *   validate: (values) => { yourValidationLogic(values); },\n *   onSubmit: (values) => { submissionLogic(values); },\n * });\n */\nexport const useForm = <T extends object>({ initialValues, validate, onSubmit }: FormOptions<T>) => {\n  const [values, setValues] = useState<T>(initialValues);\n  const [errors, setErrors] = useState<Record<keyof T, string>>({} as Record<keyof T, string>);\n  const [touched, setTouched] = useState<Record<keyof T, boolean>>(\n    Object.keys(initialValues).reduce((acc, key) => ({ ...acc, [key]: false }), {} as Record<keyof T, boolean>),\n  );\n\n  const runValidation = useCallback(\n    (values: T) => {\n      const validationErrors = validate(values);\n      setErrors(collapseErrorArray(validationErrors ?? []));\n\n      return validationErrors === undefined;\n    },\n    [validate],\n  );\n\n  const handleChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      const { name, value } = event.target;\n      const newValues = { ...values, [name]: value };\n      setValues(newValues);\n      runValidation(newValues);\n    },\n    [values, runValidation],\n  );\n\n  const touchAll = useCallback(() => setTouched(mkAllTouched(values)), [values, setTouched]);\n\n  const handleBlur = useCallback(\n    (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      const { name } = event.target;\n      setTouched((touched) => ({ ...touched, [name]: true }));\n\n      // TODO(Zan): This should be configurable behavior.\n      if (event.relatedTarget?.getAttribute('type') === 'submit') {\n        // NOTE: We do this here instead of onSubmit, because the blur event is triggered before the submit event\n        //       and results in the submit button being disabled when the form is invalid.\n        touchAll();\n      }\n\n      runValidation(values);\n    },\n    [runValidation, values, touchAll],\n  );\n\n  const handleSubmit = useCallback(() => {\n    if (runValidation(values)) {\n      onSubmit(values);\n    }\n  }, [values, runValidation, onSubmit]);\n\n  // NOTE: We can submit if there is no touched field that has an error.\n  // - Basically, if there's a validation message present in the form, submit should be disabled.\n  const canSubmit = Object.keys(values).every((key) => touched[key as keyof T] === false || !errors[key as keyof T]);\n\n  const getInputProps = useCallback(\n    (key: keyof T) => ({\n      name: key,\n      value: values[key],\n      onChange: handleChange,\n      onBlur: handleBlur,\n      'aria-invalid': errors[key] !== undefined,\n    }),\n    [values, handleChange, handleBlur, errors],\n  );\n\n  return {\n    values,\n    handleChange,\n    handleSubmit,\n    errors,\n    canSubmit,\n    touched,\n    handleBlur,\n    onValidate: runValidation,\n    getInputProps,\n  };\n};\n\nconst mkAllTouched = <T extends Record<keyof T, any>>(values: T) => {\n  return Object.keys(values).reduce((acc, key) => ({ ...acc, [key]: true }), {} as Record<keyof T, boolean>);\n};\n\nconst collapseErrorArray = <T>(errors: ValidationError[]) =>\n  errors.reduce(\n    (acc, { path, message }) => {\n      // TODO(Zan): This won't play well with nesting.\n      acc[path as keyof T] = message;\n      return acc;\n    },\n    {} as Record<keyof T, string>,\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\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': 'Found a bug? Have a suggestion? Let us know!',\n    'send feedback label': 'Send Feedback',\n  }),\n};\n\nexport default [translations];\n", "//\n// Copyright 2024 DXOS.org\n//\nimport { ArrayFormatter } from '@effect/schema';\nimport { Effect } from 'effect';\n\nimport { S } from '@dxos/echo-schema';\n\nexport type ValidationError = { path: string; message: string };\n\nexport const validate = <T>(schema: S.Schema<T>, data: any): ValidationError[] | undefined => {\n  const validator = S.decodeUnknownEither(schema, { errors: 'all' });\n  const result = validator(data);\n\n  if (result._tag === 'Left') {\n    const errors = Effect.runSync(ArrayFormatter.formatError(result.left));\n    // TODO(Zan): Path.join is an assumption...\n    return errors.map(({ message, path }) => ({ message, path: path.join('.') }));\n  }\n\n  return undefined;\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { StatusBarPlugin } from './StatusBarPlugin';\n\nexport default StatusBarPlugin;\n\nexport * from './StatusBarPlugin';\nexport * from './components';\n"],
-  "mappings": "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",
-  "names": ["React", "useFocusableGroup", "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", "StatusBarContainer", "groupAttrs", "useFocusableGroup", "tabBehavior", "tabIndex", "StartContent", "EndContent", "StatusBar", "Container", "Text", "StatusBarText", "Item", "Button", "StatusBarButton", "DiscordLogo", "PaperPlaneTilt", "React", "useState", "Surface", "Popover", "X", "PaperPlaneTilt", "React", "useCallback", "useIntentDispatcher", "S", "Button", "Input", "Popover", "useTranslation", "getSize", "useCallback", "useState", "useForm", "initialValues", "validate", "onSubmit", "values", "setValues", "useState", "errors", "setErrors", "touched", "setTouched", "Object", "keys", "reduce", "acc", "key", "runValidation", "useCallback", "validationErrors", "collapseErrorArray", "undefined", "handleChange", "event", "name", "value", "target", "newValues", "touchAll", "mkAllTouched", "handleBlur", "relatedTarget", "getAttribute", "handleSubmit", "canSubmit", "every", "getInputProps", "onChange", "onBlur", "onValidate", "path", "message", "entry", "translation", "STATUS_BAR_PLUGIN", "mkTranslation", "t", "key", "translations", "ArrayFormatter", "Effect", "S", "validate", "schema", "data", "validator", "S", "decodeUnknownEither", "errors", "result", "_tag", "Effect", "runSync", "ArrayFormatter", "formatError", "left", "map", "message", "path", "join", "undefined", "Email", "S", "String", "pipe", "nonEmpty", "message", "pattern", "field", "maxLength", "length", "FeedbackFormSchema", "Struct", "name", "email", "initialValues", "FeedbackForm", "onClose", "t", "useTranslation", "STATUS_BAR_PLUGIN", "translation", "mkTranslation", "dispatch", "useIntentDispatcher", "onSubmit", "useCallback", "values", "action", "data", "errors", "handleSubmit", "canSubmit", "touched", "getInputProps", "useForm", "validate", "React", "div", "role", "className", "Input", "Root", "validationValence", "undefined", "Label", "TextInput", "classNames", "placeholder", "autoFocus", "DescriptionAndValidation", "Validation", "TextArea", "rows", "cols", "Button", "type", "variant", "disabled", "onClick", "span", "PaperPlaneTilt", "getSize", "Popover", "Close", "asChild", "ns", "X", "StatusBarImpl", "open", "setOpen", "useState", "React", "Popover", "Root", "onOpenChange", "StatusBar", "Container", "EndContent", "Trigger", "asChild", "Button", "aria-label", "data-joyride", "PaperPlaneTilt", "Text", "classNames", "a", "href", "target", "rel", "DiscordLogo", "Surface", "role", "Content", "FeedbackForm", "onClose", "Arrow", "StatusBarPlugin", "meta", "provides", "translations", "surface", "component", "role", "React", "StatusBarImpl", "StatusBarPlugin"]
+  "sources": ["../../../src/StatusBarPlugin.tsx", "../../../src/components/StatusBar.tsx", "../../../src/components/StatusBarPanel.tsx", "../../../src/components/FeedbackForm.tsx", "../../../src/translations.ts", "../../../src/index.ts"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type PluginDefinition, type SurfaceProvides, type TranslationsProvides } from '@dxos/app-framework';\n\nimport { StatusBarPanel } from './components';\nimport meta from './meta';\nimport translations from './translations';\n\nexport type StatusBarPluginProvides = SurfaceProvides & TranslationsProvides;\n\nexport const StatusBarPlugin = (): PluginDefinition<StatusBarPluginProvides> => {\n  return {\n    meta,\n    provides: {\n      translations,\n      surface: {\n        component: ({ role }) => {\n          switch (role) {\n            case 'status-bar': {\n              return <StatusBarPanel />;\n            }\n          }\n\n          return null;\n        },\n      },\n    },\n  };\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { forwardRef, type HTMLAttributes, 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<{ children: ReactNode; asChild?: boolean }> &\n  HTMLAttributes<HTMLButtonElement>;\n\nconst StatusBarButton = forwardRef<HTMLButtonElement, StatusBarButtonProps>(\n  ({ classNames, children, asChild, ...props }, forwardedRef) => {\n    const classes = mx(\n      'flex items-center gap-2 p-1 px-2 rounded-sm',\n      'select-none cursor-pointer ch-focus-ring',\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<{ children: ReactNode }> & HTMLAttributes<HTMLDivElement>;\n\nconst StatusBarItem = forwardRef<HTMLDivElement, StatusBarItemProps>(\n  ({ classNames, children, ...props }, forwardedRef) => (\n    <div\n      role='menuitem'\n      className={mx('flex items-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 StatusBarContainerProps = ThemedClassName<{ children: ReactNode }>;\n\n// TODO(zan): tabable group with tabster.\nconst StatusBarContainer = forwardRef<HTMLDivElement, StatusBarContainerProps>(\n  ({ classNames, children }, forwardedRef) => {\n    const groupAttrs = useFocusableGroup({ tabBehavior: 'limited' });\n    return (\n      <div\n        role='menubar'\n        tabIndex={0}\n        {...groupAttrs}\n        className={mx(\n          'bs-[--statusbar-size] flex justify-end items-center gap-2 bg-base text-description text-lg pointer-fine:text-xs ch-focus-ring-inset',\n          classNames,\n        )}\n        ref={forwardedRef}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\ntype StartContentProps = ThemedClassName<{ children: ReactNode }>;\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<{ children: ReactNode }>;\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  Container: StatusBarContainer,\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 } from '@dxos/react-ui';\n\nimport { FeedbackForm } from './FeedbackForm';\nimport { StatusBar } from './StatusBar';\n\nexport const StatusBarPanel = () => {\n  const [open, setOpen] = useState(false);\n\n  // TODO(wittjosiah): Factor out feedback and discord buttons.\n  return (\n    <Popover.Root open={open} onOpenChange={setOpen}>\n      <StatusBar.Container>\n        <StatusBar.EndContent>\n          <Popover.Trigger asChild>\n            <StatusBar.Button aria-label='Give feedback about composer' data-joyride='welcome/feedback'>\n              <Icon icon='ph--paper-plane-tilt--regular' size={4} />\n              <StatusBar.Text classNames='hidden sm:block'>Feedback</StatusBar.Text>\n            </StatusBar.Button>\n          </Popover.Trigger>\n          {/* TODO(zan): Configure this label? */}\n          <StatusBar.Button aria-label='Open DXOS Discord' 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'>Discord</StatusBar.Text>\n            </a>\n          </StatusBar.Button>\n        </StatusBar.EndContent>\n        <Surface role='status' />\n      </StatusBar.Container>\n      <Popover.Content classNames='shadow-lg'>\n        <FeedbackForm onClose={() => setOpen(false)} />\n        <Popover.Arrow />\n      </Popover.Content>\n    </Popover.Root>\n  );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { Schema as S } from '@effect/schema';\nimport { PaperPlaneTilt, X } from '@phosphor-icons/react';\nimport React, { useCallback } from 'react';\n\nimport { useIntentDispatcher } from '@dxos/app-framework';\nimport { Button, Input, Popover, useTranslation } from '@dxos/react-ui';\nimport { useForm } from '@dxos/react-ui-data';\nimport { getSize } from '@dxos/react-ui-theme';\n\nimport { STATUS_BAR_PLUGIN } from '../meta';\nimport { mkTranslation } from '../translations';\n\nconst Email = S.String.pipe(\n  S.nonEmptyString({ message: () => 'Email is required.' }),\n  S.pattern(/^(?!\\.)(?!.*\\.\\.)([A-Z0-9_+-.]*)[A-Z0-9_+-]@([A-Z0-9][A-Z0-9-]*\\.)+[A-Z]{2,}$/i, {\n    message: () => 'Invalid email address.',\n  }),\n);\n\nconst nonEmpty = (field: string) => S.nonEmptyString({ message: () => `${field} is required.` });\nconst maxLength = (field: string, length: number) => S.maxLength(length, { message: () => `${field} is too long.` });\n\n// Types and validation.\nconst FeedbackFormSchema = S.Struct({\n  name: S.String.pipe(nonEmpty('Name'), maxLength('Name', 256)),\n  email: Email.pipe(maxLength('Email', 256)),\n  message: S.String.pipe(nonEmpty('Feedback'), maxLength('Feedback', 32_768)),\n});\n\ntype FeedbackFormState = S.Schema.Type<typeof FeedbackFormSchema>;\n\nconst initialValues: FeedbackFormState = { name: '', email: '', message: '' };\n\nexport const FeedbackForm = ({ onClose }: { onClose: () => void }) => {\n  const { t } = useTranslation(STATUS_BAR_PLUGIN);\n  const translation = mkTranslation(t);\n  const dispatch = useIntentDispatcher();\n\n  const onSubmit = useCallback(\n    (values: FeedbackFormState) => {\n      void dispatch({ action: 'dxos.org/plugin/observability/capture-feedback', data: values });\n      onClose();\n    },\n    [dispatch, onClose],\n  );\n\n  const { errors, handleSubmit, canSubmit, touched, getInputProps } = useForm<FeedbackFormState>({\n    initialValues,\n    schema: FeedbackFormSchema,\n    onSubmit,\n  });\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={touched.name && errors.name ? 'error' : undefined}>\n          <Input.Label>{translation('name label')}</Input.Label>\n          <Input.TextInput\n            classNames={'text-sm'}\n            placeholder={translation('name placeholder')}\n            autoFocus\n            {...getInputProps('name')}\n          />\n          <Input.DescriptionAndValidation>\n            <Input.Validation>{touched.name && errors.name}</Input.Validation>\n          </Input.DescriptionAndValidation>\n        </Input.Root>\n      </div>\n\n      <div role='none' className='space-b-1'>\n        <Input.Root validationValence={touched.email && errors.email ? 'error' : undefined}>\n          <Input.Label>{translation('email input label')}</Input.Label>\n          <Input.TextInput\n            classNames={'text-sm'}\n            placeholder={translation('email input placeholder')}\n            {...getInputProps('email')}\n          />\n          <Input.DescriptionAndValidation>\n            <Input.Validation>{touched.email && errors.email}</Input.Validation>\n          </Input.DescriptionAndValidation>\n        </Input.Root>\n      </div>\n\n      <div role='none' className='space-b-1'>\n        <Input.Root validationValence={touched.message && errors.message ? 'error' : undefined}>\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            {...getInputProps('message')}\n          />\n          <Input.DescriptionAndValidation>\n            <Input.Validation>{touched.message && errors.message}</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={!canSubmit}\n          onClick={handleSubmit}\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", "//\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\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': 'Found a bug? Have a suggestion? Let us know!',\n    'send feedback label': 'Send Feedback',\n  }),\n};\n\nexport default [translations];\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { StatusBarPlugin } from './StatusBarPlugin';\n\nexport default StatusBarPlugin;\n\nexport * from './StatusBarPlugin';\nexport * from './components';\n"],
+  "mappings": "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",
+  "names": ["React", "useFocusableGroup", "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", "StatusBarContainer", "groupAttrs", "useFocusableGroup", "tabBehavior", "tabIndex", "StartContent", "EndContent", "StatusBar", "Container", "Text", "StatusBarText", "Item", "Button", "StatusBarButton", "React", "useState", "Surface", "Icon", "Popover", "Schema", "S", "PaperPlaneTilt", "X", "React", "useCallback", "useIntentDispatcher", "Button", "Input", "Popover", "useTranslation", "useForm", "getSize", "entry", "translation", "STATUS_BAR_PLUGIN", "mkTranslation", "t", "key", "translations", "Email", "S", "String", "pipe", "nonEmptyString", "message", "pattern", "nonEmpty", "field", "maxLength", "length", "FeedbackFormSchema", "Struct", "name", "email", "initialValues", "FeedbackForm", "onClose", "t", "useTranslation", "STATUS_BAR_PLUGIN", "translation", "mkTranslation", "dispatch", "useIntentDispatcher", "onSubmit", "useCallback", "values", "action", "data", "errors", "handleSubmit", "canSubmit", "touched", "getInputProps", "useForm", "schema", "React", "div", "role", "className", "Input", "Root", "validationValence", "undefined", "Label", "TextInput", "classNames", "placeholder", "autoFocus", "DescriptionAndValidation", "Validation", "TextArea", "rows", "cols", "Button", "type", "variant", "disabled", "onClick", "span", "PaperPlaneTilt", "getSize", "Popover", "Close", "asChild", "ns", "X", "StatusBarPanel", "open", "setOpen", "useState", "React", "Popover", "Root", "onOpenChange", "StatusBar", "Container", "EndContent", "Trigger", "asChild", "Button", "aria-label", "data-joyride", "Icon", "icon", "size", "Text", "classNames", "a", "href", "target", "rel", "Surface", "role", "Content", "FeedbackForm", "onClose", "Arrow", "StatusBarPlugin", "meta", "provides", "translations", "surface", "component", "role", "React", "StatusBarPanel", "StatusBarPlugin"]
 }

package/dist/lib/browser/meta.json

@@ -1 +1 @@
-{"inputs":{"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx":{"bytes":9987,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-status-bar/src/hooks/useForm.ts":{"bytes":12419,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-status-bar/src/hooks/index.ts":{"bytes":511,"imports":[{"path":"packages/plugins/plugin-status-bar/src/hooks/useForm.ts","kind":"import-statement","original":"./useForm"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/meta.tsx":{"bytes":1914,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-status-bar/src/translations.ts":{"bytes":3385,"imports":[{"path":"packages/plugins/plugin-status-bar/src/meta.tsx","kind":"import-statement","original":"./meta"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/util/validation.ts":{"bytes":2821,"imports":[{"path":"@effect/schema","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-status-bar/src/util/index.ts":{"bytes":517,"imports":[{"path":"packages/plugins/plugin-status-bar/src/util/validation.ts","kind":"import-statement","original":"./validation"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx":{"bytes":16753,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-status-bar/src/hooks/index.ts","kind":"import-statement","original":"../hooks"},{"path":"packages/plugins/plugin-status-bar/src/meta.tsx","kind":"import-statement","original":"../meta"},{"path":"packages/plugins/plugin-status-bar/src/translations.ts","kind":"import-statement","original":"../translations"},{"path":"packages/plugins/plugin-status-bar/src/util/index.ts","kind":"import-statement","original":"../util"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/components/StatusBarImpl.tsx":{"bytes":6009,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx","kind":"import-statement","original":"./FeedbackForm"},{"path":"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx","kind":"import-statement","original":"./StatusBar"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/components/index.ts":{"bytes":623,"imports":[{"path":"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx","kind":"import-statement","original":"./StatusBar"},{"path":"packages/plugins/plugin-status-bar/src/components/StatusBarImpl.tsx","kind":"import-statement","original":"./StatusBarImpl"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx":{"bytes":2657,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-status-bar/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/plugins/plugin-status-bar/src/meta.tsx","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-status-bar/src/translations.ts","kind":"import-statement","original":"./translations"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/index.ts":{"bytes":916,"imports":[{"path":"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx","kind":"import-statement","original":"./StatusBarPlugin"},{"path":"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx","kind":"import-statement","original":"./StatusBarPlugin"},{"path":"packages/plugins/plugin-status-bar/src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-status-bar/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":28237},"packages/plugins/plugin-status-bar/dist/lib/browser/index.mjs":{"imports":[{"path":"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-PL5XPTPX.mjs","kind":"import-statement"},{"path":"react","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@effect/schema","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/echo-schema","kind":"import-statement","external":true}],"exports":["StatusBar","StatusBarImpl","StatusBarPlugin","default"],"entryPoint":"packages/plugins/plugin-status-bar/src/index.ts","inputs":{"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx":{"bytesInOutput":423},"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx":{"bytesInOutput":2505},"packages/plugins/plugin-status-bar/src/components/index.ts":{"bytesInOutput":0},"packages/plugins/plugin-status-bar/src/components/StatusBarImpl.tsx":{"bytesInOutput":1697},"packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx":{"bytesInOutput":4748},"packages/plugins/plugin-status-bar/src/hooks/useForm.ts":{"bytesInOutput":2228},"packages/plugins/plugin-status-bar/src/hooks/index.ts":{"bytesInOutput":0},"packages/plugins/plugin-status-bar/src/translations.ts":{"bytesInOutput":570},"packages/plugins/plugin-status-bar/src/util/validation.ts":{"bytesInOutput":497},"packages/plugins/plugin-status-bar/src/util/index.ts":{"bytesInOutput":0},"packages/plugins/plugin-status-bar/src/index.ts":{"bytesInOutput":35}},"bytes":13613},"packages/plugins/plugin-status-bar/dist/lib/browser/meta.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":93},"packages/plugins/plugin-status-bar/dist/lib/browser/meta.mjs":{"imports":[{"path":"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-PL5XPTPX.mjs","kind":"import-statement"}],"exports":["STATUS_BAR_PLUGIN","default"],"entryPoint":"packages/plugins/plugin-status-bar/src/meta.tsx","inputs":{},"bytes":169},"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-PL5XPTPX.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":946},"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-PL5XPTPX.mjs":{"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true}],"exports":["STATUS_BAR_PLUGIN","meta_default"],"inputs":{"packages/plugins/plugin-status-bar/src/meta.tsx":{"bytesInOutput":429}},"bytes":573}}}
+{"inputs":{"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx":{"bytes":9929,"imports":[{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-status-bar/src/meta.ts":{"bytes":1252,"imports":[],"format":"esm"},"packages/plugins/plugin-status-bar/src/translations.ts":{"bytes":3385,"imports":[{"path":"packages/plugins/plugin-status-bar/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx":{"bytes":16534,"imports":[{"path":"@effect/schema","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-data","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-status-bar/src/meta.ts","kind":"import-statement","original":"../meta"},{"path":"packages/plugins/plugin-status-bar/src/translations.ts","kind":"import-statement","original":"../translations"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx":{"bytes":6006,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx","kind":"import-statement","original":"./FeedbackForm"},{"path":"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx","kind":"import-statement","original":"./StatusBar"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/components/index.ts":{"bytes":624,"imports":[{"path":"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx","kind":"import-statement","original":"./StatusBar"},{"path":"packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx","kind":"import-statement","original":"./StatusBarPanel"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx":{"bytes":2663,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-status-bar/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/plugins/plugin-status-bar/src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-status-bar/src/translations.ts","kind":"import-statement","original":"./translations"}],"format":"esm"},"packages/plugins/plugin-status-bar/src/index.ts":{"bytes":916,"imports":[{"path":"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx","kind":"import-statement","original":"./StatusBarPlugin"},{"path":"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx","kind":"import-statement","original":"./StatusBarPlugin"},{"path":"packages/plugins/plugin-status-bar/src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-status-bar/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":20348},"packages/plugins/plugin-status-bar/dist/lib/browser/index.mjs":{"imports":[{"path":"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-4KDZC7WS.mjs","kind":"import-statement"},{"path":"react","kind":"import-statement","external":true},{"path":"@fluentui/react-tabster","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@effect/schema","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-data","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["StatusBar","StatusBarPanel","StatusBarPlugin","default"],"entryPoint":"packages/plugins/plugin-status-bar/src/index.ts","inputs":{"packages/plugins/plugin-status-bar/src/StatusBarPlugin.tsx":{"bytesInOutput":424},"packages/plugins/plugin-status-bar/src/components/StatusBar.tsx":{"bytesInOutput":2478},"packages/plugins/plugin-status-bar/src/components/index.ts":{"bytesInOutput":0},"packages/plugins/plugin-status-bar/src/components/StatusBarPanel.tsx":{"bytesInOutput":1692},"packages/plugins/plugin-status-bar/src/components/FeedbackForm.tsx":{"bytesInOutput":4721},"packages/plugins/plugin-status-bar/src/translations.ts":{"bytesInOutput":570},"packages/plugins/plugin-status-bar/src/index.ts":{"bytesInOutput":35}},"bytes":10711},"packages/plugins/plugin-status-bar/dist/lib/browser/meta.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":93},"packages/plugins/plugin-status-bar/dist/lib/browser/meta.mjs":{"imports":[{"path":"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-4KDZC7WS.mjs","kind":"import-statement"}],"exports":["STATUS_BAR_PLUGIN","default"],"entryPoint":"packages/plugins/plugin-status-bar/src/meta.ts","inputs":{},"bytes":169},"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-4KDZC7WS.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":600},"packages/plugins/plugin-status-bar/dist/lib/browser/chunk-4KDZC7WS.mjs":{"imports":[],"exports":["STATUS_BAR_PLUGIN","meta_default"],"inputs":{"packages/plugins/plugin-status-bar/src/meta.ts":{"bytesInOutput":210}},"bytes":353}}}

package/dist/lib/browser/meta.mjs

@@ -1,7 +1,7 @@
 import {
   STATUS_BAR_PLUGIN,
   meta_default
-} from "./chunk-PL5XPTPX.mjs";
+} from "./chunk-4KDZC7WS.mjs";
 export {
   STATUS_BAR_PLUGIN,
   meta_default as default

package/dist/types/src/components/FeedbackForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FeedbackForm.d.ts","sourceRoot":"","sources":["../../../../src/components/FeedbackForm.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAiC3C,eAAO,MAAM,YAAY,gBAAiB;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,sBAwFhE,CAAC"}
+{"version":3,"file":"FeedbackForm.d.ts","sourceRoot":"","sources":["../../../../src/components/FeedbackForm.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAsB,MAAM,OAAO,CAAC;AA+B3C,eAAO,MAAM,YAAY,gBAAiB;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,sBAwFhE,CAAC"}

package/dist/types/src/components/StatusBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBar.d.ts","sourceRoot":"","sources":["../../../../src/components/StatusBar.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAAmC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAgB/E,QAAA,MAAM,eAAe;cAHmC,SAAS;cAAY,OAAO;;;qFAsBnF,CAAC;AAEF,eAAe,eAAe,CAAC;AAuD/B,eAAO,MAAM,SAAS;;kBAvCqC,SAAS;;;;;kBAhDd,SAAS;;;;;kBAkCT,SAAS;;;;;kBA1BP,SAAS;kBAAY,OAAO;;;;;kBA+D/B,SAAS;;;;;kBAQX,SAAS;;;;CAe3D,CAAC"}
+{"version":3,"file":"StatusBar.d.ts","sourceRoot":"","sources":["../../../../src/components/StatusBar.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,EAAmC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAgB/E,QAAA,MAAM,eAAe;cAHmC,SAAS;cAAY,OAAO;;;qFAsBnF,CAAC;AAEF,eAAe,eAAe,CAAC;AAwD/B,eAAO,MAAM,SAAS;;kBAvCqC,SAAS;;;;;kBAjDd,SAAS;;;;;kBAkCT,SAAS;;;;;kBA1BP,SAAS;kBAAY,OAAO;;;;;kBAgE/B,SAAS;;;;;kBAQX,SAAS;;;;CAe3D,CAAC"}

package/dist/types/src/components/StatusBar.stories.d.ts

@@ -1,50 +1,9 @@
 import '@dxos-theme';
+import { type Meta } from '@storybook/react';
 import React from 'react';
-declare const _default: {
-    title: string;
-    component: {
-        Container: React.ForwardRefExoticComponent<Omit<{
-            children: React.ReactNode;
-        }, "className"> & {
-            classNames?: import("packages/ui/react-ui-types/dist/types/src").ClassNameValue;
-        } & React.RefAttributes<HTMLDivElement>>;
-        Text: React.ForwardRefExoticComponent<Omit<{
-            children: React.ReactNode;
-        }, "className"> & {
-            classNames?: import("packages/ui/react-ui-types/dist/types/src").ClassNameValue;
-        } & React.RefAttributes<HTMLSpanElement>>;
-        Item: React.ForwardRefExoticComponent<Omit<{
-            children: React.ReactNode;
-        }, "className"> & {
-            classNames?: import("packages/ui/react-ui-types/dist/types/src").ClassNameValue;
-        } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-        Button: React.ForwardRefExoticComponent<Omit<{
-            children: React.ReactNode;
-            asChild?: boolean;
-        }, "className"> & {
-            classNames?: import("packages/ui/react-ui-types/dist/types/src").ClassNameValue;
-        } & React.HTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
-        StartContent: React.ForwardRefExoticComponent<Omit<{
-            children: React.ReactNode;
-        }, "className"> & {
-            classNames?: import("packages/ui/react-ui-types/dist/types/src").ClassNameValue;
-        } & React.RefAttributes<HTMLDivElement>>;
-        EndContent: React.ForwardRefExoticComponent<Omit<{
-            children: React.ReactNode;
-        }, "className"> & {
-            classNames?: import("packages/ui/react-ui-types/dist/types/src").ClassNameValue;
-        } & React.RefAttributes<HTMLDivElement>>;
-    };
-    actions: {
-        argTypesRegex: string;
-    };
-    decorators: import("@storybook/react/*").Decorator[];
-    parameters: {
-        chromatic: {
-            disableSnapshot: boolean;
-        };
-    };
-};
-export default _default;
-export declare const Normal: (_props: any) => React.JSX.Element;
+import { StatusBar } from './StatusBar';
+export declare const DefaultStory: () => React.JSX.Element;
+export declare const Default: {};
+declare const meta: Meta<typeof StatusBar>;
+export default meta;
 //# sourceMappingURL=StatusBar.stories.d.ts.map

package/dist/types/src/components/StatusBar.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBar.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/StatusBar.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAGrB,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAM1B,wBAME;AAEF,eAAO,MAAM,MAAM,WAAY,GAAG,sBAqBjC,CAAC"}
+{"version":3,"file":"StatusBar.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/StatusBar.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,eAAO,MAAM,YAAY,yBAmBxB,CAAC;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC;AAE1B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAQhC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/types/src/components/StatusBarPanel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const StatusBarPanel: () => React.JSX.Element;
+//# sourceMappingURL=StatusBarPanel.d.ts.map

package/dist/types/src/components/StatusBarPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBarPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/StatusBarPanel.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAQxC,eAAO,MAAM,cAAc,yBA8B1B,CAAC"}

package/dist/types/src/components/index.d.ts

@@ -1,3 +1,3 @@
 export * from './StatusBar';
-export * from './StatusBarImpl';
+export * from './StatusBarPanel';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/src/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAIA,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAIA,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC"}

package/dist/types/src/meta.d.ts

@@ -1,15 +1,9 @@
-import { type IconProps } from '@phosphor-icons/react';
-import React from 'react';
 export declare const STATUS_BAR_PLUGIN = "dxos.org/plugin/status-bar";
 declare const _default: {
     id: string;
-    shortId?: string;
-    name?: string;
-    description?: string;
-    homePage?: string;
-    tags?: string[];
-    iconComponent?: React.FC<IconProps>;
-    iconSymbol?: string;
+    name: string;
+    description: string;
+    icon: string;
 };
 export default _default;
 //# sourceMappingURL=meta.d.ts.map

package/dist/types/src/meta.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/meta.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAC7D,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,iBAAiB,+BAA+B,CAAC;;;;;;;;;;;AAE9D,wBAMG"}
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/meta.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,iBAAiB,+BAA+B,CAAC;;;;;;;AAE9D,wBAKuB"}

package/package.json

@@ -1,19 +1,20 @@
 {
   "name": "@dxos/plugin-status-bar",
-  "version": "0.6.13",
+  "version": "0.6.14-main.69511f5",
   "description": "Status bar plugin",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
   "license": "MIT",
   "author": "DXOS.org",
+  "sideEffects": true,
   "exports": {
     ".": {
-      "browser": "./dist/lib/browser/index.mjs",
-      "types": "./dist/types/src/index.d.ts"
+      "types": "./dist/types/src/index.d.ts",
+      "browser": "./dist/lib/browser/index.mjs"
     },
     "./meta": {
-      "browser": "./dist/lib/browser/meta.mjs",
-      "types": "./dist/types/src/meta.d.ts"
+      "types": "./dist/types/src/meta.d.ts",
+      "browser": "./dist/lib/browser/meta.mjs"
     }
   },
   "types": "dist/types/src/index.d.ts",
@@ -29,19 +30,16 @@
     "src"
   ],
   "dependencies": {
-    "@effect/schema": "^0.67.16",
+    "@effect/schema": "^0.75.1",
     "@fluentui/react-tabster": "^9.19.0",
     "@preact/signals-core": "^1.6.0",
     "@radix-ui/react-slot": "^1.0.1",
-    "effect": "^3.2.7",
+    "effect": "^3.9.1",
     "react-resize-detector": "^11.0.1",
-    "@dxos/app-framework": "0.6.13",
-    "@dxos/async": "0.6.13",
-    "@dxos/echo-schema": "0.6.13",
-    "@dxos/plugin-space": "0.6.13",
-    "@dxos/plugin-client": "0.6.13",
-    "@dxos/plugin-stack": "0.6.13",
-    "@dxos/react-client": "0.6.13"
+    "@dxos/app-framework": "0.6.14-main.69511f5",
+    "@dxos/async": "0.6.14-main.69511f5",
+    "@dxos/echo-schema": "0.6.14-main.69511f5",
+    "@dxos/react-ui-data": "0.6.14-main.69511f5"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.1.5",
@@ -49,17 +47,17 @@
     "@types/react-dom": "~18.2.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "vite": "^5.3.4",
-    "@dxos/react-ui": "0.6.13",
-    "@dxos/storybook-utils": "0.6.13",
-    "@dxos/react-ui-theme": "0.6.13"
+    "vite": "5.4.7",
+    "@dxos/react-ui": "0.6.14-main.69511f5",
+    "@dxos/react-ui-theme": "0.6.14-main.69511f5",
+    "@dxos/storybook-utils": "0.6.14-main.69511f5"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.0.5",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
-    "@dxos/react-ui": "0.6.13",
-    "@dxos/react-ui-theme": "0.6.13"
+    "react": "~18.2.0",
+    "react-dom": "~18.2.0",
+    "@dxos/react-ui": "0.6.14-main.69511f5",
+    "@dxos/react-ui-theme": "0.6.14-main.69511f5"
   },
   "publishConfig": {
     "access": "public"

package/src/StatusBarPlugin.tsx

@@ -6,7 +6,7 @@ import React from 'react';
 
 import { type PluginDefinition, type SurfaceProvides, type TranslationsProvides } from '@dxos/app-framework';
 
-import { StatusBarImpl } from './components';
+import { StatusBarPanel } from './components';
 import meta from './meta';
 import translations from './translations';
 
@@ -21,7 +21,7 @@ export const StatusBarPlugin = (): PluginDefinition<StatusBarPluginProvides> =>
         component: ({ role }) => {
           switch (role) {
             case 'status-bar': {
-              return <StatusBarImpl />;
+              return <StatusBarPanel />;
             }
           }
 

package/src/components/FeedbackForm.tsx

@@ -2,30 +2,29 @@
 // Copyright 2024 DXOS.org
 //
 
-import { X, PaperPlaneTilt } from '@phosphor-icons/react';
+import { Schema as S } from '@effect/schema';
+import { PaperPlaneTilt, X } from '@phosphor-icons/react';
 import React, { useCallback } from 'react';
 
 import { useIntentDispatcher } from '@dxos/app-framework';
-import { S } from '@dxos/echo-schema';
 import { Button, Input, Popover, useTranslation } from '@dxos/react-ui';
+import { useForm } from '@dxos/react-ui-data';
 import { getSize } from '@dxos/react-ui-theme';
 
-import { useForm } from '../hooks';
 import { STATUS_BAR_PLUGIN } from '../meta';
 import { mkTranslation } from '../translations';
-import { validate } from '../util';
 
 const Email = S.String.pipe(
-  S.nonEmpty({ message: () => 'Email is required.' }),
+  S.nonEmptyString({ message: () => 'Email is required.' }),
   S.pattern(/^(?!\.)(?!.*\.\.)([A-Z0-9_+-.]*)[A-Z0-9_+-]@([A-Z0-9][A-Z0-9-]*\.)+[A-Z]{2,}$/i, {
     message: () => 'Invalid email address.',
   }),
 );
 
-const nonEmpty = (field: string) => S.nonEmpty({ message: () => `${field} is required.` });
+const nonEmpty = (field: string) => S.nonEmptyString({ message: () => `${field} is required.` });
 const maxLength = (field: string, length: number) => S.maxLength(length, { message: () => `${field} is too long.` });
 
-// -- Types and validation.
+// Types and validation.
 const FeedbackFormSchema = S.Struct({
   name: S.String.pipe(nonEmpty('Name'), maxLength('Name', 256)),
   email: Email.pipe(maxLength('Email', 256)),
@@ -51,8 +50,8 @@ export const FeedbackForm = ({ onClose }: { onClose: () => void }) => {
 
   const { errors, handleSubmit, canSubmit, touched, getInputProps } = useForm<FeedbackFormState>({
     initialValues,
-    validate: (values) => validate(FeedbackFormSchema, values),
-    onSubmit: (values) => onSubmit(values),
+    schema: FeedbackFormSchema,
+    onSubmit,
   });
 
   return (

package/src/components/StatusBar.stories.tsx

@@ -4,40 +4,45 @@
 
 import '@dxos-theme';
 
-import { Mailbox, DiscordLogo, Lightning } from '@phosphor-icons/react';
+import { type Meta } from '@storybook/react';
 import React from 'react';
 
+import { Icon } from '@dxos/react-ui';
 import { withTheme } from '@dxos/storybook-utils';
 
 import { StatusBar } from './StatusBar';
 
-export default {
-  title: 'plugin-status/StatusBar',
-  component: StatusBar,
-  actions: { argTypesRegex: '^on.*' },
-  decorators: [withTheme],
-  parameters: { chromatic: { disableSnapshot: false } },
-};
-
-export const Normal = (_props: any) => (
-  <>
-    <StatusBar.Container>
-      <StatusBar.EndContent>
+export const DefaultStory = () => (
+  <StatusBar.Container>
+    <StatusBar.EndContent>
+      <StatusBar.Button>
+        <Icon icon='ph--mailbox--regular' size={4} />
+        <StatusBar.Text>Quick feedback</StatusBar.Text>
+      </StatusBar.Button>
+      <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>
         <StatusBar.Button>
-          <Mailbox />
-          <StatusBar.Text>Quick feedback</StatusBar.Text>
+          <Icon icon='ph--discord-logo--regular' size={4} />
+          <StatusBar.Text>Join us on Discord</StatusBar.Text>
         </StatusBar.Button>
-        <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>
-          <StatusBar.Button>
-            <DiscordLogo />
-            <StatusBar.Text>Join us on Discord</StatusBar.Text>
-          </StatusBar.Button>
-        </a>
-        <StatusBar.Item>
-          <Lightning />
-          <StatusBar.Text>Online</StatusBar.Text>
-        </StatusBar.Item>
-      </StatusBar.EndContent>
-    </StatusBar.Container>
-  </>
+      </a>
+      <StatusBar.Item>
+        <Icon icon='ph--lightning--regular' size={4} />
+        <StatusBar.Text>Online</StatusBar.Text>
+      </StatusBar.Item>
+    </StatusBar.EndContent>
+  </StatusBar.Container>
 );
+
+export const Default = {};
+
+const meta: Meta<typeof StatusBar> = {
+  title: 'plugins/plugin-status/StatusBar',
+  component: StatusBar as any,
+  render: DefaultStory,
+  decorators: [withTheme],
+  parameters: {
+    chromatic: { disableSnapshot: false },
+  },
+};
+
+export default meta;

package/src/components/StatusBar.tsx

@@ -57,9 +57,10 @@ const StatusBarItem = forwardRef<HTMLDivElement, StatusBarItemProps>(
     </div>
   ),
 );
+
 type StatusBarContainerProps = ThemedClassName<{ children: ReactNode }>;
 
-// TODO(zan): tabable group with tabster
+// TODO(zan): tabable group with tabster.
 const StatusBarContainer = forwardRef<HTMLDivElement, StatusBarContainerProps>(
   ({ classNames, children }, forwardedRef) => {
     const groupAttrs = useFocusableGroup({ tabBehavior: 'limited' });
@@ -69,7 +70,7 @@ const StatusBarContainer = forwardRef<HTMLDivElement, StatusBarContainerProps>(
         tabIndex={0}
         {...groupAttrs}
         className={mx(
-          'bs-[--statusbar-size] flex justify-end items-center gap-2 border-bs border-separator bg-base text-description text-lg pointer-fine:text-xs ch-focus-ring-inset',
+          'bs-[--statusbar-size] flex justify-end items-center gap-2 bg-base text-description text-lg pointer-fine:text-xs ch-focus-ring-inset',
           classNames,
         )}
         ref={forwardedRef}

package/src/components/{StatusBarImpl.tsx → StatusBarPanel.tsx}

@@ -2,17 +2,15 @@
 // Copyright 2024 DXOS.org
 //
 
-import { DiscordLogo, PaperPlaneTilt } from '@phosphor-icons/react';
 import React, { useState } from 'react';
 
 import { Surface } from '@dxos/app-framework';
-import { Popover } from '@dxos/react-ui';
+import { Icon, Popover } from '@dxos/react-ui';
 
 import { FeedbackForm } from './FeedbackForm';
 import { StatusBar } from './StatusBar';
 
-// TODO(wittjosiah): Rename.
-export const StatusBarImpl = () => {
+export const StatusBarPanel = () => {
   const [open, setOpen] = useState(false);
 
   // TODO(wittjosiah): Factor out feedback and discord buttons.
@@ -22,14 +20,14 @@ export const StatusBarImpl = () => {
         <StatusBar.EndContent>
           <Popover.Trigger asChild>
             <StatusBar.Button aria-label='Give feedback about composer' data-joyride='welcome/feedback'>
-              <PaperPlaneTilt />
+              <Icon icon='ph--paper-plane-tilt--regular' size={4} />
               <StatusBar.Text classNames='hidden sm:block'>Feedback</StatusBar.Text>
             </StatusBar.Button>
           </Popover.Trigger>
           {/* TODO(zan): Configure this label? */}
           <StatusBar.Button aria-label='Open DXOS Discord' asChild>
             <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>
-              <DiscordLogo />
+              <Icon icon='ph--discord-logo--regular' size={4} />
               <StatusBar.Text classNames='hidden sm:block'>Discord</StatusBar.Text>
             </a>
           </StatusBar.Button>

package/src/components/index.ts

@@ -3,4 +3,4 @@
 //
 
 export * from './StatusBar';
-export * from './StatusBarImpl';
+export * from './StatusBarPanel';

package/src/meta.ts

@@ -0,0 +1,14 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+import { type PluginMeta } from '@dxos/app-framework';
+
+export const STATUS_BAR_PLUGIN = 'dxos.org/plugin/status-bar';
+
+export default {
+  id: STATUS_BAR_PLUGIN,
+  name: 'Status Bar',
+  description: 'Display a bar with status and actions.',
+  icon: 'ph--info--regular',
+} satisfies PluginMeta;

package/dist/lib/browser/chunk-PL5XPTPX.mjs

@@ -1,18 +0,0 @@
-// packages/plugins/plugin-status-bar/src/meta.tsx
-import { Info } from "@phosphor-icons/react";
-import React from "react";
-import { pluginMeta } from "@dxos/app-framework";
-var STATUS_BAR_PLUGIN = "dxos.org/plugin/status-bar";
-var meta_default = pluginMeta({
-  id: STATUS_BAR_PLUGIN,
-  name: "Status Bar",
-  description: "Display a bar with status and actions.",
-  iconComponent: (props) => /* @__PURE__ */ React.createElement(Info, props),
-  iconSymbol: "ph--info--regular"
-});
-
-export {
-  STATUS_BAR_PLUGIN,
-  meta_default
-};
-//# sourceMappingURL=chunk-PL5XPTPX.mjs.map

package/dist/lib/browser/chunk-PL5XPTPX.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/meta.tsx"],
-  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Info, type IconProps } from '@phosphor-icons/react';\nimport React from 'react';\n\nimport { pluginMeta } from '@dxos/app-framework';\n\nexport const STATUS_BAR_PLUGIN = 'dxos.org/plugin/status-bar';\n\nexport default pluginMeta({\n  id: STATUS_BAR_PLUGIN,\n  name: 'Status Bar',\n  description: 'Display a bar with status and actions.',\n  iconComponent: (props: IconProps) => <Info {...props} />,\n  iconSymbol: 'ph--info--regular',\n});\n"],
-  "mappings": ";AAIA,SAASA,YAA4B;AACrC,OAAOC,WAAW;AAElB,SAASC,kBAAkB;AAEpB,IAAMC,oBAAoB;AAEjC,IAAA,eAAeC,WAAW;EACxBC,IAAIF;EACJG,MAAM;EACNC,aAAa;EACbC,eAAe,CAACC,UAAqB,sBAAA,cAACC,MAASD,KAAAA;EAC/CE,YAAY;AACd,CAAA;",
-  "names": ["Info", "React", "pluginMeta", "STATUS_BAR_PLUGIN", "pluginMeta", "id", "name", "description", "iconComponent", "props", "Info", "iconSymbol"]
-}

package/dist/types/src/components/StatusBarImpl.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-export declare const StatusBarImpl: () => React.JSX.Element;
-//# sourceMappingURL=StatusBarImpl.d.ts.map

package/dist/types/src/components/StatusBarImpl.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"StatusBarImpl.d.ts","sourceRoot":"","sources":["../../../../src/components/StatusBarImpl.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAmB,MAAM,OAAO,CAAC;AASxC,eAAO,MAAM,aAAa,yBA8BzB,CAAC"}

package/dist/types/src/hooks/index.d.ts

@@ -1,2 +0,0 @@
-export * from './useForm';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/src/hooks/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAIA,cAAc,WAAW,CAAC"}

package/dist/types/src/hooks/useForm.d.ts

@@ -1,36 +0,0 @@
-import { type ChangeEvent } from 'react';
-import { type ValidationError } from '../util';
-interface FormOptions<T> {
-    initialValues: T;
-    validate: (values: any) => ValidationError[] | undefined;
-    onSubmit: (values: T) => void;
-}
-/**
- * Creates a hook for managing form state, including values, validation, and submission.
- *
- * @example
- * const { values, handleChange, handleSubmit, errors, canSubmit, getInputProps } = useForm({
- *   initialValues: { name: '', email: '' },
- *   validate: (values) => { yourValidationLogic(values); },
- *   onSubmit: (values) => { submissionLogic(values); },
- * });
- */
-export declare const useForm: <T extends object>({ initialValues, validate, onSubmit }: FormOptions<T>) => {
-    values: T;
-    handleChange: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
-    handleSubmit: () => void;
-    errors: Record<keyof T, string>;
-    canSubmit: boolean;
-    touched: Record<keyof T, boolean>;
-    handleBlur: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
-    onValidate: (values: T) => boolean;
-    getInputProps: (key: keyof T) => {
-        name: keyof T;
-        value: T[keyof T];
-        onChange: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
-        onBlur: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
-        'aria-invalid': boolean;
-    };
-};
-export {};
-//# sourceMappingURL=useForm.d.ts.map

package/dist/types/src/hooks/useForm.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useForm.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,WAAW,EAAyB,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,SAAS,CAAC;AAK/C,UAAU,WAAW,CAAC,CAAC;IACrB,aAAa,EAAE,CAAC,CAAC;IACjB,QAAQ,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,eAAe,EAAE,GAAG,SAAS,CAAC;IACzD,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,CAAC;CAC/B;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,MAAM,yCAAyC,WAAW,CAAC,CAAC,CAAC;;0BAkBnF,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC;;;;;wBAYnD,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC;yBAtBvD,CAAC;yBAiDJ,MAAM,CAAC;;;0BAvCL,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC;wBAYnD,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,mBAAmB,CAAC;;;CAgDnE,CAAC"}

package/dist/types/src/util/index.d.ts

@@ -1,2 +0,0 @@
-export * from './validation';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/src/util/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/util/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC"}

package/dist/types/src/util/validation.d.ts

@@ -1,7 +0,0 @@
-import { S } from '@dxos/echo-schema';
-export type ValidationError = {
-    path: string;
-    message: string;
-};
-export declare const validate: <T>(schema: S.Schema<T>, data: any) => ValidationError[] | undefined;
-//# sourceMappingURL=validation.d.ts.map

package/dist/types/src/util/validation.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"validation.d.ts","sourceRoot":"","sources":["../../../../src/util/validation.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAEtC,MAAM,MAAM,eAAe,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC;AAEhE,eAAO,MAAM,QAAQ,GAAI,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,GAAG,KAAG,eAAe,EAAE,GAAG,SAWhF,CAAC"}

package/src/hooks/index.ts

@@ -1,5 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-export * from './useForm';

package/src/hooks/useForm.ts

@@ -1,119 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-import { type ChangeEvent, useCallback, useState } from 'react';
-
-import { type ValidationError } from '../util';
-
-// TODO(Zan): This module will be generally useful and we should factor it out after the
-// API crystallizes a bit more.
-
-interface FormOptions<T> {
-  initialValues: T;
-  validate: (values: any) => ValidationError[] | undefined;
-  onSubmit: (values: T) => void;
-}
-
-/**
- * Creates a hook for managing form state, including values, validation, and submission.
- *
- * @example
- * const { values, handleChange, handleSubmit, errors, canSubmit, getInputProps } = useForm({
- *   initialValues: { name: '', email: '' },
- *   validate: (values) => { yourValidationLogic(values); },
- *   onSubmit: (values) => { submissionLogic(values); },
- * });
- */
-export const useForm = <T extends object>({ initialValues, validate, onSubmit }: FormOptions<T>) => {
-  const [values, setValues] = useState<T>(initialValues);
-  const [errors, setErrors] = useState<Record<keyof T, string>>({} as Record<keyof T, string>);
-  const [touched, setTouched] = useState<Record<keyof T, boolean>>(
-    Object.keys(initialValues).reduce((acc, key) => ({ ...acc, [key]: false }), {} as Record<keyof T, boolean>),
-  );
-
-  const runValidation = useCallback(
-    (values: T) => {
-      const validationErrors = validate(values);
-      setErrors(collapseErrorArray(validationErrors ?? []));
-
-      return validationErrors === undefined;
-    },
-    [validate],
-  );
-
-  const handleChange = useCallback(
-    (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
-      const { name, value } = event.target;
-      const newValues = { ...values, [name]: value };
-      setValues(newValues);
-      runValidation(newValues);
-    },
-    [values, runValidation],
-  );
-
-  const touchAll = useCallback(() => setTouched(mkAllTouched(values)), [values, setTouched]);
-
-  const handleBlur = useCallback(
-    (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => {
-      const { name } = event.target;
-      setTouched((touched) => ({ ...touched, [name]: true }));
-
-      // TODO(Zan): This should be configurable behavior.
-      if (event.relatedTarget?.getAttribute('type') === 'submit') {
-        // NOTE: We do this here instead of onSubmit, because the blur event is triggered before the submit event
-        //       and results in the submit button being disabled when the form is invalid.
-        touchAll();
-      }
-
-      runValidation(values);
-    },
-    [runValidation, values, touchAll],
-  );
-
-  const handleSubmit = useCallback(() => {
-    if (runValidation(values)) {
-      onSubmit(values);
-    }
-  }, [values, runValidation, onSubmit]);
-
-  // NOTE: We can submit if there is no touched field that has an error.
-  // - Basically, if there's a validation message present in the form, submit should be disabled.
-  const canSubmit = Object.keys(values).every((key) => touched[key as keyof T] === false || !errors[key as keyof T]);
-
-  const getInputProps = useCallback(
-    (key: keyof T) => ({
-      name: key,
-      value: values[key],
-      onChange: handleChange,
-      onBlur: handleBlur,
-      'aria-invalid': errors[key] !== undefined,
-    }),
-    [values, handleChange, handleBlur, errors],
-  );
-
-  return {
-    values,
-    handleChange,
-    handleSubmit,
-    errors,
-    canSubmit,
-    touched,
-    handleBlur,
-    onValidate: runValidation,
-    getInputProps,
-  };
-};
-
-const mkAllTouched = <T extends Record<keyof T, any>>(values: T) => {
-  return Object.keys(values).reduce((acc, key) => ({ ...acc, [key]: true }), {} as Record<keyof T, boolean>);
-};
-
-const collapseErrorArray = <T>(errors: ValidationError[]) =>
-  errors.reduce(
-    (acc, { path, message }) => {
-      // TODO(Zan): This won't play well with nesting.
-      acc[path as keyof T] = message;
-      return acc;
-    },
-    {} as Record<keyof T, string>,
-  );

package/src/meta.tsx

@@ -1,18 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { Info, type IconProps } from '@phosphor-icons/react';
-import React from 'react';
-
-import { pluginMeta } from '@dxos/app-framework';
-
-export const STATUS_BAR_PLUGIN = 'dxos.org/plugin/status-bar';
-
-export default pluginMeta({
-  id: STATUS_BAR_PLUGIN,
-  name: 'Status Bar',
-  description: 'Display a bar with status and actions.',
-  iconComponent: (props: IconProps) => <Info {...props} />,
-  iconSymbol: 'ph--info--regular',
-});

package/src/util/index.ts

@@ -1,5 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-export * from './validation';

package/src/util/validation.ts

@@ -1,22 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-import { ArrayFormatter } from '@effect/schema';
-import { Effect } from 'effect';
-
-import { S } from '@dxos/echo-schema';
-
-export type ValidationError = { path: string; message: string };
-
-export const validate = <T>(schema: S.Schema<T>, data: any): ValidationError[] | undefined => {
-  const validator = S.decodeUnknownEither(schema, { errors: 'all' });
-  const result = validator(data);
-
-  if (result._tag === 'Left') {
-    const errors = Effect.runSync(ArrayFormatter.formatError(result.left));
-    // TODO(Zan): Path.join is an assumption...
-    return errors.map(({ message, path }) => ({ message, path: path.join('.') }));
-  }
-
-  return undefined;
-};