@dxos/shell 0.7.5-staging.2ff1350 → 0.7.5-staging.e6154f3

package/dist/types/src/components/Panel/Actions.js

@@ -1,14 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Actions = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-const react_1 = require("react");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
-const Actions = (0, react_1.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)("div", { ...props, className: (0, react_ui_theme_1.mx)('flex flex-col gap-2 mbs-2', Array.isArray(children) && children.length > 1 ? 'justify-between' : 'justify-center', classNames), ref: forwardedRef, children: children }));
+import { forwardRef } from 'react';
+import { mx } from '@dxos/react-ui-theme';
+const Actions = forwardRef(({ classNames, children, ...props }, forwardedRef) => {
+    return (_jsx("div", { ...props, className: mx('flex flex-col gap-2 mbs-2', Array.isArray(children) && children.length > 1 ? 'justify-between' : 'justify-center', classNames), ref: forwardedRef, children: children }));
 });
-exports.Actions = Actions;
+export { Actions };
 //# sourceMappingURL=Actions.js.map

package/dist/types/src/components/Panel/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Actions.tsx"],"names":[],"mappings":";;;;AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,iCAAyF;AAGzF,yDAA0C;AAM1C,MAAM,OAAO,GAAG,IAAA,kBAAU,EAA+B,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC5G,OAAO,CACL,mCACM,KAAK,EACT,SAAS,EAAE,IAAA,mBAAE,EACX,2BAA2B,EAC3B,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EACrF,UAAU,CACX,EACD,GAAG,EAAE,YAAY,YAEhB,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEM,0BAAO"}
+{"version":3,"file":"Actions.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Actions.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,OAAc,EAAiC,UAAU,EAAkB,MAAM,OAAO,CAAC;AAGzF,OAAO,EAAE,EAAE,EAAE,MAAM,sBAAsB,CAAC;AAM1C,MAAM,OAAO,GAAG,UAAU,CAA+B,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAC5G,OAAO,CACL,iBACM,KAAK,EACT,SAAS,EAAE,EAAE,CACX,2BAA2B,EAC3B,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EACrF,UAAU,CACX,EACD,GAAG,EAAE,YAAY,YAEhB,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/dist/types/src/components/Panel/CloseButton.js

@@ -1,16 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CloseButton = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-const react_1 = require("@phosphor-icons/react");
-const react_ui_1 = require("@dxos/react-ui");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
-const CloseButton = ({ onDone, ...props }) => {
-    const { t } = (0, react_ui_1.useTranslation)('os');
-    return ((0, jsx_runtime_1.jsxs)(react_ui_1.Button, { variant: 'ghost', classNames: (0, react_ui_theme_1.mx)('plb-0 pli-2 absolute block-start-0 inline-end-0 z-[1]'), onClick: () => onDone === null || onDone === void 0 ? void 0 : onDone(), ...props, children: [(0, jsx_runtime_1.jsx)(react_1.X, { weight: 'bold', className: (0, react_ui_theme_1.getSize)(4) }), (0, jsx_runtime_1.jsx)("span", { className: 'sr-only', children: t('exit label') })] }));
+import { X } from '@phosphor-icons/react';
+import { Button, useTranslation } from '@dxos/react-ui';
+import { getSize, mx } from '@dxos/react-ui-theme';
+export const CloseButton = ({ onDone, ...props }) => {
+    const { t } = useTranslation('os');
+    return (_jsxs(Button, { variant: 'ghost', classNames: mx('plb-0 pli-2 absolute block-start-0 inline-end-0 z-[1]'), onClick: () => onDone === null || onDone === void 0 ? void 0 : onDone(), ...props, children: [_jsx(X, { weight: 'bold', className: getSize(4) }), _jsx("span", { className: 'sr-only', children: t('exit label') })] }));
 };
-exports.CloseButton = CloseButton;
 //# sourceMappingURL=CloseButton.js.map

package/dist/types/src/components/Panel/CloseButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CloseButton.js","sourceRoot":"","sources":["../../../../../src/components/Panel/CloseButton.tsx"],"names":[],"mappings":";;;;AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,iDAA0C;AAG1C,6CAA0E;AAC1E,yDAAmD;AAE5C,MAAM,WAAW,GAAG,CAAC,EAAE,MAAM,EAAE,GAAG,KAAK,EAA0D,EAAE,EAAE;IAC1G,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,yBAAc,EAAC,IAAI,CAAC,CAAC;IACnC,OAAO,CACL,wBAAC,iBAAM,IACL,OAAO,EAAC,OAAO,EACf,UAAU,EAAE,IAAA,mBAAE,EAAC,uDAAuD,CAAC,EACvE,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,EAAI,KACrB,KAAK,aAET,uBAAC,SAAC,IAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAE,IAAA,wBAAO,EAAC,CAAC,CAAC,GAAI,EAC1C,iCAAM,SAAS,EAAC,SAAS,YAAE,CAAC,CAAC,YAAY,CAAC,GAAQ,IAC3C,CACV,CAAC;AACJ,CAAC,CAAC;AAbW,QAAA,WAAW,eAatB"}
+{"version":3,"file":"CloseButton.js","sourceRoot":"","sources":["../../../../../src/components/Panel/CloseButton.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,OAAO,EAAE,CAAC,EAAE,MAAM,uBAAuB,CAAC;AAG1C,OAAO,EAAE,MAAM,EAAoB,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAC1E,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,MAAM,sBAAsB,CAAC;AAEnD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,MAAM,EAAE,GAAG,KAAK,EAA0D,EAAE,EAAE;IAC1G,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;IACnC,OAAO,CACL,MAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,UAAU,EAAE,EAAE,CAAC,uDAAuD,CAAC,EACvE,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,EAAI,KACrB,KAAK,aAET,KAAC,CAAC,IAAC,MAAM,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC,GAAI,EAC1C,eAAM,SAAS,EAAC,SAAS,YAAE,CAAC,CAAC,YAAY,CAAC,GAAQ,IAC3C,CACV,CAAC;AACJ,CAAC,CAAC"}

package/dist/types/src/components/Panel/Emoji.js

@@ -1,16 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Centered = exports.Emoji = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
-const Emoji = ({ text, className }) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { mx, getSize } from '@dxos/react-ui-theme';
+export const Emoji = ({ text, className }) => {
     const size = 14;
-    return ((0, jsx_runtime_1.jsx)("div", { role: 'none', className: (0, react_ui_theme_1.mx)((0, react_ui_theme_1.getSize)(size), 'rounded relative pointer-events-none', className), children: (0, jsx_runtime_1.jsx)("svg", { viewBox: `0 0 ${size * 4} ${size * 4}`, width: size * 4, height: size * 4, children: (0, jsx_runtime_1.jsx)("text", { x: '50%', y: '50%', textAnchor: 'middle', dominantBaseline: 'middle', baselineShift: '-0.25rem', fontSize: '2.25rem', children: text }) }) }));
+    return (_jsx("div", { role: 'none', className: mx(getSize(size), 'rounded relative pointer-events-none', className), children: _jsx("svg", { viewBox: `0 0 ${size * 4} ${size * 4}`, width: size * 4, height: size * 4, children: _jsx("text", { x: '50%', y: '50%', textAnchor: 'middle', dominantBaseline: 'middle', baselineShift: '-0.25rem', fontSize: '2.25rem', children: text }) }) }));
 };
-exports.Emoji = Emoji;
-const Centered = (props) => {
+export const Centered = (props) => {
     const { children } = props;
-    return ((0, jsx_runtime_1.jsx)("div", { role: 'none', className: 'absolute inset-0 flex items-center justify-center', children: children }));
+    return (_jsx("div", { role: 'none', className: 'absolute inset-0 flex items-center justify-center', children: children }));
 };
-exports.Centered = Centered;
 //# sourceMappingURL=Emoji.js.map

package/dist/types/src/components/Panel/Emoji.js.map

@@ -1 +1 @@
-{"version":3,"file":"Emoji.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Emoji.tsx"],"names":[],"mappings":";;;;AAMA,yDAAmD;AAE5C,MAAM,KAAK,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAyC,EAAE,EAAE;IAClF,MAAM,IAAI,GAAG,EAAE,CAAC;IAChB,OAAO,CACL,gCAAK,IAAI,EAAC,MAAM,EAAC,SAAS,EAAE,IAAA,mBAAE,EAAC,IAAA,wBAAO,EAAC,IAAI,CAAC,EAAE,sCAAsC,EAAE,SAAS,CAAC,YAC9F,gCAAK,OAAO,EAAE,OAAO,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,GAAG,CAAC,YAC5E,iCACE,CAAC,EAAC,KAAK,EACP,CAAC,EAAC,KAAK,EACP,UAAU,EAAC,QAAQ,EACnB,gBAAgB,EAAC,QAAQ,EACzB,aAAa,EAAE,UAAU,EACzB,QAAQ,EAAE,SAAS,YAElB,IAAI,GACA,GACH,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAlBW,QAAA,KAAK,SAkBhB;AAEK,MAAM,QAAQ,GAAG,CAAC,KAAwB,EAAE,EAAE;IACnD,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3B,OAAO,CACL,gCAAK,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,mDAAmD,YAC3E,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC;AAPW,QAAA,QAAQ,YAOnB"}
+{"version":3,"file":"Emoji.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Emoji.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAEnD,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAyC,EAAE,EAAE;IAClF,MAAM,IAAI,GAAG,EAAE,CAAC;IAChB,OAAO,CACL,cAAK,IAAI,EAAC,MAAM,EAAC,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,sCAAsC,EAAE,SAAS,CAAC,YAC9F,cAAK,OAAO,EAAE,OAAO,IAAI,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,GAAG,CAAC,YAC5E,eACE,CAAC,EAAC,KAAK,EACP,CAAC,EAAC,KAAK,EACP,UAAU,EAAC,QAAQ,EACnB,gBAAgB,EAAC,QAAQ,EACzB,aAAa,EAAE,UAAU,EACzB,QAAQ,EAAE,SAAS,YAElB,IAAI,GACA,GACH,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAwB,EAAE,EAAE;IACnD,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3B,OAAO,CACL,cAAK,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,mDAAmD,YAC3E,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/types/src/components/Panel/Heading.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Heading = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-const react_1 = require("react");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
-exports.Heading = (0, react_1.forwardRef)(({ titleId, title, titleSrOnly, children, corner }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsxs)("div", { role: 'none', className: 'pbe-2 relative', ref: forwardedRef, children: [corner, (0, jsx_runtime_1.jsx)("h1", { ...(!titleSrOnly && { id: titleId }), className: (0, react_ui_theme_1.mx)(react_ui_theme_1.descriptionText, 'text-center mlb-2', titleSrOnly && 'invisible'), children: title }), titleSrOnly && (0, jsx_runtime_1.jsx)("span", { id: titleId, children: title }), children] }));
+import { forwardRef } from 'react';
+import { descriptionText, mx } from '@dxos/react-ui-theme';
+export const Heading = forwardRef(({ titleId, title, titleSrOnly, children, corner }, forwardedRef) => {
+    return (_jsxs("div", { role: 'none', className: 'pbe-2 relative', ref: forwardedRef, children: [corner, _jsx("h1", { ...(!titleSrOnly && { id: titleId }), className: mx(descriptionText, 'text-center mlb-2', titleSrOnly && 'invisible'), children: title }), titleSrOnly && _jsx("span", { id: titleId, children: title }), children] }));
 });
 //# sourceMappingURL=Heading.js.map

package/dist/types/src/components/Panel/Heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Heading.tsx"],"names":[],"mappings":";;;;AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,iCAAkF;AAElF,yDAA2D;AAS9C,QAAA,OAAO,GAAG,IAAA,kBAAU,EAC/B,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,YAAY,EAAE,EAAE;IAClE,OAAO,CACL,iCAAK,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,gBAAgB,EAAC,GAAG,EAAE,YAAY,aAC1D,MAAM,EACP,kCACM,CAAC,CAAC,WAAW,IAAI,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EACrC,SAAS,EAAE,IAAA,mBAAE,EAAC,gCAAe,EAAE,mBAAmB,EAAE,WAAW,IAAI,WAAW,CAAC,YAE9E,KAAK,GACH,EACJ,WAAW,IAAI,iCAAM,EAAE,EAAE,OAAO,YAAG,KAAK,GAAQ,EAChD,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"Heading.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Heading.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,OAAc,EAAE,UAAU,EAA0C,MAAM,OAAO,CAAC;AAElF,OAAO,EAAE,eAAe,EAAE,EAAE,EAAE,MAAM,sBAAsB,CAAC;AAS3D,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAC/B,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,YAAY,EAAE,EAAE;IAClE,OAAO,CACL,eAAK,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,gBAAgB,EAAC,GAAG,EAAE,YAAY,aAC1D,MAAM,EACP,gBACM,CAAC,CAAC,WAAW,IAAI,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EACrC,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,mBAAmB,EAAE,WAAW,IAAI,WAAW,CAAC,YAE9E,KAAK,GACH,EACJ,WAAW,IAAI,eAAM,EAAE,EAAE,OAAO,YAAG,KAAK,GAAQ,EAChD,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/types/src/components/Panel/Input.js

@@ -1,10 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Input = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_ui_1 = require("@dxos/react-ui");
-const Input = ({ validationMessage, label, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)(react_ui_1.Input.Root, { children: [(0, jsx_runtime_1.jsx)(react_ui_1.Input.Label, { children: label }), (0, jsx_runtime_1.jsx)(react_ui_1.Input.TextInput, { ...props, classNames: 'plb-3 mbs-2 text-center' }), (0, jsx_runtime_1.jsx)(react_ui_1.Input.DescriptionAndValidation, { children: validationMessage && (0, jsx_runtime_1.jsx)(react_ui_1.Input.Validation, { children: validationMessage }) })] }));
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Input as UiInput } from '@dxos/react-ui';
+export const Input = ({ validationMessage, label, ...props }) => {
+    return (_jsxs(UiInput.Root, { children: [_jsx(UiInput.Label, { children: label }), _jsx(UiInput.TextInput, { ...props, classNames: 'plb-3 mbs-2 text-center' }), _jsx(UiInput.DescriptionAndValidation, { children: validationMessage && _jsx(UiInput.Validation, { children: validationMessage }) })] }));
 };
-exports.Input = Input;
 //# sourceMappingURL=Input.js.map

package/dist/types/src/components/Panel/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Input.tsx"],"names":[],"mappings":";;;;AAMA,6CAAuE;AAUhE,MAAM,KAAK,GAAG,CAAC,EAAE,iBAAiB,EAAE,KAAK,EAAE,GAAG,KAAK,EAAmB,EAAE,EAAE;IAC/E,OAAO,CACL,wBAAC,gBAAO,CAAC,IAAI,eACX,uBAAC,gBAAO,CAAC,KAAK,cAAE,KAAK,GAAiB,EACtC,uBAAC,gBAAO,CAAC,SAAS,OAAK,KAAK,EAAE,UAAU,EAAC,yBAAyB,GAAG,EACrE,uBAAC,gBAAO,CAAC,wBAAwB,cAC9B,iBAAiB,IAAI,uBAAC,gBAAO,CAAC,UAAU,cAAE,iBAAiB,GAAsB,GACjD,IACtB,CAChB,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,KAAK,SAUhB"}
+{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Input.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,KAAK,IAAI,OAAO,EAAuB,MAAM,gBAAgB,CAAC;AAUvE,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,iBAAiB,EAAE,KAAK,EAAE,GAAG,KAAK,EAAmB,EAAE,EAAE;IAC/E,OAAO,CACL,MAAC,OAAO,CAAC,IAAI,eACX,KAAC,OAAO,CAAC,KAAK,cAAE,KAAK,GAAiB,EACtC,KAAC,OAAO,CAAC,SAAS,OAAK,KAAK,EAAE,UAAU,EAAC,yBAAyB,GAAG,EACrE,KAAC,OAAO,CAAC,wBAAwB,cAC9B,iBAAiB,IAAI,KAAC,OAAO,CAAC,UAAU,cAAE,iBAAiB,GAAsB,GACjD,IACtB,CAChB,CAAC;AACJ,CAAC,CAAC"}

package/dist/types/src/components/Panel/Label.js

@@ -1,11 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Label = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
-const Label = (props) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { descriptionText, mx } from '@dxos/react-ui-theme';
+export const Label = (props) => {
     const { children } = props;
-    return (0, jsx_runtime_1.jsx)("span", { className: (0, react_ui_theme_1.mx)(react_ui_theme_1.descriptionText, 'text-center mli-6 whitespace-normal'), children: children });
+    return _jsx("span", { className: mx(descriptionText, 'text-center mli-6 whitespace-normal'), children: children });
 };
-exports.Label = Label;
 //# sourceMappingURL=Label.js.map

package/dist/types/src/components/Panel/Label.js.map

@@ -1 +1 @@
-{"version":3,"file":"Label.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Label.tsx"],"names":[],"mappings":";;;;AAMA,yDAA2D;AAIpD,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAE,EAAE;IACzC,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3B,OAAO,iCAAM,SAAS,EAAE,IAAA,mBAAE,EAAC,gCAAe,EAAE,qCAAqC,CAAC,YAAG,QAAQ,GAAQ,CAAC;AACxG,CAAC,CAAC;AAHW,QAAA,KAAK,SAGhB"}
+{"version":3,"file":"Label.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Label.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,eAAe,EAAE,EAAE,EAAE,MAAM,sBAAsB,CAAC;AAI3D,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAE,EAAE;IACzC,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3B,OAAO,eAAM,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,qCAAqC,CAAC,YAAG,QAAQ,GAAQ,CAAC;AACxG,CAAC,CAAC"}

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

@@ -2,7 +2,7 @@ import '@dxos-theme';
 declare const _default: {
     title: string;
     component: (props: import("../StorybookDialog").StorybookDialogProps) => import("react/jsx-runtime").JSX.Element;
-    decorators: import("@storybook/react/*").Decorator[];
+    decorators: import("@storybook/react").Decorator[];
 };
 export default _default;
 export declare const Normal: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/types/src/components/Panel/Panel.stories.js

@@ -1,28 +1,23 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Primary = exports.Normal = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-require("@dxos-theme");
-const storybook_utils_1 = require("@dxos/storybook-utils");
-const Action_1 = require("./Action");
-const Actions_1 = require("./Actions");
-const Heading_1 = require("./Heading");
-const Label_1 = require("./Label");
-const StorybookDialog_1 = require("../StorybookDialog");
-exports.default = {
+import '@dxos-theme';
+import { withTheme } from '@dxos/storybook-utils';
+import { Action } from './Action';
+import { Actions } from './Actions';
+import { Heading } from './Heading';
+import { Label } from './Label';
+import { StorybookDialog } from '../StorybookDialog';
+export default {
     title: 'sdk/shell/StorybookDialog',
-    component: StorybookDialog_1.StorybookDialog,
-    decorators: [storybook_utils_1.withTheme],
+    component: StorybookDialog,
+    decorators: [withTheme],
 };
-const Normal = (props) => {
-    return ((0, jsx_runtime_1.jsxs)(StorybookDialog_1.StorybookDialog, { ...props, children: [(0, jsx_runtime_1.jsx)(Heading_1.Heading, { title: 'Panel heading', titleId: 'panel-heading' }), (0, jsx_runtime_1.jsxs)("div", { className: 'p-3 text-center', children: [(0, jsx_runtime_1.jsx)(Label_1.Label, { children: "Lorem ipsum" }), (0, jsx_runtime_1.jsxs)(Actions_1.Actions, { children: [(0, jsx_runtime_1.jsx)(Action_1.Action, { variant: 'ghost', children: "Ghost" }), (0, jsx_runtime_1.jsx)(Action_1.Action, { children: "Normal" })] })] })] }));
+export const Normal = (props) => {
+    return (_jsxs(StorybookDialog, { ...props, children: [_jsx(Heading, { title: 'Panel heading', titleId: 'panel-heading' }), _jsxs("div", { className: 'p-3 text-center', children: [_jsx(Label, { children: "Lorem ipsum" }), _jsxs(Actions, { children: [_jsx(Action, { variant: 'ghost', children: "Ghost" }), _jsx(Action, { children: "Normal" })] })] })] }));
 };
-exports.Normal = Normal;
-const Primary = (props) => {
-    return ((0, jsx_runtime_1.jsxs)(StorybookDialog_1.StorybookDialog, { ...props, children: [(0, jsx_runtime_1.jsx)(Heading_1.Heading, { title: 'Panel heading', titleId: 'panel-heading' }), (0, jsx_runtime_1.jsxs)("div", { className: 'p-3 text-center', children: [(0, jsx_runtime_1.jsx)(Label_1.Label, { children: "Lorem ipsum" }), (0, jsx_runtime_1.jsxs)(Actions_1.Actions, { children: [(0, jsx_runtime_1.jsx)(Action_1.Action, { variant: 'ghost', children: "Ghost" }), (0, jsx_runtime_1.jsx)(Action_1.Action, { variant: 'primary', children: "Primary" })] })] })] }));
+export const Primary = (props) => {
+    return (_jsxs(StorybookDialog, { ...props, children: [_jsx(Heading, { title: 'Panel heading', titleId: 'panel-heading' }), _jsxs("div", { className: 'p-3 text-center', children: [_jsx(Label, { children: "Lorem ipsum" }), _jsxs(Actions, { children: [_jsx(Action, { variant: 'ghost', children: "Ghost" }), _jsx(Action, { variant: 'primary', children: "Primary" })] })] })] }));
 };
-exports.Primary = Primary;
 //# sourceMappingURL=Panel.stories.js.map

package/dist/types/src/components/Panel/Panel.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.stories.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Panel.stories.tsx"],"names":[],"mappings":";;;;AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,uBAAqB;AAIrB,2DAAkD;AAElD,qCAAkC;AAClC,uCAAoC;AACpC,uCAAoC;AACpC,mCAAgC;AAChC,wDAAqD;AAErD,kBAAe;IACb,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,iCAAe;IAC1B,UAAU,EAAE,CAAC,2BAAS,CAAC;CACxB,CAAC;AAEK,MAAM,MAAM,GAAG,CAAC,KAAU,EAAE,EAAE;IACnC,OAAO,CACL,wBAAC,iCAAe,OAAK,KAAK,aACxB,uBAAC,iBAAO,IAAC,KAAK,EAAC,eAAe,EAAC,OAAO,EAAC,eAAe,GAAW,EACjE,iCAAK,SAAS,EAAC,iBAAiB,aAC9B,uBAAC,aAAK,8BAAoB,EAC1B,wBAAC,iBAAO,eACN,uBAAC,eAAM,IAAC,OAAO,EAAC,OAAO,sBAAe,EACtC,uBAAC,eAAM,yBAAgB,IACf,IACN,IACU,CACnB,CAAC;AACJ,CAAC,CAAC;AAbW,QAAA,MAAM,UAajB;AAEK,MAAM,OAAO,GAAG,CAAC,KAAU,EAAE,EAAE;IACpC,OAAO,CACL,wBAAC,iCAAe,OAAK,KAAK,aACxB,uBAAC,iBAAO,IAAC,KAAK,EAAC,eAAe,EAAC,OAAO,EAAC,eAAe,GAAW,EACjE,iCAAK,SAAS,EAAC,iBAAiB,aAC9B,uBAAC,aAAK,8BAAoB,EAC1B,wBAAC,iBAAO,eACN,uBAAC,eAAM,IAAC,OAAO,EAAC,OAAO,sBAAe,EACtC,uBAAC,eAAM,IAAC,OAAO,EAAC,SAAS,wBAAiB,IAClC,IACN,IACU,CACnB,CAAC;AACJ,CAAC,CAAC;AAbW,QAAA,OAAO,WAalB"}
+{"version":3,"file":"Panel.stories.js","sourceRoot":"","sources":["../../../../../src/components/Panel/Panel.stories.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,OAAO,aAAa,CAAC;AAIrB,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,eAAe;IACb,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,eAAe;IAC1B,UAAU,EAAE,CAAC,SAAS,CAAC;CACxB,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAU,EAAE,EAAE;IACnC,OAAO,CACL,MAAC,eAAe,OAAK,KAAK,aACxB,KAAC,OAAO,IAAC,KAAK,EAAC,eAAe,EAAC,OAAO,EAAC,eAAe,GAAW,EACjE,eAAK,SAAS,EAAC,iBAAiB,aAC9B,KAAC,KAAK,8BAAoB,EAC1B,MAAC,OAAO,eACN,KAAC,MAAM,IAAC,OAAO,EAAC,OAAO,sBAAe,EACtC,KAAC,MAAM,yBAAgB,IACf,IACN,IACU,CACnB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAAU,EAAE,EAAE;IACpC,OAAO,CACL,MAAC,eAAe,OAAK,KAAK,aACxB,KAAC,OAAO,IAAC,KAAK,EAAC,eAAe,EAAC,OAAO,EAAC,eAAe,GAAW,EACjE,eAAK,SAAS,EAAC,iBAAiB,aAC9B,KAAC,KAAK,8BAAoB,EAC1B,MAAC,OAAO,eACN,KAAC,MAAM,IAAC,OAAO,EAAC,OAAO,sBAAe,EACtC,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,wBAAiB,IAClC,IACN,IACU,CACnB,CAAC;AACJ,CAAC,CAAC"}

package/dist/types/src/components/Panel/StepHeading.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StepHeading = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-const react_1 = require("react");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
-exports.StepHeading = (0, react_1.forwardRef)(({ children, className, ...props }, forwardedRef) => {
-    return ((0, jsx_runtime_1.jsx)("h2", { ...props, className: (0, react_ui_theme_1.mx)('font-normal text-sm mbe-4 mli-1 text-center', className), ref: forwardedRef, children: children }));
+import { forwardRef } from 'react';
+import { mx } from '@dxos/react-ui-theme';
+export const StepHeading = forwardRef(({ children, className, ...props }, forwardedRef) => {
+    return (_jsx("h2", { ...props, className: mx('font-normal text-sm mbe-4 mli-1 text-center', className), ref: forwardedRef, children: children }));
 });
 //# sourceMappingURL=StepHeading.js.map

package/dist/types/src/components/Panel/StepHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepHeading.js","sourceRoot":"","sources":["../../../../../src/components/Panel/StepHeading.tsx"],"names":[],"mappings":";;;;AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,iCAAsE;AAEtE,yDAA0C;AAE7B,QAAA,WAAW,GAAG,IAAA,kBAAU,EACnC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAClD,OAAO,CACL,kCAAQ,KAAK,EAAE,SAAS,EAAE,IAAA,mBAAE,EAAC,6CAA6C,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE,YAAY,YACtG,QAAQ,GACN,CACN,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"StepHeading.js","sourceRoot":"","sources":["../../../../../src/components/Panel/StepHeading.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,OAAc,EAA8B,UAAU,EAAE,MAAM,OAAO,CAAC;AAEtE,OAAO,EAAE,EAAE,EAAE,MAAM,sBAAsB,CAAC;AAE1C,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE;IAClD,OAAO,CACL,gBAAQ,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,6CAA6C,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE,YAAY,YACtG,QAAQ,GACN,CACN,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/types/src/components/Panel/index.js

@@ -1,28 +1,12 @@
-"use strict";
 //
 // Copyright 2023 DXOS.org
 //
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Action"), exports);
-__exportStar(require("./Actions"), exports);
-__exportStar(require("./CloseButton"), exports);
-__exportStar(require("./Emoji"), exports);
-__exportStar(require("./Heading"), exports);
-__exportStar(require("./Label"), exports);
-__exportStar(require("./Input"), exports);
-__exportStar(require("./StepHeading"), exports);
+export * from './Action';
+export * from './Actions';
+export * from './CloseButton';
+export * from './Emoji';
+export * from './Heading';
+export * from './Label';
+export * from './Input';
+export * from './StepHeading';
 //# sourceMappingURL=index.js.map

package/dist/types/src/components/Panel/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Panel/index.ts"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;;;;;;;;;;;;;;;;AAEF,2CAAyB;AACzB,4CAA0B;AAC1B,gDAA8B;AAC9B,0CAAwB;AACxB,4CAA0B;AAC1B,0CAAwB;AACxB,0CAAwB;AACxB,gDAA8B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Panel/index.ts"],"names":[],"mappings":"AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC"}

package/dist/types/src/components/SpaceListItem.js

@@ -1,19 +1,16 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SpaceListItem = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-const react_1 = require("react");
-const react_ui_1 = require("@dxos/react-ui");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
-const util_1 = require("@dxos/util");
-exports.SpaceListItem = (0, react_1.forwardRef)(({ space, onClick }, ref) => {
+import { forwardRef } from 'react';
+import { Avatar, useId } from '@dxos/react-ui';
+import { mx } from '@dxos/react-ui-theme';
+import { humanize, keyToEmoji } from '@dxos/util';
+export const SpaceListItem = forwardRef(({ space, onClick }, ref) => {
     var _a;
-    const fallbackValue = (0, util_1.keyToEmoji)(space.key);
-    const labelId = (0, react_ui_1.useId)('identityListItem__label');
-    const displayName = (_a = space.properties.name) !== null && _a !== void 0 ? _a : (0, util_1.humanize)(space.key.toHex());
-    return ((0, jsx_runtime_1.jsx)("li", { className: (0, react_ui_theme_1.mx)('flex gap-2 items-center mbe-2', onClick && 'cursor-pointer'), onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(), ref: ref, "data-testid": 'space-list-item', children: (0, jsx_runtime_1.jsxs)(react_ui_1.Avatar.Root, { labelId: labelId, children: [(0, jsx_runtime_1.jsx)(react_ui_1.Avatar.Frame, { children: (0, jsx_runtime_1.jsx)(react_ui_1.Avatar.Fallback, { text: fallbackValue }) }), (0, jsx_runtime_1.jsx)(react_ui_1.Avatar.Label, { classNames: 'text-sm truncate', children: displayName })] }) }));
+    const fallbackValue = keyToEmoji(space.key);
+    const labelId = useId('identityListItem__label');
+    const displayName = (_a = space.properties.name) !== null && _a !== void 0 ? _a : humanize(space.key.toHex());
+    return (_jsx("li", { className: mx('flex gap-2 items-center mbe-2', onClick && 'cursor-pointer'), onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(), ref: ref, "data-testid": 'space-list-item', children: _jsxs(Avatar.Root, { labelId: labelId, children: [_jsx(Avatar.Frame, { children: _jsx(Avatar.Fallback, { text: fallbackValue }) }), _jsx(Avatar.Label, { classNames: 'text-sm truncate', children: displayName })] }) }));
 });
 //# sourceMappingURL=SpaceListItem.js.map

package/dist/types/src/components/SpaceListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpaceListItem.js","sourceRoot":"","sources":["../../../../src/components/SpaceListItem.tsx"],"names":[],"mappings":";;;;AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,iCAA6D;AAG7D,6CAA+C;AAC/C,yDAA0C;AAC1C,qCAAkD;AAErC,QAAA,aAAa,GAAG,IAAA,kBAAU,EACrC,CAAC,EAAE,KAAK,EAAE,OAAO,EAA0C,EAAE,GAAgC,EAAE,EAAE;;IAC/F,MAAM,aAAa,GAAG,IAAA,iBAAU,EAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,IAAA,gBAAK,EAAC,yBAAyB,CAAC,CAAC;IACjD,MAAM,WAAW,GAAG,MAAA,KAAK,CAAC,UAAU,CAAC,IAAI,mCAAI,IAAA,eAAQ,EAAC,KAAK,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC;IAEzE,OAAO,CACL,+BACE,SAAS,EAAE,IAAA,mBAAE,EAAC,+BAA+B,EAAE,OAAO,IAAI,gBAAgB,CAAC,EAC3E,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,EAAI,EAC1B,GAAG,EAAE,GAAG,iBACI,iBAAiB,YAE7B,wBAAC,iBAAM,CAAC,IAAI,IAAC,OAAO,EAAE,OAAO,aAC3B,uBAAC,iBAAM,CAAC,KAAK,cACX,uBAAC,iBAAM,CAAC,QAAQ,IAAC,IAAI,EAAE,aAAa,GAAI,GAC3B,EACf,uBAAC,iBAAM,CAAC,KAAK,IAAC,UAAU,EAAC,kBAAkB,YAAE,WAAW,GAAgB,IAC5D,GACX,CACN,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"SpaceListItem.js","sourceRoot":"","sources":["../../../../src/components/SpaceListItem.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,OAAc,EAAqB,UAAU,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,EAAE,EAAE,MAAM,sBAAsB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAElD,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CACrC,CAAC,EAAE,KAAK,EAAE,OAAO,EAA0C,EAAE,GAAgC,EAAE,EAAE;;IAC/F,MAAM,aAAa,GAAG,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,KAAK,CAAC,yBAAyB,CAAC,CAAC;IACjD,MAAM,WAAW,GAAG,MAAA,KAAK,CAAC,UAAU,CAAC,IAAI,mCAAI,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC;IAEzE,OAAO,CACL,aACE,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,OAAO,IAAI,gBAAgB,CAAC,EAC3E,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,EAAI,EAC1B,GAAG,EAAE,GAAG,iBACI,iBAAiB,YAE7B,MAAC,MAAM,CAAC,IAAI,IAAC,OAAO,EAAE,OAAO,aAC3B,KAAC,MAAM,CAAC,KAAK,cACX,KAAC,MAAM,CAAC,QAAQ,IAAC,IAAI,EAAE,aAAa,GAAI,GAC3B,EACf,KAAC,MAAM,CAAC,KAAK,IAAC,UAAU,EAAC,kBAAkB,YAAE,WAAW,GAAgB,IAC5D,GACX,CACN,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/types/src/components/StorybookDialog.js

@@ -1,13 +1,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StorybookDialog = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_ui_1 = require("@dxos/react-ui");
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Clipboard, ElevationProvider, Tooltip, useThemeContext } from '@dxos/react-ui';
 // TODO(burdon): Move out of components.
-const StorybookDialog = (props) => {
+export const StorybookDialog = (props) => {
     const { inOverlayLayout = false } = props;
-    const { tx } = (0, react_ui_1.useThemeContext)();
-    return ((0, jsx_runtime_1.jsx)(react_ui_1.Tooltip.Provider, { children: (0, jsx_runtime_1.jsx)(react_ui_1.ElevationProvider, { elevation: 'dialog', children: (0, jsx_runtime_1.jsx)(react_ui_1.Clipboard.Provider, { children: (0, jsx_runtime_1.jsx)("div", { role: 'group', className: tx('dialog.content', 'dialog', { inOverlayLayout }, 'p-1', inOverlayLayout ? 'm-4' : ''), children: props.children }) }) }) }));
+    const { tx } = useThemeContext();
+    return (_jsx(Tooltip.Provider, { children: _jsx(ElevationProvider, { elevation: 'dialog', children: _jsx(Clipboard.Provider, { children: _jsx("div", { role: 'group', className: tx('dialog.content', 'dialog', { inOverlayLayout }, 'p-1', inOverlayLayout ? 'm-4' : ''), children: props.children }) }) }) }));
 };
-exports.StorybookDialog = StorybookDialog;
 //# sourceMappingURL=StorybookDialog.js.map

package/dist/types/src/components/StorybookDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"StorybookDialog.js","sourceRoot":"","sources":["../../../../src/components/StorybookDialog.tsx"],"names":[],"mappings":";;;;AAMA,6CAAwF;AAMxF,wCAAwC;AACjC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC7D,MAAM,EAAE,eAAe,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAC1C,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,0BAAe,GAAE,CAAC;IACjC,OAAO,CACL,uBAAC,kBAAO,CAAC,QAAQ,cACf,uBAAC,4BAAiB,IAAC,SAAS,EAAC,QAAQ,YACnC,uBAAC,oBAAS,CAAC,QAAQ,cACjB,gCACE,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,EAAE,CAAC,gBAAgB,EAAE,QAAQ,EAAE,EAAE,eAAe,EAAE,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,YAElG,KAAK,CAAC,QAAQ,GACX,GACa,GACH,GACH,CACpB,CAAC;AACJ,CAAC,CAAC;AAjBW,QAAA,eAAe,mBAiB1B"}
+{"version":3,"file":"StorybookDialog.js","sourceRoot":"","sources":["../../../../src/components/StorybookDialog.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAMxF,wCAAwC;AACxC,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC7D,MAAM,EAAE,eAAe,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAC1C,MAAM,EAAE,EAAE,EAAE,GAAG,eAAe,EAAE,CAAC;IACjC,OAAO,CACL,KAAC,OAAO,CAAC,QAAQ,cACf,KAAC,iBAAiB,IAAC,SAAS,EAAC,QAAQ,YACnC,KAAC,SAAS,CAAC,QAAQ,cACjB,cACE,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,EAAE,CAAC,gBAAgB,EAAE,QAAQ,EAAE,EAAE,eAAe,EAAE,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,YAElG,KAAK,CAAC,QAAQ,GACX,GACa,GACH,GACH,CACpB,CAAC;AACJ,CAAC,CAAC"}

package/dist/types/src/components/Viewport/Viewport.js

@@ -1,50 +1,46 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.createViewportScope = exports.useViewportContext = exports.Viewport = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-const react_tabster_1 = require("@fluentui/react-tabster");
-const react_context_1 = require("@radix-ui/react-context");
-const react_use_controllable_state_1 = require("@radix-ui/react-use-controllable-state");
-const react_1 = require("react");
-const react_ui_1 = require("@dxos/react-ui");
-const react_ui_theme_1 = require("@dxos/react-ui-theme");
+import { useFocusFinders } from '@fluentui/react-tabster';
+import { createContextScope } from '@radix-ui/react-context';
+import { useControllableState } from '@radix-ui/react-use-controllable-state';
+import { forwardRef, useEffect, } from 'react';
+import { useForwardedRef } from '@dxos/react-ui';
+import { mx } from '@dxos/react-ui-theme';
 const VIEWPORT_NAME = 'Viewport';
 const VIEWS_NAME = 'ViewportViews';
 const VIEW_NAME = 'ViewportView';
-const [createViewportContext, createViewportScope] = (0, react_context_1.createContextScope)(VIEWPORT_NAME, []);
-exports.createViewportScope = createViewportScope;
+const [createViewportContext, createViewportScope] = createContextScope(VIEWPORT_NAME, []);
 const [ViewportProvider, useViewportContext] = createViewportContext(VIEWPORT_NAME);
-exports.useViewportContext = useViewportContext;
 const ViewportRoot = ({ __viewportScope, classNames, children, defaultActiveView, activeView: propsActiveView, focusManaged = false, onActiveViewChange, ...props }) => {
-    const [activeView = 'never', setActiveView] = (0, react_use_controllable_state_1.useControllableState)({
+    const [activeView = 'never', setActiveView] = useControllableState({
         prop: propsActiveView,
         defaultProp: defaultActiveView,
         onChange: onActiveViewChange,
     });
-    return ((0, jsx_runtime_1.jsx)(ViewportProvider, { focusManaged: focusManaged, activeView: activeView, setActiveView: setActiveView, scope: __viewportScope, children: (0, jsx_runtime_1.jsx)("div", { role: 'region', "aria-live": 'polite', ...props, className: (0, react_ui_theme_1.mx)('is-full overflow-hidden', classNames), children: children }) }));
+    return (_jsx(ViewportProvider, { focusManaged: focusManaged, activeView: activeView, setActiveView: setActiveView, scope: __viewportScope, children: _jsx("div", { role: 'region', "aria-live": 'polite', ...props, className: mx('is-full overflow-hidden', classNames), children: children }) }));
 };
 ViewportRoot.displayName = VIEWPORT_NAME;
 const ViewportViews = ({ classNames, children, ...props }) => {
     const size = { inlineSize: `${Math.ceil(children.length) * 100}%` };
-    return ((0, jsx_runtime_1.jsx)("div", { role: 'none', style: size, ...props, className: (0, react_ui_theme_1.mx)('flex', classNames), children: children }));
+    return (_jsx("div", { role: 'none', style: size, ...props, className: mx('flex', classNames), children: children }));
 };
 ViewportViews.displayName = VIEWS_NAME;
-const ViewportView = (0, react_1.forwardRef)(({ __viewportScope, classNames, children, id, ...props }, forwardedRef) => {
+const ViewportView = forwardRef(({ __viewportScope, classNames, children, id, ...props }, forwardedRef) => {
     const { activeView, focusManaged } = useViewportContext(VIEW_NAME, __viewportScope);
     const isActive = id === activeView;
-    const ref = (0, react_ui_1.useForwardedRef)(forwardedRef);
-    const { findFirstFocusable } = (0, react_tabster_1.useFocusFinders)();
-    (0, react_1.useEffect)(() => {
+    const ref = useForwardedRef(forwardedRef);
+    const { findFirstFocusable } = useFocusFinders();
+    useEffect(() => {
         var _a;
         if (!focusManaged && isActive && document.body.hasAttribute('data-is-keyboard') && ref.current) {
             (_a = findFirstFocusable(ref.current)) === null || _a === void 0 ? void 0 : _a.focus();
         }
     }, [focusManaged, ref.current, isActive]);
-    return ((0, jsx_runtime_1.jsx)("section", { ...props, ...(!isActive && { 'aria-hidden': true }), className: (0, react_ui_theme_1.mx)('min-is-0 flex-1 flex flex-col', isActive ? 'order-2' : 'order-4 invisible', classNames), ref: ref, children: children }));
+    return (_jsx("section", { ...props, ...(!isActive && { 'aria-hidden': true }), className: mx('min-is-0 flex-1 flex flex-col', isActive ? 'order-2' : 'order-4 invisible', classNames), ref: ref, children: children }));
 });
 ViewportView.displayName = VIEW_NAME;
-exports.Viewport = { Root: ViewportRoot, Views: ViewportViews, View: ViewportView };
+export const Viewport = { Root: ViewportRoot, Views: ViewportViews, View: ViewportView };
+export { useViewportContext, createViewportScope };
 //# sourceMappingURL=Viewport.js.map

package/dist/types/src/components/Viewport/Viewport.js.map

@@ -1 +1 @@
-{"version":3,"file":"Viewport.js","sourceRoot":"","sources":["../../../../../src/components/Viewport/Viewport.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Viewport.js","sourceRoot":"","sources":["../../../../../src/components/Viewport/Viewport.tsx"],"names":[],"mappings":"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"}

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

@@ -3,7 +3,7 @@ type StorybookViewportProps = {};
 declare const _default: {
     title: string;
     component: (props: StorybookViewportProps) => import("react/jsx-runtime").JSX.Element;
-    decorators: import("@storybook/react/*").Decorator[];
+    decorators: import("@storybook/react").Decorator[];
     parameters: {
         chromatic: {
             disableSnapshot: boolean;

package/dist/types/src/components/Viewport/Viewport.stories.js

@@ -1,29 +1,26 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //
 // Copyright 2023 DXOS.org
 //
-require("@dxos-theme");
-const react_ui_1 = require("@dxos/react-ui");
-const storybook_utils_1 = require("@dxos/storybook-utils");
-const Viewport_1 = require("./Viewport");
-const Panel_1 = require("../Panel");
+import '@dxos-theme';
+import { AlertDialog } from '@dxos/react-ui';
+import { withTheme } from '@dxos/storybook-utils';
+import { useViewportContext, Viewport } from './Viewport';
+import { Action } from '../Panel';
 const Views = ({ __viewportScope }) => {
-    const { setActiveView } = (0, Viewport_1.useViewportContext)('StorybookViews', __viewportScope);
-    return ((0, jsx_runtime_1.jsxs)(Viewport_1.Viewport.Views, { children: [(0, jsx_runtime_1.jsxs)(Viewport_1.Viewport.View, { id: 'one', classNames: 'p-4', children: [(0, jsx_runtime_1.jsx)("p", { children: "One" }), (0, jsx_runtime_1.jsx)("p", { className: 'invisible', children: "Two" }), (0, jsx_runtime_1.jsx)("p", { className: 'invisible', children: "Three" }), (0, jsx_runtime_1.jsx)(Panel_1.Action, { onClick: () => setActiveView('two'), children: "Next" })] }), (0, jsx_runtime_1.jsxs)(Viewport_1.Viewport.View, { id: 'two', classNames: 'p-4', children: [(0, jsx_runtime_1.jsx)("p", { className: 'invisible', children: "One" }), (0, jsx_runtime_1.jsx)("p", { children: "Two" }), (0, jsx_runtime_1.jsx)("p", { className: 'invisible', children: "Three" }), (0, jsx_runtime_1.jsx)(Panel_1.Action, { onClick: () => setActiveView('three'), children: "Next" })] }), (0, jsx_runtime_1.jsxs)(Viewport_1.Viewport.View, { id: 'three', classNames: 'p-4', children: [(0, jsx_runtime_1.jsx)("p", { className: 'invisible', children: "One" }), (0, jsx_runtime_1.jsx)("p", { className: 'invisible', children: "Two" }), (0, jsx_runtime_1.jsx)("p", { children: "Three" }), (0, jsx_runtime_1.jsx)(Panel_1.Action, { onClick: () => setActiveView('one'), children: "Next" })] })] }));
+    const { setActiveView } = useViewportContext('StorybookViews', __viewportScope);
+    return (_jsxs(Viewport.Views, { children: [_jsxs(Viewport.View, { id: 'one', classNames: 'p-4', children: [_jsx("p", { children: "One" }), _jsx("p", { className: 'invisible', children: "Two" }), _jsx("p", { className: 'invisible', children: "Three" }), _jsx(Action, { onClick: () => setActiveView('two'), children: "Next" })] }), _jsxs(Viewport.View, { id: 'two', classNames: 'p-4', children: [_jsx("p", { className: 'invisible', children: "One" }), _jsx("p", { children: "Two" }), _jsx("p", { className: 'invisible', children: "Three" }), _jsx(Action, { onClick: () => setActiveView('three'), children: "Next" })] }), _jsxs(Viewport.View, { id: 'three', classNames: 'p-4', children: [_jsx("p", { className: 'invisible', children: "One" }), _jsx("p", { className: 'invisible', children: "Two" }), _jsx("p", { children: "Three" }), _jsx(Action, { onClick: () => setActiveView('one'), children: "Next" })] })] }));
 };
 const StorybookViewport = (props) => {
-    return ((0, jsx_runtime_1.jsx)(react_ui_1.AlertDialog.Root, { defaultOpen: true, children: (0, jsx_runtime_1.jsx)(react_ui_1.AlertDialog.Overlay, { children: (0, jsx_runtime_1.jsx)(react_ui_1.AlertDialog.Content, { classNames: 'p-0', children: (0, jsx_runtime_1.jsx)(Viewport_1.Viewport.Root, { defaultActiveView: 'one', children: (0, jsx_runtime_1.jsx)(Views, {}) }) }) }) }));
+    return (_jsx(AlertDialog.Root, { defaultOpen: true, children: _jsx(AlertDialog.Overlay, { children: _jsx(AlertDialog.Content, { classNames: 'p-0', children: _jsx(Viewport.Root, { defaultActiveView: 'one', children: _jsx(Views, {}) }) }) }) }));
 };
-exports.default = {
+export default {
     title: 'sdk/shell/StorybookViewport',
     component: StorybookViewport,
-    decorators: [storybook_utils_1.withTheme],
+    decorators: [withTheme],
     parameters: { chromatic: { disableSnapshot: false } },
 };
-exports.Default = {
+export const Default = {
     args: {},
 };
 //# sourceMappingURL=Viewport.stories.js.map

package/dist/types/src/components/Viewport/Viewport.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Viewport.stories.js","sourceRoot":"","sources":["../../../../../src/components/Viewport/Viewport.stories.tsx"],"names":[],"mappings":";;;;AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,uBAAqB;AAIrB,6CAA6C;AAC7C,2DAAkD;AAElD,yCAAoF;AACpF,oCAAkC;AAIlC,MAAM,KAAK,GAAG,CAAC,EAAE,eAAe,EAA2B,EAAE,EAAE;IAC7D,MAAM,EAAE,aAAa,EAAE,GAAG,IAAA,6BAAkB,EAAC,gBAAgB,EAAE,eAAe,CAAC,CAAC;IAChF,OAAO,CACL,wBAAC,mBAAQ,CAAC,KAAK,eACb,wBAAC,mBAAQ,CAAC,IAAI,IAAC,EAAE,EAAC,KAAK,EAAC,UAAU,EAAC,KAAK,aACtC,gDAAU,EACV,8BAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,8BAAG,SAAS,EAAC,WAAW,sBAAU,EAClC,uBAAC,cAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,qBAAe,IAC5C,EAChB,wBAAC,mBAAQ,CAAC,IAAI,IAAC,EAAE,EAAC,KAAK,EAAC,UAAU,EAAC,KAAK,aACtC,8BAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,gDAAU,EACV,8BAAG,SAAS,EAAC,WAAW,sBAAU,EAClC,uBAAC,cAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,OAAO,CAAC,qBAAe,IAC9C,EAChB,wBAAC,mBAAQ,CAAC,IAAI,IAAC,EAAE,EAAC,OAAO,EAAC,UAAU,EAAC,KAAK,aACxC,8BAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,8BAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,kDAAY,EACZ,uBAAC,cAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,qBAAe,IAC5C,IACD,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAE,EAAE;IAC1D,OAAO,CACL,uBAAC,sBAAW,CAAC,IAAI,IAAC,WAAW,kBAC3B,uBAAC,sBAAW,CAAC,OAAO,cAClB,uBAAC,sBAAW,CAAC,OAAO,IAAC,UAAU,EAAC,KAAK,YACnC,uBAAC,mBAAQ,CAAC,IAAI,IAAC,iBAAiB,EAAC,KAAK,YACpC,uBAAC,KAAK,KAAG,GACK,GACI,GACF,GACL,CACpB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe;IACb,KAAK,EAAE,6BAA6B;IACpC,SAAS,EAAE,iBAAiB;IAC5B,UAAU,EAAE,CAAC,2BAAS,CAAC;IACvB,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,eAAe,EAAE,KAAK,EAAE,EAAE;CACtD,CAAC;AAEW,QAAA,OAAO,GAAG;IACrB,IAAI,EAAE,EAAE;CACT,CAAC"}
+{"version":3,"file":"Viewport.stories.js","sourceRoot":"","sources":["../../../../../src/components/Viewport/Viewport.stories.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,OAAO,aAAa,CAAC;AAIrB,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAE,kBAAkB,EAAE,QAAQ,EAA4B,MAAM,YAAY,CAAC;AACpF,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAIlC,MAAM,KAAK,GAAG,CAAC,EAAE,eAAe,EAA2B,EAAE,EAAE;IAC7D,MAAM,EAAE,aAAa,EAAE,GAAG,kBAAkB,CAAC,gBAAgB,EAAE,eAAe,CAAC,CAAC;IAChF,OAAO,CACL,MAAC,QAAQ,CAAC,KAAK,eACb,MAAC,QAAQ,CAAC,IAAI,IAAC,EAAE,EAAC,KAAK,EAAC,UAAU,EAAC,KAAK,aACtC,8BAAU,EACV,YAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,YAAG,SAAS,EAAC,WAAW,sBAAU,EAClC,KAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,qBAAe,IAC5C,EAChB,MAAC,QAAQ,CAAC,IAAI,IAAC,EAAE,EAAC,KAAK,EAAC,UAAU,EAAC,KAAK,aACtC,YAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,8BAAU,EACV,YAAG,SAAS,EAAC,WAAW,sBAAU,EAClC,KAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,OAAO,CAAC,qBAAe,IAC9C,EAChB,MAAC,QAAQ,CAAC,IAAI,IAAC,EAAE,EAAC,OAAO,EAAC,UAAU,EAAC,KAAK,aACxC,YAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,YAAG,SAAS,EAAC,WAAW,oBAAQ,EAChC,gCAAY,EACZ,KAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,qBAAe,IAC5C,IACD,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAE,EAAE;IAC1D,OAAO,CACL,KAAC,WAAW,CAAC,IAAI,IAAC,WAAW,kBAC3B,KAAC,WAAW,CAAC,OAAO,cAClB,KAAC,WAAW,CAAC,OAAO,IAAC,UAAU,EAAC,KAAK,YACnC,KAAC,QAAQ,CAAC,IAAI,IAAC,iBAAiB,EAAC,KAAK,YACpC,KAAC,KAAK,KAAG,GACK,GACI,GACF,GACL,CACpB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe;IACb,KAAK,EAAE,6BAA6B;IACpC,SAAS,EAAE,iBAAiB;IAC5B,UAAU,EAAE,CAAC,SAAS,CAAC;IACvB,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,eAAe,EAAE,KAAK,EAAE,EAAE;CACtD,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,IAAI,EAAE,EAAE;CACT,CAAC"}

package/dist/types/src/components/Viewport/index.js

@@ -1,21 +1,5 @@
-"use strict";
 //
 // Copyright 2023 DXOS.org
 //
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Viewport"), exports);
+export * from './Viewport';
 //# sourceMappingURL=index.js.map

package/dist/types/src/components/Viewport/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Viewport/index.tsx"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;;;;;;;;;;;;;;;;AAEF,6CAA2B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Viewport/index.tsx"],"names":[],"mappings":"AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;AAEF,cAAc,YAAY,CAAC"}