@khanacademy/wonder-blocks-breadcrumbs 3.2.20 → 3.2.21

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @khanacademy/wonder-blocks-breadcrumbs
 
+## 3.2.21
+
+### Patch Changes
+
+- 167298c: BreadcrumbItem: Use semantic color for separator icon fill to support syl-dark
+- Updated dependencies [0907f64]
+- Updated dependencies [9773405]
+- Updated dependencies [9773405]
+- Updated dependencies [022e775]
+- Updated dependencies [e181c15]
+- Updated dependencies [c033245]
+- Updated dependencies [a2bbc0a]
+    - @khanacademy/wonder-blocks-tokens@16.7.0
+
 ## 3.2.20
 
 ### Patch Changes

package/dist/es/index.js

@@ -2,10 +2,10 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import { StyleSheet } from 'aphrodite';
 import { addStyle } from '@khanacademy/wonder-blocks-core';
-import { sizing, font } from '@khanacademy/wonder-blocks-tokens';
+import { sizing, font, semanticColor } from '@khanacademy/wonder-blocks-tokens';
 
 const StyledOl=addStyle("ol");const Breadcrumbs=React.forwardRef(function Breadcrumbs(props,ref){const{"aria-label":ariaLabel="Breadcrumbs",children,testId,...otherProps}=props;const lastChildIndex=React.Children.count(children)-1;return jsx("nav",{...otherProps,"aria-label":ariaLabel,"data-testid":testId,ref:ref,children:jsx(StyledOl,{style:styles$1.container,children:React.Children.map(children,(item,index)=>{const isLastChild=index===lastChildIndex;return React.cloneElement(item,{...item.props,showSeparator:!isLastChild,["aria-current"]:isLastChild?"page":undefined})})})})});const styles$1=StyleSheet.create({container:{display:"flex",listStyle:"none",margin:0,padding:0,overflow:"hidden"}});
 
-const StyledLi=addStyle("li");const StyledSvg=addStyle("svg");const BreadcrumbsItem=React.forwardRef(function BreadcrumbsItem(props,ref){const{children,showSeparator,testId,...otherProps}=props;const _renderSeparator=()=>{return jsx(StyledSvg,{style:styles.separator,width:16,height:16,viewBox:"0 0 16 16","aria-hidden":true,children:jsx("circle",{cx:"8",cy:"9",r:"1.5"})})};return jsxs(StyledLi,{...otherProps,style:styles.item,"data-testid":testId,ref:ref,children:[children,showSeparator&&_renderSeparator()]})});const styles=StyleSheet.create({item:{display:"flex",alignItems:"center",justifyContent:"center",marginInlineEnd:sizing.size_040,lineHeight:"inherit",fontFamily:font.family.sans},separator:{marginInlineStart:sizing.size_040}});
+const StyledLi=addStyle("li");const StyledSvg=addStyle("svg");const BreadcrumbsItem=React.forwardRef(function BreadcrumbsItem(props,ref){const{children,showSeparator,testId,...otherProps}=props;const _renderSeparator=()=>{return jsx(StyledSvg,{style:styles.separator,width:16,height:16,viewBox:"0 0 16 16","aria-hidden":true,children:jsx("circle",{cx:"8",cy:"9",r:"1.5"})})};return jsxs(StyledLi,{...otherProps,style:styles.item,"data-testid":testId,ref:ref,children:[children,showSeparator&&_renderSeparator()]})});const styles=StyleSheet.create({item:{display:"flex",alignItems:"center",justifyContent:"center",marginInlineEnd:sizing.size_040,lineHeight:"inherit",fontFamily:font.family.sans},separator:{marginInlineStart:sizing.size_040,fill:semanticColor.core.foreground.neutral.default}});
 
 export { Breadcrumbs, BreadcrumbsItem };

package/dist/index.js

@@ -30,7 +30,7 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 const StyledOl=wonderBlocksCore.addStyle("ol");const Breadcrumbs=React__namespace.forwardRef(function Breadcrumbs(props,ref){const{"aria-label":ariaLabel="Breadcrumbs",children,testId,...otherProps}=props;const lastChildIndex=React__namespace.Children.count(children)-1;return jsxRuntime.jsx("nav",{...otherProps,"aria-label":ariaLabel,"data-testid":testId,ref:ref,children:jsxRuntime.jsx(StyledOl,{style:styles$1.container,children:React__namespace.Children.map(children,(item,index)=>{const isLastChild=index===lastChildIndex;return React__namespace.cloneElement(item,{...item.props,showSeparator:!isLastChild,["aria-current"]:isLastChild?"page":undefined})})})})});const styles$1=aphrodite.StyleSheet.create({container:{display:"flex",listStyle:"none",margin:0,padding:0,overflow:"hidden"}});
 
-const StyledLi=wonderBlocksCore.addStyle("li");const StyledSvg=wonderBlocksCore.addStyle("svg");const BreadcrumbsItem=React__namespace.forwardRef(function BreadcrumbsItem(props,ref){const{children,showSeparator,testId,...otherProps}=props;const _renderSeparator=()=>{return jsxRuntime.jsx(StyledSvg,{style:styles.separator,width:16,height:16,viewBox:"0 0 16 16","aria-hidden":true,children:jsxRuntime.jsx("circle",{cx:"8",cy:"9",r:"1.5"})})};return jsxRuntime.jsxs(StyledLi,{...otherProps,style:styles.item,"data-testid":testId,ref:ref,children:[children,showSeparator&&_renderSeparator()]})});const styles=aphrodite.StyleSheet.create({item:{display:"flex",alignItems:"center",justifyContent:"center",marginInlineEnd:wonderBlocksTokens.sizing.size_040,lineHeight:"inherit",fontFamily:wonderBlocksTokens.font.family.sans},separator:{marginInlineStart:wonderBlocksTokens.sizing.size_040}});
+const StyledLi=wonderBlocksCore.addStyle("li");const StyledSvg=wonderBlocksCore.addStyle("svg");const BreadcrumbsItem=React__namespace.forwardRef(function BreadcrumbsItem(props,ref){const{children,showSeparator,testId,...otherProps}=props;const _renderSeparator=()=>{return jsxRuntime.jsx(StyledSvg,{style:styles.separator,width:16,height:16,viewBox:"0 0 16 16","aria-hidden":true,children:jsxRuntime.jsx("circle",{cx:"8",cy:"9",r:"1.5"})})};return jsxRuntime.jsxs(StyledLi,{...otherProps,style:styles.item,"data-testid":testId,ref:ref,children:[children,showSeparator&&_renderSeparator()]})});const styles=aphrodite.StyleSheet.create({item:{display:"flex",alignItems:"center",justifyContent:"center",marginInlineEnd:wonderBlocksTokens.sizing.size_040,lineHeight:"inherit",fontFamily:wonderBlocksTokens.font.family.sans},separator:{marginInlineStart:wonderBlocksTokens.sizing.size_040,fill:wonderBlocksTokens.semanticColor.core.foreground.neutral.default}});
 
 exports.Breadcrumbs = Breadcrumbs;
 exports.BreadcrumbsItem = BreadcrumbsItem;

package/package.json

@@ -3,7 +3,7 @@
   "description": "",
   "author": "Khan Academy",
   "license": "MIT",
-  "version": "3.2.20",
+  "version": "3.2.21",
   "publishConfig": {
     "access": "public"
   },
@@ -21,7 +21,7 @@
   "types": "dist/index.d.ts",
   "dependencies": {
     "@khanacademy/wonder-blocks-core": "12.4.4",
-    "@khanacademy/wonder-blocks-tokens": "16.6.0"
+    "@khanacademy/wonder-blocks-tokens": "16.7.0"
   },
   "peerDependencies": {
     "aphrodite": "^1.2.5",