Skip to content

Components bypass dictionary/icons.ts, so one semantic role renders two different glyphs #380

Description

@IgorShevchik

Found while reviewing #378 (icon-map rebuild). Not a regression — it has been like this — but it is a visual inconsistency in shipped components, and it invalidates an assumption the porting docs were about to encode.

What

src/runtime/dictionary/icons.ts is presented as the authority for "which b24-icon plays which semantic role". Half of the library does not read it.

$ unique `@bitrix24/b24icons-vue/…` paths under src/ : 98
$ …of those, imported by dictionary/icons.ts        : 49
$ …hardcoded in components instead                  : 49

Where that produces a genuine contradiction:

role dictionary/icons.ts says what actually renders
check outline/CheckLIcon main/CheckIconsrc/runtime/components/Checkbox.vue:62
minus actions/Minus30Icon actions/Minus20IconCheckbox.vue:61
close outline/CrossMIcon actions/Cross20IconBadge.vue:64
chevronDown outline/ChevronDownLIcon outline/ChevronDownSIconButton.vue:101

So a checkbox tick and a check icon rendered through the dictionary are different glyphs, and the same for the minus in an indeterminate checkbox, the close cross in a Badge, and the chevron in a Button with a dropdown.

Why it matters

  1. Visual inconsistency — two glyphs for one meaning, in one design system.
  2. The dictionary's authority is fictional where it is bypassed. Anything that reasons from it — including appConfig.b24ui.icons.* overrides, if a consumer sets one — silently does not apply to these components.
  3. It nearly went into .sync/PORTING.md as a rule. chore(sync): derive icon-map.json from the shared icon keys, and guard it #378 originally said these hardcoded values are "glyphs the library does not render for those roles"; that was wrong, and the wording is being corrected there. The underlying inconsistency is what remains.

Not obviously a bug — needs a decision

Some of these may be deliberate: Cross20Icon / Minus20Icon / ChevronDownSIcon are the small variants, and a badge's close cross or a button's chevron plausibly wants a smaller glyph than a standalone icon does. If so the dictionary is simply not the right authority for size-sensitive slots, and that should be written down rather than left as an apparent contradiction.

The two readings lead to different work:

  • They are bugs → route these components through the dictionary and accept the visual change.
  • They are deliberate → document that dictionary roles are size-agnostic defaults, and that components may pick a sized variant; then say where that is allowed, so the next audit does not re-raise this.

Either way there is a third option worth considering: give the dictionary sized variants (checkS/checkL) so a component can pick a size without leaving the dictionary.

Scope

Deliberately out of scope for #378, which touches no src/ code — this needs a design call and changes what users see.

Full list of the 49 off-dictionary paths is reproducible with:

rg -o "'@bitrix24/b24icons-vue/[^']+'" -N src --no-filename | sort -u

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions