@ultraviolet/icons 2.0.1 → 2.0.3

package/README.md

@@ -1,6 +1,6 @@
 # Ultraviolet Icons
 
-[![npm version](https://badge.fury.io/js/%40scaleway%2Ficons.svg)](https://badge.fury.io/js/%40scaleway%2Ficons)
+[![npm version](https://badge.fury.io/js/%40ultraviolet%2Ficons.svg)](https://badge.fury.io/js/%40ultraviolet%2Ficons)
 
 Ultraviolet Icons is a set of SVG icons and components related to icons.
 

package/dist/components/CategoryIcon/index.js

@@ -15,6 +15,10 @@ const StyledIcon = /*#__PURE__*/_styled("svg", {
   } = _ref2;
   return theme.colors.other.icon.category.primary.fillStrong;
 }, ";}");
+/**
+ * CategoryIcon component is used to render category icons, those icons are more complex than system icons
+ * as they involve multiple colors that changes depending on theme.
+ */
 const CategoryIcon = _ref3 => {
   let {
     name

package/dist/components/Icon/index.js

@@ -353,6 +353,9 @@ const StyledIcon = /*#__PURE__*/_styled('svg', {
   const icon = `icon${definedProminence}${disabled ? 'Disabled' : ''}`;
   return theme.colors?.[color]?.[icon] || color;
 }, ";", sizeStyles, ";");
+/**
+ * Icon component is our set of system icons in the design system. All of them are SVGs.
+ */
 const Icon = /*#__PURE__*/forwardRef((_ref3, ref) => {
   let {
     name = 'alert',

package/dist/components/ProductIcon/index.js

@@ -43,6 +43,11 @@ const StyledIcon = /*#__PURE__*/_styled('svg', {
   } = _ref5;
   return `${theme.colors.other.icon.product[variant][disabled ? 'fillWeakDisabled' : 'fillWeak']}`;
 }, ";}");
+
+/**
+ * ProductIcon component is used to render a set of icons that are linked to a product or service.
+ * Those icons are made of multiple colors that changes automatically based on the current theme.
+ */
 const ProductIcon = _ref6 => {
   let {
     name,

package/dist/index.d.ts

@@ -4,6 +4,9 @@ import { consoleLightTheme } from '@ultraviolet/themes';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 
 type Color = Extract<keyof typeof consoleLightTheme.colors, 'primary' | 'secondary' | 'neutral' | 'success' | 'danger' | 'warning' | 'info'>;
+/**
+ * Icon component is our set of system icons in the design system. All of them are SVGs.
+ */
 declare const Icon: react.ForwardRefExoticComponent<{
     size?: string | number | undefined;
     name?: "alert" | "anchor" | "arrow-down" | "arrow-left" | "arrow-left-double" | "arrow-right" | "arrow-right-bottom" | "arrow-right-double" | "arrow-up" | "asterisk" | "auto-fix" | "bullhorn" | "burger" | "book-open-outline" | "calculator" | "calendar-range" | "cancel" | "id" | "check" | "checkbox-circle-outline" | "clock-outline" | "close" | "close-circle-outline" | "copy-content" | "credentials" | "credit-card" | "delete" | "detach" | "doc" | "dots-horizontal" | "dots-vertical" | "download" | "drag-variant" | "drag-vertical" | "east" | "email-outline" | "expand" | "eye" | "eye-off" | "filter" | "github" | "help-circle-outline" | "information-outline" | "lock" | "logout" | "members" | "minus" | "moon" | "open-in-new" | "organization" | "pencil" | "play-circle-outline" | "plus" | "privacy" | "profile" | "progress-check" | "ray-end-arrow" | "ray-start-arrow" | "ray-start-end" | "ray-top-arrow" | "reboot" | "restore" | "revoke" | "rocket" | "search" | "send" | "settings" | "sort" | "sun" | "support" | "switch_orga" | "unlock" | "upload" | "view" | "weather-night" | "attach" | "phone" | "earth" | "email-remove-outline" | "expand-more" | "console" | "equal" | "youtube" | "x" | "slack" | "rss" | "linkedIn" | "instagram" | undefined;
@@ -42,6 +45,10 @@ declare const CATEGORY_ICONS: {
 type CategoryIconProps = {
     name: keyof typeof CATEGORY_ICONS;
 };
+/**
+ * CategoryIcon component is used to render category icons, those icons are more complex than system icons
+ * as they involve multiple colors that changes depending on theme.
+ */
 declare const CategoryIcon: ({ name }: CategoryIconProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 declare const PRODUCT_ICONS: {
@@ -147,6 +154,10 @@ type ProductIconProps = {
     disabled?: boolean;
     size?: keyof typeof SIZES;
 };
+/**
+ * ProductIcon component is used to render a set of icons that are linked to a product or service.
+ * Those icons are made of multiple colors that changes automatically based on the current theme.
+ */
 declare const ProductIcon: ({ name, variant, disabled, size, }: ProductIconProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 export { CategoryIcon, Icon, ProductIcon };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/icons",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "description": "Ultraviolet Icons",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -38,7 +38,7 @@
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@babel/core": "7.22.15",
+    "@babel/core": "7.22.19",
     "@emotion/babel-plugin": "11.11.0",
     "@types/react": "18.2.21",
     "@types/react-dom": "18.2.7"