Skip to content

Commit bb99992

Browse files
authored
Add certs and credential badges & tokens (#83)
1 parent a234f3d commit bb99992

12 files changed

Lines changed: 188 additions & 81 deletions

File tree

packages/demo/src/content/components/resource-badge.mdx

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,10 @@ import { ResourceBadge, PanelLabel } from "@eqtylab/equality";
88

99
## Overview
1010

11-
---
12-
1311
The `ResourceBadge` component is a specialized badge wrapper that provides predefined configurations for displaying different resource types as defined by [integrity-py](https://github.com/eqtylab/integrity-py). It automatically applies appropriate icons, colors, and labels.
1412

1513
## Usage
1614

17-
---
18-
1915
Import the component:
2016

2117
```tsx
@@ -30,8 +26,6 @@ Basic usage requires only a `type` prop:
3026

3127
## Variants
3228

33-
---
34-
3529
<div className="grid grid-cols-[auto_auto_auto] gap-6">
3630
<div className="flex flex-col items-start space-y-3">
3731
<PanelLabel label="With Icons (default)" />
@@ -53,6 +47,8 @@ Basic usage requires only a `type` prop:
5347
<ResourceBadge type="system-prompt" />
5448
<ResourceBadge type="reasoning" />
5549
<ResourceBadge type="token" />
50+
<ResourceBadge type="certificate" />
51+
<ResourceBadge type="credential" />
5652
<ResourceBadge type="tool" />
5753
<ResourceBadge type="unknown" />
5854
</div>
@@ -76,6 +72,8 @@ Basic usage requires only a `type` prop:
7672
<ResourceBadge type="system-prompt" display="text-only" />
7773
<ResourceBadge type="reasoning" display="text-only" />
7874
<ResourceBadge type="token" display="text-only" />
75+
<ResourceBadge type="certificate" display="text-only" />
76+
<ResourceBadge type="credential" display="text-only" />
7977
<ResourceBadge type="tool" display="text-only" />
8078
<ResourceBadge type="unknown" display="text-only" />
8179
</div>
@@ -99,15 +97,15 @@ Basic usage requires only a `type` prop:
9997
<ResourceBadge type="system-prompt" display="icon-only" />
10098
<ResourceBadge type="reasoning" display="icon-only" />
10199
<ResourceBadge type="token" display="icon-only" />
100+
<ResourceBadge type="certificate" display="icon-only" />
101+
<ResourceBadge type="credential" display="icon-only" />
102102
<ResourceBadge type="tool" display="icon-only" />
103103
<ResourceBadge type="unknown" display="icon-only" />
104104
</div>
105105
</div>
106106

107107
## Display Options
108108

109-
---
110-
111109
### With Icon and Label (Default)
112110

113111
The default display shows both icon and label:
@@ -134,9 +132,7 @@ Show only the text by setting `display` to `"text-only"`:
134132

135133
## Props
136134

137-
---
138-
139-
| Name | Description | Type | Default | Required |
140-
| --------- | --------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- |
141-
| `type` | The resource type that determines the badge variant, icon, and label. | `"agent"`, `"benchmark"`, `"benchmark-result"`, `"binary"`, `"code"`, `"compute"`, `"config"`, `"database"`, `"dataset"`, `"document"`, `"guardrail"`, `"media"`, `"model"`, `"prompt"`, `"reasoning"`, `"skill"`, `"system-prompt"`, `"token"`, `"tool"`, `"unknown"` | ||
142-
| `display` | Controls what elements are displayed: icon, text, or both. | `"both"`, `"text-only"`, `"icon-only"` | `"both"` ||
135+
| Name | Description | Type | Default | Required |
136+
| --------- | --------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- |
137+
| `type` | The resource type that determines the badge variant, icon, and label. | `"agent"`, `"benchmark"`, `"benchmark-result"`, `"binary"`, `"certificate"`, `"code"`, `"compute"`, `"config"`, `"credential"`, `"database"`, `"dataset"`, `"document"`, `"guardrail"`, `"media"`, `"model"`, `"prompt"`, `"reasoning"`, `"skill"`, `"system-prompt"`, `"token"`, `"tool"`, `"unknown"` | ||
138+
| `display` | Controls what elements are displayed: icon, text, or both. | `"both"`, `"text-only"`, `"icon-only"` | `"both"` ||

packages/tokens/equality-tokens.json

Lines changed: 80 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -535,6 +535,14 @@
535535
"hex": "#9C652D"
536536
}
537537
},
538+
"certificate": {
539+
"$type": "color",
540+
"$value": {
541+
"colorSpace": "display-p3",
542+
"components": [0.2534, 0.2782, 0.09737],
543+
"hex": "#414719"
544+
}
545+
},
538546
"code": {
539547
"$type": "color",
540548
"$value": {
@@ -567,6 +575,14 @@
567575
"hex": "#244560"
568576
}
569577
},
578+
"credential": {
579+
"$type": "color",
580+
"$value": {
581+
"colorSpace": "display-p3",
582+
"components": [0.2534, 0.2782, 0.09737],
583+
"hex": "#414719"
584+
}
585+
},
570586
"database": {
571587
"$type": "color",
572588
"$value": {
@@ -599,14 +615,6 @@
599615
"hex": "#5C2165"
600616
}
601617
},
602-
"inference": {
603-
"$type": "color",
604-
"$value": {
605-
"colorSpace": "display-p3",
606-
"components": [0.1689, 0.3045, 0.136],
607-
"hex": "#2B4E23"
608-
}
609-
},
610618
"media": {
611619
"$type": "color",
612620
"$value": {
@@ -713,6 +721,14 @@
713721
"hex": "#EFD2B7"
714722
}
715723
},
724+
"certificate": {
725+
"$type": "color",
726+
"$value": {
727+
"colorSpace": "display-p3",
728+
"components": [0.8033, 0.8266, 0.7044],
729+
"hex": "#CDD3B4"
730+
}
731+
},
716732
"code": {
717733
"$type": "color",
718734
"$value": {
@@ -745,6 +761,14 @@
745761
"hex": "#B4D3E7"
746762
}
747763
},
764+
"credential": {
765+
"$type": "color",
766+
"$value": {
767+
"colorSpace": "display-p3",
768+
"components": [0.8033, 0.8266, 0.7044],
769+
"hex": "#CDD3B4"
770+
}
771+
},
748772
"database": {
749773
"$type": "color",
750774
"$value": {
@@ -777,14 +801,6 @@
777801
"hex": "#CD94D6"
778802
}
779803
},
780-
"inference": {
781-
"$type": "color",
782-
"$value": {
783-
"colorSpace": "display-p3",
784-
"components": [0.7403, 0.8486, 0.7417],
785-
"hex": "#BDD8BD"
786-
}
787-
},
788804
"media": {
789805
"$type": "color",
790806
"$value": {
@@ -2319,6 +2335,14 @@
23192335
"hex": "#EFD2B7"
23202336
}
23212337
},
2338+
"certificate": {
2339+
"$type": "color",
2340+
"$value": {
2341+
"colorSpace": "display-p3",
2342+
"components": [0.8033, 0.8266, 0.7044],
2343+
"hex": "#CDD3B4"
2344+
}
2345+
},
23222346
"code": {
23232347
"$type": "color",
23242348
"$value": {
@@ -2351,6 +2375,14 @@
23512375
"hex": "#B4D3E7"
23522376
}
23532377
},
2378+
"credential": {
2379+
"$type": "color",
2380+
"$value": {
2381+
"colorSpace": "display-p3",
2382+
"components": [0.8033, 0.8266, 0.7044],
2383+
"hex": "#CDD3B4"
2384+
}
2385+
},
23542386
"database": {
23552387
"$type": "color",
23562388
"$value": {
@@ -2383,14 +2415,6 @@
23832415
"hex": "#E2BEE8"
23842416
}
23852417
},
2386-
"inference": {
2387-
"$type": "color",
2388-
"$value": {
2389-
"colorSpace": "display-p3",
2390-
"components": [0.7403, 0.8486, 0.7417],
2391-
"hex": "#BDD8BD"
2392-
}
2393-
},
23942418
"media": {
23952419
"$type": "color",
23962420
"$value": {
@@ -2488,6 +2512,14 @@
24882512
"hex": "#CD8338"
24892513
}
24902514
},
2515+
"certificate": {
2516+
"$type": "color",
2517+
"$value": {
2518+
"colorSpace": "display-p3",
2519+
"components": [0.4451, 0.4851, 0.1956],
2520+
"hex": "#727C32"
2521+
}
2522+
},
24912523
"code": {
24922524
"$type": "color",
24932525
"$value": {
@@ -2520,6 +2552,14 @@
25202552
"hex": "#357AA5"
25212553
}
25222554
},
2555+
"credential": {
2556+
"$type": "color",
2557+
"$value": {
2558+
"colorSpace": "display-p3",
2559+
"components": [0.4451, 0.4851, 0.1956],
2560+
"hex": "#727C32"
2561+
}
2562+
},
25232563
"database": {
25242564
"$type": "color",
25252565
"$value": {
@@ -2552,14 +2592,6 @@
25522592
"hex": "#A035B1"
25532593
}
25542594
},
2555-
"inference": {
2556-
"$type": "color",
2557-
"$value": {
2558-
"colorSpace": "display-p3",
2559-
"components": [0.2946, 0.5328, 0.2433],
2560-
"hex": "#4B883E"
2561-
}
2562-
},
25632595
"media": {
25642596
"$type": "color",
25652597
"$value": {
@@ -2641,6 +2673,14 @@
26412673
"hex": "#432D17"
26422674
}
26432675
},
2676+
"certificate": {
2677+
"$type": "color",
2678+
"$value": {
2679+
"colorSpace": "display-p3",
2680+
"components": [0.1652, 0.183, 0.0523],
2681+
"hex": "#2A2F0D"
2682+
}
2683+
},
26442684
"code": {
26452685
"$type": "color",
26462686
"$value": {
@@ -2673,6 +2713,14 @@
26732713
"hex": "#192D40"
26742714
}
26752715
},
2716+
"credential": {
2717+
"$type": "color",
2718+
"$value": {
2719+
"colorSpace": "display-p3",
2720+
"components": [0.1652, 0.183, 0.0523],
2721+
"hex": "#2A2F0D"
2722+
}
2723+
},
26762724
"database": {
26772725
"$type": "color",
26782726
"$value": {
@@ -2705,14 +2753,6 @@
27052753
"hex": "#3C1742"
27062754
}
27072755
},
2708-
"inference": {
2709-
"$type": "color",
2710-
"$value": {
2711-
"colorSpace": "display-p3",
2712-
"components": [0.1097, 0.1998, 0.08667],
2713-
"hex": "#1C3316"
2714-
}
2715-
},
27162756
"media": {
27172757
"$type": "color",
27182758
"$value": {

packages/tokens/equality-tokens.pinwheel

Lines changed: 37 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1909,9 +1909,16 @@
19091909
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
19101910
</alias>
19111911
<alias>
1912-
<name>Inference</name>
1912+
<name>Certificate</name>
19131913
<type>3</type>
1914-
<referencedItemId>E1948874-0BDB-4E45-A49B-50B04FC79580</referencedItemId>
1914+
<referencedItemId>736C6111-7CC7-4829-B456-29384906EF95</referencedItemId>
1915+
<subIndex>4</subIndex>
1916+
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
1917+
</alias>
1918+
<alias>
1919+
<name>Credential</name>
1920+
<type>3</type>
1921+
<referencedItemId>736C6111-7CC7-4829-B456-29384906EF95</referencedItemId>
19151922
<subIndex>4</subIndex>
19161923
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
19171924
</alias>
@@ -2132,13 +2139,24 @@
21322139
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
21332140
</alias>
21342141
<alias>
2135-
<name>Inference</name>
2142+
<name>Certificate</name>
21362143
<type>3</type>
21372144
<typeDark>3</typeDark>
21382145
<appearance>lightanddark</appearance>
2139-
<referencedItemId>E1948874-0BDB-4E45-A49B-50B04FC79580</referencedItemId>
2146+
<referencedItemId>736C6111-7CC7-4829-B456-29384906EF95</referencedItemId>
21402147
<subIndex>7</subIndex>
2141-
<referencedItemIdDark>E1948874-0BDB-4E45-A49B-50B04FC79580</referencedItemIdDark>
2148+
<referencedItemIdDark>736C6111-7CC7-4829-B456-29384906EF95</referencedItemIdDark>
2149+
<subIndexDark>1</subIndexDark>
2150+
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
2151+
</alias>
2152+
<alias>
2153+
<name>Credential</name>
2154+
<type>3</type>
2155+
<typeDark>3</typeDark>
2156+
<appearance>lightanddark</appearance>
2157+
<referencedItemId>736C6111-7CC7-4829-B456-29384906EF95</referencedItemId>
2158+
<subIndex>7</subIndex>
2159+
<referencedItemIdDark>736C6111-7CC7-4829-B456-29384906EF95</referencedItemIdDark>
21422160
<subIndexDark>1</subIndexDark>
21432161
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
21442162
</alias>
@@ -2381,13 +2399,24 @@
23812399
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
23822400
</alias>
23832401
<alias>
2384-
<name>Inference</name>
2402+
<name>Certificate</name>
23852403
<type>3</type>
23862404
<typeDark>3</typeDark>
23872405
<appearance>lightanddark</appearance>
2388-
<referencedItemId>E1948874-0BDB-4E45-A49B-50B04FC79580</referencedItemId>
2406+
<referencedItemId>736C6111-7CC7-4829-B456-29384906EF95</referencedItemId>
23892407
<subIndex>1</subIndex>
2390-
<referencedItemIdDark>E1948874-0BDB-4E45-A49B-50B04FC79580</referencedItemIdDark>
2408+
<referencedItemIdDark>736C6111-7CC7-4829-B456-29384906EF95</referencedItemIdDark>
2409+
<subIndexDark>6</subIndexDark>
2410+
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
2411+
</alias>
2412+
<alias>
2413+
<name>Credential</name>
2414+
<type>3</type>
2415+
<typeDark>3</typeDark>
2416+
<appearance>lightanddark</appearance>
2417+
<referencedItemId>736C6111-7CC7-4829-B456-29384906EF95</referencedItemId>
2418+
<subIndex>1</subIndex>
2419+
<referencedItemIdDark>736C6111-7CC7-4829-B456-29384906EF95</referencedItemIdDark>
23912420
<subIndexDark>6</subIndexDark>
23922421
<buildGroupId>86B9D7D8-F74A-4CAE-B006-65451BBEDAB9</buildGroupId>
23932422
</alias>

packages/ui/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@eqtylab/equality",
33
"description": "EQTYLab's component and token-based design system",
44
"homepage": "https://equality.eqtylab.io/",
5-
"version": "1.7.1",
5+
"version": "1.7.2",
66
"license": "Apache-2.0",
77
"keywords": [
88
"component library",

0 commit comments

Comments
 (0)