@esds-sangam/icons

Lightweight React icon library for the ESDS Sangam Design System.

• Existing Sangam icons (e.g. Add, Close, ChevronDown) keep the same names and IconProps API.
• IBM Carbon UI icons are wrapped and re-exported additively from the same package (via @carbon/icons-react). Colliding names keep the Sangam implementation.

Browse the full IBM set: IBM Design Language – UI icons

Install

npm install @esds-sangam/[email protected]

Tanvi / apps import only from @esds-sangam/icons — do not import from @carbon/icons-react directly.

Usage

import { Add, Close, ChevronDown, Accessibility } from "@esds-sangam/icons";

export function Example() {
  return (
    <div className="flex items-center gap-3">
      <Add size={16} className="text-primary-600" aria-hidden />
      <Close size={20} color="currentColor" aria-label="Close" />
      <ChevronDown size={16} />
      {/* Carbon-backed additive icon */}
      <Accessibility size={16} aria-hidden />
    </div>
  );
}

IconProps (stable)

| Prop | Type | Default | Notes | |------|------|---------|--------| | size | number \| string | 16 | Matches existing Sangam icons | | color | string | inherit | Via CSS color / currentColor | | className | string | — | Token / Tailwind classes | | style | CSSProperties | — | Merged with color | | ref | SVG ref | — | Forwarded |

Compatibility

• Existing named exports are unchanged (no renames like Close → CloseIcon).
• Default size remains 16 (not Carbon’s 32).
• @carbon/icons-react is a dependency of this package — apps only install @esds-sangam/icons.

Maintainers

# Regenerate Carbon wrappers (skips Sangam-reserved names)
npm run generate:carbon

# Build
npm run build

Carbon icons attribution: Apache-2.0 — carbon-design-system/carbon.