Skip to content

feat(icons): add lucide-react icon library with healthcare icons#1

Merged
wreiske merged 3 commits into
mainfrom
feature/icon-library
Jan 22, 2026
Merged

feat(icons): add lucide-react icon library with healthcare icons#1
wreiske merged 3 commits into
mainfrom
feature/icon-library

Conversation

@garrity-miepub

Copy link
Copy Markdown
Collaborator

Integrate lucide-react as the icon library and create a curated set of re-exported icons with consistent naming (suffixed with 'Icon').

  • Add Icons module with ~160 icons across 14 categories
  • Add Healthcare & Medical category with 60+ medical icons:
    • Facilities: Hospital, Ambulance, Bed
    • Equipment: Stethoscope, Syringe, Thermometer, Microscope
    • Medications: Pill, Tablets
    • Labs: TestTube, Flask, DNA, Droplets
    • Body/Anatomy: Brain, Bone, Ear, Eye, HeartPulse
    • Patients: Patient, Baby, Accessibility
    • Records: ClipboardPlus, FileHeart
  • Add Storybook page with searchable icon gallery
  • Click-to-copy import statements for each icon
  • Export icons from main @mieweb/ui entry point
icons-page.mov

Integrate lucide-react as the icon library and create a curated set of
re-exported icons with consistent naming (suffixed with 'Icon').

- Add Icons module with ~160 icons across 14 categories
- Add Healthcare & Medical category with 60+ medical icons:
  - Facilities: Hospital, Ambulance, Bed
  - Equipment: Stethoscope, Syringe, Thermometer, Microscope
  - Medications: Pill, Tablets
  - Labs: TestTube, Flask, DNA, Droplets
  - Body/Anatomy: Brain, Bone, Ear, Eye, HeartPulse
  - Patients: Patient, Baby, Accessibility
  - Records: ClipboardPlus, FileHeart
- Add Storybook page with searchable icon gallery
- Click-to-copy import statements for each icon
- Export icons from main @mieweb/ui entry point
@wreiske

wreiske commented Jan 20, 2026

Copy link
Copy Markdown
Member

@garrity-miepub the build is failing for this.


--
16:57:48.174 | Using v2 root directory strategy
16:57:48.202 | Success: Finished cloning repository files
16:57:50.070 | Checking for configuration in a Wrangler configuration file (BETA)
16:57:50.071 |  
16:57:51.171 | No wrangler.toml file found. Continuing.
16:57:51.233 | Detected the following tools from environment: npm@10.9.2, nodejs@22.16.0
16:57:51.234 | Installing project dependencies: npm clean-install --progress=false
16:57:57.117 |  
16:57:57.117 | added 501 packages, and audited 502 packages in 6s
16:57:57.117 |  
16:57:57.117 | 181 packages are looking for funding
16:57:57.117 | run `npm fund` for details
16:57:57.118 |  
16:57:57.118 | found 0 vulnerabilities
16:57:57.141 | Executing user command: npm run build-storybook
16:57:57.494 |  
16:57:57.494 | > @mieweb/ui@0.1.0 build-storybook
16:57:57.494 | > storybook build
16:57:57.494 |  
16:57:57.983 |  
16:57:57.985 | ┌  Building storybook v10.1.11
16:57:57.987 | │
16:57:57.988 | ◇  Cleaning outputDir: storybook-static
16:57:58.170 | │
16:57:58.171 | ◇  Loading presets
16:57:59.079 | │
16:57:59.079 | ◇  Building manager..
16:57:59.230 | │
16:57:59.230 | ●  Building preview..
16:57:59.912 | │
16:57:59.912 | ●  Copying static files: .storybook/public at storybook-static
16:58:01.887 | │  Vite vite v6.4.1 building for production...
16:58:01.996 | │
16:58:01.996 | ●  Storybook collects completely anonymous usage telemetry. We use it to
16:58:01.997 | │  shape Storybook's roadmap and prioritize features. You can learn more,
16:58:01.997 | │  including how to opt out, at ]8;;https://storybook.js.org/telemetry�https://storybook.js.org/telemetry]8;;�
16:58:02.002 | │  Vite transforming...
16:58:05.618 | │  Vite ✓ 169 modules transformed.
16:58:05.623 | │
16:58:05.623 | ■  Vite ✗ Build failed in 3.71s
16:58:05.624 | │
16:58:05.624 | ■  Failed to build the preview
16:58:05.626 | │
16:58:05.626 | ■  [vite]: Rollup failed to resolve import "lucide-react" from
16:58:05.626 | │  "./src/components/Icons/index.ts".
16:58:05.626 | │  This is most likely unintended because it can break your application
16:58:05.626 | │  at runtime.
16:58:05.626 | │  If you do want to externalize this module explicitly add it to
16:58:05.626 | │  `build.rollupOptions.external`
16:58:05.626 | │  at viteLog
16:58:05.626 | │  (file://./node_modules/vite/dist/node/chunks/dep-D4NMHUTW.js:46374:15)
16:58:05.627 | │  at onRollupLog
16:58:05.627 | │  (file://./node_modules/vite/dist/node/chunks/dep-D4NMHUTW.js:46424:5)
16:58:05.627 | │  at onLog
16:58:05.627 | │  (file://./node_modules/vite/dist/node/chunks/dep-D4NMHUTW.js:46072:7)
16:58:05.627 | │  at file://./node_modules/rollup/dist/es/shared/node-entry.js:21081:32
16:58:05.627 | │  at Object.logger [as onLog]
16:58:05.627 | │  (file://./node_modules/rollup/dist/es/shared/node-entry.js:22968:9)
16:58:05.627 | │  at ModuleLoader.handleInvalidResolvedId
16:58:05.627 | │  (file://./node_modules/rollup/dist/es/shared/node-entry.js:21712:26)
16:58:05.627 | │  at file://./node_modules/rollup/dist/es/shared/node-entry.js:21670:26
16:58:07.582 | │
16:58:07.583 | └  Storybook exited with an error
16:58:07.583 |  
16:58:07.637 | Failed: Error while executing user command. Exited with error code: 1
16:58:07.645 | Failed: build command exited with code: 1
16:58:08.695 | Failed: error occurred while running build command

@garrity-miepub

Copy link
Copy Markdown
Collaborator Author

Weird. Let me look. I thought all the checks passed.

- Move ActivityIcon to Data & Charts section (remove from Healthcare)
- Move EyeIcon to Layout & View section (remove from Healthcare)
- Eliminates duplicate export error in Storybook build
@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jan 20, 2026

Copy link
Copy Markdown

Deploying ui with  Cloudflare Pages  Cloudflare Pages

Latest commit: bb02bcc
Status: ✅  Deploy successful!
Preview URL: https://e878c202.ui-6d0.pages.dev
Branch Preview URL: https://feature-icon-library.ui-6d0.pages.dev

View logs

- Add lucide-react ^0.562.0 to dependencies (required for Icons module)
- Add @tailwindcss/cli to devDependencies (required for CSS build)
- Update react and react-dom to ^19.2.3
@wreiske wreiske merged commit 598e909 into main Jan 22, 2026
1 check passed
@wreiske wreiske deleted the feature/icon-library branch January 22, 2026 02:45
garrity-miepub added a commit that referenced this pull request Jan 22, 2026
… use lucide-react

AG Grid Header/Menu Icons:
- Add agGridQuartzFont.css import to AGGrid.stories.tsx for icon font support
- Add --ag-icon-font-family CSS variable set to 'agGridQuartz' in theme
- Add explicit .ag-icon font-family rule to ensure icons render correctly
- The --ag-font-family: inherit was overriding AG Grid's icon webfont

Cell Renderer Icons:
- Replace inline SVG icons with lucide-react icon components
- EmailRenderer now uses MailIcon from Icons component
- PhoneRenderer now uses PhoneIcon from Icons component
- DomainRenderer now uses GlobeIcon from Icons component
- LinkedInRenderer now uses Linkedin from lucide-react
- BooleanRenderer now uses CheckCircleIcon and ClockIcon from Icons component
- Ensures consistency with the new icon library added in PR #1

Misc:
- Fix ESLint error in Icons.stories.tsx (escape quotes in JSX)
garrity-miepub added a commit that referenced this pull request Mar 23, 2026
Addresses Copilot review comment on PR #145: Step 8.3 audits raw <table>
elements but the Step 10 Compliance Summary template had no corresponding
row to record that metric. Added the missing row to keep the audit
commands and report template in sync.

This is the only change from the Copilot review we accepted. Comments #1
(Step 10 intro wording) and #3 (rule #8 append vs checkbox) were reviewed
and intentionally skipped — see PR comments for rationale.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants