@glamcor/dna-shared-nav 1.0.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/README.md +125 -145
  2. package/assets/dna-logo.svg +25 -0
  3. package/dist/AppSubnav.d.ts +2 -1
  4. package/dist/AppSubnav.d.ts.map +1 -0
  5. package/dist/AvatarMenu.d.ts +2 -1
  6. package/dist/AvatarMenu.d.ts.map +1 -0
  7. package/dist/DNAHeader.d.ts +2 -1
  8. package/dist/DNAHeader.d.ts.map +1 -0
  9. package/dist/DNAHeader.js +12 -3
  10. package/dist/DNANavigation.d.ts +2 -1
  11. package/dist/DNANavigation.d.ts.map +1 -0
  12. package/dist/PinnedJobs.d.ts +2 -1
  13. package/dist/PinnedJobs.d.ts.map +1 -0
  14. package/dist/PinnedJobs.js +1 -5
  15. package/dist/index.d.ts +1 -0
  16. package/dist/index.d.ts.map +1 -0
  17. package/dist/types.d.ts +1 -0
  18. package/dist/types.d.ts.map +1 -0
  19. package/package.json +23 -21
package/README.md CHANGED
@@ -1,46 +1,24 @@
1
- # DNA Shared Navigation
1
+ # @glamcor/dna-shared-nav
2
2
 
3
- Universal navigation component for all DNA microsites. Provides a consistent two-row navigation header across Dashboard, SPOT, Water, Pulse, Hydrogen, and Oxygen apps.
4
-
5
- ## Architecture
6
-
7
- The navigation consists of two rows (80px total height):
8
-
9
- ```
10
- Row 1 - Header (44px): [DNA Logo] [Inter-app Nav: Dashboard | SPOT | Water | Pulse | Hydrogen | Oxygen] [Avatar]
11
- Row 2 - App Subnav (36px): [App Name] [App-specific pages] ......................... [Pinned Jobs →]
12
- ```
13
-
14
- - **Header**: Logo links to Dashboard, inter-app navigation for switching between DNA apps, avatar menu with user info and logout
15
- - **App Subnav**: Current app name, app-specific page links, pinned jobs carousel (right-aligned)
3
+ Shared navigation component for DNA microsites. Provides a consistent two-row navigation across all DNA applications.
16
4
 
17
5
  ## Installation
18
6
 
19
- In a DNA monorepo workspace, add to your app's `package.json`:
20
-
21
- ```json
22
- {
23
- "dependencies": {
24
- "dna-shared-nav": "*"
25
- }
26
- }
7
+ ```bash
8
+ npm install @glamcor/dna-shared-nav
27
9
  ```
28
10
 
29
- Then run `npm install` from the monorepo root.
30
-
31
11
  ## Usage
32
12
 
33
- ### Basic Setup
34
-
35
13
  ```tsx
36
- import { DNANavigation } from 'dna-shared-nav';
37
- import 'dna-shared-nav/dist/styles.css';
14
+ import { DNANavigation } from '@glamcor/dna-shared-nav';
15
+ import '@glamcor/dna-shared-nav/dist/styles.css';
38
16
 
39
- export function Layout({ children }) {
17
+ export default function Layout({ children }) {
40
18
  const user = {
41
19
  id: '1',
42
- email: 'user@example.com',
43
20
  name: 'John Doe',
21
+ email: 'john@example.com',
44
22
  role: 'admin',
45
23
  };
46
24
 
@@ -51,11 +29,20 @@ export function Layout({ children }) {
51
29
  currentApp="Water"
52
30
  appName="Water"
53
31
  subnavItems={[
54
- { name: 'Dashboard', href: '/water', isActive: true },
55
- { name: 'Customers', href: '/water/customers' },
56
- { name: 'Jobs', href: '/water/jobs' },
57
- { name: 'Analytics', href: '/water/analytics' },
32
+ { name: 'Dashboard', href: '/admin', isActive: true },
33
+ { name: 'Customers', href: '/admin/customers' },
34
+ { name: 'Jobs', href: '/admin/jobs' },
58
35
  ]}
36
+ pinnedJobs={[
37
+ {
38
+ id: '1',
39
+ appName: 'Water',
40
+ jobName: 'Q4 Enrichment',
41
+ progress: 59,
42
+ appColor: '#38bdf8',
43
+ },
44
+ ]}
45
+ onUnpinJob={(id) => console.log('Unpin:', id)}
59
46
  onLogout={() => signOut()}
60
47
  />
61
48
  <main>{children}</main>
@@ -64,147 +51,140 @@ export function Layout({ children }) {
64
51
  }
65
52
  ```
66
53
 
67
- ### With Pinned Jobs
68
-
69
- Pinned jobs appear on the right side of the app subnav. They show progress rings and support a carousel when there are more than 2 jobs.
70
-
71
- ```tsx
72
- <DNANavigation
73
- user={user}
74
- currentApp="Water"
75
- appName="Water"
76
- subnavItems={subnavItems}
77
- pinnedJobs={[
78
- {
79
- id: '1',
80
- appName: 'Water',
81
- appColor: '#38bdf8',
82
- jobName: 'Q4 Data Enrichment',
83
- progress: 59,
84
- },
85
- {
86
- id: '2',
87
- appName: 'SPOT',
88
- appColor: '#a78bfa',
89
- jobName: 'Lead Scoring Batch',
90
- progress: 23,
91
- },
92
- ]}
93
- onUnpinJob={(jobId) => handleUnpin(jobId)}
94
- onLogout={() => signOut()}
95
- />
96
- ```
54
+ ## Components
97
55
 
98
- ## Props
56
+ ### DNANavigation
99
57
 
100
- ### DNANavigationProps
58
+ Main wrapper that renders both the header and app subnav.
101
59
 
102
60
  | Prop | Type | Required | Description |
103
61
  |------|------|----------|-------------|
104
- | `user` | `DNAUser \| null` | Yes | Current user object, or null if not logged in |
105
- | `currentApp` | `string` | No | Name of active app in header nav (e.g., "Water", "SPOT") |
106
- | `appName` | `string` | Yes | Display name shown in app subnav |
107
- | `headerItems` | `DNANavItem[]` | No | Override default inter-app navigation items |
108
- | `subnavItems` | `AppSubnavItem[]` | Yes | App-specific page links |
109
- | `pinnedJobs` | `PinnedJob[]` | No | Jobs to show in pinned carousel |
110
- | `logoSrc` | `string` | No | Custom logo image URL (defaults to "DNA" text) |
111
- | `onLogout` | `() => void` | No | Callback when user clicks logout |
112
- | `onUnpinJob` | `(jobId: string) => void` | No | Callback when user unpins a job |
113
-
114
- ### DNAUser
62
+ | `user` | `DNAUser \| null` | Yes | Current user object |
63
+ | `currentApp` | `string` | No | Name of active app in header nav |
64
+ | `appName` | `string` | Yes | Name shown in subnav |
65
+ | `headerItems` | `DNANavItem[]` | No | Override default header nav items |
66
+ | `subnavItems` | `AppSubnavItem[]` | Yes | App-specific subnav links |
67
+ | `pinnedJobs` | `PinnedJob[]` | No | Jobs to show in pinned area |
68
+ | `logoSrc` | `string` | No | Custom logo URL (defaults to CloudFront CDN) |
69
+ | `onLogout` | `() => void` | No | Logout handler |
70
+ | `onUnpinJob` | `(id: string) => void` | No | Handler for unpinning jobs |
115
71
 
116
- ```typescript
117
- interface DNAUser {
118
- id: string;
119
- email: string;
120
- name: string;
121
- role?: 'superadmin' | 'admin' | 'editor' | 'viewer';
122
- avatar?: string;
123
- }
124
- ```
72
+ ### DNAHeader
125
73
 
126
- ### AppSubnavItem
74
+ Just the top header bar (logo, inter-app nav, avatar).
127
75
 
128
- ```typescript
129
- interface AppSubnavItem {
130
- name: string; // Display text
131
- href: string; // Link URL
132
- isActive?: boolean; // Highlight as current page
133
- }
134
- ```
76
+ ### AppSubnav
135
77
 
136
- ### PinnedJob
78
+ Just the second row (app name, pages, pinned jobs).
137
79
 
138
- ```typescript
139
- interface PinnedJob {
140
- id: string;
141
- appName: string; // Short name (e.g., "Water", "SPOT")
142
- appColor?: string; // Hex color for progress ring (e.g., '#38bdf8')
143
- jobName: string; // Job display name
144
- progress: number; // 0-100 percentage
145
- meta?: string; // Optional metadata (e.g., "142 / 240 records")
146
- }
147
- ```
148
-
149
- ## Environment Variables
80
+ ### AvatarMenu
150
81
 
151
- The default inter-app navigation uses these environment variables for URLs:
82
+ Standalone avatar dropdown component.
152
83
 
153
- ```env
154
- NEXT_PUBLIC_DNA_DASHBOARD_URL=https://dashboard.dna.example.com
155
- NEXT_PUBLIC_SPOT_URL=https://spot.dna.example.com
156
- NEXT_PUBLIC_DNA_WATER_URL=https://water.dna.example.com
157
- NEXT_PUBLIC_DNA_PULSE_URL=https://pulse.dna.example.com
158
- NEXT_PUBLIC_DNA_HYDROGEN_URL=https://hydrogen.dna.example.com
159
- NEXT_PUBLIC_DNA_OXYGEN_URL=https://oxygen.dna.example.com
160
- ```
84
+ ### PinnedJobs
161
85
 
162
- If not set, links fall back to relative paths (`/`, `/spot`, `/water`, etc.).
86
+ Standalone pinned jobs carousel.
163
87
 
164
- ## App Colors
88
+ ## Default Nav Items
165
89
 
166
- Recommended colors for each app's pinned jobs:
90
+ The header includes these nav links by default:
167
91
 
168
- | App | Color | Hex |
169
- |-----|-------|-----|
170
- | Water | Sky Blue | `#38bdf8` |
171
- | SPOT | Purple | `#a78bfa` |
172
- | Pulse | Rose | `#fb7185` |
173
- | Hydrogen | Emerald | `#34d399` |
174
- | Oxygen | Amber | `#fbbf24` |
92
+ | Name | Environment Variable |
93
+ |------|---------------------|
94
+ | Dashboard | `NEXT_PUBLIC_DNA_DASHBOARD_URL` |
95
+ | SPOT | `NEXT_PUBLIC_SPOT_URL` |
96
+ | Nitrogen | `NEXT_PUBLIC_DNA_NITROGEN_URL` |
97
+ | Water | `NEXT_PUBLIC_DNA_WATER_URL` |
98
+ | Methane | `NEXT_PUBLIC_DNA_METHANE_URL` |
99
+ | Hydrogen | `NEXT_PUBLIC_DNA_HYDROGEN_URL` |
100
+ | Oxygen | `NEXT_PUBLIC_DNA_OXYGEN_URL` |
101
+ | Ammonia | `NEXT_PUBLIC_DNA_AMMONIA_URL` |
102
+ | Carbon | `NEXT_PUBLIC_DNA_CARBON_URL` |
103
+ | Lightning | `NEXT_PUBLIC_DNA_LIGHTNING_URL` |
104
+ | CRUSH | `NEXT_PUBLIC_DNA_CRUSH_URL` |
175
105
 
176
- ## Individual Components
106
+ ## Logo
177
107
 
178
- For advanced use cases, you can import components individually:
108
+ The logo defaults to the CloudFront CDN URL. To use a custom logo:
179
109
 
180
110
  ```tsx
181
- import { DNAHeader, AppSubnav, PinnedJobs, AvatarMenu } from 'dna-shared-nav';
111
+ <DNANavigation
112
+ logoSrc="/your-custom-logo.png"
113
+ // ... other props
114
+ />
182
115
  ```
183
116
 
184
- ## Styling
117
+ ## Environment Variables
118
+
119
+ Configure inter-app navigation URLs in your `.env.local`:
120
+
121
+ ```bash
122
+ NEXT_PUBLIC_DNA_DASHBOARD_URL=https://dna-dashboard.vercel.app
123
+ NEXT_PUBLIC_SPOT_URL=https://spot.vercel.app
124
+ NEXT_PUBLIC_DNA_NITROGEN_URL=https://dna-nitrogen.vercel.app
125
+ NEXT_PUBLIC_DNA_WATER_URL=https://dna-water.vercel.app
126
+ NEXT_PUBLIC_DNA_METHANE_URL=https://dna-methane.vercel.app
127
+ NEXT_PUBLIC_DNA_HYDROGEN_URL=https://dna-hydrogen.vercel.app
128
+ NEXT_PUBLIC_DNA_OXYGEN_URL=https://dna-oxygen.vercel.app
129
+ NEXT_PUBLIC_DNA_AMMONIA_URL=https://dna-ammonia.vercel.app
130
+ NEXT_PUBLIC_DNA_CARBON_URL=https://dna-carbon.vercel.app
131
+ NEXT_PUBLIC_DNA_LIGHTNING_URL=https://dna-lightning.vercel.app
132
+ NEXT_PUBLIC_DNA_CRUSH_URL=https://dna-crush.vercel.app
133
+ ```
185
134
 
186
- The navigation uses CSS classes prefixed with `dna-`, `app-subnav-`, and `pinned-`. Styles require these fonts:
135
+ ## Development
187
136
 
188
- - **DM Sans** - Primary text
189
- - **JetBrains Mono** - Logo, progress values
137
+ ```bash
138
+ # Install dependencies
139
+ npm install
190
140
 
191
- Add to your app's `<head>`:
141
+ # Build
142
+ npm run build
192
143
 
193
- ```html
194
- <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=JetBrains+Mono:wght@500;600&display=swap" rel="stylesheet">
144
+ # Watch mode
145
+ npm run dev
195
146
  ```
196
147
 
197
- ## Role-Based Navigation
148
+ ## Types
198
149
 
199
- Navigation items can be restricted by role. The role hierarchy is:
150
+ ```typescript
151
+ interface DNAUser {
152
+ id: string;
153
+ email: string;
154
+ name: string;
155
+ role?: 'superadmin' | 'admin' | 'editor' | 'viewer';
156
+ avatar?: string;
157
+ }
200
158
 
201
- `viewer` < `editor` < `admin` < `superadmin`
159
+ interface DNANavItem {
160
+ name: string;
161
+ href: string;
162
+ requiredRole?: 'viewer' | 'editor' | 'admin' | 'superadmin';
163
+ hasNotification?: boolean;
164
+ }
202
165
 
203
- ```tsx
204
- const headerItems = [
205
- { name: 'Dashboard', href: '/' },
206
- { name: 'Admin', href: '/admin', requiredRole: 'admin' }, // Only admin+ see this
207
- ];
166
+ interface AppSubnavItem {
167
+ name: string;
168
+ href: string;
169
+ isActive?: boolean;
170
+ }
208
171
 
209
- <DNANavigation headerItems={headerItems} ... />
172
+ interface PinnedJob {
173
+ id: string;
174
+ appName: string;
175
+ appColor?: string;
176
+ jobName: string;
177
+ progress: number;
178
+ meta?: string;
179
+ }
210
180
  ```
181
+
182
+ ## Changelog
183
+
184
+ ### 1.0.2
185
+ - Updated nav items: SPOT, Nitrogen, Water, Methane, Hydrogen, Oxygen, Ammonia, Carbon, Lightning, CRUSH
186
+ - Logo now defaults to CloudFront CDN URL
187
+ - Fixed installation instructions for npm
188
+
189
+ ### 1.0.1
190
+ - Initial npm publish
package/assets/dna-logo.svg ADDED
@@ -0,0 +1,25 @@
1
+ <svg width="80" height="24" viewBox="0 0 80 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <defs>
3
+ <linearGradient id="logoGradient" x1="0%" y1="0%" x2="100%" y2="100%">
4
+ <stop offset="0%" stop-color="#fde047"/>
5
+ <stop offset="100%" stop-color="#facc15"/>
6
+ </linearGradient>
7
+ <filter id="glow">
8
+ <feGaussianBlur stdDeviation="2" result="coloredBlur"/>
9
+ <feMerge>
10
+ <feMergeNode in="coloredBlur"/>
11
+ <feMergeNode in="SourceGraphic"/>
12
+ </feMerge>
13
+ </filter>
14
+ </defs>
15
+ <text
16
+ x="0"
17
+ y="18"
18
+ font-family="JetBrains Mono, monospace"
19
+ font-size="18"
20
+ font-weight="600"
21
+ fill="url(#logoGradient)"
22
+ letter-spacing="0.05em"
23
+ filter="url(#glow)"
24
+ >DNA</text>
25
+ </svg>
package/dist/AppSubnav.d.ts CHANGED
@@ -1,2 +1,3 @@
1
- import type { AppSubnavProps } from './types';
1
+ import { AppSubnavProps } from './types';
2
2
  export declare function AppSubnav({ appName, items, pinnedJobs, onUnpinJob, }: AppSubnavProps): import("react/jsx-runtime").JSX.Element;
3
+ //# sourceMappingURL=AppSubnav.d.ts.map
package/dist/AppSubnav.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AppSubnav.d.ts","sourceRoot":"","sources":["../src/AppSubnav.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,KAAK,EACL,UAAe,EACf,UAAU,GACX,EAAE,cAAc,2CAoBhB"}
package/dist/AvatarMenu.d.ts CHANGED
@@ -1,2 +1,3 @@
1
- import type { AvatarMenuProps } from './types';
1
+ import { AvatarMenuProps } from './types';
2
2
  export declare function AvatarMenu({ userName, userEmail, initials, onLogout }: AvatarMenuProps): import("react/jsx-runtime").JSX.Element;
3
+ //# sourceMappingURL=AvatarMenu.d.ts.map
package/dist/AvatarMenu.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AvatarMenu.d.ts","sourceRoot":"","sources":["../src/AvatarMenu.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE1C,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,eAAe,2CAoEtF"}
package/dist/DNAHeader.d.ts CHANGED
@@ -1,2 +1,3 @@
1
- import type { DNAHeaderProps } from './types';
1
+ import { DNAHeaderProps } from './types';
2
2
  export declare function DNAHeader({ user, currentApp, items, logoSrc, onLogout, }: DNAHeaderProps): import("react/jsx-runtime").JSX.Element;
3
+ //# sourceMappingURL=DNAHeader.d.ts.map
package/dist/DNAHeader.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DNAHeader.d.ts","sourceRoot":"","sources":["../src/DNAHeader.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAc,MAAM,SAAS,CAAC;AAqCrD,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,UAAwB,EACxB,KAAyB,EACzB,OAAO,EACP,QAAQ,GACT,EAAE,cAAc,2CAoDhB"}
package/dist/DNAHeader.js CHANGED
@@ -1,13 +1,20 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { AvatarMenu } from './AvatarMenu';
4
+ // DNA logo hosted on CloudFront CDN - works across all microsites
5
+ const DNA_LOGO_URL = 'https://dscoblw2zo8x9.cloudfront.net/assets/1770003640504-w0rs6vl-DNA_LOGO.png';
4
6
  const DEFAULT_NAV_ITEMS = [
5
7
  { name: 'Dashboard', href: process.env.NEXT_PUBLIC_DNA_DASHBOARD_URL || '/' },
6
8
  { name: 'SPOT', href: process.env.NEXT_PUBLIC_SPOT_URL || '/spot' },
9
+ { name: 'Nitrogen', href: process.env.NEXT_PUBLIC_DNA_NITROGEN_URL || '/nitrogen' },
7
10
  { name: 'Water', href: process.env.NEXT_PUBLIC_DNA_WATER_URL || '/water' },
8
- { name: 'Pulse', href: process.env.NEXT_PUBLIC_DNA_PULSE_URL || '/pulse' },
11
+ { name: 'Methane', href: process.env.NEXT_PUBLIC_DNA_METHANE_URL || '/methane' },
9
12
  { name: 'Hydrogen', href: process.env.NEXT_PUBLIC_DNA_HYDROGEN_URL || '/hydrogen' },
10
13
  { name: 'Oxygen', href: process.env.NEXT_PUBLIC_DNA_OXYGEN_URL || '/oxygen' },
14
+ { name: 'Ammonia', href: process.env.NEXT_PUBLIC_DNA_AMMONIA_URL || '/ammonia' },
15
+ { name: 'Carbon', href: process.env.NEXT_PUBLIC_DNA_CARBON_URL || '/carbon' },
16
+ { name: 'Lightning', href: process.env.NEXT_PUBLIC_DNA_LIGHTNING_URL || '/lightning' },
17
+ { name: 'CRUSH', href: process.env.NEXT_PUBLIC_DNA_CRUSH_URL || '/crush' },
11
18
  ];
12
19
  const ROLE_HIERARCHY = ['viewer', 'editor', 'admin', 'superadmin'];
13
20
  function hasPermission(userRole, requiredRole) {
@@ -25,7 +32,7 @@ function getUserInitials(name) {
25
32
  .toUpperCase()
26
33
  .slice(0, 2);
27
34
  }
28
- export function DNAHeader({ user, currentApp = 'Dashboard', items = DEFAULT_NAV_ITEMS, logoSrc = '/DNA_LOGO.png', onLogout, }) {
35
+ export function DNAHeader({ user, currentApp = 'Dashboard', items = DEFAULT_NAV_ITEMS, logoSrc, onLogout, }) {
29
36
  const visibleItems = items.filter((item) => {
30
37
  if (!item.requiredRole)
31
38
  return true;
@@ -33,7 +40,9 @@ export function DNAHeader({ user, currentApp = 'Dashboard', items = DEFAULT_NAV_
33
40
  return false;
34
41
  return hasPermission(user.role, item.requiredRole);
35
42
  });
36
- return (_jsxs("header", { className: "dna-header", children: [_jsx("a", { href: process.env.NEXT_PUBLIC_DNA_DASHBOARD_URL || '/', className: "dna-logo-container", children: _jsx("img", { src: logoSrc, alt: "DNA", className: "dna-logo-img" }) }), _jsx("nav", { className: "dna-nav-links", children: visibleItems.map((item) => {
43
+ // Use provided logoSrc, or fall back to CDN URL
44
+ const logoSource = logoSrc || DNA_LOGO_URL;
45
+ return (_jsxs("header", { className: "dna-header", children: [_jsx("a", { href: process.env.NEXT_PUBLIC_DNA_DASHBOARD_URL || '/', className: "dna-logo-container", children: _jsx("img", { src: logoSource, alt: "DNA", className: "dna-logo-img" }) }), _jsx("nav", { className: "dna-nav-links", children: visibleItems.map((item) => {
37
46
  const isActive = item.name === currentApp;
38
47
  return (_jsxs("a", { href: item.href, className: `dna-nav-item ${isActive ? 'active' : ''}`, children: [item.hasNotification && _jsx("span", { className: "dna-notification-dot" }), item.name] }, item.name));
39
48
  }) }), _jsx("div", { className: "dna-header-right", children: user ? (_jsx(AvatarMenu, { userName: user.name, userEmail: user.email, initials: getUserInitials(user.name), onLogout: onLogout })) : (_jsx("a", { href: "/login", className: "dna-login-btn", children: "Sign In" })) })] }));
package/dist/DNANavigation.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import type { DNANavigationProps } from './types';
1
+ import { DNANavigationProps } from './types';
2
2
  /**
3
3
  * DNANavigation - Complete navigation component for DNA microsites
4
4
  *
@@ -26,3 +26,4 @@ import type { DNANavigationProps } from './types';
26
26
  * ```
27
27
  */
28
28
  export declare function DNANavigation({ user, currentApp, appName, headerItems, subnavItems, pinnedJobs, logoSrc, onLogout, onUnpinJob, }: DNANavigationProps): import("react/jsx-runtime").JSX.Element;
29
+ //# sourceMappingURL=DNANavigation.d.ts.map
package/dist/DNANavigation.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DNANavigation.d.ts","sourceRoot":"","sources":["../src/DNANavigation.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE7C;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,UAAU,EACV,OAAO,EACP,WAAW,EACX,WAAW,EACX,UAAe,EACf,OAAO,EACP,QAAQ,EACR,UAAU,GACX,EAAE,kBAAkB,2CAkBpB"}
package/dist/PinnedJobs.d.ts CHANGED
@@ -1,2 +1,3 @@
1
- import type { PinnedJobsProps } from './types';
1
+ import { PinnedJobsProps } from './types';
2
2
  export declare function PinnedJobs({ jobs, onUnpin }: PinnedJobsProps): import("react/jsx-runtime").JSX.Element | null;
3
+ //# sourceMappingURL=PinnedJobs.d.ts.map
package/dist/PinnedJobs.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PinnedJobs.d.ts","sourceRoot":"","sources":["../src/PinnedJobs.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAa,eAAe,EAAE,MAAM,SAAS,CAAC;AA0ErD,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,eAAe,kDA6E5D"}
package/dist/PinnedJobs.js CHANGED
@@ -1,7 +1,6 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { useState, useRef, useEffect } from 'react';
4
- // Progress ring component
5
4
  function ProgressRing({ progress, color = '#facc15' }) {
6
5
  const radius = 9;
7
6
  const circumference = 2 * Math.PI * radius;
@@ -12,8 +11,7 @@ function ProgressRing({ progress, color = '#facc15' }) {
12
11
  stroke: color,
13
12
  } })] }), _jsxs("span", { className: "pinned-progress-value", children: [progress, "%"] })] }));
14
13
  }
15
- // Single pinned job pill
16
- function PinnedJobPill({ job, onUnpin, }) {
14
+ function PinnedJobPill({ job, onUnpin }) {
17
15
  const handleUnpin = (e) => {
18
16
  e.stopPropagation();
19
17
  onUnpin?.(job.id);
@@ -24,10 +22,8 @@ export function PinnedJobs({ jobs, onUnpin }) {
24
22
  const [scrollIndex, setScrollIndex] = useState(0);
25
23
  const [showArrows, setShowArrows] = useState(false);
26
24
  const containerRef = useRef(null);
27
- // Check if we need carousel arrows
28
25
  useEffect(() => {
29
26
  setShowArrows(jobs.length > 2);
30
- // Reset scroll if jobs are removed
31
27
  if (scrollIndex > 0 && scrollIndex >= jobs.length - 1) {
32
28
  setScrollIndex(Math.max(0, jobs.length - 2));
33
29
  }
package/dist/index.d.ts CHANGED
@@ -4,3 +4,4 @@ export { AppSubnav } from './AppSubnav';
4
4
  export { PinnedJobs } from './PinnedJobs';
5
5
  export { AvatarMenu } from './AvatarMenu';
6
6
  export * from './types';
7
+ //# sourceMappingURL=index.d.ts.map
package/dist/index.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,cAAc,SAAS,CAAC"}
package/dist/types.d.ts CHANGED
@@ -58,3 +58,4 @@ export interface PinnedJobsProps {
58
58
  jobs: PinnedJob[];
59
59
  onUnpin?: (jobId: string) => void;
60
60
  }
61
+ //# sourceMappingURL=types.d.ts.map
package/dist/types.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAC;IACpD,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,YAAY,CAAC;IAC5D,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,EAAE,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,WAAW,EAAE,aAAa,EAAE,CAAC;IAC7B,UAAU,CAAC,EAAE,SAAS,EAAE,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,SAAS,EAAE,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC"}
package/package.json CHANGED
@@ -1,47 +1,49 @@
1
1
  {
2
2
  "name": "@glamcor/dna-shared-nav",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "description": "Shared navigation component for DNA microsites",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "exports": {
8
8
  ".": {
9
- "types": "./dist/index.d.ts",
10
9
  "import": "./dist/index.js",
11
- "require": "./dist/index.js"
10
+ "require": "./dist/index.js",
11
+ "types": "./dist/index.d.ts"
12
12
  },
13
- "./dist/styles.css": "./dist/styles.css"
13
+ "./styles.css": "./dist/styles.css",
14
+ "./dist/styles.css": "./dist/styles.css",
15
+ "./assets/*": "./assets/*"
14
16
  },
15
17
  "files": [
16
- "dist"
18
+ "dist",
19
+ "assets"
17
20
  ],
18
21
  "scripts": {
19
22
  "build": "tsc && cp src/styles.css dist/styles.css",
23
+ "dev": "tsc --watch",
24
+ "clean": "rm -rf dist",
20
25
  "prepublishOnly": "npm run build"
21
26
  },
22
- "repository": {
23
- "type": "git",
24
- "url": "https://github.com/glamcor/dna-shared-nav.git"
25
- },
26
- "keywords": [
27
- "dna",
28
- "navigation",
29
- "react",
30
- "component"
31
- ],
32
- "author": "GlamCor",
33
- "license": "UNLICENSED",
34
27
  "peerDependencies": {
35
28
  "react": "^18.0.0",
36
29
  "react-dom": "^18.0.0"
37
30
  },
38
31
  "devDependencies": {
39
- "@types/node": "^20.0.0",
32
+ "@types/node": "^25.1.0",
40
33
  "@types/react": "^18.2.0",
41
34
  "@types/react-dom": "^18.2.0",
42
35
  "typescript": "^5.0.0"
43
36
  },
44
- "publishConfig": {
45
- "access": "restricted"
46
- }
37
+ "repository": {
38
+ "type": "git",
39
+ "url": "https://github.com/glamcor/dna-shared-nav"
40
+ },
41
+ "keywords": [
42
+ "dna",
43
+ "navigation",
44
+ "react",
45
+ "component"
46
+ ],
47
+ "author": "Glamcor",
48
+ "license": "UNLICENSED"
47
49
  }