@central-icons-react/all 1.1.326 → 1.2.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.
@@ -8,6 +8,10 @@ export type CentralIconBaseProps = {
8
8
  } & SVGProps<SVGSVGElement>;
9
9
  type Props = CentralIconBaseProps & {
10
10
  ariaLabel?: string;
11
+ /** Internal generated shapes that contain instance-scoped SVG references. */
12
+ renderShapes?: (instanceId: string) => React.ReactNode;
11
13
  };
12
- export declare const CentralIconBase: React.FC<Props>;
14
+ export declare const CentralIconBase: React.ForwardRefExoticComponent<
15
+ Omit<Props, "ref"> & React.RefAttributes<SVGSVGElement>
16
+ >;
13
17
  export {};
@@ -21,16 +21,24 @@ const LegacyCentralIconBase = typeof React.useId === "function"
21
21
  return (React.createElement(CentralIconSvg, { ...this.props.iconProps, instanceId: this.state.instanceId }));
22
22
  }
23
23
  };
24
- export const CentralIconBase = (props) => LegacyCentralIconBase ? (React.createElement(LegacyCentralIconBase, { iconProps: props })) : (React.createElement(ModernCentralIconBase, { ...props }));
25
- const CentralIconSvg = ({ children, size = 24, ariaLabel, color, ariaHidden = true, style, mode = "masked", maskId, instanceId, ...props }) => {
24
+ export const CentralIconBase = React.forwardRef((props, ref) => LegacyCentralIconBase ? (React.createElement(LegacyCentralIconBase, { iconProps: { ...props, svgRef: ref } })) : (React.createElement(ModernCentralIconBase, { ...props, svgRef: ref })));
25
+ CentralIconBase.displayName = "CentralIconBase";
26
+ const CentralIconSvg = ({ children, size = 24, ariaLabel, color, ariaHidden, "aria-hidden": ariaHiddenAttribute, "aria-label": ariaLabelAttribute, role, svgRef, renderShapes, style, mode = "masked", maskId, instanceId, ...props }) => {
27
+ var _a, _b;
26
28
  const uniqueMaskId = instanceId ? `${maskId}-${instanceId}` : maskId;
27
29
  const masked = mode !== "raw" && !!maskId;
28
- return (React.createElement("svg", { ...props, "aria-hidden": ariaHidden, role: ariaHidden ? undefined : "img", width: typeof size === "number" ? `${size}px` : size, height: typeof size === "number" ? `${size}px` : size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", style: { color, ...style } },
29
- ariaLabel && !ariaHidden && React.createElement("title", null, ariaLabel),
30
+ const hidden = (_a = ariaHiddenAttribute !== null && ariaHiddenAttribute !== void 0 ? ariaHiddenAttribute : ariaHidden) !== null && _a !== void 0 ? _a : true;
31
+ const isHidden = hidden === true || hidden === "true";
32
+ const label = ariaLabelAttribute !== null && ariaLabelAttribute !== void 0 ? ariaLabelAttribute : ariaLabel;
33
+ const shapes = renderShapes
34
+ ? renderShapes((_b = uniqueMaskId !== null && uniqueMaskId !== void 0 ? uniqueMaskId : instanceId) !== null && _b !== void 0 ? _b : "icon")
35
+ : children;
36
+ return (React.createElement("svg", { ...props, ref: svgRef, "aria-hidden": hidden, "aria-label": ariaLabelAttribute, role: role !== null && role !== void 0 ? role : (isHidden ? undefined : "img"), width: typeof size === "number" ? `${size}px` : size, height: typeof size === "number" ? `${size}px` : size, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", style: { color, ...style } },
37
+ label && !isHidden && React.createElement("title", null, label),
30
38
  masked ? (React.createElement(React.Fragment, null,
31
39
  React.createElement("mask", { id: uniqueMaskId, maskUnits: "userSpaceOnUse", x: "0", y: "0", width: "24", height: "24" },
32
40
  React.createElement("rect", { width: "24", height: "24", fill: "#000" }),
33
- React.createElement("g", { fill: "none", style: { color: "#fff" } }, children)),
34
- React.createElement("rect", { width: "24", height: "24", fill: "currentColor", mask: `url(#${uniqueMaskId})` }))) : (children)));
41
+ React.createElement("g", { fill: "none", style: { color: "#fff" } }, shapes)),
42
+ React.createElement("rect", { width: "24", height: "24", fill: "currentColor", mask: `url(#${uniqueMaskId})` }))) : (shapes)));
35
43
  };
36
44
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/CentralIconBase/index.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/CentralIconBase/index.tsx"],"names":[],"mappings":"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"}
package/README.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # @central-icons-react/all
2
2
 
3
3
  A comprehensive collection of professionally designed React icons featuring customizable styles including round and square shapes, filled and outlined variants, multiple stroke widths, and corner radius options.
4
- The collection contains 2100 icons with 30 variants in total.
4
+ The collection contains 2103 icons with 30 variants in total.
5
5
 
6
6
  ## Table of Contents
7
7
 
@@ -35,7 +35,7 @@ pnpm add @central-icons-react/all
35
35
 
36
36
  ## Requirements
37
37
 
38
- - React 14.0.0 or higher
38
+ - React 16.6 through 19 (React 16.6 introduced the `memo` API used by these icons)
39
39
  - Valid license key (set as environment variable)
40
40
 
41
41
  ## Usage
@@ -79,16 +79,21 @@ import { CentralIcon } from "@central-icons-react/all";
79
79
  function MyComponent() {
80
80
  return (
81
81
  <CentralIcon
82
- iconJoin="round" // round | square
83
- iconFill="filled" // filled | outlined
84
- iconStroke="1" // 1 | 1.5 | 2
85
- iconRadius="1" // 0 | 1 | 2 | 3
86
- name="IconName"
82
+ join="round" // round | square
83
+ fill="filled" // filled | outlined
84
+ stroke="1" // 1 | 1.5 | 2
85
+ radius="1" // 0 | 1 | 2 | 3
86
+ name="IconHome"
87
87
  />
88
88
  );
89
89
  }
90
90
  ```
91
91
 
92
+ Square styles only support `radius="0"`; round styles support `"0"` through
93
+ `"3"`. TypeScript checks this relationship. Unavailable variants passed at runtime
94
+ (for example from a JavaScript style picker) render nothing and emit a development
95
+ warning identifying the requested variant.
96
+
92
97
  ## Using transparent colors
93
98
 
94
99
  Each mounted icon has a unique mask ID, so repeated icons remain independent even when one is hidden with `display: none`. React 18+ uses `useId()` for IDs that also match during server rendering and hydration. Older React versions assign unique IDs after mounting; server-rendered icons retain shared IDs until hydration completes.
@@ -117,16 +122,38 @@ All icons accept the following properties:
117
122
  | `size` | `number \| string` | `24` | Sets both width and height of the icon |
118
123
  | `color` | `string` | `currentColor` | Sets the icon color |
119
124
  | `ariaHidden` | `boolean` | `true` | Controls icon accessibility attributes |
120
- | `iconJoin` | `"round" \| "square"` | `"round"` | Controls the icon's corner style |
121
- | `iconFill` | `"filled" \| "outlined"` | `"filled"` | Sets the icon's fill style |
122
- | `iconStroke` | `"1" \| "1.5" \| "2"` | `"1"` | Controls the stroke width |
123
- | `iconRadius` | `"0" \| "1" \| "2" \| "3"` | `"1"` | Sets the corner radius |
125
+ | `join` | `"round" \| "square"` | Required | Controls the icon's corner style |
126
+ | `fill` | `"filled" \| "outlined"` | Required | Sets the icon's fill style |
127
+ | `stroke` | `"1" \| "1.5" \| "2"` | Required | Controls the stroke width |
128
+ | `radius` | `"0" \| "1" \| "2" \| "3"` | Required | Sets the corner radius |
124
129
  | `name` | `string` | none | Defines which icon should be used - see [Icons List](#icons) |
125
130
 
126
131
  Additionally, all standard SVG and HTML attributes are supported.
127
132
 
128
133
  ## Accessibility
129
134
 
135
+ Icons are decorative (`aria-hidden="true"`) by default. Use `aria-hidden={false}`
136
+ (or the existing `ariaHidden={false}` alias) for a meaningful icon. The standard
137
+ `aria-hidden` attribute takes precedence when both are supplied. An explicit
138
+ `aria-label` also takes precedence over the generated title. Label an enclosing
139
+ button or link when the icon is part of that control.
140
+
141
+ SVG refs are forwarded to the root `<svg>` on all supported React versions:
142
+
143
+ ```jsx
144
+ const iconRef = React.createRef();
145
+ <CentralIcon
146
+ ref={iconRef}
147
+ name="IconHome"
148
+ join="round"
149
+ fill="outlined"
150
+ radius="0"
151
+ stroke="1"
152
+ aria-hidden={false}
153
+ aria-label="Home"
154
+ />;
155
+ ```
156
+
130
157
  Icons are aria-hidden by default for decorative purposes. When using icons that convey meaning, you should disable aria-hidden:
131
158
 
132
159
  ```jsx
@@ -136,7 +163,7 @@ Icons are aria-hidden by default for decorative purposes. When using icons that
136
163
  // Meaningful icon
137
164
  <IconHome
138
165
  ariaHidden={false}
139
- title="Go to home page" // optional - title describing the icon will be added as fallback
166
+ aria-label="Go to home page" // overrides the generated accessible label
140
167
  /> // Will be announced by screen readers
141
168
  ```
142
169
 
@@ -586,8 +613,10 @@ Below is a complete list of available icons:
586
613
  - IconBookSimple
587
614
  - IconBubble2
588
615
  - IconBubble3
616
+ - IconBubble3Plus
589
617
  - IconBubble4
590
618
  - IconBubble5
619
+ - IconBubble5Plus
591
620
  - IconBubble6
592
621
  - IconBubbleAlert
593
622
  - IconBubbleAnnotation2
@@ -615,6 +644,7 @@ Below is a complete list of available icons:
615
644
  - IconCallIncoming
616
645
  - IconCallOutgoing
617
646
  - IconChatBubble7
647
+ - IconChatBubble7Plus
618
648
  - IconChatBubbles
619
649
  - IconEmail1
620
650
  - IconEmail2
package/icons/index.d.ts CHANGED
@@ -2159,6 +2159,21 @@ export declare const centralIconsMetadata: {
2159
2159
  readonly category: "Communication";
2160
2160
  readonly createdAt: "2026-07-09T11:02:33.605815+00:00";
2161
2161
  };
2162
+ readonly IconBubble3Plus: {
2163
+ readonly title: "bubble-3-plus, message, chat";
2164
+ readonly category: "Communication";
2165
+ readonly createdAt: "2026-10-02T07:02:04.708924+00:00";
2166
+ };
2167
+ readonly IconBubble5Plus: {
2168
+ readonly title: "bubble-5-plus, message, chat";
2169
+ readonly category: "Communication";
2170
+ readonly createdAt: "2026-10-02T07:02:04.708924+00:00";
2171
+ };
2172
+ readonly IconChatBubble7Plus: {
2173
+ readonly title: "chat-bubble-7-plus, message, chat";
2174
+ readonly category: "Communication";
2175
+ readonly createdAt: "2026-10-02T07:02:04.708924+00:00";
2176
+ };
2162
2177
  readonly IconBitcoin: {
2163
2178
  readonly title: "bitcoin";
2164
2179
  readonly category: "Crypto";
@@ -10507,14 +10522,28 @@ export type CentralIconJoin = "round" | "square";
10507
10522
  export type CentralIconFill = "filled" | "outlined";
10508
10523
  export type CentralIconRadius = "0" | "1" | "2" | "3";
10509
10524
  export type CentralIconStroke = "1" | "1.5" | "2";
10525
+ export type CentralIconStyle = {
10526
+ fill: CentralIconFill;
10527
+ stroke: CentralIconStroke;
10528
+ } & (
10529
+ | {
10530
+ join: "round";
10531
+ radius: CentralIconRadius;
10532
+ }
10533
+ | {
10534
+ join: "square";
10535
+ radius: "0";
10536
+ }
10537
+ );
10510
10538
  export type CentralIconPackageName =
10511
- `${CentralIconJoin}-${CentralIconFill}-radius-${CentralIconRadius}-stroke-${CentralIconStroke}`;
10539
+ | `round-${CentralIconFill}-radius-${CentralIconRadius}-stroke-${CentralIconStroke}`
10540
+ | `square-${CentralIconFill}-radius-0-stroke-${CentralIconStroke}`;
10512
10541
  /**
10513
10542
  * Key of a single icon variant, e.g. `round-filled-radius-0-stroke-1/IconHome`.
10514
10543
  *
10515
10544
  * The name part is deliberately `string` and not `CentralIconName`: TypeScript
10516
10545
  * refuses to build a template literal union with 100,000 or more members
10517
- * (TS2590), and the cross product here is 48 variants times every icon name.
10546
+ * (TS2590), and the cross product grows with variants times every icon name.
10518
10547
  * That limit was reached at 2084 icons. The variant prefix is still checked;
10519
10548
  * use `CentralIconName` to validate an icon name.
10520
10549
  */
package/icons/index.js CHANGED
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/icons/index.js
3
- size: 55796667 bytes
4
- sha256: eb5e71cb29a62a51b7199d4c350522ed085dd1ca7019aff8b35141a4f93c41cb
3
+ size: 55859445 bytes
4
+ sha256: 02280abb8fb7f33816f637e703a9c1fd8931a97c49259fbb854cb6953b99cc2f
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/icons/index.js.map
3
- size: 60629065 bytes
4
- sha256: 62ea28a53ce574dedef88526abb349f6e58eaad8a21a8c4ad505102b356b1830
3
+ size: 60697666 bytes
4
+ sha256: a4ef9d8829c5115d2f8890df5b20f5da966c3e7a542da54a2cf4d716c494cf7d
package/icons/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/icons/index.mjs
3
- size: 55796156 bytes
4
- sha256: 2a24ae08f7a0a66b7fd4401accd3890bb3e0fcb35726eae0a20ebebd852afa86
3
+ size: 55858934 bytes
4
+ sha256: 5eb9aec581f73903a96312d070dbbc3730258415bd6790103b6669ae6c467b07
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/icons/index.mjs.map
3
- size: 60628942 bytes
4
- sha256: 78c102b10dfea79d07f66e55a9a3e3cdd7c5d6e433b856977069c41b0afd7f20
3
+ size: 60697543 bytes
4
+ sha256: 34a4be0d0c9d434f5dabdfefd4f0a7b3b8b041b6cd84979b0da8038de1a6a545
package/icons-index.json CHANGED
@@ -11,7 +11,7 @@
11
11
  "withProps": "<IconHome size={32} color=\"#007AFF\" />",
12
12
  "central": "<CentralIcon\n iconJoin=\"round\" // round | square\n iconFill=\"filled\" // filled | outlined\n iconStroke=\"1\" // 1 | 1.5 | 2\n iconRadius=\"1\" // 0 | 1 | 2 | 3\n name=\"IconName\"\n/>"
13
13
  },
14
- "totalIcons": 2100,
14
+ "totalIcons": 2103,
15
15
  "categories": {
16
16
  "AI & Magic": {
17
17
  "count": 90,
@@ -422,15 +422,17 @@
422
422
  ]
423
423
  },
424
424
  "Communication": {
425
- "count": 60,
425
+ "count": 63,
426
426
  "icons": [
427
427
  "IconBook",
428
428
  "IconBookHeart",
429
429
  "IconBookSimple",
430
430
  "IconBubble2",
431
431
  "IconBubble3",
432
+ "IconBubble3Plus",
432
433
  "IconBubble4",
433
434
  "IconBubble5",
435
+ "IconBubble5Plus",
434
436
  "IconBubble6",
435
437
  "IconBubbleAlert",
436
438
  "IconBubbleAnnotation2",
@@ -458,6 +460,7 @@
458
460
  "IconCallIncoming",
459
461
  "IconCallOutgoing",
460
462
  "IconChatBubble7",
463
+ "IconChatBubble7Plus",
461
464
  "IconChatBubbles",
462
465
  "IconEmail1",
463
466
  "IconEmail2",
@@ -2748,6 +2751,9 @@
2748
2751
  "IconEmail2Check": "email-2-check, valid",
2749
2752
  "IconEmail2Unread": "email-2-unread",
2750
2753
  "IconBookHeart": "book-heart, daily, diary",
2754
+ "IconBubble3Plus": "bubble-3-plus, message, chat",
2755
+ "IconBubble5Plus": "bubble-5-plus, message, chat",
2756
+ "IconChatBubble7Plus": "chat-bubble-7-plus, message, chat",
2751
2757
  "IconBitcoin": "bitcoin",
2752
2758
  "IconEthereum": "ethereum",
2753
2759
  "IconCryptoCoin": "crypto-coin",
package/index.d.ts CHANGED
@@ -1,19 +1,48 @@
1
1
  import { type CentralIconBaseProps } from "./CentralIconBase";
2
- import {
3
- type CentralIconName,
4
- type CentralIconJoin,
5
- type CentralIconFill,
6
- type CentralIconRadius,
7
- type CentralIconStroke,
8
- } from "./icons";
9
- import { type FC } from "react";
10
- export { type CentralIconBaseProps };
11
- export type CentralIconProps = CentralIconBaseProps & {
12
- join: CentralIconJoin;
13
- fill: CentralIconFill;
14
- radius: CentralIconRadius;
15
- stroke: CentralIconStroke;
16
- name: CentralIconName;
17
- };
18
- export declare const CentralIcon: FC<CentralIconProps>;
2
+ import { type CentralIconName, type CentralIconStyle } from "./icons";
3
+ import React from "react";
4
+ export { type CentralIconBaseProps, type CentralIconStyle };
5
+ export type CentralIconProps = CentralIconBaseProps &
6
+ CentralIconStyle & {
7
+ name: CentralIconName;
8
+ };
9
+ export declare const CentralIcon: React.NamedExoticComponent<
10
+ (
11
+ | Omit<
12
+ {
13
+ size?: string | number;
14
+ ariaHidden?: boolean;
15
+ mode?: "masked" | "raw";
16
+ maskId?: string;
17
+ } & React.SVGProps<SVGSVGElement> & {
18
+ fill: import("./icons").CentralIconFill;
19
+ stroke: import("./icons").CentralIconStroke;
20
+ } & {
21
+ join: "round";
22
+ radius: import("./icons").CentralIconRadius;
23
+ } & {
24
+ name: CentralIconName;
25
+ },
26
+ "ref"
27
+ >
28
+ | Omit<
29
+ {
30
+ size?: string | number;
31
+ ariaHidden?: boolean;
32
+ mode?: "masked" | "raw";
33
+ maskId?: string;
34
+ } & React.SVGProps<SVGSVGElement> & {
35
+ fill: import("./icons").CentralIconFill;
36
+ stroke: import("./icons").CentralIconStroke;
37
+ } & {
38
+ join: "square";
39
+ radius: "0";
40
+ } & {
41
+ name: CentralIconName;
42
+ },
43
+ "ref"
44
+ >
45
+ ) &
46
+ React.RefAttributes<SVGSVGElement>
47
+ >;
19
48
  export default CentralIcon;
package/index.js CHANGED
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/index.js
3
- size: 55798452 bytes
4
- sha256: ce819a2cf8d7cf223d9b86959174a6edb7801832fd9bba12917657c9e3caa797
3
+ size: 55862193 bytes
4
+ sha256: 0033353bc9d47c8661c4824f02c9bd49362f587e981d38fc9f936acdb622dc41
package/index.js.map CHANGED
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/index.js.map
3
- size: 60635791 bytes
4
- sha256: 5e50bfd3f344afc79806535855238bfed1e5ed66adaf9674e89a294f366c5dbf
3
+ size: 60708161 bytes
4
+ sha256: 01f67102a14571dcf2499f30a188afbc4b184f0591c5d6dda6c3f9c83606fac6
package/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/index.mjs
3
- size: 55797679 bytes
4
- sha256: d556bb58cf70b93ec89ef23c697aca94ccd94f881b84c50cd8a44abc7c5555a0
3
+ size: 55861378 bytes
4
+ sha256: cf7776cbe2841fb4cfd0bb6b1acb45a564c584ef42f87473059bde1e8bea51e6
package/index.mjs.map CHANGED
@@ -1,4 +1,4 @@
1
1
  [diffend] Oversized file quarantined before diffing.
2
2
  name: package/index.mjs.map
3
- size: 60635579 bytes
4
- sha256: 226249892c1105858fea444c2b2a47c2bf54454baef23580c0703c1dbcd901bc
3
+ size: 60707896 bytes
4
+ sha256: 40dbd07c93f64ebb9005d59ab1c079b7a3794a3bebd78f2ff3c3209d9350bad6
package/license-check.js CHANGED
@@ -18,7 +18,7 @@ const licenseCheck = async () => {
18
18
  },
19
19
  body: JSON.stringify({
20
20
  package: "central-icons-react/all",
21
- version: "1.1.326",
21
+ version: "1.2.2",
22
22
  }),
23
23
  signal: controller.signal,
24
24
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@central-icons-react/all",
3
- "version": "1.1.326",
3
+ "version": "1.2.2",
4
4
  "license": "SEE LICENSE IN LICENSE.md",
5
5
  "homepage": "https://iconists.co/central",
6
6
  "bugs": {
@@ -41,11 +41,11 @@
41
41
  "lint": "prettier --write ."
42
42
  },
43
43
  "peerDependencies": {
44
- "react": ">=14.0.0 <= 19"
44
+ "react": ">=16.6.0 <20"
45
45
  },
46
46
  "devDependencies": {
47
47
  "@types/node": "^24",
48
- "@types/react": ">=14.0.0 <= 19",
48
+ "@types/react": "^19",
49
49
  "tsup": "^8",
50
50
  "typescript": "^5",
51
51
  "prettier": "^3"
@@ -0,0 +1,2 @@
1
+ /** Scope local SVG definitions and their references without changing external URLs. */
2
+ export declare function scopeSvgIds(svg: string, instanceId: string): string;
package/scopeSvgIds.js ADDED
@@ -0,0 +1,20 @@
1
+ /** Scope local SVG definitions and their references without changing external URLs. */
2
+ export function scopeSvgIds(svg, instanceId) {
3
+ const ids = new Set([...svg.matchAll(/\bid=["']([^"']+)["']/g)].map((match) => match[1]));
4
+ if (!ids.size)
5
+ return svg;
6
+ const suffix = instanceId.replace(/[&<>"']/g, (char) => `&#${char.charCodeAt(0)};`);
7
+ return svg.replace(/([\w:-]+)=(["'])(.*?)\2/g, (attribute, name, quote, value) => {
8
+ let scoped = value;
9
+ if (name === "id" && ids.has(value))
10
+ scoped = `${value}-${suffix}`;
11
+ else if ((name === "href" || name === "xlink:href") &&
12
+ value.startsWith("#") &&
13
+ ids.has(value.slice(1)))
14
+ scoped = `${value}-${suffix}`;
15
+ else
16
+ scoped = value.replace(/url\(#([^)]+)\)/g, (reference, id) => ids.has(id) ? `url(#${id}-${suffix})` : reference);
17
+ return `${name}=${quote}${scoped}${quote}`;
18
+ });
19
+ }
20
+ //# sourceMappingURL=scopeSvgIds.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"scopeSvgIds.js","sourceRoot":"","sources":["src/scopeSvgIds.ts"],"names":[],"mappings":"AAAA,uFAAuF;AACvF,MAAM,UAAU,WAAW,CAAC,GAAW,EAAE,UAAkB;IACzD,MAAM,GAAG,GAAG,IAAI,GAAG,CACjB,CAAC,GAAG,GAAG,CAAC,QAAQ,CAAC,wBAAwB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CACrE,CAAC;IACF,IAAI,CAAC,GAAG,CAAC,IAAI;QAAE,OAAO,GAAG,CAAC;IAC1B,MAAM,MAAM,GAAG,UAAU,CAAC,OAAO,CAC/B,UAAU,EACV,CAAC,IAAI,EAAE,EAAE,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,CACrC,CAAC;IACF,OAAO,GAAG,CAAC,OAAO,CAChB,0BAA0B,EAC1B,CAAC,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,KAAa,EAAE,EAAE;QACxC,IAAI,MAAM,GAAG,KAAK,CAAC;QACnB,IAAI,IAAI,KAAK,IAAI,IAAI,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC;YAAE,MAAM,GAAG,GAAG,KAAK,IAAI,MAAM,EAAE,CAAC;aAC9D,IACH,CAAC,IAAI,KAAK,MAAM,IAAI,IAAI,KAAK,YAAY,CAAC;YAC1C,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC;YACrB,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YAEvB,MAAM,GAAG,GAAG,KAAK,IAAI,MAAM,EAAE,CAAC;;YAE9B,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,kBAAkB,EAAE,CAAC,SAAS,EAAE,EAAE,EAAE,EAAE,CAC3D,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,IAAI,MAAM,GAAG,CAAC,CAAC,CAAC,SAAS,CAClD,CAAC;QACJ,OAAO,GAAG,IAAI,IAAI,KAAK,GAAG,MAAM,GAAG,KAAK,EAAE,CAAC;IAC7C,CAAC,CACF,CAAC;AACJ,CAAC"}
@@ -5,7 +5,7 @@ description: Use when inserting icons in React code that imports from @central-i
5
5
 
6
6
  # Central Icons — React (all)
7
7
 
8
- This skill helps you find and insert icons from the `@central-icons-react/all` package (version 1.1.326). The package exposes 2100 icons across 30 variants (round/square × filled/outlined × multiple corner radii and stroke widths) through a single dynamic `CentralIcon` component.
8
+ This skill helps you find and insert icons from the `@central-icons-react/all` package (version 1.2.2). The package exposes 2103 icons across 30 variants (round/square × filled/outlined × multiple corner radii and stroke widths) through a single dynamic `CentralIcon` component.
9
9
 
10
10
  ## Prefer a variant package when possible
11
11
 
@@ -536,8 +536,10 @@ Need the raw, unmasked shapes instead (e.g. to style individual paths)? Set `mod
536
536
  - **IconBookSimple** — book-simple, guide, info, faq
537
537
  - **IconBubble2** — bubble-2, message, chat
538
538
  - **IconBubble3** — bubble-3, message, chat
539
+ - **IconBubble3Plus** — bubble-3-plus, message, chat
539
540
  - **IconBubble4** — bubble-4, message, chat
540
541
  - **IconBubble5** — bubble-5, message, chat
542
+ - **IconBubble5Plus** — bubble-5-plus, message, chat
541
543
  - **IconBubble6** — bubble-6, message, chat
542
544
  - **IconBubbleAlert** — bubble-alert, comment, feedback
543
545
  - **IconBubbleAnnotation2** — bubble-annotation-2, message, chat
@@ -565,6 +567,7 @@ Need the raw, unmasked shapes instead (e.g. to style individual paths)? Set `mod
565
567
  - **IconCallIncoming** — call-incoming, phone
566
568
  - **IconCallOutgoing** — call-outgoing, phone
567
569
  - **IconChatBubble7** — chat-bubble-7
570
+ - **IconChatBubble7Plus** — chat-bubble-7-plus, message, chat
568
571
  - **IconChatBubbles** — chat-bubbles
569
572
  - **IconEmail1** — email-1, envelope
570
573
  - **IconEmail2** — email-2, envelope