@volvo-cars/react-icons - npm Package Compare versions

Comparing version 0.7.0 to 0.8.0

dist/icon-button.d.ts

 /// <reference types="react" />
-declare const COLOR: readonly ["neutral", "destructive"];
-declare const VARIANT: readonly ["filled", "outlined", "clear"];
-type IconButtonColor = (typeof COLOR)[number];
-type IconButtonVariant = (typeof VARIANT)[number];
 export type IconButtonIcon = 'avatar' | 'calendar' | 'checkmark' | 'communication-email' | 'communication-phone' | 'copy' | 'delete' | 'edit' | 'externallink' | 'favorite' | 'filter' | 'info' | 'media-pause' | 'media-play' | 'more' | 'navigation-arrowback' | 'navigation-arrowdown' | 'navigation-arrowforward' | 'navigation-arrowup' | 'navigation-chevronback' | 'navigation-chevrondown' | 'navigation-chevronforward' | 'navigation-chevronup' | 'navigation-close' | 'navigation-minus' | 'navigation-plus' | 'other-eye' | 'other-eyeslash' | 'refresh' | 'search' | 'settings';
 type BaseProps = {
+    hidden?: boolean;
+    id?: string;
+    dir?: string;
+    lang?: string;
+    slot?: string;
+    tabIndex?: number;
     className?: string;
     /**
-     * The icon type - combining the icon category, the name of the icon and the size.
+     * The icon name including the icon category, if any.
      */
@@ -15,8 +17,25 @@ iconName: IconButtonIcon;
      * The visual style of the IconButton
+     *
+     * @default 'outlined'
      */
-    variant?: IconButtonVariant;
+    variant?: 'outlined' | 'filled' | 'clear';
     /**
      * The color of the IconButton
+     *
+     * @default 'neutral'
      */
-    color?: IconButtonColor;
+    color?: 'neutral' | 'destructive';
+    /**
+     * Allows the background to bleed out into the surrounding layout,
+     * leaving the button to only take up the space for the icon itself.
+     *
+     * Only available for the clear variant.
+     *
+     * @default false
+     */
+    bleed?: boolean;
+    /**
+     * Disables the button. Avoid using disabled buttons whenever possible - instead show error messages explaining the next steps the user should take.
+     */
+    disabled?: boolean;
 };
@@ -64,2 +83,7 @@ type AriaProps = {
     onKeyUp?: React.KeyboardEventHandler<HTMLButtonElement>;
+    onPointerEnter?: React.PointerEventHandler<HTMLButtonElement>;
+    onPointerMove?: React.PointerEventHandler<HTMLButtonElement>;
+    onPointerDown?: React.PointerEventHandler<HTMLButtonElement>;
+    onPointerUp?: React.PointerEventHandler<HTMLButtonElement>;
+    onPointerLeave?: React.PointerEventHandler<HTMLButtonElement>;
 };
@@ -66,0 +90,0 @@ type AsChildProps = {

dist/index.js

@@ -1,2 +0,2 @@
-import{a as y,b as h,c as u,d as m}from"./chunk-IAQIKXX7.js";import{Children as d,cloneElement as v,forwardRef as g}from"react";import{jsx as e}from"react/jsx-runtime";var b=["neutral","destructive"],I=["filled","outlined","clear"],B=g(function({iconName:a,className:o,color:n,variant:r="outlined","aria-label":c,...t},p){let i=I.includes(r)?`icon-button-${r}`:"icon-button-filled",l=b.includes(n)?n:"neutral",s=()=>e(m,{type:`${a}-16`,color:"currentColor"});return t.children&&t.asChild&&d.count(t.children)===1?v(d.only(t.children),{...t,className:`${i} ${o||""}`,"aria-label":c,"data-color":l},e(s,{})):t.href?e("a",{ref:p,...t,className:`${i} ${o||""}`,"aria-label":c,"data-color":l,children:e(s,{})}):e("button",{ref:p,type:"button",...t,className:`${i} ${o||""}`,"aria-label":c,"data-color":l,children:e(s,{})})});import{forwardRef as C}from"react";import{jsx as P}from"react/jsx-runtime";var R=C(function({alt:a,height:o=8,...n},r){return P("img",{...n,ref:r,className:`wordmark text-primary ${n.className||""}`.trim(),width:o*13,height:o,src:u(),alt:a,style:{"--mask-url":`url('${u()}')`}})});export{m as Icon,B as IconButton,R as Wordmark,h as getIconSrc,y as setBaseUrl};
+import{a as h,b as g,c as s,d}from"./chunk-IAQIKXX7.js";import{Children as y,cloneElement as P,forwardRef as b}from"react";import{jsx as n}from"react/jsx-runtime";var B=b(function({iconName:i,className:o="",color:t,variant:r="outlined",bleed:f,disabled:m,...e},u){let l={className:`icon-button-${r} ${o}`.trim(),"data-color":t==="neutral"?void 0:t,"data-bleed":f&&r==="clear"?!0:void 0,"aria-disabled":m||void 0},c=()=>n(d,{type:`${i}-16`,color:"currentColor"});if(e.children&&e.asChild){let{children:a,asChild:k,...v}=e;return P(y.only(a),{...v,...l},n(c,{}))}else return e.href?n("a",{ref:u,...e,...l,children:n(c,{})}):n("button",{ref:u,type:"button",...e,...l,onClick:a=>{m?a.preventDefault():e.onClick&&e.onClick(a)},children:n(c,{})})});import{forwardRef as E}from"react";import{jsx as I}from"react/jsx-runtime";var H=E(function({alt:i,height:o=8,...t},r){return I("img",{...t,ref:r,className:`wordmark text-primary ${t.className||""}`.trim(),width:o*13,height:o,src:s(),alt:i,style:{"--mask-url":`url('${s()}')`}})});export{d as Icon,B as IconButton,H as Wordmark,g as getIconSrc,h as setBaseUrl};
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@volvo-cars/react-icons",
   "description": "React Icons",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "license": "UNLICENSED",
@@ -6,0 +6,0 @@ "sideEffects": false,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

136634

increased by1.35%

Lines of code

404

increased by6.32%

No dependency changes