@shipfox/react-ui 0.14.0 → 0.15.0

package/dist/components/dashboard/components/jobs-content.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/dashboard/components/jobs-content.tsx"],"sourcesContent":["import {Button} from 'components/button';\nimport {Icon} from 'components/icon';\nimport {SearchInline} from 'components/search/search-inline';\nimport {DataTable} from 'components/table/data-table';\nimport {jobColumns} from 'components/table/table.stories.columns';\nimport {jobsData} from 'components/table/table.stories.data';\nimport {Header as TypographyHeader} from 'components/typography';\nimport {useMemo, useState} from 'react';\n\nexport function JobsContent() {\n  const [searchQuery, setSearchQuery] = useState('');\n\n  const filteredData = useMemo(\n    () => jobsData.filter((job) => job.name.toLowerCase().includes(searchQuery.toLowerCase())),\n    [searchQuery],\n  );\n\n  return (\n    <div className=\"min-h-[calc(100vh-48px)] p-12 md:p-24 bg-background-neutral-base\">\n      <div className=\"rounded-t-8 overflow-hidden\">\n        <div className=\"flex flex-col md:flex-row md:items-center md:justify-between gap-12 md:gap-0 p-12 border-t border-x border-border-neutral-base rounded-t-8 bg-background-neutral-base\">\n          <TypographyHeader variant=\"h3\" className=\"text-foreground-neutral-base\">\n            Jobs breakdown\n          </TypographyHeader>\n\n          <div className=\"flex items-center gap-8 md:gap-16 w-full md:w-auto\">\n            <SearchInline\n              placeholder=\"Search...\"\n              value={searchQuery}\n              onChange={(e) => setSearchQuery(e.target.value)}\n              onClear={() => setSearchQuery('')}\n              className=\"flex-1 md:w-240\"\n            />\n            <Button variant=\"secondary\" aria-label=\"Insert column left\" className=\"shrink-0\">\n              <Icon name=\"insertColumnLeft\" className=\"size-16 text-foreground-neutral-subtle\" />\n            </Button>\n          </div>\n        </div>\n\n        <DataTable\n          columns={jobColumns}\n          data={filteredData}\n          pagination={true}\n          pageSize={10}\n          pageSizeOptions={[10, 20, 50, 100]}\n          className=\"rounded-t-none\"\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":["Button","Icon","SearchInline","DataTable","jobColumns","jobsData","Header","TypographyHeader","useMemo","useState","JobsContent","searchQuery","setSearchQuery","filteredData","filter","job","name","toLowerCase","includes","div","className","variant","placeholder","value","onChange","e","target","onClear","aria-label","columns","data","pagination","pageSize","pageSizeOptions"],"mappings":";AAAA,SAAQA,MAAM,QAAO,oBAAoB;AACzC,SAAQC,IAAI,QAAO,kBAAkB;AACrC,SAAQC,YAAY,QAAO,kCAAkC;AAC7D,SAAQC,SAAS,QAAO,8BAA8B;AACtD,SAAQC,UAAU,QAAO,yCAAyC;AAClE,SAAQC,QAAQ,QAAO,sCAAsC;AAC7D,SAAQC,UAAUC,gBAAgB,QAAO,wBAAwB;AACjE,SAAQC,OAAO,EAAEC,QAAQ,QAAO,QAAQ;AAExC,OAAO,SAASC;IACd,MAAM,CAACC,aAAaC,eAAe,GAAGH,SAAS;IAE/C,MAAMI,eAAeL,QACnB,IAAMH,SAASS,MAAM,CAAC,CAACC,MAAQA,IAAIC,IAAI,CAACC,WAAW,GAAGC,QAAQ,CAACP,YAAYM,WAAW,MACtF;QAACN;KAAY;IAGf,qBACE,KAACQ;QAAIC,WAAU;kBACb,cAAA,MAACD;YAAIC,WAAU;;8BACb,MAACD;oBAAIC,WAAU;;sCACb,KAACb;4BAAiBc,SAAQ;4BAAKD,WAAU;sCAA+B;;sCAIxE,MAACD;4BAAIC,WAAU;;8CACb,KAAClB;oCACCoB,aAAY;oCACZC,OAAOZ;oCACPa,UAAU,CAACC,IAAMb,eAAea,EAAEC,MAAM,CAACH,KAAK;oCAC9CI,SAAS,IAAMf,eAAe;oCAC9BQ,WAAU;;8CAEZ,KAACpB;oCAAOqB,SAAQ;oCAAYO,cAAW;oCAAqBR,WAAU;8CACpE,cAAA,KAACnB;wCAAKe,MAAK;wCAAmBI,WAAU;;;;;;;8BAK9C,KAACjB;oBACC0B,SAASzB;oBACT0B,MAAMjB;oBACNkB,YAAY;oBACZC,UAAU;oBACVC,iBAAiB;wBAAC;wBAAI;wBAAI;wBAAI;qBAAI;oBAClCb,WAAU;;;;;AAKpB"}

package/dist/components/dashboard/components/mobile-menu.d.ts

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

package/dist/components/dashboard/components/mobile-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mobile-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/components/mobile-menu.tsx"],"names":[],"mappings":"AAaA,wBAAgB,UAAU,4CAoCzB"}

package/dist/components/dashboard/components/mobile-menu.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../../components/button/index.js';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '../../../components/dropdown-menu/index.js';
+import { Icon } from '../../../components/icon/index.js';
+import { ShinyText } from '../../../components/shiny-text/index.js';
+import { useResolvedTheme } from '../../../hooks/useResolvedTheme.js';
+import { ShipfoxLoader } from 'shipfox-loader-react';
+export function MobileMenu() {
+    const resolvedTheme = useResolvedTheme();
+    return /*#__PURE__*/ _jsxs(DropdownMenu, {
+        children: [
+            /*#__PURE__*/ _jsx(DropdownMenuTrigger, {
+                asChild: true,
+                children: /*#__PURE__*/ _jsx(Button, {
+                    type: "button",
+                    variant: "transparent",
+                    className: "flex md:hidden items-center justify-center shrink-0 w-40 h-40 bg-background-subtle-base hover:bg-background-neutral-hover transition-colors rounded-none border-l border-border-neutral-strong",
+                    "aria-label": "Menu",
+                    children: /*#__PURE__*/ _jsx(Icon, {
+                        name: "menuLine",
+                        className: "size-18 text-foreground-neutral-subtle"
+                    })
+                })
+            }),
+            /*#__PURE__*/ _jsxs(DropdownMenuContent, {
+                align: "end",
+                className: "w-200",
+                children: [
+                    /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                        children: /*#__PURE__*/ _jsxs("div", {
+                            className: "flex items-center gap-8",
+                            children: [
+                                /*#__PURE__*/ _jsx(ShipfoxLoader, {
+                                    size: 13,
+                                    animation: "circular",
+                                    color: resolvedTheme === 'dark' ? 'white' : 'orange',
+                                    background: resolvedTheme === 'dark' ? 'dark' : 'light'
+                                }),
+                                /*#__PURE__*/ _jsx(ShinyText, {
+                                    text: "Complete setup",
+                                    className: "flex-1 text-sm font-medium leading-20 text-foreground-neutral-base truncate text-left"
+                                })
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(DropdownMenuSeparator, {}),
+                    /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                        icon: "searchLine",
+                        children: "Search"
+                    }),
+                    /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                        icon: "questionLine",
+                        children: "Help"
+                    }),
+                    /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                        icon: "notification3Line",
+                        children: "Notifications"
+                    })
+                ]
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=mobile-menu.js.map

package/dist/components/dashboard/components/mobile-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/dashboard/components/mobile-menu.tsx"],"sourcesContent":["import {Button} from 'components/button';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from 'components/dropdown-menu';\nimport {Icon} from 'components/icon';\nimport {ShinyText} from 'components/shiny-text';\nimport {useResolvedTheme} from 'hooks/useResolvedTheme';\nimport {ShipfoxLoader} from 'shipfox-loader-react';\n\nexport function MobileMenu() {\n  const resolvedTheme = useResolvedTheme();\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"transparent\"\n          className=\"flex md:hidden items-center justify-center shrink-0 w-40 h-40 bg-background-subtle-base hover:bg-background-neutral-hover transition-colors rounded-none border-l border-border-neutral-strong\"\n          aria-label=\"Menu\"\n        >\n          <Icon name=\"menuLine\" className=\"size-18 text-foreground-neutral-subtle\" />\n        </Button>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent align=\"end\" className=\"w-200\">\n        <DropdownMenuItem>\n          <div className=\"flex items-center gap-8\">\n            <ShipfoxLoader\n              size={13}\n              animation=\"circular\"\n              color={resolvedTheme === 'dark' ? 'white' : 'orange'}\n              background={resolvedTheme === 'dark' ? 'dark' : 'light'}\n            />\n            <ShinyText\n              text=\"Complete setup\"\n              className=\"flex-1 text-sm font-medium leading-20 text-foreground-neutral-base truncate text-left\"\n            />\n          </div>\n        </DropdownMenuItem>\n        <DropdownMenuSeparator />\n        <DropdownMenuItem icon=\"searchLine\">Search</DropdownMenuItem>\n        <DropdownMenuItem icon=\"questionLine\">Help</DropdownMenuItem>\n        <DropdownMenuItem icon=\"notification3Line\">Notifications</DropdownMenuItem>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n"],"names":["Button","DropdownMenu","DropdownMenuContent","DropdownMenuItem","DropdownMenuSeparator","DropdownMenuTrigger","Icon","ShinyText","useResolvedTheme","ShipfoxLoader","MobileMenu","resolvedTheme","asChild","type","variant","className","aria-label","name","align","div","size","animation","color","background","text","icon"],"mappings":";AAAA,SAAQA,MAAM,QAAO,oBAAoB;AACzC,SACEC,YAAY,EACZC,mBAAmB,EACnBC,gBAAgB,EAChBC,qBAAqB,EACrBC,mBAAmB,QACd,2BAA2B;AAClC,SAAQC,IAAI,QAAO,kBAAkB;AACrC,SAAQC,SAAS,QAAO,wBAAwB;AAChD,SAAQC,gBAAgB,QAAO,yBAAyB;AACxD,SAAQC,aAAa,QAAO,uBAAuB;AAEnD,OAAO,SAASC;IACd,MAAMC,gBAAgBH;IACtB,qBACE,MAACP;;0BACC,KAACI;gBAAoBO,OAAO;0BAC1B,cAAA,KAACZ;oBACCa,MAAK;oBACLC,SAAQ;oBACRC,WAAU;oBACVC,cAAW;8BAEX,cAAA,KAACV;wBAAKW,MAAK;wBAAWF,WAAU;;;;0BAGpC,MAACb;gBAAoBgB,OAAM;gBAAMH,WAAU;;kCACzC,KAACZ;kCACC,cAAA,MAACgB;4BAAIJ,WAAU;;8CACb,KAACN;oCACCW,MAAM;oCACNC,WAAU;oCACVC,OAAOX,kBAAkB,SAAS,UAAU;oCAC5CY,YAAYZ,kBAAkB,SAAS,SAAS;;8CAElD,KAACJ;oCACCiB,MAAK;oCACLT,WAAU;;;;;kCAIhB,KAACX;kCACD,KAACD;wBAAiBsB,MAAK;kCAAa;;kCACpC,KAACtB;wBAAiBsB,MAAK;kCAAe;;kCACtC,KAACtB;wBAAiBsB,MAAK;kCAAoB;;;;;;AAInD"}

package/dist/components/dashboard/components/organization-selector.d.ts

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

package/dist/components/dashboard/components/organization-selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"organization-selector.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/components/organization-selector.tsx"],"names":[],"mappings":"AAYA,wBAAgB,oBAAoB,4CAsCnC"}

package/dist/components/dashboard/components/organization-selector.js

@@ -0,0 +1,92 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar } from '../../../components/avatar/index.js';
+import { Button } from '../../../components/button/index.js';
+import { Icon } from '../../../components/icon/index.js';
+import { Select, SelectContent, SelectItem, SelectSeparator, SelectTrigger, SelectValue } from '../../../components/select/index.js';
+export function OrganizationSelector() {
+    return /*#__PURE__*/ _jsxs(Select, {
+        defaultValue: "stripe",
+        children: [
+            /*#__PURE__*/ _jsx(SelectTrigger, {
+                className: "w-200 h-40 shadow-none bg-background-neutral-base hover:bg-background-neutral-hover rounded-none gap-8 pl-12 border-l min-[321px]:border-r border-border-neutral-strong",
+                children: /*#__PURE__*/ _jsx("div", {
+                    className: "flex items-center gap-8 flex-1 min-w-0",
+                    children: /*#__PURE__*/ _jsx(SelectValue, {
+                        placeholder: "Select organization"
+                    })
+                })
+            }),
+            /*#__PURE__*/ _jsxs(SelectContent, {
+                children: [
+                    /*#__PURE__*/ _jsx(SelectItem, {
+                        value: "stripe",
+                        children: /*#__PURE__*/ _jsxs("div", {
+                            className: "flex items-center gap-8",
+                            children: [
+                                /*#__PURE__*/ _jsx(Avatar, {
+                                    size: "3xs",
+                                    content: "logo",
+                                    logoName: "stripe",
+                                    radius: "rounded"
+                                }),
+                                /*#__PURE__*/ _jsx("span", {
+                                    children: "Stripe"
+                                })
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(SelectItem, {
+                        value: "shipfox",
+                        children: /*#__PURE__*/ _jsxs("div", {
+                            className: "flex items-center gap-8",
+                            children: [
+                                /*#__PURE__*/ _jsx(Avatar, {
+                                    size: "3xs",
+                                    content: "logo",
+                                    logoName: "shipfox",
+                                    radius: "rounded"
+                                }),
+                                /*#__PURE__*/ _jsx("span", {
+                                    children: "Shipfox"
+                                })
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(SelectItem, {
+                        value: "github",
+                        children: /*#__PURE__*/ _jsxs("div", {
+                            className: "flex items-center gap-8",
+                            children: [
+                                /*#__PURE__*/ _jsx(Avatar, {
+                                    size: "3xs",
+                                    content: "logo",
+                                    logoName: "github",
+                                    radius: "rounded"
+                                }),
+                                /*#__PURE__*/ _jsx("span", {
+                                    children: "GitHub"
+                                })
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(SelectSeparator, {}),
+                    /*#__PURE__*/ _jsxs(Button, {
+                        variant: "transparent",
+                        className: "w-full justify-start text-foreground-neutral-subtle",
+                        children: [
+                            /*#__PURE__*/ _jsx(Icon, {
+                                name: "addLine",
+                                className: "size-16 shrink-0"
+                            }),
+                            /*#__PURE__*/ _jsx("span", {
+                                children: "New organization"
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=organization-selector.js.map

package/dist/components/dashboard/components/organization-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/dashboard/components/organization-selector.tsx"],"sourcesContent":["import {Avatar} from 'components/avatar';\nimport {Button} from 'components/button';\nimport {Icon} from 'components/icon';\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectSeparator,\n  SelectTrigger,\n  SelectValue,\n} from 'components/select';\n\nexport function OrganizationSelector() {\n  return (\n    <Select defaultValue=\"stripe\">\n      <SelectTrigger className=\"w-200 h-40 shadow-none bg-background-neutral-base hover:bg-background-neutral-hover rounded-none gap-8 pl-12 border-l min-[321px]:border-r border-border-neutral-strong\">\n        <div className=\"flex items-center gap-8 flex-1 min-w-0\">\n          <SelectValue placeholder=\"Select organization\" />\n        </div>\n      </SelectTrigger>\n      <SelectContent>\n        <SelectItem value=\"stripe\">\n          <div className=\"flex items-center gap-8\">\n            <Avatar size=\"3xs\" content=\"logo\" logoName=\"stripe\" radius=\"rounded\" />\n            <span>Stripe</span>\n          </div>\n        </SelectItem>\n        <SelectItem value=\"shipfox\">\n          <div className=\"flex items-center gap-8\">\n            <Avatar size=\"3xs\" content=\"logo\" logoName=\"shipfox\" radius=\"rounded\" />\n            <span>Shipfox</span>\n          </div>\n        </SelectItem>\n        <SelectItem value=\"github\">\n          <div className=\"flex items-center gap-8\">\n            <Avatar size=\"3xs\" content=\"logo\" logoName=\"github\" radius=\"rounded\" />\n            <span>GitHub</span>\n          </div>\n        </SelectItem>\n        <SelectSeparator />\n        <Button\n          variant=\"transparent\"\n          className=\"w-full justify-start text-foreground-neutral-subtle\"\n        >\n          <Icon name=\"addLine\" className=\"size-16 shrink-0\" />\n          <span>New organization</span>\n        </Button>\n      </SelectContent>\n    </Select>\n  );\n}\n"],"names":["Avatar","Button","Icon","Select","SelectContent","SelectItem","SelectSeparator","SelectTrigger","SelectValue","OrganizationSelector","defaultValue","className","div","placeholder","value","size","content","logoName","radius","span","variant","name"],"mappings":";AAAA,SAAQA,MAAM,QAAO,oBAAoB;AACzC,SAAQC,MAAM,QAAO,oBAAoB;AACzC,SAAQC,IAAI,QAAO,kBAAkB;AACrC,SACEC,MAAM,EACNC,aAAa,EACbC,UAAU,EACVC,eAAe,EACfC,aAAa,EACbC,WAAW,QACN,oBAAoB;AAE3B,OAAO,SAASC;IACd,qBACE,MAACN;QAAOO,cAAa;;0BACnB,KAACH;gBAAcI,WAAU;0BACvB,cAAA,KAACC;oBAAID,WAAU;8BACb,cAAA,KAACH;wBAAYK,aAAY;;;;0BAG7B,MAACT;;kCACC,KAACC;wBAAWS,OAAM;kCAChB,cAAA,MAACF;4BAAID,WAAU;;8CACb,KAACX;oCAAOe,MAAK;oCAAMC,SAAQ;oCAAOC,UAAS;oCAASC,QAAO;;8CAC3D,KAACC;8CAAK;;;;;kCAGV,KAACd;wBAAWS,OAAM;kCAChB,cAAA,MAACF;4BAAID,WAAU;;8CACb,KAACX;oCAAOe,MAAK;oCAAMC,SAAQ;oCAAOC,UAAS;oCAAUC,QAAO;;8CAC5D,KAACC;8CAAK;;;;;kCAGV,KAACd;wBAAWS,OAAM;kCAChB,cAAA,MAACF;4BAAID,WAAU;;8CACb,KAACX;oCAAOe,MAAK;oCAAMC,SAAQ;oCAAOC,UAAS;oCAASC,QAAO;;8CAC3D,KAACC;8CAAK;;;;;kCAGV,KAACb;kCACD,MAACL;wBACCmB,SAAQ;wBACRT,WAAU;;0CAEV,KAACT;gCAAKmB,MAAK;gCAAUV,WAAU;;0CAC/B,KAACQ;0CAAK;;;;;;;;AAKhB"}

package/dist/components/dashboard/components/top-menu.d.ts

@@ -0,0 +1,5 @@
+export declare function TopMenu({ activeTab, onTabChange, }: {
+    activeTab: string;
+    onTabChange: (tab: string) => void;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=top-menu.d.ts.map

package/dist/components/dashboard/components/top-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"top-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/components/top-menu.tsx"],"names":[],"mappings":"AAEA,wBAAgB,OAAO,CAAC,EACtB,SAAS,EACT,WAAW,GACZ,EAAE;IACD,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,2CAiBA"}

package/dist/components/dashboard/components/top-menu.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tabs, TabsList, TabsTrigger } from '../../../components/tabs/index.js';
+export function TopMenu({ activeTab, onTabChange }) {
+    return /*#__PURE__*/ _jsx("div", {
+        className: "flex items-center justify-between w-full",
+        children: /*#__PURE__*/ _jsx("div", {
+            className: "flex items-center flex-1 min-w-0 pl-12 md:pl-20 pr-8",
+            children: /*#__PURE__*/ _jsx(Tabs, {
+                value: activeTab,
+                onValueChange: onTabChange,
+                children: /*#__PURE__*/ _jsxs(TabsList, {
+                    className: "h-48 gap-8 md:gap-12",
+                    children: [
+                        /*#__PURE__*/ _jsx(TabsTrigger, {
+                            value: "analytics",
+                            className: "text-sm font-medium",
+                            children: "Analytics"
+                        }),
+                        /*#__PURE__*/ _jsx(TabsTrigger, {
+                            value: "jobs",
+                            className: "text-sm font-medium",
+                            children: "Jobs"
+                        })
+                    ]
+                })
+            })
+        })
+    });
+}
+
+//# sourceMappingURL=top-menu.js.map

package/dist/components/dashboard/components/top-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/dashboard/components/top-menu.tsx"],"sourcesContent":["import {Tabs, TabsList, TabsTrigger} from 'components/tabs';\n\nexport function TopMenu({\n  activeTab,\n  onTabChange,\n}: {\n  activeTab: string;\n  onTabChange: (tab: string) => void;\n}) {\n  return (\n    <div className=\"flex items-center justify-between w-full\">\n      <div className=\"flex items-center flex-1 min-w-0 pl-12 md:pl-20 pr-8\">\n        <Tabs value={activeTab} onValueChange={onTabChange}>\n          <TabsList className=\"h-48 gap-8 md:gap-12\">\n            <TabsTrigger value=\"analytics\" className=\"text-sm font-medium\">\n              Analytics\n            </TabsTrigger>\n            <TabsTrigger value=\"jobs\" className=\"text-sm font-medium\">\n              Jobs\n            </TabsTrigger>\n          </TabsList>\n        </Tabs>\n      </div>\n    </div>\n  );\n}\n"],"names":["Tabs","TabsList","TabsTrigger","TopMenu","activeTab","onTabChange","div","className","value","onValueChange"],"mappings":";AAAA,SAAQA,IAAI,EAAEC,QAAQ,EAAEC,WAAW,QAAO,kBAAkB;AAE5D,OAAO,SAASC,QAAQ,EACtBC,SAAS,EACTC,WAAW,EAIZ;IACC,qBACE,KAACC;QAAIC,WAAU;kBACb,cAAA,KAACD;YAAIC,WAAU;sBACb,cAAA,KAACP;gBAAKQ,OAAOJ;gBAAWK,eAAeJ;0BACrC,cAAA,MAACJ;oBAASM,WAAU;;sCAClB,KAACL;4BAAYM,OAAM;4BAAYD,WAAU;sCAAsB;;sCAG/D,KAACL;4BAAYM,OAAM;4BAAOD,WAAU;sCAAsB;;;;;;;AAQtE"}

package/dist/components/dashboard/components/topbar-button.d.ts

@@ -0,0 +1,7 @@
+import { type IconName } from '../../../components/icon';
+export declare function TopbarButton({ className, icon, label, }: {
+    className?: string;
+    icon: IconName;
+    label?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=topbar-button.d.ts.map

package/dist/components/dashboard/components/topbar-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"topbar-button.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/components/topbar-button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,QAAQ,EAAC,MAAM,iBAAiB,CAAC;AAGpD,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,IAAI,EACJ,KAAK,GACN,EAAE;IACD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,2CAcA"}

package/dist/components/dashboard/components/topbar-button.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button } from '../../../components/button/index.js';
+import { Icon } from '../../../components/icon/index.js';
+import { cn } from '../../../utils/cn.js';
+export function TopbarButton({ className, icon, label }) {
+    return /*#__PURE__*/ _jsx(Button, {
+        type: "button",
+        variant: "transparent",
+        className: cn('flex items-center justify-center overflow-hidden shrink-0 w-40 h-40 bg-background-subtle-base hover:bg-background-neutral-hover transition-colors rounded-none border-l border-border-neutral-strong', className),
+        "aria-label": label ?? undefined,
+        children: /*#__PURE__*/ _jsx(Icon, {
+            name: icon,
+            className: "size-18 text-foreground-neutral-subtle"
+        })
+    });
+}
+
+//# sourceMappingURL=topbar-button.js.map

package/dist/components/dashboard/components/topbar-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/dashboard/components/topbar-button.tsx"],"sourcesContent":["import {Button} from 'components/button';\nimport {Icon, type IconName} from 'components/icon';\nimport {cn} from 'utils/cn';\n\nexport function TopbarButton({\n  className,\n  icon,\n  label,\n}: {\n  className?: string;\n  icon: IconName;\n  label?: string;\n}) {\n  return (\n    <Button\n      type=\"button\"\n      variant=\"transparent\"\n      className={cn(\n        'flex items-center justify-center overflow-hidden shrink-0 w-40 h-40 bg-background-subtle-base hover:bg-background-neutral-hover transition-colors rounded-none border-l border-border-neutral-strong',\n        className,\n      )}\n      aria-label={label ?? undefined}\n    >\n      <Icon name={icon} className=\"size-18 text-foreground-neutral-subtle\" />\n    </Button>\n  );\n}\n"],"names":["Button","Icon","cn","TopbarButton","className","icon","label","type","variant","aria-label","undefined","name"],"mappings":";AAAA,SAAQA,MAAM,QAAO,oBAAoB;AACzC,SAAQC,IAAI,QAAsB,kBAAkB;AACpD,SAAQC,EAAE,QAAO,WAAW;AAE5B,OAAO,SAASC,aAAa,EAC3BC,SAAS,EACTC,IAAI,EACJC,KAAK,EAKN;IACC,qBACE,KAACN;QACCO,MAAK;QACLC,SAAQ;QACRJ,WAAWF,GACT,wMACAE;QAEFK,cAAYH,SAASI;kBAErB,cAAA,KAACT;YAAKU,MAAMN;YAAMD,WAAU;;;AAGlC"}

package/dist/components/dashboard/components/topbar.d.ts

@@ -0,0 +1,4 @@
+export declare function Topbar({ hideLogo }: {
+    hideLogo?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=topbar.d.ts.map

package/dist/components/dashboard/components/topbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"topbar.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/components/topbar.tsx"],"names":[],"mappings":"AAOA,wBAAgB,MAAM,CAAC,EAAC,QAAgB,EAAC,EAAE;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAC,2CAgC9D"}

package/dist/components/dashboard/components/topbar.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../../utils/cn.js';
+import { CompleteSetupButton } from './complete-setup-button.js';
+import { MobileMenu } from './mobile-menu.js';
+import { OrganizationSelector } from './organization-selector.js';
+import { TopbarButton } from './topbar-button.js';
+import { UserProfile } from './user-profile.js';
+export function Topbar({ hideLogo = false }) {
+    return /*#__PURE__*/ _jsx("div", {
+        className: "flex flex-col items-start w-full bg-background-subtle-base",
+        children: /*#__PURE__*/ _jsxs("div", {
+            className: "flex items-center justify-between w-full shrink-0 border-b border-border-neutral-strong",
+            children: [
+                /*#__PURE__*/ _jsxs("div", {
+                    className: "flex items-center flex-1 min-w-0",
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: cn('shrink-0', hideLogo ? 'opacity-0' : 'opacity-100'),
+                            children: /*#__PURE__*/ _jsx(TopbarButton, {
+                                icon: "shipfox",
+                                label: "Shipfox",
+                                className: "border-none"
+                            })
+                        }),
+                        /*#__PURE__*/ _jsx(OrganizationSelector, {}),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "hidden md:block flex-1 h-40 bg-background-subtle-base"
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ _jsx(CompleteSetupButton, {
+                    className: "hidden md:flex"
+                }),
+                /*#__PURE__*/ _jsx("div", {
+                    className: "hidden md:block",
+                    children: /*#__PURE__*/ _jsx(TopbarButton, {
+                        icon: "searchLine",
+                        label: "Search"
+                    })
+                }),
+                /*#__PURE__*/ _jsx("div", {
+                    className: "hidden md:block",
+                    children: /*#__PURE__*/ _jsx(TopbarButton, {
+                        icon: "questionLine",
+                        label: "Help"
+                    })
+                }),
+                /*#__PURE__*/ _jsx("div", {
+                    className: "hidden md:block",
+                    children: /*#__PURE__*/ _jsx(TopbarButton, {
+                        icon: "notification3Line",
+                        label: "Notifications"
+                    })
+                }),
+                /*#__PURE__*/ _jsx(MobileMenu, {}),
+                /*#__PURE__*/ _jsx(UserProfile, {})
+            ]
+        })
+    });
+}
+
+//# sourceMappingURL=topbar.js.map

package/dist/components/dashboard/components/topbar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/dashboard/components/topbar.tsx"],"sourcesContent":["import {cn} from 'utils/cn';\nimport {CompleteSetupButton} from './complete-setup-button';\nimport {MobileMenu} from './mobile-menu';\nimport {OrganizationSelector} from './organization-selector';\nimport {TopbarButton} from './topbar-button';\nimport {UserProfile} from './user-profile';\n\nexport function Topbar({hideLogo = false}: {hideLogo?: boolean}) {\n  return (\n    <div className=\"flex flex-col items-start w-full bg-background-subtle-base\">\n      <div className=\"flex items-center justify-between w-full shrink-0 border-b border-border-neutral-strong\">\n        <div className=\"flex items-center flex-1 min-w-0\">\n          <div className={cn('shrink-0', hideLogo ? 'opacity-0' : 'opacity-100')}>\n            <TopbarButton icon=\"shipfox\" label=\"Shipfox\" className=\"border-none\" />\n          </div>\n          <OrganizationSelector />\n          <div className=\"hidden md:block flex-1 h-40 bg-background-subtle-base\" />\n        </div>\n\n        <CompleteSetupButton className=\"hidden md:flex\" />\n\n        <div className=\"hidden md:block\">\n          <TopbarButton icon=\"searchLine\" label=\"Search\" />\n        </div>\n\n        <div className=\"hidden md:block\">\n          <TopbarButton icon=\"questionLine\" label=\"Help\" />\n        </div>\n\n        <div className=\"hidden md:block\">\n          <TopbarButton icon=\"notification3Line\" label=\"Notifications\" />\n        </div>\n\n        <MobileMenu />\n\n        <UserProfile />\n      </div>\n    </div>\n  );\n}\n"],"names":["cn","CompleteSetupButton","MobileMenu","OrganizationSelector","TopbarButton","UserProfile","Topbar","hideLogo","div","className","icon","label"],"mappings":";AAAA,SAAQA,EAAE,QAAO,WAAW;AAC5B,SAAQC,mBAAmB,QAAO,0BAA0B;AAC5D,SAAQC,UAAU,QAAO,gBAAgB;AACzC,SAAQC,oBAAoB,QAAO,0BAA0B;AAC7D,SAAQC,YAAY,QAAO,kBAAkB;AAC7C,SAAQC,WAAW,QAAO,iBAAiB;AAE3C,OAAO,SAASC,OAAO,EAACC,WAAW,KAAK,EAAuB;IAC7D,qBACE,KAACC;QAAIC,WAAU;kBACb,cAAA,MAACD;YAAIC,WAAU;;8BACb,MAACD;oBAAIC,WAAU;;sCACb,KAACD;4BAAIC,WAAWT,GAAG,YAAYO,WAAW,cAAc;sCACtD,cAAA,KAACH;gCAAaM,MAAK;gCAAUC,OAAM;gCAAUF,WAAU;;;sCAEzD,KAACN;sCACD,KAACK;4BAAIC,WAAU;;;;8BAGjB,KAACR;oBAAoBQ,WAAU;;8BAE/B,KAACD;oBAAIC,WAAU;8BACb,cAAA,KAACL;wBAAaM,MAAK;wBAAaC,OAAM;;;8BAGxC,KAACH;oBAAIC,WAAU;8BACb,cAAA,KAACL;wBAAaM,MAAK;wBAAeC,OAAM;;;8BAG1C,KAACH;oBAAIC,WAAU;8BACb,cAAA,KAACL;wBAAaM,MAAK;wBAAoBC,OAAM;;;8BAG/C,KAACT;8BAED,KAACG;;;;AAIT"}

package/dist/components/dashboard/components/user-profile.d.ts

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

package/dist/components/dashboard/components/user-profile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-profile.d.ts","sourceRoot":"","sources":["../../../../src/components/dashboard/components/user-profile.tsx"],"names":[],"mappings":"AAsBA,wBAAgB,WAAW,4CAmE1B"}

package/dist/components/dashboard/components/user-profile.js

@@ -0,0 +1,146 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar } from '../../../components/avatar/index.js';
+import { UserBadge } from '../../../components/badge/index.js';
+import { Button } from '../../../components/button/index.js';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '../../../components/dropdown-menu/index.js';
+import { ShinyText } from '../../../components/shiny-text/index.js';
+function UsageGauge({ used, total }) {
+    const percentage = total <= 0 ? 0 : Math.min(used / total * 100, 100);
+    return /*#__PURE__*/ _jsx("div", {
+        className: "flex h-8 w-full rounded-full bg-tag-neutral-bg overflow-hidden",
+        children: /*#__PURE__*/ _jsx("div", {
+            className: "h-full bg-tag-success-icon rounded-l-2",
+            style: {
+                width: `${percentage}%`
+            }
+        })
+    });
+}
+export function UserProfile() {
+    const userName = 'Thierry Abalea';
+    const userEmail = 'thierryabalea@acme.com';
+    const creditsUsed = 3213;
+    const creditsTotal = 6000;
+    return /*#__PURE__*/ _jsxs(DropdownMenu, {
+        children: [
+            /*#__PURE__*/ _jsx(DropdownMenuTrigger, {
+                asChild: true,
+                children: /*#__PURE__*/ _jsxs("div", {
+                    className: "flex items-center justify-center h-40 px-8 cursor-pointer border-l border-border-neutral-strong",
+                    children: [
+                        /*#__PURE__*/ _jsx(Avatar, {
+                            className: "size-24 md:hidden",
+                            content: "image",
+                            fallback: "TA"
+                        }),
+                        /*#__PURE__*/ _jsx(UserBadge, {
+                            name: userName,
+                            className: "hidden md:inline-flex"
+                        })
+                    ]
+                })
+            }),
+            /*#__PURE__*/ _jsxs(DropdownMenuContent, {
+                align: "end",
+                className: "w-220",
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "flex items-center gap-12 px-8 py-4",
+                        children: [
+                            /*#__PURE__*/ _jsx(Avatar, {
+                                className: "size-28 shrink-0",
+                                content: "image",
+                                fallback: "TA"
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                className: "flex flex-col min-w-0",
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        className: "text-sm font-medium leading-20 text-foreground-neutral-base truncate",
+                                        children: userName
+                                    }),
+                                    /*#__PURE__*/ _jsx("span", {
+                                        className: "text-xs leading-20 text-foreground-neutral-subtle truncate",
+                                        children: userEmail
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx(DropdownMenuSeparator, {}),
+                    /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                        icon: "sparkling2Fill",
+                        children: "Getting started"
+                    }),
+                    /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                        icon: "userLine",
+                        children: "Profile settings"
+                    }),
+                    /*#__PURE__*/ _jsx(DropdownMenuSeparator, {}),
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "flex flex-col gap-8 px-8 py-4",
+                        children: [
+                            /*#__PURE__*/ _jsxs("div", {
+                                className: "flex items-center justify-between gap-8",
+                                children: [
+                                    /*#__PURE__*/ _jsxs("div", {
+                                        className: "flex items-center gap-8",
+                                        children: [
+                                            /*#__PURE__*/ _jsx(Avatar, {
+                                                className: "size-12",
+                                                content: "logo",
+                                                logoName: "stripe",
+                                                radius: "rounded"
+                                            }),
+                                            /*#__PURE__*/ _jsx("span", {
+                                                className: "text-sm font-medium leading-20 text-foreground-neutral-subtle",
+                                                children: "Usage"
+                                            })
+                                        ]
+                                    }),
+                                    /*#__PURE__*/ _jsxs("span", {
+                                        className: "text-sm font-medium leading-20 text-foreground-neutral-subtle",
+                                        children: [
+                                            creditsUsed,
+                                            " / ",
+                                            creditsTotal
+                                        ]
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx(UsageGauge, {
+                                used: creditsUsed,
+                                total: creditsTotal
+                            }),
+                            /*#__PURE__*/ _jsxs("span", {
+                                className: "text-xs leading-20 text-foreground-neutral-subtle",
+                                children: [
+                                    creditsTotal,
+                                    " free credits every month."
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        className: "px-8 pb-12",
+                        children: /*#__PURE__*/ _jsx(Button, {
+                            type: "button",
+                            className: "w-full",
+                            children: /*#__PURE__*/ _jsx(ShinyText, {
+                                text: "Upgrade Plan",
+                                className: "flex-1 text-sm font-medium leading-20 text-foreground-neutral-base truncate text-center"
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(DropdownMenuSeparator, {}),
+                    /*#__PURE__*/ _jsx(DropdownMenuItem, {
+                        icon: "logoutCircleLine",
+                        children: "Log out"
+                    })
+                ]
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=user-profile.js.map

package/dist/components/dashboard/components/user-profile.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/dashboard/components/user-profile.tsx"],"sourcesContent":["import {Avatar} from 'components/avatar';\nimport {UserBadge} from 'components/badge';\nimport {Button} from 'components/button';\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from 'components/dropdown-menu';\nimport {ShinyText} from 'components/shiny-text';\n\nfunction UsageGauge({used, total}: {used: number; total: number}) {\n  const percentage = total <= 0 ? 0 : Math.min((used / total) * 100, 100);\n\n  return (\n    <div className=\"flex h-8 w-full rounded-full bg-tag-neutral-bg overflow-hidden\">\n      <div className=\"h-full bg-tag-success-icon rounded-l-2\" style={{width: `${percentage}%`}} />\n    </div>\n  );\n}\n\nexport function UserProfile() {\n  const userName = 'Thierry Abalea';\n  const userEmail = 'thierryabalea@acme.com';\n  const creditsUsed = 3213;\n  const creditsTotal = 6000;\n\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger asChild>\n        <div className=\"flex items-center justify-center h-40 px-8 cursor-pointer border-l border-border-neutral-strong\">\n          <Avatar className=\"size-24 md:hidden\" content=\"image\" fallback=\"TA\" />\n          <UserBadge name={userName} className=\"hidden md:inline-flex\" />\n        </div>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent align=\"end\" className=\"w-220\">\n        <div className=\"flex items-center gap-12 px-8 py-4\">\n          <Avatar className=\"size-28 shrink-0\" content=\"image\" fallback=\"TA\" />\n          <div className=\"flex flex-col min-w-0\">\n            <span className=\"text-sm font-medium leading-20 text-foreground-neutral-base truncate\">\n              {userName}\n            </span>\n            <span className=\"text-xs leading-20 text-foreground-neutral-subtle truncate\">\n              {userEmail}\n            </span>\n          </div>\n        </div>\n\n        <DropdownMenuSeparator />\n\n        <DropdownMenuItem icon=\"sparkling2Fill\">Getting started</DropdownMenuItem>\n        <DropdownMenuItem icon=\"userLine\">Profile settings</DropdownMenuItem>\n\n        <DropdownMenuSeparator />\n\n        <div className=\"flex flex-col gap-8 px-8 py-4\">\n          <div className=\"flex items-center justify-between gap-8\">\n            <div className=\"flex items-center gap-8\">\n              <Avatar className=\"size-12\" content=\"logo\" logoName=\"stripe\" radius=\"rounded\" />\n              <span className=\"text-sm font-medium leading-20 text-foreground-neutral-subtle\">\n                Usage\n              </span>\n            </div>\n            <span className=\"text-sm font-medium leading-20 text-foreground-neutral-subtle\">\n              {creditsUsed} / {creditsTotal}\n            </span>\n          </div>\n          <UsageGauge used={creditsUsed} total={creditsTotal} />\n          <span className=\"text-xs leading-20 text-foreground-neutral-subtle\">\n            {creditsTotal} free credits every month.\n          </span>\n        </div>\n\n        <div className=\"px-8 pb-12\">\n          <Button type=\"button\" className=\"w-full\">\n            <ShinyText\n              text=\"Upgrade Plan\"\n              className=\"flex-1 text-sm font-medium leading-20 text-foreground-neutral-base truncate text-center\"\n            />\n          </Button>\n        </div>\n\n        <DropdownMenuSeparator />\n\n        <DropdownMenuItem icon=\"logoutCircleLine\">Log out</DropdownMenuItem>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n"],"names":["Avatar","UserBadge","Button","DropdownMenu","DropdownMenuContent","DropdownMenuItem","DropdownMenuSeparator","DropdownMenuTrigger","ShinyText","UsageGauge","used","total","percentage","Math","min","div","className","style","width","UserProfile","userName","userEmail","creditsUsed","creditsTotal","asChild","content","fallback","name","align","span","icon","logoName","radius","type","text"],"mappings":";AAAA,SAAQA,MAAM,QAAO,oBAAoB;AACzC,SAAQC,SAAS,QAAO,mBAAmB;AAC3C,SAAQC,MAAM,QAAO,oBAAoB;AACzC,SACEC,YAAY,EACZC,mBAAmB,EACnBC,gBAAgB,EAChBC,qBAAqB,EACrBC,mBAAmB,QACd,2BAA2B;AAClC,SAAQC,SAAS,QAAO,wBAAwB;AAEhD,SAASC,WAAW,EAACC,IAAI,EAAEC,KAAK,EAAgC;IAC9D,MAAMC,aAAaD,SAAS,IAAI,IAAIE,KAAKC,GAAG,CAAC,AAACJ,OAAOC,QAAS,KAAK;IAEnE,qBACE,KAACI;QAAIC,WAAU;kBACb,cAAA,KAACD;YAAIC,WAAU;YAAyCC,OAAO;gBAACC,OAAO,GAAGN,WAAW,CAAC,CAAC;YAAA;;;AAG7F;AAEA,OAAO,SAASO;IACd,MAAMC,WAAW;IACjB,MAAMC,YAAY;IAClB,MAAMC,cAAc;IACpB,MAAMC,eAAe;IAErB,qBACE,MAACpB;;0BACC,KAACI;gBAAoBiB,OAAO;0BAC1B,cAAA,MAACT;oBAAIC,WAAU;;sCACb,KAAChB;4BAAOgB,WAAU;4BAAoBS,SAAQ;4BAAQC,UAAS;;sCAC/D,KAACzB;4BAAU0B,MAAMP;4BAAUJ,WAAU;;;;;0BAGzC,MAACZ;gBAAoBwB,OAAM;gBAAMZ,WAAU;;kCACzC,MAACD;wBAAIC,WAAU;;0CACb,KAAChB;gCAAOgB,WAAU;gCAAmBS,SAAQ;gCAAQC,UAAS;;0CAC9D,MAACX;gCAAIC,WAAU;;kDACb,KAACa;wCAAKb,WAAU;kDACbI;;kDAEH,KAACS;wCAAKb,WAAU;kDACbK;;;;;;kCAKP,KAACf;kCAED,KAACD;wBAAiByB,MAAK;kCAAiB;;kCACxC,KAACzB;wBAAiByB,MAAK;kCAAW;;kCAElC,KAACxB;kCAED,MAACS;wBAAIC,WAAU;;0CACb,MAACD;gCAAIC,WAAU;;kDACb,MAACD;wCAAIC,WAAU;;0DACb,KAAChB;gDAAOgB,WAAU;gDAAUS,SAAQ;gDAAOM,UAAS;gDAASC,QAAO;;0DACpE,KAACH;gDAAKb,WAAU;0DAAgE;;;;kDAIlF,MAACa;wCAAKb,WAAU;;4CACbM;4CAAY;4CAAIC;;;;;0CAGrB,KAACd;gCAAWC,MAAMY;gCAAaX,OAAOY;;0CACtC,MAACM;gCAAKb,WAAU;;oCACbO;oCAAa;;;;;kCAIlB,KAACR;wBAAIC,WAAU;kCACb,cAAA,KAACd;4BAAO+B,MAAK;4BAASjB,WAAU;sCAC9B,cAAA,KAACR;gCACC0B,MAAK;gCACLlB,WAAU;;;;kCAKhB,KAACV;kCAED,KAACD;wBAAiByB,MAAK;kCAAmB;;;;;;AAIlD"}

package/dist/components/dashboard/dashboard.d.ts

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"dashboard.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/dashboard.tsx"],"names":[],"mappings":"AAWA,wBAAgB,SAAS,4CAiDxB"}

package/dist/components/dashboard/dashboard.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMotionValueEvent, useScroll } from 'framer-motion';
+import { useCallback, useRef, useState } from 'react';
+import { AnalyticsContent } from './components/analytics-content.js';
+import { AnimatedLogo } from './components/animated-logo.js';
+import { JobsContent } from './components/jobs-content.js';
+import { TopMenu } from './components/top-menu.js';
+import { Topbar } from './components/topbar.js';
+const LOGO_HEIGHT = 48;
+const TOPBAR_HEIGHT = 41;
+export function Dashboard() {
+    const containerRef = useRef(null);
+    const topbarRef = useRef(null);
+    const [scrollProgress, setScrollProgress] = useState(0);
+    const [activeTab, setActiveTab] = useState('analytics');
+    const { scrollY } = useScroll({
+        container: containerRef
+    });
+    useMotionValueEvent(scrollY, 'change', (latest)=>{
+        const progress = Math.min(latest / TOPBAR_HEIGHT, 1);
+        setScrollProgress(progress);
+    });
+    const handleTabChange = useCallback((tab)=>{
+        setActiveTab(tab);
+        if (containerRef.current) {
+            containerRef.current.scrollTo({
+                top: 0,
+                behavior: 'instant'
+            });
+        }
+        setScrollProgress(0);
+    }, []);
+    const isTopbarHidden = scrollProgress >= 1;
+    return /*#__PURE__*/ _jsxs("div", {
+        className: "flex flex-col w-full h-full",
+        children: [
+            /*#__PURE__*/ _jsx(AnimatedLogo, {
+                scrollProgress: scrollProgress
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                ref: containerRef,
+                className: "flex flex-col w-full h-full overflow-auto",
+                children: [
+                    /*#__PURE__*/ _jsx("div", {
+                        ref: topbarRef,
+                        children: /*#__PURE__*/ _jsx(Topbar, {
+                            hideLogo: isTopbarHidden
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        className: "sticky top-0 z-40 border-b border-border-neutral-strong bg-background-neutral-base",
+                        children: /*#__PURE__*/ _jsx("div", {
+                            style: {
+                                paddingLeft: `${(1 - (1 - scrollProgress) ** 3) * (LOGO_HEIGHT - 8)}px`
+                            },
+                            children: /*#__PURE__*/ _jsx(TopMenu, {
+                                activeTab: activeTab,
+                                onTabChange: handleTabChange
+                            })
+                        })
+                    }),
+                    activeTab === 'analytics' && /*#__PURE__*/ _jsx(AnalyticsContent, {}),
+                    activeTab === 'jobs' && /*#__PURE__*/ _jsx(JobsContent, {})
+                ]
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=dashboard.js.map