@dxos/plugin-github 0.6.13-staging.1e988a3 → 0.6.14-main.2b6a0f3

package/src/components/EmbeddedMain/EmbeddedMain.tsx

@@ -23,7 +23,6 @@ import {
   Avatar,
   Button,
   ButtonGroup,
-  DensityProvider,
   Dialog,
   DropdownMenu,
   Main,
@@ -99,188 +98,186 @@ const EmbeddedLayoutImpl = () => {
           --surface-bg: #161b22;
         }
       `}</style>
-      <DensityProvider density='fine'>
-        <div role='none' className='fixed inline-end-2 block-end-2 z-10 flex gap-2'>
-          <Tooltip.Root>
-            <Tooltip.Trigger asChild>
-              <Button disabled={!space} onClick={handleInvite}>
-                <span className='sr-only'>{t('create invitation label', { ns: 'appkit' })}</span>
-                <UserPlus className={getSize(5)} />
-              </Button>
-            </Tooltip.Trigger>
-            <Tooltip.Content {...overlayAttrs}>
-              {t('create invitation label', { ns: 'appkit' })}
-              <Tooltip.Arrow />
-            </Tooltip.Content>
-          </Tooltip.Root>
-          <Tooltip.Root>
+      <div role='none' className='fixed inline-end-2 block-end-2 z-10 flex gap-2'>
+        <Tooltip.Root>
+          <Tooltip.Trigger asChild>
+            <Button disabled={!space} onClick={handleInvite}>
+              <span className='sr-only'>{t('create invitation label', { ns: 'appkit' })}</span>
+              <UserPlus className={getSize(5)} />
+            </Button>
+          </Tooltip.Trigger>
+          <Tooltip.Content {...overlayAttrs}>
+            {t('create invitation label', { ns: 'appkit' })}
+            <Tooltip.Arrow />
+          </Tooltip.Content>
+        </Tooltip.Root>
+        <Tooltip.Root>
+          <Tooltip.Trigger asChild>
+            <Toggle
+              disabled={!(space && document)}
+              pressed={isPreviewing}
+              onPressedChange={(nextPressed) => setEditorViewState(nextPressed ? 'preview' : 'editor')}
+            >
+              <span className='sr-only'>{t(isPreviewing ? 'exit gfm preview label' : 'preview gfm label')}</span>
+              {isPreviewing ? <PencilSimpleLine className={getSize(5)} /> : <Eye className={getSize(5)} />}
+            </Toggle>
+          </Tooltip.Trigger>
+          <Tooltip.Content {...overlayAttrs}>
+            {t(isPreviewing ? 'exit gfm preview label' : 'preview gfm label')}
+            <Tooltip.Arrow />
+          </Tooltip.Content>
+        </Tooltip.Root>
+        <Tooltip.Root
+          open={optionsTooltipOpen}
+          onOpenChange={(nextOpen) => {
+            if (suppressNextTooltip.current) {
+              setOptionsTooltipOpen(false);
+              suppressNextTooltip.current = false;
+            } else {
+              setOptionsTooltipOpen(nextOpen);
+            }
+          }}
+        >
+          <DropdownMenu.Root
+            {...{
+              modal: false,
+              open: optionsMenuOpen,
+              onOpenChange: (nextOpen: boolean) => {
+                if (!nextOpen) {
+                  suppressNextTooltip.current = true;
+                }
+                return setOptionsMenuOpen(nextOpen);
+              },
+            }}
+          >
             <Tooltip.Trigger asChild>
-              <Toggle
-                disabled={!(space && document)}
-                pressed={isPreviewing}
-                onPressedChange={(nextPressed) => setEditorViewState(nextPressed ? 'preview' : 'editor')}
-              >
-                <span className='sr-only'>{t(isPreviewing ? 'exit gfm preview label' : 'preview gfm label')}</span>
-                {isPreviewing ? <PencilSimpleLine className={getSize(5)} /> : <Eye className={getSize(5)} />}
-              </Toggle>
+              <DropdownMenu.Trigger asChild disabled={!(space && document)}>
+                <Button>
+                  <DotsThreeVertical className={getSize(5)} />
+                  <span className='sr-only'>{t('embedded options label')}</span>
+                </Button>
+              </DropdownMenu.Trigger>
             </Tooltip.Trigger>
+            <DropdownMenu.Content {...overlayAttrs}>
+              <DropdownMenu.Viewport>
+                <DropdownMenu.Item asChild>
+                  <a
+                    target='_blank'
+                    rel='noreferrer'
+                    href={
+                      space && document
+                        ? `${location.origin}/dxos/space/${space?.key.toHex() ?? 'never'}/${document.id}`
+                        : '#'
+                    }
+                  >
+                    <ArrowSquareOut className={mx('shrink-0', getSize(5))} />
+                    <span className='grow'>{t('open in composer label', { ns: GITHUB_PLUGIN })}</span>
+                  </a>
+                </DropdownMenu.Item>
+                <DropdownMenu.Separator />
+                <DropdownMenu.GroupLabel>
+                  {t('active space label', { ns: SPACE_PLUGIN })}
+                  <Avatar.Root size={5} variant='circle'>
+                    <div role='none' className='flex gap-1 mlb-1 items-center'>
+                      <Avatar.Frame>
+                        <Avatar.Fallback text={spaceFallbackValue.emoji} />
+                      </Avatar.Frame>
+                      <Avatar.Label classNames='text-sm text-[--surface-text]'>
+                        {name && toLocalizedString(name, t)}
+                      </Avatar.Label>
+                    </div>
+                  </Avatar.Root>
+                </DropdownMenu.GroupLabel>
+                <DropdownMenu.Item onClick={() => setRenameDialogOpen(true)}>
+                  <span className='grow'>{t('rename space label', { ns: SPACE_PLUGIN })}</span>
+                  <PencilSimpleLine className={mx('shrink-0', getSize(5))} />
+                </DropdownMenu.Item>
+                <DropdownMenu.Item onClick={() => setResolverDialogOpen(true)}>
+                  <span className='grow'>{t('unset repo space label')}</span>
+                  <Option className={mx('shrink-0', getSize(5))} />
+                </DropdownMenu.Item>
+              </DropdownMenu.Viewport>
+              <DropdownMenu.Arrow />
+            </DropdownMenu.Content>
             <Tooltip.Content {...overlayAttrs}>
-              {t(isPreviewing ? 'exit gfm preview label' : 'preview gfm label')}
+              {t('embedded options label')}
               <Tooltip.Arrow />
             </Tooltip.Content>
-          </Tooltip.Root>
-          <Tooltip.Root
-            open={optionsTooltipOpen}
-            onOpenChange={(nextOpen) => {
-              if (suppressNextTooltip.current) {
-                setOptionsTooltipOpen(false);
-                suppressNextTooltip.current = false;
-              } else {
-                setOptionsTooltipOpen(nextOpen);
-              }
-            }}
-          >
-            <DropdownMenu.Root
-              {...{
-                modal: false,
-                open: optionsMenuOpen,
-                onOpenChange: (nextOpen: boolean) => {
-                  if (!nextOpen) {
-                    suppressNextTooltip.current = true;
-                  }
-                  return setOptionsMenuOpen(nextOpen);
-                },
-              }}
-            >
-              <Tooltip.Trigger asChild>
-                <DropdownMenu.Trigger asChild disabled={!(space && document)}>
-                  <Button>
-                    <DotsThreeVertical className={getSize(5)} />
-                    <span className='sr-only'>{t('embedded options label')}</span>
-                  </Button>
-                </DropdownMenu.Trigger>
-              </Tooltip.Trigger>
+          </DropdownMenu.Root>
+        </Tooltip.Root>
+        <ButtonGroup classNames={[!(space && document) && 'shadow-none']}>
+          <Button disabled={!(space && document)} onClick={handleSaveAndCloseEmbed}>
+            {t('save and close label')}
+          </Button>
+          <DropdownMenu.Root>
+            <DropdownMenu.Trigger asChild disabled={!(space && document)}>
+              <Button>
+                <CaretDown />
+              </Button>
+            </DropdownMenu.Trigger>
+            <DropdownMenu.Portal>
               <DropdownMenu.Content {...overlayAttrs}>
                 <DropdownMenu.Viewport>
-                  <DropdownMenu.Item asChild>
-                    <a
-                      target='_blank'
-                      rel='noreferrer'
-                      href={
-                        space && document
-                          ? `${location.origin}/dxos/space/${space?.key.toHex() ?? 'never'}/${document.id}`
-                          : '#'
-                      }
-                    >
-                      <ArrowSquareOut className={mx('shrink-0', getSize(5))} />
-                      <span className='grow'>{t('open in composer label', { ns: GITHUB_PLUGIN })}</span>
-                    </a>
+                  <DropdownMenu.Item onClick={handleSaveAndCloseEmbed} classNames='block'>
+                    <p>{t('save and close label')}</p>
+                    <p className={descriptionText}>{t('save and close description')}</p>
                   </DropdownMenu.Item>
-                  <DropdownMenu.Separator />
-                  <DropdownMenu.GroupLabel>
-                    {t('active space label', { ns: SPACE_PLUGIN })}
-                    <Avatar.Root size={5} variant='circle'>
-                      <div role='none' className='flex gap-1 mlb-1 items-center'>
-                        <Avatar.Frame>
-                          <Avatar.Fallback text={spaceFallbackValue.emoji} />
-                        </Avatar.Frame>
-                        <Avatar.Label classNames='text-sm text-[--surface-text]'>
-                          {name && toLocalizedString(name, t)}
-                        </Avatar.Label>
-                      </div>
-                    </Avatar.Root>
-                  </DropdownMenu.GroupLabel>
-                  <DropdownMenu.Item onClick={() => setRenameDialogOpen(true)}>
-                    <span className='grow'>{t('rename space label', { ns: SPACE_PLUGIN })}</span>
-                    <PencilSimpleLine className={mx('shrink-0', getSize(5))} />
-                  </DropdownMenu.Item>
-                  <DropdownMenu.Item onClick={() => setResolverDialogOpen(true)}>
-                    <span className='grow'>{t('unset repo space label')}</span>
-                    <Option className={mx('shrink-0', getSize(5))} />
+                  <DropdownMenu.Item onClick={handleCloseEmbed} classNames='block'>
+                    <p>{t('close label', { ns: 'appkit' })}</p>
+                    <p className={descriptionText}>{t('close embed description')}</p>
                   </DropdownMenu.Item>
                 </DropdownMenu.Viewport>
                 <DropdownMenu.Arrow />
               </DropdownMenu.Content>
-              <Tooltip.Content {...overlayAttrs}>
-                {t('embedded options label')}
-                <Tooltip.Arrow />
-              </Tooltip.Content>
-            </DropdownMenu.Root>
-          </Tooltip.Root>
-          <ButtonGroup classNames={[!(space && document) && 'shadow-none']}>
-            <Button disabled={!(space && document)} onClick={handleSaveAndCloseEmbed}>
-              {t('save and close label')}
-            </Button>
-            <DropdownMenu.Root>
-              <DropdownMenu.Trigger asChild disabled={!(space && document)}>
-                <Button>
-                  <CaretDown />
-                </Button>
-              </DropdownMenu.Trigger>
-              <DropdownMenu.Portal>
-                <DropdownMenu.Content {...overlayAttrs}>
-                  <DropdownMenu.Viewport>
-                    <DropdownMenu.Item onClick={handleSaveAndCloseEmbed} classNames='block'>
-                      <p>{t('save and close label')}</p>
-                      <p className={descriptionText}>{t('save and close description')}</p>
-                    </DropdownMenu.Item>
-                    <DropdownMenu.Item onClick={handleCloseEmbed} classNames='block'>
-                      <p>{t('close label', { ns: 'appkit' })}</p>
-                      <p className={descriptionText}>{t('close embed description')}</p>
-                    </DropdownMenu.Item>
-                  </DropdownMenu.Viewport>
-                  <DropdownMenu.Arrow />
-                </DropdownMenu.Content>
-              </DropdownMenu.Portal>
-            </DropdownMenu.Root>
-          </ButtonGroup>
-        </div>
-        {space && document ? (
-          editorViewState === 'preview' ? (
-            <Main.Content classNames='min-bs-[100dvh] flex flex-col p-0.5'>
-              <GfmPreview
-                markdown={document.content?.toString() ?? ''}
-                {...(docGhId && { owner: docGhId.owner, repo: docGhId.repo })}
-              />
-            </Main.Content>
-          ) : (
-            // TODO(burdon): This will break since model is not defined.
-            <Surface role='main' data={{ properties: document, view: 'embedded' }} />
-          )
-        ) : source && id && identityHex ? (
-          <Dialog.Root open onOpenChange={() => true}>
-            <div role='none' className={defaultTx('dialog.overlay', 'dialog--resolver__overlay', {}, 'static bs-full')}>
-              <div
-                role='none'
-                className={defaultTx(
-                  'dialog.content',
-                  'dialog--resolver__content',
-                  {},
-                  'p-2 bs-72 flex flex-col shadow-none bg-transparent',
-                )}
-              >
-                <ResolverDialog handleCreateSpace={handleCreateSpace} handleJoinSpace={handleJoinSpace} />
-              </div>
+            </DropdownMenu.Portal>
+          </DropdownMenu.Root>
+        </ButtonGroup>
+      </div>
+      {space && document ? (
+        editorViewState === 'preview' ? (
+          <Main.Content classNames='min-bs-[100dvh] flex flex-col p-0.5'>
+            <GfmPreview
+              markdown={document.content?.toString() ?? ''}
+              {...(docGhId && { owner: docGhId.owner, repo: docGhId.repo })}
+            />
+          </Main.Content>
+        ) : (
+          // TODO(burdon): This will break since model is not defined.
+          <Surface role='main' data={{ properties: document, view: 'embedded' }} />
+        )
+      ) : source && id && identityHex ? (
+        <Dialog.Root open onOpenChange={() => true}>
+          <div role='none' className={defaultTx('dialog.overlay', 'dialog--resolver__overlay', {}, 'static bs-full')}>
+            <div
+              role='none'
+              className={defaultTx(
+                'dialog.content',
+                'dialog--resolver__content',
+                {},
+                'p-2 bs-72 flex flex-col shadow-none bg-transparent',
+              )}
+            >
+              <ResolverDialog handleCreateSpace={handleCreateSpace} handleJoinSpace={handleJoinSpace} />
             </div>
-          </Dialog.Root>
-        ) : null}
-        {space && (
-          <Dialog.Root open={renameDialogOpen} onOpenChange={setRenameDialogOpen}>
-            <Dialog.Overlay classNames='backdrop-blur'>
-              <Dialog.Content>
-                <Surface role='dialog' data={{ content: 'dxos.org/plugin/space/RenameSpaceDialog', subject: space }} />
-              </Dialog.Content>
-            </Dialog.Overlay>
-          </Dialog.Root>
-        )}
-        <Dialog.Root open={resolverDialogOpen} onOpenChange={setResolverDialogOpen}>
+          </div>
+        </Dialog.Root>
+      ) : null}
+      {space && (
+        <Dialog.Root open={renameDialogOpen} onOpenChange={setRenameDialogOpen}>
           <Dialog.Overlay classNames='backdrop-blur'>
             <Dialog.Content>
-              <ResolverDialog handleCreateSpace={handleCreateSpace} handleJoinSpace={handleJoinSpace} />
+              <Surface role='dialog' data={{ content: 'dxos.org/plugin/space/RenameSpaceDialog', subject: space }} />
             </Dialog.Content>
           </Dialog.Overlay>
         </Dialog.Root>
-      </DensityProvider>
+      )}
+      <Dialog.Root open={resolverDialogOpen} onOpenChange={setResolverDialogOpen}>
+        <Dialog.Overlay classNames='backdrop-blur'>
+          <Dialog.Content>
+            <ResolverDialog handleCreateSpace={handleCreateSpace} handleJoinSpace={handleJoinSpace} />
+          </Dialog.Content>
+        </Dialog.Overlay>
+      </Dialog.Root>
     </>
   );
 };

package/src/components/EmbeddedMain/GfmPreview.tsx

@@ -96,7 +96,7 @@ export const GfmPreview = ({ markdown, owner, repo }: GfmPreviewProps) => {
   return html ? (
     <>
       <style>{'.markdown-body ol, .markdown-body ul {list-style-type: disc; list-style-position: outside;}'}</style>
-      <article
+      <div
         className='markdown-body grow is-full max-is-[980px] mli-auto p-[15px] sm:pli-[45px] sm:plb-[30px]'
         dangerouslySetInnerHTML={sanitize(html, {})}
       />

package/src/components/Loading/Loading.stories.tsx

@@ -4,10 +4,18 @@
 
 import '@dxos-theme';
 
+import { type Meta } from '@storybook/react';
+
 import { Loading } from './Loading';
 
-export default {
-  title: 'plugin-github/Loading',
+export const Default = { args: { label: 'Loading', size: 'md', color: 'primary' } };
+export const Small = { args: { ...Default.args, size: 'sm' } };
+export const Neutral = { args: { ...Default.args, color: 'neutral' } };
+export const Large = { args: { ...Default.args, size: 'lg' } };
+export const ExtraLarge = { args: { ...Default.args, size: 'xl' } };
+
+const meta: Meta = {
+  title: 'plugins/plugin-github/Loading',
   component: Loading,
   argTypes: {
     size: {
@@ -21,8 +29,4 @@ export default {
   },
 };
 
-export const Default = { args: { label: 'Loading', size: 'md', color: 'primary' } };
-export const Small = { args: { ...Default.args, size: 'sm' } };
-export const Neutral = { args: { ...Default.args, color: 'neutral' } };
-export const Large = { args: { ...Default.args, size: 'lg' } };
-export const ExtraLarge = { args: { ...Default.args, size: 'xl' } };
+export default meta;

package/src/meta.ts

@@ -0,0 +1,17 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import { type PluginMeta } from '@dxos/app-framework';
+
+export const GITHUB_PLUGIN = 'dxos.org/plugin/github';
+export const GITHUB_PLUGIN_SHORT_ID = 'github';
+
+export default {
+  id: GITHUB_PLUGIN,
+  shortId: GITHUB_PLUGIN_SHORT_ID,
+  name: 'GitHub',
+  description: 'GitHub integration.',
+  tags: ['experimental'],
+  icon: 'ph--github-logo--regular',
+} satisfies PluginMeta;

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

@@ -1,24 +0,0 @@
-// packages/plugins/experimental/plugin-github/src/meta.tsx
-import { GithubLogo } from "@phosphor-icons/react";
-import React from "react";
-import { pluginMeta } from "@dxos/app-framework";
-var GITHUB_PLUGIN = "dxos.org/plugin/github";
-var GITHUB_PLUGIN_SHORT_ID = "github";
-var meta_default = pluginMeta({
-  id: GITHUB_PLUGIN,
-  shortId: GITHUB_PLUGIN_SHORT_ID,
-  name: "GitHub",
-  description: "GitHub integration.",
-  tags: [
-    "experimental"
-  ],
-  iconComponent: (props) => /* @__PURE__ */ React.createElement(GithubLogo, props),
-  iconSymbol: "ph--github-logo--regular"
-});
-
-export {
-  GITHUB_PLUGIN,
-  GITHUB_PLUGIN_SHORT_ID,
-  meta_default
-};
-//# sourceMappingURL=chunk-NJP5BGD2.mjs.map

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/meta.tsx"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { GithubLogo, type IconProps } from '@phosphor-icons/react';\nimport React from 'react';\n\nimport { pluginMeta } from '@dxos/app-framework';\n\nexport const GITHUB_PLUGIN = 'dxos.org/plugin/github';\nexport const GITHUB_PLUGIN_SHORT_ID = 'github';\n\nexport default pluginMeta({\n  id: GITHUB_PLUGIN,\n  shortId: GITHUB_PLUGIN_SHORT_ID,\n  name: 'GitHub',\n  description: 'GitHub integration.',\n  tags: ['experimental'],\n  iconComponent: (props: IconProps) => <GithubLogo {...props} />,\n  iconSymbol: 'ph--github-logo--regular',\n});\n"],
-  "mappings": ";AAIA,SAASA,kBAAkC;AAC3C,OAAOC,WAAW;AAElB,SAASC,kBAAkB;AAEpB,IAAMC,gBAAgB;AACtB,IAAMC,yBAAyB;AAEtC,IAAA,eAAeC,WAAW;EACxBC,IAAIH;EACJI,SAASH;EACTI,MAAM;EACNC,aAAa;EACbC,MAAM;IAAC;;EACPC,eAAe,CAACC,UAAqB,sBAAA,cAACC,YAAeD,KAAAA;EACrDE,YAAY;AACd,CAAA;",
-  "names": ["GithubLogo", "React", "pluginMeta", "GITHUB_PLUGIN", "GITHUB_PLUGIN_SHORT_ID", "pluginMeta", "id", "shortId", "name", "description", "tags", "iconComponent", "props", "GithubLogo", "iconSymbol"]
-}

package/src/meta.tsx

@@ -1,21 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { GithubLogo, type IconProps } from '@phosphor-icons/react';
-import React from 'react';
-
-import { pluginMeta } from '@dxos/app-framework';
-
-export const GITHUB_PLUGIN = 'dxos.org/plugin/github';
-export const GITHUB_PLUGIN_SHORT_ID = 'github';
-
-export default pluginMeta({
-  id: GITHUB_PLUGIN,
-  shortId: GITHUB_PLUGIN_SHORT_ID,
-  name: 'GitHub',
-  description: 'GitHub integration.',
-  tags: ['experimental'],
-  iconComponent: (props: IconProps) => <GithubLogo {...props} />,
-  iconSymbol: 'ph--github-logo--regular',
-});