twbs / twbs/bootstrap

Utilities map configuration functions

Open
#35,945 3 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

feature utility API v5
Dominant language
MDX
Stars
175k
Forks
78.6k
Avg merge
7h 19m
Merged PRs (30d)
35

Description

Prerequisites
Proposal

It'd be great if Bootstrap was providing functions or mixins to manipulate that utilities hash a bit more easily. I'm thinking something like:

  • utilities-add-values($utility-name, $values) for adding values to a specific utility
  • utilities-set-values($utility-name, $values) for replacing the values of a utility completely
  • utilities-remove-values($utility-name, $values) for removing targeted values of a utility
  • utilities-set-options($utility-name, $options) to set specific options like responsive
  • utilities-add($new-utility-name, $options) to add a new utility class
  • utilities-remove($utility-name) to completely remove a utility

I'm thinking mixins would provide the best API from a usage point of view, similarly to what sass-mq does for adding breakpoints. allowing to only do:

@include utilities-add-values(...)

instead of having to assign the result of the function each time:

$utilities: utilities-add-values(...)
Motivation and context

The API for manipulating the $utilities map is well documented, but it relies on the low level map-merge. This makes it a bit of a mouthful to write the operations, especially for adding new values to existing utilities.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the documented $utilities API in the Bootstrap utilities documentation and compare its low-level map-merge usage with the proposed operations. Review the existing Sass utilities configuration and determine how mixins or functions should add, replace, remove, and update utility options. Done means the supported operations are exposed through a clear API and documented with usage examples.

Written by the indexing model from the issue text.

Assessment

Tech stack
scss
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.