@startupjs-ui/breadcrumbs 0.3.5 → 0.3.6

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.3.6](https://github.com/startupjs/startupjs-ui/compare/v0.3.5...v0.3.6) (2026-06-19)
+
+**Note:** Version bump only for package @startupjs-ui/breadcrumbs
+
+
+
+
+
 ## [0.3.5](https://github.com/startupjs/startupjs-ui/compare/v0.3.4...v0.3.5) (2026-06-19)
 
 **Note:** Version bump only for package @startupjs-ui/breadcrumbs

package/index.cssx.styl

@@ -1,3 +1,13 @@
+// ----- CONFIG: $UI.Breadcrumbs
+
+$this = merge({
+  currentColor: 'text-secondary',
+  linkColor: 'text-description',
+  separatorColor: 'text-description'
+}, $UI.Breadcrumbs, true)
+
+// ----- COMPONENT
+
 _iconMargin = 0.5u
 
 .iconWrapper
@@ -51,3 +61,8 @@ _iconMargin = 0.5u
 
   &.xxl
     font(h4)
+
+// ----- JS EXPORTS
+
+:export
+  config: $this

package/index.d.ts

@@ -3,7 +3,6 @@
 
 import React, { type ReactNode } from 'react';
 import { type StyleProp, type ViewStyle } from 'react-native';
-import './index.cssx.styl';
 type BreadcrumbsSize = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';
 declare const _default: React.ComponentType<BreadcrumbsProps>;
 export default _default;

package/index.tsx

@@ -6,7 +6,15 @@ import Div from '@startupjs-ui/div'
 import Icon from '@startupjs-ui/icon'
 import Link from '@startupjs-ui/link'
 import Span from '@startupjs-ui/span'
-import './index.cssx.styl'
+import STYLES from './index.cssx.styl'
+
+const {
+  config: {
+    currentColor,
+    linkColor,
+    separatorColor
+  }
+} = STYLES
 
 type BreadcrumbsSize = 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'
 
@@ -57,6 +65,10 @@ function Breadcrumbs ({
     )
   }
   const getColor = useColors()
+  const resolveColor = (color: string): string => getColor(color) || color
+  const resolvedCurrentColor = resolveColor(currentColor)
+  const resolvedLinkColor = resolveColor(linkColor)
+  const resolvedSeparatorColor = resolveColor(separatorColor)
 
   function renderItem ({
     icon,
@@ -90,16 +102,16 @@ function Breadcrumbs ({
         - const isLastRoute = index === routes.length - 1
         React.Fragment(key=index)
           if isLastRoute
-            = renderItem({ icon, color: getColor('text-secondary'), bold: true, children: name })
+            = renderItem({ icon, color: resolvedCurrentColor, bold: true, children: name })
           else
             Div.item(row)
               Link(
                 replace=replace
                 to=to
               )
-                = renderItem({ icon, color: getColor('text-description'), children: name })
+                = renderItem({ icon, color: resolvedLinkColor, children: name })
               if typeof separator === 'string'
-                Span.separator(styleName=[size])
+                Span.separator(style={ color: resolvedSeparatorColor } styleName=[size])
                   | &nbsp#{separator}&nbsp
               else
                 = separator

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startupjs-ui/breadcrumbs",
-  "version": "0.3.5",
+  "version": "0.3.6",
   "publishConfig": {
     "access": "public"
   },
@@ -11,7 +11,7 @@
     "@startupjs-ui/core": "^0.3.0",
     "@startupjs-ui/div": "^0.3.4",
     "@startupjs-ui/icon": "^0.3.5",
-    "@startupjs-ui/link": "^0.3.5",
+    "@startupjs-ui/link": "^0.3.6",
     "@startupjs-ui/span": "^0.3.4"
   },
   "peerDependencies": {
@@ -19,5 +19,5 @@
     "react-native": "*",
     "startupjs": "*"
   },
-  "gitHead": "8fc799070c16fb24de4ad0dbd6054108fe342d7c"
+  "gitHead": "97eb49aeff8423d10ff280e2a809e352961bc0f2"
 }