@stack-spot/ai-chat-widget 0.11.0 → 1.0.0-dev.1768324407795

package/src/views/Workspaces/WorkspacesTab.tsx

@@ -0,0 +1,116 @@
+import { Icon } from '@stack-spot/citric-icons'
+import { AsyncContent, Button, Center, Column, ImageBox, ImageWithFallback, Text } from '@stack-spot/citric-react'
+import { workspaceAiClient } from '@stack-spot/portal-network'
+import { WorkspaceResponse, WorkspaceVisibilityLevelEnum } from '@stack-spot/portal-network/api/workspace-ai'
+import { Dictionary, useTranslate } from '@stack-spot/portal-translate'
+import { useTransition } from 'react'
+import { useComponentNavigation } from '../../components/ComponentNavigator'
+import { ListResource } from '../../components/ListResource'
+import { CardSpace, WorkspaceTabNavigator } from '../../components/WorkspaceTabNavigator'
+import { ChatProperties } from '../../state/ChatState'
+import { AgentsTab } from '../Agents/AgentsTab'
+import { KnowledgeSourcesTab } from '../KnowledgeSources'
+import { StacksTab } from '../Stacks'
+
+const SpaceCard = ({ workspaceId }: { workspaceId: string }) => {
+  const workspace = workspaceAiClient.workspaceAi.useQuery({ id: workspaceId })
+  return <Column gap="4px">
+    <Center gap="8px">
+      <ImageBox size="sm" appearance="square">
+        <ImageWithFallback src={workspace.logo ?? ''} fallback={<Icon icon="Spaces" />} />
+      </ImageBox>
+      <Text appearance="body2" weight="medium">{workspace.name}</Text>
+    </Center>
+    <Text color="light.700">{workspace.description}</Text>
+  </Column>
+}
+
+export interface TabProps {
+  visibility: WorkspaceVisibilityLevelEnum,
+  allKS: React.MutableRefObject<ChatProperties['knowledgeSources']>,
+  agent: React.MutableRefObject<ChatProperties['agent']>,
+  stack: React.MutableRefObject<ChatProperties['stack']>,
+  workspaceId?: string,
+  onSubmit: () => void,
+}
+
+export interface WorkspaceResource {
+  id: string,
+  resourceType: 'agent' | 'ks' | 'stack',
+  displayName: string,
+  icon: React.ReactElement,
+  workspaceId?: string,
+}
+
+const showSubmitButton = false
+
+export const WorkspaceResources = ({ workspaceId, allKS, agent, stack }: Omit<TabProps, 'onSubmit'>) => {
+  const { navigate } = useComponentNavigation<typeof workspaceTabComponents>()
+  const [isPending, startTransition] = useTransition()
+  const resourceTypes: WorkspaceResource[] = [
+    { id: 'agents', resourceType: 'agent', displayName: 'Agents', workspaceId, icon: <Icon icon="Agent" /> },
+    { id: 'ks', resourceType: 'ks', displayName: 'Knowledge Sources', workspaceId, icon: <Icon icon="KnowledgeSource" /> },
+    { id: 'stack', resourceType: 'stack', displayName: 'Stacks', workspaceId, icon: <Icon icon="Stack" /> },
+  ]
+
+  const handleNavigate = (resource: WorkspaceResource) => {
+    startTransition(() => {
+      if (resource.resourceType === 'agent')
+        navigate({ component: 'agent', props: { visibility: 'workspace', agent, workspaceId, showSubmitButton }, fullScreen: true })
+
+      if (resource.resourceType === 'ks')
+        navigate({ component: 'ks', props: { visibility: 'workspace', allKS, workspaceId, showSubmitButton }, fullScreen: true })
+
+      if (resource.resourceType === 'stack')
+        navigate({ component: 'stack', props: { visibility: 'workspace', stack, workspaceId, showSubmitButton }, fullScreen: true })
+    })
+  }
+
+  return (<>
+    {workspaceId && <SpaceCard workspaceId={workspaceId} />}
+    {<AsyncContent loading={isPending}>
+      <ListResource
+        list={resourceTypes}
+        keygen={w => w.id}
+        renderLabel={r => <CardSpace name={r.displayName} icon={r.icon} onClick={() => handleNavigate(r)} />}
+        style={{ gap: '6px', display: 'flex', flexDirection: 'column' }}
+      />
+    </AsyncContent>}
+  </>
+  )
+}
+
+const workspaceTabComponents = {
+  workspaceResource: WorkspaceResources,
+  agent: AgentsTab,
+  ks: KnowledgeSourcesTab,
+  stack: StacksTab,
+}
+
+export function WorkspacesTab({ visibility, allKS, agent, stack, onSubmit }: TabProps) {
+  const t = useTranslate(dictionary)
+  const buildNavigateParams = (workspace: WorkspaceResponse) => ({
+    component: 'workspaceResource',
+    props: { allKS, agent, stack, visibility, workspaceId: workspace.id } satisfies Omit<TabProps, 'onSubmit'>,
+    fullScreen: true,
+  })
+
+  return (<>
+    <WorkspaceTabNavigator
+      components={workspaceTabComponents}
+      getNavigateParam={buildNavigateParams}
+      visibility={visibility}
+    />
+    <Button className="workspace-submit" onClick={onSubmit}>{t.apply}</Button>
+  </>
+  )
+}
+
+const dictionary = {
+  en: {
+    apply: 'Apply',
+  },
+  pt: {
+    apply: 'Aplicar',
+  },
+} satisfies Dictionary

package/src/views/Workspaces/index.tsx

@@ -0,0 +1,78 @@
+import { Dictionary, useTranslate } from '@stack-spot/portal-translate'
+import { useCallback, useEffect, useRef } from 'react'
+import { RightPanelTabs } from '../../components/RightPanelTabs'
+import { useCurrentChat, useWidget, useWidgetState } from '../../context/hooks'
+import { useRightPanel } from '../../right-panel/hooks'
+import { WorkspacesTab } from './WorkspacesTab'
+
+/**
+ * Renders the Workspace selection form in the Right Panel if this is the panel that is currently opened.
+ */
+export const Workspaces = () => {
+  const t = useTranslate(dictionary)
+  const panel = useWidgetState('panel')
+  const { open } = useRightPanel()
+  const widget = useWidget()
+  const chat = useCurrentChat()
+
+  useEffect(() => {
+    if (panel === 'workspace') open(
+      <WorkspacesPanel key={chat.id} />,
+      { title: t.title, description: t.description, onClose: () => widget.set('panel', undefined) },
+    )
+  }, [panel, t, chat.id])
+  return null
+}
+
+const WorkspacesPanel = () => {
+  const t = useTranslate(dictionary)
+  const chat = useCurrentChat()
+  const allKS = useRef(chat.get('knowledgeSources') ?? [])
+  const agent = useRef(chat.get('agent'))
+  const stack = useRef(chat.get('stack'))
+  const { close } = useRightPanel()
+
+  const onSubmit = useCallback(() => {
+    chat.set('knowledgeSources', allKS.current)
+    chat.set('stack', stack.current)
+    chat.set('agent', agent.current)
+    close()
+  }, [chat])
+
+  useEffect(() => {
+    allKS.current = chat.get('knowledgeSources') ?? []
+    agent.current = chat.get('agent')
+    stack.current = chat.get('stack')
+  }, [chat])
+
+
+  return <RightPanelTabs key={chat.id} tabs={[
+    {
+      key: 'favorites',
+      label: t.favorites,
+      content: <WorkspacesTab key="favorite" visibility="favorite" allKS={allKS} agent={agent} stack={stack} onSubmit={onSubmit} />,
+    },
+    {
+      key: 'all',
+      label: t.all,
+      content: <WorkspacesTab key="all" visibility="all" allKS={allKS} agent={agent} stack={stack} onSubmit={onSubmit} />,
+    },
+  ]}
+  />
+}
+
+const dictionary = {
+  en: {
+    title: 'Spot',
+    description: 'By selecting a spot, its Knowledge Sources (KSs), Agents, Quick Commands and Stacks Ai will be consulted to generate the answers.',
+    noSearchResults: "Your search didn't yield results.",
+    all: 'All',
+    favorites: 'Favorites',
+  },
+  pt: {
+    title: 'Spot',
+    description: 'Ao selecionar um spot, seus Knowledge Sources (KSs), Agentes, Quick Commands e Stacks Ai serão consultados para gerar as respostas.',
+    all: 'Todos',
+    favorites: 'Favoritos',
+  },
+} satisfies Dictionary

package/tsconfig.json

@@ -2,7 +2,11 @@
   "compilerOptions": {
     "target": "ES2023",
     "useDefineForClassFields": true,
-    "lib": ["ES2023", "DOM", "DOM.Iterable"],
+    "lib": [
+      "ES2023",
+      "DOM",
+      "DOM.Iterable"
+    ],
     "moduleResolution": "Bundler",
     "jsx": "react-jsx",
     "skipLibCheck": true,
@@ -11,12 +15,13 @@
     "declarationMap": true,
     "module": "ESNext",
     "outDir": "dist",
-    /* Linting */
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
     "stripInternal": true
   },
-  "include": ["src"]
+  "include": [
+    "src"
+  ]
 }

package/dist/components/Accordion.d.ts

@@ -1,10 +0,0 @@
-import { WithStyle } from '@stack-spot/portal-theme';
-import React from 'react';
-import { WithChildren } from '../types.js';
-interface Props extends WithStyle, Required<WithChildren> {
-    header: React.ReactNode;
-    startExpanded?: boolean;
-}
-export declare const Accordion: ({ children, header, className, startExpanded, style }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=Accordion.d.ts.map

package/dist/components/Accordion.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../src/components/Accordion.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AACpD,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,UAAU,KAAM,SAAQ,SAAS,EAAE,QAAQ,CAAC,YAAY,CAAC;IACvD,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAqCD,eAAO,MAAM,SAAS,0DAA2D,KAAK,4CAarF,CAAA"}

package/dist/components/Accordion.js

@@ -1,46 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/* Copiar do EDP ou usar o AnimatedHeight da lib de components */
-import { ChevronDown } from '@citric/icons';
-import { IconButton } from '@citric/ui';
-import { AnimatedHeight } from '@stack-spot/portal-components/AnimatedHeight';
-import { useState } from 'react';
-import { styled } from 'styled-components';
-const StyledAccordion = styled.div `
-  > header {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-    padding: 10px;
-
-    > button {
-      transition: transform 0.3s ease-out;
-      background: transparent;
-      border: none;
-      padding: 0;
-
-      &:hover {
-        background: transparent;
-      }
-
-      svg {
-        width: 16px;
-        height: 16px;
-        margin: 4px;
-      }
-    }
-
-    &.expanded > button {
-      transform: rotate(180deg);
-    }
-  }
-
-  > .accordion-content {
-    padding: 10px;
-  }
-`;
-export const Accordion = ({ children, header, className, startExpanded, style }) => {
-    const [expanded, setExpanded] = useState(startExpanded);
-    return (_jsx(AnimatedHeight, { style: style, className: className, children: _jsxs(StyledAccordion, { children: [_jsxs("header", { className: expanded ? 'expanded' : '', children: [header, _jsx(IconButton, { onClick: () => setExpanded(v => !v), children: _jsx(ChevronDown, {}) })] }), expanded ? _jsx("div", { className: "accordion-content", children: children }) : null] }) }));
-};
-//# sourceMappingURL=Accordion.js.map

package/dist/components/Accordion.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../src/components/Accordion.tsx"],"names":[],"mappings":";AAAA,iEAAiE;AAEjE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,8CAA8C,CAAA;AAE7E,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAQ1C,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiCjC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,KAAK,EAAS,EAAE,EAAE;IACxF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA;IACvD,OAAO,CACL,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,YAChD,MAAC,eAAe,eACd,kBAAQ,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,aAC1C,MAAM,EACP,KAAC,UAAU,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,YAAE,KAAC,WAAW,KAAG,GAAa,IACtE,EACR,QAAQ,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAO,CAAC,CAAC,CAAC,IAAI,IACtD,GACH,CAClB,CAAA;AACH,CAAC,CAAA"}

package/dist/components/FallbackBoundary/ErrorBoundary.d.ts

@@ -1,30 +0,0 @@
-import { ErrorDescription } from '@stack-spot/portal-components/error';
-import { Component } from 'react';
-interface State extends ErrorDescription {
-    hasError: boolean;
-}
-interface Props {
-    children: React.ReactNode;
-}
-/**
- * An Error Boundary that renders an ErrorFeedback instead of its content if any of its children throws.
- *
- * To customize what properties are passed to the ErrorFeedback component, setup an error descriptor for the ErrorManager class. If you're
- * using the component `Layout` or `RawLayout`, you can use the property `errorDescriptor`.
- *
- * To run an error handler every time an error is catch by this boundary, setup an error handler for the ErrorManager class. If you're
- * using the component `Layout` or `RawLayout`, you can use the property `onError`.
- */
-export declare class ErrorBoundary extends Component<Props, State> {
-    constructor(props: Props);
-    static getDerivedStateFromError(error: any): {
-        hasError: boolean;
-        message: any;
-        code: number | undefined;
-    };
-    componentDidCatch(error: any, errorInfo: any): void;
-    componentDidUpdate(prevProps: Readonly<Props>): void;
-    render(): string | number | boolean | Iterable<import("react").ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
-}
-export {};
-//# sourceMappingURL=ErrorBoundary.d.ts.map

package/dist/components/FallbackBoundary/ErrorBoundary.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ErrorBoundary.d.ts","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/ErrorBoundary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAiB,MAAM,qCAAqC,CAAA;AAErF,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,UAAU,KAAM,SAAQ,gBAAgB;IACtC,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,UAAU,KAAK;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;GAQG;AACH,qBAAa,aAAc,SAAQ,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC;gBAC5C,KAAK,EAAE,KAAK;IAKxB,MAAM,CAAC,wBAAwB,CAAC,KAAK,EAAE,GAAG;;;;;IAM1C,iBAAiB,CAAC,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG;IAK5C,kBAAkB,CAAC,SAAS,EAAE,QAAQ,CAAC,KAAK,CAAC;IAI7C,MAAM;CAKP"}

package/dist/components/FallbackBoundary/ErrorBoundary.js

@@ -1,38 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ErrorFeedback } from '@stack-spot/portal-components/error';
-import { StackspotAPIError } from '@stack-spot/portal-network';
-import { Component } from 'react';
-/**
- * An Error Boundary that renders an ErrorFeedback instead of its content if any of its children throws.
- *
- * To customize what properties are passed to the ErrorFeedback component, setup an error descriptor for the ErrorManager class. If you're
- * using the component `Layout` or `RawLayout`, you can use the property `errorDescriptor`.
- *
- * To run an error handler every time an error is catch by this boundary, setup an error handler for the ErrorManager class. If you're
- * using the component `Layout` or `RawLayout`, you can use the property `onError`.
- */
-export class ErrorBoundary extends Component {
-    constructor(props) {
-        super(props);
-        this.state = { hasError: false };
-    }
-    static getDerivedStateFromError(error) {
-        const message = error instanceof StackspotAPIError ? error.translate() : (error.message ?? `${error}`);
-        const code = error instanceof StackspotAPIError ? error.status : undefined;
-        return { hasError: true, message, code };
-    }
-    componentDidCatch(error, errorInfo) {
-        // eslint-disable-next-line no-console
-        console.error(error, errorInfo);
-    }
-    componentDidUpdate(prevProps) {
-        if (this.props.children !== prevProps.children)
-            this.setState({ hasError: false });
-    }
-    render() {
-        return this.state.hasError
-            ? _jsx(ErrorFeedback, { code: this.state.code, message: this.state.message })
-            : this.props.children;
-    }
-}
-//# sourceMappingURL=ErrorBoundary.js.map

package/dist/components/FallbackBoundary/ErrorBoundary.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ErrorBoundary.js","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/ErrorBoundary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAoB,aAAa,EAAE,MAAM,qCAAqC,CAAA;AACrF,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAUjC;;;;;;;;GAQG;AACH,MAAM,OAAO,aAAc,SAAQ,SAAuB;IACxD,YAAY,KAAY;QACtB,KAAK,CAAC,KAAK,CAAC,CAAA;QACZ,IAAI,CAAC,KAAK,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAA;IAClC,CAAC;IAED,MAAM,CAAC,wBAAwB,CAAC,KAAU;QACxC,MAAM,OAAO,GAAG,KAAK,YAAY,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,IAAI,GAAG,KAAK,EAAE,CAAC,CAAA;QACtG,MAAM,IAAI,GAAG,KAAK,YAAY,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAA;QAC1E,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAA;IAC1C,CAAC;IAED,iBAAiB,CAAC,KAAU,EAAE,SAAc;QAC1C,sCAAsC;QACtC,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,CAAA;IACjC,CAAC;IAED,kBAAkB,CAAC,SAA0B;QAC3C,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAK,SAAS,CAAC,QAAQ;YAAE,IAAI,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAA;IACpF,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ;YACxB,CAAC,CAAC,KAAC,aAAa,IAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAI;YACvE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAA;IACzB,CAAC;CACF"}

package/dist/components/FallbackBoundary/Loading.d.ts

@@ -1,2 +0,0 @@
-export declare const Loading: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=Loading.d.ts.map

package/dist/components/FallbackBoundary/Loading.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Loading.d.ts","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/Loading.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,OAAO,+CAEnB,CAAA"}

package/dist/components/FallbackBoundary/Loading.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { LoadingCircular } from '@citric/ui';
-import styled from 'styled-components';
-const LoadingBox = styled.div `
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`;
-export const Loading = () => (_jsx(LoadingBox, { children: _jsx(LoadingCircular, {}) }));
-//# sourceMappingURL=Loading.js.map

package/dist/components/FallbackBoundary/Loading.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Loading.js","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/Loading.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAC5C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAM5B,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,CAC3B,KAAC,UAAU,cAAC,KAAC,eAAe,KAAG,GAAa,CAC7C,CAAA"}

package/dist/components/FallbackBoundary/index.d.ts

@@ -1,6 +0,0 @@
-import { WithChildren } from '../../types.js';
-/**
- * Fallbacks for errors and loadings (suspense).
- */
-export declare const FallbackBoundary: ({ children }: WithChildren) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/components/FallbackBoundary/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAI1C;;GAEG;AACH,eAAO,MAAM,gBAAgB,iBAAkB,YAAY,4CAM1D,CAAA"}

package/dist/components/FallbackBoundary/index.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Suspense } from 'react';
-import { ErrorBoundary } from './ErrorBoundary.js';
-import { Loading } from './Loading.js';
-/**
- * Fallbacks for errors and loadings (suspense).
- */
-export const FallbackBoundary = ({ children }) => (_jsx(ErrorBoundary, { children: _jsx(Suspense, { fallback: _jsx(Loading, {}), children: children }) }));
-//# sourceMappingURL=index.js.map

package/dist/components/FallbackBoundary/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FallbackBoundary/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEhC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAEnC;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAgB,EAAE,EAAE,CAAC,CAC9D,KAAC,aAAa,cACZ,KAAC,QAAQ,IAAC,QAAQ,EAAE,KAAC,OAAO,KAAG,YAC5B,QAAQ,GACA,GACG,CACjB,CAAA"}

package/dist/components/IconInput.d.ts

@@ -1,7 +0,0 @@
-interface Props extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
-    icon: React.ReactElement;
-    onChange?: (value: string) => void;
-}
-export declare const IconInput: ({ icon, onChange, style, className, disabled, onFocus, onBlur, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=IconInput.d.ts.map

package/dist/components/IconInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconInput.d.ts","sourceRoot":"","sources":["../../src/components/IconInput.tsx"],"names":[],"mappings":"AAKA,UAAU,KAAM,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC;IACnF,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAyCD,eAAO,MAAM,SAAS,8EAA+E,KAAK,4CAoBzG,CAAA"}

package/dist/components/IconInput.js

@@ -1,58 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { IconBox } from '@citric/core';
-import { listToClass, theme } from '@stack-spot/portal-theme';
-import { useMemo, useState } from 'react';
-import { styled } from 'styled-components';
-const InputBox = styled.div `
-  display: flex;
-  flex-direction: row;
-  transition: border-color 0.3s, box-shadow 0.3s;
-  border: 1px solid ${theme.color.light[600]};
-  border-radius: 0.25rem;
-  background-color: ${theme.color.light[300]};
-  overflow: hidden;
-  flex-shrink: 0;
-
-  &.focused {
-    border-color: ${theme.color.primary[500]};
-    box-shadow: 0 0 0 1px ${theme.color.primary[500]};
-  }
-
-  &.disabled {
-      background-color: ${theme.color.light[500]};
-    }
-
-  ${IconBox} {
-    width: 40px;
-    height: 40px;
-    border-radius: 0;
-    background-color: ${theme.color.light[600]};
-  }
-
-  input {
-    padding: 8px;
-    border: none;
-    background-color: transparent;
-    flex: 1;
-    color: ${theme.color.light.contrastText};
-
-    &:focus {
-      outline: none;
-    }
-  }
-`;
-export const IconInput = ({ icon, onChange, style, className, disabled, onFocus, onBlur, ...props }) => {
-    const [focused, setFocused] = useState(false);
-    const { focus, blur } = useMemo(() => ({
-        focus: (e) => {
-            setFocused(true);
-            onFocus?.(e);
-        },
-        blur: (e) => {
-            setFocused(false);
-            onBlur?.(e);
-        },
-    }), []);
-    return (_jsxs(InputBox, { style: style, className: listToClass([className, focused && !disabled && 'focused', disabled && 'disabled']), children: [_jsx(IconBox, { children: icon }), _jsx("input", { ...props, disabled: disabled, onFocus: focus, onBlur: blur, onChange: e => onChange?.(e.target.value) })] }));
-};
-//# sourceMappingURL=IconInput.js.map

package/dist/components/IconInput.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconInput.js","sourceRoot":"","sources":["../../src/components/IconInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAC7D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAO1C,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAA;;;;sBAIL,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;sBAEtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;oBAKxB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;4BAChB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;;;;0BAI1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;IAG5C,OAAO;;;;wBAIa,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;aAQjC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY;;;;;;CAM1C,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,KAAK,EAAS,EAAE,EAAE;IAC5G,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE7C,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;QACrC,KAAK,EAAE,CAAC,CAA8C,EAAE,EAAE;YACxD,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QACd,CAAC;QACD,IAAI,EAAE,CAAC,CAA8C,EAAE,EAAE;YACvD,UAAU,CAAC,KAAK,CAAC,CAAA;YACjB,MAAM,EAAE,CAAC,CAAC,CAAC,CAAA;QACb,CAAC;KACF,CAAC,EAAE,EAAE,CAAC,CAAA;IAEP,OAAO,CACL,MAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC,SAAS,EAAE,OAAO,IAAI,CAAC,QAAQ,IAAI,SAAS,EAAE,QAAQ,IAAI,UAAU,CAAC,CAAC,aACpH,KAAC,OAAO,cAAE,IAAI,GAAW,EACzB,mBAAW,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAAI,IACxG,CACZ,CAAA;AACH,CAAC,CAAA"}

package/dist/components/OverlayMenu.d.ts

@@ -1,10 +0,0 @@
-import { WithStyle } from '@stack-spot/portal-theme';
-import { ButtonAction, WithChildren } from '../types.js';
-import { TooltipPosition } from './Tooltip/types.js';
-interface Props extends WithStyle, WithChildren {
-    position?: TooltipPosition;
-    actions: ButtonAction[];
-}
-export declare const OverlayMenu: ({ actions, children, className, position, style }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=OverlayMenu.d.ts.map

package/dist/components/OverlayMenu.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"OverlayMenu.d.ts","sourceRoot":"","sources":["../../src/components/OverlayMenu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAS,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAG3D,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAGrD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,UAAU,KAAM,SAAQ,SAAS,EAAE,YAAY;IAC7C,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,OAAO,EAAE,YAAY,EAAE,CAAC;CACzB;AA0CD,eAAO,MAAM,WAAW,sDAAuD,KAAK,4CAqBnF,CAAA"}

package/dist/components/OverlayMenu.js

@@ -1,58 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable no-empty-pattern */
-import { IconBox, Text } from '@citric/core';
-import { theme } from '@stack-spot/portal-theme';
-import { useMemo } from 'react';
-import { styled } from 'styled-components';
-import { Tooltip } from './Tooltip/index.js';
-import { useTooltip } from './Tooltip/context.js';
-const MenuList = styled.ul `
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  border-radius: 8px;
-  background-color: ${theme.color.light[400]};
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-
-  > li {
-    display: flex;
-    flex-direction: column;
-
-    > button {
-      padding: 8px 12px;
-      transition: background-color 0.2s;
-      cursor: pointer;
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      gap: 8px;
-      background-color: transparent;
-      border: none;
-
-      &:hover {
-        background-color: ${theme.color.light[500]};
-      }
-    }
-  }
-`;
-const StyledButton = styled.button `
-  color: ${({ $color }) => $color || theme.color.light.contrastText};
-
-  svg {
-    fill: ${({ $color }) => $color || theme.color.light.contrastText};
-  }
-`;
-export const OverlayMenu = ({ actions, children, className, position, style }) => {
-    const tooltip = useTooltip();
-    const menu = useMemo(() => {
-        const items = actions.map(({ label, onClick, className, color, icon, style }) => (_jsx("li", { className: className, style: style, children: _jsxs(StyledButton, { "$color": color, onClick: () => {
-                    onClick();
-                    tooltip.hide();
-                }, children: [_jsx(IconBox, { children: icon }), _jsx(Text, { children: label })] }) }, label)));
-        return _jsx(MenuList, { children: items });
-    }, [actions]);
-    return (_jsx(Tooltip, { content: menu, custom: true, position: position, className: className, style: style, triggeredBy: "click", children: children }));
-};
-//# sourceMappingURL=OverlayMenu.js.map

package/dist/components/OverlayMenu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"OverlayMenu.js","sourceRoot":"","sources":["../../src/components/OverlayMenu.tsx"],"names":[],"mappings":";AAAA,qCAAqC;AACrC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC5C,OAAO,EAAE,KAAK,EAAa,MAAM,0BAA0B,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAE1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAQ9C,MAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,CAAA;;;;;sBAKJ,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;4BAqBhB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;CAIjD,CAAA;AAED,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAgC;WACvD,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY;;;YAGvD,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY;;CAEnE,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAS,EAAE,EAAE;IACtF,MAAM,OAAO,GAAG,UAAU,EAAE,CAAA;IAC5B,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,EAAE;QACxB,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAC/E,aAAgB,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,YAChD,MAAC,YAAY,cAAS,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE;oBACzC,OAAO,EAAE,CAAA;oBACT,OAAO,CAAC,IAAI,EAAE,CAAA;gBAChB,CAAC,aACC,KAAC,OAAO,cAAE,IAAI,GAAW,EACzB,KAAC,IAAI,cAAE,KAAK,GAAQ,IACP,IAPR,KAAK,CAQT,CACN,CAAC,CAAA;QACF,OAAO,KAAC,QAAQ,cAAE,KAAK,GAAY,CAAA;IACrC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IACb,OAAO,CACL,KAAC,OAAO,IAAC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,EAAC,OAAO,YACvG,QAAQ,GACD,CACX,CAAA;AACH,CAAC,CAAA"}

package/dist/components/ProgressBar.d.ts

@@ -1,11 +0,0 @@
-import { WithStyle } from '@stack-spot/portal-theme';
-interface Props extends WithStyle {
-    visible?: boolean;
-    shimmer?: boolean;
-    foregroundColor?: string | string[];
-    backgroundColor?: string | string[];
-    shimmerColor?: string | string[];
-}
-export declare const ProgressBar: ({ visible, shimmer, backgroundColor, foregroundColor, shimmerColor, className, style, }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=ProgressBar.d.ts.map

package/dist/components/ProgressBar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../src/components/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGxE,UAAU,KAAM,SAAQ,SAAS;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACpC,eAAe,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAClC;AAoHD,eAAO,MAAM,WAAW,4FAQrB,KAAK,4CAmBP,CAAA"}