@appkit/dek-lib 0.29.0 → 0.31.0

package/dist/data/types/gql.d.ts

@@ -11,7 +11,7 @@ import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/
  * Therefore it is highly recommended to use the babel or swc plugin for production.
  */
 declare const documents: {
-    "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n": DocumentNode<types.UserDataQuery, types.Exact<{
+    "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n": DocumentNode<types.UserDataQuery, types.Exact<{
         [key: string]: never;
     }>>;
     "\n  query userPluginsAndIntegrations {\n    currentUser {\n      plugins {\n        name\n        code\n        version\n      }\n      integrations {\n        key\n        pluginName\n        pluginVersion\n        pluginConfig {\n          key\n          value\n        }\n      }\n    }\n  }\n": DocumentNode<types.UserPluginsAndIntegrationsQuery, types.Exact<{
@@ -37,7 +37,7 @@ export declare function gql(source: string): unknown;
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export declare function gql(source: "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n"): (typeof documents)["\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n"];
+export declare function gql(source: "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n"): (typeof documents)["\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n"];
 /**
  * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */

package/dist/data/types/graphql.d.ts

@@ -91,9 +91,9 @@ export type AddCommandGroupResult = {
     error?: Maybe<Error>;
 };
 export type AddCommandInput = {
-    component: Scalars['String']['input'];
+    componentKey: Scalars['String']['input'];
     containerProps?: InputMaybe<Array<CommandPropInput>>;
-    integration: Scalars['String']['input'];
+    integrationKey: Scalars['String']['input'];
     props?: InputMaybe<Array<CommandPropInput>>;
     title: Scalars['String']['input'];
 };
@@ -172,9 +172,9 @@ export type AddUserResult = {
 };
 export type AddZoneInput = {
     boardId: Scalars['ID']['input'];
-    component: Scalars['String']['input'];
+    componentKey: Scalars['String']['input'];
     containerProps?: InputMaybe<Array<ZonePropInput>>;
-    integration: Scalars['String']['input'];
+    integrationKey: Scalars['String']['input'];
     key: Scalars['String']['input'];
     props?: InputMaybe<Array<ZonePropInput>>;
 };
@@ -325,11 +325,11 @@ export type Command = {
     __typename?: 'Command';
     archived: Scalars['Boolean']['output'];
     archivedAt?: Maybe<Scalars['DateTime']['output']>;
-    component: Scalars['String']['output'];
+    componentKey: Scalars['String']['output'];
     containerProps: Array<CommandProp>;
     createdAt: Scalars['DateTime']['output'];
     id: Scalars['ID']['output'];
-    integration: Scalars['String']['output'];
+    integrationKey: Scalars['String']['output'];
     props: Array<CommandProp>;
     title: Scalars['String']['output'];
     updatedAt: Scalars['DateTime']['output'];
@@ -991,9 +991,9 @@ export type UpdateCommandGroupResult = {
 };
 export type UpdateCommandInput = {
     archived?: InputMaybe<Scalars['Boolean']['input']>;
-    component?: InputMaybe<Scalars['String']['input']>;
+    componentKey?: InputMaybe<Scalars['String']['input']>;
     containerProps?: InputMaybe<Array<CommandPropInput>>;
-    integration?: InputMaybe<Scalars['String']['input']>;
+    integrationKey?: InputMaybe<Scalars['String']['input']>;
     props?: InputMaybe<Array<CommandPropInput>>;
     title?: InputMaybe<Scalars['String']['input']>;
 };
@@ -1067,9 +1067,9 @@ export type UpdateUserResult = {
 };
 export type UpdateZoneInput = {
     archived?: InputMaybe<Scalars['Boolean']['input']>;
-    component?: InputMaybe<Scalars['String']['input']>;
+    componentKey?: InputMaybe<Scalars['String']['input']>;
     containerProps?: InputMaybe<Array<ZonePropInput>>;
-    integration?: InputMaybe<Scalars['String']['input']>;
+    integrationKey?: InputMaybe<Scalars['String']['input']>;
     key?: InputMaybe<Scalars['String']['input']>;
     props?: InputMaybe<Array<ZonePropInput>>;
 };
@@ -1153,11 +1153,12 @@ export type Zone = {
     archived: Scalars['Boolean']['output'];
     archivedAt?: Maybe<Scalars['DateTime']['output']>;
     board: Board;
-    component: Scalars['String']['output'];
+    componentKey: Scalars['String']['output'];
     containerProps: Array<ZoneProp>;
     createdAt: Scalars['DateTime']['output'];
     id: Scalars['ID']['output'];
-    integration: Scalars['String']['output'];
+    integration: Integration;
+    integrationKey: Scalars['String']['output'];
     key: Scalars['String']['output'];
     props: Array<ZoneProp>;
     updatedAt: Scalars['DateTime']['output'];
@@ -1215,8 +1216,8 @@ export type UserDataQuery = {
             zones: Array<{
                 __typename?: 'Zone';
                 key: string;
-                integration: string;
-                component: string;
+                integrationKey: string;
+                componentKey: string;
                 props: Array<{
                     __typename?: 'ZoneProp';
                     key: string;
@@ -1236,8 +1237,8 @@ export type UserDataQuery = {
             commands: Array<{
                 __typename?: 'Command';
                 title: string;
-                integration: string;
-                component: string;
+                integrationKey: string;
+                componentKey: string;
                 props: Array<{
                     __typename?: 'CommandProp';
                     key: string;

package/dist/index.es.js

@@ -49811,8 +49811,8 @@ const Zone = (props) => {
     if (zones.length > 1) {
       const components = [];
       zones.forEach((zone2) => {
-        if (zone2.integration && zone2.component) {
-          const component = api2.integration(zone2.integration).component(zone2.component, {
+        if (zone2.integrationKey && zone2.componentKey) {
+          const component = api2.integration(zone2.integrationKey).component(zone2.componentKey, {
             ...parsePropsForComponent(api2, zone2.props),
             "aria-label": `zone-${props.id}`
           });
@@ -49843,9 +49843,9 @@ const Zone = (props) => {
     const zone = api2.board.zones.find(
       (z) => z.key === props.id
     );
-    if (zone && zone.integration && zone.component) {
-      label = `${props.id}: ${zone.integration}/${zone.component}`;
-      const component = api2.integration(zone.integration).component(zone.component, {
+    if (zone && zone.integrationKey && zone.componentKey) {
+      label = `${props.id}: ${zone.integrationKey}/${zone.componentKey}`;
+      const component = api2.integration(zone.integrationKey).component(zone.componentKey, {
         ...parsePropsForComponent(api2, zone.props),
         "aria-label": `zone-${props.id}`
       });
@@ -66270,11 +66270,11 @@ async function getClient(email, password) {
     cache: new InMemoryCache()
   });
 }
-const UserDataDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "query", "name": { "kind": "Name", "value": "userData" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "currentUser" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "name" } }, { "kind": "Field", "name": { "kind": "Name", "value": "email" } }, { "kind": "Field", "name": { "kind": "Name", "value": "location" } }, { "kind": "Field", "name": { "kind": "Name", "value": "avatar" } }, { "kind": "Field", "name": { "kind": "Name", "value": "boards" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "layout" } }, { "kind": "Field", "name": { "kind": "Name", "value": "base" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "zones" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "component" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "commandGroups" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "commands" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "component" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }] } }] } }] };
+const UserDataDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "query", "name": { "kind": "Name", "value": "userData" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "currentUser" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "name" } }, { "kind": "Field", "name": { "kind": "Name", "value": "email" } }, { "kind": "Field", "name": { "kind": "Name", "value": "location" } }, { "kind": "Field", "name": { "kind": "Name", "value": "avatar" } }, { "kind": "Field", "name": { "kind": "Name", "value": "boards" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "layout" } }, { "kind": "Field", "name": { "kind": "Name", "value": "base" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "zones" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integrationKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "componentKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "commandGroups" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "commands" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integrationKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "componentKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }] } }] } }] };
 const UserPluginsAndIntegrationsDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "query", "name": { "kind": "Name", "value": "userPluginsAndIntegrations" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "currentUser" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "plugins" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "name" } }, { "kind": "Field", "name": { "kind": "Name", "value": "code" } }, { "kind": "Field", "name": { "kind": "Name", "value": "version" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "integrations" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "pluginName" } }, { "kind": "Field", "name": { "kind": "Name", "value": "pluginVersion" } }, { "kind": "Field", "name": { "kind": "Name", "value": "pluginConfig" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }] } }] };
 const UserChangeDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "subscription", "name": { "kind": "Name", "value": "userChange" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "userChange" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "user" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }] } }] } }] } }] };
 const documents = {
-  "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n": UserDataDocument,
+  "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n": UserDataDocument,
   "\n  query userPluginsAndIntegrations {\n    currentUser {\n      plugins {\n        name\n        code\n        version\n      }\n      integrations {\n        key\n        pluginName\n        pluginVersion\n        pluginConfig {\n          key\n          value\n        }\n      }\n    }\n  }\n": UserPluginsAndIntegrationsDocument,
   "\n  subscription userChange {\n    userChange {\n      user {\n        id\n      }\n    }\n  }\n": UserChangeDocument
 };
@@ -66300,8 +66300,8 @@ const USER_DATA_QUERY = gql(`
         }
         zones {
           key
-          integration
-          component
+          integrationKey
+          componentKey
           props {
             key
             value
@@ -66317,8 +66317,8 @@ const USER_DATA_QUERY = gql(`
         key
         commands {
           title
-          integration
-          component
+          integrationKey
+          componentKey
           props {
             key
             value
@@ -66861,7 +66861,7 @@ async function fetchUserPlugins(email, password) {
   result.integrations.push({
     key: "base",
     pluginName: "base",
-    pluginVersion: "0.27.0",
+    pluginVersion: "0.31.0",
     pluginConfig: []
   });
   return result;
@@ -67036,7 +67036,7 @@ const Header = ({ height = 70 }) => {
 };
 const About = () => {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(u0, { padding: 20, direction: "vert", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(PU1, { children: `Dek ${"0.27.0"}` }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(PU1, { children: `Dek ${"0.31.0"}` }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(h4, { children: "From Appkit" })
   ] });
 };
@@ -98725,8 +98725,7 @@ const ComponentScreen = ({ api: api2 }) => {
     setPropsString(value);
   };
   const parsedProps = parsePropsForComponent(api2, propsArray);
-  const maxWidth = parsedProps && parsedProps["dev"] && parsedProps["dev"]["maxWidth"];
-  const maxHeight = parsedProps && parsedProps["dev"] && parsedProps["dev"]["maxHeight"];
+  const style = parsedProps && parsedProps["style"];
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Wt2, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(Fq1, { fullscreen: true, cols: "40% 60%", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(St2, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(u0, { direction: "vert", paddingTop: 100, children: [
@@ -98778,18 +98777,7 @@ const ComponentScreen = ({ api: api2 }) => {
         ) }),
         error2 && /* @__PURE__ */ jsxRuntimeExports.jsx(h4, { color: "red", paddingLeft: 15, paddingTop: 10, children: error2 })
       ] }) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(St2, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(u0, { halign: "left", valign: "center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "div",
-        {
-          style: {
-            width: "100%",
-            maxWidth,
-            height: "100%",
-            maxHeight
-          },
-          children: propsString && api2.integration("plugin").component(params.componentKey, parsedProps)
-        }
-      ) }) })
+      /* @__PURE__ */ jsxRuntimeExports.jsx(St2, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(u0, { halign: "left", valign: "center", style, children: propsString && api2.integration("plugin").component(params.componentKey, parsedProps) }) })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsx($t2, { title: `Component View`, subtitle: params.componentKey })
   ] });
@@ -103039,7 +103027,7 @@ async function updatePlugins(email, password) {
         {
           key: "base",
           pluginName: "base",
-          pluginVersion: "0.27.0",
+          pluginVersion: "0.31.0",
           pluginConfig: []
         }
       ],
@@ -104172,7 +104160,7 @@ const Router = ({ userConfig, transitionDelay: transitionDelay2 }) => {
   if (!data) {
     return null;
   }
-  const defaultBoard = data.boards.length > 0 ? data.boards[0].key : "empty";
+  const defaultBoard = data.boards.length > 0 ? data.boards[data.boards.length - 1].key : "empty";
   if (location2 === "/") {
     setLocation(`/${defaultBoard}`);
   } else {
@@ -104244,8 +104232,8 @@ const CommandGroup = ({ groupKey }) => {
     return null;
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsx(Container, { children: group.commands.map((command, idx) => {
-    const instance = api2.integration(command.integration).component(
-      command.component,
+    const instance = api2.integration(command.integrationKey).component(
+      command.componentKey,
       parsePropsForComponent(api2, command.props)
     );
     return /* @__PURE__ */ jsxRuntimeExports.jsx(CommandItem, { children: instance }, idx);

package/dist/index.umd.js

@@ -49828,8 +49828,8 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
       if (zones.length > 1) {
         const components = [];
         zones.forEach((zone2) => {
-          if (zone2.integration && zone2.component) {
-            const component = api2.integration(zone2.integration).component(zone2.component, {
+          if (zone2.integrationKey && zone2.componentKey) {
+            const component = api2.integration(zone2.integrationKey).component(zone2.componentKey, {
               ...parsePropsForComponent(api2, zone2.props),
               "aria-label": `zone-${props.id}`
             });
@@ -49860,9 +49860,9 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
       const zone = api2.board.zones.find(
         (z) => z.key === props.id
       );
-      if (zone && zone.integration && zone.component) {
-        label = `${props.id}: ${zone.integration}/${zone.component}`;
-        const component = api2.integration(zone.integration).component(zone.component, {
+      if (zone && zone.integrationKey && zone.componentKey) {
+        label = `${props.id}: ${zone.integrationKey}/${zone.componentKey}`;
+        const component = api2.integration(zone.integrationKey).component(zone.componentKey, {
           ...parsePropsForComponent(api2, zone.props),
           "aria-label": `zone-${props.id}`
         });
@@ -66287,11 +66287,11 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
       cache: new InMemoryCache()
     });
   }
-  const UserDataDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "query", "name": { "kind": "Name", "value": "userData" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "currentUser" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "name" } }, { "kind": "Field", "name": { "kind": "Name", "value": "email" } }, { "kind": "Field", "name": { "kind": "Name", "value": "location" } }, { "kind": "Field", "name": { "kind": "Name", "value": "avatar" } }, { "kind": "Field", "name": { "kind": "Name", "value": "boards" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "layout" } }, { "kind": "Field", "name": { "kind": "Name", "value": "base" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "zones" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "component" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "commandGroups" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "commands" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "component" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }] } }] } }] };
+  const UserDataDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "query", "name": { "kind": "Name", "value": "userData" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "currentUser" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "name" } }, { "kind": "Field", "name": { "kind": "Name", "value": "email" } }, { "kind": "Field", "name": { "kind": "Name", "value": "location" } }, { "kind": "Field", "name": { "kind": "Name", "value": "avatar" } }, { "kind": "Field", "name": { "kind": "Name", "value": "boards" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }, { "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "layout" } }, { "kind": "Field", "name": { "kind": "Name", "value": "base" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "integration" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "zones" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integrationKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "componentKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "commandGroups" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "commands" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "title" } }, { "kind": "Field", "name": { "kind": "Name", "value": "integrationKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "componentKey" } }, { "kind": "Field", "name": { "kind": "Name", "value": "props" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "containerProps" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }] } }] } }] };
   const UserPluginsAndIntegrationsDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "query", "name": { "kind": "Name", "value": "userPluginsAndIntegrations" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "currentUser" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "plugins" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "name" } }, { "kind": "Field", "name": { "kind": "Name", "value": "code" } }, { "kind": "Field", "name": { "kind": "Name", "value": "version" } }] } }, { "kind": "Field", "name": { "kind": "Name", "value": "integrations" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "pluginName" } }, { "kind": "Field", "name": { "kind": "Name", "value": "pluginVersion" } }, { "kind": "Field", "name": { "kind": "Name", "value": "pluginConfig" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "key" } }, { "kind": "Field", "name": { "kind": "Name", "value": "value" } }] } }] } }] } }] } }] };
   const UserChangeDocument = { "kind": "Document", "definitions": [{ "kind": "OperationDefinition", "operation": "subscription", "name": { "kind": "Name", "value": "userChange" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "userChange" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "user" }, "selectionSet": { "kind": "SelectionSet", "selections": [{ "kind": "Field", "name": { "kind": "Name", "value": "id" } }] } }] } }] } }] };
   const documents = {
-    "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integration\n          component\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n": UserDataDocument,
+    "\n  query userData {\n    currentUser {\n      id\n      name\n      email\n      location\n      avatar\n      boards {\n        id\n        title\n        key\n        layout\n        base {\n          integration\n          key\n        }\n        zones {\n          key\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n      commandGroups {\n        title\n        key\n        commands {\n          title\n          integrationKey\n          componentKey\n          props {\n            key\n            value\n          }\n          containerProps {\n            key\n            value\n          }\n        }\n      }\n    }\n  }\n": UserDataDocument,
     "\n  query userPluginsAndIntegrations {\n    currentUser {\n      plugins {\n        name\n        code\n        version\n      }\n      integrations {\n        key\n        pluginName\n        pluginVersion\n        pluginConfig {\n          key\n          value\n        }\n      }\n    }\n  }\n": UserPluginsAndIntegrationsDocument,
     "\n  subscription userChange {\n    userChange {\n      user {\n        id\n      }\n    }\n  }\n": UserChangeDocument
   };
@@ -66317,8 +66317,8 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
         }
         zones {
           key
-          integration
-          component
+          integrationKey
+          componentKey
           props {
             key
             value
@@ -66334,8 +66334,8 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
         key
         commands {
           title
-          integration
-          component
+          integrationKey
+          componentKey
           props {
             key
             value
@@ -66878,7 +66878,7 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
     result.integrations.push({
       key: "base",
       pluginName: "base",
-      pluginVersion: "0.27.0",
+      pluginVersion: "0.31.0",
       pluginConfig: []
     });
     return result;
@@ -67053,7 +67053,7 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
   };
   const About = () => {
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(u0, { padding: 20, direction: "vert", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(PU1, { children: `Dek ${"0.27.0"}` }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(PU1, { children: `Dek ${"0.31.0"}` }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(h4, { children: "From Appkit" })
     ] });
   };
@@ -98742,8 +98742,7 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
       setPropsString(value);
     };
     const parsedProps = parsePropsForComponent(api2, propsArray);
-    const maxWidth = parsedProps && parsedProps["dev"] && parsedProps["dev"]["maxWidth"];
-    const maxHeight = parsedProps && parsedProps["dev"] && parsedProps["dev"]["maxHeight"];
+    const style = parsedProps && parsedProps["style"];
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(Wt2, { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs(Fq1, { fullscreen: true, cols: "40% 60%", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(St2, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(u0, { direction: "vert", paddingTop: 100, children: [
@@ -98795,18 +98794,7 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
           ) }),
           error2 && /* @__PURE__ */ jsxRuntimeExports.jsx(h4, { color: "red", paddingLeft: 15, paddingTop: 10, children: error2 })
         ] }) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(St2, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(u0, { halign: "left", valign: "center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "div",
-          {
-            style: {
-              width: "100%",
-              maxWidth,
-              height: "100%",
-              maxHeight
-            },
-            children: propsString && api2.integration("plugin").component(params.componentKey, parsedProps)
-          }
-        ) }) })
+        /* @__PURE__ */ jsxRuntimeExports.jsx(St2, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(u0, { halign: "left", valign: "center", style, children: propsString && api2.integration("plugin").component(params.componentKey, parsedProps) }) })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsx($t2, { title: `Component View`, subtitle: params.componentKey })
     ] });
@@ -103056,7 +103044,7 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
           {
             key: "base",
             pluginName: "base",
-            pluginVersion: "0.27.0",
+            pluginVersion: "0.31.0",
             pluginConfig: []
           }
         ],
@@ -104189,7 +104177,7 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
     if (!data) {
       return null;
     }
-    const defaultBoard = data.boards.length > 0 ? data.boards[0].key : "empty";
+    const defaultBoard = data.boards.length > 0 ? data.boards[data.boards.length - 1].key : "empty";
     if (location2 === "/") {
       setLocation(`/${defaultBoard}`);
     } else {
@@ -104261,8 +104249,8 @@ Arguments: ` + Array.prototype.slice.call(n5).join("") + `
       return null;
     }
     return /* @__PURE__ */ jsxRuntimeExports.jsx(Container, { children: group.commands.map((command, idx) => {
-      const instance = api2.integration(command.integration).component(
-        command.component,
+      const instance = api2.integration(command.integrationKey).component(
+        command.componentKey,
         parsePropsForComponent(api2, command.props)
       );
       return /* @__PURE__ */ jsxRuntimeExports.jsx(CommandItem, { children: instance }, idx);

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@appkit/dek-lib",
   "private": false,
-  "version": "0.29.0",
+  "version": "0.31.0",
   "type": "module",
   "scripts": {
     "dev": "vite --port 5173 --host",
     "build": "tsc && vite build",
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
-    "codegen": "graphql-codegen",
+    "generate": "graphql-codegen",
     "preview": "vite preview"
   },
   "dependencies": {