@dhasdk/simple-ui 1.0.53 → 1.0.54

package/README.md

@@ -53,6 +53,8 @@ Tooltip
 
 ## Changelog
 
+1.0.54 - added **`showMarkers`** and **`clasNameMarkerFalse`** to the **ProgressBar** component
+
 1.0.53 - added **`data-testid`** prop(s) to  **Accordion**, **AppointmentPicker**, **Badge**, **Breadcrumbs**, **ButtonGroup**, **Card**, **CharacterCounter**, **CheckBox** and **CheckBoxGroup**, **DatePicker**, **ExpandableText**, **Input**, **List**, **Modal**, **ProgressBar**, **RadioGroup**, **Search**, **SectionHeader**, **Select**, **Shield**, **SideBarNav**, **skeleton**, **slider**, **status**, **tabs**, **toggle**, **tooltip**. See docs for uses per component.
 
 1.0.51/52 - **`Search`** added iconLinkHandler prop + updates to documentation, **`ExpandableText`** added a **`clickHandler`** prop
@@ -1300,9 +1302,11 @@ Full list of props below
 | isStep  | **`boolean`**  | Yes  | **`true`**  | Controls whether steps inside the circle are displayed as numbers, or if false, displayed as checkmarks/dashes.  |
 | classNameArrowColor  | **`string`**  | Yes  | **`fill-[#305B25]`**  | Controls the color of the arrow that points from last completed step to current step.  |
 | classNameBorderColor  | **`string`**  | Yes  | **`border-[#305B25]`**  | Controls the color of the border around each completed step's circle.  |
-| classNameFillColor | **`string`**  | Yes  | **`bg-green-500`**  | Controls the fill color of each completed step's circle.  |
+| classNameFillColor | **`string`**  | Yes  | **`bg-green-500`**, see notes for **showMarkers** below  | Controls the fill color of each completed step's circle.  |
 | classNameGradient  | **`string`**  | Yes  | **`from-[#305B25] to-[#5AAB46]`**  | Controls the colors used in the gradient for the bars between each completed step.  |
+| classNameMarkerFalse  | **`string`**  | Yes  | **`-z-10 -mx-[0.1em] w-full h-2 bg-gray-300 rounded-full`**  | The classNames applied to the base div that provides the background (shape and color) to the progress bar.  |
 | dataTestId | string | Yes | undefined | A **'data-testid'** value that is applied to the div element that wraps ProgressBar for testing purposes |
+| showMarkers | boolean | Yes | true | Sets whether progress markers or checkboxes are displayed. If set to false, a single long bar w/o individual steps is presented, with the progress indicated by a 2nd bar overlaying the 1st. The overlaying progress bar styling can be changed via the **`classNameFillColor`** prop. Default values for **classNameFillColor** in this use case are **`z-0 -mx-[0.1em] h-2 bg-blue-300 rounded-full`** |
 
 1. Base CSS Classes